/* ============================================================
   animations.css — pre-animation states + motion polish
   Paired with animations.js (GSAP + ScrollTrigger).
   ============================================================ */

/* ---- Prevent FOUC: hide elements until GSAP sets them ---- */
/* Only applies when JS loaded + motion is allowed.           */
html.anims-ready .hero-copy .eyebrow,
html.anims-ready .hero-copy h1,
html.anims-ready .hero-copy .hero-sub,
html.anims-ready .hero-ctas .btn,
html.anims-ready .hero-meta div,
html.anims-ready .hero .photo-frame,
html.anims-ready .section-head > *,
html.anims-ready .pricing .price-card,
html.anims-ready .reviews .review,
html.anims-ready .gallery .tile,
html.anims-ready .split > *,
html.anims-ready .party-preview > *,
html.anims-ready .info-grid > *,
html.anims-ready .party-includes > *,
html.anims-ready .payment-breakdown > *,
html.anims-ready .walkin-banner,
html.anims-ready .cta-block,
html.anims-ready .page-header > *,
html.anims-ready [data-animate="fade-up"] {
  opacity: 0;
  will-change: transform, opacity;
}

/* If GSAP failed to load or reduced motion is on, show normally. */
html.anims-disabled * {
  opacity: 1 !important;
  transform: none !important;
}

/* ============================================================
   HERO — boost typography weight and presence
   ============================================================ */
.hero-copy h1 {
  font-weight: 600;
  letter-spacing: -0.015em;
}

/* ============================================================
   CTA shimmer — subtle animated sheen on primary buttons
   ============================================================ */
.btn-primary {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.btn-primary::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    110deg,
    transparent 25%,
    rgba(255, 255, 255, 0.28) 50%,
    transparent 75%
  );
  transform: translateX(-120%);
  pointer-events: none;
  z-index: 1;
  animation: btn-shimmer 3.8s ease-in-out infinite;
  animation-delay: 1.2s;
}

.btn-primary > * {
  position: relative;
  z-index: 2;
}

@keyframes btn-shimmer {
  0%   { transform: translateX(-120%); }
  55%  { transform: translateX(120%); }
  100% { transform: translateX(120%); }
}

/* Disable shimmer when user prefers reduced motion */
@media (prefers-reduced-motion: reduce) {
  .btn-primary::after { animation: none; display: none; }
}

/* ============================================================
   Photo frame hover lift — a touch more presence
   ============================================================ */
.photo-frame {
  transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1),
              box-shadow 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Gallery tiles — smoother hover curve */
.gallery .tile {
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
              box-shadow 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

/* ============================================================
   Guard against horizontal scroll from parallax overshoot
   ============================================================ */
body { overflow-x: hidden; }
