.hero-intro-link { display:inline-flex; align-items:center; gap:9px; min-height:44px; margin-top:12px; color:#bce7d3; font-size:13px; text-decoration:none; }
.hero-intro-link:hover { color:#fff; text-decoration:underline; }
.intro-play-mark { display:grid; place-items:center; width:27px; height:27px; border:1px solid #8edebf60; border-radius:50%; font-size:14px; }
.homepage-motion { position:relative; height:900svh; width:100%; margin:35px 0 0; padding:0; background:#07090c; scroll-margin-top:-108px; }
.homepage-motion-stage { position:sticky; top:0; height:100svh; min-height:0; overflow:hidden; isolation:isolate; }
.homepage-motion #mocix-intro { position:absolute; inset:0; width:100%; max-width:none; height:100%; margin:0; }
.homepage-motion #mocix-intro .mi-film { width:100%; height:100%; min-height:0; aspect-ratio:auto; border-radius:0; }
.homepage-motion #mocix-intro .mi-masthead,
.homepage-motion #mocix-intro .mi-footer-label { display:none; }
.homepage-motion #mocix-intro .mi-copy,
.homepage-motion #mocix-intro .mi-prelude-heading { top:120px; left:8%; right:8%; }
.homepage-motion #mocix-intro .mi-prelude-heading h2 { font-size:clamp(30px,4cqw,50px); }
.homepage-motion #mocix-intro .mi-prelude-screens { left:0; right:0; width:86%; max-width:1280px; margin-inline:auto; height:55%; bottom:11%; }
.homepage-motion #mocix-intro .mi-prelude-word { bottom:5%; }
.homepage-motion #mocix-intro .mi-app { left:max(8%,calc((100% - 1160px)/2)); right:max(8%,calc((100% - 1160px)/2)); top:max(280px,35%); bottom:18%; }
.homepage-motion #mocix-intro .mi-action-label { bottom:10%; }
.homepage-motion #mocix-intro .mi-ending-cta { color:#c6e4d3; text-decoration:none; pointer-events:auto; }
.homepage-motion #mocix-intro .mi-ending-cta:hover { background:#9ed9bc22; }
.motion-scene-nav { position:absolute; right:22px; top:50%; transform:translateY(-50%); display:flex; flex-direction:column; gap:3px; z-index:10; }
.motion-scene-nav button { display:grid; place-items:center; width:34px; height:34px; border:0; background:transparent; color:#c2ead5; border-radius:50%; cursor:pointer; }
.motion-scene-nav button span { display:block; width:5px; height:5px; background:#758b9d; border-radius:50%; transition:transform .25s,background .25s; }
.motion-scene-nav button[aria-current="step"] span { background:#b6e6ce; transform:scale(1.7); box-shadow:0 0 0 5px #b6e6ce12; }
.motion-scene-nav button:focus-visible { outline:2px solid #91edc2; outline-offset:1px; }
.motion-footnote { position:absolute; inset:auto 6% 27px; display:flex; align-items:center; justify-content:space-between; gap:20px; z-index:10; color:#91a2b1; font:12px/1.5 system-ui,-apple-system,"PingFang SC",sans-serif; }
.motion-footnote p { display:flex; gap:18px; margin:0; align-items:center; }
.motion-footnote [data-motion-count] { font-variant-numeric:tabular-nums; color:#7b8d9a; letter-spacing:1px; }
.motion-footnote [data-motion-name] { color:#c4d7cf; }
.motion-footnote a { color:#9aafa6; text-decoration:none; }
.motion-footnote a:hover { color:#fff; }
.intro-story-page { margin:0; background:#07090c; }
.intro-story-page .homepage-motion { margin-top:0; }
.story-review-end { padding:100px 20px; text-align:center; font:16px system-ui; }
.story-review-end a { color:#b6e6ce; }
@media(max-width:700px) {
  .hero-intro-link { margin-top:6px; font-size:12px; }
  .homepage-motion { margin-top:20px; }
  .homepage-motion #mocix-intro .mi-copy,
  .homepage-motion #mocix-intro .mi-prelude-heading { top:105px; left:23px; right:23px; }
  .homepage-motion #mocix-intro .mi-prelude-heading h2 { font-size:29px; }
  .homepage-motion #mocix-intro .mi-prelude-screens { height:43%; width:94%; bottom:14%; }
  .homepage-motion #mocix-intro .mi-prelude-word { bottom:-3%; }
  .homepage-motion #mocix-intro .mi-app { left:5%; right:5%; bottom:21%; }
  .homepage-motion #mocix-intro .mi-action-label { bottom:13%; }
  .motion-scene-nav { top:auto; right:auto; left:50%; bottom:53px; transform:translateX(-50%); flex-direction:row; gap:0; }
  .motion-scene-nav button { width:32px; height:32px; }
  .motion-footnote { inset:auto 20px 23px; font-size:11px; gap:10px; }
  .motion-footnote p { gap:10px; }
  .motion-scroll-hint { display:none; }
}
@media(max-height:650px) and (min-width:701px) {
  .homepage-motion #mocix-intro .mi-copy,.homepage-motion #mocix-intro .mi-prelude-heading { top:95px; }
  .homepage-motion #mocix-intro .mi-title { font-size:31px; }
  .homepage-motion #mocix-intro .mi-subtitle { margin-top:8px; }
  .homepage-motion #mocix-intro .mi-app { top:225px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.motion-scene-nav button span { transition:none; } }