.page-openconcept,.page-oc-viewer{background:#090d17;color:#eaeefc}
.page-openconcept a:focus-visible,.page-oc-viewer a:focus-visible{outline:2px solid #60dece;outline-offset:5px}
.oc-hero{padding:68px 0 44px;background:radial-gradient(ellipse at 85% 10%,#162b3b 0,transparent 60%)}
.oc-hero .crumb{margin-bottom:36px}
.oc-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) clamp(200px,24vw,300px);align-items:center;gap:48px}
.oc-hero-copy{min-width:0}
.oc-hero-logo{display:block;width:100%;height:auto;justify-self:end}
.oc-hero h1{font-size:clamp(42px,6vw,76px);letter-spacing:-.045em}
.oc-hero h1 span{display:block;margin-top:18px;font-size:clamp(22px,3.3vw,38px);font-weight:600;letter-spacing:-.02em;color:#94ddd5}
.oc-hero .lead{margin-top:24px;max-width:690px;color:#b2bfd4;line-height:1.8}
.oc-hero-meta{display:flex;align-items:center;gap:18px;margin-top:24px;color:#8795ad;font-size:12px;letter-spacing:.03em}
.oc-download{margin-top:26px}
.oc-download-link{max-width:100%;background:#a5e0d4;color:#0c1825;font-size:14px;line-height:1.6;font-weight:700}
.oc-download-link:hover{background:#c2f0e5}
.oc-download-note{margin-top:10px;font-size:12px;line-height:1.7;color:#97a7bf}
.oc-sample-badge{display:inline-flex;align-items:center;gap:8px;color:#93e7d4}
.oc-sample-badge i{width:6px;height:6px;border-radius:50%;background:#46e0c8;box-shadow:0 0 12px #46e0c855}
.oc-explore{padding:30px 0 58px}
.oc-choose-heading h2{font-size:clamp(23px,2.5vw,29px);line-height:1.5}
.oc-choose-heading p{font-size:14px;color:#96a5bf;margin-top:9px}
.oc-choices{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:26px}
.oc-choice{border:1px solid #2c3b55;border-radius:18px;overflow:hidden;background:#101827;display:grid;grid-template-columns:170px 1fr;align-items:center;transition:border-color .2s,background .2s}
.oc-choice:hover{border-color:#69bebd;background:#142133}
.oc-choice-art{padding:24px 8px;text-align:center}
.oc-choice-art svg{width:100%;height:130px;display:block}
.oc-choice-art>span{font-size:9px;letter-spacing:.12em;color:#7e93b8}
.oc-choice-copy{padding:28px 24px 28px 2px}
.oc-choice-kicker{font-size:10px;letter-spacing:.14em;color:#81abbb;font-weight:600}
.oc-choice h3{margin:10px 0;font-size:21px;line-height:1.5}
.oc-choice p{font-size:13px;color:#a4b2c9;line-height:1.8}
.oc-choice-action{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:24px;font-size:13px;font-weight:700;color:#95e9d9}
.oc-choice-action>span{font-size:20px;font-weight:400}
.oc-sample-details{display:flex;justify-content:space-between;gap:18px;align-items:baseline;margin-top:22px}
.oc-sample-details p{font-size:12px;color:#8e9bb2;max-width:700px}
.oc-external{font-size:12px;color:#a5b6d0;text-decoration:underline;text-underline-offset:4px;white-space:nowrap}
.oc-external:hover{color:#fff}
.oc-features{padding:48px 0 76px;border-top:1px solid #1d283a}
.oc-features> .wrap>h2{font-size:clamp(24px,3vw,32px);margin-bottom:30px;scroll-margin-top:88px}
.oc-feature-grid{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 38px}
.oc-feature-grid>li{padding:24px 0 30px;border-top:1px solid #263247;min-width:0}
.oc-feature-number{font-size:11px;letter-spacing:.14em;color:#568d9c}
.oc-feature-grid h3{font-size:18px;line-height:1.5;margin:12px 0}
.oc-feature-grid p{font-size:13px;line-height:1.9;color:#97a7bf}
/* The live sample gets its own viewport, so its responsive layout is real. */
.page-oc-viewer{overflow:hidden}
.oc-viewer{width:95vw;height:95vh;height:95dvh;min-height:0;margin:2.5vh auto;margin-block:2.5dvh;padding:0;display:flex;flex-direction:column;gap:14px}
.oc-viewbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;flex:none;min-height:38px}
.oc-back{font-size:12px;color:#bac7dc;line-height:1.5}
.oc-back:hover{color:#fff}
.oc-viewbar>.oc-external{justify-self:end}
.oc-view-modes{display:flex;gap:4px;padding:4px;border:1px solid #344159;border-radius:30px;background:#111b2b;white-space:nowrap}
.oc-view-modes a{padding:5px 18px;border-radius:25px;font-size:12px;color:#9caec9}
.oc-view-modes a[aria-current="page"]{color:#0c1825;background:#a5e0d4;font-weight:700}
.oc-view-stage{display:flex;justify-content:center;align-items:center;flex:1;min-height:0;min-width:0}
.oc-live-device{display:flex;flex-direction:column;overflow:hidden;min-height:0;background:#f5f5f2;box-shadow:0 22px 70px #0007}
.oc-live-desktop{width:100%;height:100%;border:1px solid #42516b;border-radius:12px}
.oc-device-bar{flex:none;height:28px;display:flex;align-items:center;justify-content:center;background:#192335;color:#9cacbf;font-size:10px;position:relative;letter-spacing:.03em}
.oc-window-dots{position:absolute;left:13px;display:flex;gap:5px}
.oc-window-dots i{width:6px;height:6px;border-radius:50%;background:#6d7e99}
.oc-window-dots i:first-child{background:#bd7b82}.oc-window-dots i:nth-child(2){background:#c1ad73}.oc-window-dots i:last-child{background:#6bbaaa}
.oc-live-frame{display:block;border:0;width:100%;flex:1;min-height:0;background:#f5f5f2}
.oc-live-phone{width:410px;max-width:100%;height:840px;max-height:100%;border:10px solid #273145;border-radius:36px;box-shadow:0 0 0 1px #5a6579,0 22px 70px #0007}
.oc-live-phone .oc-device-bar{height:19px;background:#273145}
.oc-phone-speaker{width:48px;height:5px;border-radius:8px;background:#0b1220;margin-top:-4px}
.oc-phone-bottom{height:15px;flex:none;display:flex;align-items:center;justify-content:center;background:#273145}
.oc-phone-bottom span{width:95px;height:4px;border-radius:10px;background:#8290a7;margin-top:5px}
@media(max-width:1100px){.oc-choice{grid-template-columns:130px 1fr}.oc-choice-copy{padding-right:20px}.oc-viewbar{gap:10px}.oc-view-modes a{padding-inline:13px}}
@media(max-width:760px){.oc-hero-grid{grid-template-columns:1fr;gap:24px}.oc-hero-logo{grid-row:1;width:112px;justify-self:start}}
@media(max-width:760px){.oc-hero{padding-top:40px}.oc-choices{grid-template-columns:1fr;gap:16px}.oc-choice{grid-template-columns:150px 1fr}.oc-feature-grid{grid-template-columns:1fr;gap:28px}.oc-sample-details{flex-direction:column;gap:12px}.oc-viewbar{grid-template-columns:1fr auto;gap:9px}.oc-viewbar .oc-back{font-size:11px}.oc-view-modes{grid-column:1/-1;grid-row:2;justify-self:center}.oc-viewbar>.oc-external{font-size:10px}.oc-viewer{gap:10px}.oc-live-phone{border-width:7px;width:404px;border-radius:29px}}
@media(max-width:420px){.page-openconcept .wrap{padding-inline:20px}.oc-choice{grid-template-columns:106px 1fr}.oc-choice-copy{padding-block:23px;padding-right:17px}.oc-choice h3{font-size:18px}.oc-choice-art{padding-inline:2px}.oc-choice-art svg{height:108px}.oc-choice-action{font-size:12px;gap:6px}.oc-back{max-width:190px}.oc-live-phone{border-width:6px}}
@media(prefers-reduced-motion:reduce){.oc-choice{transition:none}}