:root{
  --mo-ease:cubic-bezier(.2,.7,.2,1);
  --mo-dur:.8s;
}

html.mo .rv{opacity:0;transform:translateY(16px);transition:opacity var(--mo-dur) var(--mo-ease),transform var(--mo-dur) var(--mo-ease)}
html.mo .rv.in{opacity:1;transform:none}

html.mo .ttl-rule.rv{opacity:1;transform:scaleX(0);transform-origin:left center;transition:transform 1s var(--mo-ease) .25s}
html.mo .ttl-rule.rv.in{transform:none}

.rows summary .plus{position:relative;transition:background-color .3s,color .3s}
.rows summary .plus:before,
.rows details[open] summary .plus:before,
.rows summary .plus:after{content:"";position:absolute;left:50%;top:50%;width:14px;height:1.5px;background:currentColor;transform:translate(-50%,-50%)}
.rows summary .plus:after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .4s var(--mo-ease)}
.rows details[open] summary .plus:after{transform:translate(-50%,-50%) rotate(0deg)}
.rows.faq summary .plus:before,.rows.faq summary .plus:after{width:12px}
.rows .body.mo-anim{overflow:hidden}

@keyframes mo-up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes mo-wipe{from{opacity:.001;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
@keyframes mo-line{from{transform:scaleY(0)}to{transform:none}}
html.mo.fv-play .fv .label,
html.mo.fv-play .fv h1,
html.mo.fv-play .fv .lead,
html.mo.fv-play .fv .fact,
html.mo.fv-play .fv .btns{opacity:0;animation:mo-up .8s var(--mo-ease) forwards}
html.mo.fv-play .fv .label{animation-delay:.1s}
html.mo.fv-play .fv h1{animation-delay:.25s}

html.mo.fv-play .fv .four{position:relative;border-left-color:transparent}
html.mo.fv-play .fv .four:before{content:"";position:absolute;left:-2px;top:0;bottom:0;width:2px;background:var(--gold);transform-origin:top center;transform:scaleY(0);animation:mo-line 1.4s var(--mo-ease) .55s forwards}
html.mo.fv-play .fv .four span{opacity:0;animation:mo-wipe .9s cubic-bezier(.5,0,.2,1) forwards}
html.mo.fv-play .fv .four span:nth-child(1){animation-delay:.6s}
html.mo.fv-play .fv .four span:nth-child(2){animation-delay:.9s}
html.mo.fv-play .fv .four span:nth-child(3){animation-delay:1.2s}
html.mo.fv-play .fv .four span:nth-child(4){animation-delay:1.5s}

html.mo.fv-play .fv .four ~ .lead{animation-delay:1.85s}
html.mo.fv-play .fv .four ~ .btns{animation-delay:2.0s}

html.mo.fv-play .fv h1 + .lead{animation-delay:.5s}
html.mo.fv-play .fv .fact{animation-delay:.75s}
html.mo.fv-play .fv .fact ~ .btns{animation-delay:1.0s}

@keyframes mo-fade{from{opacity:0}to{opacity:1}}
html.mo.fv-play .fv .photo{opacity:0;animation:mo-fade .9s ease-out 1.8s forwards}

.strip-wrap{margin:0 0 8px}
.strip{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:6px 0 14px;outline:none}
.strip::-webkit-scrollbar{display:none}
.strip:focus-visible{box-shadow:inset 0 0 0 2px var(--gold)}
.strip-list{display:flex;gap:20px;width:max-content;padding:0 max(16px,calc((100vw - var(--w)) / 2 + 16px))}
.strip.loop .strip-list{padding-right:0}
.shot{width:340px;flex:0 0 auto}
.shot .browser{box-shadow:0 6px 18px rgba(30,42,74,.08)}
.shot .browser .bar{height:22px;padding:0 9px;gap:5px}
.shot .browser .bar i{width:7px;height:7px}
.shot .browser .bar span{height:11px}
.shot .scr{aspect-ratio:16/10}
.shot .scr img{width:100%;height:100%;object-fit:cover;object-position:top}
.shot .who{display:block;font-size:13px;color:var(--sub);margin-top:10px;letter-spacing:.04em}
@media (max-width:720px){.shot{width:250px}.strip-list{gap:14px}}
.strip-ctrl{display:flex;gap:10px;align-items:center;margin-top:6px}
.strip-ctrl button{font:inherit;font-size:14px;font-weight:700;color:var(--navy);background:#fff;border:1px solid var(--navy);min-width:48px;height:48px;padding:0 16px;cursor:pointer;position:relative;transition:background-color .2s,color .2s}
.strip-ctrl button:hover{background:var(--navy);color:#fff}
.strip-ctrl .sc-prev:before,.strip-ctrl .sc-next:before{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;border-top:2px solid currentColor;border-right:2px solid currentColor}
.strip-ctrl .sc-prev:before{transform:translate(-30%,-50%) rotate(-135deg)}
.strip-ctrl .sc-next:before{transform:translate(-70%,-50%) rotate(45deg)}
.strip-ctrl .sc-toggle{min-width:96px}
html:not(.mo) .strip-ctrl .sc-toggle{display:none}
.cases-text{margin-top:20px}
.cases-text .case h3{margin-top:18px}

@media (prefers-reduced-motion:reduce){
  html.mo .rv{opacity:1!important;transform:none!important;transition:none!important}
  html.mo .fv *,html.mo .fv{animation:none!important;opacity:1!important}
  html.mo .fv .four:before{transform:none!important}
  .rows summary .plus:after{transition:none}
}
