/* ============================================================
   MLR · Ajustes exclusivos para celular (carregado só <=760px)
   Este arquivo nunca é aplicado na versão de computador.
   ============================================================ */

/* ---------- header (mais baixo no celular, sempre acima do conteúdo) ---------- */
.nav{height:68px}
.nav .logo img{height:34px}
.mobile-menu{padding-top:calc(68px + env(safe-area-inset-top,0px))}

/* ---------- hero ---------- */
/* alinhado ao topo (em vez de "colado" na base) — impede que o conteúdo
   cresça para cima e passe por baixo do cabeçalho fixo em telas altas/estreitas */
.hero{justify-content:flex-start}
.hero-inner{
  padding-top:calc(68px + env(safe-area-inset-top,0px) + 40px);
  padding-bottom:48px;
}
.hero h1{font-size:clamp(34px,10.6vw,46px);line-height:1.22;margin:18px 0 14px}
.hero .lead-italic{font-size:18px;line-height:1.55}
.hero p.sub{font-size:14px;margin:14px 0 26px;max-width:100%}
.hero .eyebrow{font-size:9.5px;letter-spacing:.22em;line-height:1.9}
.hero .eyebrow::before{width:28px}
.hero-bg{background-position:74% 18%}
/* véu mais leve — a foto agora aparece — com um leve reforço de leitura
   apenas onde o texto realmente precisa (o link e a faixa de localização
   já resolvem a legibilidade deles por conta própria, abaixo) */
.hero-shade{background:linear-gradient(180deg,rgba(228,224,211,.84) 0%,rgba(228,224,211,.7) 42%,rgba(228,224,211,.56) 100%) !important}
.hero-ctas > span{display:flex !important;flex-direction:column;align-items:stretch;gap:16px !important;width:100%}
.hero-ctas .btn{width:100%}
.hero-ctas .link-line{
  align-self:center;padding-bottom:5px;color:var(--preto) !important;
  text-shadow:0 0 14px rgba(245,243,234,.95),0 0 6px rgba(245,243,234,.95);
}
.hero-foot{margin-top:auto;background:rgba(245,243,234,.94);border-top:1px solid var(--areia)}
.hero-foot .wrap{flex-direction:column;justify-content:center;align-items:center;gap:9px;padding-top:16px;padding-bottom:16px}
.hero-foot .eyebrow{font-size:9px;letter-spacing:.2em;color:var(--oliva-p) !important}
.hero-foot .eyebrow:nth-child(even){display:none}

/* ---------- ritmo geral ---------- */
.section{padding:76px 0}
.chaphead{gap:16px;margin-bottom:16px}
.marquee{padding:20px 0}
.marquee-track span{font-size:12px;letter-spacing:.3em}
.marquee-track span::after{margin:0 22px}

/* ---------- sobre ---------- */
.sobre-grid{gap:46px;margin-top:48px}
.sobre-foto{max-width:100%;margin:0 14px 0 14px}
.frame::before{top:16px;left:-14px;right:16px;bottom:-14px}
.sobre-txt p{font-size:14.5px}
.sobre-quote{margin:30px 0;padding-left:22px}
.cred b{min-width:104px;font-size:9.5px}
.cred li{font-size:13px;gap:14px}

/* ---------- acompanhamento ---------- */
.timeline{margin-top:52px}
.step{padding-top:34px;padding-bottom:32px}
.step .n{font-size:46px;margin-bottom:14px}
.step h3{font-size:13.5px}

/* ---------- planos ---------- */
.cards{margin-top:40px;gap:14px}
.card{padding:42px 28px 36px}
.avulsa{padding:32px 26px;flex-direction:column;align-items:flex-start}
.avulsa .btn{width:100%}
.planos-nota{margin-top:30px}

/* ---------- depoimentos ---------- */
.depo-stage{margin-top:48px}
.slide q{font-size:21px;line-height:1.6}
.slide .who{margin-top:24px;font-size:10px}
.slide .who::before{width:30px}
.depo-nav{margin-top:40px;gap:16px}
.depo-arrow{width:48px;height:48px;font-size:19px}
.depo-progress{max-width:90px}
.depo-count{font-size:11px}

/* ---------- FAQ ---------- */
.faq-list{margin-top:44px}
.faq-q{font-size:14px;padding:22px 2px;gap:18px}
.faq-a p{font-size:13.5px}

/* ---------- contato ---------- */
.contato-grid{margin-top:44px;gap:44px}
.contato .btn{width:100%}
.contato-marca{width:420px;right:-38%;bottom:-8%;opacity:.06}
.contato-info b{min-width:92px}
.contato-info li{font-size:13px;gap:16px}

/* ---------- rodapé + whatsapp ---------- */
footer .wrap{flex-direction:column;text-align:center;gap:10px}
.wa-float{width:54px;height:54px;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px))}
.wa-float svg{width:25px;height:25px}
