/* ==========================================================================
   05 — MOVIMENTO · entradas, títulos palavra a palavra, tilt, 3D
   Tudo respeita "reduzir movimento" do sistema do visitante.
   ========================================================================== */

/* Entrada ao rolar (JS adiciona .js-ready no <html>; sem JS tudo aparece normal) */
.js-ready [data-reveal] { opacity: 0; translate: 0 46px; transition: opacity 1s var(--ease-out), translate 1.1s var(--ease-out); transition-delay: var(--d, 0s); }
.js-ready [data-reveal].is-in { opacity: 1; translate: none; }

/* Títulos: palavra por palavra subindo de uma máscara */
.w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: 0.08em; margin-bottom: -0.08em; }
.wi { display: inline-block; }
.js-ready [data-split] .wi { transform: translateY(110%) rotate(4deg); transition: transform 1s var(--ease-out); transition-delay: calc(var(--i) * 55ms); }
.js-ready [data-split].is-in .wi { transform: none; }

/* Hero: entrada orquestrada */
.js-ready .hero__title .ln > span { transform: translateY(110%); transition: transform 1.2s var(--ease-out); }
.js-ready .hero__title .ln:nth-child(2) > span { transition-delay: 0.12s; }
.js-ready .hero__photo { opacity: 0; transform: scale(0.92); }
.js-ready .hero__eyebrow, .js-ready .hero__sub, .js-ready .hero__cta, .js-ready .facts { opacity: 0; transform: translateY(26px); transition: opacity 1s var(--ease-out), transform 1s var(--ease-out); }
.js-ready.is-loaded .hero__title .ln > span { transform: none; }
.js-ready.is-loaded .hero__photo { opacity: 1; transform: none; transition: opacity 1.4s var(--ease-out) 0.1s, transform 1.6s var(--ease-out) 0.1s; }
.js-ready.is-loaded .hero__eyebrow { opacity: 1; transform: none; transition-delay: 0.05s; }
.js-ready.is-loaded .hero__sub { opacity: 1; transform: none; transition-delay: 0.45s; }
.js-ready.is-loaded .hero__cta { opacity: 1; transform: none; transition-delay: 0.6s; }
.js-ready.is-loaded .facts { opacity: 1; transform: none; transition-delay: 0.8s; }

/* Tilt 3D (variáveis definidas via JS) */
[data-tilt] { transform-style: preserve-3d; will-change: transform; }
[data-tilt].is-tilting { transition: transform 0.12s linear; }

/* Troca de painéis da programação */
.panel.is-active > * { animation: panel-in 0.8s var(--ease-out) both; }
.panel.is-active > .topics { animation-delay: 0.1s; }
.panel.is-active .topics li { animation: panel-in 0.7s var(--ease-out) both; animation-delay: calc(var(--i, 0) * 45ms + 0.15s); }
@keyframes panel-in { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .js-ready [data-reveal] { translate: none !important; }
  .js-ready [data-reveal], .js-ready [data-split] .wi, .js-ready .hero__title .ln > span, .js-ready .hero__photo,
  .js-ready .hero__eyebrow, .js-ready .hero__sub, .js-ready .hero__cta, .js-ready .facts { opacity: 1 !important; transform: none !important; transition: none !important; }
  .hero__glow, .hero__chip, .video__play i, .scroll-hint span { animation: none; }
}
