/* ============================================================
   GENERATED — do not edit by hand.
   Source: studio-system/tokens/schema.json  (names)  +  brand: brand-tokens  (values)
   Regenerate: python3 studio-system/tokens/build_tokens.py --brand <dir> --out <this file>

   Fluid system: two segments, bent at 1512px. DO NOT collapse to one clamp.
     floor 1200  ·  nominal 1512  ·  ceiling 2400
     space 80% → 100% → 120%
     type  86% → 100% → 112%
   ============================================================ */
:root {
  --color-bg-primary: #ffffff;
  --color-bg-secondary: #f6f6f6;
  --color-bg-tint: #f6f6f6;
  --color-surface-primary: #ffffff;
  --color-surface-secondary: #fafafa;
  --color-surface-10: #ebebeb;
  --color-surface-hover: #f0f0f0;
  --color-surface-disabled: #e4e4e4;
  --color-surface-inverse: #1a1a1a;
  --color-surface-inverse-hover: #1a1a1a;
  --color-text-primary: #1a1a1a;
  --color-text-primary-hover: #4a4a4a;
  --color-text-secondary: #707070;
  --color-text-disabled: #a3a3a3;
  --color-text-inverse: #ffffff;
  --color-text-banner: #1a1a1a;
  --color-text-error: #b3261e;
  --color-stroke-primary: #1a1a1a;
  --color-stroke-divider: #dddddd;
  --color-stroke-secondary: #dddddd;
  --color-stroke-error: #b42318;
  --color-stroke-grid: #dddddd;
  --color-accent: #1a1a1a;
  --color-overlay-light: #1a1a1a80;
  --color-overlay-dark: #000000b3;
  --color-drawer: #fffffff0;
  --color-header-solid: #fffffff5;
  --color-status-success: #1f7a4d;
  --color-status-warning: #b26b00;
  --color-status-error: #b42318;
  --color-status-bg-success: #e8f5e9;
  --color-status-bg-warning: #fff4db;
  --color-status-bg-error: #fce8ec;
  --color-status-prefill: #f6f6f6;
  --color-status-message: #fafafa;
  --color-gradient-0: #1a1a1a00;
  --color-gradient-20: #1a1a1a33;
  --color-gradient-25: #1a1a1a40;
  --space-0: 0px;
  --space-2: clamp(1.6px, calc(2px + (100vw - 1512px) * 0.001282), 2px);
  --space-4: clamp(3.2px, calc(4px + (100vw - 1512px) * 0.002564), 4px);
  --space-6: clamp(4.8px, calc(6px + (100vw - 1512px) * 0.003846), 6px);
  --space-8: clamp(6.4px, calc(8px + (100vw - 1512px) * 0.005128), 8px);
  --space-10: clamp(8px, calc(10px + (100vw - 1512px) * 0.00641), 10px);
  --space-12: clamp(9.6px, calc(12px + (100vw - 1512px) * 0.007692), 12px);
  --space-16: clamp(12.8px, calc(16px + (100vw - 1512px) * 0.010256), 16px);
  --space-20: clamp(16px, calc(20px + (100vw - 1512px) * 0.012821), 20px);
  --space-24: clamp(19.2px, calc(24px + (100vw - 1512px) * 0.015385), 24px);
  --space-32: clamp(25.6px, calc(32px + (100vw - 1512px) * 0.020513), 32px);
  --space-40: clamp(32px, calc(40px + (100vw - 1512px) * 0.025641), 40px);
  --space-48: clamp(38.4px, calc(48px + (100vw - 1512px) * 0.030769), 48px);
  --space-64: clamp(51.2px, calc(64px + (100vw - 1512px) * 0.041026), 64px);
  --space-72: clamp(57.6px, calc(72px + (100vw - 1512px) * 0.046154), 72px);
  --space-80: clamp(64px, calc(80px + (100vw - 1512px) * 0.051282), 80px);
  --space-96: clamp(76.8px, calc(96px + (100vw - 1512px) * 0.061538), 96px);
  --space-128: clamp(102.4px, calc(128px + (100vw - 1512px) * 0.082051), 128px);
  --space-160: clamp(128px, calc(160px + (100vw - 1512px) * 0.102564), 160px);
  --space-192: clamp(153.6px, calc(192px + (100vw - 1512px) * 0.123077), 192px);
  --space-256: clamp(204.8px, calc(256px + (100vw - 1512px) * 0.164103), 256px);
  --space-512: clamp(409.6px, calc(512px + (100vw - 1512px) * 0.328205), 512px);
  --type-family-primary: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --type-family-ui: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --type-weight-regular: 400;
  --type-weight-medium: 500;
  --type-weight-bold: 700;
  --type-size-xxs: clamp(8.6px, calc(10px + (100vw - 1512px) * 0.004487), 10px);
  --type-size-xs: clamp(10.32px, calc(12px + (100vw - 1512px) * 0.005385), 12px);
  --type-size-sm: clamp(12.04px, calc(14px + (100vw - 1512px) * 0.006282), 14px);
  --type-size-md: clamp(13.76px, calc(16px + (100vw - 1512px) * 0.007179), 16px);
  --type-size-lg: clamp(15.48px, calc(18px + (100vw - 1512px) * 0.008077), 18px);
  --type-size-xl: clamp(17.2px, calc(20px + (100vw - 1512px) * 0.008974), 20px);
  --type-size-2xl: clamp(20.64px, calc(24px + (100vw - 1512px) * 0.010769), 24px);
  --type-size-3xl: clamp(27.52px, calc(32px + (100vw - 1512px) * 0.014359), 32px);
  --type-size-40: clamp(34.4px, calc(40px + (100vw - 1512px) * 0.017949), 40px);
  --type-size-4xl: clamp(41.28px, calc(48px + (100vw - 1512px) * 0.021538), 48px);
  --type-size-5xl: clamp(55.04px, calc(64px + (100vw - 1512px) * 0.028718), 64px);
  --type-leading-14: clamp(12.04px, calc(14px + (100vw - 1512px) * 0.006282), 14px);
  --type-leading-16: clamp(13.76px, calc(16px + (100vw - 1512px) * 0.007179), 16px);
  --type-leading-18: clamp(15.48px, calc(18px + (100vw - 1512px) * 0.008077), 18px);
  --type-leading-20: clamp(17.2px, calc(20px + (100vw - 1512px) * 0.008974), 20px);
  --type-leading-22: clamp(18.92px, calc(22px + (100vw - 1512px) * 0.009872), 22px);
  --type-leading-24: clamp(20.64px, calc(24px + (100vw - 1512px) * 0.010769), 24px);
  --type-leading-26: clamp(22.36px, calc(26px + (100vw - 1512px) * 0.011667), 26px);
  --type-leading-32: clamp(27.52px, calc(32px + (100vw - 1512px) * 0.014359), 32px);
  --type-leading-34: clamp(29.24px, calc(34px + (100vw - 1512px) * 0.015256), 34px);
  --type-leading-38: clamp(32.68px, calc(38px + (100vw - 1512px) * 0.017051), 38px);
  --type-leading-48: clamp(41.28px, calc(48px + (100vw - 1512px) * 0.021538), 48px);
  --type-leading-62: clamp(53.32px, calc(62px + (100vw - 1512px) * 0.027821), 62px);
  --type-leading-none: 1;
  --icon-16: clamp(13.76px, calc(16px + (100vw - 1512px) * 0.007179), 16px);
  --icon-20: clamp(17.2px, calc(20px + (100vw - 1512px) * 0.008974), 20px);
  --icon-24: clamp(20.64px, calc(24px + (100vw - 1512px) * 0.010769), 24px);
  --type-tracking-normal: 0;
  --type-tracking-snug: -0.01em;
  --type-tracking-wide: 0.01em;
  --type-tracking-wider: 0.02em;
  --type-tracking-tight: -0.02em;
  --type-descender-guard: 0.3em;
  --radius-none: 0;
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-full: 9999px;
  --stroke-hairline: 1px;
  --stroke-selected: 2px;
  --touch-target: 44px;
  --effect-blur-drawer: 15px;
  --opacity-pulse: 0.4;
  --opacity-hover: 0.65;
  --motion-duration-fast: 120ms;
  --motion-duration-base: 240ms;
  --motion-duration-slow: 400ms;
  --motion-duration-linger: 2000ms;
  --motion-duration-stagger: 40ms;
  --motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --motion-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --motion-easing-enter: cubic-bezier(0, 0, 0, 1);
  --motion-easing-exit: cubic-bezier(0.3, 0, 1, 1);
  --breakpoint-mobile-small: 450px;
  --breakpoint-search-narrow: 950px;
  --breakpoint-tablet: 768px;
  --breakpoint-tablet-wide: 1024px;
  --breakpoint-desktop: 1200px;
  --breakpoint-nominal: 1512px;
  --ratio-1-1: 1 / 1;
  --ratio-4-5: 4 / 5;
  --ratio-3-4: 3 / 4;
  --ratio-5-7: 5 / 7;
  --ratio-2-3: 2 / 3;
  --ratio-9-16: 9 / 16;
  --ratio-4-3: 4 / 3;
  --ratio-3-2: 3 / 2;
  --ratio-16-10: 16 / 10;
  --ratio-16-9: 16 / 9;
  --fence-screen-h: 100svh;
  --fence-screen-max: 100lvh;
  --fence-12col-min: 56.25vw;
  --fence-12col-min-c: 56.25cqw;
  --fence-12col-max: 66.6667vw;
  --fence-12col-max-c: 66.6667cqw;
  --fence-6col-min: 62.5vw;
  --fence-6col-min-c: 125cqw;
  --fence-6col-max: 75vw;
  --fence-6col-max-c: 150cqw;
  --cap-passepartout-12: 70%;
  --cap-passepartout-12-w: 56.25vw;
  --cap-passepartout-6-large: 60%;
  --cap-passepartout-6-small: 52%;
  --layout-page-max: 1600px;
  --header-h: clamp(55.04px, calc(64px + (100vw - 1512px) * 0.028718), 64px);
  --header-h-scrolled: clamp(55.04px, calc(64px + (100vw - 1512px) * 0.028718), 64px);
  --logo-size: clamp(20.64px, calc(24px + (100vw - 1512px) * 0.010769), 24px);
  --logo-size-scrolled: clamp(20.64px, calc(24px + (100vw - 1512px) * 0.010769), 24px);
  --logo-drop: clamp(0px, calc(0px + (100vw - 1512px) * 0), 0px);
  --layout-page-margin: var(--space-24);
  --layout-plp-top: var(--space-128);
  --layout-head-top: var(--space-128);
  --layout-drawer-w: 34vw;
  --layout-drawer-min: 440px;
  --layout-carousel-peek: 80%;
  --layout-quarter: 25vw;
  --layout-third: calc(100vw / 3);
  --layout-drawer-max: 544px;
}

/* High segment: 1512px → 2400px (gentler slope — the kink is intentional) */
@media (min-width: 1512px) {
  :root {
    --space-2: clamp(2px, calc(2px + (100vw - 1512px) * 0.00045), 2.4px);
    --space-4: clamp(4px, calc(4px + (100vw - 1512px) * 0.000901), 4.8px);
    --space-6: clamp(6px, calc(6px + (100vw - 1512px) * 0.001351), 7.2px);
    --space-8: clamp(8px, calc(8px + (100vw - 1512px) * 0.001802), 9.6px);
    --space-10: clamp(10px, calc(10px + (100vw - 1512px) * 0.002252), 12px);
    --space-12: clamp(12px, calc(12px + (100vw - 1512px) * 0.002703), 14.4px);
    --space-16: clamp(16px, calc(16px + (100vw - 1512px) * 0.003604), 19.2px);
    --space-20: clamp(20px, calc(20px + (100vw - 1512px) * 0.004505), 24px);
    --space-24: clamp(24px, calc(24px + (100vw - 1512px) * 0.005405), 28.8px);
    --space-32: clamp(32px, calc(32px + (100vw - 1512px) * 0.007207), 38.4px);
    --space-40: clamp(40px, calc(40px + (100vw - 1512px) * 0.009009), 48px);
    --space-48: clamp(48px, calc(48px + (100vw - 1512px) * 0.010811), 57.6px);
    --space-64: clamp(64px, calc(64px + (100vw - 1512px) * 0.014414), 76.8px);
    --space-72: clamp(72px, calc(72px + (100vw - 1512px) * 0.016216), 86.4px);
    --space-80: clamp(80px, calc(80px + (100vw - 1512px) * 0.018018), 96px);
    --space-96: clamp(96px, calc(96px + (100vw - 1512px) * 0.021622), 115.2px);
    --space-128: clamp(128px, calc(128px + (100vw - 1512px) * 0.028829), 153.6px);
    --space-160: clamp(160px, calc(160px + (100vw - 1512px) * 0.036036), 192px);
    --space-192: clamp(192px, calc(192px + (100vw - 1512px) * 0.043243), 230.4px);
    --space-256: clamp(256px, calc(256px + (100vw - 1512px) * 0.057658), 307.2px);
    --space-512: clamp(512px, calc(512px + (100vw - 1512px) * 0.115315), 614.4px);
    --type-size-xxs: clamp(10px, calc(10px + (100vw - 1512px) * 0.001351), 11.2px);
    --type-size-xs: clamp(12px, calc(12px + (100vw - 1512px) * 0.001622), 13.44px);
    --type-size-sm: clamp(14px, calc(14px + (100vw - 1512px) * 0.001892), 15.68px);
    --type-size-md: clamp(16px, calc(16px + (100vw - 1512px) * 0.002162), 17.92px);
    --type-size-lg: clamp(18px, calc(18px + (100vw - 1512px) * 0.002432), 20.16px);
    --type-size-xl: clamp(20px, calc(20px + (100vw - 1512px) * 0.002703), 22.4px);
    --type-size-2xl: clamp(24px, calc(24px + (100vw - 1512px) * 0.003243), 26.88px);
    --type-size-3xl: clamp(32px, calc(32px + (100vw - 1512px) * 0.004324), 35.84px);
    --type-size-40: clamp(40px, calc(40px + (100vw - 1512px) * 0.005405), 44.8px);
    --type-size-4xl: clamp(48px, calc(48px + (100vw - 1512px) * 0.006486), 53.76px);
    --type-size-5xl: clamp(64px, calc(64px + (100vw - 1512px) * 0.008649), 71.68px);
    --type-leading-14: clamp(14px, calc(14px + (100vw - 1512px) * 0.001892), 15.68px);
    --type-leading-16: clamp(16px, calc(16px + (100vw - 1512px) * 0.002162), 17.92px);
    --type-leading-18: clamp(18px, calc(18px + (100vw - 1512px) * 0.002432), 20.16px);
    --type-leading-20: clamp(20px, calc(20px + (100vw - 1512px) * 0.002703), 22.4px);
    --type-leading-22: clamp(22px, calc(22px + (100vw - 1512px) * 0.002973), 24.64px);
    --type-leading-24: clamp(24px, calc(24px + (100vw - 1512px) * 0.003243), 26.88px);
    --type-leading-26: clamp(26px, calc(26px + (100vw - 1512px) * 0.003514), 29.12px);
    --type-leading-32: clamp(32px, calc(32px + (100vw - 1512px) * 0.004324), 35.84px);
    --type-leading-34: clamp(34px, calc(34px + (100vw - 1512px) * 0.004595), 38.08px);
    --type-leading-38: clamp(38px, calc(38px + (100vw - 1512px) * 0.005135), 42.56px);
    --type-leading-48: clamp(48px, calc(48px + (100vw - 1512px) * 0.006486), 53.76px);
    --type-leading-62: clamp(62px, calc(62px + (100vw - 1512px) * 0.008378), 69.44px);
    --icon-16: clamp(16px, calc(16px + (100vw - 1512px) * 0.002162), 17.92px);
    --icon-20: clamp(20px, calc(20px + (100vw - 1512px) * 0.002703), 22.4px);
    --icon-24: clamp(24px, calc(24px + (100vw - 1512px) * 0.003243), 26.88px);
    --header-h: clamp(64px, calc(64px + (100vw - 1512px) * 0.008649), 71.68px);
    --header-h-scrolled: clamp(64px, calc(64px + (100vw - 1512px) * 0.008649), 71.68px);
    --logo-size: clamp(24px, calc(24px + (100vw - 1512px) * 0.003243), 26.88px);
    --logo-size-scrolled: clamp(24px, calc(24px + (100vw - 1512px) * 0.003243), 26.88px);
    --logo-drop: clamp(0px, calc(0px + (100vw - 1512px) * 0), 0px);
  }
}

/* Mobile fixed set (≤ 767px): no clamps below the line. Type compresses (ceiling 32); space fixed at nominal. */
@media (max-width: 767px) {
  :root {
    --space-2: 2px;
    --space-4: 4px;
    --space-6: 6px;
    --space-8: 8px;
    --space-10: 10px;
    --space-12: 12px;
    --space-16: 16px;
    --space-20: 20px;
    --space-24: 24px;
    --space-32: 32px;
    --space-40: 40px;
    --space-48: 48px;
    --space-64: 64px;
    --space-72: 72px;
    --space-80: 80px;
    --space-96: 96px;
    --space-128: 128px;
    --space-160: 160px;
    --space-192: 192px;
    --space-256: 256px;
    --space-512: 512px;
    --type-size-xxs: 10px;
    --type-size-xs: 12px;
    --type-size-sm: 14px;
    --type-size-md: 16px;
    --type-size-lg: 16px;
    --type-size-xl: 20px;
    --type-size-2xl: 20px;
    --type-size-3xl: 24px;
    --type-size-40: 32px;
    --type-size-4xl: 32px;
    --type-size-5xl: 32px;
    --type-leading-14: 14px;
    --type-leading-16: 16px;
    --type-leading-18: 18px;
    --type-leading-20: 20px;
    --type-leading-22: 20px;
    --type-leading-24: 24px;
    --type-leading-26: 24px;
    --type-leading-32: 26px;
    --type-leading-34: 32px;
    --type-leading-38: 32px;
    --type-leading-48: 32px;
    --type-leading-62: 32px;
    --icon-16: 16px;
    --icon-20: 20px;
    --icon-24: 24px;
    --header-h: 55px;
    --header-h-scrolled: 55px;
    --logo-size: 20px;
    --logo-size-scrolled: 20px;
    --logo-drop: 0px;
  }
}

/* Mode: light — roles re-scoped; cascade via inheritance (page → section → block) */
[data-color-mode="light"] {
  --color-bg-primary: #ffffff;
  --color-bg-secondary: #f6f6f6;
  --color-bg-tint: #f6f6f6;
  --color-surface-primary: #ffffff;
  --color-surface-secondary: #fafafa;
  --color-surface-10: #ebebeb;
  --color-surface-hover: #f0f0f0;
  --color-surface-disabled: #e4e4e4;
  --color-surface-inverse: #1a1a1a;
  --color-surface-inverse-hover: #1a1a1a;
  --color-text-primary: #1a1a1a;
  --color-text-primary-hover: #4a4a4a;
  --color-text-secondary: #707070;
  --color-text-disabled: #a3a3a3;
  --color-text-inverse: #ffffff;
  --color-text-banner: #1a1a1a;
  --color-text-error: #b3261e;
  --color-stroke-primary: #1a1a1a;
  --color-stroke-divider: #dddddd;
  --color-stroke-secondary: #dddddd;
  --color-stroke-error: #b42318;
  --color-stroke-grid: #dddddd;
  --color-accent: #1a1a1a;
  --color-overlay-light: #1a1a1a80;
  --color-overlay-dark: #000000b3;
  --color-drawer: #fffffff0;
  --color-header-solid: #fffffff5;
  --color-status-success: #1f7a4d;
  --color-status-warning: #b26b00;
  --color-status-error: #b42318;
  --color-status-bg-success: #e8f5e9;
  --color-status-bg-warning: #fff4db;
  --color-status-bg-error: #fce8ec;
  --color-status-prefill: #f6f6f6;
  --color-status-message: #fafafa;
  --color-gradient-0: #1a1a1a00;
  --color-gradient-20: #1a1a1a33;
  --color-gradient-25: #1a1a1a40;
}

/* Mode: dark — roles re-scoped; cascade via inheritance (page → section → block) */
[data-color-mode="dark"] {
  --color-bg-primary: #000000;
  --color-bg-secondary: #202020;
  --color-bg-tint: #232323;
  --color-surface-primary: #1a1a1a;
  --color-surface-secondary: #202020;
  --color-surface-hover: #2b2b2b;
  --color-surface-disabled: #484848;
  --color-surface-inverse: #ffffff;
  --color-text-primary: #ffffff;
  --color-text-primary-hover: #c8c8c8;
  --color-text-secondary: #a3a3a3;
  --color-text-disabled: #707070;
  --color-text-inverse: #1a1a1a;
  --color-text-banner: #ffffff;
  --color-text-error: #ff8a7a;
  --color-stroke-primary: #ffffff;
  --color-stroke-divider: #484848;
  --color-stroke-secondary: #484848;
  --color-stroke-error: #ff8a7a;
  --color-stroke-grid: #2b2b2b;
  --color-accent: #ffffff;
  --color-drawer: #1a1a1af0;
  --color-surface-10: #303030;
  --color-header-solid: #1a1a1af5;
  --color-status-prefill: #232323;
  --color-status-message: #202020;
  --color-gradient-0: #00000000;
  --color-gradient-20: #00000033;
  --color-gradient-25: #00000040;
  --color-status-success: #6fcf97;
  --color-status-warning: #ffb35c;
  --color-status-error: #ff8a7a;
  --color-status-bg-warning: #655b46;
  --color-status-bg-error: #5c333b;
  --color-surface-inverse-hover: #ffffff;
}

/* Contrast: contrast — the high-contrast layer, roles pushed to a passing value; wins over the mode blocks above */
[data-contrast], [data-contrast] [data-color-mode="light"] {
  --color-text-disabled: #707070;
  --color-stroke-secondary: #767676;
}

/* Contrast: contrast-dark — the high-contrast layer, roles pushed to a passing value; wins over the mode blocks above */
[data-contrast][data-color-mode="dark"], [data-contrast] [data-color-mode="dark"] {
  --color-text-disabled: #a3a3a3;
  --color-stroke-secondary: #8a8a8a;
}
