/* ==========================================================================
   Seattle Underground — design tokens
   Source of truth: /BRAND.md. Change values there first, then here.
   ========================================================================== */
:root {
  /* Color */
  --c-black:  #000000;
  --c-green:  #06693A;   /* Thoren palette: bright green */
  --c-green-deep: #1B3D36;   /* Thoren palette: dark green */
  --c-brown:  #8B6249;   /* Thoren palette: brown */
  --c-cream:  #F5F0DF;
  --c-yellow: #FFA300;   /* Thoren palette: orange (primary CTA) */
  --c-red:    #9E2A2F;   /* Thoren palette: red */
  --c-white:  #FFFFFF;

  --line-dark:  rgba(245, 240, 223, .22);  /* utility line on black/green */
  --line-light: rgba(17, 19, 17, .2);      /* utility line on cream */
  --muted-dark: rgba(245, 240, 223, .68);  /* secondary text on dark */
  --muted-light: rgba(17, 19, 17, .7);     /* secondary text on cream */

  /* Type families */
  --f-display: "Barlow Condensed", "Arial Narrow", Impact, sans-serif;
  --f-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Type scale (fluid) */
  --t-mega:  clamp(3.5rem, 12.5vw, 11.5rem);
  --t-xl:    clamp(3rem, 8.5vw, 8rem);
  --t-l:     clamp(2.25rem, 5vw, 4.5rem);
  --t-m:     clamp(1.625rem, 2.6vw, 2.5rem);
  --t-s:     clamp(1.25rem, 1.5vw, 1.5rem);
  --t-lead:  clamp(1.125rem, 1.35vw, 1.3125rem);
  --t-body:  1.0625rem;
  --t-small: .875rem;
  --t-label: .75rem;

  /* Spacing (4px base) */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; 

  --section-y: clamp(64px, 10vw, 160px);
  --gutter: clamp(16px, 2.5vw, 32px);
  --margin: clamp(16px, 4vw, 64px);
  --max: 1440px;

  --radius: 2px;
  --focus: var(--c-black);   /* focus ring; yellow on dark grounds (see .b-services, .b-diagram, .b-final, footer, sticky bar) */
  --ease: cubic-bezier(.2, .7, .2, 1);
  --dur: 200ms;

  --sticky-bar-h: 73px;
}
