html body .ci-section{padding:90px max(5vw,20px) 100px;background:#0a1012;color:#e9ece5;scroll-margin-top:24px;font-family:Manrope,Arial,sans-serif}
.ci-heading{max-width:900px;margin:0 auto 38px;text-align:center}.ci-eyebrow{font-size:11px;letter-spacing:.14em;color:#98aaa6}.ci-heading h2{font-size:clamp(32px,4vw,58px)!important;line-height:1.14!important;font-weight:400!important;letter-spacing:-.04em;margin:18px 0 24px!important;color:#e9ece5!important}.ci-heading>p:last-child{font-size:18px;line-height:1.65;color:#b8c6c1;max-width:740px;margin:auto}
.ci-demo{max-width:1260px;margin:auto;padding:28px;border:1px solid #b2c9c32e;background:radial-gradient(ellipse at 50% 35%,#24342f66,transparent 67%),#0d1716;border-radius:10px}.ci-demo button{font:500 13px/1.5 Manrope,Arial,sans-serif;color:#d5ded9;background:#ffffff08;border:1px solid #ffffff40;border-radius:7px;padding:10px 14px;cursor:pointer;min-height:44px;transition:background .2s,border-color .2s}.ci-demo button:hover{background:#ffffff12}.ci-demo button:focus-visible{outline:2px solid #e2c299;outline-offset:4px}.ci-demo button[aria-pressed=true],.ci-demo button[aria-current=step]{background:#d5c0a126;border-color:#cfb794;color:#f2e5d1}.ci-demo button:disabled{opacity:.4;cursor:default}
.ci-modes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:24px}.ci-modes button{font-size:14px;padding:14px 12px}.ci-top{display:flex;justify-content:space-between;align-items:center;gap:18px;font-size:12px;color:#a9bab4}.ci-mode-label{letter-spacing:.03em}.ci-playback{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.ci-playback button{white-space:nowrap;font-size:12px;padding:8px 12px}.ci-stage{overflow:hidden;margin:4px 0}.ci-svg{display:block;width:100%;height:auto;aspect-ratio:960/430;min-height:270px}.ci-svg text{font-family:Manrope,Arial,sans-serif;font-size:11px;fill:#b9c9c1;letter-spacing:.03em}.ci-svg .ci-polarity{fill:#5e614a;font-size:9px;font-weight:600}.ci-svg .ci-line{fill:none;stroke:#c2d6ca70;stroke-width:1}.ci-svg .ci-guide{stroke:#dfc398;stroke-width:1.4;stroke-dasharray:4 4}.ci-svg .ci-caption{font-size:11px;fill:#d0dbd3}.ci-svg .ci-small{font-size:9px;fill:#acc1b6}
.ci-description{display:grid;grid-template-columns:74px 1fr;gap:22px;min-height:148px;margin:0 0 18px;padding:24px 0;border-top:1px solid #ffffff20}.ci-number{font-size:14px;color:#cbbca0;padding-top:7px}.ci-description h3{font-size:25px!important;line-height:1.25!important;color:#e9ece5!important;font-weight:500!important;margin:0 0 10px!important}.ci-description p{font-size:16px;line-height:1.7;color:#c6d2cc;max-width:930px;margin:0}.ci-steps{display:grid;grid-template-columns:repeat(var(--ci-step-count,4),1fr);gap:8px}.ci-steps button{padding:12px 8px;font-size:12px}.ci-steps button span{display:block;font-size:10px;color:#a4b7ac;margin-bottom:4px}.ci-step-navigation{display:flex;gap:12px;justify-content:space-between;margin-top:16px}.ci-step-navigation button{font-size:12px}.ci-note{font-size:13px!important;line-height:1.65!important;color:#a5b3ae!important;max-width:920px;margin:22px auto 0!important;text-align:center}
@media(max-width:900px){.ci-top{flex-direction:column;align-items:stretch;gap:12px}.ci-playback{justify-content:flex-start}.ci-section{padding:65px 20px 85px!important}.ci-demo{padding:22px 16px}.ci-heading>p:last-child{font-size:16px}.ci-description{grid-template-columns:56px 1fr;gap:14px}.ci-description h3{font-size:23px!important}}
@media(max-width:600px){.ci-section{padding:58px 12px 80px!important}.ci-heading{padding:0 8px;margin-bottom:28px}.ci-heading h2{font-size:32px!important}.ci-demo{padding:18px 12px}.ci-modes{gap:6px;margin-bottom:18px}.ci-modes button{padding:10px 5px;font-size:11px;line-height:1.45;min-height:58px}.ci-mode-label{font-size:11px}.ci-playback{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.ci-playback button{font-size:11px;padding:8px 5px}.ci-playback .ci-view{grid-column:1/-1}.ci-svg{aspect-ratio:1.35;min-height:0}.ci-description{grid-template-columns:1fr;gap:8px;min-height:210px;padding:20px 0}.ci-description h3{font-size:22px!important}.ci-description p{font-size:15px}.ci-steps{grid-template-columns:repeat(2,1fr)}.ci-steps button{font-size:11px;min-height:58px}.ci-step-navigation{gap:8px}.ci-step-navigation button{font-size:11px;padding:9px 8px}}
@media(prefers-reduced-motion:reduce){.ci-demo button{transition:none}}

/* Oblique end section stays inside the existing assembly scene. */
.ci-stage{position:relative}
.ci-cutaway{position:absolute;z-index:1;top:10px;right:2%;width:360px;max-width:39%;pointer-events:none}
.ci-cutaway p{margin:0!important;font:400 12px/1.5 Manrope,Arial,sans-serif!important;color:#bdccc3!important;letter-spacing:0}
.ci-cutaway .ci-cutaway-title{color:#d7e1d9!important;font-size:11px!important;letter-spacing:.04em;margin-bottom:5px!important}
.ci-cutaway svg{display:block;width:100%;height:auto;overflow:visible}
.ci-cutaway svg text{font:400 11px Manrope,Arial,sans-serif;fill:#c8d5cd;letter-spacing:0}
.ci-cutaway .ci-cutaway-copy{margin-top:3px!important;max-width:340px}
[data-cob-ip67-assembly][data-mode=join] .ci-cutaway,[data-cob-ip67-assembly][data-zoom=true] .ci-cutaway{position:relative;top:auto;right:auto;width:min(100%,340px);max-width:none;margin:16px auto 0}
@media(max-width:1100px){.ci-cutaway{position:relative;top:auto;right:auto;width:min(100%,340px);max-width:none;margin:16px auto 0}}
