:root {
--red-50:   #FEF2F3;
--red-100:  #FDE2E3;
--red-200:  #FABCC0;
--red-300:  #F68990;
--red-400:  #F25761;   
--red-500:  #EF2D39;   
--red-600:  #DA2833;
--red-700:  #C7242E;   
--red-800:  #B21F29;
--red-900:  #A1242C;   
--navy-50:  #F0F4F8;
--navy-100: #DCE4ED;
--navy-200: #B4C4D6;   
--navy-300: #7E99B8;   
--navy-400: #4A6E96;
--navy-500: #2C5480;
--navy-600: #1F4066;
--navy-700: #16304F;   
--navy-800: #0E2038;   
--navy-900: #070F1C;
--steel-50:  #F4F6F8;
--steel-100: #E8EBEF;
--steel-200: #D4D9DF;
--steel-300: #ADB4BD;
--steel-400: #8A93A0;  
--steel-450: #7E8794;  
--steel-500: #646D79;  
--steel-600: #5A6472;  
--steel-700: #3D444E;
--steel-800: #2B3038;
--steel-900: #1A1D21;
--success-600: #17795E;
--success-50:  #EAF6F2;
--warning-600: #9A6206;
--warning-50:  #FDF6E9;
--tag-epdm: #C0392B;
--tag-nbr:  #1F5FA8;
--tag-cr:   #C9922A;
--tag-nr:   #2E7D46;
--tag-fkm:  #7B2540;
--color-surface-page:        #FFFFFF;
--color-surface-subtle:      var(--steel-50);
--color-surface-raised:      #FFFFFF;
--color-surface-inverse:     var(--navy-800);
--color-surface-inverse-alt: var(--navy-700);
--color-surface-critical:    var(--red-50);
--color-border-subtle:  var(--steel-100);
--color-border-default: var(--steel-200);
--color-border-strong:  var(--steel-300);
--color-border-inverse: rgba(255, 255, 255, 0.14);
--color-border-accent:  var(--red-500);
--color-border-interactive: var(--steel-450);
--color-text-primary:           var(--navy-800);
--color-text-secondary:         var(--steel-600);
--color-text-tertiary:          var(--steel-500);
--color-text-inverse:           #FFFFFF;
--color-text-inverse-secondary: var(--navy-200);
--color-text-inverse-tertiary:  var(--navy-300);
--color-text-accent:            var(--red-900);   
--color-text-accent-inverse:    var(--red-300);   
--color-action:          var(--red-700);
--color-action-hover:    var(--red-900);
--color-action-active:   var(--red-900);
--color-action-text:     #FFFFFF;
--color-action-quiet:    var(--red-900);
--color-action-disabled: var(--steel-300);
--color-signal:   var(--red-500);
--color-focus:    var(--red-500);
--color-critical: var(--red-900);
--font-display: 'IBM Plex Sans Condensed', 'IBM Plex Sans', system-ui, sans-serif;
--font-body:    'IBM Plex Sans', system-ui, -apple-system, sans-serif;
--font-mono:    'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;
--type-display: clamp(2.5rem, 1.7rem + 3.4vw, 4.25rem);
--type-h1:      clamp(2.125rem, 1.6rem + 2.2vw, 3.25rem);
--type-h2:      clamp(1.75rem, 1.45rem + 1.3vw, 2.5rem);
--type-h3:      clamp(1.3125rem, 1.2rem + 0.5vw, 1.625rem);
--type-h4:      1.0625rem;
--type-lead:    clamp(1.0625rem, 1rem + 0.35vw, 1.25rem);
--type-body:    1rem;
--type-body-sm: 0.875rem;
--type-data:    0.9375rem;
--type-label:   0.8125rem;
--type-eyebrow: 0.75rem;
--type-button:  0.875rem;
--leading-display: 1.02;
--leading-h1:      1.06;
--leading-h2:      1.12;
--leading-h3:      1.22;
--leading-h4:      1.35;
--leading-lead:    1.6;
--leading-body:    1.7;
--leading-data:    1.5;
--tracking-display:  -0.022em;
--tracking-h1:       -0.02em;
--tracking-h2:       -0.015em;
--tracking-h3:       -0.01em;
--tracking-label:     0.06em;
--tracking-eyebrow:   0.14em;
--tracking-button:    0.1em;
--tracking-wordmark:  0.18em;
--measure-prose: 68ch;
--measure-lead:  60ch;
--space-1:  4px;
--space-2:  8px;
--space-3:  12px;
--space-4:  16px;
--space-5:  24px;
--space-6:  32px;
--space-7:  48px;
--space-8:  64px;
--space-9:  96px;
--space-10: 128px;
--space-11: 160px;
--container-max:    1280px;
--container-narrow: 820px;
--gutter:        72px;
--grid-gap:      24px;
--header-height: 80px;
--section-pad: var(--space-10);
--radius-none: 0;
--radius-sm:   2px;
--radius-md:   4px;
--border-hairline: 1px;
--border-emphasis: 2px;
--border-marker:   3px;
--shadow-sm: 0 1px 2px rgba(14, 32, 56, 0.06);
--shadow-md: 0 4px 12px rgba(14, 32, 56, 0.08);
--shadow-lg: 0 12px 32px rgba(14, 32, 56, 0.12);
--ease-out:    cubic-bezier(0.2, 0, 0, 1);
--ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
--dur-fast: 120ms;
--dur-base: 200ms;
--dur-slow: 320ms;
--dur-reveal: 520ms;
}
@media (max-width: 1279px) {
:root {
--gutter: 40px;
--section-pad: var(--space-9);
}
}
@media (max-width: 1099px) {
:root { --header-height: 64px; }
}
@media (max-width: 767px) {
:root {
--gutter: 20px;
--grid-gap: 16px;
--section-pad: var(--space-8);
}
}