/* ============================================================
   ASTRON — TOKENS
   Único lugar onde cor, fonte e medida são definidas.
   Nenhum outro arquivo escreve valor cru.
   ============================================================ */

:root {
  /* --- Paleta da marca --- */
  --lime: #8CFF00;
  --teal: #0C4651;
  --ink: #070707;
  --gray: #898A8E;
  --bone: #F8F7F2;

  /* --- Papéis --- */
  --bg: var(--ink);
  --fg: var(--bone);
  --fg-mute: var(--gray);
  --accent: var(--lime);

  /* --- Tipografia --- */
  --font: 'Space Grotesk', system-ui, -apple-system, sans-serif;

  /* Escala fluida: cresce com a largura, mas com piso e teto.
     O teto impede que em 4K e ultrawide o texto vire outdoor. */
  --t-hero: clamp(2.75rem, 7vw, 8.5rem);
  --t-lead: clamp(1.05rem, 1.5vw, 1.75rem);
  --t-ui: clamp(0.75rem, 0.85vw, 0.95rem);

  /* --- Medidas --- */
  --maxw: 1440px;
  /* trava de leitura em telas largas */
  --pad: clamp(1.5rem, 5vw, 6rem);
  --nav-h: 56px;

  /* Afastamento do menu até o rodapé. Era um clamp escrito direto
     no nav.css; virou token porque a moldura precisa alinhar os
     textos de baixo pelo CENTRO do menu, e repetir a conta em três
     breakpoints seria pedir para uma delas ficar para trás. */
  --nav-bottom: calc(clamp(0.75rem, 2vh, 1.5rem) + 25px);

  /* A linha média do menu, contada do rodapé. É por ela que os
     cantos inferiores da moldura se alinham — e, por simetria, é a
     mesma distância que os superiores usam a partir do topo. */
  --moldura-y: calc(var(--nav-bottom) + var(--nav-h) / 2);

  /* --- Vidro do menu (valores trocados por JS conforme a seção) --- */
  --glass-bg: rgba(17, 17, 17, 0.55);
  --glass-border: rgba(248, 247, 242, 0.14);
  --glass-fg: var(--bone);
  --glass-mute: rgba(248, 247, 242, 0.55);

  /* --- Movimento --- */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 0.4s;
}

/* Ultrawide: mais respiro lateral, sem esticar a linha de leitura */
@media (min-width: 2200px) {
  :root {
    --maxw: 1720px;
  }
}

/* Monitor baixo (1366x768 e notebooks antigos):
   sobra largura, falta altura. Tudo encolhe na vertical. */
@media (max-height: 800px) {
  :root {
    --t-hero: clamp(2.25rem, 5.5vw, 4.5rem);
    --pad: clamp(1.25rem, 3.5vw, 3rem);
    --nav-h: 48px;
  }
}

/* Mobile */
@media (max-width: 768px) {
  :root {
    --t-hero: clamp(2.25rem, 11vw, 3.5rem);
    --nav-h: 52px;
  }
}