/* Animation system — intentional, premium, no bounce */

/* Keyframes */
@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(32px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes clipRevealX {
  from {
    clip-path: inset(0 100% 0 0);
  }
  to {
    clip-path: inset(0 0% 0 0);
  }
}

@keyframes blink {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Scroll reveal classes — triggered by JS adding .is-visible */
.reveal-up {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity var(--t-slow), transform var(--t-slow);
  transition-delay: var(--delay, 0ms);
}

.reveal-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.reveal-left {
  opacity: 0;
  transform: translateX(-28px);
  transition: opacity var(--t-slow), transform var(--t-slow);
  transition-delay: var(--delay, 0ms);
}

.reveal-left.is-visible {
  opacity: 1;
  transform: translateX(0);
}

.clip-reveal {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.7s cubic-bezier(0.16, 1, 0.3, 1);
  transition-delay: var(--delay, 0ms);
}

.clip-reveal.is-visible {
  clip-path: inset(0 0% 0 0);
}

/* Hero slide-up (runs on load, not scroll — uses CSS animation) */
.slide-up {
  opacity: 0;
  animation: slideUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) both;
  animation-delay: var(--delay, 0ms);
}

/* Typewriter cursor */
#typewriter::after {
  content: '|';
  animation: blink 1s step-end infinite;
  color: var(--accent);
}

/* Prefers-reduced-motion override */
@media (prefers-reduced-motion: reduce) {
  .reveal-up,
  .reveal-left {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .clip-reveal {
    clip-path: none;
    transition: none;
  }
  .slide-up {
    opacity: 1;
    animation: none;
  }
  #typewriter::after {
    animation: none;
  }
}