/* ETAGI: one continuous photographic journey. Native scroll, deterministic scenes. */
:root{--red:#f15044;--header:88px}
.header{height:var(--header)}
.brand .brand-logo{width:150px;height:auto}.brand small{border:0;margin:0 0 0 9px;padding:0}
.hero-scene{height:300svh;min-height:1600px;background:#163434}
.hero-sticky{height:calc(100svh - var(--header));min-height:480px;top:var(--header)}
.hero-frame{inset:0;border-radius:0;animation:frame-unfold 1.7s cubic-bezier(.16,1,.3,1) both}
@keyframes frame-unfold{from{clip-path:inset(16% 29% 16% 29% round 180px)}to{clip-path:inset(0 0 0 0 round 0)}}
.hero-photo{object-position:center 55%;transform:scale(1.14)}
.hero-shade,.layer-shade{position:absolute;inset:0;background:linear-gradient(90deg,#062a367a,transparent 85%),linear-gradient(0deg,#06262f7a,transparent 65%)}
.hero-layer{position:absolute;inset:0;will-change:clip-path;overflow:hidden}
.hero-layer img{height:100%;width:100%;object-fit:cover;will-change:transform}
.hero-interior{clip-path:inset(0 0 0 100%)}.hero-bedroom{clip-path:inset(100% 0 0 0)}
.hero-copy{top:15%;left:6%;right:8%;pointer-events:none}
.hero-copy h1{font-size:clamp(70px,9vw,156px);line-height:.96;font-weight:450;max-width:1200px}
.hero-copy h1 span{animation:type-unfold 1.35s cubic-bezier(.16,1,.3,1) both}.hero-copy h1 span:nth-child(2){animation-delay:.18s}
@keyframes type-unfold{from{clip-path:inset(100% 0 0);transform:translateY(60px)}to{clip-path:inset(0);transform:translateY(0)}}
.hero-location{margin-bottom:28px;animation:type-unfold 1.3s .25s both}.hero-description{font-size:17px;animation:type-unfold 1.3s .35s both}
.hero-phase{position:absolute;left:6%;top:19%;color:#fff;pointer-events:none;opacity:0;will-change:transform,opacity}
.hero-phase>p{font-size:13px;margin-bottom:24px}.hero-phase h2{font-size:clamp(65px,8.2vw,132px);line-height:.98}
.hero-fixed-actions{position:absolute;left:6%;bottom:96px;display:flex;gap:30px;align-items:center;z-index:3}
.film-tour{color:white;background:transparent;display:flex;align-items:center;gap:16px;min-height:48px;font-size:13px;border-bottom:1px solid #ffffff70;padding:12px 0}
.film-tour span{font-size:14px}.film-tour:hover{border-bottom-color:#fff}
.hero-bottom{left:6%;right:6%;bottom:24px}.hero-track{left:0;right:0;bottom:0;height:3px}
.scene-nav{position:absolute;right:38px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:16px;z-index:4}
.scene-nav button{display:flex;flex-direction:row-reverse;align-items:center;gap:15px;background:transparent;color:#fff;min-height:44px;padding:0;text-align:right}
.scene-nav button span{width:40px;height:40px;display:grid;place-items:center;border:1px solid #ffffff60;border-radius:50%;font-size:11px;transition:background .3s,color .3s}
.scene-nav button i{font-style:normal;font-size:11px;opacity:.6;transition:opacity .3s}
.scene-nav button[aria-current] span{background:white;color:var(--ink);border-color:white}.scene-nav button[aria-current] i{opacity:1}
.introduction{padding-block:115px}.introduction h2{max-width:860px}
.photo-grid{overflow:visible;padding-top:65px;margin-top:-35px}.photo-card{will-change:transform}.photo-wrap{overflow:hidden;clip-path:inset(0);transition:clip-path .65s cubic-bezier(.16,1,.3,1)}.photo-card:hover .photo-wrap{clip-path:inset(8px round 3px)}.photo-card:hover img{transform:scale(1.055)}
.photo-open{transition:transform .4s,background .4s}.photo-card:hover .photo-open{transform:rotate(45deg);background:#fff;color:var(--ink)}
.film-section{padding-block:50px 145px;display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:8%;overflow:clip}
.film-intro h2{font-size:clamp(45px,5.1vw,78px)}.film-intro h2 em{font-style:normal;color:#60918d}.film-intro>p:not(.section-kicker){font-size:17px;line-height:1.7;margin-top:28px}.film-origin{display:block;margin-top:38px;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.film-composition{height:650px;position:relative;display:grid;place-items:center;perspective:1000px;isolation:isolate}
.film-portrait{position:relative;width:55%;height:90%;z-index:3;overflow:hidden;background:#dae4db;box-shadow:0 20px 70px #16343418;transform:rotate(-3deg);will-change:transform}
.film-portrait video{width:100%;height:100%;object-fit:cover}.film-portrait button{position:absolute;right:12px;bottom:12px;background:#ffffffed;border-radius:50%;height:44px;width:44px;display:grid;place-items:center;font-size:16px;color:var(--ink)}
.film-side{position:absolute;top:18%;width:39%;height:64%;object-fit:cover;will-change:transform}.film-side-left{left:0;transform:translateX(25%) rotate(-12deg)}.film-side-right{right:0;transform:translateX(-25%) rotate(10deg)}
.living-scene{height:220svh;min-height:1300px}.living-sticky{height:calc(100svh - var(--header));min-height:480px;top:var(--header)}
.living-image img{transform:scale(1.18)}.living-veil{display:none}.living-shutter{position:absolute;top:0;bottom:0;width:50.1%;background:var(--paper);will-change:transform}
.living-shutter:after{content:"";position:absolute;inset:8% 10%;border:1px solid #adbfba80}.living-shutter-left{left:0;border-right:1px solid #b2c6c3}.living-shutter-right{right:0}
.living-panel{width:100%;padding:0;position:absolute;left:0;top:27%;height:auto;display:block;text-align:center;will-change:opacity,transform;color:var(--ink)}
.living-panel h2{font-size:clamp(56px,8.4vw,136px);line-height:.97}.living-panel .section-kicker{color:var(--muted);margin-bottom:22px}.living-panel>p:not(.section-kicker){font-size:16px;margin:26px 0 0;line-height:1.5}
.living-cta{left:50%;bottom:7%;transform:translateX(-50%);white-space:nowrap;border:1px solid #b2c6c3}.living-cta:hover{transform:translateX(-50%) translateY(-2px)}.living-caption{bottom:22px;right:30px;font-size:11px}
.details{padding-block:125px}.detail-photo{overflow:hidden}.detail-photo img{will-change:transform}
.selection{position:relative;padding-block:100px;isolation:isolate}.selection:before{content:attr(data-label);position:absolute;left:-20px;top:0;z-index:-1;white-space:nowrap;font-size:clamp(65px,13.8vw,210px);letter-spacing:-.07em;font-weight:700;color:#e9efea;transform:translateY(-25%);pointer-events:none}.selection form{background:var(--paper)}
.closing{min-height:680px;overflow:hidden}.closing>img{height:120%;top:-10%;will-change:transform}.closing h2{font-size:clamp(65px,8vw,125px)}
.footer{padding-block:65px 40px}.footer-wordmark{display:flex;align-items:center;gap:25px;letter-spacing:0}.footer-wordmark img{width:205px;height:auto}.footer-wordmark span{margin:0;font-size:13px;color:var(--ink);letter-spacing:0;font-weight:400}
.menu-dialog[open]{animation:menu-enter .65s cubic-bezier(.16,1,.3,1) both}.menu-dialog[open] nav a{animation:menu-link .75s cubic-bezier(.16,1,.3,1) both}.menu-dialog[open] nav a:nth-child(2){animation-delay:.08s}.menu-dialog[open] nav a:nth-child(3){animation-delay:.16s}.menu-dialog[open] nav a:nth-child(4){animation-delay:.24s}
@keyframes menu-enter{from{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes menu-link{from{transform:translateX(70px);opacity:0}to{transform:translateX(0);opacity:1}}
.photo-dialog[open]{animation:photo-enter .6s cubic-bezier(.16,1,.3,1) both}@keyframes photo-enter{from{clip-path:inset(12% 20% round 50px);opacity:0}to{clip-path:inset(0 round 0);opacity:1}}
@media(max-width:1100px){.brand small{display:none}.scene-nav i{display:none}.hero-copy{right:13%}.hero-copy h1{font-size:11vw}.hero-description{max-width:300px}.film-composition{height:540px}.film-section{gap:4%}.living-panel{width:100%}}
@media(max-width:760px){:root{--header:74px}.brand .brand-logo{width:125px}.hero-scene{height:275svh;min-height:1500px}.hero-sticky,.living-sticky{height:calc(100svh - var(--header));min-height:590px}.hero-copy{top:17%;left:26px;right:24px}.hero-copy h1{font-size:clamp(58px,13.5vw,90px)}.hero-description{font-size:15px;margin-top:25px}.hero-location{font-size:12px;margin-bottom:25px}.hero-frame{inset:0;border-radius:0}.hero-photo{object-position:56% center}.hero-layer img{object-position:58% center}.hero-phase{left:26px;right:20px;top:20%}.hero-phase h2{font-size:clamp(58px,13.4vw,88px)}.hero-fixed-actions{left:26px;right:26px;bottom:94px;align-items:flex-start;flex-direction:column;gap:14px}.hero-fixed-actions .button{font-size:13px;min-height:54px;padding:15px 20px}.film-tour{padding:9px 0;min-height:44px}.hero-bottom{left:26px;right:26px;bottom:18px;font-size:10px}.hero-bottom>span:first-child{display:none}.hero-bottom a{min-height:44px}.scene-nav{right:22px;top:auto;bottom:28px;transform:none;flex-direction:row;gap:8px}.scene-nav button{width:40px}.scene-nav button span{width:32px;height:32px;font-size:9px}.hero-bottom .preview-label{display:none}.introduction{padding-block:75px}.photo-grid{padding-top:35px;margin-top:-20px}.film-section{grid-template-columns:1fr;padding-block:15px 85px;gap:30px}.film-intro h2{font-size:48px}.film-intro>p:not(.section-kicker){font-size:15px;margin-top:20px}.film-origin{margin-top:25px}.film-composition{height:530px}.film-portrait{width:61%}.film-side{width:40%;height:66%;top:19%}.living-scene{height:205svh;min-height:1200px}.living-panel{top:28%;left:0;padding:0 20px;width:100%}.living-panel h2{font-size:clamp(43px,11.5vw,72px)}.living-panel>p:not(.section-kicker){font-size:14px;margin-top:20px}.living-panel .section-kicker{font-size:12px}.living-cta{left:50%;bottom:11%;padding:15px 18px;font-size:12px;min-height:52px}.living-caption{bottom:25px;right:20px;left:20px;text-align:center;font-size:10px}.details{padding-block:80px}.selection{padding-block:70px}.selection:before{font-size:68px;top:13px;left:0}.closing{min-height:600px}.closing h2{font-size:57px}.footer-wordmark img{width:165px}.footer-wordmark{gap:20px}}
@media(max-height:570px) and (min-width:761px){:root{--header:64px}.hero-sticky,.living-sticky{height:calc(100svh - 64px);min-height:300px}.hero-scene{height:320svh;min-height:950px}.hero-copy{left:6%;top:22px}.hero-location{margin-bottom:12px;font-size:10px}.hero-copy h1{font-size:49px}.hero-description{display:none}.hero-fixed-actions{bottom:25px;gap:25px;left:6%}.hero-fixed-actions .button{min-height:44px;padding:10px 18px;font-size:12px}.hero-bottom{display:none}.hero-phase{top:26px}.hero-phase h2{font-size:49px}.hero-phase>p{margin-bottom:12px;font-size:10px}.scene-nav{right:25px;gap:5px}.scene-nav i{display:none}.living-scene{height:245svh;min-height:850px}.living-panel{top:24px}.living-panel h2{font-size:45px}.living-panel .section-kicker{margin-bottom:12px;font-size:10px}.living-panel>p:not(.section-kicker){font-size:12px;margin-top:15px}.living-cta{bottom:20px;min-height:44px;padding:10px 18px}.living-caption{display:none}.film-composition{height:480px}}
html.motion-off .hero-scene,html.motion-off .living-scene{height:auto;min-height:0}
html.motion-off .hero-sticky,html.motion-off .living-sticky{position:relative;top:0;height:calc(100svh - var(--header));min-height:640px}
html.motion-off .hero-layer,html.motion-off .hero-phase,html.motion-off .scene-nav,html.motion-off .film-tour,html.motion-off .living-shutter{display:none}
html.motion-off .hero-frame{clip-path:none!important;animation:none!important}
html.motion-off .hero-copy{opacity:1!important;transform:none!important;visibility:visible!important}
html.motion-off .photo-card,html.motion-off .film-side,html.motion-off .film-portrait,html.motion-off .detail-photo img{transform:none!important}
html.motion-off .living-panel{opacity:1!important;transform:none!important;color:white;text-shadow:0 1px 15px #163434}
html.motion-off .living-panel .section-kicker{color:white}html.motion-off .living-image:after{content:"";position:absolute;inset:0;background:#06262f70}
@media(prefers-reduced-motion:reduce){.hero-frame,.hero-copy h1 span,.hero-location,.hero-description{animation:none!important}.hero-scene,.living-scene{height:auto;min-height:0}.hero-sticky,.living-sticky{position:relative;top:0}.hero-layer,.hero-phase,.scene-nav,.film-tour,.living-shutter{display:none}.living-panel{color:white}}

.hero-generated{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 55%;opacity:0;transition:opacity .6s}.hero-generated.has-frame{opacity:1}html.motion-off .hero-generated{display:none}
