/* ============================================================
   components.css — reveal animation + shared bits
   ============================================================ */

.reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
  will-change: opacity, transform;
}
.reveal.is-visible {
  opacity: 1;
  transform: none;
}

.reveal[data-delay="1"] { transition-delay: 0.06s; }
.reveal[data-delay="2"] { transition-delay: 0.14s; }
.reveal[data-delay="3"] { transition-delay: 0.22s; }
.reveal[data-delay="4"] { transition-delay: 0.30s; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; }
}

/* ── Prose block (about page) ───────────────────────────── */
.prose {
  width: 100%;
  padding: 26px 24px;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: rgba(19, 21, 25, 0.62);
  margin-bottom: 22px;
}

.prose p {
  font-size: 0.92rem;
  line-height: 1.78;
  color: var(--text-muted);
}

.prose p + p { margin-top: 16px; }

.prose p:first-child {
  color: var(--text);
  font-size: 0.98rem;
}