
.split-story, .split-story *{box-sizing:border-box} .split-story{font-family:Arial,Helvetica,sans-serif;color:#181818}
.split-story{position:relative;width:100%;isolation:isolate}.split-story__track{height:370vh;min-height:2200px;position:relative}
.split-story__stage{width:100%;height:100vh;height:100dvh;min-height:540px;position:absolute;inset:0 auto auto 0;background:#f7f7f8;overflow:hidden;z-index:1}
.split-story__stage.is-fixed{position:fixed;top:0;z-index:40}.split-story__stage.is-bottom{position:absolute;top:auto;bottom:0}
.split-story__copy-area{position:absolute;top:4%;left:50%;transform:translateX(-50%);width:min(92%,830px);height:35%;min-height:215px;z-index:4;text-align:center;pointer-events:none}
.split-story__copy{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;opacity:0;transition:none;will-change:opacity}
.split-story__eyebrow{font-size:clamp(10px,1vw,14px);font-weight:500;letter-spacing:.19em;text-transform:uppercase}
.split-story__headline{font-size:clamp(28px,3.5vw,52px);line-height:1.08;font-weight:600;letter-spacing:-.055em;margin:0;max-width:790px}
.split-story__body{font-size:clamp(13px,1.18vw,17px);line-height:1.72;margin:0;max-width:670px}
.split-story__bikes{position:absolute;top:37%;left:0;right:0;bottom:10%;display:grid;grid-template-columns:1fr 1fr;align-items:center}
.split-story__pane{position:relative;height:100%;min-width:0;overflow:hidden;display:flex;align-items:center;justify-content:center}
.split-story__pane+.split-story__pane{border-left:1px solid #e5e5e7}
.split-story__bike{position:absolute;left:2%;top:0;width:96%;height:100%;object-fit:contain;opacity:0;pointer-events:none;user-select:none;-webkit-user-drag:none;will-change:opacity}
.split-story__nav{position:absolute;left:50%;bottom:4.8%;transform:translateX(-50%);display:flex;gap:14px;padding:12px 17px;background:#fff;border:1px solid #e7e7e7;border-radius:100px;z-index:6;box-shadow:0 8px 26px rgba(0,0,0,.045)}
.split-story__dot{appearance:none;border:0;background:#c1c3c6;border-radius:100%;width:12px;height:12px;padding:0;cursor:pointer;position:relative}
.split-story__dot.active{background:#252525}.split-story__dot.active:after{content:"";position:absolute;inset:-5px;border:1.5px solid #222;border-radius:50%}
.split-story__dot:focus-visible{outline:2px solid #222;outline-offset:7px}
.split-story__progress{position:absolute;height:3px;left:0;right:0;bottom:0;background:#e3e3e3;z-index:5}.split-story__progress>span{display:block;background:#202020;width:0;height:100%}
@media(max-width:767px){.split-story__track{height:310vh;min-height:1500px}.split-story__copy-area{top:6%;height:32%;min-height:160px;width:92%}.split-story__copy{gap:10px}.split-story__headline{font-size:clamp(25px,6vw,37px)}.split-story__body{font-size:13px;line-height:1.45;max-width:520px}.split-story__eyebrow{font-size:10px;letter-spacing:.12em}.split-story__bikes{top:39%;bottom:13%}.split-story__bike{width:106%;left:-3%}.split-story__nav{bottom:5%;gap:13px;padding:11px 15px}}
@media(max-width:430px){.split-story__copy-area{top:4%;height:36%}.split-story__bikes{top:42%;bottom:15%}.split-story__headline{font-size:26px}.split-story__body{font-size:12px}.split-story__nav{bottom:6%}}
@media(prefers-reduced-motion:reduce){.split-story__copy,.split-story__bike{will-change:auto}}

/* 1.0.1: text remains readable throughout a scroll transition.
   Only one copy panel is displayed; bicycle photos still crossfade. */
.split-story__copy{display:none;opacity:0;visibility:hidden;transition:none!important}
.split-story__copy.is-active{display:flex;opacity:1;visibility:visible;animation:split-story-copy-enter .26s ease-out both}
@keyframes split-story-copy-enter{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.split-story__copy.is-active{animation:none}}
