/* Final device-width rules, shared by every page after the design stylesheets. */
:root{--header-height:86px;--page-gutter:clamp(20px,4vw,56px)}
html{scroll-padding-top:calc(var(--header-height) + 20px);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{min-width:0}
main,section,article,nav,form,fieldset,header,footer,div{min-width:0}
img,video,iframe,svg{max-width:100%}
h1,h2,h3,p,a,button,label{overflow-wrap:anywhere}
input,select,textarea,button{max-width:100%}
.wrap{width:min(1360px,calc(100% - var(--page-gutter)*2))}
#site-header{position:sticky;top:0;z-index:50}
.site-header{position:relative;top:auto;height:var(--header-height);gap:24px;background:#fff;transition:background-color .25s ease,box-shadow .25s ease}
#site-header.is-scrolled .site-header{background:rgb(255 255 255 / 30%);-webkit-backdrop-filter:blur(18px) saturate(1.15);backdrop-filter:blur(18px) saturate(1.15);border-bottom-color:#69448a26;box-shadow:0 5px 24px #432b550a}
@media(prefers-reduced-motion:reduce){.site-header{transition:none}}
.brand{width:230px;min-width:0}
.brand img{width:100%;height:auto}
.header-actions{flex-shrink:0;gap:16px}
.header-actions select{width:54px;min-width:48px;min-height:44px}
.menu-button{width:44px;min-width:44px;min-height:44px;justify-items:center}
.wide-nav{font-size:13px;gap:18px}
.nav-group>a{display:block;line-height:1.6}
.btn{max-width:100%;white-space:normal;text-align:center}
.circle,.save-button,.modal-close{min-width:44px;min-height:44px}
.hero{height:auto;min-height:calc(100svh - var(--header-height));max-height:none;display:flex;flex-direction:column;justify-content:space-between}
.hero-content{width:min(1050px,100%);max-width:100%;padding:clamp(65px,11svh,140px) 6% 55px}
.hero h1{font-size:clamp(56px,6.6vw,100px)}
.hero-shortcuts{position:relative;left:auto;right:auto;bottom:auto;margin:0 6% 32px;width:fit-content;max-width:calc(100% - 190px);flex-shrink:0;flex-wrap:wrap}
.shortcut{min-height:54px}
.film-toggle{bottom:38px}
.intro-grid,.landmark,.nature-section,.map-section,.cta,.contact-page,.unit-detail-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.intro-grid{gap:clamp(28px,6vw,80px)}
.landmark-image img,.nature-section>img{height:100%;width:100%}
.gallery-track{grid-template-columns:repeat(3,minmax(0,1fr))}
.gallery-slide span,.photo-grid button span{max-width:calc(100% - 32px);white-space:normal}
.section-heading{flex-wrap:wrap}
.section-heading>div:first-child{flex:1;min-width:0}
.slider-controls{flex-shrink:0}
.why{grid-template-columns:minmax(0,1.06fr) minmax(0,1fr)}
.amenity-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.faq{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)}
.structure{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:clamp(25px,4vw,65px)}
.structure-art{top:calc(var(--header-height) + 20px)}
.building-stage{height:min(62svh,720px);min-height:0;aspect-ratio:1024/1536}
.building-stage svg{width:100%;height:100%}
.structure-art>.building-caption{max-width:100%;margin-top:18px;line-height:1.8}
.floor-choice{min-height:48px}
.floor-type{min-width:0}
.floor-navigation h1{font-size:clamp(30px,3vw,45px)}
.floor-units{grid-template-columns:repeat(2,minmax(0,1fr))}
.floor-units a{min-width:0;overflow-wrap:anywhere}
.floor-units strong{white-space:nowrap}
.filter-row{grid-template-columns:minmax(0,1fr) minmax(0,.75fr) minmax(0,1fr) minmax(0,1fr) auto}
.filter-row label,.range-fields{min-width:0}
.range-fields input{width:100%;min-width:0}
.filter-bottom{flex-wrap:wrap}
.unit-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.unit-specs{grid-template-columns:repeat(2,minmax(0,1fr))}
.photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.photo-grid button{min-width:0}
.gallery-filters{flex-wrap:wrap}
.chip{min-height:44px}
.feature-cover{max-width:1360px}
.newsletter{gap:clamp(25px,5vw,80px)}
.newsletter form{min-width:0;gap:16px}
.newsletter input{min-width:0;flex:1 1 200px;width:auto}
.newsletter form>p{flex-basis:100%}
.footer-top{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,.6fr)}
.footer-bottom{flex-wrap:wrap;line-height:1.8}
.footer-bottom>span:nth-child(2){flex:1;min-width:180px}
dialog{max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px)}
.inquiry-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.inquiry-content fieldset{min-width:0}
.drawer-nav>div{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.drawer-nav a{min-height:44px;display:flex;align-items:center}
.drawer-nav>div>div{font-size:13px;gap:4px}
.lightbox-caption>span{min-width:0;overflow-wrap:anywhere}
.smart-home-section{margin-inline:var(--page-gutter)}
.smart-home-frame{max-width:100%}
.smart-home-note{flex-wrap:wrap}
.smart-home-note p{flex:1 1 450px;min-width:0}
@media(min-width:1101px){
 :root{--header-height:86px}
 .site-header{display:flex;flex-wrap:nowrap;align-items:center;height:var(--header-height);padding:15px 24px;gap:20px}
 .brand{width:230px;flex-shrink:0}
 .header-actions{gap:12px}
 .wide-nav{display:flex;flex:1;justify-content:center;align-items:center;width:auto;border-top:0;padding:0 clamp(12px,1.4vw,28px);gap:clamp(16px,1.4vw,28px);font-size:clamp(11px,.7vw,13px)}
 .nav-group{min-width:0;padding-block:16px;white-space:normal}
 .nav-group>a{text-align:center;font-weight:600}
}
/* Wide-screen menu spans the owner's marked 18.2%–72.1% interval. */
@media(min-width:1700px){
 .site-header{display:grid;grid-template-columns:calc(18.2vw - 24px) 53.9vw minmax(0,1fr);grid-template-rows:1fr;gap:0}
 .brand{grid-column:1;grid-row:1;justify-self:start}
 .wide-nav{grid-column:2;grid-row:1;justify-content:space-between;width:100%;padding:0;gap:16px}
 .header-actions{grid-column:3;grid-row:1;justify-self:end}
}
@media(min-width:1101px) and (max-width:1699px){
 .brand{width:205px}
 .header-phone{display:none}
}
@media(min-width:1101px) and (max-width:1449px){
 .brand{width:170px}
 .header-actions>.btn{display:none}
 .wide-nav{gap:10px;padding-inline:8px;font-size:11px}
}
@media(max-width:1100px){
 :root{--header-height:80px;--page-gutter:28px}
 .site-header{display:flex;justify-content:space-between;align-items:center;padding:12px var(--page-gutter);gap:18px}
 .wide-nav{display:none}
 .brand{width:220px;flex-shrink:1}
 .header-actions{gap:12px}
 .header-phone{display:none}
 .hero-content{padding-top:80px}
 .hero h1{font-size:clamp(48px,7vw,74px)}
 .hero-shortcuts{max-width:calc(100% - 160px)}
 .shortcut{padding-inline:20px;gap:20px}
 .landmark-copy{padding:40px 30px}
 .landmark-copy h2{font-size:clamp(30px,3.7vw,42px)}
 .highlight{grid-template-columns:20px minmax(0,1fr);gap:12px}
 .highlight>span{display:block}
 .highlight h3{font-size:23px}
 .nature-section>div{padding:45px 30px}
 .nature-section>img{min-height:0}
 .amenity-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .structure{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:28px}
 .structure-art{position:static}
 .floor-navigation h1{font-size:32px}
 .floor-type{font-size:11px}
 .filter-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
 .filter-row>label:last-of-type{grid-column:auto}
 .filter-row>.reset{grid-column:1/-1;justify-self:end}
 .unit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .unit-detail-grid{grid-template-columns:minmax(0,1fr)}
 .unit-main-plan,.unit-main-plan>button{min-height:0;height:clamp(360px,55vw,600px)}
 .unit-info{padding-top:30px}
 .newsletter{grid-template-columns:minmax(0,1fr);padding-inline:var(--page-gutter)}
 .footer-top{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
 .footer-top>div:last-child{grid-column:1/-1;display:flex;gap:8px 24px;flex-wrap:wrap}
 .site-footer{padding-inline:var(--page-gutter)}
 .feature-cover{width:calc(100% - var(--page-gutter)*2);height:clamp(340px,50vw,560px)}
 .feature-cover.lobby-cover{height:auto}
 .contact-page{gap:30px}
 input,select,textarea{font-size:16px}
 .smart-home-frame{height:1550px}
}
@media(max-width:900px){
 .landmark,.nature-section,.map-section,.cta,.contact-page,.faq{grid-template-columns:minmax(0,1fr)}
 .landmark{display:grid}
 .landmark-image{height:clamp(420px,75vw,620px);min-height:0}
 .landmark-copy{padding:40px var(--page-gutter)}
 .landmark-copy h2{font-size:clamp(30px,5vw,42px)}
 .nature-section>img{height:clamp(320px,55vw,480px)}
 .map-section{gap:28px}
 .map-section iframe{height:340px}
 .cta>img{height:clamp(300px,55vw,460px)}
 .cta>div{padding:40px var(--page-gutter)}
 .structure{grid-template-columns:minmax(0,1fr)}
 .building-stage{height:min(68svh,660px);min-height:0;max-width:620px;margin-inline:auto}
 .floor-list{height:300px}
 .floor-heading{margin-top:25px}
 .floor-units{grid-template-columns:repeat(2,minmax(0,1fr))}
 .gallery-track,.property-pair+.gallery-section .gallery-track{grid-template-columns:repeat(2,minmax(0,1fr))}
 .gallery-slide:nth-child(3){display:none}
 .contact-page>img{height:clamp(320px,60vw,520px)}
 .service-list{grid-template-columns:repeat(2,minmax(0,1fr))}
 .smart-home-note{gap:20px}
 .smart-home-note p{flex-basis:100%}
}
@media(max-width:700px){
 :root{--header-height:74px;--page-gutter:20px}
 .site-header{padding-inline:16px;gap:12px}
 .brand{width:clamp(140px,45vw,205px)}
 .header-actions{gap:6px}
 .header-actions>.btn{display:none}
 .header-actions select{width:48px;font-size:12px}
 .menu-button{padding:8px}
 .hero-content{padding:65px 24px 40px}
 .hero h1{font-size:clamp(42px,11vw,64px);line-height:1.25}
 .hero p{font-size:18px;line-height:1.8;max-width:34ch}
 .hero-shortcuts{margin:0 20px 25px;width:calc(100% - 40px);max-width:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-radius:20px}
 .shortcut{padding:15px 16px;min-height:54px;font-size:11px;gap:12px;white-space:normal}
 .shortcut:nth-child(2){border-right:0}
 .shortcut:nth-child(-n+2){border-bottom:1px solid #ffffff30}
 .film-toggle{top:20px;bottom:auto;right:20px}
 .intro-grid{grid-template-columns:minmax(0,1fr);gap:24px}
 .facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 16px}
 .facts strong{font-size:clamp(36px,10vw,54px)}
 .facts span{letter-spacing:.03em;font-size:11px}
 .facts>div:nth-child(2){border-right:0}
 .property-pair article{grid-template-columns:minmax(0,1fr)}
 .property-pair article:last-child .property-visual{order:0}
 .property-visual{height:clamp(240px,74vw,360px);min-height:0}
 .property-copy{padding:28px 24px 32px}
 .property-pair h2{font-size:clamp(30px,8vw,38px)}
 .gallery-track,.property-pair+.gallery-section .gallery-track{grid-template-columns:minmax(0,1fr)}
 .gallery-slide:nth-child(n+2){display:none}
 .gallery-slide,.property-pair+.gallery-section .gallery-slide{height:clamp(300px,92vw,440px)}
 .section-heading{gap:18px}
 .section-heading h2,.property-pair+.gallery-section h2{font-size:clamp(30px,8vw,38px)}
 .slider-controls{gap:8px}
 .property-pair+.gallery-section .circle{width:44px;height:44px}
 .why{grid-template-columns:minmax(0,1fr);padding:28px 24px;gap:28px}
 .why>img{height:clamp(350px,100vw,520px);min-height:0;max-height:none}
 .why h2{font-size:clamp(30px,8vw,38px)}
 .amenity-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .amenity{font-size:16px}
 .nature-section>div{padding:38px var(--page-gutter)}
 .building-stage{height:auto;aspect-ratio:1024/1536;padding-bottom:0;min-height:0;max-height:none}
 .building-stage svg{height:100%}
 .building-caption{font-size:11px}
 .floor-type{font-size:12px}
 .floor-circle{width:36px;height:36px;font-size:13px}
 .filter-row{gap:20px 16px}
 .filter-bottom{gap:16px;align-items:center}
 .filter-bottom #result-count{width:100%;text-align:right}
 .check-label{font-size:12px;min-height:44px}
 .check-label input{width:20px;height:20px;min-height:20px}
 .unit-grid{grid-template-columns:minmax(0,1fr)}
 .unit-image{height:300px}
 .unit-tags{flex-wrap:wrap}
 .unit-main-plan,.unit-main-plan>button{height:clamp(300px,92vw,460px);min-height:0}
 .unit-info h1{font-size:clamp(34px,9vw,46px)}
 .unit-specs{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px}
 .photo-grid,.focused-gallery:has(>button:only-child){grid-template-columns:minmax(0,1fr)}
 .photo-grid button,.photo-grid button:nth-child(3n){grid-column:auto;height:clamp(280px,88vw,420px)}
 .photo-grid button.is-portrait,.focused-gallery button.is-portrait{height:auto;aspect-ratio:.75}
 .focused-gallery button,.focused-gallery button:nth-child(3n){height:auto;aspect-ratio:1.64}
 .gallery-filters{gap:8px}
 .chip{font-size:12px;padding:10px 15px}
 .feature-cover{height:clamp(300px,70vw,420px)}
 .feature-cover.lobby-cover{height:auto}
 .service-list,.news-links{grid-template-columns:minmax(0,1fr)}
 .document-card{align-items:start;gap:18px;padding:24px 18px}
 .document-card h2{font-size:27px}
 .document-card>span:last-child{font-size:28px;flex-shrink:0}
 .footer-top{grid-template-columns:minmax(0,1fr)}
 .footer-top>div:last-child{grid-column:auto}
 .footer-top nav{grid-template-columns:repeat(2,minmax(0,1fr))}
 .footer-top a{font-size:13px;min-height:36px}
 .footer-bottom>span:nth-child(2){flex-basis:100%}
 .newsletter form{gap:14px;align-items:stretch}
 .newsletter input{flex-basis:100%;font-size:16px}
 .newsletter .btn{align-self:start}
 .inquiry-content{padding:50px 24px 30px}
 .inquiry-grid{grid-template-columns:minmax(0,1fr);gap:22px}
 .inquiry-content h2{font-size:34px}
 .inquiry-content input,.inquiry-content select,.inquiry-content textarea,.filter-row input,.filter-row select{font-size:16px}
 .menu-drawer{max-width:100vw;width:100vw;max-height:100dvh;height:100dvh;padding:40px 24px}
 .drawer-nav>div{grid-template-columns:minmax(0,1fr);gap:8px}
 .drawer-nav>div>div{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 18px}
 .drawer-bottom{display:flex;flex-wrap:wrap;gap:12px}
 .drawer-bottom .btn{margin-top:0}
 .lightbox-image{height:min(64dvh,620px);padding:12px}
 .lightbox-caption{padding:10px 14px 20px;gap:12px}
 .lightbox-caption .circle{width:44px;height:44px}
 .smart-home-section{margin-inline:0}
}
@media(max-width:360px){
 :root{--page-gutter:16px}
 .site-header{padding-inline:12px}
 .header-actions{gap:2px}
 .hero-content{padding-inline:20px}
 .shortcut{font-size:10px;padding-inline:12px}
 .section-heading{align-items:start}
 .section-heading>div:first-child{flex-basis:100%}
 .slider-controls{margin-left:auto}
 .property-copy,.why{padding-inline:20px}
 .filter-row{grid-template-columns:minmax(0,1fr)}
 .filter-row>.reset{grid-column:auto}
 .document-card{flex-wrap:wrap}
 .drawer-nav>div>div{grid-template-columns:minmax(0,1fr)}
}
@media(max-height:760px) and (min-width:901px){.structure-art{position:static}}
@media(hover:none){.property-visual:hover img,.gallery-slide:hover img{transform:none}}
/* Clearer floor navigation at every screen size, without changing floor mapping. */
.floor-navigation .floor-heading{font-size:12px;font-weight:600;line-height:1.6;color:#594668}
.floor-navigation .floor-choice{font-size:14px;font-weight:600;border-bottom-color:#69448a26}
.floor-navigation .floor-type{font-size:14px;font-weight:600;line-height:1.5;color:var(--purple)}
.floor-navigation .floor-circle{font-size:16px;font-weight:600;font-variant-numeric:tabular-nums}
.floor-navigation .source-floor{font-size:14px;font-weight:600;font-variant-numeric:tabular-nums;opacity:1;color:#594668}
.floor-navigation .parking-choice{font-size:14px;font-weight:600;line-height:1.6}
.floor-navigation .catalogue-link{font-size:13px;font-weight:600;line-height:1.6;color:var(--purple)}
/* Stronger text for the apartment search and its explanatory notes. */
.filters .property-tabs{font-size:14px;font-weight:600;line-height:1.6}
.filters .property-tabs a{color:#594668}
.filters .property-tabs a.active{color:var(--purple);border-bottom-width:2px}
.filters .filter-row label{font-size:13px;font-weight:600;line-height:1.6;color:var(--purple)}
.filters .filter-row select,.filters .filter-row input{font-size:16px;font-weight:600;color:var(--purple)}
.filters .filter-row input::placeholder{color:#594668;opacity:1;font-weight:500}
.filters .reset,.filters .filter-bottom,.filters .check-label{font-size:13px;font-weight:600;line-height:1.6;color:var(--purple)}
.structure-art .mapping-note{font-family:var(--sans);font-size:13px;font-weight:500;line-height:1.8;color:#594668}
.listing .availability-note{font-size:14px;font-weight:600;line-height:1.9;color:#59412f}
.floor-navigation .source-floor{font-size:11px;line-height:1.5;max-width:110px;text-align:right}
.floor-choice[data-plan-available="false"] .floor-type i{background:#9b8aa9}
.floor-plan-pending{padding:clamp(24px,4vw,40px);margin-top:18px;border:1px solid var(--line);border-radius:14px;background:#f8f3fb}
.floor-plan-pending h2{font-size:clamp(24px,3vw,34px);margin-block:18px}
.floor-plan-pending p{font-family:var(--sans);font-size:15px;line-height:1.8;color:#594668}
.floor-plan-pending .btn{margin-top:24px}
/* Restore the complete hero overlay while using video, never a still-image background. */
.hero.hero-video-background{background:#2b1b38}
.hero.hero-video-background .hero-film{opacity:1;transition:none;pointer-events:none}
/* Draw button arrows as vectors so phones never substitute emoji artwork. */
.direction-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 18px;width:18px;height:18px;line-height:1;vertical-align:middle}
.direction-icon svg{display:block;width:18px;height:18px;flex:none}
