/* CAMINHO: /home1/miille88/eovovo.com.br/assets/css/home.css */
/* ============================================================
   eovovo — home.css (página inicial pública)
   Usa só as variáveis do base.css. Nada de paleta nova.
   ============================================================ */

.pg-home{background:var(--creme)}
.pg-home main{display:block}

/* ---------------- topo ---------------- */
.topo{
  position:sticky;top:0;z-index:30;
  display:flex;align-items:center;gap:20px;
  padding:14px clamp(18px,5vw,56px);
  background:rgba(250,247,240,.88);
  backdrop-filter:blur(8px);
  border-bottom:1px solid #e8e0cd;
}
.marca{display:flex;align-items:center;gap:9px;text-decoration:none}
.marca-simbolo{width:30px;height:30px;flex:none}
.marca-nome{font-family:'Lora',serif;font-size:1.3rem;font-weight:600;color:var(--verde);letter-spacing:.2px}
.topo-nav{margin-left:auto;display:flex;align-items:center;gap:clamp(14px,2.4vw,30px)}
.topo-nav a{font-size:.95rem;color:var(--tinta-suave);text-decoration:none}
.topo-nav a:hover{color:var(--verde)}
.topo-btn{
  padding:8px 18px;border-radius:999px;
  border:1px solid var(--verde);color:var(--verde)!important;font-weight:600;
}
.topo-btn:hover{background:var(--verde);color:#fff!important}

/* botão de menu: só existe no celular */
.topo-menu{
  display:none;margin-left:auto;width:44px;height:44px;flex:none;
  background:none;border:1px solid #e0d7c3;border-radius:11px;
}
.topo-menu:hover{border-color:var(--verde-claro)}
.topo-menu:focus-visible{outline:2px solid var(--ocre);outline-offset:2px}
.topo-menu-tracos{display:flex;flex-direction:column;gap:4px;align-items:center}
.topo-menu-tracos i{display:block;width:19px;height:2px;border-radius:2px;background:var(--verde);transition:.18s}
.topo-menu[aria-expanded=true] .topo-menu-tracos i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.topo-menu[aria-expanded=true] .topo-menu-tracos i:nth-child(2){opacity:0}
.topo-menu[aria-expanded=true] .topo-menu-tracos i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
@media(prefers-reduced-motion:reduce){.topo-menu-tracos i{transition:none}}

@media(max-width:760px){
  .topo{flex-wrap:wrap;gap:10px}
  .topo-menu{display:flex;align-items:center;justify-content:center}
  .topo-nav{
    display:none;order:3;width:100%;margin-left:0;
    flex-direction:column;align-items:stretch;gap:0;padding-bottom:6px;
  }
  .topo-nav.aberto{display:flex}
  .topo-nav a{font-size:1rem;padding:14px 2px;border-top:1px solid #ece3d0}
  .topo-btn{
    margin-top:12px;border-top:0;text-align:center;padding:13px 18px;
  }
}

/* ---------------- botões ---------------- */
.btn{
  display:inline-block;text-decoration:none;font-weight:600;font-size:1rem;
  padding:13px 26px;border-radius:10px;border:1px solid transparent;transition:.16s;
}
.btn-primario{background:var(--verde);color:#fff;box-shadow:0 3px 10px rgba(60,74,58,.2)}
.btn-primario:hover{background:#33402f;transform:translateY(-1px)}
.btn-vazado{border-color:#d6cdb6;color:var(--verde-medio)}
.btn-vazado:hover{border-color:var(--ocre);color:var(--verde)}
.btn:focus-visible{outline:2px solid var(--ocre);outline-offset:3px}

/* ---------------- hero ---------------- */
.hero{
  position:relative;
  display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:clamp(24px,5vw,64px);
  max-width:1180px;margin:0 auto;padding:clamp(40px,7vw,84px) clamp(18px,5vw,56px) clamp(30px,5vw,60px);
}
/* um sopro de verde atrás do desenho da árvore */
.pg-home .hero::before{
  content:"";position:absolute;right:0;top:0;width:52%;height:100%;
  background:radial-gradient(closest-side,rgba(138,154,125,.14),transparent 72%);
  pointer-events:none;
}
/* folhas soltas, bem discretas, balançando devagar */
.hero-folhas{position:absolute;inset:0;pointer-events:none}
.hf{position:absolute;color:var(--verde-claro);opacity:.35;animation:balanca 7s ease-in-out infinite}
.hf1{left:2%;top:12%;animation-delay:0s}
.hf2{left:44%;top:6%;animation-delay:1.6s;opacity:.28}
.hf3{left:6%;bottom:10%;animation-delay:3.1s;color:var(--verde-medio);opacity:.3}
.hf4{right:3%;bottom:6%;animation-delay:2.2s;opacity:.25}
@keyframes balanca{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-9px) rotate(7deg)}}
@media(prefers-reduced-motion:reduce){.hf{animation:none}}
@media(max-width:860px){.hero-folhas{display:none}.pg-home .hero::before{display:none}}
.olho{
  font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ocre);font-weight:600;margin-bottom:14px;
}
.hero h1{
  font-size:clamp(2.2rem,5.4vw,3.6rem);line-height:1.08;color:var(--verde);
  font-weight:600;letter-spacing:-.4px;
}
.chamada{
  margin-top:20px;max-width:46ch;font-size:1.1rem;line-height:1.65;color:#5d5f52;
}
.acoes{margin-top:30px;display:flex;flex-wrap:wrap;gap:12px}

.hero-arvore svg{width:100%;height:auto;display:block}
.folha-nome{font-family:'Lora',serif;font-size:19px;font-style:italic}
.hero-nota{
  margin-top:6px;text-align:center;font-size:.86rem;line-height:1.55;
  color:var(--tinta-suave);max-width:38ch;margin-left:auto;margin-right:auto;
}
.folha-hero{opacity:0;animation:brotar .55s ease-out forwards;animation-delay:var(--atraso)}
.folha-voce{filter:drop-shadow(0 0 7px rgba(196,154,90,.55))}
.hero-arvore .galhos,.hero-arvore .lacos,.hero-arvore circle{opacity:0;animation:surgir .8s ease-out .55s forwards}
@keyframes brotar{to{opacity:1}}
@keyframes surgir{to{opacity:1}}
@media(prefers-reduced-motion:reduce){
  .folha-hero,.hero-arvore .galhos,.hero-arvore .lacos,.hero-arvore circle{opacity:1;animation:none}
}
@media(max-width:860px){
  .hero{grid-template-columns:1fr;text-align:center}
  .chamada{margin-left:auto;margin-right:auto}
  .acoes{justify-content:center}
  .hero-arvore{max-width:430px;margin:12px auto 0}
}

/* ---------------- seções ---------------- */
section h2{
  font-size:clamp(1.6rem,3.2vw,2.2rem);color:var(--verde);font-weight:600;text-align:center;
}
.orn{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:12px;color:var(--ocre)}
.orn i{display:block;width:88px;height:1px;background:linear-gradient(90deg,transparent,var(--ocre))}
.orn i:last-child{background:linear-gradient(90deg,var(--ocre),transparent)}
.orn .eov-ic{flex:none}
.secao-sub{margin-top:10px;text-align:center;color:var(--tinta-suave);font-size:1.02rem}

.passos{
  background:linear-gradient(180deg,#eef0e4,#e7ebdb);
  border-top:1px solid #dfe3ce;border-bottom:1px solid #dfe3ce;
  padding:clamp(46px,6vw,76px) clamp(18px,5vw,56px);
}
.passos-galho{display:block;width:min(1000px,100%);height:44px;margin:26px auto -14px;overflow:visible}
@media(max-width:760px){.passos-galho{display:none}}
.passos-lista{
  list-style:none;max-width:1000px;margin:22px auto 0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3vw,34px);
}
.passos-lista li{
  background:#fffdf7;border:1px solid #dfe0c9;border-top:3px solid var(--verde-claro);border-radius:14px;padding:24px 22px;
  box-shadow:0 2px 8px rgba(60,74,58,.05);
}
.degrau{
  display:inline-block;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--madeira);font-weight:600;
  padding-bottom:7px;border-bottom:1px solid #e0d5bd;margin-bottom:12px;
}
.passos-lista h3{font-size:1.22rem;color:var(--verde);font-weight:600;margin-bottom:8px}
.passos-lista p{color:#5d5f52;line-height:1.6;font-size:.98rem}
.tecla{
  display:inline-block;min-width:20px;text-align:center;
  background:var(--verde);color:#fff;border-radius:5px;padding:0 5px;font-weight:700;font-size:.9em;
}
@media(max-width:760px){.passos-lista{grid-template-columns:1fr}}

.cartoes{padding:clamp(46px,6vw,76px) clamp(18px,5vw,56px)}
.grade{
  max-width:1000px;margin:38px auto 0;
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,3vw,30px);
}
.grade article{
  border-left:3px solid var(--verde-claro);padding:4px 0 4px 20px;border-radius:0;
}
.grade h3{display:flex;align-items:center;gap:10px;font-size:1.2rem;color:var(--verde);font-weight:600;margin-bottom:9px}
.cartao-ic{
  flex:none;width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  background:#e8eddd;color:var(--verde-medio);border:1px solid #d8e0c8;
}
.grade p{color:#5d5f52;line-height:1.65;font-size:.99rem}
.grade strong{color:var(--verde);font-weight:600}
@media(max-width:760px){.grade{grid-template-columns:1fr}}

/* ---------------- legado (para quem vem depois) ---------------- */
.legado{
  background:linear-gradient(180deg,#eef0e4,#e7ebdb);
  border-top:1px solid #dfe3ce;border-bottom:1px solid #dfe3ce;
  padding:clamp(46px,6vw,76px) clamp(18px,5vw,56px);
  display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:clamp(26px,5vw,60px);
}
.legado-lado{justify-self:end;width:100%;max-width:520px}
.legado-lado svg{width:100%;height:auto;display:block;filter:drop-shadow(0 8px 20px rgba(60,74,58,.08))}
.mapa-rotulo{font-family:'Lora',serif;font-style:italic;font-size:13px;fill:#8a8674}
#rota{stroke-dashoffset:220;animation:tracar 2.2s ease-out .3s forwards}
@keyframes tracar{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){#rota{animation:none;stroke-dashoffset:0}}
.legado-caixa{max-width:560px;text-align:left}
.legado-caixa h2{text-align:left}
.legado .olho{margin-bottom:12px}
@media(max-width:860px){
  .legado{grid-template-columns:1fr}
  .legado-lado{justify-self:center;max-width:440px;order:2;margin-top:8px}
  .legado-caixa{max-width:640px;margin:0 auto;text-align:center}
  .legado-caixa h2{text-align:center}
  .legado .embreve{margin-left:auto;margin-right:auto}
}
.legado-texto{
  margin-top:16px;color:#5d5f52;line-height:1.7;font-size:1.05rem;
}
.embreve{
  margin:30px 0 0;max-width:520px;text-align:left;
  display:flex;gap:14px;align-items:flex-start;
  background:#fdf8ee;border:1px solid #eee0c6;border-radius:14px;padding:16px 18px;
}
.embreve-selo{
  flex:none;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;
  font-weight:700;color:#fff;background:var(--ocre);border-radius:999px;padding:4px 11px;
  margin-top:2px;
}
.embreve p{color:#7a6a4d;line-height:1.6;font-size:.95rem}
@media(max-width:520px){
  .embreve{flex-direction:column;gap:8px}
}

/* ---------------- perguntas ---------------- */
.perguntas{max-width:780px;margin:0 auto;padding:clamp(46px,6vw,76px) clamp(18px,5vw,56px)}
.perguntas details{border-bottom:1px solid #e6ddc8}
.perguntas details:first-of-type{margin-top:30px;border-top:1px solid #e6ddc8}
.perguntas summary{
  cursor:pointer;list-style:none;padding:17px 34px 17px 0;position:relative;
  font-family:'Lora',serif;font-size:1.06rem;color:var(--verde);
}
.perguntas summary::-webkit-details-marker{display:none}
.perguntas summary::after{
  content:'+';position:absolute;right:6px;top:15px;
  font-family:'Source Sans 3',sans-serif;font-size:1.3rem;color:var(--ocre);transition:transform .18s;
}
.perguntas details[open] summary::after{transform:rotate(45deg)}
.perguntas summary:focus-visible{outline:2px solid var(--ocre);outline-offset:2px;border-radius:4px}
.perguntas p{padding:0 34px 18px 0;color:#5d5f52;line-height:1.65;font-size:.99rem}

/* ---------------- fecho + rodapé ---------------- */
.fecho{
  position:relative;overflow:hidden;
  text-align:center;padding:clamp(46px,6vw,80px) clamp(18px,5vw,56px);
  background:linear-gradient(180deg,#3c4a3a,#2f3a2d);
}
.fecho-folhas{position:absolute;inset:0;pointer-events:none}
.ff{position:absolute;color:#c49a5a;opacity:.3;animation:balanca 8s ease-in-out infinite}
.ff1{left:9%;top:18%}
.ff2{right:11%;top:24%;animation-delay:2.4s;color:#8a9a7d;opacity:.4}
.ff3{left:22%;bottom:14%;animation-delay:4s;opacity:.22}
@media(max-width:640px){.fecho-folhas{display:none}}
.fecho-frase{
  font-family:'Lora',serif;font-style:italic;font-size:clamp(1.25rem,2.9vw,1.85rem);
  color:#f3efe2;max-width:22ch;margin:0 auto 28px;line-height:1.4;
}
.fecho .btn-primario{background:var(--ocre);color:#2e332c;box-shadow:none}
.fecho .btn-primario:hover{background:#d3a865}

/* ---------------- newsletter ---------------- */
.news{
  background:var(--creme-2);border-top:1px solid #e8e0cd;
  padding:clamp(46px,6vw,72px) clamp(18px,5vw,56px);
}
.news-caixa{max-width:620px;margin:0 auto;text-align:center}
.news-sub{margin-top:12px;color:var(--tinta-suave);line-height:1.6;font-size:1.02rem}
.news-recado{
  margin-top:18px;padding:10px 16px;border-radius:9px;font-size:.94rem;display:inline-block;
}
.news-recado.ok{background:#e9f0e3;color:var(--ok);border:1px solid #cfdfc5}
.news-recado.erro{background:#f7e8e2;color:var(--erro);border:1px solid #e8c9bd}
.news-form{
  margin-top:24px;display:flex;gap:10px;flex-wrap:wrap;justify-content:center;align-items:stretch;
}
.news-form input[type=text],.news-form input[type=email]{
  flex:1 1 200px;min-width:0;padding:13px 15px;border:1.5px solid #ddd6c6;border-radius:10px;background:#fffdf7;
}
.news-form input:focus{outline:none;border-color:var(--verde-claro);background:#fff}
.news-form .btn{flex:0 0 auto}
.news-legal{margin-top:14px;font-size:.84rem;color:var(--tinta-suave)}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.isca{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------------- rodapé ----------------
   O rodapé é único para todo o site e vive em rodape.css
   (marcação em views/parciais/rodape.php). Nada dele aqui.
   ---------------------------------------- */

/* ---------------- modal de assinatura ---------------- */
.assin{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:16px}
.assin[hidden]{display:none}
.assin-fundo{position:absolute;inset:0;background:rgba(40,48,38,.55);backdrop-filter:blur(3px)}
.assin-caixa{
  position:relative;width:100%;max-width:430px;max-height:92vh;overflow-y:auto;
  background:#fffdf7;border:1px solid #e2d9c4;border-radius:18px;
  padding:30px 28px 26px;box-shadow:0 18px 50px rgba(40,48,38,.3);
}
.assin-x{
  position:absolute;top:10px;right:12px;width:34px;height:34px;line-height:1;
  border:none;background:none;font-size:1.7rem;color:#a89e88;border-radius:50%;
}
.assin-x:hover{background:#f2ede1;color:var(--verde)}
.assin-caixa h2{font-size:1.45rem;color:var(--verde);font-weight:600;text-align:center}
.assin-sub{margin-top:9px;margin-bottom:20px;text-align:center;color:var(--tinta-suave);font-size:.94rem;line-height:1.55}

.assin-caixa form label{display:block;margin-bottom:14px;font-size:.86rem;font-weight:600;color:var(--verde)}
.assin-caixa form input,.assin-copia textarea{
  width:100%;margin-top:5px;padding:11px 13px;border:1.5px solid #ddd6c6;border-radius:10px;
  background:var(--creme);font-weight:400;color:var(--tinta);font-family:inherit;font-size:1rem;
}
.assin-caixa form input:focus,.assin-copia textarea:focus{outline:none;border-color:var(--verde-claro);background:#fff}
.assin-opcional{font-weight:400;color:var(--tinta-suave);font-size:.78rem}
.assin-dica{display:block;margin-top:4px;font-size:.78rem;font-weight:400;color:var(--tinta-suave)}
.assin-erro{display:block;margin-top:4px;font-size:.8rem;font-weight:400;color:var(--erro)}
.assin-erro.geral{text-align:center;margin:0 0 12px}
.btn.largo{display:block;width:100%;text-align:center}

.assin-qr{display:flex;justify-content:center;margin-bottom:18px}
.assin-qr canvas,.assin-qrbox img,.assin-qrbox canvas{
  border:1px solid #e6ddc8;border-radius:12px;padding:8px;background:#fff;display:block;
}
.assin-copia{display:block;font-size:.82rem;font-weight:600;color:var(--verde);margin-bottom:12px}
.assin-copia textarea{resize:none;font-size:.74rem;line-height:1.45;word-break:break-all;color:#5d5f52}
.assin-espera{
  margin-top:16px;text-align:center;font-size:.9rem;color:var(--verde-medio);
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.assin-bolinha{width:9px;height:9px;border-radius:50%;background:var(--ocre);animation:pulsa 1.3s ease-in-out infinite}
@keyframes pulsa{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}
@media(prefers-reduced-motion:reduce){.assin-bolinha{animation:none;opacity:1}}
.assin-nota{margin-top:12px;text-align:center;font-size:.82rem;color:var(--tinta-suave);line-height:1.5}
.assin-check{
  width:56px;height:56px;margin:0 auto 14px;border-radius:50%;
  background:#e9f0e3;color:var(--ok);border:1px solid #cfdfc5;
  display:flex;align-items:center;justify-content:center;font-size:1.7rem;
}
@media(max-width:420px){.assin-caixa{padding:26px 20px 22px}}