/* Scroll reveal. The hidden state is scoped to .js, which main.js sets on as its first statement. Without JavaScript the class never lands and every .reveal element stays visible — the content is in the markup either way. */ .js .reveal { opacity: 0; transform: translateY(24px); transition: opacity var(--dur-reveal) var(--ease), transform var(--dur-reveal) var(--ease); } .js .reveal.is-visible { opacity: 1; transform: none; } @media (prefers-reduced-motion: reduce) { .js .reveal, .js .reveal.is-visible { opacity: 1; transform: none; transition: none; } }