/* Configurator: soft 3D stage left, frosted option panel right. */
.cfg{display:grid;grid-template-columns:minmax(0,1fr) 440px;min-height:100svh;padding-top:var(--nav)}
.stage3d{position:sticky;top:var(--nav);height:calc(100svh - var(--nav));overflow:hidden;background:#ecedf5}
.stage3d canvas{width:100%;height:100%;display:block;cursor:grab;touch-action:pan-y}
.stage3d canvas:active{cursor:grabbing}
.stage3d .title{position:absolute;left:var(--gx);top:28px;z-index:2;pointer-events:none}
.stage3d .title h1{font:400 clamp(34px,4vw,48px)/1.05 var(--display)}
.stage3d .title p{margin-bottom:6px}
.stage3d .views{position:absolute;right:var(--gxr);bottom:24px;display:flex;gap:6px;padding:5px;border-radius:999px;z-index:2}
.stage3d .views button{background:none;border:0;border-radius:999px;padding:9px 14px;cursor:pointer;font:600 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.stage3d .views button{transition:background .25s,color .25s}
.stage3d .views button[aria-pressed="true"]{background:var(--accent);color:#fff}
.stage3d .hint{position:absolute;right:var(--gxr);top:32px;z-index:2;display:flex;align-items:center;gap:8px}
.stage3d .stats{position:absolute;left:var(--gx);bottom:24px;z-index:2;display:flex;gap:10px}
.stage3d .stats .chip{min-width:0;flex:none;padding:0 10px}
.stage3d .stats .chip b{font-size:22px;margin-bottom:8px}
.panel{background:rgba(248,248,252,.6);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);padding:32px 32px 140px;display:flex;flex-direction:column;gap:34px;position:relative;z-index:2}
.panel h2{font:500 13px/1 var(--sans);letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:14px;display:flex;justify-content:space-between}
.seg4{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.opt{border:0;font:inherit;color:inherit;position:relative;display:flex;flex-direction:column;gap:6px;text-align:left;padding:14px 16px;border-radius:14px;background:transparent;cursor:pointer;transition:border-color .25s,background .25s,transform .25s var(--ease),box-shadow .25s}
.opt:hover{background:rgba(var(--accent-rgb),.04)}
.opt[aria-pressed="true"],.opt[aria-checked="true"]{background:rgba(var(--accent-rgb),.07);color:var(--accent);box-shadow:none;--x: var(--accent)}
.opt b{font:500 16px/1.2 var(--sans)}
.opt span{font:400 13px/1.3 var(--sans);color:var(--ink-2)}
.opt small{font:400 12px/1.3 var(--sans);color:var(--muted)}
.opt .row{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.list{display:flex;flex-direction:column;gap:8px}
.sw-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.sw{width:44px;height:44px;border-radius:50%;border:3px solid var(--void);box-shadow:0 0 0 1px var(--line-2);cursor:pointer;padding:0}
.sw[aria-pressed="true"]{box-shadow:0 0 0 2px var(--accent)}
.sw-name{font:400 14px/1.3 var(--sans);color:var(--ink-2);margin-top:12px}
.check{display:grid;grid-template-columns:22px 1fr auto;gap:12px;align-items:center}
.check i{width:22px;height:22px;border-radius:7px;background:rgba(var(--accent-rgb),.1);display:grid;place-items:center}
.opt[aria-checked="true"] .check i{background:var(--accent)}
.opt[aria-checked="true"] .check i::after{content:"";width:6px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px)}
.opt[aria-disabled="true"]{opacity:.55;cursor:default}
.sum{padding-top:22px;display:flex;flex-direction:column;gap:10px}
.sum .ln{display:flex;justify-content:space-between;gap:16px;font-size:14px;color:var(--ink-2)}
.sum .ln span:last-child{font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.sum .total{display:flex;justify-content:space-between;align-items:baseline;padding-top:16px;margin-top:6px}
.sum .total b{font:500 30px/1 var(--sans)}
.payseg{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.payseg button{background:none;border:0;border-radius:999px;padding:10px;cursor:pointer;font:600 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.payseg button[aria-pressed="true"]{background:var(--accent);color:#fff}
.fine{font-size:12.5px;line-height:19px;color:var(--muted)}
.cta-bar{position:fixed;right:0;bottom:0;width:440px;z-index:30;padding:14px 32px max(16px,env(safe-area-inset-bottom,0px));background:rgba(248,248,252,.72);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);display:flex;align-items:center;justify-content:space-between;gap:14px}
.cta-bar .p{display:flex;flex-direction:column;gap:4px}
.cta-bar .p b{font:500 22px/1 var(--sans)}
.cta-bar .p span{font:400 12px/1 var(--sans);color:var(--muted)}
@media(max-width:980px){
  .cfg{grid-template-columns:1fr}
  .stage3d{position:relative;top:0;height:min(62svh,560px)}
  .stage3d .stats{display:none}
  .stage3d .hint{display:none}
  .stage3d .views{right:auto;left:50%;transform:translateX(-50%)}
  .panel{border-left:0;padding:28px var(--gxr) 140px var(--gx)}
  .cta-bar{width:100%;left:0;border-left:0;padding-left:var(--gx);padding-right:var(--gxr)}
}

/* prices and small labels in the text face */
.opt span,.sum .ln span:last-child,.sum .total b,.cta-bar .p b,.cta-bar .p span,.panel h2,.stage3d .views button,.payseg button{font-family:var(--mono)}

/* readable sizes */
.opt b{font-size:19px}.opt span{font-size:15px}.opt small{font-size:14px}
.panel h2{font-size:15px}
.sum .ln{font-size:16px}.sum .total b{font-size:34px}
.cta-bar .p b{font-size:25px}.cta-bar .p span{font-size:14px}
.stage3d .views button,.payseg button{font-size:14px}
.stage3d .title h1{font-size:clamp(40px,4.6vw,56px)}
.fine{font-size:14px;line-height:20px}
.opt b,.opt span,.sum .ln,.cta-bar .p b,.panel h2,.stage3d .views button,.payseg button{letter-spacing:.1em}
.stage3d .title h1{letter-spacing:.08em}
