/* ==========================================================================
   Reset, tipografia base e utilitários
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box; margin:0; padding:0}

html{
  scroll-behavior:smooth;
  scroll-padding-top:84px; /* âncoras não somem sob a topbar sticky */
}

body{
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--paper);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

h1,h2,h3{
  font-family:'Russo One', var(--font-display);
  font-weight:400;
  line-height:1.16;
  letter-spacing:-.005em;
  color:var(--abyss);
}
h1{font-size:var(--fs-h1)}
h2{font-size:var(--fs-h2)}
h3{font-size:var(--fs-h3)}

img,svg{max-width:100%; display:block}
a{color:inherit}
ul,ol{list-style:none}

::selection{background:var(--turquoise); color:var(--abyss-d)}

:focus-visible{outline:3px solid var(--turquoise); outline-offset:2px; border-radius:4px}

.mono{font-family:var(--font-mono); letter-spacing:.04em}

.wrap{max-width:1120px; margin:0 auto; padding:0 24px}
.wrap--narrow{max-width:800px}

section{padding:var(--section-pad) 0}

/* Cabeçalho padrão de seção -------------------------------------------------*/
.section-head{max-width:720px; margin-bottom:48px}
.section-head--center{margin-inline:auto; text-align:center}
.section-head h2{margin:14px 0 0}
.section-head__lead{margin-top:16px; font-size:var(--fs-lead); color:var(--muted)}

.eyebrow{
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--turquoise-d);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.eyebrow::before{content:""; width:16px; height:1px; background:currentColor; opacity:.6}
.eyebrow--on-dark{color:var(--turquoise)}

.lead{font-size:var(--fs-lead); color:var(--on-dark-muted); margin-top:18px}
.lead strong, .lead em{color:var(--on-dark)}

/* Grid utilitária -------------------------------------------------------------*/
.grid{display:grid; gap:22px}
.grid--3{grid-template-columns:repeat(auto-fit, minmax(min(300px,100%), 1fr))}

/* Acessibilidade ---------------------------------------------------------------*/
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

.skip-link{
  position:absolute; left:-999px; top:0; background:var(--coral); color:var(--abyss-d);
  padding:12px 20px; z-index:100; border-radius:0 0 8px 0; font-weight:700;
}
.skip-link:focus{left:0}

/* Entrada por scroll — desativada com prefers-reduced-motion --------------------*/
[data-reveal]{opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease}
[data-reveal].is-visible{opacity:1; transform:translateY(0)}

@media(prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important; transition-duration:.01ms !important}
  [data-reveal]{opacity:1; transform:none}
}

@media(max-width:820px){
  section{padding:var(--section-pad-sm) 0}
  .section-head{margin-bottom:36px}
}