/* Responsive native surfaces retain the approved site's layout and live controls. */
.hero-motion .hero-player{border-color:transparent;isolation:isolate}
.hero-motion .frame-surface{position:absolute;inset:-1px;border:1px solid var(--line);border-radius:inherit;background:#fff;z-index:-1;pointer-events:none;transform-origin:center}
.hero-motion .player-screen{background:transparent;overflow:visible;isolation:isolate}
.hero-motion .screen-surface{position:absolute;inset:0;background:var(--media);border-radius:inherit;z-index:-1;pointer-events:none;transform-origin:center}
.hero-motion .player-screen video,.hero-motion .video-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border-radius:inherit;transform-origin:center}
.hero-motion .video-poster{z-index:0}
.hero-motion .player-screen video{z-index:1}
.hero-motion .play-button{z-index:2}
.hero-motion .player-placeholder{position:relative;z-index:2}
.hero-motion [hidden]{display:none!important}
.hero-motion .player-controls{position:relative;background:transparent;isolation:isolate;border-radius:0 0 16px 16px}
.hero-motion .controls-surface{position:absolute;inset:0;background:var(--ink);border-radius:inherit;z-index:-1;transform-origin:left center;pointer-events:none}
.hero-motion .player-label{background:transparent;z-index:3;max-width:90%;white-space:normal;text-align:center}
.hero-motion .label-surface{position:absolute;inset:0;border-radius:inherit;background:var(--surface);z-index:-1;transform-origin:center}
.hero-motion .label-copy{display:block;position:relative}
.hero-motion .cms-photo{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.hero-motion [data-hero-photo]{overflow:hidden}
.hero-motion .video-seek{position:relative;display:block;flex:1;min-width:25px;height:32px;--progress:0%}
.hero-motion .video-rail{position:absolute;left:0;right:0;top:calc(50% - 2px);height:4px;background:#61708c;transform-origin:left center;pointer-events:none}
.hero-motion .video-thumb{position:absolute;left:var(--progress);top:50%;width:15px;height:15px;margin-left:-7.5px;margin-top:-7.5px;background:#d1d1d1;border-radius:50%;z-index:2;pointer-events:none}
.hero-motion .video-seek #video-progress{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:3}
.hero-motion .video-seek:focus-within{outline:3px solid var(--focus);outline-offset:4px;border-radius:4px}
.hero-motion .player-controls [data-play].is-paused .triangle{width:13px;height:16px;border:0;border-inline:4px solid currentColor;margin-left:0}
.hero-motion #video-volume.is-muted{opacity:.55}
.hero-motion .video-status{position:absolute;z-index:4;bottom:12px;left:12px;right:12px;padding:8px 12px;border-radius:8px;background:rgb(255 255 255 / .94);color:var(--ink);font-size:14px;text-align:center}
.hero-motion .hero-player.has-media{justify-self:center;max-width:min(100%,calc(min(70svh,680px)*var(--video-ratio) + 12px))}
.hero-motion .has-media .player-screen{height:auto;aspect-ratio:var(--video-ratio)}
.hero-motion .has-media .screen-surface{background:#102548}
.hero-media-row.hero-motion.has-video{height:auto;min-height:clamp(290px,20.8vw,348px);align-items:center}
.hero-motion .hero-player:fullscreen{display:flex;flex-direction:column;justify-content:center;max-width:none!important;width:100%;height:100%;padding:0;background:#102548;border:0;border-radius:0}
.hero-motion .hero-player:fullscreen .player-screen{flex:1;min-height:0;aspect-ratio:auto;width:100%;border-radius:0}
.hero-motion .hero-player:fullscreen .player-controls{flex-shrink:0;width:100%;background:#102548;color:#fff;border-radius:0}
.hero-motion .hero-player:fullscreen .player-label{display:none}
@media(max-width:1023px){
 .hero-motion .player-controls{border-radius:0 0 10px 10px}
 .hero-motion .controls-surface{background:#fff}
 .hero-motion .video-rail{background:#c7ccd6}
 .hero-motion .video-thumb{width:8px;height:8px;margin-left:-4px;margin-top:-4px}
 .hero-motion .player-controls [data-play].is-paused .triangle{width:9px;height:10px;border-inline-width:3px}
 .hero-media-row.hero-motion.has-video{min-height:0}
 .hero-motion .hero-player.has-media{max-width:min(100%,calc(min(70svh,680px)*var(--video-ratio) + 10px))}
 .hero-motion .video-status{font-size:12px}
}
/* The controls follow the player's width, including a portrait player on desktop. */
.hero-motion .hero-player{container-type:inline-size}
.hero-motion .has-media .player-label{left:50%;translate:-50% 0;width:max-content;max-width:92%}
@container(max-width:450px){
 .hero-motion .player-controls{padding-inline:8px;gap:9px}
 .hero-motion .player-controls #video-time{font-size:11px}
 .hero-motion .player-controls button{width:22px;padding:1px;flex-shrink:0}
 .hero-motion .player-controls .icon{width:15px;height:15px}
 .hero-motion .player-controls .triangle{border-top-width:5px;border-bottom-width:5px;border-left-width:8px;margin-left:1px}
 .hero-motion .video-thumb{width:8px;height:8px;margin-left:-4px;margin-top:-4px}
 .hero-motion .player-label{font-size:13px;padding:8px 12px}
}
