/* ============================================
   Brixzon — Motion & Reveals
   ============================================ */

@keyframes caret-pulse {
  0%, 100% { opacity: 0.4; }
  50% { opacity: 0.15; }
}

@keyframes fade-in-up {
  from {
    opacity: 0;
    transform: translateY(28px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes char-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes nav-mobile-in {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Scroll reveals */
.reveal {
  opacity: 0;
  transform: translateY(36px);
  transition:
    opacity 0.9s var(--ease-out),
    transform 0.9s var(--ease-out);
  transition-delay: var(--reveal-delay, 0s);
  will-change: opacity, transform;
}

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

.hero__media.reveal {
  --reveal-delay: 0.1s;
}

.hero__copy.reveal {
  --reveal-delay: 0.2s;
}

.nav-mobile:not([hidden]) {
  animation: nav-mobile-in 0.35s var(--ease-out);
}

/* Button letter cascade on hover */
.btn.is-hovered .btn__label .char {
  animation: char-in 0.18s ease-out both;
}

.btn.is-hovered .btn__label .char:nth-child(1) { animation-delay: 0.025s; }
.btn.is-hovered .btn__label .char:nth-child(2) { animation-delay: 0.05s; }
.btn.is-hovered .btn__label .char:nth-child(3) { animation-delay: 0.075s; }
.btn.is-hovered .btn__label .char:nth-child(4) { animation-delay: 0.1s; }
.btn.is-hovered .btn__label .char:nth-child(5) { animation-delay: 0.125s; }
.btn.is-hovered .btn__label .char:nth-child(6) { animation-delay: 0.15s; }
.btn.is-hovered .btn__label .char:nth-child(7) { animation-delay: 0.175s; }
.btn.is-hovered .btn__label .char:nth-child(8) { animation-delay: 0.2s; }
.btn.is-hovered .btn__label .char:nth-child(9) { animation-delay: 0.225s; }
.btn.is-hovered .btn__label .char:nth-child(10) { animation-delay: 0.25s; }
.btn.is-hovered .btn__label .char:nth-child(11) { animation-delay: 0.275s; }
.btn.is-hovered .btn__label .char:nth-child(12) { animation-delay: 0.3s; }
.btn.is-hovered .btn__label .char:nth-child(13) { animation-delay: 0.325s; }
.btn.is-hovered .btn__label .char:nth-child(14) { animation-delay: 0.35s; }
.btn.is-hovered .btn__label .char:nth-child(15) { animation-delay: 0.375s; }
.btn.is-hovered .btn__label .char:nth-child(16) { animation-delay: 0.4s; }

/* Reduced motion */
@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;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }

  .hero__caret.is-done {
    animation: none;
    opacity: 0.4;
  }

  .project__media img,
  .project__meta {
    transition: none !important;
  }
}