/* 3D house visualisation */
.viz{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:50px;align-items:center;background:var(--bg);color:var(--cream);overflow:hidden}
.viz .eyebrow{color:var(--lime)}
.viz h2{font-size:clamp(34px,4.2vw,56px);line-height:1.05;letter-spacing:-2px;font-weight:600}
.viz h2 em{font-style:normal;color:var(--lime)}
.viz-intro{margin-top:22px;max-width:420px;font-size:15px;line-height:1.75;color:var(--muted)}
.viz-modes{display:flex;flex-direction:column;margin-top:34px;border-top:1px solid #ffffff1f;max-width:420px}
.viz-modes button{display:flex;align-items:center;gap:18px;padding:15px 0;border:0;border-bottom:1px solid #ffffff1f;background:none;color:var(--muted);font:inherit;font-size:16px;text-align:left;cursor:pointer;transition:color .25s,padding .25s}
.viz-modes button span{font-size:11px;letter-spacing:1.6px;color:#8c9285;transition:color .25s}
.viz-modes button:hover{color:var(--cream)}
.viz-modes button[aria-pressed=true]{color:var(--cream);padding-left:10px}
.viz-modes button[aria-pressed=true] span{color:var(--lime)}
.viz-caption{margin-top:20px;min-height:3.4em;max-width:420px;font-size:14px;line-height:1.7;color:var(--cream)}
.viz-stage{position:relative;height:min(620px,72vh);min-height:420px;border:1px solid #ffffff14;background:radial-gradient(ellipse at 50% 60%,#232a1f 0%,#151714 70%)}
.viz-stage canvas{display:block;width:100%;height:100%;cursor:grab;touch-action:pan-y}
.viz-stage canvas:active{cursor:grabbing}
.viz-hint{position:absolute;right:16px;bottom:16px;font-size:11px;letter-spacing:1.4px;text-transform:uppercase;color:#8c9285;pointer-events:none;transition:opacity .4s}
.viz-touched .viz-hint{opacity:0}
.viz-progress{position:absolute;left:0;right:0;top:0;height:2px;background:#ffffff0d}
.viz-progress i{display:block;height:100%;background:var(--lime);transform-origin:left;transform:scaleX(0)}
@media(max-width:900px){
  .viz{grid-template-columns:1fr;gap:0}
  .viz-copy{display:contents}
  .viz .eyebrow,.viz h2,.viz-intro{order:1}
  .viz-stage{order:2;margin-top:28px!important}
  .viz-modes{order:3}
  .viz-caption{order:4}
  .viz-modes{margin-top:20px}
  .viz-stage{height:400px;min-height:0;margin:0 -6%;border-left:0;border-right:0}
  .viz-modes{flex-direction:row;flex-wrap:wrap;border-top:0;gap:8px;max-width:none}
  .viz-modes button{flex:1 1 calc(50% - 8px);padding:12px 14px;border:1px solid #ffffff1f;font-size:14px;gap:10px}
  .viz-modes button[aria-pressed=true]{padding-left:14px;border-color:var(--lime)}
  .viz-caption{min-height:0}
}
@media(max-width:700px){.viz h2{letter-spacing:-1px}}
