/* ============================================================
   TRAÇO DUPLO — Camada de animação / dinâmica de scroll
   ============================================================ */

/* ---------- BARRA DE PROGRESSO DE SCROLL ---------- */
#progress{
  position:fixed;top:0;left:0;height:2px;width:100%;z-index:300;transform-origin:left;transform:scaleX(0);
  background:var(--gradient-accent);pointer-events:none;
}

/* ---------- VARIANTES DE REVEAL ---------- */
.reveal.rv-left{transform:translateX(-44px)}
.reveal.rv-right{transform:translateX(44px)}
.reveal.rv-scale{transform:scale(.92)}
.reveal.rv-blur{filter:blur(12px);transform:translateY(18px)}
.reveal.rv-clip{transform:none;clip-path:inset(0 0 101% 0)}
.reveal.in{opacity:1;transform:none;filter:none;clip-path:inset(0 0 0 0)}

/* cascata automática para filhos de um grupo */
[data-stagger]>*{opacity:0;transform:translateY(34px);transition:opacity 1.15s var(--ease-out),transform 1.15s var(--ease-out)}
[data-stagger].in>*{opacity:1;transform:none}
[data-stagger].in>*:nth-child(1){transition-delay:.06s}
[data-stagger].in>*:nth-child(2){transition-delay:.16s}
[data-stagger].in>*:nth-child(3){transition-delay:.26s}
[data-stagger].in>*:nth-child(4){transition-delay:.36s}
[data-stagger].in>*:nth-child(5){transition-delay:.46s}
[data-stagger].in>*:nth-child(6){transition-delay:.56s}

/* ---------- TÍTULOS EM MÁSCARA (line rise) ---------- */
[data-mask]{overflow:hidden;padding-bottom:.12em}
[data-mask] .ml{display:block;transform:translateY(108%);transition:transform 1.35s var(--ease-out)}
[data-mask].in .ml{transform:translateY(0)}

/* overline desenha sua linha ao entrar */
.overline::before{transform-origin:left;transform:scaleX(0);transition:transform 1s var(--ease-out) .2s}
.reveal.in .overline::before,.in>.overline::before,.overline.in::before,.sec-head.in .overline::before{transform:scaleX(1)}

/* ---------- PARALLAX (JS aplica --py) ---------- */
[data-parallax]{will-change:transform}
.ph-fill{position:absolute;left:0;right:0;top:-12%;height:124%;z-index:0;
  background:repeating-linear-gradient(135deg, rgba(255,255,255,.05) 0 1px, transparent 1px 12px)}

/* títulos em máscara não devem herdar o deslize do container reveal */
.sec-head.reveal{transform:none}

/* ---------- DIFERENCIAIS: barra que cresce ---------- */
.diff-item{position:relative}
.diff-item::before{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--white);transition:width 1.3s var(--ease-out)}
.diff-item.in::before{width:100%}
.diff-item .diff-text,.diff-item .diff-num,.diff-item .diff-tick{opacity:0;transform:translateY(22px);transition:opacity 1.1s var(--ease-out),transform 1.1s var(--ease-out)}
.diff-item.in .diff-text,.diff-item.in .diff-num,.diff-item.in .diff-tick{opacity:1;transform:none}
.diff-item.in .diff-text{transition-delay:.1s}
.diff-item.in .diff-tick{transition-delay:.2s}

/* ---------- CONTADOR ---------- */
.count{font-variant-numeric:tabular-nums}

@media(prefers-reduced-motion:reduce){
  [data-stagger]>*,[data-mask] .ml,.diff-item .diff-text,.diff-item .diff-num,.diff-item .diff-tick{opacity:1!important;transform:none!important;transition:none!important}
  [data-parallax]{transform:none!important}
  #progress{display:none}
}