:root {
  --lib-color-surface: #f8fafc;
  --lib-color-panel: #ffffff;
  --lib-color-panel-soft: #eef6ff;
  --lib-color-ink: #0f172a;
  --lib-color-muted: #475569;
  --lib-color-subtle: #64748b;
  --lib-color-inverse: #ffffff;
  --lib-color-primary: #0b63ce;
  --lib-color-primary-strong: #073b82;
  --lib-color-accent: #00a6c8;
  --lib-color-border: #d8e2ef;
  --lib-color-surface-card: #ffffff;
  --lib-color-surface-card-dark: color-mix(in srgb, #0a192f 92%, transparent);
  --lib-color-border-panel: color-mix(in srgb, #0a192f 22%, transparent);
  --lib-color-border-inverse-soft: rgba(255, 255, 255, 0.15);
  --lib-color-border-inverse-strong: rgba(255, 255, 255, 0.22);
  --lib-color-border-card: color-mix(in srgb, #0a192f 16%, transparent);
  --lib-color-border-card-hover: color-mix(in srgb, #0a192f 28%, transparent);
  --lib-color-surface-glass-border: rgba(255, 255, 255, 0.15);
  --lib-color-blog-card-panel: color-mix(in srgb, color-mix(in srgb, #0a192f 55%, transparent) 78%, rgba(10, 25, 47, 0.28));
  --lib-color-blog-card-overlay-top: rgba(10, 25, 47, 0.04);
  --lib-color-blog-card-overlay-mid: rgba(10, 25, 47, 0.18);
  --lib-color-blog-card-overlay-bottom: rgba(10, 25, 47, 0.6);
  --lib-color-blog-card-backdrop-tint: rgba(10, 25, 47, 0.28);
  --lib-color-star: #facc15;
  --lib-color-star-stroke: color-mix(in srgb, #facc15 72%, #b45309);
  --lib-color-brand-facebook: #1877f2;
  --lib-color-brand-google: #ea4335;
  --lib-color-brand-instagram: #e1306c;
  --lib-color-brand-youtube: #ff0000;
  --lib-color-brand-maps: #4285f4;
  --lib-color-brand-tiktok: #111827;
  --lib-color-brand-linkedin: #0a66c2;
  --lib-color-brand-x: #000000;
  --lib-color-brand-yelp: #ff1a1a;
  --lib-color-brand-pinterest: #e60023;
  --lib-size-social-icon-link: 2.75rem;
  --lib-size-social-icon: 1.25rem;
  --lib-color-deep: #0f172a;
  --lib-color-deep-accent: #123c70;
  --lib-color-deep-muted: #334155;
  --lib-color-success: #0f766e;
  --lib-color-error: #dc2626;
  --lib-color-hero-overlay-start: rgba(15, 23, 42, 0.92);
  --lib-color-hero-overlay-end: rgba(7, 59, 130, 0.78);
  --lib-font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --lib-font-heading: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --lib-space-0: 0rem;
  --lib-space-1: 0.25rem;
  --lib-space-2: 0.5rem;
  --lib-space-3: 0.75rem;
  --lib-space-4: 1rem;
  --lib-space-5: 1.25rem;
  --lib-space-6: 1.5rem;
  --lib-space-8: 2rem;
  --lib-space-10: 2.5rem;
  --lib-gutter: clamp(1rem, 3vw, 1.5rem);
  --lib-container-wide: min(112.5rem, 94vw);
  --lib-container-standard: min(90rem, calc(100% - (var(--lib-gutter) * 2)));
  --lib-container-xl: min(120rem, calc(100% - (var(--lib-gutter) * 2)));
  --lib-space-container-x: clamp(1rem, 4vw, 1.5rem);
  --lib-space-container-x-lg: clamp(1.5rem, 3vw, 2.5rem);
  --lib-content-measure: 65ch;
  --lib-space-section-y: clamp(3rem, 5vw, 5rem);
  --lib-space-section-y-lg: 5rem;
  --lib-space-grid-gap: 1.5rem;
  --lib-space-grid-gap-lg: 2rem;
  --lib-space-hairline: 0.0625rem;
  --lib-space-fine-1: 0.375rem;
  --lib-space-fine-2: 0.625rem;
  --lib-size-control-lg: 3rem;
  --lib-size-control-sm: 2.125rem;
  --lib-size-header-search-input: 15rem;
  --lib-size-header-search-input-mobile: 7.5rem;
  --lib-space-control-gap: var(--lib-space-2);
  --lib-space-control-padding-x: 0.875rem;
  --lib-space-control-padding-x-sm: var(--lib-space-fine-2);
  --lib-space-control-padding-y-sm: var(--lib-space-fine-1);
  --lib-font-size-micro: 0.75rem;
  --lib-font-size-caption: 0.78rem;
  --lib-font-size-small: 0.875rem;
  --lib-font-size-body-sm: 0.9375rem;
  --lib-font-size-base: 1rem;
  --lib-font-size-body-lg: 1.0625rem;
  --lib-font-size-lead: 1.125rem;
  --lib-font-size-subheading: 1.25rem;
  --lib-font-size-title-sm: 1.375rem;
  --lib-font-size-title-md: 2rem;
  --lib-font-size-title-lg: 2.25rem;
  --lib-font-size-stat-metric: clamp(2.75rem, 6vw, 3.75rem);
  --lib-font-size-stat-suffix: 0.52em;
  --lib-font-size-card-blog-title: 1.5rem;
  --lib-leading-card-blog-title: 1.25;
  --lib-font-scale-icon: 0.6em;
  --lib-font-scale-compact: 0.75em;
  --lib-font-scale-emphasis: 1.1em;
  --lib-radius-sm: 0.5rem;
  --lib-radius-md: 0.75rem;
  --lib-radius-lg: 1rem;
  --lib-radius-xl: 1.5rem;
  --lib-radius-pill: 999rem;
  /*
   * Organic/blob shapes - real premium-site reference (2026-08-11, owner-
   * supplied screenshots: a spa site, a logistics site, an ecommerce site,
   * all using soft asymmetric container silhouettes instead of plain
   * rectangles or hard geometric cuts). Three distinct presets so
   * multiple organic elements on one page/section don't read as an
   * obviously copy-pasted identical shape.
   */
  --lib-shape-organic-1: 63% 37% 54% 46% / 43% 39% 61% 57%;
  --lib-shape-organic-2: 42% 58% 68% 32% / 55% 43% 57% 45%;
  --lib-shape-organic-3: 58% 42% 39% 61% / 47% 62% 38% 53%;
  --lib-radius-organic-soft: 1.25rem 2.5rem 1.25rem 2.5rem;
  --lib-shadow-card: 0 1rem 2.625rem rgba(15, 23, 42, 0.1);
  --lib-shadow-card-hover: 0 1.375rem 3.625rem rgba(15, 23, 42, 0.16);
  --lib-shadow-button: 0 0.75rem 1.75rem rgba(11, 99, 206, 0.24);
  --lib-shadow-card-soft: 0 0.75rem 1.875rem rgba(15, 23, 42, 0.08);
  --lib-shadow-panel-soft: 0 0.625rem 1.5rem rgba(15, 23, 42, 0.08);
  --lib-shadow-featured: drop-shadow(0 0.25rem 0.625rem rgba(15, 23, 42, 0.18));
  --lib-shadow-star: 0 1px 6px color-mix(in srgb, #facc15 12%, transparent);
  --lib-shadow-card-active: 0 20px 48px rgba(15, 23, 42, 0.14);
  --lib-shadow-card-stat: 0 18px 44px rgba(15, 23, 42, 0.1);
  --lib-shadow-card-stat-hover: 0 22px 52px rgba(15, 23, 42, 0.14);
  --lib-shadow-header-dropdown: 0 18px 40px rgba(0, 0, 0, 0.35);
  --lib-shadow-header-mobile: 0 18px 40px rgba(15, 23, 42, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.12);
  --lib-shadow-dark-md: 0 10px 20px -5px rgba(0, 0, 0, 0.35);
  --lib-shadow-footer-icon: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 8px 18px color-mix(in srgb, var(--lib-color-primary) 18%, transparent);
  --lib-shadow-footer-icon-desktop: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 10px 22px color-mix(in srgb, var(--lib-color-primary) 24%, transparent);
  --lib-shadow-footer-icon-mail: 0 8px 18px rgba(234, 67, 53, 0.22);
  --lib-shadow-footer-icon-map: 0 8px 18px rgba(66, 133, 244, 0.22);
  --lib-shadow-card-blog-panel: 0 18px 40px rgba(10, 25, 47, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  --lib-shadow-card-blog: 0 10px 22px rgba(15, 23, 42, 0.08);
  --lib-shadow-card-blog-hover: 0 14px 28px rgba(15, 23, 42, 0.12);
  --lib-size-star-stroke: 0.9px;
  --lib-size-rating-star: 1rem;
  --lib-size-rating-star-lg: 1.5rem;
  --lib-size-testimonial-avatar: 5rem;
  --lib-size-testimonial-avatar-mobile: 3.5rem;
  --lib-size-testimonial-accent-min: 4.5rem;
  --lib-size-testimonial-accent-max: 6rem;
  --lib-size-testimonial-accent-stroke: 0.25rem;
  --lib-size-testimonial-quote-collapsed: 7rem;
  --lib-size-testimonial-quote-fade: 2.5rem;
  --lib-size-testimonial-expand-icon: 0.875rem;
  --lib-size-card-blog-min-height: 25rem;
  --lib-size-card-blog-min-height-mobile: 18rem;
  --lib-size-card-blog-panel-max-width: 88%;
  --lib-size-card-blog-panel-blur: 14px;
  --lib-size-card-blog-media-backdrop-blur: 20px;
  --lib-size-card-blog-media-backdrop-scale: 1.12;
  --lib-size-header-call-icon: 1.75rem;
  --lib-size-header-call-icon-sm: 1.5rem;
  --lib-size-contact-form-field-icon: 1.25rem;
  --lib-measure-heading: 44ch;
  --lib-motion-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --lib-motion-ease-emphasis: cubic-bezier(0.22, 1, 0.36, 1);
  --lib-motion-ease-linear: linear;
  --lib-motion-duration-micro: 180ms;
  --lib-motion-duration-entry: 520ms;
  --lib-motion-duration-narrative: 760ms;
  --lib-motion-duration-continuous-cycle: 18s;
  --lib-motion-duration-reduced: 0.01ms;
  --lib-motion-distance-sm: 0.5rem;
  --lib-motion-distance-md: 1rem;
  --lib-motion-distance-lg: 1.5rem;
  --lib-motion-scale-enter: 0.985;
  --lib-motion-scale-focus: 1.025;
  --lib-motion-stagger-step: 90ms;
  --lib-motion-delay-1: 90ms;
  --lib-motion-delay-2: 180ms;
  --lib-motion-delay-3: 270ms;
  --lib-motion-delay-4: 360ms;
  --lib-transition-base: var(--lib-motion-duration-micro) var(--lib-motion-ease-standard);
  --lib-transition-reveal: var(--lib-motion-duration-entry) var(--lib-motion-ease-emphasis);
  --lib-transition-reduced: var(--lib-motion-duration-reduced);
  --lib-delay-1: var(--lib-motion-delay-1);
  --lib-delay-2: var(--lib-motion-delay-2);
  --lib-delay-3: var(--lib-motion-delay-3);
  --lib-delay-4: var(--lib-motion-delay-4);
  --lib-duration-marquee: var(--lib-motion-duration-continuous-cycle);
  --lib-gradient-primary: linear-gradient(135deg, var(--lib-color-primary), var(--lib-color-primary-strong));
  --lib-gradient-accent: linear-gradient(135deg, var(--lib-color-primary), var(--lib-color-accent));
  --lib-gradient-deep: linear-gradient(135deg, var(--lib-color-deep), var(--lib-color-deep-accent));
  --lib-gradient-success: linear-gradient(135deg, var(--lib-color-deep-muted), var(--lib-color-success));
  --lib-gradient-hero-overlay: linear-gradient(135deg, var(--lib-color-hero-overlay-start), var(--lib-color-hero-overlay-end));
  --lib-gradient-hero-media-scrim: linear-gradient(
    180deg,
    color-mix(in srgb, var(--lib-color-deep) 90%, transparent) 0%,
    color-mix(in srgb, var(--lib-color-deep) 68%, transparent) 45%,
    color-mix(in srgb, var(--lib-color-deep) 75%, transparent) 100%
  );
  --lib-gradient-service-hero: linear-gradient(135deg, var(--lib-color-deep), var(--lib-color-primary-strong));
  --lib-gradient-post-media: linear-gradient(135deg, color-mix(in srgb, var(--lib-color-primary) 82%, black), var(--lib-color-accent));
  --lib-gradient-preview-menu: linear-gradient(
    180deg,
    color-mix(in srgb, var(--lib-color-deep) 72%, transparent) 0%,
    color-mix(in srgb, var(--lib-color-deep) 88%, transparent) 100%
  );

  /* Section-treatment patterns (PAT-006–PAT-015): decorative dividers and
     background treatments for breaking up runs of flat, same-surface
     sections without a solid color-block change. */
  --lib-treatment-wave-height: 4.5rem;
  --lib-treatment-diagonal-height: 5rem;
  --lib-treatment-diagonal-angle: 40%;
  --lib-treatment-glow-size-lg: 24rem;
  --lib-treatment-glow-size-sm: 18rem;
  --lib-treatment-glow-blur: 60px;
  --lib-treatment-glow-opacity: 0.5;
  --lib-treatment-node-size-sm: 8px;
  --lib-treatment-node-size-lg: 12px;
  --lib-treatment-node-field-opacity: 0.6;
  --lib-treatment-ghost-number-size: 22rem;
  --lib-treatment-ghost-number-stroke: 1.5px;
  --lib-treatment-frame-inset: 1rem;
  --lib-treatment-frame-mark-size: 1.5rem;
  --lib-treatment-frame-mark-thickness: 2px;
  --lib-treatment-aurora-blur: 30px;
  --lib-treatment-aurora-cycle: 16s;
  --lib-treatment-glass-blur: 18px;
  --lib-treatment-glass-radius: 1.25rem;
  --lib-treatment-glass-overlap: 3rem;
  --lib-treatment-holo-thickness: 3px;
  --lib-treatment-holo-cycle: 6s;
  --lib-treatment-bento-radius: 1rem;
}
