/* ==========================================================================
   Capital Hart — design tokens
   Sampled from CHC Full Logo.png: deep navy ground, one saturated red.
   Red is a scalpel, not a paint roller.
   ========================================================================== */

:root {
  /* --- ground -------------------------------------------------------
     Lifted off near-black into a true blue-navy. The atmosphere layer
     (assets/js/main.js + .atmos in the CSS) paints over this. */
  --navy-950: #0d1838;   /* page ground */
  --navy-900: #101d40;   /* primary surface */
  --navy-870: #142348;
  --navy-850: #172950;   /* raised panel */
  --navy-800: #1a2e58;
  --navy-700: #243c6e;   /* borders on solid panels */

  /* --- atmosphere ----------------------------------------------------
     --atmos-strength is the single dial for the moving background:
     1 = as designed, 0.6 = subtle, 0 = off (flat navy). */
  --atmos-strength: 1;
  --orb-red:    #ce181f;
  --orb-indigo: #2b47c4;

  /* --- hairlines: the backbone of the whole look --------------------- */
  --hair:        rgba(255, 255, 255, 0.085);
  --hair-soft:   rgba(255, 255, 255, 0.045);
  --hair-strong: rgba(255, 255, 255, 0.17);

  /* --- accent ------------------------------------------------------- */
  --red:      #ce181f;
  --red-lit:  #d81f26;   /* hover fill — keeps white text at AA */
  --red-text: #f4595f;   /* small red TEXT on navy; brand red alone fails AA */
  --red-deep: #9c1117;
  --red-wash: rgba(206, 24, 31, 0.13);
  --red-glow: rgba(206, 24, 31, 0.30);

  /* --- ink ---------------------------------------------------------- */
  --ink-050: #f6f8fc;   /* headings */
  --ink-200: #c8d2e6;   /* strong body */
  --ink-400: #8fa0c0;   /* body */
  --ink-600: #8090b2;   /* muted / captions */
  --ink-700: #8391b5;   /* faint labels, placeholders */

  /* --- semantic ----------------------------------------------------- */
  --ok:   #2fbf71;
  --warn: #e6a94b;

  /* --- type --------------------------------------------------------- */
  --font-sans: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', Inter,
               system-ui, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, SFMono-Regular, 'SF Mono', Menlo,
               Consolas, 'Liberation Mono', monospace;

  --t-display: clamp(2.75rem, 1.35rem + 5.4vw, 5.5rem);
  --t-h1:      clamp(2.25rem, 1.35rem + 3.6vw, 4rem);
  --t-h2:      clamp(1.85rem, 1.25rem + 2.4vw, 3rem);
  --t-h3:      clamp(1.3rem, 1.08rem + 0.9vw, 1.75rem);
  --t-h4:      clamp(1.05rem, 0.97rem + 0.35vw, 1.2rem);
  --t-body:    clamp(1rem, 0.96rem + 0.16vw, 1.0625rem);
  --t-lede:    clamp(1.1rem, 1.02rem + 0.4vw, 1.3125rem);
  --t-small:   0.875rem;
  --t-micro:   0.75rem;

  /* --- spacing ------------------------------------------------------ */
  --s-1: 0.25rem;  --s-2: 0.5rem;   --s-3: 0.75rem;  --s-4: 1rem;
  --s-5: 1.5rem;   --s-6: 2rem;     --s-7: 3rem;     --s-8: 4rem;
  --s-9: 6rem;     --s-10: 8rem;

  --section-y: clamp(4.5rem, 2.5rem + 7vw, 9rem);
  --gutter:    clamp(1.25rem, 0.6rem + 2.4vw, 3rem);
  --measure:   72rem;   /* max content width */
  --measure-narrow: 46rem;

  /* --- form / shape ------------------------------------------------- */
  --r-sm: 6px;  --r-md: 10px;  --r-lg: 16px;  --r-xl: 24px;

  --lift-1: 0 1px 2px rgba(0, 0, 0, 0.4);
  --lift-2: 0 12px 32px -12px rgba(0, 0, 0, 0.6);
  --lift-3: 0 32px 80px -24px rgba(0, 0, 0, 0.75),
            0 2px 6px rgba(0, 0, 0, 0.4);

  /* --- motion ------------------------------------------------------- */
  --ease:     cubic-bezier(0.22, 1, 0.36, 1);   /* out-expo-ish */
  --ease-io:  cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 160ms;
  --dur:      280ms;
  --dur-slow: 620ms;

  --header-h: 78px;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0.01ms; --dur: 0.01ms; --dur-slow: 0.01ms; }
}