/* Permanent device shells and replaceable, pixel-preserving focus crops. */
.bizterior-landing .ex-story{position:relative;isolation:isolate;padding:0!important;--ex-top:64px;--ex-height:calc(100svh - 64px);--ex-stride:640px;scroll-margin-top:0;background:#fff}
.bizterior-landing .ex-theme-blue{background:#f4f8ff}
.ex-stage,.ex-stops{display:none}
.is-explainer .ex-stage{display:flex;flex-direction:column;position:sticky;top:var(--ex-top);height:var(--ex-height);max-height:1100px;overflow:clip;transform:translateZ(0);background:inherit;z-index:1}
.is-explainer .ex-stops{display:block;position:absolute;top:0;left:0;right:0;pointer-events:none}
.ex-scroll-stop{height:var(--ex-stride);scroll-margin-top:0}
.ex-stage-inner{display:grid;grid-template-columns:.92fr 1.35fr;align-items:center;gap:28px;width:min(1240px,100% - 96px);margin:auto;flex:1;min-height:0;position:relative}
.ex-copy-stack{position:relative;align-self:stretch;display:flex;align-items:center;z-index:3}
.ex-copy{margin:0;min-width:0}
.is-explainer .ex-copy{position:absolute;left:0;right:0;opacity:0;visibility:hidden;will-change:transform,opacity}
.is-explainer .ex-copy.is-ex-visible{visibility:visible}
.ex-eyebrow{display:block;font-size:14px;line-height:1.5;color:#2879ed;font-weight:650;margin-bottom:23px;letter-spacing:-.015em}
.bizterior-landing .ex-copy h2{font-size:clamp(30px,3.35vw,48px);line-height:1.3;letter-spacing:-.045em;font-weight:700;color:#192a42;margin:0}
.ex-copy p{font-size:16px;line-height:1.85;letter-spacing:-.018em;color:#64748b;margin:27px 0 0}
.ex-result{display:flex;align-items:center;gap:9px;font-size:13px;letter-spacing:-.018em;font-weight:600;color:#2879ed;margin-top:30px;line-height:1.6}
.ex-result>span{font-size:20px;font-weight:500}
.ex-sequence{position:absolute;bottom:44px;left:0;right:0;display:flex;gap:20px;flex-wrap:wrap}
.ex-sequence-item{display:flex;align-items:center;gap:6px;color:#9ca7b7;font-size:10px;line-height:1.5;transition:color .2s}
.ex-sequence-item b{font-variant-numeric:tabular-nums;font-size:9px;font-weight:600}
.ex-sequence-item.is-ex-active{color:#2879ed;font-weight:650}
.ex-visual{height:100%;min-height:0;position:relative;perspective:1500px;display:flex;align-items:center;justify-content:center}
.ex-desktop-rig{position:relative;width:100%;transform-style:preserve-3d;transform:rotateY(-8deg) rotateX(3deg) rotateZ(1.4deg)}
.ex-desktop-rig .ex-device{transform:none}
.ex-desktop-rig .ex-detail-stack{transform-style:preserve-3d}
.ex-device{position:relative;width:100%;background:#eaf0f7;border:1px solid #bfcbdc;border-radius:16px;padding:4px;box-shadow:0 35px 70px -32px #25467c44,0 8px 14px -10px #25467c40;transform:rotateY(-8deg) rotateX(3deg) rotateZ(1.4deg);flex:none;overflow:hidden}
.ex-window-bar{height:24px;display:flex;align-items:center;gap:4px;padding:0 10px;border-radius:11px 11px 0 0;background:linear-gradient(#fafcff,#eaf0f6);position:relative}
.ex-window-bar>span{width:5px;height:5px;background:#bcc8d8;border-radius:50%}
.ex-window-bar i{position:absolute;inset:0;display:grid;place-content:center;font-size:9px;color:#8b9ab0;font-style:normal;font-weight:500;letter-spacing:.04em}
.ex-screen-stack{position:relative;aspect-ratio:1280/720;overflow:hidden;border-radius:0 0 11px 11px;background:#f7f9fc}
.ex-screen{position:absolute;inset:0;opacity:0;visibility:hidden}
.ex-screen.is-ex-visible{visibility:visible}
.ex-screen>img{display:block;width:100%;height:100%;object-fit:contain;opacity:.42}
.ex-spot{position:absolute;display:block;border:1.5px solid #3180f9;border-radius:6px;background:#3180f918;box-shadow:0 0 0 5px #3180f910}
.ex-detail-stack{position:absolute;inset:0;pointer-events:none;z-index:2}
.ex-detail{width:min(var(--detail-width),88%);margin:0;position:absolute;left:50%;top:50%;opacity:0;visibility:hidden;will-change:transform,opacity}
.ex-detail.is-ex-visible{visibility:visible}
.ex-detail-image{border:1px solid #d2deed;border-radius:15px;overflow:hidden;background:#fff;box-shadow:0 30px 70px -30px #17366655,0 4px 10px -4px #24416b20}
.ex-crop{position:relative;width:100%;overflow:hidden;background:#fff}
.ex-crop img{position:absolute;height:auto;display:block}
.ex-detail figcaption{display:flex;align-items:center;justify-content:center;gap:7px;color:#37649f;font-size:11px;line-height:1.6;margin-top:15px;font-weight:550;text-align:center}
.ex-detail-dot{width:5px;height:5px;background:#3180f9;border-radius:50%;flex:none}
.ex-record-panel{position:absolute;top:-12px;left:44%;width:232px;padding:18px;background:#fff;border:1px solid #c9d9ed;border-radius:14px;box-shadow:10px 16px 32px -16px #24446b55;transform:translateZ(22px);font-size:10px;color:#5d718c;text-align:left}
.ex-record-kicker{font-size:9px;color:#3180f9;display:block;margin-bottom:8px}.ex-record-panel>strong{display:block;font-size:20px;color:#20334b;letter-spacing:-.03em;font-weight:650}
.ex-record-time{margin-top:13px;background:#f0f6ff;border-radius:7px;padding:9px 10px;display:flex;justify-content:space-between;align-items:center;gap:8px}.ex-record-time b{color:#2879ed;font-size:10px;font-weight:600}
.ex-record-panel dl{margin:13px 0;padding:0;display:grid;gap:8px}.ex-record-panel dl>div{display:flex;justify-content:space-between;gap:10px}.ex-record-panel dt{color:#8593a6}.ex-record-panel dd{margin:0;color:#435b79;display:flex;gap:4px;align-items:center}.ex-record-panel>p{font-size:9px;margin:12px 0 0;border-top:1px solid #e9eff7;padding-top:10px;color:#7590b2}
.ex-has-record figcaption{margin-top:25px}
.ex-stage-foot{width:min(1240px,100% - 96px);margin:0 auto;display:flex;justify-content:space-between;align-items:center;height:53px;flex:none;border-top:1px solid #dce5f250;gap:12px;font-size:10px;color:#91a0b5}
.ex-stage-foot p{margin:0}.ex-scroll-hint{display:flex;align-items:center;gap:9px}.ex-scroll-hint>span{color:#3180f9;font-size:16px}.ex-position{font-variant-numeric:tabular-nums;letter-spacing:.06em}.ex-position b{font-weight:650;color:#2879ed}
.ex-phone .ex-stage-inner{grid-template-columns:1fr 1.15fr}
.ex-phone .ex-visual{perspective:1350px}
.ex-phone-rig{position:relative;width:min(320px,calc((var(--ex-height) - 112px)*.48446));aspect-ratio:873/1802;transform-style:preserve-3d;transform:rotateX(18deg) rotateY(-18deg) rotateZ(8deg);flex:none}
.ex-body-slice{position:absolute;left:4.7%;top:2.3%;width:90.6%;height:95.2%;border-radius:16%/7.6%;transform:translateZ(calc(var(--slice)*-1px));background:linear-gradient(105deg,#22282e 0%,#b3bcc4 2%,#e6e9ec 6%,#9ba5ad 45%,#d4dbe1 91%,#59666e 99%);border:1px solid #83919e;box-shadow:inset -1px -2px 1px #0c162644,inset 1px 1px 1px #fff8}
.ex-body-slice:first-child{box-shadow:12px 20px 38px -10px #273a5150,inset -1px -2px 1px #0c162644}
.ex-bottom-hardware{position:absolute;left:35%;top:97.5%;width:31%;height:17px;transform-origin:top;transform:rotateX(-90deg);display:flex;align-items:center;justify-content:center;gap:8%;background:linear-gradient(#9aa5ae,#d1d7dd 40%,#a0abb3);border-radius:3px}
.ex-bottom-hardware b{width:24%;height:6px;border-radius:3px;background:#1c242c;box-shadow:inset 0 1px 1px #000}.ex-bottom-hardware i{width:23%;height:3px;background:radial-gradient(circle,#35424e 1px,#0000 1.5px) 0 50%/5px 3px repeat-x}
.ex-side-hardware{position:absolute;left:95.3%;top:28%;width:17px;height:10%;transform-origin:left;transform:rotateY(90deg);border:1px solid #71808c;border-radius:4px;background:linear-gradient(90deg,#6f7c87,#d2d9df 30%,#a7b1ba 80%,#64727c)}
.ex-phone .ex-device{width:100%;height:100%;aspect-ratio:873/1802;padding:0;border:0;border-radius:0;background:none;overflow:visible;transform:none;box-shadow:none;position:relative}
.ex-phone-chassis{position:absolute;inset:0;width:100%;height:100%;display:block}
.ex-phone .ex-screen-stack{position:absolute;left:8.7%;top:4.27%;width:82.5%;height:91.1%;aspect-ratio:auto;border-radius:13%/6.3%;background:#fff}
.ex-phone .ex-screen>img{opacity:.87;object-fit:fill}
.ex-real-camera{position:absolute;top:5.14%;left:38.0%;width:24.7%;height:3.55%;border-radius:30px;background-image:url('/assets/bizterior-phone-chassis-20261011.png');background-size:404.86% 2816.9%;background-position:50.2% 5.41%;z-index:5}
.ex-phone .ex-detail-stack{transform-style:preserve-3d}
.ex-phone .ex-detail{left:50%;top:var(--phone-focus-top);width:var(--phone-focus-width);transform-style:preserve-3d}
.ex-phone .ex-detail-image{border-radius:18px;border-color:#c4d9f7;box-shadow:8px 24px 35px -14px #183f794a,0 3px 7px -3px #17407022}
.ex-hero-teaser{max-width:1000px;margin:68px auto 0;perspective:1600px;padding:0 24px}
.ex-hero-crop{border:1px solid #dbe5f2;border-radius:18px;box-shadow:0 30px 70px -46px #29477455;overflow:hidden;max-height:370px;transform:rotateX(5deg);mask-image:linear-gradient(#000 65%,#0000);background:#f5f8ff}
.ex-hero-crop img{display:block;width:100%;height:auto}
.ex-hero-teaser>p{text-align:center;color:#8090a8;font-size:13px;line-height:1.7;margin:8px 0 0}
.ex-evidence-note{text-align:center;font-size:11px;line-height:1.8;color:#8492a6;padding:24px 24px 35px;margin:0;background:#f4f8ff}
/* No JS, reduced motion, or a short viewport: no hidden chapters or long empty runway. */
.ex-fallback{max-width:1200px;margin:auto;padding:70px 48px}
.is-explainer .ex-fallback{display:none}
.ex-static-scene{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding:65px 0}
.ex-static-scene .ex-detail{position:relative;left:auto;top:auto;opacity:1;visibility:visible;width:min(var(--detail-width),100%);justify-self:center;transform:none}
.ex-fallback-note{font-size:11px;color:#91a0b5;text-align:center}
@media(min-width:1600px){.ex-stage-inner{gap:70px}.ex-detail{width:min(calc(var(--detail-width)*1.15),88%)}}
@media(max-width:1000px) and (min-width:701px){.ex-stage-inner{width:calc(100% - 64px);gap:20px;grid-template-columns:1fr 1.3fr}.bizterior-landing .ex-copy h2{font-size:32px}.ex-copy p{font-size:14px}.ex-eyebrow{font-size:12px}.ex-result{font-size:11px}.ex-stage-foot{width:calc(100% - 64px)}.ex-sequence{gap:11px}.ex-sequence-item{font-size:9px}.ex-detail{width:min(var(--detail-width),97%)}.ex-phone .ex-stage-inner{grid-template-columns:1fr 1fr}}
@media(max-width:700px){
 .bizterior-landing .ex-story{--ex-top:60px;scroll-margin-top:0}
 .ex-stage-inner,.ex-phone .ex-stage-inner{width:calc(100% - 40px);grid-template-columns:1fr;grid-template-rows:43% 57%;gap:0;padding-top:22px;flex:1}
 .ex-copy-stack{align-items:center;display:block}
 .is-explainer .ex-copy{top:0;bottom:auto}
 .ex-eyebrow{font-size:11px;margin-bottom:12px}
 .bizterior-landing .ex-copy h2{font-size:clamp(25px,6.5vw,36px);line-height:1.32;letter-spacing:-.04em}
 .ex-copy p{font-size:12px;line-height:1.8;margin-top:16px}
 .ex-result{font-size:10px;margin-top:14px;gap:6px}.ex-result>span{font-size:14px}
 .ex-sequence{display:none}
 .ex-visual{align-items:center;min-height:0}
 .ex-desktop-rig{width:94%;transform:rotateY(-5deg) rotateX(4deg) rotateZ(1deg)}.ex-device{width:100%;border-radius:11px;padding:3px}
 .ex-window-bar{height:18px;padding:0 6px;gap:3px}.ex-window-bar>span{width:4px;height:4px}.ex-window-bar i{font-size:7px}.ex-screen-stack{border-radius:0 0 7px 7px}
 .ex-detail{width:min(var(--detail-width),94%);top:49%}
 .ex-detail-image{border-radius:13px}.ex-detail figcaption{font-size:9px;margin-top:10px}
 .ex-record-panel{width:62%;padding:12px;left:43%;font-size:8px;top:-12px}.ex-record-panel>strong{font-size:16px}.ex-record-kicker{font-size:7px;margin-bottom:5px}.ex-record-time{padding:6px;margin-top:8px;gap:2px}.ex-record-time b{font-size:7px}.ex-record-panel dl{gap:5px;margin:8px 0}.ex-record-panel>p{font-size:7px;padding-top:6px;margin-top:7px}.ex-record-panel dd img{width:9px;height:9px}.ex-has-record figcaption{margin-top:26px}
 .ex-stage-foot{width:calc(100% - 40px);height:43px;font-size:8px;gap:6px}.ex-scroll-hint{display:none}.ex-position{font-size:9px}
 .ex-phone-rig{width:min(215px,calc((var(--ex-height)*.57 - 24px)*.48446));transform:rotateX(18deg) rotateY(-18deg) rotateZ(8deg)}
 .ex-phone .ex-visual{perspective:1000px}.ex-phone .ex-detail{width:var(--phone-focus-width);left:50%;top:var(--phone-focus-top)}.ex-phone .ex-detail-image{border-radius:13px}
 .ex-hero-teaser{padding:0;margin-top:40px}.ex-hero-crop{border-radius:12px;max-height:190px}.ex-hero-teaser>p{font-size:10px;margin-top:16px}
 .ex-evidence-note{font-size:9px;padding:20px 30px}
 .ex-fallback{padding:40px 24px}.ex-static-scene{grid-template-columns:1fr;gap:35px;padding:35px 0 60px}.ex-static-scene .ex-copy{position:static}.ex-static-scene .ex-copy h2{font-size:28px}.ex-static-scene .ex-detail{width:min(var(--detail-width),95%)}
}
@media(prefers-reduced-motion:reduce){.ex-device,.ex-hero-crop{transform:none}.ex-sequence-item{transition:none}}