/* Self-contained application explorer; all motion stops on user interaction. */
.space-explorer{background:#f5f5f1;padding-block:76px}
.space-explorer>.wrap{max-width:1240px}
.explorer-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:48px;margin-bottom:34px}
.explorer-heading h2{font-size:clamp(36px,3.5vw,48px);line-height:1.1;letter-spacing:-2px}
.explorer-heading h2>span{color:#627780}
.explorer-heading>p{max-width:345px;font-size:15px;line-height:1.9;padding-bottom:4px}
.explorer-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(310px,1fr);gap:60px;align-items:center}
.explorer-viewer{min-width:0;background:white;box-shadow:0 14px 40px #1c2c3610}
.explorer-stage{position:relative;aspect-ratio:1;overflow:hidden;background:#c1c2bc;isolation:isolate}
.explorer-stage>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;user-select:none}
.explorer-after{clip-path:inset(0 calc(100% - var(--reveal)) 0 0)}
.explorer-image-labels{position:absolute;inset:22px 22px auto;display:flex;justify-content:space-between;pointer-events:none;z-index:2}
.explorer-image-labels>span{font-size:9px;line-height:1;letter-spacing:1.4px;font-weight:600;padding:11px 12px;background:#152630dc;color:#fff;backdrop-filter:blur(8px)}
.explorer-image-labels>span:last-child{background:#ffffffde;color:#243944}
.explorer-divider{position:absolute;left:var(--reveal);top:0;bottom:0;width:2px;background:#fff;transform:translateX(-50%);filter:drop-shadow(0 0 4px #13283255);pointer-events:none;z-index:3}
.explorer-divider>span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:#fff;color:#193343;box-shadow:0 3px 20px #14212b33}
.explorer-divider svg{width:28px;height:20px}
.explorer-range{position:absolute;z-index:4;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y;-webkit-appearance:none;appearance:none;background:transparent;border:0}
.explorer-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:1px;height:54px;background:transparent}
.explorer-range::-moz-range-thumb{width:1px;height:54px;background:transparent;border:0}
.explorer-range::-moz-range-track{background:transparent;border:0}
.explorer-stage:has(.explorer-range:focus-visible){outline:3px solid #245f86;outline-offset:5px}
.explorer-stage:has(.explorer-range:focus-visible) .explorer-divider>span{background:#d7ecf8;outline:3px solid #245f86;outline-offset:3px}
.explorer-stage.is-complete .explorer-image-labels>span:last-child,.explorer-stage.is-before .explorer-image-labels>span:first-child{opacity:0}
.explorer-stage.is-complete .explorer-divider>span{transform:translate(-100%,-50%)}
.explorer-stage.is-before .explorer-divider>span{transform:translate(0,-50%)}
.explorer-loading{position:absolute;inset:0;display:grid;place-items:center;background:#14212b70;color:white;z-index:5;font-size:14px;backdrop-filter:blur(4px)}
.explorer-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:65px;padding:10px 20px}
.explorer-toolbar p{display:flex;align-items:center;gap:10px;font-size:11px;line-height:1.5;color:#4a626e}
.explorer-toolbar p svg{width:22px;height:16px;flex:none}
.explorer-play{display:inline-flex;align-items:center;gap:8px;border:0;background:transparent;font-size:11px;font-weight:600;min-height:44px;padding:8px 0 8px 8px;white-space:nowrap}
.explorer-play:hover{color:#245f86}
.explorer-play svg{width:16px;height:16px;fill:currentColor;stroke-width:0}
.explorer-kicker{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:9px;letter-spacing:1.5px;font-weight:700;color:#657982;margin-bottom:18px}
.explorer-kicker>span{font-size:20px;line-height:1;color:#245f86}
.explorer-choices{border-top:1px solid #cbd3d5}
.explorer-choice{display:flex;align-items:center;text-align:left;width:100%;min-height:93px;gap:17px;padding:20px 0;border:0;border-bottom:1px solid #cbd3d5;background:transparent;transition:padding .25s,background .25s}
.explorer-number{font-size:10px;color:#73858f;font-family:'Space Grotesk',sans-serif}
.explorer-choice strong{display:block;font-size:20px;line-height:1.4;font-family:var(--display);font-weight:500;letter-spacing:-.6px}
.explorer-choice small{display:block;margin-top:5px;font-size:11px;color:#627780;line-height:1.6}
.explorer-choice-arrow{margin-left:auto;font-size:21px;opacity:0;transform:translate(-6px,6px);transition:transform .25s,opacity .25s}
.explorer-choice[aria-pressed=true]{padding-inline:18px;background:#e7edf0;box-shadow:inset 3px 0 #245f86}
.explorer-choice[aria-pressed=true] .explorer-number{color:#245f86}
.explorer-choice[aria-pressed=true] .explorer-choice-arrow{opacity:1;transform:none;color:#245f86}
.explorer-choice:hover{background:#e9edef}
.explorer-details{padding-top:28px}
.explorer-material{display:flex;gap:13px;align-items:center}
.explorer-swatch{display:block;flex:none;width:42px;height:42px;border:1px solid #9daab1;background:repeating-linear-gradient(0deg,#ffffff00 0px,#ffffff28 1px,#ffffff00 2px),linear-gradient(110deg,#88969d,#e2e9ec 42%,#9eaeb7 60%,#c9d0d5)}
.explorer-swatch.is-diamond{background:#b5bdc1 url('assets/explorer-industrial-after.jpg') 95% 70%/390px}
.explorer-detail-label{font-size:8px;letter-spacing:1.4px;line-height:1.5;display:block;color:#617781;font-weight:600;margin-bottom:4px}
.explorer-material h3{font-size:18px;letter-spacing:-.4px;font-weight:500}
.explorer-description{font-size:13px;line-height:1.85;margin-top:17px;min-height:73px}
.explorer-specs{display:grid;grid-template-columns:1fr 1.2fr;gap:15px;padding-top:19px;margin:21px 0 25px;border-top:1px solid #cbd3d5}
.explorer-specs dt{font-size:8px;font-weight:600;letter-spacing:1.2px;color:#627780;margin-bottom:5px}
.explorer-specs dd{font-family:'Space Grotesk',sans-serif;margin:0;font-size:17px;color:#263f4c}
.explorer-cta{font-size:13px}
.explorer-nojs{padding:14px;font-size:12px}
@media(min-width:1450px){.explorer-layout{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:70px}}
@media(max-width:1100px){.explorer-layout{gap:32px;grid-template-columns:minmax(0,1.25fr) minmax(280px,1fr)}.explorer-choice{min-height:83px;padding-block:15px}.explorer-choice strong{font-size:18px}.explorer-toolbar{padding-inline:14px}.explorer-toolbar p{font-size:10px}.explorer-play{font-size:10px}.explorer-description{min-height:0}.explorer-details{padding-top:23px}}
@media(max-width:800px){.explorer-heading{gap:24px;align-items:start;margin-bottom:30px}.explorer-heading h2{font-size:37px}.explorer-heading>p{font-size:13px;max-width:240px;padding-top:35px}.explorer-layout{grid-template-columns:1fr;gap:32px}.explorer-panel{display:grid;grid-template-columns:1fr 1fr;column-gap:35px}.explorer-kicker{grid-column:1/-1;margin-bottom:14px}.explorer-details{padding-top:0}.explorer-cta{grid-column:2;justify-self:start}.explorer-choices{grid-row:2/4}.explorer-specs{margin-bottom:20px}.explorer-stage{aspect-ratio:1.12}.explorer-stage>img{object-position:center 60%}.explorer-toolbar p,.explorer-play{font-size:12px}}
@media(max-width:560px){.explorer-heading{display:block}.explorer-heading h2{font-size:37px;letter-spacing:-1.7px}.explorer-heading>p{max-width:none;padding-top:20px;font-size:14px}.explorer-layout{gap:24px}.explorer-stage{aspect-ratio:1}.explorer-image-labels{inset:15px 15px auto}.explorer-image-labels>span{font-size:8px;padding:9px 10px;letter-spacing:1px}.explorer-divider>span{width:46px;height:46px}.explorer-toolbar{align-items:center;flex-wrap:wrap;gap:0;padding:9px 13px}.explorer-toolbar p{font-size:10px;gap:7px}.explorer-toolbar p svg{width:17px}.explorer-play{font-size:10px;gap:5px}.explorer-panel{display:block}.explorer-kicker{font-size:9px}.explorer-choice{min-height:77px;padding-block:15px}.explorer-choice strong{font-size:18px}.explorer-choice small{font-size:11px;margin-top:2px}.explorer-details{padding-top:25px}.explorer-description{font-size:14px}.explorer-specs{margin-top:19px}.explorer-cta{font-size:14px}.explorer-heading .eyebrow{font-size:10px}}
@media(prefers-reduced-motion:reduce){.explorer-choice,.explorer-choice-arrow{transition:none}}
/* Put the room picker directly above the image on small screens. */
@media(max-width:800px){
 .explorer-layout{gap:18px}
 .explorer-panel{display:contents}
 .explorer-kicker{order:0;grid-column:auto;margin:0}
 .explorer-choices{order:1;grid-row:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid #cbd3d5}
 .explorer-choice{min-height:88px;align-items:flex-start;flex-direction:column;justify-content:center;gap:7px;padding:13px 15px;border:0;border-right:1px solid #cbd3d5}
 .explorer-choice:last-child{border-right:0}
 .explorer-choice[aria-pressed=true]{padding:13px 15px;box-shadow:inset 0 -3px #245f86}
 .explorer-choice strong{font-size:15px;letter-spacing:-.3px;line-height:1.35}
 .explorer-choice small,.explorer-choice-arrow{display:none}
 .explorer-viewer{order:2}
 .explorer-details{order:3;padding-top:14px}
 .explorer-description{min-height:0;max-width:580px}
 .explorer-specs{max-width:430px;margin-bottom:10px}
 .explorer-cta{order:4;grid-column:auto;justify-self:start}
 .explorer-status{order:5}
}
@media(max-width:560px){
 .space-explorer{padding-block:58px}
 .explorer-choice,.explorer-choice[aria-pressed=true]{padding:11px 10px;min-height:88px}
 .explorer-choice strong{font-size:12px;letter-spacing:-.15px}
 .explorer-number{font-size:9px}
 .explorer-heading{margin-bottom:26px}
}
