/* VisiScan design tokens — CSS custom properties.
   Machine mirror of design-tokens.json. The funnel squad imports this (or inlines it)
   so the landing + checkout read as one system with the live report/PDF.
   LIGHT (paper) is the default surface; add data-theme="dark" (or rely on prefers-color-scheme)
   for the dark app-shell palette. All accent tints derive from --primary via color-mix. */

:root {
  /* brand — azul do logo aprovado (trace visiscan-meta-track-20260811, fase cores). Antes
     era o índigo #4338ca, que fazia a página de resultado falar uma cor diferente da landing.
     Os valores e as fórmulas abaixo são os MESMOS que a landing PT já declarava inline
     (b/landing.html:41-47), então a landing não muda de cor — a página de resultado é que
     passa a herdar o azul certo em vez de sobrescrever nada.
     Contraste medido (WCAG 2.1, 2026-08-11): branco sobre --primary = 5,70:1 (AA corpo);
     --primary sobre branco = 5,70:1; branco sobre --primary-ink = 9,24:1. */
  --primary: #0e6ba8;
  --primary-ink: color-mix(in srgb, var(--primary) 62%, #1b1235);
  --primary-lift: color-mix(in srgb, var(--primary) 45%, #fff);
  --accent: #2fb6c4;
  --accent-ink: color-mix(in srgb, var(--accent) 55%, #06202a);
  --accent-lift: color-mix(in srgb, var(--accent) 55%, #fff);

  /* status (light) */
  --green: #15803d;
  --amber: #b45309;
  --red: #dc2626;

  /* neutrals (light / paper) */
  --ink: #151824;
  --ink-soft: #565d72;
  --paper: #ffffff;
  --paper-2: #f7f8fc;
  --line: #e6e8f1;

  /* channel */
  --wa: #25D366;
  --wa-strong: #0a7d55;
  --wa-ink: #0b141a;

  /* primary-derived tints (re-tint the whole system by changing --primary) */
  --primary-tint:   color-mix(in srgb, var(--primary) 5%, #fff);
  --primary-tint-2: color-mix(in srgb, var(--primary) 11%, #fff);
  --primary-line:   color-mix(in srgb, var(--primary) 22%, #fff);

  /* semantic surface aliases (theme-swappable) */
  --bg: var(--paper-2);
  --surface: var(--paper);
  --text: var(--ink);
  --text-muted: var(--ink-soft);
  --border: var(--line);

  /* typography */
  --font-display: "Fraunces", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --font-body: "Inter", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700;
  --lh-tight: 1.04; --lh-heading: 1.12; --lh-snug: 1.4; --lh-body: 1.62;
  --tr-display: -0.025em; --tr-heading: -0.014em; --tr-kicker: 0.15em;

  /* spacing */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px;
  --sp-8: 32px; --sp-10: 40px; --sp-12: 48px; --sp-16: 64px; --sp-20: 80px; --sp-24: 96px;
  --gutter: 24px; --maxw: 1080px; --maxw-narrow: 680px;
  --section-y: clamp(56px, 9vh, 96px); --hero-y: clamp(56px, 11vh, 104px);

  /* radii */
  --r-sm: 8px; --r-md: 11px; --r-lg: 13px; --r-xl: 16px; --r-2xl: 20px; --r-3xl: 24px; --r-pill: 999px;

  /* shadows */
  --sh-xs: 0 1px 2px rgba(21,24,36,.04);
  --sh-sm: 0 1px 3px rgba(21,24,36,.05);
  --sh-card: 0 1px 3px rgba(21,24,36,.05), 0 24px 60px -40px rgba(21,24,36,.35);
  --sh-lift: 0 20px 44px -30px rgba(21,24,36,.4);
  --sh-cta: 0 10px 24px -12px color-mix(in srgb, var(--primary) 70%, transparent);
  --sh-modal: 0 30px 80px -30px rgba(21,24,36,.5);

  /* motion */
  --d-fast: 120ms; --d-base: 150ms; --d-slow: 180ms; --d-ring: 1400ms;
  --ease-out: cubic-bezier(.2,.7,.3,1);
  --ease-spring: cubic-bezier(.34,1.4,.5,1);
}

/* DARK app-shell surface. Opt in with data-theme="dark", or auto via prefers-color-scheme.
   Status colors lift to their dark-safe variants; shadows soften. */
:root[data-theme="dark"] {
  --primary-ink: var(--primary-lift);
  --green: #4ade80;
  --amber: #fbbf24;
  --red: #f87171;

  --bg: #0b0d12;
  --surface: #151922;
  --text: #e8eaf0;
  --text-muted: #9aa1b1;
  --border: #262c3a;

  --primary-tint:   color-mix(in srgb, var(--primary) 22%, #10131b);
  --primary-tint-2: color-mix(in srgb, var(--primary) 30%, #10131b);
  --primary-line:   color-mix(in srgb, var(--primary) 40%, #10131b);

  --sh-card: 0 1px 3px rgba(0,0,0,.4), 0 24px 60px -40px rgba(0,0,0,.7);
  --sh-lift: 0 20px 44px -30px rgba(0,0,0,.75);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --primary-ink: var(--primary-lift);
    --green: #4ade80; --amber: #fbbf24; --red: #f87171;
    --bg: #0b0d12; --surface: #151922; --text: #e8eaf0; --text-muted: #9aa1b1; --border: #262c3a;
    --primary-tint:   color-mix(in srgb, var(--primary) 22%, #10131b);
    --primary-tint-2: color-mix(in srgb, var(--primary) 30%, #10131b);
    --primary-line:   color-mix(in srgb, var(--primary) 40%, #10131b);
  }
}