/* Taglia — tokens.css v6 (gerado de tokens.json por gerar-tokens-css.js; não edite à mão). */

@font-face { font-family: "Aspekta"; src: url("fonts/Aspekta-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Aspekta"; src: url("fonts/Aspekta-450.woff2") format("woff2"); font-weight: 450; font-style: normal; font-display: swap; }
@font-face { font-family: "Aspekta"; src: url("fonts/Aspekta-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "DM Mono"; src: url("fonts/DMMono-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }

/* Tema escuro (padrão) */
:root, .tg-dark, [data-theme="dark"] {
  color-scheme: dark;
  --neon-pink: #ff2a6d;
  --neon-cyan: #7df9ff;
  --neon-green: #39ff14;
  --neon-yellow: #ffcc00;
  --pink-deep: #d6004a;
  --cyan-deep: #007a80;
  --green-deep: #157f00;
  --night: #0a0f1c;
  --logo-cereja: #ff266f;
  --logo-prata: #eaeff2;
  --logo-preto: #000000;
  --paper: #f6f6fa;
  --mist: #f1f1f7;
  --white: #ffffff;
  --line-100: #e0e1e6;
  --gray-300: #bbbdc8;
  --gray-400: #9d9fae;
  --gray-500: #6f707e;
  --gray-600: #535462;
  --gray-700: #43444e;
  --snow: #f6f6fa;
  --surface: var(--night);
  --surface-raised: rgba(255, 255, 255, 0.04);
  --tag-bg: rgba(255, 255, 255, 0.05);
  --tag-icon-bg: rgba(255, 255, 255, 0.08);
  --text: var(--snow);
  --text-body: var(--gray-300);
  --text-meta: rgba(255, 255, 255, 0.55);
  --text-faint: rgba(255, 255, 255, 0.35);
  --line: rgba(255, 255, 255, 0.06);
  --border: rgba(255, 255, 255, 0.12);
  --accent-cyan: var(--neon-cyan);
  --accent-pink: var(--neon-pink);
  --accent-green: var(--neon-green);
  --action-bg: var(--neon-pink);
  --action-fg: var(--night);
  --action-icon-bg: var(--night);
  --action-icon-fg: var(--neon-pink);
  --secondary-bg: rgba(255, 255, 255, 0.05);
  --attention-bg: var(--neon-yellow);
  --attention-fg: var(--night);
  --focus: var(--neon-cyan);
}

/* Seção ou página clara: class="tg-light" */
.tg-light, [data-theme="light"] {
  color-scheme: light;
  --surface: var(--paper);
  --surface-raised: var(--white);
  --tag-bg: var(--mist);
  --tag-icon-bg: var(--white);
  --text: var(--night);
  --text-body: var(--gray-700);
  --text-meta: var(--gray-500);
  --text-faint: var(--gray-300);
  --line: var(--line-100);
  --border: rgba(10, 15, 28, 0.15);
  --accent-cyan: var(--cyan-deep);
  --accent-pink: var(--pink-deep);
  --accent-green: var(--green-deep);
  --secondary-bg: rgba(0, 0, 0, 0.05);
  --focus: var(--cyan-deep);
}

:root {
  --font-sans: "Aspekta", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "DM Mono", ui-monospace, monospace;
  --space-inset: 2px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-section: 72px;
  --radius-corner: 3px;
  --radius-xs: 8px;
  --radius-sm: 10px;
  --radius-md: 15px;
  --radius-lg: 18px;
  --radius-highlight: 26px;
  --radius-pill: 999px;
  --shadow-highlight: 1px 0px 1px 0px #ffffff;
  --shadow-card: 0px 14px 9px 0px rgba(0, 0, 0, 0.01), 0px 6px 6px 0px rgba(0, 0, 0, 0.02), 0px 3px 3px 0px rgba(0, 0, 0, 0.02);
  --shadow-nav-cta: inset 0px 5px 6.5px 0px rgba(255, 255, 255, 0.2);
  --glow-text: 0px 0px 20px rgba(255, 255, 255, 0.35);
  --container: 1105px;
  --section-inner: 1169px;
  --cell-height: 220px;
  --rail-width: 1px;
  --fade-sm: 15%;
  --fade-md: 30%;
  --fade-lg: 40%;
  --logo-min-primaria: 120px;
  --logo-min-nome: 80px;
  --logo-min-submark: 20px;
}

/* Estilos de texto */
.tg-display { font-family: var(--font-sans); font-size: 64px; line-height: 76.8px; font-weight: 400; letter-spacing: -1px; }
.tg-stat { font-family: var(--font-sans); font-size: 55px; line-height: 71.5px; font-weight: 400; letter-spacing: -0.55px; }
.tg-heading-lg { font-family: var(--font-sans); font-size: 47px; line-height: 56.4px; font-weight: 400; letter-spacing: -0.235px; }
.tg-heading { font-family: var(--font-sans); font-size: 36px; line-height: 46.8px; font-weight: 400; }
.tg-lead { font-family: var(--font-sans); font-size: 27px; line-height: 35.1px; font-weight: 400; }
.tg-title { font-family: var(--font-sans); font-size: 15px; line-height: 18px; font-weight: 500; }
.tg-body { font-family: var(--font-sans); font-size: 16px; line-height: 20.8px; font-weight: 400; }
.tg-body-sm { font-family: var(--font-sans); font-size: 15px; line-height: 21px; font-weight: 400; }
.tg-body-long { font-family: var(--font-sans); font-size: 15px; line-height: 24px; font-weight: 400; }
.tg-nav { font-family: var(--font-sans); font-size: 13px; line-height: 16.9px; font-weight: 400; }
.tg-button { font-family: var(--font-sans); font-size: 13px; line-height: 15.6px; font-weight: 500; }
.tg-eyebrow { font-family: var(--font-sans); font-size: 11px; line-height: 14.3px; font-weight: 400; }
.tg-label { font-family: var(--font-mono); font-size: 13px; line-height: 16.9px; font-weight: 400; text-transform: uppercase; }
.tg-label-sm { font-family: var(--font-mono); font-size: 12px; line-height: 15.6px; font-weight: 400; text-transform: uppercase; }
.tg-index { font-family: var(--font-mono); font-size: 11px; line-height: 13.2px; font-weight: 400; }
