/* ============================================================
   CUESTA SOLAR — Animações & Reveal
   ============================================================ */

/* ---------- Scroll reveal ---------- */
[data-reveal] {
  opacity: 0;
  transform: translateY(34px);
  filter: blur(6px);
  transition:
    opacity var(--d-cine) var(--e-out),
    transform var(--d-cine) var(--e-out),
    filter var(--d-cine) var(--e-out);
  transition-delay: var(--reveal-delay, 0s);
  will-change: opacity, transform;
}
[data-reveal="fade"]  { transform: none; }
[data-reveal="left"]  { transform: translateX(-44px); }
[data-reveal="right"] { transform: translateX(44px); }
[data-reveal="scale"] { transform: scale(.92); filter: blur(8px); }
[data-reveal="mask"] {
  clip-path: inset(0 100% 0 0);
  opacity: 1; transform: none; filter: none;
  transition: clip-path var(--d-cine) var(--e-out);
  transition-delay: var(--reveal-delay, 0s);
}

[data-reveal].is-in {
  opacity: 1;
  transform: none;
  filter: none;
  clip-path: inset(0 0 0 0);
}

/* stagger automático nos filhos */
[data-stagger] > * {
  opacity: 0;
  transform: translateY(28px);
  filter: blur(5px);
  transition: opacity var(--d-slow) var(--e-out),
              transform var(--d-slow) var(--e-out),
              filter var(--d-slow) var(--e-out);
}
[data-stagger].is-in > * { opacity: 1; transform: none; filter: none; }
[data-stagger].is-in > *:nth-child(1)  { transition-delay: .04s; }
[data-stagger].is-in > *:nth-child(2)  { transition-delay: .10s; }
[data-stagger].is-in > *:nth-child(3)  { transition-delay: .16s; }
[data-stagger].is-in > *:nth-child(4)  { transition-delay: .22s; }
[data-stagger].is-in > *:nth-child(5)  { transition-delay: .28s; }
[data-stagger].is-in > *:nth-child(6)  { transition-delay: .34s; }
[data-stagger].is-in > *:nth-child(7)  { transition-delay: .40s; }
[data-stagger].is-in > *:nth-child(8)  { transition-delay: .46s; }

/* hero word reveal */
.hero h1 .line > span {
  display: inline-block;
  transform: translateY(110%);
  transition: transform 1.1s var(--e-out);
}
.hero.is-ready h1 .line:nth-child(1) > span { transition-delay: .15s; }
.hero.is-ready h1 .line:nth-child(2) > span { transition-delay: .28s; }
.hero.is-ready h1 .line:nth-child(3) > span { transition-delay: .41s; }
.hero.is-ready h1 .line > span { transform: none; }

.hero.is-ready .eyebrow,
.hero.is-ready .hero__sub,
.hero.is-ready .hero__cta,
.hero.is-ready .hero__ticker,
.hero.is-ready .hero__scroll { animation: fadeUp 1s var(--e-out) both; }
.hero.is-ready .eyebrow     { animation-delay: .1s; }
.hero.is-ready .hero__sub   { animation-delay: .55s; }
.hero.is-ready .hero__cta   { animation-delay: .7s; }
.hero.is-ready .hero__ticker{ animation-delay: .9s; }
.hero.is-ready .hero__scroll{ animation-delay: 1.05s; }

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: none; }
}

/* parallax — controlado por JS via --py */
[data-parallax] { will-change: transform; transform: translate3d(0, var(--py, 0px), 0); }

/* aura flutuante */
.hero__aura--gold { animation: drift 14s var(--e-inout) infinite alternate; }
.hero__aura--blue { animation: drift 18s var(--e-inout) infinite alternate-reverse; }
@keyframes drift {
  from { transform: translate(0,0) scale(1); }
  to   { transform: translate(40px, 30px) scale(1.12); }
}

/* scroll rail */
@keyframes scrollRail {
  0%   { transform: translateY(-100%); }
  100% { transform: translateY(280%); }
}

/* pulso de dados SVG */
@keyframes dash {
  to { stroke-dashoffset: 0; }
}
.svg-draw {
  stroke-dasharray: var(--len, 400);
  stroke-dashoffset: var(--len, 400);
}
.is-in .svg-draw { animation: dash 2s var(--e-out) forwards; }

@keyframes flow {
  to { stroke-dashoffset: -200; }
}
.svg-flow { stroke-dasharray: 6 10; animation: flow 2.4s linear infinite; }

@keyframes pulse {
  0%,100% { opacity: .35; transform: scale(.9); }
  50%     { opacity: 1; transform: scale(1.08); }
}
.svg-pulse { transform-box: fill-box; transform-origin: center; animation: pulse 2.6s var(--e-inout) infinite; }

@keyframes spinSlow { to { transform: rotate(360deg); } }
.svg-spin { transform-box: fill-box; transform-origin: center; animation: spinSlow 26s linear infinite; }

@media (prefers-reduced-motion: reduce) {
  [data-reveal], [data-stagger] > * { opacity: 1 !important; transform: none !important; filter: none !important; clip-path: none !important; }
  .hero h1 .line > span { transform: none !important; }
  .hero__aura, .svg-flow, .svg-pulse, .svg-spin, .hero__scroll-rail::after { animation: none !important; }
}