@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600&display=swap');
:root{--ink:#252621;--muted:#71716b;--accent:#8d7156}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:#fff;color:var(--ink);font-family:Manrope,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,.visual:focus-visible{outline:3px solid #bb966d;outline-offset:5px}.page{max-width:1500px;margin:26px auto;padding:5px;border:1px solid #aaa9a3;border-radius:30px}.hero{height:730px;position:relative;isolation:isolate;overflow:hidden;border-radius:25px;color:white;background:#8c7c68}.visual,.scene,.shade{position:absolute;inset:0}.visual{z-index:-3}.scene{opacity:0;transform:scale(1.1) translateX(2%);transition:opacity 1.1s,transform 1.8s cubic-bezier(.2,.65,.2,1)}.scene.active{opacity:1;transform:scale(1) translateX(0)}.scene img{height:100%;width:100%;object-fit:cover;object-position:50% 58%}.shade{z-index:-2;background:linear-gradient(180deg,#211b1650,transparent 47%,#1a1710b3),linear-gradient(90deg,#211b164d,transparent 65%);pointer-events:none}header{height:98px;display:flex;align-items:center;gap:35px;padding:22px 38px}.brand{display:block;width:48px;height:61px;background:white;border-radius:3px;padding:3px}.brand img{width:100%;height:100%;object-fit:contain}nav{display:flex;gap:32px;margin-left:auto;font-size:13px}nav a:hover{text-decoration:underline;text-underline-offset:6px}.header-label{margin-left:25px;font-size:11px;letter-spacing:1.5px}h1{font-size:clamp(70px,8.8vw,132px);line-height:.91;letter-spacing:-7px;font-weight:400;margin:3px 35px;pointer-events:none}h1 span{display:block;margin-left:105px}h1 br{display:none}.hero-bottom{position:absolute;left:38px;right:210px;bottom:37px;display:flex;align-items:flex-end;justify-content:space-between;gap:24px}.hero-message p{font-size:clamp(20px,2.1vw,31px);line-height:1.08;letter-spacing:-1px;margin:0 0 26px}.pill{display:inline-flex;align-items:center;justify-content:center;gap:35px;min-height:48px;border:1px solid var(--ink);border-radius:99px;background:transparent;padding:13px 24px;font-size:13px;white-space:nowrap;transition:background .2s,transform .2s}.pill:hover{background:#efebe4;transform:translateY(-2px)}.pill.light{background:white;color:#252621;border-color:white}.hero-caption{display:flex;flex-direction:column;gap:8px;font-size:14px;padding-bottom:6px}.hero-caption span:first-child{font-size:10px;letter-spacing:2px}.preview-stack{position:absolute;right:30px;bottom:35px;width:146px;display:grid;gap:8px}.thumb{position:relative;padding:0;height:78px;overflow:hidden;border-radius:13px;border:1px solid #ffffff70;background:#63503c;text-align:left}.thumb.selected{border:2px solid white}.thumb img{width:100%;height:100%;object-fit:cover;object-position:center 60%;filter:brightness(.8)}.thumb span{position:absolute;bottom:7px;left:10px;font-size:11px;color:white}.scene-count{padding:15px;background:#fff;color:var(--ink);border-radius:13px;display:flex;flex-direction:column;gap:5px}.scene-count strong{font-size:25px;font-weight:500;letter-spacing:-1px}.scene-count span{font-size:11px;color:var(--muted);line-height:1.4}.progress{position:absolute;bottom:0;left:0;right:0;height:3px;background:#ffffff20}.progress span{display:block;height:100%;width:20%;background:#fff;transition:width .8s}.about{display:grid;grid-template-columns:44% 56%;padding:78px 38px 64px;gap:20px}.eyebrow{font-size:11px;letter-spacing:1.2px}.about-left{display:flex;flex-direction:column;justify-content:space-between;gap:65px}.disciplines{display:flex;gap:42px;font-size:22px;letter-spacing:-1px}.disciplines span{display:block;color:var(--muted);font-size:11px;letter-spacing:0;margin-top:6px}.about-right h2{font-size:clamp(23px,2.5vw,36px);line-height:1.12;font-weight:400;letter-spacing:-1.4px;margin:0 0 22px;text-indent:22%}em{font-style:normal;color:var(--accent)}.about-bottom{display:flex;gap:28px;align-items:center}.about-bottom p{font-size:13px;color:var(--muted);line-height:1.7;max-width:390px;margin:0}.gallery{padding:0 38px 54px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-items:start}.project{padding:0;border:0;background:none;text-align:left}.project-image{height:270px;position:relative;overflow:hidden;border-radius:15px}.project:nth-child(2){margin-top:-14px}.project:nth-child(2) .project-image{height:308px}.project img{width:100%;height:100%;object-fit:cover;object-position:center 60%;transition:transform .7s}.project:hover img{transform:scale(1.045)}.project-image>span{position:absolute;right:16px;bottom:16px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#ffffffdd;font-size:19px}.project h3{font-size:14px;font-weight:500;margin:11px 0 4px}.project p{font-size:12px;color:var(--muted);margin:0;line-height:1.5}.feature{height:430px;margin:0 38px;border-radius:22px;overflow:hidden;position:relative;color:white}.feature>img{width:100%;height:100%;object-fit:cover;object-position:center 57%}.feature-shade{position:absolute;inset:0;background:linear-gradient(180deg,#1a13082e,transparent,#1a130869)}.feature>.eyebrow{position:absolute;top:28px;left:28px}.feature-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:68px;height:68px;border:0;border-radius:50%;background:white;font-size:28px}.feature-button:hover{background:#eee7dc}.feature-caption{position:absolute;left:28px;bottom:25px;font-size:11px;letter-spacing:1.3px}footer{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:26px 38px 32px}footer h2{font-size:23px;line-height:1.12;letter-spacing:-.8px;font-weight:400;margin:0}footer p,footer a{font-size:12px;line-height:1.6;color:var(--muted)}@media(min-width:1600px){h1{font-size:142px}}@media(max-width:1100px){.page{margin:16px}.hero{height:640px}.header-label{display:none}h1{font-size:100px}.hero-caption{display:none}.about{grid-template-columns:33% 67%;gap:0}.about-bottom{align-items:start;flex-direction:column;gap:15px}.disciplines{flex-direction:column;gap:20px}.project-image{height:230px}.project:nth-child(2) .project-image{height:264px}.feature{height:360px}}@media(max-width:680px){.page{margin:8px;border-radius:22px;padding:4px}.hero{height:730px;border-radius:17px}header{height:88px;padding:16px 20px;gap:15px}.brand{width:41px;height:53px}nav{gap:17px;font-size:11px}h1{font-size:clamp(48px,12.6vw,84px);letter-spacing:-3px;margin:24px 20px}h1 span{margin-left:17px;margin-top:5px}.scene img{object-position:50% 57%}.hero-bottom{left:21px;right:126px;bottom:30px}.hero-message p{font-size:23px;line-height:1.12;letter-spacing:-.8px}.pill{padding:12px 18px;font-size:12px;gap:14px}.preview-stack{right:16px;bottom:29px;width:93px;gap:7px}.thumb{height:62px;border-radius:10px}.thumb span{font-size:10px;left:6px}.scene-count{padding:10px;border-radius:10px}.scene-count strong{font-size:20px}.scene-count span{font-size:10px}.about{display:flex;flex-direction:column;padding:45px 20px 36px;gap:28px}.about-left{gap:20px}.disciplines{flex-direction:row;gap:32px;font-size:19px}.about-right h2{font-size:27px;letter-spacing:-1px;text-indent:12%}.about-bottom p{font-size:14px}.gallery{padding:0 20px 35px;grid-template-columns:1fr;gap:26px}.project:nth-child(2){margin:0}.project-image,.project:nth-child(2) .project-image{height:310px}.project h3{font-size:16px}.project p{font-size:13px}.feature{margin:0 20px;height:330px;border-radius:17px}.feature>.eyebrow{font-size:10px;left:18px;top:21px}.feature-caption{font-size:9px;left:18px}footer{padding:25px 20px;flex-wrap:wrap;gap:13px}footer h2{width:100%;font-size:21px}footer a{margin-left:auto}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.scene,.progress span,.project img,.pill{transition:none}}
/* Regula Design brand palette */
:root{--ink:#2c3639;--muted:#3f4e4f;--accent:#a27b5c;--sand:#dcd7c9}
body{background:var(--sand);color:var(--ink)}
.page{background:var(--sand);border-color:#3f4e4f80}
.hero{background:var(--muted)}
.shade{background:linear-gradient(180deg,#2c36396b,transparent 47%,#2c3639cc),linear-gradient(90deg,#2c363940,transparent 65%)}
.pill{border-color:var(--ink);color:var(--ink)}
.pill:hover{background:var(--ink);color:var(--sand)}
.pill.light{background:var(--sand);border-color:var(--sand);color:var(--ink)}
.pill.light:hover{background:var(--ink);border-color:var(--ink);color:var(--sand)}
.scene-count{background:var(--sand);color:var(--ink)}
.scene-count span,.project p,.about-bottom p,.disciplines span,footer p,footer a{color:var(--muted)}
.project-image>span,.feature-button{background:var(--sand);color:var(--ink)}
.feature-button:hover{background:var(--ink);color:var(--sand)}
.feature-shade{background:linear-gradient(180deg,#2c363940,transparent,#2c363980)}
.progress span{background:var(--accent)}
.thumb.selected{border-color:var(--sand)}
a:focus-visible,button:focus-visible,.visual:focus-visible{outline-color:var(--accent)}
.about-right em,footer em{color:#775337}
/* Preserve the original logo geometry and remove its white backing on the page. */
.brand{background:transparent;padding:0;border-radius:0;mix-blend-mode:multiply;width:61px;height:76px}
.brand img{mix-blend-mode:multiply}
.project-heading{padding:0 38px 35px;display:flex;align-items:end;justify-content:space-between;gap:20px}
.project-heading h2{font-size:38px;font-weight:400;letter-spacing:-1px;margin:10px 0 0}
.project-heading p{font-size:14px;color:var(--muted);margin:0 0 4px}
@media(max-width:680px){.brand{width:49px;height:62px}.project-heading{padding:0 20px 30px;display:block}.project-heading p{margin-top:12px}.project-heading h2{font-size:32px}}
.room-nav{display:flex;justify-content:space-between;align-items:center;gap:24px;margin:0 38px 38px;padding:20px 0;border-top:1px solid #3f4e4f40;border-bottom:1px solid #3f4e4f40}.room-nav>span{font-size:12px;letter-spacing:1px}.room-nav>div{display:flex;gap:8px;flex-wrap:wrap}.room-nav button{padding:12px 20px;border:1px solid #3f4e4f55;border-radius:50px;background:transparent;font-size:14px}.room-nav button[aria-pressed=true]{background:var(--ink);color:var(--sand);border-color:var(--ink)}.gallery{row-gap:30px}.gallery .project:nth-child(2){margin-top:0}.gallery .project:nth-child(2) .project-image{height:270px}.gallery .project-image{height:270px}.scene-nav{display:flex;gap:8px;margin-top:7px}.scene-nav button{background:transparent;color:var(--ink);border:1px solid #3f4e4f70;border-radius:50%;width:34px;height:34px;font-size:18px}.scene-nav button:hover{background:var(--ink);color:var(--sand)}@media(max-width:680px){.room-nav{margin:0 20px 30px;align-items:start;flex-direction:column;gap:16px}.room-nav button{padding:10px 15px;font-size:13px}.gallery .project-image,.gallery .project:nth-child(2) .project-image{height:350px}.scene-nav{gap:5px}.scene-nav button{height:29px;width:29px}}
.room-nav{flex-direction:column;align-items:flex-start}.room-nav>div{width:100%;gap:8px}.room-nav button{flex:1;white-space:nowrap}.brand{position:relative;z-index:2}header{isolation:auto}@media(max-width:680px){.room-nav button{flex:0 0 auto}}
/* Architectural opening: one continuous, unlabelled light cycle. */
.hero{height:min(900px,92vh);min-height:650px;background:#2c3639}
.exterior{position:absolute;inset:0;z-index:-3;overflow:hidden;background:#2c3639}
.exterior-backdrop{position:absolute;inset:-8%;background:linear-gradient(90deg,#2c3639 5%,#2c3639a0 55%,#2c363920),url('assets/exterior-day.png') center/cover;filter:blur(30px);opacity:.55}
.facade{position:absolute;inset:0 0 0 auto;width:78%;height:100%;object-fit:contain;object-position:75% center;transform-origin:65% 48%;will-change:opacity,transform,filter}
.facade-night{opacity:0}
.exterior.ready .facade-day{animation:day-light 28s ease-in-out infinite}
.exterior.ready .facade-night{animation:night-light 28s ease-in-out infinite}
.exterior.paused .facade{animation-play-state:paused}
.hero>.shade{background:linear-gradient(90deg,#20282bd9 0%,#20282b65 37%,transparent 68%),linear-gradient(0deg,#20282b85,transparent 30%,transparent 82%,#20282b44)}
.hero h1{font-size:clamp(60px,7.3vw,108px);margin-top:40px;max-width:720px;letter-spacing:-5px}
.hero h1 span{margin-left:0}
.hero .hero-bottom{right:42px}
.hero .hero-caption{padding-right:50px}
.motion-toggle{position:absolute;right:0;bottom:4px;border:1px solid #ffffff70;background:#2c363940;color:white;width:38px;height:38px;border-radius:50%;font-size:17px}
.hero .brand{filter:invert(1);mix-blend-mode:screen}
.room-viewer{position:relative;isolation:isolate;height:680px;margin:0 38px 35px;border-radius:22px;overflow:hidden;background:var(--ink);color:white}
.room-viewer .visual{z-index:-3}.room-viewer .preview-stack{bottom:26px;right:25px}
.viewer-caption{position:absolute;left:28px;bottom:35px;right:190px}
.viewer-caption>span{font-size:12px;letter-spacing:1.2px}.viewer-caption h2{font-size:32px;font-weight:400;margin:12px 0 0}
@keyframes day-light{0%,14%{opacity:1;transform:scale(1);filter:brightness(1)}35%{opacity:.7;transform:scale(1.022);filter:brightness(.82) sepia(.13) blur(1px)}49%,65%{opacity:0;transform:scale(1.038);filter:brightness(.75) blur(3px)}86%,100%{opacity:1;transform:scale(1);filter:brightness(1)}}
@keyframes night-light{0%,16%{opacity:0;transform:scale(1.04);filter:brightness(.85) blur(3px)}40%{opacity:.65;transform:scale(1.018);filter:brightness(.95) blur(1px)}51%,65%{opacity:1;transform:scale(1);filter:brightness(1) blur(0)}86%,100%{opacity:0;transform:scale(1.04);filter:brightness(.85) blur(3px)}}
@media(max-width:1100px){.hero h1{font-size:76px;max-width:580px}.facade{width:100%}.hero .hero-caption{display:none}.hero h1{margin-top:15px}}
@media(max-width:680px){.hero{height:820px;min-height:0;max-height:1100px}.hero h1{font-size:clamp(44px,11vw,70px);letter-spacing:-2px;margin:14px 20px}.facade{width:100%;height:80%;top:80px;object-position:center;object-fit:contain}.hero>.shade{background:linear-gradient(180deg,#20282b85,transparent 32%,transparent 60%,#20282bf2)}.hero .hero-bottom{left:21px;right:21px;bottom:25px}.hero-message p{font-size:20px}.room-viewer{margin:0 20px 30px;height:590px;border-radius:17px}.room-viewer .preview-stack{width:95px;right:15px;bottom:22px}.viewer-caption{left:20px;right:125px;bottom:28px}.viewer-caption h2{font-size:25px}.viewer-caption>span{font-size:10px}.motion-toggle{bottom:5px}}
@media(prefers-reduced-motion:reduce){.exterior.ready .facade{animation:none}.facade-night{opacity:0}.motion-toggle{display:none}}
.facade{mask-image:linear-gradient(180deg,transparent 0%,#000 9%,#000 88%,transparent 100%);-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 9%,#000 88%,transparent 100%)}
/* Full-viewport facade; no framed backdrop or image-edge mask. */
.page{max-width:none;margin:0;padding:0;border:0;border-radius:0}
.hero{height:100svh;min-height:620px;max-height:none;border-radius:0;background:transparent}
.exterior{background:transparent}
.exterior-backdrop{display:none}
.facade{inset:0;width:100%;height:100%;object-fit:cover;object-position:center 48%;mask-image:none;-webkit-mask-image:none}
.hero>.shade{background:linear-gradient(180deg,rgba(44,54,57,.3),transparent 30%,transparent 65%,rgba(44,54,57,.45))}
.hero h1,.hero-message p,header nav{ text-shadow:0 2px 18px rgba(0,0,0,.25)}
.viewer-caption h2{font-size:clamp(21px,2.5vw,34px);line-height:1.2;letter-spacing:-.5px;margin:0;font-weight:400}
@media(max-width:680px){.hero{height:100svh;min-height:650px;max-height:none}.facade{inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.viewer-caption h2{font-size:22px}}

.project-picker{padding:48px 5% 0}.project-picker>div{display:flex;gap:16px;margin-top:20px}.project-picker button{flex:1;text-align:left;padding:24px;border:1px solid #a27b5c;border-radius:16px;background:transparent;color:#2c3639;font:inherit;font-size:clamp(20px,3vw,36px);cursor:pointer}.project-picker button[aria-pressed="true"]{background:#2c3639;color:#dcd7c9}.project-picker small{display:block;font-size:14px;margin-top:10px}.project-picker button:focus-visible{outline:3px solid #a27b5c;outline-offset:4px}@media(max-width:600px){.project-picker>div{flex-direction:column}.project-picker{padding:28px 6% 0}}
