/* ============================================================
   tokens.css — single source of truth for design values.
   Change a brand color or spacing step here, not in components.
   ============================================================ */

:root {
  /* ---- Brand palette (sampled from the Figma SVG assets) ---- */
  --c-ink:        #15171c;   /* primary text / near-black            */
  --c-ink-soft:   #2a2d36;   /* headings on light                    */
  --c-muted:      #5d606b;   /* secondary text                       */
  --c-faint:      #abafbb;   /* tertiary text, partner logos         */
  --c-line:       #e7e8ec;   /* hairline borders                     */
  --c-surface:    #ffffff;   /* page background                      */
  --c-surface-2:  #f7f8fa;   /* alt section / card background        */
  --c-dark:       #15171c;   /* dark cards (pricing, hero phone)     */

  /* Accent (CTAs) */
  --c-accent:     #f7770f;
  --c-accent-2:   #f74b0f;
  --grad-accent:  linear-gradient(135deg, #f78b0f 0%, #f74b0f 100%);

  /* Feature-card gradients */
  --grad-blue:    linear-gradient(160deg, #0f7bf7 0%, #0240d4 100%);
  --grad-green:   linear-gradient(160deg, #9bfb88 0%, #0f92f7 100%);
  --grad-orange:  linear-gradient(160deg, #f78b0f 0%, #f74b0f 100%);

  --c-live:       #f70f0f;   /* LIVE badge */

  /* ---- Typography ---- */
  --font-display: "Tomorrow", "Arial Narrow", sans-serif; /* headings */
  --font-body:    "Inter", system-ui, -apple-system, sans-serif;

  /* Type scale (clamps keep it fluid without media queries) */
  --fs-display: 3rem;
  --fs-hero:   clamp(1.8rem, 4vw, 2.625rem);
  --fs-h2:     1.5rem;
  --fs-h3:     1.125rem;
  --fs-body:   1rem;
  --fs-sm:     0.875rem;
  --fs-xs:     0.75rem;

  --lh-tight:  1.05;
  --lh-snug:   1.25;
  --lh-body:   1.6;

  /* ---- Spacing scale (8px base) ---- */
  --sp-1: 0.25rem;  --sp-2: 0.5rem;  --sp-3: 0.75rem; --sp-4: 1rem;
  --sp-6: 1.5rem;   --sp-8: 2rem;    --sp-12: 3rem;   --sp-16: 4rem;
  --sp-24: 6rem;    --sp-32: 8rem;

  /* ---- Radii / shadow ---- */
  --r-sm: 8px;  --r-md: 14px;  --r-lg: 22px;  --r-pill: 999px;
  --shadow-card: 0 1px 2px rgba(21,23,28,.04), 0 8px 24px rgba(21,23,28,.06);
  --shadow-lift: 0 12px 32px rgba(21,23,28,.12);

  /* ---- Layout ---- */
  --maxw: 1120px;
  --gutter: clamp(1rem, 4vw, 2rem);
}

/* ---- Dark mode overrides ---- */
[data-theme="dark"] {
  --c-ink:        #ffffff;
  --c-ink-soft:   #ffffff;
  --c-muted:      #ffffff;
  --c-faint:      #abafbb;
  --c-line:       #222325;
  --c-surface:    #000000;
  --c-surface-2:  #161920;
  --c-dark:       #0a0c11;
  --shadow-card:  0 1px 2px rgba(0,0,0,.2), 0 8px 24px rgba(0,0,0,.3);
  --shadow-lift:  0 12px 32px rgba(0,0,0,.4);
}