/* ============================================================ MOTION — estados de reveal, acessibilidade de movimento ============================================================ */ /* Estado inicial dos reveals (o JS anima para o estado final). Só se aplica quando o JS marcou — sem JS, todo o conteúdo fica visível. */ html.js [data-reveal] { opacity: 0; transform: translateY(30px); filter: blur(12px); transition: opacity 0.9s var(--ease-out), transform 0.9s var(--ease-out), filter 0.9s var(--ease-out); will-change: opacity, transform, filter; } html.js [data-reveal].is-in { opacity: 1; transform: none; filter: blur(0); will-change: auto; } /* enquanto a abertura está na tela, os reveals do hero aguardam */ html.is-loading [data-reveal] { transition: none; } /* failsafe: se o boot JS nunca rodar, o conteúdo aparece sozinho. Prazo curto de propósito: crawlers que renderizam JS têm orçamento de poucos segundos, e conteúdo preso em opacity:0 é conteúdo não avaliado. Com o boot normal (~0,1s) este atraso nunca chega a ser atingido. */ html.js:not(.booted) [data-reveal] { animation: revealFailsafe 0.8s var(--ease-out) 3s forwards; } @keyframes revealFailsafe { to { opacity: 1; transform: none; filter: blur(0); } } /* Fallback sem GSAP/ScrollTrigger (CDN indisponível): jornada vira pilha vertical e nada fica escondido */ html.no-motion .journey-pin { min-height: 0; } html.no-motion .journey-line, html.no-motion .journey-hud { display: none; } html.no-motion .journey-track { flex-direction: column; width: 100%; padding-inline: 0; } html.no-motion .jr-card { width: 100%; opacity: 1; transform: none; } /* Tilt 3D sutil (aplicado via JS em ponteiros finos) */ [data-tilt] { transform-style: preserve-3d; } /* ---------- Trustbar: marquee contínuo ---------- */ .trustbar .container { overflow: hidden; } .marquee { display: flex; gap: 2.4rem; width: max-content; animation: marqueeShift 32s linear infinite; mask-image: none; } .marquee:hover { animation-play-state: paused; } .marquee .trust-items { flex-wrap: nowrap; } .marquee .trust-items li { white-space: nowrap; } @keyframes marqueeShift { to { transform: translateX(calc(-50% - 1.2rem)); } } /* ============================================================ prefers-reduced-motion — desliga a cinematografia, mantém 100% do conteúdo acessível ============================================================ */ @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; } #scene, .scroll-hint { display: none !important; } html.js [data-reveal] { opacity: 1; transform: none; } .jr-card { opacity: 1; transform: none; } .journey-pin { min-height: 0; } .journey-line { display: none; } .journey-track { flex-direction: column; width: 100%; padding-inline: 0; } .jr-card { width: 100%; } .journey-hud { display: none; } }