/* The existing picture stays behind the film; the hero's overlay and copy keep their layers. */
.editorial-hero .hero-visual .hero-film{
 position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;
 z-index:1;opacity:0;pointer-events:none;transition:opacity .8s ease;
}
.editorial-hero.has-hero-film .hero-visual .hero-film{opacity:1}
/* Keep the original film pixels intact; protect white copy on the bright rooms
   with a display-only gradient that fades toward the unobstructed right side. */
.editorial-hero .hero-visual::after{
 content:'';position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;
 background:linear-gradient(90deg,#17151366 0%,#17151366 54%,#17151320 77%,transparent 100%);
 transition:opacity .8s ease;
}
.editorial-hero.has-hero-film .hero-visual::after{opacity:1}
.editorial-hero>.hero-film-toggle{
 --hero-film-header-height:88px;
 position:absolute;top:calc(var(--hero-film-header-height) + 20px);
 right:var(--site-inset,var(--site-gutter,24px));z-index:2;
 display:grid;place-items:center;box-sizing:border-box;width:44px;height:44px;padding:0;
 appearance:none;border:1px solid #ffffff80;border-radius:50%;background:#211f1d80;color:#fffdf8;
 cursor:pointer;touch-action:manipulation;backdrop-filter:blur(8px);
}
.editorial-hero>.hero-film-toggle[hidden]{display:none}
.editorial-hero>.hero-film-toggle::before{
 content:'';display:block;width:12px;height:14px;
 background:linear-gradient(90deg,currentColor 0 3px,transparent 3px 9px,currentColor 9px 12px);
}
.editorial-hero>.hero-film-toggle[data-state=paused]::before{
 width:0;height:0;margin-left:3px;background:none;
 border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:11px solid currentColor;
}
.editorial-hero>.hero-film-toggle:hover{background:#211f1db3;border-color:#fffdf8}
.editorial-hero>.hero-film-toggle:focus-visible{outline:2px solid #fffdf8;outline-offset:5px}
@media(max-width:900px){.editorial-hero>.hero-film-toggle{--hero-film-header-height:74px}}
@media(max-width:600px){.editorial-hero>.hero-film-toggle{--hero-film-header-height:68px}.editorial-hero .hero-visual::after{background:linear-gradient(90deg,#17151366,#1715131a)}}
@media(prefers-reduced-motion:reduce){
 .editorial-hero .hero-visual .hero-film,.editorial-hero>.hero-film-toggle{display:none!important;transition:none}
}