/* Live windows: the real website or 3D model, running inside the page. */
.live{position:relative;border-radius:10px;overflow:hidden;background:#141210;box-shadow:0 34px 80px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.07)}
.live .lbar{height:40px;display:flex;align-items:center;gap:7px;padding:0 12px 0 16px;background:#211E1A;border-bottom:1px solid rgba(255,255,255,.06)}
.live .lbar>i{width:10px;height:10px;border-radius:50%;background:#3A3631;flex:none}
.live .lbar .url{margin-left:12px;flex:1;min-width:0;max-width:420px;height:24px;border-radius:12px;background:#171513;color:#A39A8C;font:400 12px/24px 'Work Sans',sans-serif;padding:0 12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.live .lbar .url b{color:#6FBF73;font-weight:500;margin-right:6px}
.live .lbar .lact{margin-left:auto;display:flex;gap:8px;align-items:center}
.live .lbar a,.live .lbar button{font:500 11px/1 'Work Sans',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#E8E1D6;background:none;border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:7px 11px;cursor:pointer;text-decoration:none;white-space:nowrap}
.live .lbar a:hover,.live .lbar button:hover{border-color:rgba(255,255,255,.4)}
.live .lbar .ldone{display:none}
.live.on .lbar .ldone{display:inline-block}
.live .lview{position:relative;overflow:hidden;background:#0E0D0B}
.live iframe{position:absolute;left:0;top:0;border:0;transform-origin:0 0;background:#0E0D0B}
.live .lshield{position:absolute;inset:0;z-index:2;display:flex;align-items:flex-end;justify-content:center;padding-bottom:22px;background:linear-gradient(to top,rgba(0,0,0,.42),rgba(0,0,0,0) 38%);border:0;cursor:pointer;color:#fff;font:inherit;transition:opacity .35s}
.live .lshield span{display:inline-flex;align-items:center;gap:10px;background:rgba(18,16,14,.82);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:12px 20px;font:500 12px/1 'Work Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase}
.live .lshield span:before{content:"";width:8px;height:8px;border-radius:50%;background:#E23D28;box-shadow:0 0 0 4px rgba(226,61,40,.25)}
.live .lshield:hover span{border-color:rgba(255,255,255,.45)}
.live.on .lshield{opacity:0;pointer-events:none}
.live .lload{position:absolute;inset:0;display:grid;place-items:center;color:#8A8073;font:500 11px/1 'Work Sans',sans-serif;letter-spacing:.3em;text-transform:uppercase}
.live.phone{border-radius:38px;padding:11px;background:#0B0A09;box-shadow:0 34px 70px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.1)}
.live.phone .lbar{display:none}
.live.phone .lview{border-radius:28px}
.live.phone .lshield{border-radius:28px}
.live.phone .lshield span{padding:10px 14px;font-size:10.5px}

.livepair{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;align-items:end;margin-top:44px}
@media(max-width:900px){.livepair{grid-template-columns:1fr}.livepair .live.phone{display:none}}
.livecap{color:var(--band-cap,var(--cap));font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;margin-top:16px}

.lswitch{display:flex;flex-wrap:wrap;gap:8px;margin:40px 0 16px}
.lswitch button{font:500 12px/1 'Work Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:inherit;background:none;border:1px solid currentColor;opacity:.55;border-radius:999px;padding:11px 16px;cursor:pointer}
.lswitch button[aria-pressed="true"]{opacity:1;background:currentColor}
.lswitch button[aria-pressed="true"] span{color:var(--band,#131110);mix-blend-mode:normal}
.band.light .lswitch{color:#1A1510}
.band.light .lswitch button[aria-pressed="true"] span{color:#F3EDE4}

/* 3D showcase */
.m3d{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;align-items:start;margin-top:48px}
.m3d+.m3d{margin-top:72px}
.m3d .info .k{font:500 11px/1 'Work Sans',sans-serif;letter-spacing:.3em;text-transform:uppercase;color:var(--band-acc,var(--red))}
.m3d .info h3{font-size:clamp(30px,3.4vw,44px);line-height:1;margin:14px 0 14px}
.m3d .info p{color:var(--band-body,var(--body));font-size:15px;line-height:1.6}
.m3d .facts{margin-top:22px;border-top:1px solid rgba(255,255,255,.12)}
.m3d .facts div{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:13.5px}
.m3d .facts span{color:var(--band-cap,var(--cap))}
.m3d .facts b{color:var(--band-ink,var(--cream));font-weight:500;text-align:right}
.m3d .can{margin-top:20px;padding:0;list-style:none}
.m3d .can li{font-size:13.5px;color:var(--band-body,var(--body));padding:5px 0 5px 18px;position:relative}
.m3d .can li:before{content:"";position:absolute;left:0;top:13px;width:8px;height:1px;background:var(--band-acc,var(--red))}
.m3d .note{font-size:12px;color:var(--band-cap,var(--cap));margin-top:16px;font-style:italic}
@media(max-width:980px){.m3d{grid-template-columns:1fr}.m3d .info{order:-1}}