/* First act → second act. The opening banner leaves with the page: its copy
   lifts a little faster than the scroll and fades out, while a shallow arc in
   the second act's own ground rises from the banner's bottom edge and sweeps
   up over it, so the seam between the two acts is a curve that swells as it
   crosses the screen rather than a straight line sliding past. (The movement
   follows orchestremetropolitain.com: the banner travels with the scroll, the
   copy carries 13% of the banner's height further, and the arc grows to half
   again its own height from the bottom centre.) Every page of both sites wider
   than 960px; phones (2026-09-30), reduced motion and print keep the plain page. */
/* Nothing is pinned while the sweep runs: main.css holds the first act still
   on wide layouts and lets the second act slide over it, which is the one
   thing this transition replaces. One rule covers both sites' banners —
   .association-hero, .hero.bill and .phero all carry data-aya-act-hero. */
html[data-aya-act="sweep"] main [data-aya-act-hero]{position:relative;top:auto}
/* The home banners still fill the first screen, exactly as before. The room is
   reserved here, before the script runs, so applying the module moves nothing
   (no layout shift). html.js is set inline in the head; wherever the sweep
   cannot run the script answers data-aya-act="still" and the room is given
   back. The same first-act rule as the script: the banner first in main. */
@media screen and (min-width:961px) and (prefers-reduced-motion:no-preference){
 html.js:not([data-aya-act="still"]) main>.association-hero:first-child,
 html.js:not([data-aya-act="still"]) main>.hero.bill:first-child,
 html.js:not([data-aya-act="still"]) main>.youth-home-hero:first-child{height:100vh;min-height:0;box-sizing:border-box}
}
/* The arc. Its box is the banner's full width and an eighth of it tall, so the
   curve keeps one shape from a tablet to a desktop and simply scales with the
   screen; a quarter again as wide as the banner, so its shallow ends fall past
   both edges and only the crest is ever on screen. It grows from its own
   bottom centre, which sits on the banner's bottom edge, and the banner's own
   overflow clips it. The colour is the second act's ground, read at layout
   time, so the arc reads as that act arriving rather than as a shape laid over
   the first. */
.aya-act-sweep{position:absolute;left:0;bottom:-1px;z-index:5;display:block;width:100%;height:clamp(40px,12.5vw,260px);transform-origin:50% 100%;transform:scaleX(1.25) scaleY(0);pointer-events:none}
html[data-aya-act="sweep"] .aya-act-sweep{will-change:transform}
html[data-aya-act="still"] .aya-act-sweep{display:none}
@media (prefers-reduced-motion:reduce),print{.aya-act-sweep{display:none!important}
 html[data-aya-act] main [data-aya-act-hero] .hero__content,
 html[data-aya-act] main [data-aya-act-hero] .association-hero__copy{transform:none!important;opacity:1!important}
}
