/* ==========================================================================
   animations.css — on-scroll reveal system, redacted-reveal motif
   ========================================================================== */

/* Base hidden states — JS toggles .is-visible via IntersectionObserver */
.reveal-up,
.reveal-line,
.reveal-mono,
.reveal-photo {
  opacity: 0;
  will-change: transform, opacity;
}

.reveal-up {
  transform: translateY(24px);
  transition: opacity var(--dur-med) var(--ease-out), transform var(--dur-med) var(--ease-out);
}

.reveal-line {
  transform: translateY(100%);
  transition: opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out);
}

.reveal-mono {
  transition: opacity var(--dur-fast) var(--ease-out);
}

.reveal-photo {
  transform: scale(0.96);
  filter: grayscale(1) contrast(1.05) brightness(0.9);
  transition: opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out);
}

.is-visible.reveal-up,
.is-visible.reveal-line,
.is-visible.reveal-mono,
.is-visible.reveal-photo {
  opacity: 1;
  transform: none;
}

/* Stagger children within a section as it becomes visible */
.section-inner .reveal-up:nth-of-type(1) { transition-delay: 0.05s; }
.section-inner .reveal-up:nth-of-type(2) { transition-delay: 0.12s; }
.section-inner .reveal-up:nth-of-type(3) { transition-delay: 0.19s; }
.section-inner .reveal-up:nth-of-type(4) { transition-delay: 0.26s; }

.home-title .reveal-line:nth-child(2) { transition-delay: 0.08s; }
.home-sub.reveal-line { transition-delay: 0.16s; }
.home-cta.reveal-line { transition-delay: 0.24s; }

/* Stagger timeline items and skill categories individually via JS-set
   custom property, so it works regardless of DOM position */
.timeline-item.reveal-up,
.skill-category.reveal-up,
.stat-block.reveal-up {
  transition-delay: var(--reveal-delay, 0s);
}

/* Redacted reveal — motif-level "agent" accent applied to mono tags.
   A dark bar sweeps away to reveal the label, like a declassified line. */
.mono-tag {
  position: relative;
  display: inline-block;
}

.reveal-mono::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--color-text);
  transform-origin: left;
  transform: scaleX(1);
  transition: transform var(--dur-med) var(--ease-out);
  transition-delay: 0.1s;
}

.is-visible.reveal-mono::before {
  transform: scaleX(0);
}

/* Line-clamp wrapper so translateY reveal on home title doesn't show
   overflow above the line */
.home-title span,
.home-sub,
.home-cta {
  overflow: hidden;
  display: block;
}

/* Photo decorations handled in sections.css now - 
   grid background + corner L-brackets */