/* Ideal Telhados — camada de movimento (etapa 7)
   Scroll é NATIVO: nada de momentum/inércia. Só reveal, parallax e desenhos. */

/* --- fail-safe: sem JS, nada fica escondido ------------------------------- */
html:not(.js) [data-reveal],
html:not(.js) .svc__item,
html:not(.js) .vs__card{opacity:1 !important;transform:none !important}
html:not(.js) .vs__card--brand::before{transform:scaleX(1) !important}
html:not(.js) .steps__line{transform:scaleY(1) !important}
html:not(.js) .hero-media{transform:none !important}

/* --- reveal on scroll ------------------------------------------------------ */
[data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .75s cubic-bezier(.16,1,.3,1)}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal][data-delay="1"]{transition-delay:.12s}
[data-reveal][data-delay="2"]{transition-delay:.24s}
[data-reveal][data-delay="3"]{transition-delay:.36s}

/* elementos sticky entram só por opacidade (transform faz o sticky saltar) */
.faq__aside[data-reveal]{transform:none}

/* --- hero: zoom invertido --------------------------------------------------- */
.hero-media{transform:scale(1.14);transition:transform 1.6s cubic-bezier(.16,1,.3,1)}
.hero-media.is-settled{transform:scale(1)}

/* --- galeria: capa abre por clip ------------------------------------------- */
.gal__cell img{clip-path:inset(0 0 100% 0);transition:clip-path .9s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.gal__cell.is-in img{clip-path:inset(0 0 0 0)}
html:not(.js) .gal__cell img{clip-path:none !important}

/* --- sublinhado que desenha no título do comparativo ------------------------ */
[data-underline]{
  background-image:linear-gradient(var(--brand),var(--brand));
  background-repeat:no-repeat;background-position:0 100%;background-size:0 3px;
  transition:background-size .9s cubic-bezier(.16,1,.3,1) .25s;
  padding-bottom:2px;
}
[data-underline].is-in{background-size:100% 3px}
html:not(.js) [data-underline]{background-size:100% 3px !important}

@media (prefers-reduced-motion:reduce){
  [data-reveal],[data-reveal].is-in{opacity:1 !important;transform:none !important;transition:none !important}
  .hero-media{transform:none !important}
  .gal__cell img{clip-path:none !important}
  [data-underline]{background-size:100% 3px !important}
  .steps__line{transform:scaleY(1) !important}
  .vs__card--brand::before{transform:scaleX(1) !important}
}