:root{--ink:#202223;--muted:#74797b;--line:#d7d9d9;--paper:#f8f9f9;--mist:#f0f1f2;--serif:Georgia,"Times New Roman",serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,Arial,sans-serif;font-weight:300;letter-spacing:.005em}a{color:inherit;text-decoration:none}.topbar{height:88px;padding:0 6.65%;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;font-size:15px;letter-spacing:.025em;position:absolute;top:0;left:0;width:100%;z-index:2;background:#f7f9fa}.topbar .cooperation{grid-column:1;justify-self:start;white-space:nowrap}.topbar .wordmark{grid-column:2}.topbar .top-cta{grid-column:3;white-space:nowrap}.top-cta{text-align:right}.top-cta span{font-size:15px;margin-left:8px}.wordmark{font-size:29px;font-weight:300;letter-spacing:.05em;text-align:center;line-height:1;transform:translateY(7px)}.wordmark span{display:block;font-size:11px;letter-spacing:.2em;margin-top:7px;font-weight:400}.hero{height:100svh;min-height:700px;position:relative;overflow:hidden;background:#f7f9fa;padding:133px 3.125% 0}.hero-video{display:block;width:100%;height:100%;object-fit:cover;background:#fff}.section-pad{padding-left:6.5%;padding-right:6.5%}.principles{background:var(--mist);padding-top:240px;padding-bottom:205px}.section-heading{text-align:center;margin-bottom:78px}.eyebrow{font-size:9px;text-transform:uppercase;letter-spacing:.17em;color:#878c8d}.section-heading h1,.project-header h2,.contact-content h2{font-size:clamp(23px,3vw,37px);font-weight:300;line-height:1.17;letter-spacing:.025em;text-transform:uppercase;margin:14px 0 0}.principle-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.principle{min-height:240px;padding:24px 24px 26px;position:relative;border-right:1px solid var(--line)}.principle:first-child{border-left:1px solid var(--line)}.number{font-size:9px;color:#929798;letter-spacing:.1em}.principle h2{font-size:22px;font-weight:300;margin:27px 0 16px}.principle p{max-width:320px;font-size:14px;line-height:1.55;color:#717778;margin:0}.card-arrow{position:absolute;right:19px;top:18px;font-size:12px;color:#929798}.quote-section{min-height:540px;display:grid;grid-template-columns:38% 62%;align-items:center;background:var(--mist);padding:0 6.5%;gap:0}.portrait{height:500px;display:flex;justify-content:flex-start;align-items:end;overflow:hidden}.portrait img{display:block;width:100%;height:100%;object-fit:contain;object-position:left bottom;mix-blend-mode:multiply}.portrait svg{height:100%;max-width:100%}.quote-copy{padding:35px 0 35px 70px;max-width:760px;border-left:1px solid var(--line)}.quote-copy blockquote{font-size:clamp(22px,2.2vw,29px);font-style:italic;font-weight:300;line-height:1.3;margin:0 0 30px}.quote-copy p{font-size:15px;font-style:italic;line-height:1.55;color:#727879;max-width:650px;text-align:justify}.signature{margin-top:42px;display:flex;justify-content:flex-end;align-items:center;font-size:13px}.signature small{font-size:13px;letter-spacing:.08em;color:#606667}.project-section{padding-top:105px;padding-bottom:80px}.project-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:34px}.project-header h2{margin:12px 0;font-size:clamp(25px,3.2vw,40px)}.project-header p{font-size:10px;color:var(--muted);max-width:330px;line-height:1.7;margin:0}.project-meta{font-size:9px;line-height:1.9;text-align:right;color:#8b9091;letter-spacing:.03em}.project-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.project-card{min-width:0}.model{aspect-ratio:1.65;background:#fafbfb;border:1px solid #dfe1e1;display:flex;align-items:center;justify-content:center;overflow:hidden}.model svg{width:100%;height:100%;padding:8%;overflow:visible}.model .ground{fill:#f3f4f4;stroke:#c8cbca;stroke-width:2}.model .roof{fill:#e3e5e5;stroke:#9ea2a1;stroke-width:2}.model .wall{fill:#cfd2d1;stroke:#a3a7a6;stroke-width:2}.model .roof2{fill:#f3f4f4;stroke:#a0a4a3;stroke-width:2}.model .wall2{fill:#d6d9d8;stroke:#a7acab;stroke-width:2}.model .glass{fill:#9fa8aa;stroke:#858b8c;stroke-width:1}.model .line{fill:none;stroke:#c2c5c5;stroke-width:1.5}.project-card h3{font-size:12px;font-weight:400;margin:15px 0 5px}.project-card p{font-size:9px;line-height:1.5;color:var(--muted);margin:0}.gallery-controls{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;margin-top:27px;font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:#7e8384}.dots{display:flex;justify-content:center;gap:8px}.dot{width:6px;height:6px;padding:0;border:1px solid #929697;background:transparent;border-radius:50%;cursor:pointer}.dot.selected{background:#343839;border-color:#343839}.arrows{text-align:right}.arrows button{border:0;background:none;padding:6px 8px;font-size:16px;color:#686d6e;cursor:pointer}.details{padding-top:40px;padding-bottom:92px}.detail-row{display:grid;grid-template-columns:7% 24% 1fr 24px;gap:12px;align-items:center;border-bottom:1px solid var(--line);padding:20px 0}.detail-row>span{font-size:9px;color:#8a9091}.detail-row h3{font-size:17px;font-weight:300;margin:0}.detail-row p{font-size:10px;color:#737879;line-height:1.6;margin:0;max-width:600px}.detail-row b{font-weight:300;color:#8a8f90}.contact-section{min-height:560px;display:grid;grid-template-columns:1fr 1fr;align-items:center;overflow:hidden;background:#f1f2f3}.contact-art{align-self:stretch;display:flex;align-items:center;justify-content:flex-start;margin-left:-6%;overflow:hidden}.contact-art svg{width:min(100%,560px);height:auto;transform:translateX(-7%)}.contact-content{padding:75px 15% 70px 4%;max-width:680px}.contact-content h2{font-size:clamp(22px,2.7vw,34px);margin:12px 0}.contact-content>p{font-size:10px;color:#7a8081;line-height:1.7;max-width:345px;margin-bottom:22px}form label{display:block;border-bottom:1px solid #d0d3d3;padding:13px 0 10px}form label span{display:block;font-size:8px;color:#858a8b;letter-spacing:.08em;text-transform:uppercase;margin-bottom:5px}input{width:100%;border:0;outline:0;background:transparent;font:300 11px Manrope,Arial,sans-serif;color:var(--ink)}input::placeholder{color:#a1a5a6}.submit{width:100%;display:flex;justify-content:space-between;border:0;background:none;padding:17px 0 11px;font:400 10px Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em;cursor:pointer}.submit span{font-size:15px}.form-note{display:block;color:#a1a5a6;font-size:8px;line-height:1.5}.form-status{font-size:10px;min-height:16px;color:#556b5e}footer{min-height:86px;padding:18px 6.5%;display:flex;align-items:center;justify-content:space-between;font-size:9px;color:#767c7d}footer .wordmark{font-size:20px;color:var(--ink);transform:none}footer .wordmark span{font-size:5px}
@media(max-width:700px){.topbar{height:68px;padding:0 5%;grid-template-columns:1fr 1fr 1fr;font-size:9px}.topbar .cooperation{grid-column:1;grid-row:1;justify-self:start;font-size:9px}.topbar .wordmark{grid-column:2;grid-row:1;justify-self:center;text-align:center;font-size:24px}.topbar .wordmark span{font-size:8px}.top-cta{display:none}.hero{height:auto;min-height:0;max-height:none;padding:92px 12px 0}.hero-video{height:auto;aspect-ratio:16/9;object-fit:contain}.section-pad{padding-left:6%;padding-right:6%}.principles{padding-top:110px;padding-bottom:105px}.section-heading{margin-bottom:40px}.section-heading h1{font-size:24px}.principle-grid{grid-template-columns:1fr}.principle{min-height:0;padding:18px 17px 22px;border-right:1px solid var(--line);border-left:1px solid var(--line);border-bottom:1px solid var(--line)}.principle h2{font-size:18px;margin:14px 0 9px}.principle p{max-width:90%;font-size:12px;line-height:1.6}.quote-section{grid-template-columns:1fr;gap:0;padding:20px 6% 0;min-height:0}.portrait{height:320px;justify-content:center}.portrait img{object-position:center bottom}.quote-copy{padding:24px 0 34px;border-left:0;border-top:1px solid var(--line)}.quote-copy blockquote{font-size:18px;margin:19px 0}.quote-copy p{font-size:11px}.signature{display:block;margin-top:24px;font-size:11px}.signature small{display:block;margin-top:6px;font-size:10px}.project-section{padding-top:73px;padding-bottom:50px}.project-header{display:block}.project-header h2{font-size:29px}.project-meta{text-align:left;margin-top:17px}.project-gallery{grid-template-columns:1fr;gap:24px}.project-card{display:none}.project-card.active{display:block}.model{aspect-ratio:1.5}.gallery-controls{margin-top:22px;grid-template-columns:1fr auto 1fr}.dots{grid-column:2;grid-row:1}.arrows{grid-column:3}.details{padding-top:20px;padding-bottom:65px}.detail-row{grid-template-columns:32px 1fr 20px;gap:8px;padding:17px 0}.detail-row p{grid-column:2;grid-row:2}.detail-row b{grid-column:3;grid-row:1}.detail-row h3{font-size:15px}.contact-section{grid-template-columns:1fr;min-height:0}.contact-art{height:220px;justify-content:flex-start;margin:0}.contact-art svg{width:75%;transform:translate(-10%,-2%)}.contact-content{padding:16px 7% 55px}.contact-content h2{font-size:25px}.contact-content>p{font-size:10px}footer{padding:18px 6%;min-height:75px}footer>span{font-size:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.sound-button{position:absolute;right:6.5%;bottom:24px;z-index:1;display:flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid rgba(32,34,35,.22);background:rgba(248,249,249,.82);color:var(--ink);font:400 10px Manrope,Arial,sans-serif;letter-spacing:.04em;cursor:pointer;transition:background .2s ease,border-color .2s ease}.sound-button:hover{background:#fff;border-color:rgba(32,34,35,.45)}.sound-button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.sound-button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}@media(max-width:700px){.sound-button{right:6%;bottom:14px;padding:8px 10px;font-size:9px}}

/* Project galleries: native horizontal scrolling with a three-card desktop view. */
.project-carousel{margin-top:0;overflow:hidden}
.project-carousel:not(.second-carousel){margin-top:48px}
.first-carousel-heading{justify-content:flex-start;margin-bottom:22px}
.project-gallery.carousel-track{display:flex;gap:12px;width:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;overscroll-behavior-x:contain;scrollbar-width:none;cursor:grab;touch-action:pan-x pan-y;}
.project-gallery.carousel-track::-webkit-scrollbar{display:none}
.project-gallery.carousel-track.is-dragging{cursor:grabbing;scroll-snap-type:none;scroll-behavior:auto;user-select:none}
.project-gallery.carousel-track .project-card{display:block;flex:0 0 calc((100% - 24px)/3);min-width:0;scroll-snap-align:start}
.project-gallery.carousel-track .project-card img{display:block;width:100%;aspect-ratio:1.48;object-fit:contain;background:#fff;border:1px solid var(--line)}
.project-gallery.carousel-track .project-card p{font-size:12px;line-height:1.45;color:#5f6566;margin:11px 0 0;max-width:95%}
.gallery-controls{margin-top:26px}
.gallery-controls .dots{gap:8px}
.gallery-controls .dot{flex:0 0 6px}
.gallery-controls .dot.selected{transform:scale(1.35)}
.second-carousel{margin-top:92px}
.third-carousel{margin-top:92px}
.carousel-heading{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:26px}
.carousel-heading h3{font-size:clamp(17px,2vw,24px);font-weight:300;letter-spacing:.02em;margin:0;text-transform:uppercase}
.carousel-subtitle{font-size:10px;line-height:1.8;text-align:right;color:var(--muted);margin:0}
.second-carousel .project-gallery.carousel-track .project-card img{aspect-ratio:1.48}
.gallery-controls button:focus-visible{outline:1px solid var(--ink);outline-offset:3px}
@media(max-width:700px){
  .project-gallery.carousel-track{gap:12px;margin-right:-6vw;padding-right:6vw;scroll-padding-left:0}
  .project-gallery.carousel-track .project-card{flex-basis:84%;scroll-snap-align:center}
  .project-gallery.carousel-track .project-card img{aspect-ratio:1.34}
  .project-gallery.carousel-track .project-card p{font-size:11px;margin-top:9px}
  .gallery-controls{grid-template-columns:1fr auto 1fr}
  .gallery-controls>span{font-size:7px}
  .gallery-controls .dots{grid-column:2;grid-row:1;gap:6px}
  .gallery-controls .arrows{grid-column:3;grid-row:1}
  .gallery-controls .arrows button{padding:4px 5px;font-size:14px}
  .second-carousel{margin-top:64px}
  .third-carousel{margin-top:64px}
  .project-carousel:not(.second-carousel){margin-top:34px}
  .carousel-heading{display:block;margin-bottom:20px}
  .carousel-heading h3{font-size:18px;margin-top:9px}
  .carousel-subtitle{text-align:left;margin-top:9px}
}

/* Pin each project gallery while normal page scrolling advances it horizontally. */
.carousel-scene{position:relative;width:100%}
.first-scene{margin-top:28px}
.second-scene,.third-scene{margin-top:48px}
.project-carousel{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;margin-top:0!important;padding:36px 0;background:var(--paper);z-index:1}
.project-gallery.carousel-track[data-page-linked="true"]{scroll-behavior:auto;scroll-snap-type:none}
.project-gallery.carousel-track[data-page-linked="true"] .project-card{scroll-snap-align:none}
@media(max-width:700px){
  .first-scene{margin-top:18px}
  .second-scene,.third-scene{margin-top:34px}
  .project-carousel{padding:22px 0}
}
.settling-image{transform:translateY(var(--settle-y,-26px)) scale(var(--settle-scale,.985));opacity:var(--settle-opacity,.78);transform-origin:center;will-change:transform,opacity}
.project-carousel .carousel-heading,.project-carousel .carousel-track,.project-carousel .gallery-controls{opacity:var(--entry-opacity,1);transform:translateY(var(--entry-y,0));}
@media(prefers-reduced-motion:reduce){.settling-image{transform:none;opacity:1;will-change:auto}.project-carousel .carousel-heading,.project-carousel .carousel-track,.project-carousel .gallery-controls{opacity:1;transform:none}}


/* Align project details with the project title. */
@media (min-width: 701px) { .project-header { align-items: flex-start; } .project-header > .project-meta { align-self: flex-start; margin-top: 25px; } }
@media (max-width: 700px) { .project-header > .project-meta { margin-top: 17px; } }

/* Center the project intro and align its metadata with the first villa heading. */
@media (min-width: 701px) { .project-header { display: block; text-align: center; margin-bottom: 34px; } .project-header > div:first-child { width: 100%; } .project-header h2 { letter-spacing: .095em; } .project-header p { max-width: none; white-space: nowrap; margin: 0 auto; } .first-carousel-heading { align-items: baseline; justify-content: space-between; } .first-carousel-heading .project-meta { flex: 0 0 auto; } }
@media (max-width: 700px) { .project-header { text-align: center; } .project-header p { max-width: 100%; white-space: normal; margin: 0 auto; } .first-carousel-heading { display: block; } .first-carousel-heading .project-meta { margin-top: 10px; text-align: left; } }

/* Tighten the vertical gaps between villa project scenes. */
@media (min-width: 701px) { .first-scene { margin-top: 18px; } .second-scene, .third-scene { margin-top: 20px; } }
@media (max-width: 700px) { .first-scene { margin-top: 12px; } .second-scene, .third-scene { margin-top: 14px; } }

/* Desktop: reduce inter-project spacing by another 40px. */
@media (min-width: 701px) { .second-scene, .third-scene { margin-top: -20px; } }

/* Desktop: reduce inter-project spacing by another 80px. */
@media (min-width: 701px) { .second-scene, .third-scene { margin-top: -100px; } }

/* Desktop: reduce inter-project spacing by another 100px. */
@media (min-width: 701px) { .second-scene, .third-scene { margin-top: -200px; } }

/* Dock-like hover magnification for project illustrations. */
.project-gallery.carousel-track .project-card img { position: relative; z-index: 1; --dock-scale: 1; transform: scale(var(--dock-scale)); transform-origin: center; transition: transform 360ms cubic-bezier(.2,.75,.25,1); will-change: transform; }
.project-gallery.carousel-track .project-card img.settling-image { transform: translateY(var(--settle-y,-26px)) scale(var(--settle-scale,.985)) scale(var(--dock-scale,1)); }
@media (prefers-reduced-motion: reduce) { .project-gallery.carousel-track .project-card img { transition: none; } }

/* Keep every illustration frame identical while its contents magnify. */
.project-gallery.carousel-track .project-image-frame { width: 100%; aspect-ratio: 1.48; overflow: hidden; border: 1px solid var(--line); background: #fff; }
.project-gallery.carousel-track .project-image-frame img { display: block; width: 100%; height: 100%; aspect-ratio: auto; object-fit: contain; border: 0; clip-path: inset(0 0 2px 0); }
@media (max-width: 700px) { .project-gallery.carousel-track .project-image-frame { aspect-ratio: 1.34; } }

/* Use the supplied handoff photo in the contact panel. */
.contact-art .contact-illustration { display: block; width: min(100%, 620px); height: 100%; object-fit: contain; object-position: left center; mix-blend-mode: multiply; }
@media (max-width: 700px) { .contact-art .contact-illustration { width: 100%; height: 100%; object-position: left center; transform: none; } }

/* Mask only the stray source-image edge marks in Falcon Hill frames 2 and 4. */
.project-image-frame.crop-bottom-edge, .project-image-frame.crop-right-edge { position: relative; }
.project-image-frame.crop-bottom-edge::after { content: ''; position: absolute; z-index: 5; left: 1px; right: 1px; bottom: 1px; height: 5px; background: #fff; pointer-events: none; }
.project-image-frame.crop-right-edge::after { content: ''; position: absolute; z-index: 5; top: 1px; right: 1px; bottom: 1px; width: 5px; background: #fff; pointer-events: none; }

/* Crop source-export edge marks without changing the shared card frames. */
.project-gallery.carousel-track .project-image-frame img.edge-crop-right { clip-path: inset(0 3.5% 0 0); }
.project-gallery.carousel-track .project-image-frame img.edge-crop-bottom { clip-path: inset(0 0 4.5% 0); }
.project-gallery.carousel-track .project-image-frame img.edge-crop-sides { clip-path: inset(0 3.5% 0 3.5%); }
.project-gallery.carousel-track .project-image-frame img.edge-crop-top { clip-path: inset(4% 0 0 0); }

/* Section navigation */
.topbar .main-nav{grid-column:1;justify-self:start;display:flex;align-items:center;gap:clamp(11px,1.35vw,20px);white-space:nowrap;font-size:10px;letter-spacing:.025em}.main-nav a{position:relative;color:#525859;transition:color .2s ease}.main-nav a::after{content:'';position:absolute;left:0;right:100%;bottom:-5px;height:1px;background:currentColor;transition:right .22s ease}.main-nav a:hover,.main-nav a:focus-visible{color:var(--ink)}.main-nav a:hover::after,.main-nav a:focus-visible::after{right:0}.principles[id],.quote-section[id],.project-section[id],.contact-section[id]{scroll-margin-top:24px}@media(max-width:1000px) and (min-width:701px){.topbar{padding-left:4%;padding-right:4%;grid-template-columns:1.3fr 1fr 1.3fr}.topbar .main-nav{gap:10px;font-size:9px}}@media(max-width:700px){.topbar .main-nav{position:absolute;left:0;right:0;top:65px;justify-content:center;gap:clamp(16px,5vw,28px);font-size:9px}.hero{padding-top:96px}}

/* Clear separation between in-page navigation and the two standalone directions. */
.topbar{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:20px}.topbar .main-nav{grid-column:1;justify-self:start;gap:clamp(12px,1.25vw,20px);font-size:10px}.topbar .wordmark{grid-column:2;grid-row:1}.topbar .header-actions{grid-column:3;justify-self:end;display:flex;align-items:center;gap:clamp(14px,1.8vw,28px);white-space:nowrap}.direction-nav{display:flex;align-items:center;gap:clamp(12px,1.35vw,20px)}.direction-nav a{font-size:10px;font-weight:500;letter-spacing:.075em;text-transform:uppercase;color:#202223;position:relative;padding:7px 0}.direction-nav a span{font-size:11px;margin-left:4px;transition:transform .2s ease}.direction-nav a:hover span{display:inline-block;transform:translate(2px,-2px)}.direction-nav a::after{content:'';position:absolute;left:0;right:100%;bottom:1px;height:1px;background:currentColor;transition:right .2s ease}.direction-nav a:hover::after,.direction-nav a:focus-visible::after{right:0}.topbar .top-cta{grid-column:auto;text-align:right;font-size:10px}.top-cta span{font-size:12px}.main-nav a{font-size:10px}.main-nav a::after{bottom:-5px}@media(max-width:1200px) and (min-width:701px){.topbar{padding-left:4%;padding-right:4%;gap:12px}.topbar .main-nav{gap:11px;font-size:9px}.direction-nav{gap:12px}.direction-nav a{font-size:9px}.topbar .top-cta{display:none}}@media(max-width:850px) and (min-width:701px){.topbar{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:8px}.topbar .wordmark{font-size:23px}.topbar .wordmark span{font-size:8px}.topbar .main-nav{gap:8px}.topbar .main-nav a{font-size:8px}.direction-nav{gap:9px}.direction-nav a{font-size:8px}}@media(max-width:700px){.topbar{height:68px;padding:0 5%;grid-template-columns:1fr 1fr 1fr}.topbar .wordmark{grid-column:2;grid-row:1;justify-self:center;font-size:24px}.topbar .wordmark span{font-size:8px}.topbar .main-nav{position:absolute;top:65px;left:0;right:0;justify-content:center;gap:clamp(17px,6vw,26px);font-size:8px}.topbar .main-nav a{font-size:8px}.topbar .header-actions{position:static;display:contents}.topbar .direction-nav{position:absolute;top:88px;left:0;right:0;justify-content:center;gap:28px}.topbar .direction-nav a{font-size:9px}.topbar .top-cta{display:none}.hero{padding-top:120px}}