/* ===== base do site (depois de hero.css) ===== */
:root{
  --papel:#f4efe4; --areia:#e9dfc9; --areia-2:#e3d9c1; --palha:#c9ad7c; --caramelo:#a7641d; --caramelo-fundo:#8f5215; --caramelo-texto:#8a4f12;
  --oliva:#3f4a2a; --oliva-noite:#262d19; --tinta:#23281a; --tinta-suave:#50543f; --marfim:#fbf6ea; --marfim-suave:#d9d2bd; --palha-clara:#e2c796;
  --f-serifa:"Source Serif 4",Georgia,serif; --f-sem:"Outfit",system-ui,sans-serif;
  --t-mini:.875rem; --t-texto:1.0625rem; --t-lead:clamp(1.25rem,1.75vw,1.7rem); --t-h2:clamp(2.5rem,5.6vw,5rem); --t-h3:clamp(1.4rem,2.2vw,2rem);
  --borda:clamp(1.25rem,4vw,4.5rem); --recuo:clamp(0rem,3.2vw,3.4rem); --respiro:clamp(5rem,11vw,9.5rem); --largura:82rem;
  --curva:cubic-bezier(.2,.7,.2,1); --canto:100% 0 0 0 / 46% 0 0 0;
}
html{scroll-behavior:smooth;overflow-x:clip}
body{overflow-x:clip;font-size:var(--t-texto)}
body::after{content:"";position:fixed;inset:0;z-index:50;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
img{max-width:100%;height:auto}
:focus-visible{outline:2px solid var(--caramelo);outline-offset:3px;border-radius:4px}
.wf-pular{position:absolute;left:-999px;top:0;background:var(--tinta);color:var(--marfim);padding:.8rem 1.2rem;z-index:99}
.wf-pular:focus{left:0}
.e-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:9rem;z-index:-1;background:linear-gradient(to bottom in oklab,transparent,var(--papel))}

/* paredes */
.wf-secao{position:relative;padding:var(--respiro) var(--borda);background:var(--papel);color:var(--tinta)}
.wf-secao>.wf-dentro{max-width:var(--largura);margin-inline:auto}
.wf-areia{background:var(--areia)}
.wf-oliva{background:var(--oliva-noite);color:var(--marfim);--tinta-suave:var(--marfim-suave);--caramelo-texto:var(--palha-clara);--fio:rgb(226 199 150/.4)}
.wf-caramelo{background:var(--caramelo-fundo);color:var(--marfim);--tinta-suave:#f1e2c6;--caramelo-texto:#f6dcae;--fio:rgb(251 246 234/.4)}
.wf-secao{--fio:rgb(167 100 29/.45)}

/* tipografia comum */
.wf-olho{display:flex;align-items:center;gap:.8rem;font-size:var(--t-mini);letter-spacing:.14em;text-transform:uppercase;color:var(--tinta-suave)}
.wf-olho::before{content:"";width:2.2rem;height:1px;background:var(--caramelo-texto);flex:none}
.wf-h2{font-family:var(--f-serifa);font-size:var(--t-h2);line-height:.98;letter-spacing:-.025em;font-weight:500;font-variation-settings:"opsz" 60;margin-top:1.1rem;text-wrap:balance}
.wf-h2 em,.wf-doce{font-style:italic;font-weight:250;color:var(--caramelo-texto)}
.wf-h2 strong,.wf-firme{font-style:normal;font-weight:860}
.wf-h3{font-family:var(--f-serifa);font-size:var(--t-h3);line-height:1.15;font-weight:600;letter-spacing:-.01em}
.wf-lead{font-family:var(--f-serifa);font-size:var(--t-lead);line-height:1.32;font-weight:400}
.wf-texto{color:var(--tinta-suave);max-width:38rem}
.wf-fonte{font-size:var(--t-mini);color:var(--tinta-suave)}
.wf-aspas{font-family:var(--f-serifa);font-style:italic;font-weight:300}

/* peças */
.wf-botao{min-height:56px;display:inline-flex;align-items:center;gap:.6rem;padding:0 1.9rem;border-radius:999px;background:var(--tinta);color:var(--marfim);font-weight:500;font-size:1.05rem;transition:background .3s}
.wf-botao:hover{background:var(--caramelo-fundo)}
.wf-oliva .wf-botao,.wf-caramelo .wf-botao{background:var(--marfim);color:var(--tinta)}
.wf-oliva .wf-botao:hover,.wf-caramelo .wf-botao:hover{background:var(--palha-clara)}
.wf-link{min-height:48px;display:inline-flex;align-items:center;border-bottom:1px solid currentColor;font-weight:500}
.wf-painel{position:relative;border-radius:var(--canto);overflow:hidden;background:radial-gradient(circle at 30% 20% in oklab,#c98a3c,transparent 60%),radial-gradient(circle at 80% 70% in oklab,#7d4712,transparent 65%),var(--caramelo)}
.wf-painel--espelho{border-radius:0 100% 0 0 / 0 46% 0 0}
.wf-fio{height:1px;background:var(--fio);border:0}
/* a linha (voluta que termina reta): svg.wf-linha com os três elementos do roteiro */
.wf-linha{display:block;width:100%;height:clamp(2.6rem,6vw,5rem);overflow:visible}
.wf-linha .wf-traco{fill:none;stroke:var(--caramelo-texto);stroke-width:2;stroke-linecap:round;vector-effect:non-scaling-stroke}
.wf-linha .wf-folha{fill:var(--oliva)}
.wf-oliva .wf-linha .wf-folha{fill:var(--palha-clara)}
.wf-linha .wf-ponta{fill:currentColor}
.wf-linha[data-wf]{opacity:1;transform:none;clip-path:inset(-20% 100% -20% 0);transition:clip-path 1.8s cubic-bezier(.6,0,.2,1)}
.wf-linha[data-wf].wf-visto{clip-path:inset(-20% -2% -20% 0)}

/* entrada por rolagem: um gesto por seção */
[data-wf]{opacity:0;transform:translateY(18px);transition:opacity .9s var(--curva) var(--d,0s),transform .9s var(--curva) var(--d,0s)}
[data-wf="surge"]{transform:none}
[data-wf].wf-visto{opacity:1;transform:none}
.sem-js [data-wf]{opacity:1;transform:none;clip-path:none}

/* botão que acompanha a rolagem no celular */
.wf-zap{position:fixed;right:1rem;bottom:1rem;z-index:40;min-height:56px;display:none;align-items:center;gap:.6rem;padding:0 1.4rem;border-radius:999px;background:var(--tinta);color:var(--marfim);font-weight:500;box-shadow:0 10px 30px rgb(35 40 26/.3);opacity:0;transform:translateY(20px);pointer-events:none;transition:opacity .4s,transform .4s}
.wf-zap.wf-ativo{opacity:1;transform:none;pointer-events:auto}
@media (max-width:900px){.wf-zap{display:inline-flex}}

/* rodapé */
.wf-rodape{background:var(--oliva-noite);color:var(--marfim-suave);padding:3.5rem var(--borda) 6rem;font-size:var(--t-mini)}
.wf-rodape .wf-dentro{max-width:var(--largura);margin-inline:auto;display:grid;gap:2rem 3rem;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr)}
.wf-rodape strong{display:block;font-family:var(--f-serifa);font-size:1.3rem;font-weight:500;color:var(--marfim);margin-bottom:.4rem}
.wf-rodape a{display:inline-flex;min-height:48px;align-items:center;border-bottom:1px solid transparent}
.wf-rodape a:hover{border-color:currentColor}
.wf-rodape ul{list-style:none;padding:0}
.wf-rodape .wf-selo{grid-column:1/-1;border-top:1px solid rgb(226 199 150/.25);padding-top:1.2rem;display:flex;flex-wrap:wrap;gap:.5rem 2rem;justify-content:space-between;align-items:center}
.wf-rodape .wf-selo a{color:var(--palha-clara);border-bottom:1px solid currentColor;min-height:48px}
@media (max-width:900px){.wf-rodape .wf-dentro{grid-template-columns:1fr}.wf-rodape{padding-bottom:7rem}}