*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#eeeee7;color:#203027;font-family:Manrope,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit}.header{position:absolute;z-index:20;top:0;left:0;width:100%;height:100px;padding:0 5.2%;display:flex;align-items:center;color:#fff;gap:5vw}.logo{font-size:23px;letter-spacing:.2em;font-weight:700;display:flex;align-items:center;white-space:nowrap}.mark{font-size:34px;margin-right:8px;font-weight:400}.logo-sub{font-size:8px;letter-spacing:.12em;text-transform:uppercase;max-width:80px;white-space:normal;margin-left:12px;line-height:1.4;font-weight:500;opacity:.8}.nav{display:flex;gap:2.8vw;margin:auto;font-size:11px}.nav-cta{font-size:10px;text-transform:uppercase;letter-spacing:.08em;border:1px solid #ffffff83;border-radius:50px;padding:15px 19px}.nav-cta span{margin-left:22px}.menu{display:none}.journey{height:430vh;position:relative;background:#26372f}.sticky{height:100vh;position:sticky;top:0;overflow:hidden;color:white}.forest{position:absolute;inset:-4%;background:linear-gradient(90deg,#14241c88,#23372b16 65%,#1d2d1c38),url('forest.png') center/cover;transform:scale(1.05);filter:saturate(.72)}.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(17,30,24,.55),transparent 66%),linear-gradient(0deg,rgba(19,30,23,.55),transparent 40%)}#scene{position:absolute;inset:0;width:100%;height:100%;outline:0}.hero-copy,.scene-copy{position:absolute;left:8.3%;top:25%;z-index:2}.eyebrow,.chapter,.section-tag{font-size:9px;letter-spacing:.18em;font-weight:700}.eyebrow i{display:inline-block;width:7px;height:7px;background:#dbd3b1;border-radius:50%;margin-right:9px}.hero-copy h1,.scene-copy h2,.intro h2,.principle-title h2,.contact h2{font-family:'Fraunces',Georgia,serif;font-weight:400;letter-spacing:-.055em;line-height:1.02}.hero-copy h1{font-size:clamp(58px,7.8vw,124px);margin:30px 0 24px}.hero-copy h1 span{color:#c8a47a}em{font-weight:400}.hero-copy p,.scene-copy p{font-size:13px;line-height:1.8;color:#ffffffcf}.round-link{display:inline-flex;align-items:center;gap:40px;font-size:11px;margin-top:25px}.round-link b{display:grid;place-items:center;border:1px solid #ffffffa0;border-radius:50%;width:42px;height:42px;font-size:16px;font-weight:400}.scene-copy{top:33%;opacity:0;visibility:hidden;max-width:380px}.scene-copy h2{font-size:clamp(52px,6vw,90px);margin:25px 0}.scene-copy p{max-width:270px}.text-link{display:inline-block;margin-top:20px;font-size:12px;border-bottom:1px solid;padding-bottom:8px}.scroll-label{position:absolute;bottom:45px;left:8.3%;display:flex;align-items:center;gap:16px;font-size:8px;letter-spacing:.14em}.scroll-line{height:1px;width:100px;background:#ffffff70}.scroll-line i{display:block;height:1px;background:#fff;width:15%;transition:width .2s}.side-note{position:absolute;right:4%;bottom:48px;font-size:8px;letter-spacing:.15em;writing-mode:vertical-rl}.scene-indicator{position:absolute;right:8%;bottom:54px;display:flex;gap:12px;align-items:center;font-size:8px;letter-spacing:.1em}.scene-indicator div{width:60px;height:1px;background:#ffffff77}.scene-indicator i{display:block;width:0;height:1px;background:white}.intro{padding:115px 7% 100px;background:#eeeee7}.intro-top{display:flex;justify-content:space-between;align-items:center}.small-symbol{font-size:30px;color:#849381}.intro-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:10%;align-items:end;margin:55px 0 90px}.intro h2,.principle-title h2{font-size:clamp(44px,5.2vw,76px);margin:0}.intro-grid p,.principle-title p{font-size:14px;line-height:1.9;max-width:400px;color:#6f7b70}.dark-link{font-size:11px;display:inline-flex;align-items:center;gap:30px;border-bottom:1px solid #a2aaa0;padding:16px 0}.dark-link span{font-size:17px}.project-visual{height:70vh;min-height:440px;background:linear-gradient(90deg,#182d22aa,transparent 80%),url('house.jpg') center 55%/cover;position:relative;color:white;overflow:hidden}.project-visual:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#102017a3,transparent 70%)}.project-overlay{position:absolute;z-index:2;bottom:55px;left:55px}.project-overlay span,.project-number,.project-caption{font-size:9px;letter-spacing:.16em}.project-overlay h3{font:italic 58px 'Fraunces',serif;margin:18px 0 5px}.project-overlay p{font-size:12px}.project-number{position:absolute;z-index:2;right:55px;bottom:60px}.project-number span{opacity:.5}.project-caption{display:flex;justify-content:space-between;padding-top:22px;color:#68766b}.principles{background:#d9ded3;padding:130px 7%;display:grid;grid-template-columns:1fr 1fr;gap:12%}.principle-title h2{margin:45px 0 28px}.principle-list>div{display:grid;grid-template-columns:35px 1fr 30px;padding:28px 0;border-top:1px solid #a8b4a5;column-gap:15px}.principle-list span{font-size:9px;letter-spacing:.1em;padding-top:6px;color:#758276}.principle-list h3{font:28px 'Fraunces',serif;margin:0}.principle-list p{grid-column:2;font-size:12px;line-height:1.8;color:#6d7c6f;max-width:320px}.principle-list b{grid-column:3;grid-row:1;font-weight:400}.contact{background:#203027;color:#f4f2e8;padding:110px 7% 35px}.contact-inner{text-align:center;padding:80px 0 140px}.contact h2{font-size:clamp(58px,8vw,110px);margin:40px 0 25px}.contact p{font-size:13px;color:#ccd4ca}.contact-button{display:inline-flex;gap:50px;align-items:center;border:1px solid #aab9a9;padding:20px 25px;border-radius:50px;margin-top:35px;font-size:11px}.footer{border-top:1px solid #ffffff40;padding-top:30px;display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:.13em}.footer .logo{font-size:18px}.footer .mark{font-size:27px}@media(max-width:700px){.header{height:75px;padding:0 6%}.logo{font-size:19px}.logo-sub,.nav,.nav-cta{display:none}.menu{display:block;margin-left:auto;background:none;border:0;color:#fff;font-size:23px}.nav.open{position:absolute;display:flex;top:70px;left:0;right:0;background:#203027;flex-direction:column;padding:25px;gap:25px}.hero-copy,.scene-copy{left:7%;top:17%;right:7%}.hero-copy h1{font-size:58px;margin:22px 0}.hero-copy p{font-size:12px}.hero-copy .round-link{margin-top:8px}.scene-copy{top:19%}.scene-copy h2{font-size:49px}.scene-copy p{max-width:240px}.scroll-label{left:7%;bottom:30px}.scene-indicator{right:7%;bottom:32px}.side-note{display:none}.intro{padding:80px 7%}.intro-grid,.principles{grid-template-columns:1fr;gap:35px}.intro-grid{margin:35px 0 55px}.project-visual{height:55vh;min-height:400px}.project-overlay{left:25px;bottom:25px}.project-overlay h3{font-size:45px}.project-number{right:25px;bottom:30px}.project-caption{font-size:7px}.principles{padding:80px 7%}.contact-inner{padding:60px 0 100px}.contact h2{font-size:57px}.footer{flex-wrap:wrap;gap:25px}.footer span{font-size:7px}.footer span:nth-of-type(1){display:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.journey{height:300vh}}
/* Cinematic architectural sequence */
.journey{height:500vh;background:#142018}.film{position:absolute;inset:0;overflow:hidden;background:#1c2922}.film-layer{position:absolute;inset:-8%;background-position:center;background-size:cover;will-change:transform,opacity}.film-final{background-image:url('house.jpg')}.film-frame{background-image:url('construction.jpg');opacity:0}.film-base{background-image:url('foundation.jpg');opacity:0}.film-grain{position:absolute;inset:0;opacity:.15;background:linear-gradient(0deg,#101a11 0%,transparent 45%,#1a241733 100%);pointer-events:none}.shade{background:linear-gradient(90deg,rgba(12,22,17,.72) 0%,rgba(12,22,17,.38) 34%,transparent 75%),linear-gradient(0deg,rgba(15,23,18,.58),transparent 33%);pointer-events:none}.hero-copy{top:27%}.hero-copy h1{font-size:clamp(68px,8vw,122px)}.hero-copy p,.scene-copy p{font-size:14px;text-shadow:0 1px 8px #0008}.scene-copy{top:34%}.scene-copy h2{font-size:clamp(58px,6.4vw,94px)}.scroll-label{z-index:4}.scene-indicator{z-index:4}.side-note{z-index:4}.project-visual{background-position:center 53%}.project-visual:after{background:linear-gradient(0deg,#102017bd,transparent 60%)}@media(max-width:700px){.journey{height:430vh}.film-layer{inset:-5%;background-position:60% center}.shade{background:linear-gradient(180deg,#101d1bc4 0%,#14201864 46%,#111d17a6 100%)}.hero-copy{top:20%}.hero-copy h1{font-size:clamp(52px,14vw,68px)}.scene-copy{top:24%}.scene-copy h2{font-size:clamp(48px,12vw,62px)}.scene-copy p{max-width:80%}}@media(prefers-reduced-motion:reduce){.film-layer{transform:none!important}.journey{height:300vh}}
@media(min-width:701px){.scene-copy{max-width:640px}.scene-copy p{max-width:310px}}
/* Live Three.js scene, controlled by a seekable HyperFrames timeline. */
.forest{display:block;inset:-3%;background:linear-gradient(90deg,#1a2a24aa,#24352e30 75%),url('forest.png') center/cover;filter:saturate(.7) brightness(.75)}#scene{display:block;z-index:1}.shade{z-index:2}.hero-copy,.scene-copy{z-index:3}.scroll-label,.scene-indicator,.side-note{z-index:4}
.scene-loading{position:absolute;z-index:6;right:8%;bottom:12%;font-size:9px;letter-spacing:.15em;color:white}
@media(max-width:700px){.scene-indicator{display:none}.scene-loading{bottom:10%}}