/* ============================================================
 * SEO-Opt — marketing-landing design tokens
 * Source of truth for the landing layer; brand values match
 * design.md §Tokens (lifted from design/seo-opt-design-system-v2,
 * NOT @imported from it — see design.md §Notes).
 * Axes: light paper (L 96.5%) / geometric-sans display /
 * chromatic-other accent (green ~169°).
 * COPY for static serving — canonical lives at /tokens.css (repo root);
 * edit the root file, then re-copy here. Do not edit this copy directly.
 * ============================================================ */
:root {
  /* ---------- Colour · ground is the DARKER surface, cards are lighter ---------- */
  --color-paper:         oklch(96.5% 0.010 87.5);  /* #f6f3ec  canvas            */
  --color-paper-2:       oklch(99.4% 0.007 88.6);  /* #fffdf8  raised cards      */
  --color-ink:           oklch(26.5% 0.037 165.6); /* #122b21  13.6:1 on paper   */
  --color-ink-2:         oklch(52.5% 0.030 162.4); /* #5b7065  4.8:1 muted       */
  --color-rule:          oklch(87.7% 0.024 88.2);  /* #ddd6c5  hairlines         */
  --color-accent:        oklch(33.2% 0.055 169.0); /* #123f31  evergreen CTA     */
  --color-accent-ink:    oklch(97.2% 0.013 134.9); /* #f2f8ef  on accent 10.9:1  */
  --color-highlight:     oklch(90.8% 0.166 124.3); /* #c9f36f  lime — ONE moment */
  --color-highlight-ink: oklch(41.4% 0.095 125.6); /* #3f5410  on lime 6.7:1     */
  --color-focus:         oklch(42.8% 0.075 166.5); /* #1c5c46  ring 7.1:1        */
  --color-error:         oklch(45%   0.14  27);    /* form errors, 5.9:1 — NOT the app's coral */

  /* ---------- Type ---------- */
  --font-display: "Unbounded", sans-serif;  /* display AND every number, "tnum" */
  --font-body:    "Onest", system-ui, sans-serif;

  /* Scale · major third 1.25 from 16px; landing display goes past the app's 56px cap */
  --text-xs:        0.75rem;    /* 12px — labels only, never body */
  --text-sm:        0.875rem;   /* 14px */
  --text-base:      1rem;       /* 16px */
  --text-md:        1.25rem;    /* 20px */
  --text-lg:        1.5625rem;  /* 25px */
  --text-xl:        1.953rem;   /* 31px */
  --text-2xl:       2.441rem;   /* 39px */
  --text-display-s: clamp(1.75rem, 1.2rem + 2.2vw, 2.75rem);
  --text-display:   clamp(2.05rem, 1.3rem + 3.4vw, 4.3rem); /* Unbounded is wide — capped ~69px */

  /* ---------- Space · 4pt scale, role-named ---------- */
  --space-3xs: 0.125rem;  /*   2px */
  --space-2xs: 0.25rem;   /*   4px */
  --space-xs:  0.5rem;    /*   8px */
  --space-sm:  0.75rem;   /*  12px */
  --space-md:  1rem;      /*  16px */
  --space-lg:  1.5rem;    /*  24px */
  --space-xl:  2.5rem;    /*  40px */
  --space-2xl: 4rem;      /*  64px */
  --space-3xl: 6rem;      /*  96px */
  --space-4xl: 9rem;      /* 144px */

  --page-gutter: clamp(1rem, 4vw, 2.5rem);
  --measure: 62ch;

  /* ---------- Motion · spring is the house feel (entrances, lift); UI state stays ease-out ---------- */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 160ms;
  --dur-base: 240ms;
  --dur-slow: 420ms;

  /* ---------- Shape ---------- */
  --radius-card:  20px;
  --radius-panel: 26px;
  --radius-pill:  999px;
  --radius-input: 12px;
  --rule-hair: 1px;

  /* ---------- Elevation · warm «clay» shadows (ink-anchored, never grey) ---------- */
  --shadow-card: 0 1px 2px oklch(26.5% 0.037 165.6 / 0.05),
                 0 2px 6px oklch(26.5% 0.037 165.6 / 0.05);
  --shadow-lift: 0 2px 4px oklch(26.5% 0.037 165.6 / 0.05),
                 0 14px 34px -16px oklch(26.5% 0.037 165.6 / 0.22);
  --shadow-pop:  0 4px 10px oklch(26.5% 0.037 165.6 / 0.07),
                 0 22px 44px -18px oklch(26.5% 0.037 165.6 / 0.28);

  /* ---------- Z · named levels only ---------- */
  --z-base:     1;
  --z-raised:   10;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-modal:    400;
  --z-toast:    500;
  --z-tooltip:  600;
}
