/* Motion is additive: existing typography and player controls are retained. */
.photo-motion-anchor{display:flow-root;position:relative}
.photo-motion-surface{transform-origin:center center}
.editorial #presentation.intro--silhouette{overflow:visible}
#presentation.intro--silhouette h2{z-index:0;text-align:center}
#presentation.intro--silhouette h2 br{display:revert}
#presentation.intro--silhouette .bio-story{margin-top:-28px;overflow:visible}
#presentation.intro--silhouette .bio-person{z-index:2}
#presentation.intro--silhouette .bio-copy{padding-top:60px}
#regard-terrain .field-copy{inset:0;height:100%;pointer-events:none;-webkit-mask-image:url('../assets/escrime-title-mask.svg');mask-image:url('../assets/escrime-title-mask.svg');mask-mode:luminance;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
#regard-terrain .field-copy h2{position:absolute;bottom:69.5%;left:0;width:100%;margin:0}
#regard-terrain .field-copy .eyebrow{position:absolute;bottom:calc(69.5% + clamp(30px,4vw,76px)*1.12 + 12px);left:0;width:100%}
#coulisses .bts-inner{position:relative;display:block;width:450px;max-width:100%;height:650px;margin-inline:auto}
#coulisses .bts-photo{position:absolute;top:72px;left:0;width:100%;height:auto;aspect-ratio:886/1024;max-width:none;z-index:0}
#coulisses .bts-copy{position:absolute;inset:0;z-index:1;-webkit-mask-image:url('../assets/projector-title-bd.svg');mask-image:url('../assets/projector-title-bd.svg');mask-mode:luminance;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
#coulisses .bts-kicker{position:absolute;top:8px;left:24px;margin:0}
#coulisses h2{position:absolute;top:32px;left:24px;margin:0}
#coulisses .bts-tagline{position:absolute;bottom:12px;left:24px;margin:0;max-width:calc(100% - 48px)}
@media(max-width:760px){
 #presentation.intro--silhouette .bio-story{margin-top:-24px}
 #presentation.intro--silhouette .bio-copy{padding-top:0}
 #presentation.intro--silhouette .bio-person{height:480px;margin-bottom:28px}
 #regard-terrain{height:500px;aspect-ratio:auto;padding:0;overflow:hidden}
 #regard-terrain .field-photo{position:absolute;inset:70px 0 auto;height:420px;aspect-ratio:auto}
 #regard-terrain .field-photo img{object-fit:cover;object-position:center}
 #regard-terrain .field-copy{top:70px;height:420px;-webkit-mask-size:auto 420px;mask-size:auto 420px;-webkit-mask-position:center;mask-position:center}
 #regard-terrain .field-copy h2{bottom:69.5%;font-size:clamp(25px,7.3vw,32px)}
 #regard-terrain .field-copy .eyebrow{bottom:calc(69.5% + 48px)}
 #coulisses .bts-inner{width:390px;height:auto;aspect-ratio:390/650}
 #coulisses .bts-photo{top:11.076923%}
 #coulisses .bts-copy{-webkit-mask-image:url('../assets/projector-title-bm.svg');mask-image:url('../assets/projector-title-bm.svg')}
 #coulisses h2{top:7.0769%;font-size:44px}
}
@media(prefers-reduced-motion:reduce){.photo-motion-surface{transform:none!important}}

/* Hover belongs to the frame, above all player-control surfaces. */
@media(hover:hover) and (prefers-reduced-motion:no-preference){
 .project-frame > .project-cover img{transition:transform .65s cubic-bezier(.22,1,.36,1)}
 .project-frame > iframe,.project-frame > video{transition:scale .65s cubic-bezier(.22,1,.36,1);scale:1}
 .project-frame:not(.is-playing):hover > .project-cover img{transform:scale(1.025)}
 .project-frame:not(.is-playing):not(.native-player):hover > iframe,
 .project-frame:not(.is-playing):hover > video{scale:1.025}
}
/* Restore the large desktop composition; keep photo and mask in one coordinate system. */
@media(min-width:761px){
 #coulisses .bts-inner{width:min(860px,100%);height:auto;aspect-ratio:450/650;container-type:inline-size}
 #coulisses .bts-photo{top:11.076923%}
 #coulisses .bts-kicker{top:1.230769%;left:5.333333%}
 #coulisses h2{top:4.923077%;left:5.333333%;font-size:14.222222cqw}
 #coulisses .bts-tagline{bottom:1.846154%;left:5.333333%;max-width:89.333333%}
}

/* Charcoal compositing must stay inside the transformed group.
   The photograph blends with a real #101010 backing, not a transparent
   transform stacking context. Only the photo receives this treatment. */
#regard-terrain{background:transparent}
#coulisses .bts-photo,
#regard-terrain .field-photo{
 background:var(--bg,#101010);
 isolation:isolate;
 mix-blend-mode:normal;
}
#coulisses .bts-photo img,
#regard-terrain .field-photo img{mix-blend-mode:lighten}
/* Keep the full validated travel within its own layout allocation. */
.photo-motion-anchor--field{padding-block:153px}
.photo-motion-anchor--projectors{padding-block:138px}
@media(max-width:760px){
 .photo-motion-anchor--field{padding-block:103px}
 .photo-motion-anchor--projectors{padding-block:93px}
}
@media(prefers-reduced-motion:reduce){
 .photo-motion-anchor--field,.photo-motion-anchor--projectors{padding-block:0}
}

/* Larger closing stadium scene. Desktop keeps the full original aspect ratio. */
@media(min-width:761px){
 #regard-terrain{width:calc(100% - 32px);max-width:2160px}
}
@media(max-width:760px){
 #regard-terrain{width:100%;height:584px}
 #regard-terrain .field-photo{height:504px}
 #regard-terrain .field-copy{height:504px;-webkit-mask-size:auto 504px;mask-size:auto 504px}
}