/* ============================================================ OMAR HUANTE — Shared motion layer Header entrance + scroll reveal for interior pages. All hidden start-states are gated on `.oh-anim` (set in before paint) AND prefers-reduced-motion, so no-JS and reduced-motion users always see the final, static content. ============================================================ */ @media (prefers-reduced-motion: no-preference) { /* --- Header entrance: fade-up (triggered once by .oh-play) --- */ .oh-anim .oh-enter { opacity: 0; transform: translateY(18px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.75,.2,1); } .oh-anim.oh-play .oh-enter { opacity: 1; transform: none; } /* --- Title clip-reveal: the heading rises from behind a line --- */ .oh-anim .oh-cliptext { display: block; overflow: hidden; padding: .04em 0 .16em; margin-bottom: -.16em; } .oh-anim .oh-cliptext > * { transform: translateY(114%); transition: transform .95s cubic-bezier(.2,.75,.2,1); transition-delay: .12s; } .oh-anim.oh-play .oh-cliptext > * { transform: translateY(0); } /* --- Scroll reveal: content blocks animate in once on entering view --- */ .oh-anim .oh-reveal { opacity: 0; transform: translateY(34px); transition: opacity .85s ease, transform .85s cubic-bezier(.2,.75,.2,1); transition-delay: .4s; } .oh-anim .oh-reveal.oh-in { opacity: 1; transform: none; } }