/* Retrieverworks - design tokens
 * Generated 2026-07-24 from docs/design-system.md after the variant-A
 * reconciliation. This file is the single CSS source of truth for tokens.
 * Tokens only: no resets, no component styles, no font loading.
 *
 * Reconciliation additions vs the original brief token block:
 *   --border-inverse   promoted from raw oklch(32% 0.05 140) (footer divider)
 *   --lime-hover       promoted from raw oklch(88% 0.19 127) (lime CTA hover)
 *   --tracking-caps    promoted from raw 0.08em (uppercase micro-labels)
 *   --space-32/--space-40  complete the sanctioned spacing set (128/160px)
 */

:root {
  /* ---- Color (OKLCH) ----
   * Palette v3 "Neptune & Lime" adopted 2026-07-26 (owner decision; palette
   * 20 of the palette library). Base: midnight #002233 / neptune #11425D /
   * cheviot paper #F6F2E8 / pacific tint #C0D6EA; accent lime #C6FF33.
   * Token names (--forest, --lime) are kept as ROLE names to avoid a rename
   * across styles.css - forest now holds navy, lime holds the lime accent.
   * All pairs re-verified WCAG 2.2 AA on 2026-07-26 (see design-system §6).
   * Fallback palette 16 "Neptune & Isotonic": identical base, accent
   * oklch(96.6% 0.201 118) (#DDFF55), hover oklch(97.2% 0.176 116) (#E8FF7A). */
  --ink:               oklch(23.8% 0.05 235);  /* primary text on light (#002233) */
  --ink-muted:         oklch(45.2% 0.043 236); /* secondary text on light */
  --ink-subtle:        oklch(53.8% 0.036 234); /* captions/placeholders; NOT on surface-3 */
  --ink-inverse:       oklch(100% 0 0);        /* primary text on forest */
  --ink-inverse-muted: oklch(84% 0.03 237);    /* secondary text on forest */

  --surface-0:         oklch(100% 0 0);        /* white; cards on paper */
  --surface-1:         oklch(96.2% 0.014 89);  /* cheviot paper; default page background */
  --surface-2:         oklch(86.6% 0.037 246); /* pacific tint; tonal bands */
  --surface-3:         oklch(80.8% 0.048 246); /* strong tint; illustrative blocks */
  --forest:            oklch(23.8% 0.05 235);  /* dark section background (= ink) */
  --forest-raised:     oklch(36.1% 0.069 238); /* cards on forest (#11425D) */

  --lime:              oklch(92.8% 0.22 125);  /* accent (#C6FF33); never text on light surfaces */
  --lime-hover:        oklch(93.9% 0.192 123); /* hover tone of lime-surface controls */
  --border:            oklch(88.9% 0.024 91);  /* 1px hairlines on light surfaces */
  --border-inverse:    oklch(42.9% 0.07 237);  /* 1px hairlines on forest */
  --focus:             oklch(59.5% 0.079 237); /* focus ring; 3:1+ on light AND forest */

  /* ---- Typography ---- */
  --font-sans:  "Hanken Grotesk", ui-sans-serif, system-ui, sans-serif;
  --font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;

  --text-xs:      0.8125rem;                                   /* 13px */
  --text-sm:      0.875rem;                                    /* 14px */
  --text-base:    1rem;                                        /* 16px */
  --text-lg:      clamp(1.125rem, 1.08rem + 0.19vw, 1.25rem);  /* 18 -> 20px */
  --text-xl:      clamp(1.375rem, 1.24rem + 0.57vw, 1.75rem);  /* 22 -> 28px */
  --text-2xl:     clamp(2rem, 1.63rem + 1.52vw, 3rem);         /* 32 -> 48px */
  --text-display: clamp(2.5rem, 1.85rem + 2.67vw, 4.25rem);    /* 40 -> 68px */

  --leading-xs: 1.4;  --leading-sm: 1.4;  --leading-base: 1.5;
  --leading-lg: 1.45; --leading-xl: 1.25; --leading-2xl: 1.1;
  --leading-display: 1.02;

  --tracking-heading: -0.01em;  /* text-xl and larger */
  --tracking-caps: 0.08em;      /* uppercase micro-labels (sans, text-xs, w500) */
  --weight-display: 450;        /* text-display, text-2xl */
  --weight-heading: 500;        /* text-xl, nav, buttons, UI labels */
  --weight-body: 400;           /* all serif copy */

  /* ---- Space & shape (4px base; sanctioned steps:
          4 8 12 16 20 24 32 40 48 64 80 96 128 160) ---- */
  --space-1: 4px;   --space-2: 8px;   --space-3: 12px;  --space-4: 16px;
  --space-5: 20px;  --space-6: 24px;  --space-8: 32px;  --space-10: 40px;
  --space-12: 48px; --space-16: 64px; --space-20: 80px; --space-24: 96px;
  --space-32: 128px; --space-40: 160px;

  --radius-sm: 6px;   /* chips */
  --radius-md: 8px;   /* buttons, inputs */
  --radius-lg: 12px;  /* cards */
  --radius-xl: 16px;  /* media, hero panels */
  --radius-full: 9999px;

  /* ---- Layout ---- */
  --container-max: 1280px;
  --gutter: 20px;               /* stepped by the media queries below */
  --section-y:    clamp(4rem, 2.33rem + 6.86vw, 8.5rem); /* 64 -> 136px */
  --section-y-lg: clamp(5rem, 3.14rem + 7.62vw, 10rem);  /* 80 -> 160px */

  /* ---- Z-layers ---- */
  --z-raised: 1;    /* overlapping hero panel */
  --z-overlay: 100; /* mobile nav drawer */

  /* ---- Motion ---- */
  --ease-out:  cubic-bezier(0, 0, 0, 1);        /* hover / color changes */
  --ease-move: cubic-bezier(0.65, 0, 0.35, 1);  /* transform / reveals */
  --duration-fast: 150ms;                       /* interactions */
  --duration-reveal: 400ms;                     /* scroll-in reveals */
  --duration-wave: 900ms;                       /* hero waveform pulse */
  --duration-fade: 500ms;                       /* hero scene crossfade */
  --duration-draw: 900ms;                       /* SVG stroke draw-in */
  --duration-count: 1200ms;                     /* stat count-up (mirrored in JS) */
  --stagger: 110ms;                             /* choreography step between items */
  --duration-hl: 8s;                            /* lead marker-highlight relay cycle */
  --scene-step: 800ms;                          /* hero scene fill cadence (step apart) */
}

@media (min-width: 640px)  { :root { --gutter: 40px; } }
@media (min-width: 1024px) { :root { --gutter: 80px; } }