.coastal-film{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.network-laptop>.room-screen-film,.network-fold>.room-screen-film{position:absolute;inset:0;width:100%;height:100%;z-index:3;opacity:0;animation:room-film-reel 24s infinite;animation-play-state:paused;background:#e9dfcf}
.network-fold>.room-screen-film{animation-delay:-8s}.network-room.is-moving .room-screen-film{animation-play-state:running}
.room-screen-film:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 25px #39271d22;pointer-events:none}
.room-screen-film>span{position:absolute;bottom:0;left:0;right:0;padding:14px 22px;background:#33291dde;color:#fff6e8;font:500 15px/1.4 var(--si-sans);letter-spacing:.1em}
.live-screen>.coastal-film{position:absolute;inset:0;filter:brightness(.82)}
.live-screen.has-footage .live-film>img{display:none}.live-screen.has-footage .live-screen-mark,.live-screen.has-footage .live-screen-foot{z-index:2}
.motion-passage{position:relative;isolation:isolate;overflow:hidden;background:#3d3227;color:#fff8e9;min-height:640px;height:min(860px,85svh);width:100%}
.motion-passage>.coastal-film{position:absolute;inset:0;z-index:-2;object-position:center}
.motion-passage:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#201a13b8,transparent 90%),linear-gradient(0deg,#251b138c,transparent 50%)}
.motion-passage-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;height:100%;padding:8vw;max-width:980px}
.motion-passage .si-eyebrow{font:500 13px/1.7 var(--si-sans);letter-spacing:.13em;color:#fff5e2;margin:0 0 28px}
.motion-passage h2{font:400 clamp(58px,6.5vw,100px)/1.02 var(--si-serif);letter-spacing:-.03em;margin:0 0 30px;color:inherit!important;text-wrap:balance}
.motion-passage h2 em{color:#f2d7b1;font-weight:400}.motion-passage-copy>p:not(.si-eyebrow){font:400 18px/1.8 var(--si-sans);color:#fff5e4;max-width:37ch}
.motion-passage .motion-link{display:inline-flex;align-items:center;gap:35px;background:#fbf4e6;color:#4b301c!important;padding:17px 25px;border-radius:35px;text-decoration:none;font:500 16px/1.5 var(--si-sans);margin-top:24px;min-height:54px}
.motion-passage .motion-link:hover{background:#e9d3b3}.motion-passage .motion-link:focus-visible{outline:3px solid #fff;outline-offset:5px}
.motion-passage .motion-credit{position:absolute;right:4%;bottom:24px;max-width:80%;font:400 12px/1.5 var(--si-sans);color:#fff4df;letter-spacing:.06em}
.chapter-visual>.coastal-film{aspect-ratio:16/10;height:auto;object-fit:cover}
@keyframes room-film-reel{0%,42%,100%{opacity:0}48%,90%{opacity:1}}
@supports(animation-timeline:view()){
 .motion-passage>.coastal-film{animation:passage-drift linear both;animation-timeline:view();animation-range:entry 0% exit 100%}
 @keyframes passage-drift{from{transform:scale(1.1) translateY(-3%)}to{transform:scale(1.1) translateY(3%)}}
}
@media(max-width:700px){.motion-passage{height:740px;min-height:0;max-height:92svh}.motion-passage-copy{padding:40px 25px}.motion-passage h2{font-size:clamp(48px,12vw,68px)}.motion-passage-copy>p:not(.si-eyebrow){font-size:16px}.motion-passage .si-eyebrow{font-size:11px}.motion-passage .motion-credit{font-size:10px;left:25px;bottom:18px}.motion-passage:after{background:linear-gradient(90deg,#201a13bb,#201a1333),linear-gradient(0deg,#251b1366,transparent)}}
@media(prefers-reduced-motion:reduce){.motion-passage>.coastal-film,.room-screen-film{animation:none!important}.network-laptop>.room-screen-film,.network-fold>.room-screen-film{display:none}}
/* The main room's monitor is an actual moving website composition. */
.si-room-screen[data-screen="monitor"]{color:#4e3424;background:#fbf7f1}
.si-room-screen[data-screen="monitor"]>.coastal-film{position:absolute;left:45%;top:0;width:55%;height:100%;object-position:center}
/* Client-site loop: the whole monitor is the website. */
.si-room-screen[data-screen="monitor"]>.coastal-film.si-client-sites{left:0;width:100%;object-position:center top}
.si-monitor-copy{position:absolute;inset:0 55% 0 0;padding:35px 26px;color:#4e3424;background:#fbf7f1;display:flex;flex-direction:column;justify-content:center;gap:25px;text-align:left}
.si-monitor-copy small{font:500 12px/1.5 var(--si-sans);letter-spacing:.2em}
.si-monitor-copy strong{font:400 55px/.98 var(--si-serif);letter-spacing:-.03em}
.si-monitor-copy em{font-weight:400;color:#985e35}.si-monitor-copy>span{font:400 14px/1.5 var(--si-sans)}
.si-arch:has(>.coastal-film){position:relative}
.si-arch>.coastal-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1s ease}
.si-door:hover .coastal-film{transform:scale(1.025)}
.net-contact-aside>.contact-room-photo{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:100% 100% 8px 8px;margin-bottom:30px}
@media(prefers-reduced-motion:reduce){.si-door:hover .coastal-film{transform:none}}
/* Picture films: the same photograph with its screens playing, laid exactly over the still. */
.si-feature-image:has(>.si-screen-film),.si-media:has(>.si-screen-film){position:relative}
/* Cards without the .si-media frame (French homepage) get a frame of their own. */
.si-screen-frame{position:relative;display:block;overflow:hidden;border-radius:20px;margin-bottom:24px}
.si-screen-frame>img{display:block;width:100%;margin:0!important;border-radius:0!important}
:is(.si-feature-image,.si-media,.si-screen-frame)>.si-screen-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;transition:transform 1.1s var(--si-ease)}
.si-elevated a:hover>.si-media .si-screen-film{transform:scale(1.045)}