/* Hallmark · macrostructure: app shell (dashboard) + Long Document landing · tone: premium quieto, festa só no dinheiro · anchor hue: azul 218° / recompensa amarelo 44°
 * theme: studied-DNA (source: design/DIRECAO-VISUAL.md v1 · AXIOM com amarelo) · display + body: Plus Jakarta Sans
 * Tokens copiados da seção 2 da direção visual. Nada de cor ou fonte fora deste arquivo.
 */
:root {
  /* shadcn */
  --background: #080A0F;         --foreground: #F4F5F7;
  --card: #131924;               --card-foreground: #F4F5F7;
  --popover: #1A2230;            --popover-foreground: #F4F5F7;
  --primary: #2070F0;            --primary-foreground: #FFFFFF;  --primary-hover: #1A62D6;
  --secondary: #1A2230;          --secondary-foreground: #F4F5F7;  --secondary-hover: #222C3C;
  --muted: #0D1118;              --muted-foreground: #808A9A;
  --accent: #1A2230;             --accent-foreground: #F4F5F7;
  --destructive: #CE3F3F;        --destructive-foreground: #FFFFFF;
  --border: #273140;
  --input: #5A6678;
  --ring: #61A0FF;
  --radius: 1rem;
  --chart-1: #2979FF; --chart-2: #61A0FF; --chart-3: #354153; --chart-4: #FFC21A; --chart-5: #32C785;

  /* Lucrai */
  --brand-blue: #2979FF;  --brand-blue-hi: #61A0FF;  --premium: #C8CDD4;  --premium-hi: #E6E9ED;
  --reward: #FFC21A;  --reward-hi: #FFD55C;  --reward-press: #E0A800;
  --reward-foreground: #080A0F;  --reward-soft: rgba(255,194,26,.14);
  --success: #32C785;  --success-foreground: #080A0F;  --success-soft: rgba(50,199,133,.14);
  --warning: #FF9A3D;
  --danger-text: #EF5B5B;
  --card-hi: #1A2230;  --sunken: #05070B;  --scrim: rgba(5,7,11,.72);  --scrim-strong: rgba(5,7,11,.9);
  --blue-soft: rgba(41,121,255,.14);
  --flash: #FFFFFF;
  --nav-glass: rgba(13,17,24,.78);  --nav-solid: rgba(13,17,24,.95);

  /* sombra e brilho */
  --shadow-1: 0 1px 2px rgba(5,7,11,.40);
  --shadow-2: 0 8px 24px -12px rgba(5,7,11,.70);
  --shadow-3: 0 24px 60px -24px rgba(5,7,11,.85);
  --glow-blue:   0 0 0 1px rgba(41,121,255,.35), 0 12px 36px -14px rgba(41,121,255,.45);
  --glow-reward: 0 0 0 1px rgba(255,194,26,.40), 0 16px 40px -16px rgba(255,194,26,.45);

  /* os ÚNICOS gradientes permitidos */
  --field-blue:   radial-gradient(120% 80% at 50% -10%, rgba(41,121,255,.18), transparent 60%);
  --field-reward: radial-gradient(90% 70% at 85% 0%, rgba(255,194,26,.10), transparent 60%);
  --hairline-grid: linear-gradient(rgba(39,49,64,.5) 1px,transparent 1px), linear-gradient(90deg,rgba(39,49,64,.5) 1px,transparent 1px);
  --sheen: linear-gradient(110deg, transparent 40%, rgba(255,255,255,.22) 50%, transparent 60%);
  --mask-edge: radial-gradient(closest-side, #000 72%, transparent); /* máscara que apaga a borda quadrada das ilustrações */
  --scrim-bottom: linear-gradient(180deg, transparent, rgba(8,10,15,.92) 55%);

  /* movimento */
  --dur-instant: 90ms; --dur-fast: 140ms; --dur-base: 200ms; --dur-slow: 320ms; --dur-reveal: 520ms;
  --ease-standard: cubic-bezier(.2,0,0,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --ease-in: cubic-bezier(.7,0,.84,0);
  --ease-in-out: cubic-bezier(.65,0,.35,1);
  --press-scale: .985;

  /* tipografia */
  --font-sans: "Plus Jakarta Sans", -apple-system, "Segoe UI", Roboto, sans-serif;
  --text-display: 2.5rem;  /* 40 */
  --text-h1: 2rem;         /* 32 */
  --text-h2: 1.5rem;       /* 24 */
  --text-h3: 1.25rem;      /* 20 */
  --text-body: 1rem;       /* 16 */
  --text-small: .875rem;   /* 14 */
  --text-caption: .75rem;  /* 12 */

  /* espaço (4 pt) */
  --space-3xs: 4px; --space-2xs: 8px; --space-xs: 12px; --space-sm: 16px; --space-md: 20px;
  --space-lg: 24px; --space-xl: 32px; --space-2xl: 40px; --space-3xl: 56px; --space-4xl: 80px; --space-5xl: 120px;

  --radius-sm: 12px; --radius-md: 14px; --radius-lg: 16px; --radius-xl: 20px; --radius-pill: 999px;
  --banner-height: 64px;
  --z-nav: 300; --z-sheet: 400; --z-overlay: 500; --z-toast: 600; --z-confetti: 700;

  /* ---------- v2 (16/09): acabamento. Seção "v2" da direção visual vence as anteriores. ---------- */
  --film-bg: #06090C;                          /* cor exata do fundo do vídeo do hero (medida no quadro) */
  --film-bg-rgb: 6, 9, 12;
  --film-edge: rgb(5, 7, 11);                  /* cor do fundo do vídeo como aparece na tela (medida no print) */
  --edge-hi: rgba(255,255,255,.16);            /* borda 1px em gradiente: branco 16% → transparente */
  --edge-lo: rgba(255,255,255,.03);
  --edge-blue: rgba(97,160,255,.38);
  --edge-gold: rgba(255,213,92,.42);
  --border-gradient: linear-gradient(160deg, var(--edge-hi), var(--edge-lo) 42%, var(--edge-lo) 70%, rgba(97,160,255,.22));
  --border-gradient-reward: linear-gradient(160deg, rgba(255,213,92,.5), var(--edge-lo) 45%, rgba(97,160,255,.28));
  --spot-blue: rgba(97,160,255,.16);
  --spot-gold: rgba(255,213,92,.14);
  --glass: rgba(13,17,24,.58);
  --glass-strong: rgba(13,17,24,.74);
  --glass-hi: rgba(26,34,48,.55);
  --shine: rgba(255,255,255,.08);
  --text-gradient: linear-gradient(180deg, #FFE08A 0%, var(--reward) 55%, #F2A900 100%);  /* só no número herói e em 1 palavra de título */
  --text-gradient-blue: linear-gradient(100deg, var(--brand-blue-hi), #9CC4FF 50%, var(--reward-hi));
  --halo-blue: radial-gradient(closest-side, rgba(41,121,255,.35), transparent);
  --halo-gold: radial-gradient(closest-side, rgba(255,194,26,.28), transparent);
  --scrim-film: linear-gradient(90deg, rgba(var(--film-bg-rgb),.92) 0%, rgba(var(--film-bg-rgb),.55) 34%, rgba(var(--film-bg-rgb),0) 58%);
  --scrim-film-mobile: linear-gradient(180deg, rgba(var(--film-bg-rgb),.96) 0%, rgba(var(--film-bg-rgb),.72) 38%, rgba(var(--film-bg-rgb),0) 62%);
  /* ruído SVG (grain) — opacidade controlada por quem usa, 3–5% */
  --grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  --text-hero: clamp(2.5rem, 6.4vw, 6rem);      /* 40 → 96 */
  --text-section: clamp(2.25rem, 5vw, 4.5rem);  /* 36 → 72 */
  --text-giant: clamp(4.5rem, 13vw, 11rem);
  --tracking-display: -0.035em;
  --ease-spring-out: cubic-bezier(.34,1.3,.64,1); /* só objeto físico (placa, selo, moeda) */
  /* celular desenhado da página de vendas (mesma paleta do vídeo: metal azul com fio dourado) */
  --phone-metal: linear-gradient(150deg, #22375E 0%, #0A0E17 38%, #07090E 62%, #4A370C 100%);
  --phone-rim-blue: rgba(97,160,255,.55);
  --phone-rim-gold: rgba(255,194,26,.45);
  --phone-screen: #070A10;
  --stroke-text: rgba(200,205,212,.28);
}
@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur-base: 0ms; --dur-slow: 0ms; --dur-reveal: 150ms; --press-scale: 1; }
}