/* NYX — tokens.css. Gerado de tokens.json; não edite à mão: altere tokens.json e gere de novo. */

@font-face { font-family: "Sora"; src: url("fonts/Sora-Variable-latin.woff2") format("woff2"); font-weight: 100 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("fonts/Inter-Variable-latin.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }

/* Tema Noite */
:root, [data-theme="noite"] {
  --azul-noite: #0B1026;
  --preto-profundo: #05060F;
  --indigo-nyx: #3A2A7A;
  --prata-lunar: #C9D1E0;
  --ciano-inovacao: #5FD4F4;
  --bg: #05060F;
  --surface: #0B1026;
  --surface-raised: #121836;
  --glass: rgba(201, 209, 224, 0.04);
  --glass-hover: rgba(201, 209, 224, 0.07);
  --line-top: rgba(201, 209, 224, 0.16);
  --line: rgba(201, 209, 224, 0.08);
  --line-faint: rgba(201, 209, 224, 0.05);
  --line-strong: rgba(201, 209, 224, 0.30);
  --ink-strong: #F2F4FA;
  --ink: #C9D1E0;
  --ink-muted: #8A93AB;
  --ink-faint: rgba(201, 209, 224, 0.18);
  --accent: #5FD4F4;
  --on-accent: #05060F;
  --accent-soft: rgba(95, 212, 244, 0.12);
  --accent-glow: rgba(95, 212, 244, 0.35);
  --indigo-glow: rgba(58, 42, 122, 0.55);
  --focus: #5FD4F4;
  --success: #7EE0B0;
  --danger: #FF9A8B;
  --shadow-panel: 0 8px 32px 0 rgba(0, 0, 0, 0.30);
  --shadow-panel-hover: 0 15px 40px rgba(95, 212, 244, 0.10);
  --glow-accent: 0 0 25px rgba(95, 212, 244, 0.30), 0 8px 40px rgba(95, 212, 244, 0.15);
  --glow-accent-hover: 0 0 50px 10px rgba(95, 212, 244, 0.40);
  --glow-eclipse: 0 0 30px rgba(95, 212, 244, 0.22), inset 0 0 24px rgba(58, 42, 122, 0.45);
  color-scheme: dark;
}

/* Tema Dia */
[data-theme="dia"] {
  --bg: #F4F6FB;
  --surface: #FFFFFF;
  --surface-raised: #E9EDF5;
  --glass: rgba(11, 16, 38, 0.03);
  --glass-hover: rgba(11, 16, 38, 0.06);
  --line-top: rgba(11, 16, 38, 0.16);
  --line: rgba(11, 16, 38, 0.10);
  --line-faint: rgba(11, 16, 38, 0.06);
  --line-strong: rgba(11, 16, 38, 0.32);
  --ink-strong: #05060F;
  --ink: #0B1026;
  --ink-muted: #56607D;
  --ink-faint: rgba(11, 16, 38, 0.22);
  --accent: #086580;
  --on-accent: #FFFFFF;
  --accent-soft: rgba(8, 101, 128, 0.10);
  --accent-glow: rgba(8, 101, 128, 0.25);
  --indigo-glow: rgba(58, 42, 122, 0.18);
  --focus: #086580;
  --success: #1B6E4A;
  --danger: #B42318;
  --shadow-panel: 0 8px 32px 0 rgba(11, 16, 38, 0.08);
  --shadow-panel-hover: 0 15px 40px rgba(8, 101, 128, 0.12);
  --glow-accent: 0 0 20px rgba(8, 101, 128, 0.18), 0 8px 30px rgba(8, 101, 128, 0.10);
  --glow-accent-hover: 0 0 36px 6px rgba(8, 101, 128, 0.22);
  --glow-eclipse: 0 0 24px rgba(8, 101, 128, 0.14), inset 0 0 20px rgba(58, 42, 122, 0.08);
  color-scheme: light;
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --space-32: 128px;
  --radius-xs: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-pill: 9999px;
  --gradient-eclipse: linear-gradient(135deg, #05060F 0%, #3A2A7A 100%);
  --gradient-luar: linear-gradient(90deg, #F2F4FA 0%, #C9D1E0 55%, #6E7894 100%);
  --gradient-feixe: linear-gradient(180deg, rgba(95, 212, 244, 0) 0%, rgba(95, 212, 244, 0.8) 50%, rgba(95, 212, 244, 0) 100%);
  --gradient-borda: linear-gradient(180deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0) 100%);
  --blur-glass: 16px;
  --blur-reveal: 8px;
  --blur-halo: 64px;
  --ease-reveal: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-glass: cubic-bezier(0.4, 0, 0.2, 1);
  --container: 1280px;
  --columns: 12;
  --nav-height: 96px;
  --font-display: "Sora", "Space Grotesk", system-ui, sans-serif;
  --font-sans: "Inter", "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

/* Estilos de texto */
.display { font-family: var(--font-display); font-size: 96px; line-height: 86px; font-weight: 600; letter-spacing: -0.045em; }
.h1 { font-family: var(--font-display); font-size: 72px; line-height: 76px; font-weight: 600; letter-spacing: -0.035em; }
.h2 { font-family: var(--font-display); font-size: 48px; line-height: 52px; font-weight: 600; letter-spacing: -0.025em; }
.h3 { font-family: var(--font-display); font-size: 30px; line-height: 36px; font-weight: 600; letter-spacing: -0.015em; }
.h4 { font-family: var(--font-display); font-size: 20px; line-height: 28px; font-weight: 600; letter-spacing: -0.01em; }
.stat { font-family: var(--font-display); font-size: 40px; line-height: 44px; font-weight: 300; letter-spacing: -0.03em; }
.lead { font-family: var(--font-sans); font-size: 18px; line-height: 28px; font-weight: 500; }
.body { font-family: var(--font-sans); font-size: 16px; line-height: 26px; font-weight: 400; }
.body-sm { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 400; }
.caption { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 400; }
.eyebrow { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: 0.24em; text-transform: uppercase; }
.nav { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; }
.button { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 500; letter-spacing: -0.005em; }
.numeral { font-family: var(--font-mono); font-size: 12px; line-height: 16px; font-weight: 400; letter-spacing: 0.04em; }
.code { font-family: var(--font-mono); font-size: 13px; line-height: 20px; font-weight: 400; }

@media (max-width: 767px) { .display { font-size: 72px; line-height: 76px; letter-spacing: -0.035em; } .h1 { font-size: 48px; line-height: 52px; letter-spacing: -0.025em; } }