/* === FX V2 · animações compartilhadas das propostas/apresentações === */

/* reveal on scroll genérico */
[data-fx="reveal"]{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.22,1,.36,1);transition-delay:calc(var(--i,0) * 70ms)}
[data-fx="reveal"].in{opacity:1;transform:none}

/* shimmer no priceblock e invest */
.priceblock,.invest{position:relative;overflow:hidden;isolation:isolate}
.priceblock::before,.invest::before{
  content:"";position:absolute;top:0;left:-60%;width:55%;height:100%;
  background:linear-gradient(115deg,transparent 30%,rgba(244,168,127,.12) 50%,transparent 70%);
  animation:fxShimmer 5.5s ease-in-out infinite;pointer-events:none;z-index:0
}
@keyframes fxShimmer{0%{left:-60%}55%{left:120%}100%{left:120%}}
.priceblock > *,.invest > *{position:relative;z-index:1}

/* glow sutil no preço grande (apenas drop-shadow, sem mudar a cor que já existe no proposta.css) */
.pbig{filter:drop-shadow(0 0 22px rgba(244,168,127,.20))}

/* magnetic CTA */
.fx-magnetic{transition:transform .2s cubic-bezier(.22,1,.36,1)}

/* pulse no btn final */
.final .btn-p,.final .btn-w{animation:fxPulseRing 2.8s ease-in-out infinite;position:relative}
@keyframes fxPulseRing{
  0%,100%{box-shadow:0 16px 34px -14px rgba(0,0,0,.4), 0 0 0 0 rgba(244,168,127,.55)}
  55%{box-shadow:0 16px 34px -14px rgba(0,0,0,.4), 0 0 0 14px rgba(244,168,127,0)}
}

/* spotlight cursor no .phero (proposta) */
.phero{--mx:50%;--my:50%;position:relative;overflow:hidden}
.phero::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(440px 320px at var(--mx) var(--my),rgba(244,168,127,.14),transparent 65%);
  pointer-events:none;transition:background .12s linear;z-index:0
}
.phero > *{position:relative;z-index:1}

/* apresentação: stagger nos grids */
.tlist > *,.ladder > *,.cgrid > *,.tgrid > *,.timeline > *,.pains > *{
  transition-delay:calc(var(--i,0) * 70ms);
}

/* hover dos cards/itens (sem mudar layout, só leveza) */
.list .item,.steps .step{transition:transform .25s ease, background .25s}
.list .item:hover,.steps .step:hover{transform:translateY(-2px)}

/* prefers-reduced-motion: desliga tudo */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none !important;transition:none !important}
  [data-fx="reveal"]{opacity:1 !important;transform:none !important}
}