/* ============================================================
   Sanor — brand design tokens (locked, from CLAUDE.md)
   Named custom properties for the locked palette. The ported
   component CSS below uses these hex values directly; these
   variables carry the same values for reference and future use.
   ============================================================ */
:root {
  --brand-green:  #0B2F16; /* headings */
  --callout-green: #102F1D; /* shared hero, capabilities and footer Playbook boxes */
  --deep-green:   #0A3D2F; /* dark section backgrounds, accents */
  --article-link-green: #176B42; /* approved Forest text links */
  --bright-green: #96F878; /* CTAs, highlights */
  --cream:        #F7F4EF; /* alternate section backgrounds */
  --cream-border: #E3DFD5; /* card borders on cream */
  --warm-grey:    #C9C4B8; /* muted rules, dividers */
  --ink-brand:    #2B2B2B; /* body text */
  --white:        #FFFFFF; /* base page background */
}

/* ============================================================
   Ported verbatim from reference/sanor-wireframe.html (build 48).
   The :root blocks below reproduce the wireframe's token values
   exactly so component CSS renders pixel-identical.
   ============================================================ */
  :root {
    --bg: #FFFFFF;
    --line: #C7C7C7;
    --line-soft: #E2E2E2;
    --fill: #F2F2F2;
    --fill-dark: #E6E6E6;
    --ink: #2B2B2B;
    --mute: #8A8A8A;
    --note: #6B7B8F;
    --mono: "SF Mono", Menlo, Consolas, monospace;
    --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
    --serif: "Source Serif 4", Georgia, serif;
  }

:root {
  --content-w: 1350px;
  --byline-font: "Inter", sans-serif;
  --byline-weight: 300;
  /* greyscale placeholders — swap for brand tokens later */
  --ink:          #111111;
  --body:         #333333;
  --meta:         #767676;
  --rule:         #E4E4E4;
  --fill:         #D9D9D9;
  --page:         #FFFFFF;

  /* type */
  --font-display: "Source Serif 4", Georgia, serif;
  --font-sans:    "Inter", -apple-system, BlinkMacSystemFont, sans-serif;

  --size-eyebrow: 15px;
  --size-title:   72px;
  --size-body:    20px;
  --size-btn:     16px;

  /* button */
  --btn-h:        48px;
  --btn-pad:      26px;
  --btn-radius:   14px;
  --btn-weight:   600;
  --arrow-w:      16px;
  --arrow-gap:    10px;
  --swap-dur:     340ms;
  --swap-ease:    cubic-bezier(0.65, 0, 0.35, 1);
}