.sx-section{--sx-line:color-mix(in srgb,var(--accent-2) 28%,transparent);position:relative;isolation:isolate;max-width:1500px;margin:clamp(4rem,9vw,9rem) auto;padding:clamp(1.25rem,4.5vw,4.5rem);overflow:hidden;border-block:1px solid var(--sx-line);background:linear-gradient(142deg,color-mix(in srgb,var(--bg) 90%,#050b18),color-mix(in srgb,var(--accent) 9%,transparent))}.sx-section::before{content:"";position:absolute;z-index:-1;inset:-15%;background:radial-gradient(circle at 12% 18%,color-mix(in srgb,var(--accent-2) 12%,transparent),transparent 26%),radial-gradient(circle at 88% 78%,color-mix(in srgb,var(--accent-3) 11%,transparent),transparent 27%);filter:blur(24px);pointer-events:none}.sx-heading{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(18rem,.8fr);gap:2rem;align-items:end;margin-bottom:2.2rem}.sx-heading>div>p,.sx-index{margin:0;color:var(--accent-2);font-size:.73rem;line-height:1.45;letter-spacing:.18em;text-transform:uppercase}.sx-heading h2{max-width:14ch;margin:.55rem 0 0;font:400 clamp(2.35rem,6vw,6.3rem)/.92 Georgia,serif;letter-spacing:-.045em}.sx-heading>p{max-width:38rem;margin:0;color:color-mix(in srgb,var(--warm) 73%,transparent);line-height:1.7}
.sx-threshold[data-material=stone]{background-image:radial-gradient(circle at 32% 24%,color-mix(in srgb,var(--material) 18%,transparent),transparent 2%),radial-gradient(circle at 66% 71%,color-mix(in srgb,var(--material) 11%,transparent),transparent 3%),linear-gradient(138deg,rgba(255,255,255,.025),rgba(0,0,0,.28))}.sx-threshold[data-material=glass]{background-image:linear-gradient(117deg,transparent 22%,color-mix(in srgb,var(--material) 12%,transparent) 22.3% 23%,transparent 23.3%),linear-gradient(63deg,transparent 61%,color-mix(in srgb,var(--material) 9%,transparent) 61.3% 62%,transparent 62.3%),radial-gradient(circle,color-mix(in srgb,var(--material) 14%,transparent),rgba(0,0,0,.3) 66%)}.sx-threshold[data-material=wood]{background-image:repeating-radial-gradient(ellipse at 30% 45%,transparent 0 18px,color-mix(in srgb,var(--material) 10%,transparent) 19px 20px),linear-gradient(145deg,rgba(0,0,0,.12),rgba(0,0,0,.31))}.sx-threshold[data-material=air]{background-image:repeating-linear-gradient(168deg,transparent 0 28px,color-mix(in srgb,var(--material) 8%,transparent) 29px 30px),radial-gradient(circle at 70% 35%,color-mix(in srgb,var(--material) 15%,transparent),transparent 56%)}.sx-threshold[data-material=metal]{background-image:linear-gradient(125deg,transparent 0 38%,color-mix(in srgb,var(--material) 15%,transparent) 38.5% 39%,transparent 39.5%),repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 1px,transparent 1px 32px),linear-gradient(145deg,rgba(0,0,0,.1),rgba(0,0,0,.33))}.sx-threshold[data-material=paper]{background-image:repeating-linear-gradient(0deg,transparent 0 24px,color-mix(in srgb,var(--material) 8%,transparent) 25px),radial-gradient(circle at 50% 45%,color-mix(in srgb,var(--material) 12%,transparent),rgba(0,0,0,.29) 64%)}.sx-threshold[data-material=mirror]{background-image:conic-gradient(from 45deg at 50% 50%,transparent,color-mix(in srgb,var(--material) 18%,transparent),transparent 28%,color-mix(in srgb,var(--material) 7%,transparent),transparent 58%),linear-gradient(145deg,rgba(255,255,255,.06),rgba(0,0,0,.32))}
.sx-workspace{display:grid;grid-template-columns:minmax(17rem,.72fr) minmax(0,1.28fr);gap:1rem}.sx-plan{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.sx-room{position:relative;display:grid;align-content:end;min-height:8.4rem;padding:.8rem;border:1px solid var(--sx-line);background:rgba(0,0,0,.17);color:inherit;text-align:left;cursor:pointer;overflow:hidden;transition:border-color .4s,transform .4s,background .4s}.sx-room:hover,.sx-room:focus-visible,.sx-room.is-active{border-color:var(--room-color,var(--accent-2));background:color-mix(in srgb,var(--room-color,var(--accent-2)) 12%,transparent);transform:translateY(-2px)}.sx-room i{position:absolute;right:-2rem;top:-2rem;width:7rem;aspect-ratio:1;border:1px solid var(--room-color,var(--accent-2));border-radius:var(--room-radius,50%);opacity:.24;transform:rotate(var(--room-turn,0deg))}.sx-room span{color:var(--room-color,var(--accent-2));font-size:.68rem;letter-spacing:.14em}.sx-room strong{margin:.35rem 0;font:400 1.05rem/1.1 Georgia,serif}.sx-room small{opacity:.58}.sx-room:nth-child(1){--room-color:#ffc36b;--room-radius:15%}.sx-room:nth-child(2){--room-color:#b58cff;--room-radius:50%}.sx-room:nth-child(3){--room-color:#67e5a0;--room-radius:4%;--room-turn:17deg}.sx-room:nth-child(4){--room-color:#66dfff;--room-radius:50% 10%}.sx-room:nth-child(5){--room-color:#ff70bd;--room-radius:2%;--room-turn:45deg}.sx-room:nth-child(6){--room-color:#fff0a0;--room-radius:50%;}.sx-room:nth-child(7){--room-color:#d9f6ff;--room-radius:0;--room-turn:30deg}.sx-lateral{grid-column:1/-1;min-height:7rem}.sx-threshold{--material:#ffc36b;position:relative;min-height:30rem;display:grid;place-items:center;overflow:hidden;border:1px solid color-mix(in srgb,var(--material) 42%,transparent);background:radial-gradient(circle at 50% 48%,color-mix(in srgb,var(--material) 16%,transparent),rgba(0,0,0,.28) 63%);transition:background .8s,border-color .8s}.sx-threshold::before,.sx-threshold::after{content:"";position:absolute;inset:9%;border:1px solid color-mix(in srgb,var(--material) 27%,transparent);transform:perspective(700px) rotateY(var(--door-turn,0deg));transition:transform .8s}.sx-threshold::after{inset:17%;opacity:.52}.sx-threshold.is-crossing::before{transform:perspective(700px) rotateY(-68deg) translateX(-15%)}.sx-threshold-lines{position:absolute;inset:0}.sx-threshold-lines i{position:absolute;left:50%;top:50%;width:74%;height:1px;background:linear-gradient(90deg,transparent,var(--material),transparent);transform:translate(-50%,-50%) rotate(calc(var(--i)*60deg));opacity:.4}.sx-threshold-lines i:nth-child(1){--i:0}.sx-threshold-lines i:nth-child(2){--i:1}.sx-threshold-lines i:nth-child(3){--i:2}.sx-threshold-copy{position:relative;z-index:1;max-width:32rem;padding:2rem;text-align:center}.sx-threshold-copy>span{font-size:.68rem;letter-spacing:.17em;color:var(--material)}.sx-threshold-copy h3{margin:.65rem 0;font:400 clamp(2rem,5vw,4.8rem)/.92 Georgia,serif}.sx-threshold-copy>p:not(.sx-index){line-height:1.6;opacity:.7}
.sx-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1rem;margin-top:1rem}.sx-card{grid-column:span 6;min-width:0;padding:clamp(1rem,2.3vw,2rem);border:1px solid var(--sx-line);background:linear-gradient(155deg,rgba(255,255,255,.04),rgba(0,0,0,.2));box-shadow:0 25px 70px rgba(0,0,0,.15)}.sx-corridor{grid-column:span 7}.sx-passport{grid-column:span 5}.sx-card header{margin-bottom:1.2rem}.sx-card h3{margin:.5rem 0;font:400 clamp(1.55rem,3vw,2.7rem)/1 Georgia,serif}.sx-card label{display:grid;gap:.5rem;color:color-mix(in srgb,var(--warm) 72%,transparent);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase}.sx-card textarea{width:100%;padding:.75rem;border:1px solid color-mix(in srgb,var(--warm) 18%,transparent);background:rgba(0,0,0,.18);color:var(--warm);font:inherit;line-height:1.45;text-transform:none;letter-spacing:normal;resize:vertical}.sx-card output{justify-self:end;color:var(--accent-2)}.sx-button{min-height:46px;padding:.7rem 1rem;border:1px solid color-mix(in srgb,var(--warm) 27%,transparent);background:transparent;color:var(--warm);font:inherit;cursor:pointer}.sx-button:hover,.sx-button:focus-visible{border-color:var(--accent-2);background:color-mix(in srgb,var(--accent) 18%,transparent)}.sx-button:disabled{cursor:not-allowed;opacity:.38}.sx-primary{border-color:color-mix(in srgb,var(--accent-2) 55%,transparent);background:color-mix(in srgb,var(--accent) 25%,transparent)}.sx-text-button{min-height:44px;border:0;background:transparent;color:inherit;text-decoration:underline;text-underline-offset:.25rem;cursor:pointer;opacity:.68}.sx-comparison{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem;margin-top:1rem}.sx-comparison article{padding:.75rem;border-left:1px solid var(--comparison-color,var(--sx-line));background:rgba(0,0,0,.14)}.sx-comparison article span{font-size:.64rem;letter-spacing:.12em;color:var(--comparison-color)}.sx-comparison article strong{display:block;margin:.35rem 0;font:400 1rem/1.25 Georgia,serif}.sx-comparison article p{margin:0;font-size:.83rem;line-height:1.45;opacity:.68}
.sx-passport{display:grid;grid-template-columns:minmax(8rem,.75fr) minmax(0,1.25fr);gap:1rem;align-items:center}.sx-passport header{grid-column:1/-1}.sx-passport>.sx-button{grid-column:1/-1}.sx-object{position:relative;display:grid;place-items:center;width:min(100%,14rem);aspect-ratio:1;margin:auto;border:1px solid color-mix(in srgb,var(--object-color,var(--accent-2)) 28%,transparent);border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--object-color,var(--accent-2)) 15%,transparent),transparent 62%)}.sx-object i,.sx-object span{position:absolute;display:block;width:42%;aspect-ratio:1;border:1px solid var(--object-color,var(--accent-2));border-radius:var(--object-radius,18%);transform:rotate(var(--object-turn,18deg));box-shadow:0 0 25px color-mix(in srgb,var(--object-color,var(--accent-2)) 30%,transparent)}.sx-object span{width:27%;transform:rotate(calc(var(--object-turn,18deg)*-1));opacity:.55}.sx-passport #sx-object-copy>span{font-size:.65rem;letter-spacing:.13em;color:var(--object-color,var(--accent-2))}.sx-passport h4{margin:.55rem 0;font:400 1.45rem/1.1 Georgia,serif}.sx-passport p{line-height:1.5;opacity:.68}
.sx-progress{height:3px;margin:1.5rem 0;background:rgba(255,255,255,.1)}.sx-progress span{display:block;width:var(--progress);height:100%;background:var(--accent-2);box-shadow:0 0 15px var(--accent-2);transition:width .5s}.sx-journey{display:grid;gap:.55rem;margin:0;padding:0;list-style:none}.sx-journey li{position:relative;padding:.65rem .65rem .65rem 2.5rem;border-bottom:1px solid var(--sx-line)}.sx-journey li::before{content:attr(data-step);position:absolute;left:.2rem;top:.65rem;color:var(--journey-color,var(--accent-2));font:.72rem ui-monospace,monospace}.sx-journey strong{display:block}.sx-journey small{opacity:.56}.sx-journey .is-empty{padding-left:.65rem;opacity:.65}.sx-journey .is-empty::before{display:none}.sx-actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem}.sx-local-note{margin:1.5rem 0 0;text-align:right;font-size:.78rem;opacity:.58}
@media(max-width:900px){.sx-heading,.sx-workspace{grid-template-columns:1fr}.sx-card,.sx-corridor,.sx-passport{grid-column:1/-1}.sx-threshold{min-height:26rem}.sx-plan{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:620px){.sx-section{padding-inline:1rem}.sx-plan,.sx-comparison{grid-template-columns:1fr 1fr}.sx-room{min-height:7.8rem}.sx-passport{grid-template-columns:1fr}.sx-passport #sx-object-copy{text-align:center}.sx-local-note{text-align:left}}@media(max-width:420px){.sx-plan,.sx-comparison{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.sx-section *{animation:none!important;transition:none!important}.sx-threshold.is-crossing::before{transform:none}}