/* reformr — design tokens
   The single source of truth for colour, type, spacing, radius and motion.
   Every component rule in reformr.css references these, never a raw value.
   Authored deliberately (see NOTES.md §1–2); the equivalent of hale's :root
   token block, minus the Webflow export machinery.
*/
:root {
  /* ---- Palette (see NOTES.md §2) --------------------------------------- */
  --rf-pine:       #14201d; /* deepest ground: hero, footer, dark sections */
  --rf-ink:        #1f2b28; /* lifted dark surface; primary text on light   */
  --rf-chalk:      #f0eee7; /* light page ground — warm paper               */
  --rf-mist:       #dde0d9; /* soft card / panel on light                   */
  --rf-clay:       #c1613a; /* primary accent: CTAs, the return signal      */
  --rf-steel:      #6f8582; /* secondary text, hairlines, rails             */

  /* Functional supports, same family */
  --rf-clay-deep:  #a44f2e; /* CTA hover                                    */
  --rf-clay-soft:  #d98a63; /* clay on dark, tints                          */
  --rf-sky:        #7ba3a0; /* data highlight / "connected"                 */
  --rf-amber:      #d99a3c; /* "drifting" / waitlist                        */
  --rf-sage:       #5f7d6e; /* "returning" / healthy                        */
  --rf-white:      #fbfaf6;
  --rf-pine-70:    rgba(20, 32, 29, 0.70);

  /* Semantic roles — light context (default) */
  --bg:            var(--rf-chalk);
  --surface:      #f7f6f1;
  --surface-2:     var(--rf-mist);
  --text:          var(--rf-ink);
  --text-soft:    #4a5551;
  --text-faint:    var(--rf-steel);
  --line:         #cfd2ca;
  --line-strong:  #b9bdb3;
  --accent:        var(--rf-clay);
  --accent-hover:  var(--rf-clay-deep);
  --on-accent:     var(--rf-white);

  /* ---- Type ------------------------------------------------------------ */
  --font-display: "Space Grotesk", "Segoe UI", system-ui, sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --fw-body:      400;
  --fw-medium:    500;
  --fw-bold:      700;

  /* Fluid type scale — clamp(min, preferred, max) */
  --fs-eyebrow:   0.8125rem;                               /* 13px, tracked  */
  --fs-caption:   0.8125rem;
  --fs-small:     0.875rem;
  --fs-body:      1rem;
  --fs-lead:      clamp(1.125rem, 1.02rem + 0.5vw, 1.375rem);
  --fs-h6:        clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem);
  --fs-h5:        clamp(1.25rem, 1.1rem + 0.7vw, 1.6rem);
  --fs-h4:        clamp(1.5rem, 1.28rem + 1.05vw, 2.15rem);
  --fs-h3:        clamp(1.9rem, 1.55rem + 1.7vw, 2.9rem);
  --fs-h2:        clamp(2.2rem, 1.7rem + 2.4vw, 3.6rem);
  --fs-h1:        clamp(2.7rem, 1.9rem + 3.6vw, 5rem);
  --fs-display:   clamp(3rem, 1.9rem + 4.9vw, 6rem);

  --lh-tight:     1.02;
  --lh-snug:      1.14;
  --lh-body:      1.6;
  --tracking-tight: -0.02em;
  --tracking-eyebrow: 0.14em;

  /* ---- Space (8px base) ------------------------------------------------ */
  --sp-1:  0.25rem;
  --sp-2:  0.5rem;
  --sp-3:  0.75rem;
  --sp-4:  1rem;
  --sp-5:  1.5rem;
  --sp-6:  2rem;
  --sp-7:  2.5rem;
  --sp-8:  3rem;
  --sp-10: 4rem;
  --sp-12: 5rem;
  --sp-16: 7rem;

  --section-y:    clamp(4rem, 3rem + 5vw, 7.5rem);   /* vertical section rhythm */
  --section-y-sm: clamp(3rem, 2.4rem + 3vw, 5rem);

  /* ---- Layout ---------------------------------------------------------- */
  --container:      75rem;   /* 1200px */
  --container-tight: 52rem;
  --container-text:  44rem;
  --gutter:        clamp(1.125rem, 0.6rem + 2vw, 2rem);

  /* ---- Radius ---------------------------------------------------------- */
  --r-sm:   6px;
  --r-md:   12px;
  --r-lg:   20px;
  --r-xl:   28px;
  --r-pill: 100vh;

  /* ---- Elevation & motion --------------------------------------------- */
  --shadow-sm: 0 1px 2px rgba(20, 32, 29, 0.06), 0 2px 8px rgba(20, 32, 29, 0.05);
  --shadow-md: 0 4px 12px rgba(20, 32, 29, 0.08), 0 14px 40px rgba(20, 32, 29, 0.08);
  --shadow-lg: 0 20px 60px rgba(20, 32, 29, 0.14);
  --ease:      cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-glide: cubic-bezier(0.4, 0.0, 0.2, 1);
  --dur:       0.24s;
}
