.selmore-motion { position: relative; width: 100%; height: var(--selmore-motion-height, 100vh); z-index: var(--selmore-motion-z, 0); overflow: hidden; pointer-events: none; isolation: isolate; }
.selmore-motion--fixed { position: fixed; inset: 0; width: 100vw; height: 100vh; }
.selmore-motion--sticky { position: sticky; top: 0; height: 100vh; }
.selmore-motion--contained { position: relative; }
.selmore-motion canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.selmore-motion__grid { position: absolute; inset: 0; opacity: 0; background-image: linear-gradient(rgba(148,163,184,.16) 1px, transparent 1px), linear-gradient(90deg, rgba(148,163,184,.16) 1px, transparent 1px); background-size: 64px 64px; -webkit-mask-image: radial-gradient(220px circle at var(--mx,50%) var(--my,50%), black, transparent 72%); mask-image: radial-gradient(220px circle at var(--mx,50%) var(--my,50%), black, transparent 72%); transition: opacity .5s ease; }
.selmore-motion.is-pointer-active .selmore-motion__grid { opacity: 1; }
.selmore-motion__debug { position: absolute; z-index: 8; left: 12px; bottom: 12px; padding: 8px 10px; border: 1px solid rgba(34,211,238,.4); background: rgba(7,11,22,.8); color: #67e8f9; font: 11px/1.4 ui-monospace, monospace; white-space: pre; }
.selmore-connected-systems { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.selmore-connected-systems__visual { position: relative; min-height: 520px; display: grid; place-items: center; }
.selmore-connected-systems__visual::before { content:""; width: 58%; aspect-ratio:1; border:1px solid rgba(148,163,184,.2); border-radius:50%; box-shadow:0 0 100px rgba(37,99,235,.18); }
.selmore-connected-systems__visual span { --a: calc(var(--i) * 45deg); position:absolute; width:16px; aspect-ratio:1; border-radius:50%; background:#22d3ee; transform:rotate(var(--a)) translateX(205px) rotate(calc(-1 * var(--a))); box-shadow:0 0 22px rgba(34,211,238,.9); transition:transform .35s ease, background .35s ease; }
.selmore-connected-systems ol { list-style:none; margin:0; padding:0; border-top:1px solid rgba(148,163,184,.2); }
.selmore-connected-systems li { display:grid; grid-template-columns:48px 1fr; gap:14px; padding:18px 0; border-bottom:1px solid rgba(148,163,184,.2); }
.selmore-connected-systems small { color:#22d3ee; font:10px ui-monospace,monospace; }
.selmore-connected-systems strong { font-size:clamp(22px,2.2vw,40px); text-transform:uppercase; }
.selmore-connected-systems li.is-active strong { color:#22d3ee; }
.selmore-scroll-story { display:grid; grid-template-columns:.9fr 1.1fr; gap:70px; }
.selmore-scroll-story__visual { position:sticky; top:12vh; height:76vh; }
.selmore-scroll-story__chapters section { min-height:75vh; display:flex; flex-direction:column; justify-content:center; border-bottom:1px solid rgba(148,163,184,.2); }
.selmore-scroll-story__chapters span { color:#22d3ee; font-size:10px; letter-spacing:.2em; text-transform:uppercase; }
.selmore-scroll-story__chapters h3 { margin:.15em 0; font-size:clamp(56px,7vw,108px); line-height:.9; text-transform:uppercase; }
.selmore-scroll-story__chapters p { max-width:620px; color:#94a3b8; }
.selmore-magnetic-cta { display:inline-flex; align-items:center; gap:10px; padding:15px 24px; border-radius:999px; background:linear-gradient(110deg,#1b3fae,#2563eb 45%,#22d3ee); color:#fff; font-size:11px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; transition:transform .25s cubic-bezier(.16,1,.3,1); }
@media(max-width:900px){.selmore-connected-systems,.selmore-scroll-story{grid-template-columns:1fr}.selmore-connected-systems__visual{min-height:360px}.selmore-connected-systems__visual span{transform:rotate(var(--a)) translateX(140px) rotate(calc(-1 * var(--a)))}.selmore-scroll-story__visual{position:relative;top:auto;height:58vh}}
@media(prefers-reduced-motion:reduce){.selmore-motion__grid{display:none}.selmore-magnetic-cta{transform:none!important}}