/* ─── Scroll Reveal — Initial States ─── */
.reveal-item,
.reveal-slide-left,
.reveal-slide-right,
.reveal-scale {
  opacity: 0;
  transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 700ms cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-item        { transform: translateY(32px); }
.reveal-slide-left  { transform: translateX(-48px); }
.reveal-slide-right { transform: translateX(48px); }
.reveal-scale       { transform: scale(0.92); }

.reveal-item.visible,
.reveal-slide-left.visible,
.reveal-slide-right.visible,
.reveal-scale.visible {
  opacity: 1;
  transform: none;
}

/* Staggered delay helpers */
.reveal-delay-1 { transition-delay: 100ms; }
.reveal-delay-2 { transition-delay: 200ms; }
.reveal-delay-3 { transition-delay: 300ms; }
.reveal-delay-4 { transition-delay: 400ms; }
.reveal-delay-5 { transition-delay: 500ms; }

/* ─── Typewriter ─── */
.typewriter {
  overflow: hidden;
  border-right: 3px solid var(--amber);
  white-space: nowrap;
  width: 0;
  animation:
    typing 1.8s steps(40, end) 0.4s forwards,
    blink-caret 0.75s step-end infinite;
}

@keyframes typing {
  from { width: 0; }
  to   { width: 100%; }
}

@keyframes blink-caret {
  50% { border-color: transparent; }
}

/* ─── Counter ─── */
.counter { font-variant-numeric: tabular-nums; }

/* ─── Pulse Ring (CTA button) ─── */
@keyframes pulse-ring {
  0%   { box-shadow: 0 0 0 0 rgba(245, 166, 35, 0.5); }
  70%  { box-shadow: 0 0 0 18px rgba(245, 166, 35, 0); }
  100% { box-shadow: 0 0 0 0 rgba(245, 166, 35, 0); }
}

.btn--pulse {
  animation: pulse-ring 2.2s ease-out infinite;
}

/* ─── Glitch flash on hero title ─── */
@keyframes glitch {
  0%, 90%, 100% { clip-path: none; transform: none; }
  91% { clip-path: inset(20% 0 60% 0); transform: translate(-4px, 0); }
  93% { clip-path: inset(60% 0 10% 0); transform: translate(4px, 0); }
  95% { clip-path: inset(40% 0 40% 0); transform: translate(-2px, 0); }
}

.hero__title--highlight {
  position: relative;
}

.hero__title--highlight::after {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  color: var(--amber);
  animation: glitch 8s ease-in-out infinite;
  pointer-events: none;
}

/* ─── Tape divider (defined in design-system, extended here) ─── */
.tape-divider--red {
  background: var(--red);
  transform: rotate(2deg);
}

.tape-divider--red::before {
  color: var(--white);
}

/* ─── Scanline overlay on images ─── */
.scanlines {
  position: relative;
}

.scanlines::after {
  content: '';
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    to bottom,
    transparent,
    transparent 2px,
    rgba(0, 0, 0, 0.08) 2px,
    rgba(0, 0, 0, 0.08) 4px
  );
  pointer-events: none;
  border-radius: inherit;
}

/* ─── Ambient glow pulse on evidence numbers ─── */
@keyframes number-glow {
  0%, 100% { text-shadow: 0 0 8px rgba(245, 166, 35, 0.3); }
  50%       { text-shadow: 0 0 24px rgba(245, 166, 35, 0.7), 0 0 48px rgba(245, 166, 35, 0.3); }
}

.evidence-item__number {
  animation: number-glow 3s ease-in-out infinite;
}