/* First act → second act (act-shrink.js). The opening banner is pinned on wide
   layouts and draws its photograph in towards the centre while the title holds;
   everything else here only makes room for that. */
@media (min-width:961px){
 html[data-aya-act="shrink"] main [data-aya-act-stage]{position:sticky;top:0;z-index:0}
 html[data-aya-act="shrink"] main [data-aya-act-stage]~*{position:relative;z-index:1;background-color:var(--bg,#fff)}
 /* The pinned stretch after a banner that keeps its own height shows the page's ground, never the sticky footer behind main. */
 html[data-aya-act="shrink"] main{background-color:var(--bg,#fff)}
}
html[data-aya-act] main [data-aya-act-stage]>.hero__media,html[data-aya-act] main [data-aya-act-stage]>.association-hero__motion{transform-origin:50% 50%}
html[data-aya-act="shrink"] main [data-aya-act-stage]>.hero__media{overflow:hidden;will-change:transform}
html[data-aya-act="shrink"] main [data-aya-act-stage]>.association-hero__motion{overflow:hidden}
.association-hero.association-hero--act .association-hero__motion{animation-play-state:paused}
/* The lattice of marks on the uncovered ground: below the banner's photograph
   (which sits at z-index -1 on the home banner and 0 elsewhere), above its ground. */
.aya-act-lattice{position:absolute;inset:0;z-index:-2;width:100%;height:100%;opacity:0;transform-origin:50% 50%;pointer-events:none}
html[data-aya-act="still"] .aya-act-lattice{display:none}
html[data-aya-act="shrink"] .aya-act-lattice{will-change:transform,opacity}
/* On the Association's other pages the box itself carries the banner drift (the
   keyframes are banner-motion.css's), so no picture inside needs a layer of its own. */
html[data-aya-act="shrink"] main [data-aya-act-stage].phero>.hero__media.aya-act-drift{--banner-drift-x:min(18px,5vw);transform-origin:50% 50%;transform:scale(1.12);animation:ayaBannerDrift 18s ease-in-out infinite;animation-play-state:paused}
html[data-aya-act="shrink"] main [data-aya-act-stage].phero[data-banner-active="true"]>.hero__media.aya-act-drift{animation-play-state:running}
/* The ring on the drawn-in edge, in the ground colour, above the photograph. */
.aya-act-frame{position:absolute;inset:0;display:none;pointer-events:none;transform-origin:0 0;outline:2px solid var(--aya-act-ground,#000);outline-offset:-1px;will-change:transform}
/* The Youth home carousel's figures crossfade and settle on the compositor; keeping
   them there for good means no repaint of the whole banner at either end of a fade. */
html[data-aya-act="shrink"] main [data-aya-act-stage]>.hero__media>.bill__fig{will-change:transform,opacity}
[data-aya-act-pose="drawing"]>.aya-act-frame,[data-aya-act-pose="drawn"]>.aya-act-frame{display:block}
/* Over the pinned banner's ground the header carries no bar of its own: the lattice runs on beneath it. */
html[data-aya-act-header="ground"] .header.is-scrolled:not(.is-open){background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
@media (prefers-reduced-motion:reduce),print{.aya-act-lattice,.aya-act-frame{display:none!important}
 html[data-aya-act="shrink"] main [data-aya-act-stage].phero>.hero__media.aya-act-drift{animation:none;transform:none}
 html[data-aya-act] main [data-aya-act-stage]>.hero__media,html[data-aya-act] main [data-aya-act-stage]>.association-hero__motion{transform:none!important}
}
