/* ==========================================================================
   MAXHOSTY — MOTION
   Everything decorative is switched off by the prefers-reduced-motion block
   at the bottom of this file.
   ========================================================================== */

@keyframes float-slow { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes pulse-dot { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }
@keyframes grid-drift { from { background-position: 0 0; } to { background-position: 64px 64px; } }
@keyframes aurora-drift-1 { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(7%, 9%) scale(1.14); } }
@keyframes aurora-drift-2 { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(-9%, 5%) scale(1.1); } }
@keyframes aurora-drift-3 { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(5%, -7%) scale(1.12); } }
@keyframes badge-shimmer { 0% { transform: translateX(-120%); } 55%, 100% { transform: translateX(120%); } }
@keyframes marquee-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes spin-angle { to { --angle: 360deg; } }
@keyframes gradient-drift { 0% { background-position: 0% 50%; } 100% { background-position: 200% 50%; } }
@keyframes fade-up { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes word-up { to { transform: translateY(0); } }
@keyframes caret { 0%, 50% { opacity: 1; } 51%, 100% { opacity: 0; } }
@keyframes scan { to { transform: translateY(520px); } }
@keyframes wobble { 0% { transform: rotate(0); } 30% { transform: rotate(-14deg) scale(1.1); } 60% { transform: rotate(8deg); } 100% { transform: rotate(0); } }
@keyframes pop-in { 0% { transform: scale(0.8); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }

.grad-text { background-size: 100% 100%; }

/* Hero entrance — plays on load */
.hero-badge, .hero .body-lg, .hero-ctas, .hero-typed, .hero-points { animation: fade-up 0.9s var(--ease) both; }
.hero-badge { animation-delay: 0s; }
.hero .body-lg { animation-delay: 0.55s; }
.hero-typed { animation-delay: 0.65s; }
.hero-ctas { animation-delay: 0.75s; }
.hero-points { animation-delay: 0.9s; }

.aurora-blob.a1 { animation: aurora-drift-1 18s ease-in-out infinite; }
.aurora-blob.a2 { animation: aurora-drift-2 22s ease-in-out infinite; }

.infra-wrap { animation: fade-up 1s var(--ease) 0.4s both; }

/* ---- Scroll reveal ---------------------------------------------------------------- */
.reveal { opacity: 0; transform: translateY(26px); transition: opacity 0.9s var(--ease), transform 0.9s var(--ease); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

/* Children of .stagger enter one after another */
.stagger > * { opacity: 0; transform: translateY(24px) scale(0.97); transition: opacity 0.7s var(--ease), transform 0.7s var(--ease); transition-delay: calc(var(--i, 0) * 70ms); }
.stagger.is-visible > * { opacity: 1; transform: none; }
.reveal.stagger { opacity: 1; transform: none; }   /* the wrapper itself doesn't fade — its children do */

/* Section headings: eyebrow line draws in */
.section-head.reveal .eyebrow::before { transform-origin: left; transform: scaleX(0); transition: transform 0.9s var(--ease) 0.3s; }
.section-head.reveal.is-visible .eyebrow::before { transform: scaleX(1); }

/* ---- Pricing card entrance ---------------------------------------------------------- */
.card-reveal { opacity: 0; transform: translateY(34px) scale(0.96); transition: opacity 0.8s var(--ease), transform 0.8s var(--ease), border-color 0.3s, box-shadow 0.35s; }
.card-reveal.is-visible { opacity: 1; transform: translateY(0) scale(1); }
.plan-card.card-reveal.is-visible:hover { transform: translateY(-6px); }

/* Once a card has finished its entrance, drop the slow entrance timing so
   hover-lift and tilt respond instantly. */
.card-reveal.is-settled { transition: transform 0.3s var(--ease), opacity 0.3s, border-color 0.3s, box-shadow 0.35s !important; transition-delay: 0s !important; }

.btn:active { transform: scale(0.96); }

/* ---- Reduced motion ------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    transition-delay: 0s !important;
    scroll-behavior: auto !important;
  }
  .reveal, .card-reveal, .stagger > *, .plan-features li { opacity: 1 !important; transform: none !important; }
  .hero h1 .w > span { transform: none !important; }
  .aurora-blob, .marquee-track { animation: none !important; }
  #net-canvas, .cursor-glow { display: none; }
}