/*
  Base compartilhada entre as páginas do site (index, formacao, cartao).
  Reúne o que é idêntico nas três: paleta de cores, reset, textura de
  ruído de fundo, sistema de "reveal" ao rolar a página, acessibilidade
  de foco de teclado e respeito à preferência de redução de movimento.
  Cada página mantém no próprio <style> apenas o que é específico dela.
*/

:root {
  --navy:       #0D1520;
  --navy-mid:   #111C2A;
  --navy-light: #172438;
  --orange:     #D4732A;
  --amber:      #CE8D38;
  --gold:       #C9A84C;
  --gold-light: #E8C170;
  --white:      #FFFFFF;
  --text-2:     rgba(255,255,255,.55);
  --text-3:     rgba(255,255,255,.28);
  --grad:       linear-gradient(135deg, var(--orange) 0%, var(--gold) 100%);
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }

/* TEXTURA DE RUÍDO — leve grão sobre o fundo, comum às três páginas */
.grain {
  content:'';
  position:fixed; inset:0;
  pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23g)' opacity='.07'/%3E%3C/svg%3E");
}

/* REVEAL — animação de entrada dos blocos ao rolar a página */
.rv { opacity:0; transform:translateY(28px); transition:opacity .8s ease, transform .8s ease; }
.rv.on { opacity:1; transform:translateY(0); }
.rv-d1 { transition-delay:.1s; }
.rv-d2 { transition-delay:.2s; }
.rv-d3 { transition-delay:.3s; }
.rv-d4 { transition-delay:.4s; }
.rv-d5 { transition-delay:.5s; }

/* ACESSIBILIDADE — foco visível para navegação por teclado */
a:focus-visible,
button:focus-visible,
input:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--gold-light);
  outline-offset: 3px;
}

/* Link para pular direto ao conteúdo, só aparece ao navegar por teclado */
.skip-link {
  position:absolute; left:0; top:0;
  transform:translateY(-120%);
  background:var(--gold);
  color:var(--navy);
  font-family:'Barlow Condensed', sans-serif;
  font-size:12px; font-weight:700; letter-spacing:.15em; text-transform:uppercase;
  padding:12px 20px;
  z-index:1000;
  text-decoration:none;
  transition:transform .2s;
}
.skip-link:focus {
  transform:translateY(0);
}

/* Respeita a preferência do visitante por menos movimento na tela */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after {
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  .rv { opacity:1; transform:none; }
}
</content>
