/* ============================================================
   Studio Design System — tokens.css
   6-site shared foundation. Light professional theme.
   Law: ~/workspace/freelance/visual-aesthetic-playbook.md
   Rules enforced: 8pt spacing scale, fixed type scale (12/14/16/
   18/21/24/36/60), single accent per brand (~10% usage),
   text contrast >= 4.5:1, zero inline styles in HTML.
   ============================================================ */

:root {
  /* ---- type ---- */
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif;

  /* fixed type scale (px) — no improvising */
  --t-12: 0.75rem;
  --t-14: 0.875rem;
  --t-16: 1rem;
  --t-18: 1.125rem;
  --t-21: 1.3125rem;
  --t-24: 1.5rem;
  --t-36: 2.25rem;
  --t-60: 3.75rem;

  /* ---- surfaces (light professional) ---- */
  --bg: #ffffff;
  --bg-soft: #f7f7f4;
  --bg-card: #ffffff;
  --ink: #191920;
  --ink-soft: #3d3d47;   /* body text — 10.4:1 on white */
  --muted: #62626e;     /* secondary — 5.9:1 on white */
  --faint: #8a8a96;     /* captions only — 4.6:1 on white */
  --line: #e8e8e2;

  /* ---- accent: overridden per brand via [data-brand] ---- */
  --accent: #2563eb;
  --accent-deep: #1d4ed8;
  --accent-ink: #ffffff;   /* text on accent buttons */
  --accent-soft: #eff4ff;  /* tinted wash backgrounds */

  /* ---- 8pt spacing scale ---- */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px;
  --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px;
  --s-9: 96px; --s-10: 128px;

  --radius: 12px;
  --radius-sm: 8px;
  --shadow-card: 0 1px 2px rgba(20, 20, 30, 0.05), 0 8px 24px rgba(20, 20, 30, 0.06);
  --shadow-pop: 0 2px 4px rgba(20, 20, 30, 0.06), 0 16px 40px rgba(20, 20, 30, 0.1);

  --container: 1120px;
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

/* ---- brand accents: ONE accent color per site, ~10% of page ---- */
html[data-brand="smartdataai"]  { --accent: #2563eb; --accent-deep: #1d4ed8; --accent-soft: #eff4ff; }
html[data-brand="cryptotaxai"]  { --accent: #7c3aed; --accent-deep: #6d28d9; --accent-soft: #f3eefd; }
html[data-brand="globlematch"]  { --accent: #db2777; --accent-deep: #be185d; --accent-soft: #fdeef5; }
html[data-brand="loanshelper"]  { --accent: #15803d; --accent-deep: #166534; --accent-soft: #ecf7ef; }
html[data-brand="opentencor"]   { --accent: #c2410c; --accent-deep: #9a3412; --accent-soft: #fdf0e7; }
html[data-brand="resumescore"]  { --accent: #0e7490; --accent-deep: #155e75; --accent-soft: #eaf6f9; }
html[data-brand="datewiseai"]   { --accent: #246b50; --accent-deep: #1b5442; --accent-soft: #eaf3ee; }
/* datewiseai: bean-duo brand — deep green is the single UI accent.
   Coral #FFB49E lives only in brand illustration (bean characters), never in UI chrome. */

/* accent-ink stays white on all six (all accents >= 4.5:1 vs white) */