/* Scroll-in entrance layer -- NEW, not part of the Builty clone.
 *
 * The Builty homepage ships no scroll-reveal animations (verified against the
 * live demo). This layer adds them as a progressive enhancement.
 *
 * Load-bearing invariant (see memory-bank/systemPatterns.md, Pattern 6):
 * elements are only hidden once components/builty/interactive/ScrollReveal.tsx
 * has added [data-reveal] on the client. During SSR and with JavaScript
 * disabled there is no [data-reveal] attribute, so everything renders fully
 * visible -- the server's settled frame (the fidelity baseline) is unchanged and
 * no content can ever get stuck invisible. Only opacity and transform are
 * touched, so layout and every measured section height stay identical; the
 * resting/settled state is `transform: none`.
 */

/* No `will-change` here on purpose: as a permanent hint it would make every
 * revealed element a lasting stacking context, which traps the nice-select
 * dropdown's absolutely-positioned list behind the form fields below it. The
 * transform during the reveal is a transient, one-shot animation and composites
 * fine without the hint. */
[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity 0.7s cubic-bezier(0.22, 0.61, 0.36, 1),
    transform 0.7s cubic-bezier(0.22, 0.61, 0.36, 1);
  transition-delay: var(--reveal-delay, 0s);
}

[data-reveal].is-revealed {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}