/* =========================================================
   Site-specific fixes on top of the design CSS (main.css).
   Kept separate so main.css can be replaced with a new design export.
   ========================================================= */

/* Mobile / tablet: the hero is not pinned (sticky). On phones the pinned hero kept the
   screen still for most of a screen height of scrolling (felt "stuck" on iPhone); now it
   scrolls away like a normal section while its text still fades out. */
@media (max-width: 900px), (hover: none) and (pointer: coarse) {
    .hero { height: auto; }
    .hero__sticky { position: relative; height: 100vh; height: 100svh; }
}