/* ========================================
   Animations & Transitions
   ======================================== */

/* Scroll Reveal Base State */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

/* Scroll Reveal Visible State */
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Staggered Children */
.reveal > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.reveal.visible > *:nth-child(1) { transition-delay: 0.1s; }
.reveal.visible > *:nth-child(2) { transition-delay: 0.2s; }
.reveal.visible > *:nth-child(3) { transition-delay: 0.3s; }
.reveal.visible > *:nth-child(4) { transition-delay: 0.4s; }
.reveal.visible > *:nth-child(5) { transition-delay: 0.5s; }
.reveal.visible > *:nth-child(6) { transition-delay: 0.6s; }

.reveal.visible > * {
  opacity: 1;
  transform: translateY(0);
}

/* Fade In Animation */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Slide Up Animation */
@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Pulse Animation (for subtle highlights) */
@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
}

/* Hero Subtle Glow Animation */
@keyframes glow {
  0%, 100% {
    opacity: 0.3;
  }
  50% {
    opacity: 0.5;
  }
}

/* Loading State */
.loading {
  pointer-events: none;
  opacity: 0.6;
}

/* Hover Lift Effect */
.hover-lift {
  transition: transform var(--transition-base);
}

.hover-lift:hover {
  transform: translateY(-4px);
}

/* Focus Visible (for accessibility) */
:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

/* Smooth Scrolling */
html {
  scroll-behavior: smooth;
}

/* ========================================
   Page Load Zoom-In Animation
   Starts from black, zoomed in, settles to normal.
   ======================================== */

/* Full-screen black overlay that fades out */
.page-intro-overlay {
  position: fixed;
  inset: 0;
  background-color: #000;
  z-index: 9999;
  pointer-events: none;
  opacity: 1;
  transition: opacity 0.8s cubic-bezier(0.25, 0.1, 0.25, 1) 0.15s;
}

.page-intro-overlay.done {
  opacity: 0;
}

/* Body zoom state — starts scaled up, eases to 1 */
body.page-loading {
  transform: scale(1.12);
  transform-origin: center center;
  opacity: 0;
}

body.page-loaded {
  animation: pageZoomIn 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes pageZoomIn {
  0% {
    transform: scale(1.12);
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

/* Prevent flash of unstyled content during load */
body.page-loading * {
  animation-play-state: paused !important;
}

/* After animation completes, remove transform to avoid compositing cost */
body.page-intro-done {
  transform: none;
}