/* Página inicial em telas: cada seção ocupa a tela inteira e o scroll para na próxima (computador).
   No celular a página corre normal, só com a entrada suave dos blocos. */
.ab-manifesto{background:#061d1e;color:#fff;padding:0!important}

/* entrada dos blocos */
.anima{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.visto .anima,.medindo .anima{opacity:1;transform:none}
.medindo .anima{transition:none!important}
html.telas .tela{overflow-x:clip}
@media (prefers-reduced-motion:reduce){.anima{opacity:1!important;transform:none!important;transition:none!important}}

/* indicador lateral */
.telas-nav{position:fixed;right:28px;top:50%;transform:translateY(-50%);z-index:150;display:none;flex-direction:column;align-items:flex-end;gap:12px;font-family:var(--m-sans)}
.telas-nav a{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;height:14px}
.telas-nav a span{font-size:.74rem;font-weight:600;letter-spacing:.06em;opacity:0;transform:translateX(6px);transition:opacity .25s ease,transform .25s ease;white-space:nowrap;background:rgba(255,255,255,.92);color:#0b1416;padding:3px 8px}
.telas-nav a i{display:block;width:8px;height:8px;border-radius:50%;background:rgba(150,160,158,.55);box-shadow:0 0 0 2px rgba(255,255,255,.5);transition:transform .25s ease,background .25s ease}
.telas-nav a:hover span,.telas-nav a:focus-visible span{opacity:1;transform:none}
.telas-nav a.on i{background:var(--m-verde);transform:scale(1.5)}
.telas-cont{position:fixed;left:28px;bottom:26px;z-index:150;display:none;font:600 .78rem var(--m-sans);letter-spacing:.14em;color:#fff;mix-blend-mode:difference}

html.telas{scroll-snap-type:y mandatory}
html.telas.solto{scroll-snap-type:y proximity}
html.telas .telas-nav,html.telas .telas-cont{display:flex}
html.telas .tela{min-height:100vh;scroll-snap-align:start;scroll-snap-stop:always;display:flex;flex-direction:column;position:relative}
html.telas .tela>section,html.telas .tela>.m-sec{flex:1;display:flex;flex-direction:column;justify-content:center}
html.telas .tela:not(.tela-filme):not(.tela-manifesto){padding-top:118px}
html.telas .tela:not(.tela-filme):not(.tela-manifesto)>.m-faixa{position:relative}
/* fundo da tela acompanha a seção */
html.telas .tela:has(.m-sec.cinza),html.telas .tela:has(.simulator){background:var(--m-fundo)}
html.telas .tela:has(.m-quote){background:var(--m-petroleo)}
html.telas .tela:has(.m-foto){padding-top:0!important}
html.telas .tela:has(.m-foto) .m-foto{min-height:100vh}
html.telas .m-sec{padding:40px 0 48px}
html.telas .m-card img{aspect-ratio:16/9}
html.telas .m-tit.centro{margin-bottom:32px}
/* filme na tela toda */
html.telas .tela-filme .ab-filme{height:100vh;min-height:0}
html.telas .tela-filme .ab-filme:after{height:34%}
/* manifesto em letra grande */
html.telas .tela-manifesto{background:#061d1e}
html.telas .tela-manifesto .ab-manifesto{flex:1;display:flex;flex-direction:column;justify-content:center}
html.telas .tela-manifesto .ab-base{grid-template-columns:1fr;gap:26px;align-items:start;padding-top:110px;padding-bottom:24px}
html.telas .tela-manifesto .ab-base h1{font-size:clamp(3.6rem,min(8vw,13vh),7.5rem)!important;line-height:.98!important}
html.telas .tela-manifesto .ab-base p{font-size:1.3rem;max-width:620px}
html.telas .tela-manifesto .ab-faixa{margin-top:auto}
/* depoimento no meio da tela */
html.telas .m-quote blockquote{font-size:clamp(2rem,3.4vw,3rem)}
/* conversa + rodapé: a última tela leva o rodapé junto */
html.telas .tela:last-of-type{min-height:auto}
html.telas footer.m-rod{scroll-snap-align:end}

html.telas .simulator{padding:24px 0 32px!important}
html.telas .simulator .head{margin-bottom:28px!important}
html.telas .simulator .sim-inputs{padding:28px 32px!important}
html.telas .simulator .sim-inputs .row{margin-bottom:16px!important}
@media (max-height:820px){
  html.telas .tela:not(.tela-filme):not(.tela-manifesto){padding-top:108px}
  html.telas .m-card .d{display:none}
  html.telas .m-sec{padding:24px 0 28px}
  html.telas .m-tit.centro{margin-bottom:22px}
  html.telas .simulator .head p{display:none}
}
