/* Inline intro replaces only the title/copy area; preserves the surrounding hero. */
.hero-intro-slot{width:100%;min-width:0;max-width:100%;position:relative;isolation:isolate;min-height:260px}
.hero-intro-slot.is-video-open{aspect-ratio:854/480}
.hero-intro-slot.is-video-open #hero-intro-copy{visibility:hidden;pointer-events:none}
.hero-video-panel{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;z-index:8}
.hero-video-panel[hidden]{display:none}
.hero-video-frame{flex-shrink:0;position:relative;width:100%;aspect-ratio:854/480;border-radius:22px;overflow:hidden;background:#0b2239;box-shadow:0 14px 42px #102e552b;border:2px solid #ffffffd9}
#hero-intro-video{display:block;width:100%;height:100%;object-fit:contain;background:#0b2239}
#hero-intro-video::cue{color:#fff;background:#102b46eb;font:600 16px/1.45 'PingFang SC','Microsoft YaHei',sans-serif}
.hero-video-close{position:absolute;right:10px;top:10px;z-index:3;width:36px;height:36px;border-radius:50%;background:#fffffff2;color:#173e6c;font:28px/1 sans-serif;box-shadow:0 2px 12px #0003;display:grid;place-items:center}
.hero-video-close:hover{background:white;transform:scale(1.06)}
.hero-video-close:focus-visible{outline:3px solid #ffcb53;outline-offset:2px}
.hero-video-status{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:9px 15px;border-radius:20px;background:#102b46d9;color:white;font-size:13px;pointer-events:none}
.hero-video-status[hidden],.hero-video-error[hidden]{display:none}
.hero-copy .hero-video-error{font-size:12px;line-height:1.5;margin:8px 0 0;max-width:none;padding:8px 12px;background:#fffdf5f0;border-radius:12px}
.hero-video-error a{text-decoration:underline;white-space:nowrap}
@media(min-width:681px){.hero-intro-slot.is-video-open{min-height:290px}}
@media(max-width:680px){.hero-intro-slot{min-height:230px}.hero-video-frame{border-radius:16px}.hero-video-close{width:32px;height:32px;right:7px;top:7px}.hero-video-status{font-size:11px}#hero-intro-video::cue{font-size:13px}.hero-copy .hero-video-error{font-size:11px}}

/* Hero copy disables pointer events for decorative layers; explicitly restore controls. */
#hero-intro-open,.hero-video-panel{pointer-events:auto}
.hero-copy.intro-layout-ready{transform:translateY(var(--intro-safe-shift,0px))!important}
.hero-video-frame{max-width:var(--intro-max-width,100%)}

.hero-video-panel{opacity:1;transition:opacity .5s ease,transform .5s ease}
.hero-video-panel.is-fading-out{opacity:0;transform:translateY(6px);pointer-events:none}
@media(prefers-reduced-motion:reduce){.hero-video-panel{transition:none}}