/* ============================================================
   UPWINS · TOKENS
   Reset e sistema de cor. Lido por todas as páginas antes de
   qualquer outra folha.

   SISTEMA DE COR
   Rampa gerada em OKLCH a partir do azul da marca (#000673 = blue-800,
   L .257 · C .170 · H 264.2). O matiz 264.2 é mantido em todos os degraus;
   a croma é reduzida só onde o sRGB não comporta. Os neutros saem do mesmo
   matiz com croma quase nula, então o cinza tem cast azul e a página inteira
   pertence a uma família só.

   REGRAS TRAVADAS
   - Dois raios, com regra: o que está no fluxo usa --radius (4px);
     o que flutua por cima do conteúdo usa --radius-float (12px).
   - Acento único: preto ou branco. Verde só em número positivo; vermelho
     uma vez por página, no dado de fracasso, e em erro de formulário.
   - Um tema por página: cada página tem no máximo um bloco invertido.
   - Site sem modo claro: só existe a paleta escura, sem alternância.
   ============================================================ */

/* ---------- 1. RESET ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body, h1, h2, h3, p, ul, ol, dl, dd, figure { margin: 0; }
ul[role="list"], ol[role="list"] { list-style: none; padding: 0; }
img, svg { display: block; max-width: 100%; height: auto; }
button, input, textarea { font: inherit; color: inherit; }
a { color: inherit; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ---------- 2. TOKENS ----------
   Site sem modo claro: a paleta escura mora direto em :root, sem
   media query nem data-theme. Não existe alternância para desfazer. */
:root {
  /* Rampa azul da marca */
  --blue-50:  #EFF5FF;
  --blue-100: #E0EAFF;
  --blue-200: #C2D7FF;
  --blue-300: #97B9FF;
  --blue-400: #6696FF;
  --blue-500: #396FF6;
  --blue-600: #2051D1;
  --blue-700: #0931A7;
  --blue-800: #000673;  /* marca */
  --blue-900: #000250;
  --blue-950: #00022D;

  /* Papel e superfícies (mesmo matiz, croma quase nula) */
  --canvas:          #080D16;
  --surface:         #101624;
  --surface-2:       #182133;
  --hairline:        #232D42;
  --hairline-strong: #33405C;

  /* Texto */
  --ink:   #EFF3F9;
  --body:  #B4BFD4;
  --muted: #8E99B0;

  /* Papéis funcionais. Sem azul: acento único vira preto ou branco. */
  --accent:        #FFFFFF;
  --accent-strong: #FFFFFF;
  --accent-hover:  rgba(255, 255, 255, .78);
  --accent-wash:   rgba(255, 255, 255, .08);
  --on-accent:     #06091F;

  --good:  #84C661;
  --alert: #FA6A58;

  /* Bloco invertido (só #plano) */
  --inv-bg:   #182133;
  --inv-bg-2: #202B42;
  --inv-line: rgba(255,255,255,.13);
  --inv-line-hover: rgba(255,255,255,.30);
  --inv-ink:  #EFF3F9;
  --inv-body: #B4BFD4;

  --shadow-sm: 0 1px 2px rgba(0,0,0,.5);
  --shadow-md: 0 12px 32px -16px rgba(0,0,0,.7);
  --shadow-lg: 0 24px 60px -28px rgba(0,0,0,.8);

  /* Tipografia */
  --font-sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;

  --fs-display: clamp(2.35rem, 1.5rem + 3.4vw, 4.25rem);
  --fs-h2:      clamp(1.85rem, 1.25rem + 2.2vw, 3rem);
  --fs-h3:      clamp(1.15rem, 1rem + .5vw, 1.5rem);
  --fs-lead:    clamp(1.05rem, .98rem + .35vw, 1.25rem);
  --fs-body:    1rem;
  --fs-sm:      .875rem;
  --fs-xs:      .8125rem;

  /* Ritmo */
  --shell:     1240px;
  --gutter:    clamp(1.25rem, .6rem + 2.5vw, 3rem);
  --section-y: clamp(5rem, 3rem + 8vw, 10rem);

  /* Dois raios, com regra: o que está no fluxo usa 4px; o que flutua por
     cima do conteúdo (barra solta, menu, CTA fixa) usa 12px. */
  --radius:       4px;
  --radius-float: 12px;

  /* Quanto o vidro avança para fora da linha de conteúdo. Limitado pela
     goteira para que no mobile ele ainda flutue em vez de encostar na tela. */
  --float-out: min(1.25rem, calc(var(--gutter) - .5rem));

  /* Camada de vidro. Aproximação web com backdrop-filter, não o material
     nativo da Apple. Sempre com fallback opaco logo abaixo. */
  --glass-bg:        rgba(16, 22, 36, .62);
  --glass-solid:     #121A2B;
  --glass-border:    rgba(255, 255, 255, .10);
  --glass-highlight: rgba(255, 255, 255, .14);
  --glass-shadow:    0 10px 34px -10px rgba(0, 0, 0, .70);
  --glass-blur:      blur(18px) saturate(180%);

  --ease: cubic-bezier(.16, 1, .3, 1);
  --ease-out: cubic-bezier(.33, 1, .68, 1);
  color-scheme: dark;
}