/* Tesouros da Fé — sistema visual. Tokens herdados do próprio Mapa (PDF final). */
@font-face{font-family:Fraunces;font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/fraunces.woff2) format("woff2")}
@font-face{font-family:Fraunces;font-style:italic;font-weight:300 700;font-display:swap;src:url(fonts/fraunces-italic.woff2) format("woff2")}
@font-face{font-family:Literata;font-style:normal;font-weight:300 700;font-display:swap;src:url(fonts/literata.woff2) format("woff2")}
@font-face{font-family:Literata;font-style:italic;font-weight:300 700;font-display:swap;src:url(fonts/literata-italic.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:300 700;font-display:swap;src:url(fonts/dm-sans.woff2) format("woff2")}

:root{
  --papel:#f4eee2;--linho:#ebe2d0;--tinta:#1f2a27;--musgo:#2f4a44;--noite:#1a2623;
  --terra:#8f4a33;--terra-m:#a85f45;--ocre:#c79a4e;--ambar:#f0c478;--acao:#e0a94f;
  --cinza:#5d574b;--linha:rgba(31,42,39,.16);--linha-noite:rgba(244,238,226,.18);
  --serif:Fraunces,Georgia,"Times New Roman",serif;
  --texto:Literata,Georgia,serif;
  --sans:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --gut:1.25rem;
  --arco:999px 999px 6px 6px;
  --out:cubic-bezier(.16,1,.3,1);
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scrollbar-color:var(--terra-m) var(--linho);scroll-padding-top:1rem}
body{margin:0;background:var(--papel);color:var(--tinta);font:400 1.0625rem/1.65 var(--texto);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:var(--terra);text-underline-offset:.2em;text-decoration-thickness:1px}
::selection{background:var(--ambar);color:var(--noite)}
:focus-visible{outline:2px solid var(--terra);outline-offset:3px;border-radius:3px}
.night :focus-visible{outline-color:var(--ambar)}
p{margin:0 0 1em}
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;text-wrap:balance;letter-spacing:-.015em}
h1{font-size:clamp(2.15rem,9.4vw,4.6rem);line-height:1.04;letter-spacing:-.028em}
h2{font-size:clamp(1.85rem,6.8vw,3rem);line-height:1.1}
h3{font-size:1.4rem;line-height:1.2}
em{font-style:italic}
.wrap{width:min(100% - 2*var(--gut),70rem);margin-inline:auto}
.small{font:400 .9rem/1.5 var(--sans);color:var(--cinza)}
.skip{position:absolute;left:-999px;top:0;background:var(--noite);color:var(--papel);padding:.6rem 1rem;font:500 .9rem var(--sans);z-index:99}
.skip:focus{left:var(--gut);top:.5rem}

/* topo */
header.site{padding:1rem 0}
header.site .wrap{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}
.brand{white-space:nowrap;font:500 1.2rem/1 var(--serif);letter-spacing:-.01em;color:var(--tinta);text-decoration:none}
.nav a{font:500 .9rem var(--sans);color:var(--cinza);text-decoration:none;margin-left:1.25rem;padding:.5rem 0}
.nav a:hover{color:var(--terra)}
@media (max-width:379px){.nav a:first-child:not(:last-child){display:none}}

/* botão: única ação da página */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:3.25rem;padding:.8rem 1.7rem;background:var(--acao);color:var(--noite);font:600 1.02rem/1.2 var(--sans);letter-spacing:.005em;text-decoration:none;border-radius:999px;border:0;cursor:pointer;box-shadow:0 1px 0 rgba(0,0,0,.18),0 6px 14px -6px rgba(0,0,0,.4);transition:background .25s var(--out),transform .25s var(--out),box-shadow .25s var(--out)}
.btn:hover{background:var(--ambar);transform:translateY(-1px);box-shadow:0 1px 0 rgba(0,0,0,.18),0 10px 18px -8px rgba(0,0,0,.45)}
.btn:active{transform:translateY(0)}
.btn.block{display:flex;width:100%}
.btn.ghost{background:transparent;color:var(--tinta);box-shadow:inset 0 0 0 1.5px var(--tinta)}
.btn.ghost:hover{background:var(--linho)}
.night .btn{background:var(--ambar);color:var(--noite)}
.night .btn:hover{background:#f7d79a}
.micro{font:400 .86rem/1.4 var(--sans);color:var(--cinza);margin:.85rem 0 0}
.night .micro{color:rgba(244,238,226,.72)}

/* seções */
section{padding:4.25rem 0}
.lead{font-size:1.12rem;color:var(--cinza);max-width:34rem}
.night{background:var(--noite);color:var(--papel)}
.night .lead{color:rgba(244,238,226,.78)}
.linho{background:var(--linho)}
.head{margin-bottom:2.25rem}
.head h2{max-width:20ch}
.head .lead{margin:1rem 0 0}

/* hero */
.hero{padding:1rem 0 3.5rem}
.hero .wrap{display:grid;gap:2rem}
.hero h1 em{color:var(--terra)}
.hero .sub{font-size:1.08rem;color:var(--cinza);margin:1.1rem 0 1.6rem;max-width:30rem}
.arco{border-radius:var(--arco);overflow:hidden;background:var(--linho)}
.arco img{width:100%;height:100%;object-fit:cover}
.hero .arco{aspect-ratio:4/5;width:min(100%,30rem);margin-inline:auto}
.hero .arco img{object-position:56% 50%}

/* como funciona — tipografia, sem cartões */
.passos{list-style:none;margin:0;padding:0;counter-reset:p;border-top:1px solid var(--linha)}
.passos li{display:grid;grid-template-columns:3.2rem 1fr;gap:.25rem 1rem;padding:1.5rem 0;border-bottom:1px solid var(--linha);counter-increment:p}
.passos li::before{content:counter(p);font:italic 400 3rem/.9 var(--serif);color:var(--terra);grid-row:span 2}
.passos h3{font-size:1.35rem}
.passos p{margin:0;color:var(--cinza)}

/* mapa: 6 territórios */
.terr{list-style:none;margin:0;padding:0;display:grid;gap:0}
.terr li{display:grid;grid-template-columns:5.5rem 1fr;gap:1rem 1.15rem;align-items:start;padding:1.4rem 0;border-top:2px solid var(--c,var(--terra))}
.terr .arco{aspect-ratio:4/5;width:5.5rem}
.terr .n{font:italic 400 1.1rem/1 var(--serif);color:var(--c,var(--terra))}
.terr h3{margin:.2rem 0 .25rem}
.terr .range{font:500 .78rem/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--cinza);margin:0 0 .6rem}
.terr p.l{margin:0;font-size:.98rem;line-height:1.55;color:var(--cinza)}

/* demonstração real */
.demo{display:grid;gap:2.25rem}
.demo .arco{aspect-ratio:4/5;width:min(100%,24rem)}
.demo .arco img{object-position:50% 40%}
.demo .titulo{font:400 clamp(1.7rem,6vw,2.4rem)/1.12 var(--serif);margin:1.4rem 0 .5rem}
.demo .para{font:italic 400 1.05rem/1.5 var(--texto);color:rgba(244,238,226,.78);margin:0}
.bloco{padding:1.4rem 0;border-top:1px solid var(--linha-noite)}
.bloco h3{font:600 .76rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ambar);margin:0 0 .9rem}
.bloco p:last-child{margin-bottom:0}
.oracao{font:italic 400 1.2rem/1.5 var(--serif);color:var(--papel)}
.trecho p{color:rgba(244,238,226,.9)}
.trecho .mais{font:400 .9rem var(--sans);color:rgba(244,238,226,.65);margin-top:.9rem}
.nome{color:var(--ambar);font-style:normal;white-space:nowrap}
.ver{font:italic 400 1.3rem/1.45 var(--serif);margin:0 0 .6rem}
.nota{font:italic 400 .9rem/1.5 var(--texto);color:rgba(244,238,226,.68)}
.demo .legenda{font:400 .86rem/1.4 var(--sans);color:rgba(244,238,226,.65);margin-top:1.5rem}

/* produto por dentro */
.faixa{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:.25rem var(--gut) 1.25rem;margin:0 calc(-1*var(--gut));scrollbar-width:thin}
.faixa figure{flex:0 0 min(62vw,15rem);margin:0;scroll-snap-align:center}
.faixa img{width:100%;border-radius:6px;box-shadow:0 14px 28px -14px rgba(26,38,35,.5),0 2px 4px rgba(26,38,35,.12)}
.faixa figcaption{font:400 .82rem/1.35 var(--sans);color:var(--cinza);margin-top:.7rem}
.a5{display:grid;gap:1.75rem;margin-top:3.5rem;align-items:end}
.a5 .cap{margin:0}
.a5 .spread{margin:0;max-width:none}
.a5 img{border-radius:4px;box-shadow:0 18px 34px -16px rgba(26,38,35,.5),0 2px 5px rgba(26,38,35,.12)}
.a5 .capa{width:min(48%,11rem)}
.spread{margin-top:1.5rem;width:100%;max-width:46rem;border-radius:4px;box-shadow:0 14px 28px -14px rgba(0,0,0,.4),0 2px 4px rgba(0,0,0,.1)}
.dentro{list-style:none;margin:1.5rem 0 0;padding:0;border-top:1px solid var(--linha)}
.dentro li{padding:.85rem 0;border-bottom:1px solid var(--linha);font-size:1rem}
.dentro b{font-weight:600}

/* para quem */
.quem{display:grid;gap:2.5rem}
.quem h2{font-size:clamp(1.6rem,5.6vw,2.2rem);margin-bottom:1rem}
.rol{list-style:none;margin:0;padding:0}
.rol li{padding:.75rem 0 .75rem 1.4rem;border-top:1px solid var(--linha);position:relative}
.rol li::before{content:"";position:absolute;left:0;top:1.55rem;width:.7rem;height:1px;background:var(--terra)}
.cuidado{margin-top:3rem;padding-top:1.5rem;border-top:2px solid var(--terra);max-width:44rem}
.cuidado h3{font-size:1.5rem;margin-bottom:.7rem}
.cuidado p{color:var(--cinza)}

/* oferta */
.oferta{display:grid;gap:2rem}
.oferta .foto{border-radius:6px;overflow:hidden;aspect-ratio:16/10;background:var(--linho)}
.oferta .foto img{width:100%;height:100%;object-fit:cover;object-position:50% 35%}
.preco{font:400 clamp(3.2rem,15vw,5rem)/1 var(--serif);letter-spacing:-.03em;margin:.4rem 0 .2rem}
.preco small{font:500 .95rem var(--sans);letter-spacing:0;color:var(--cinza);margin-left:.6rem}
.recebe{list-style:none;margin:1.4rem 0 1.7rem;padding:0;border-top:1px solid var(--linha)}
.recebe li{padding:.7rem 0;border-bottom:1px solid var(--linha)}
.garantia{margin-top:1.6rem;padding-top:1.3rem;border-top:1px solid var(--linha)}
.garantia h3{font-size:1.35rem;margin-bottom:.4rem}
.garantia p{margin:0;color:var(--cinza)}

/* FAQ */
.faq{max-width:46rem}
details{border-top:1px solid var(--linha)}
details:last-of-type{border-bottom:1px solid var(--linha)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.1rem 0;font:500 1.0625rem/1.35 var(--sans);min-height:3.25rem}
summary::-webkit-details-marker{display:none}
summary::after{content:"";flex:none;width:.9rem;height:.9rem;background:linear-gradient(var(--terra),var(--terra)) center/100% 1.5px no-repeat,linear-gradient(var(--terra),var(--terra)) center/1.5px 100% no-repeat;transition:transform .3s var(--out)}
details[open] summary::after{transform:rotate(45deg)}
details p{margin:0 0 1.2rem;color:var(--cinza);max-width:38rem}

/* rodapé */
footer.site{background:var(--noite);color:rgba(244,238,226,.8);padding:3rem 0 6.5rem;font:400 .92rem/1.6 var(--sans)}
footer.site a{color:var(--papel)}
footer.site .brand{color:var(--papel);display:inline-block;margin-bottom:.8rem}
footer.site .links{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;margin:1rem 0}
footer.site .links a{padding:.35rem 0}
footer.site .fine{font-size:.82rem;color:rgba(244,238,226,.62);max-width:44rem;margin:1.2rem 0 0}

/* CTA fixo no celular */
.fixo{position:fixed;left:0;right:0;bottom:0;z-index:20;padding:.7rem var(--gut) calc(.7rem + env(safe-area-inset-bottom));background:linear-gradient(rgba(244,238,226,0),var(--papel) 38%);transform:translateY(110%);transition:transform .45s var(--out);pointer-events:none}
.fixo.on{transform:none}
.fixo .btn{pointer-events:auto;width:100%}

/* revelação discreta (só com JS; conteúdo visível sem ele) */
.js .rv{opacity:0;transform:translateY(14px);transition:opacity .8s var(--out),transform .8s var(--out)}
.js .rv.in{opacity:1;transform:none}
.js .hero .arco{clip-path:inset(12% 12% 0 12% round 999px 999px 6px 6px);transition:clip-path 1.1s var(--out)}
.js .hero .arco.in{clip-path:inset(0 0 0 0 round 999px 999px 6px 6px)}

/* páginas legais e 404 (mantidas) */
.legal{padding:2rem 0 4rem}
.legal .wrap{width:min(100% - 2*var(--gut),44rem)}
.legal h1{font-size:clamp(2rem,7vw,2.8rem);margin-bottom:.6rem}
.legal h2{font-size:1.35rem;margin:2rem 0 .6rem}
.legal .banner{background:#fff3cd;border:1px solid #e6d28a;color:#664d03;padding:.8rem 1rem;border-radius:6px;font:.92rem/1.5 var(--sans);margin-bottom:1.5rem}
.ph{background:#fff3cd;color:#664d03;padding:0 4px;border-radius:3px;font-family:var(--sans);font-size:.92em}
.dash{padding-left:1.2rem}.dash li{margin-bottom:.4rem}
.centro{min-height:60vh;display:grid;place-content:center;text-align:center;gap:1rem;padding:2rem var(--gut)}

/* ≥ 700px */
@media (min-width:700px){
  :root{--gut:2rem}
  section{padding:6rem 0}
  .terr{grid-template-columns:1fr 1fr;column-gap:3rem}
  .terr li{grid-template-columns:7rem 1fr}
  .terr .arco{width:7rem}
  .faixa{margin:0;padding-inline:0}
  .faixa figure{flex-basis:14rem}
  .quem{grid-template-columns:1fr 1fr;gap:4rem}
  .a5{grid-template-columns:13rem 1fr;gap:1.5rem 2.5rem;max-width:60rem}
  .a5 .capa{width:13rem}
  .a5 .cap{grid-column:1/-1}
}
/* ≥ 960px: composição, não só esticar */
@media (min-width:960px){
  .hero{padding:2rem 0 6rem}
  .hero .wrap{grid-template-columns:1.15fr .85fr;gap:5rem;align-items:center}
  .hero .arco{margin-inline:0 0;justify-self:end;width:100%;max-width:30rem}
  .passos{display:grid;grid-template-columns:repeat(3,1fr);border-top:0;gap:0 2.5rem}
  .passos li{display:block;border-top:1px solid var(--linha);border-bottom:0;padding:1.6rem 0 0}
  .passos li::before{display:block;margin-bottom:.9rem}
  .terr{grid-template-columns:repeat(3,1fr)}
  .terr li{grid-template-columns:1fr;gap:1rem}
  .terr .arco{width:100%;max-width:11rem}
  .demo{grid-template-columns:.8fr 1.2fr;gap:5rem;align-items:start}
  .demo .lado{position:sticky;top:2rem}
  .oferta{grid-template-columns:1.05fr .95fr;gap:5rem;align-items:center}
  .oferta .foto{aspect-ratio:4/5}
  #faq .wrap{display:grid;grid-template-columns:.7fr 1.3fr;gap:4rem;align-items:start}
  #faq .head{margin:0;position:sticky;top:2rem}
  .fixo{display:none}
  footer.site{padding-bottom:3rem}
  .faixa{overflow:visible;flex-wrap:nowrap;justify-content:space-between}
  .faixa figure{flex:1 1 0}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition-duration:.01ms!important;animation-duration:.01ms!important}
  .js .rv,.js .hero .arco{opacity:1;transform:none;clip-path:none}
}
