/* Base do núcleo — tokens vêm do painel (Aparência geral) via <style id="tokens"> */

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--fonte-corpo);
  color: var(--cor-texto);
  background: var(--cor-fundo);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

img, video { max-width: 100%; display: block; }
h1, h2, h3, h4 { font-family: var(--fonte-titulo); font-weight: 800; line-height: 1.1; margin: 0 0 1rem; }
p { margin: 0 0 1rem; }
a { color: inherit; }

.contener { width: min(100% - 2rem, 1200px); margin-inline: auto; }

.botao {
  display: inline-block;
  padding: .9rem 1.8rem;
  border-radius: 999px;
  background: var(--cor-primaria);
  color: #fff;
  font-weight: 600;
  text-decoration: none;
  transition: transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s;
}
.botao:hover { transform: translateY(-2px); box-shadow: 0 10px 30px rgba(0,0,0,.18); }
.logo-texto { font-family: var(--fonte-titulo); font-weight: 800; font-size: 1.6rem; }

/* ---------- Seção (casca comum a todas) ---------- */
.sec { position: relative; overflow: hidden; color: var(--sec-texto, inherit); }
.sec[data-espaco="p"] { --pad: 3rem; }
.sec[data-espaco="m"] { --pad: 5rem; }
.sec[data-espaco="g"] { --pad: 8rem; }
.sec__conteudo { position: relative; z-index: 2; padding-block: var(--pad, 5rem); }
.sec__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.sec__pelicula { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.sec__suave { opacity: .78; }

/* ---------- Efeitos: entrada, looping e saída ---------- */
:root { --fx-dur: 700ms; }
.sec[data-fx-vel="rapido"] { --fx-dur: 400ms; }
.sec[data-fx-vel="lento"] { --fx-dur: 1200ms; }

.sec[data-fx-in="fade"]     { --in-t: none; }
.sec[data-fx-in="subir"]    { --in-t: translateY(40px); }
.sec[data-fx-in="descer"]   { --in-t: translateY(-40px); }
.sec[data-fx-in="esquerda"] { --in-t: translateX(-60px); }
.sec[data-fx-in="direita"]  { --in-t: translateX(60px); }
.sec[data-fx-in="zoom"]     { --in-t: scale(.9); }
.sec[data-fx-out="fade"]    { --out-t: none; }
.sec[data-fx-out="subir"]   { --out-t: translateY(-40px); }
.sec[data-fx-out="descer"]  { --out-t: translateY(40px); }
.sec[data-fx-out="zoom"]    { --out-t: scale(.92); }

.sec[data-fx-in]:not([data-fx-in="nenhum"]) .sec__conteudo,
.sec[data-fx-out]:not([data-fx-out="nenhum"]) .sec__conteudo {
  transition: opacity var(--fx-dur) ease, transform var(--fx-dur) cubic-bezier(.2,.7,.2,1);
}
html.js .sec[data-fx-in]:not([data-fx-in="nenhum"]):not(.fx-visivel):not(.fx-saiu) .sec__conteudo {
  opacity: 0; transform: var(--in-t, none);
}
html.js .sec.fx-saiu[data-fx-out]:not([data-fx-out="nenhum"]) .sec__conteudo {
  opacity: 0; transform: var(--out-t, none);
}

/* Looping: aplicado nos elementos que o layout marca com .fx-alvo */
@keyframes fx-flutuar { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes fx-pulsar { 0%,100% { transform: scale(1); } 50% { transform: scale(1.05); } }
@keyframes fx-balancar { 0%,100% { transform: rotate(-2deg); } 50% { transform: rotate(2deg); } }
.sec[data-fx-loop="flutuar"] .fx-alvo { animation: fx-flutuar 5s ease-in-out infinite; }
.sec[data-fx-loop="pulsar"] .fx-alvo { animation: fx-pulsar 2.6s ease-in-out infinite; }
.sec[data-fx-loop="balancar"] .fx-alvo { animation: fx-balancar 4s ease-in-out infinite; transform-origin: 50% 80%; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  html.js .sec .sec__conteudo { opacity: 1 !important; transform: none !important; transition: none !important; }
  .sec .fx-alvo { animation: none !important; }
}