:root{--ink:#07090f;--gold:#ffbf00;--paper:#f0efea;--muted:#737771;--line:#d9dcd5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.5 Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,#stage:focus-visible{outline:2px solid #a57800;outline-offset:4px}button{border:0} .masthead{height:92px;display:flex;align-items:center;justify-content:space-between;padding:0 4%;background:var(--ink);color:white;border-bottom:1px solid #24272c}.brand{font-size:19px;letter-spacing:.27em;color:var(--gold);text-decoration:none;font-weight:700}.brand span{display:block;letter-spacing:.3em;font-size:8px;margin-top:3px;color:#c8c9c7}.project{font-size:11px;letter-spacing:.18em;margin-left:-9%}.project span{display:block;font-size:8px;color:#8f949a;margin-top:5px}.gallery-link{font-size:12px;text-decoration:none;border-bottom:1px solid #67624d;padding-bottom:5px}.gallery-link span{color:var(--gold);margin-left:20px}.experience{position:relative;height:calc(100svh - 92px);min-height:520px;max-height:1000px;overflow:hidden;background:#bfccd1}.intro{position:absolute;z-index:2;left:4%;top:35px;pointer-events:none}.eyebrow{font-size:9px;letter-spacing:.2em;font-weight:700;margin:0 0 13px}.eyebrow span{display:inline-block;width:6px;height:6px;border-radius:50%;background:#8b6a26;margin-right:10px;vertical-align:middle}h1{font:normal clamp(32px,3.9vw,61px)/1.05 Georgia,serif;letter-spacing:-.04em;margin:0 0 12px}.intro>p:last-child{font-size:12px;color:#3e494b;margin:0}#stage{position:absolute;inset:0;touch-action:none;outline-offset:-5px}#scene,#poster{display:block;width:100%;height:100%;position:absolute;inset:0}#poster{object-fit:cover}#scene{opacity:0;transition:opacity .5s}body.ready #scene{opacity:1}body.ready #poster{visibility:hidden}body.fallback #scene{display:none}#loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:14px;background:#b8c7cd;color:#263438;font-size:12px;letter-spacing:.03em;z-index:3}.loader{height:21px;width:21px;border:1px solid #8a989c;border-top-color:#33464c;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}body.ready #loading,body.fallback #loading{display:none}.scene-topline{position:absolute;right:4%;top:39px;z-index:4;display:flex;gap:16px;align-items:center}.proposal{font-size:8px;letter-spacing:.14em;color:#37474e}#reset{background:#eef1ecbb;border:1px solid #899a9c66;border-radius:2px;padding:9px 13px;font-size:10px;color:#2c393b}.view-controls{position:absolute;z-index:4;bottom:65px;left:50%;transform:translateX(-50%);display:flex;background:#f4f3eef2;padding:5px;box-shadow:0 5px 35px #0b1c2620;border:1px solid #ffffff66}.view-controls button{background:transparent;padding:14px 24px;white-space:nowrap;font-size:12px;color:#505c5c;transition:background .2s}.view-controls button span{font-size:8px;opacity:.5;margin-right:12px}.view-controls button[aria-pressed=true]{background:var(--ink);color:white}.view-controls button[aria-pressed=true] span{color:var(--gold);opacity:1}.view-controls button:hover{background:#dce0da}.view-controls button[aria-pressed=true]:hover{background:#1e272a}.scene-footer{position:absolute;bottom:0;left:0;right:0;z-index:4;display:flex;justify-content:space-between;align-items:center;padding:18px 4%;font-size:8px;letter-spacing:.14em;color:#263c3c;background:linear-gradient(transparent,#c6cfc9b0)}.scene-footer i{font-style:normal;padding:0 10px}.scene-footer button{background:none;color:inherit;text-decoration:underline;text-underline-offset:4px;font-size:10px;letter-spacing:0}.materials{display:grid;grid-template-columns:1fr 2fr 2fr;gap:30px;padding:65px 5%;align-items:start;border-bottom:1px solid var(--line)}.materials>.eyebrow{margin-top:9px;color:#747763}.material-line{font:28px/1.3 Georgia,serif;margin:0;letter-spacing:-.025em}.material-line em{font-weight:normal;color:#797e72;font-size:22px}.swatches{display:flex;justify-content:space-between;gap:12px;font-size:9px;color:#555d56}.swatch{display:block;width:45px;height:45px;border-radius:50%;border:1px solid #00000013;margin-bottom:12px}.roof{background:#1c2225}.cedar{background:url('textures/stained-cedar.jpg') center/cover}.siding{background:#d7d8cd}.deck{background:url('textures/composite.jpg') center/cover}.stills{padding:70px 5% 85px}.section-heading{position:relative;margin-bottom:35px}.section-heading .eyebrow{color:#7e806a}h2{font:42px/1.1 Georgia,serif;letter-spacing:-.035em;margin:0}.section-heading>p:last-child{position:absolute;right:0;bottom:2px;font-size:11px;color:#73786f}.image-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px 24px}.image-grid a{text-decoration:none}.image-grid img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#cad3d0}.image-grid a>span{display:flex;justify-content:space-between;font-size:8px;letter-spacing:.1em;color:#798071;padding:12px 0;border-bottom:1px solid var(--line)}.image-grid b{font-size:11px;letter-spacing:0;color:#222a27;font-weight:400}footer{display:flex;gap:7%;align-items:center;padding:40px 5%;background:var(--ink);color:#989f9c}footer .brand{font-size:14px}footer p{max-width:640px;font-size:10px;line-height:1.7;margin:0}footer a{font-size:10px;white-space:nowrap;margin-left:auto} @media(max-width:760px){.masthead{height:76px;padding:0 6%}.brand{font-size:15px}.brand span{font-size:6px}.project{display:none}.gallery-link{font-size:10px}.experience{height:calc(90svh - 76px);min-height:610px;max-height:850px}.intro{left:6%;top:28px}h1{font-size:37px}.intro>p:last-child{font-size:11px}.scene-topline{top:155px;right:6%;left:6%;justify-content:space-between}.proposal{font-size:7px}#reset{padding:7px 10px}.view-controls{bottom:64px;width:90%;padding:4px;justify-content:space-between}.view-controls button{padding:12px 8px;font-size:10px;flex:1}.view-controls button span{display:block;margin:0 0 4px;font-size:7px}.scene-footer{padding:19px 6%;font-size:7px}#scene-status{display:none}.materials{display:block;padding:35px 6%}.material-line{font-size:27px;margin:20px 0 30px}.material-line em{font-size:21px}.swatches{max-width:450px}.swatch{width:38px;height:38px}.stills{padding:40px 6%}.section-heading>p:last-child{position:static;margin-top:14px}.image-grid{grid-template-columns:1fr;gap:24px}h2{font-size:36px}footer{flex-wrap:wrap;padding:30px 6%;gap:20px}footer p{flex-basis:100%}footer a{margin:0} }@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}#scene{transition:none}.loader{animation:none}}
body.fallback #poster{object-fit:contain}
body.photo-mode .experience{height:auto;max-height:none;min-height:0;background:var(--paper)}
body.photo-mode .intro{position:relative;left:auto;top:auto;padding:30px 4% 24px}
body.photo-mode #stage{position:relative;inset:auto;aspect-ratio:16/9;touch-action:auto;background:#dce2df}
body.photo-mode .scene-topline{position:relative;inset:auto;padding:16px 4%;justify-content:space-between}
body.photo-mode .view-controls{position:relative;left:auto;bottom:auto;transform:none;width:max-content;max-width:94%;margin:0 auto 12px}
body.photo-mode .scene-footer{position:relative;inset:auto;padding:14px 4%}
@media(max-width:760px){body.photo-mode .intro{padding:25px 6%}body.photo-mode .view-controls{width:92%}body.photo-mode h1{font-size:34px}}

.utility-controls{display:flex;gap:12px;pointer-events:auto}.utility-controls button{background:#07090fcc;color:#fff;border:1px solid #ffffff44;padding:9px 13px;border-radius:4px;font:inherit;cursor:pointer}.utility-controls button:focus-visible{outline:2px solid #FFBF00;outline-offset:3px}.experience:fullscreen{height:100vh;background:#07090f}.experience:fullscreen #stage{height:100vh}.experience:fullscreen .intro{display:none}@media(max-width:760px){.scene-topline{flex-wrap:wrap;gap:8px}.utility-controls{gap:4px}.utility-controls button{font-size:10px;padding:8px}.utility-controls #fullscreen{display:none}}

.night-mode .intro,.night-mode .intro p,.night-mode .proposal,.night-mode .scene-footer,.night-mode #motion{color:#f7f8fc}.night-mode .experience::after{opacity:.25}
@media(max-width:760px){.view-controls{display:grid;grid-template-columns:repeat(3,1fr);bottom:58px}.view-controls button{padding:9px 7px}.view-controls button span{display:none}.scene-footer{gap:8px}.proposal{background:#f7f8fcd9;padding:5px;color:#263438}.intro{padding:10px;background:#f7f8fcaa;border-radius:3px}.night-mode .intro{background:#07090f99}}
@media(max-width:480px){.intro{top:20px;left:5%;right:5%;padding:8px}.intro h1{font-size:29px;margin-bottom:7px}.intro .eyebrow{font-size:8px;margin-bottom:9px}.intro>p:last-child{font-size:10px}.scene-topline{top:145px}.view-controls{width:92%}}

/* embed mode: ?embed=1 strips page chrome so the stage fills an iframe */
.embed .masthead,.embed .intro,.embed .materials,.embed .stills,.embed footer{display:none}
.embed body{background:#07090f}
.embed .experience{height:100svh;max-height:none;min-height:0}
.embed .scene-topline{top:18px}
@media(max-width:760px){.embed .scene-topline{top:18px}}
