/* ============================================================
   SETEVIAS — variables.css
   Custom properties usadas em todo o site. Mudar aqui reflete
   em tudo — evita cor/medida "solta" espalhada pelos arquivos.
   Paleta: navy/preto + verde 7V + cyan — "retro-future infra",
   não paleta de operadora de telecom.
   ============================================================ */

:root {
  /* --- cor --- */
  --bg: #01070c;
  --bg-2: #03101a;
  --panel: rgba(4, 19, 30, .82);

  --green: #68ff38;
  --green-soft: #78d600;

  --cyan: #21d9ff;
  --blue: #008cff;

  --white: #f5f9fb;
  --text: #b9cad4;
  --muted: #708794;

  --line: rgba(33, 217, 255, .20);
  --line-green: rgba(104, 255, 56, .25);

  /* Vermelho de alerta — usado com moderação na narrativa de
     Segurança/Perícia (ameaças, risco), nunca como cor de marca. */
  --red-alert: #ff4d4d;

  /* --- layout --- */
  --max-width: 1400px;
  --header-h: 74px;
  --radius: 2px;
  /* bordas quase retas — HUD técnico, não "card fofo" de SaaS */

  /* --- tipografia --- */
  --font-ui: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", "Fira Code", ui-monospace, Menlo, Consolas, monospace;

  /* --- movimento --- */
  --ease: cubic-bezier(.2, .7, .2, 1);

  /* --- header scrolled (ver .header.scrolled em components.css) --- */
  --header-bg-top: rgba(1, 7, 12, .82);
  --header-bg-scrolled: rgba(1, 7, 12, .94);
}