/* =========================================================
   Base — reset, body, utilidades globais
   ========================================================= */

*,*::before,*::after { box-sizing: border-box }

html {
  scroll-behavior: smooth;
  background: var(--areia);
  scroll-padding-top: 8rem;
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto } }

body {
  margin: 0;
  background: var(--areia);
  color: var(--musgo);
  font-family: var(--corpo);
  font-size: clamp(1rem, .4vw + .92rem, 1.08rem);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block }
a   { color: inherit }

h1,h2,h3,
.botao,.menu a,.passo-num,.marca-nome,dt,summary,cite,.sobrancelha {
  font-family: var(--display);
}

.lima { color: var(--folha) }

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

.pular {
  position: absolute; left: -9999px; top: 0; z-index: 99;
  background: var(--musgo); color: var(--areia);
  padding: .7rem 1.1rem; font-weight: 600;
}
.pular:focus { left: .5rem; top: .5rem }

/* Estrutura */
.cerca        { width: min(100% - 2.5rem, var(--cerca)); margin-inline: auto }
.cerca-estreita { width: min(100% - 2.5rem, 760px) }

.sobrancelha {
  font-size: .74rem; text-transform: uppercase; letter-spacing: .2em;
  color: var(--folha); margin: 0 0 1.1rem; font-weight: 600;
}

.titulo-grande {
  font-family: var(--display);
  font-size: clamp(2.4rem, 6.5vw, 5.2rem);
  font-weight: 800; letter-spacing: -.035em; line-height: 1;
  text-align: center; color: var(--musgo);
  margin: 0 0 clamp(3rem,6vw,4.5rem); padding-inline: 1.25rem;
}

.titulo-secao {
  font-size: clamp(1.9rem, 3.6vw, 3.1rem);
  font-weight: 700; letter-spacing: -.03em; line-height: 1.06;
  color: var(--musgo); margin: 0 0 1rem; max-width: 19ch;
}

.apoio       { color: var(--texto-suave); max-width: 56ch; margin: 0 0 3rem }
.apoio-largo { max-width: 60ch }
.apoio-centro { text-align: center; margin-inline: auto }

.mini-titulo {
  font-size: .76rem; text-transform: uppercase; letter-spacing: .18em;
  color: var(--salvia); margin: 2.6rem 0 .9rem; font-weight: 600;
}
.mini-titulo-centro { text-align: center; margin-top: 0 }

.nota       { font-size: .83rem; color: var(--texto-suave); font-style: italic; opacity: .85; margin-top: 1.4rem }
.nota-centro { text-align: center; max-width: 62ch; margin-inline: auto }
