/* One shared content grid. Backgrounds may bleed; content edges always align. */
body.composition-site{--nf-page-gutter:clamp(22px,5vw,160px);--nf-page-width:min(2400px,calc(100% - var(--nf-page-gutter)*2));--nf-grid-gap:clamp(22px,2vw,48px);--nf-tone-heading:#2D2B29;--nf-tone-body:#726A61;--nf-tone-label:#65584D}
body.composition-site main>:is(#key-parameters,#about,#architecture,#gallery,#location,#amenities,#lots,#payment,#investment,#brochure,#developer,#purchase,#faq,#related){width:var(--nf-page-width);max-width:none;margin-inline:auto}
body.composition-site :is(#key-parameters>.nf-block,#about>.variant,#architecture>.block,#gallery>.design,#location>.nfblock,#amenities>.block,#lots>.stage,#payment>.stage,#investment>.block,#brochure>.cta-section,#developer>.nfblock,#purchase>.stage,#faq>.stage,#related>.related){width:100%;max-width:none;margin-inline:0;padding-inline:0!important}
body.composition-site :is(#key-parameters>.nf-block,#about>.variant,#architecture>.block,#amenities>.block,#lots>.stage,#investment>.block,#brochure>.cta-section,#related>.related){padding-block:0}
body.composition-site #about .v2-inner{padding-inline:0}
body.composition-site #payment :is(.mock,.p5),body.composition-site #purchase :is(.canvas,.v02){width:100%;max-width:none;padding-inline:0!important;padding-block:0}
body.composition-site #developer .v01{column-gap:var(--nf-grid-gap);grid-template-columns:minmax(0,.39fr) minmax(0,.61fr)}
body.composition-site #developer .v01 :is(.left,.right){padding-inline:0;padding-block:0}
body.composition-site #developer .v01 .right{gap:18px}
body.composition-site #footer{background:#2D2B29}
body.composition-site #footer>.nf-footer{width:var(--nf-page-width);max-width:none;margin-inline:auto;padding-inline:0;background:#2D2B29}
body.composition-site #site-header .header-inner{width:var(--nf-page-width);max-width:none;margin-inline:auto;padding-inline:0}
body.composition-site #hero .hero-inner{width:var(--nf-page-width);max-width:none;margin-inline:auto;padding-inline:0}
body.composition-site #hero .hero-facts{width:var(--nf-page-width);left:50%;right:auto;transform:translateX(-50%)}
/* Remove the now-empty side columns alongside section titles. */
body.composition-site #key-parameters .top,body.composition-site #amenities .v03-top,body.composition-site #lots .v2top,body.composition-site #payment .p5-top,body.composition-site #investment .v5-head,body.composition-site #brochure .q-top,body.composition-site #purchase .purchase-intro{display:block;grid-template-columns:1fr}
body.composition-site #architecture .b3-main{grid-template-columns:minmax(0,1.05fr) minmax(0,1.12fr) minmax(0,.85fr);gap:var(--nf-grid-gap)}
body.composition-site #architecture .b3-copy{padding-top:0}
/* Shared hierarchy, casing and palette; inverse contexts are explicit. */
body.composition-site :is(#hero,#about .v2-overlay,#gallery .shot,#amenities .tile-copy,#purchase .side-box,#faq .v2overlay,#footer .nf-footer){--nf-tone-heading:#F7F5F1;--nf-tone-body:#EBE8E1;--nf-tone-label:#F7F5F1}
body.composition-site :is(.photo-caption,.flag){--nf-tone-body:#F7F5F1}
body.composition-site :is(.btn-primary,.standard-btn,.header-cta){--nf-tone-heading:#F7F5F1}
body.composition-site #hero .btn-primary{--nf-tone-heading:#2D2B29}
body.composition-site :is(#site-header,#mobile-menu,#hero,#key-parameters,#about,#architecture,#gallery,#location,#amenities,#lots,#payment,#investment,#brochure,#developer,#purchase,#faq,#related,#cta,#expert-cta,#footer) [data-nf-type]{text-transform:none!important}
body.composition-site :is(#site-header,#mobile-menu,#hero,#key-parameters,#about,#architecture,#gallery,#location,#amenities,#lots,#payment,#investment,#brochure,#developer,#purchase,#faq,#related,#cta,#expert-cta,#footer) :is([data-nf-type=section],[data-nf-type=subheading],[data-nf-type=card],[data-nf-type=statement],[data-nf-type=value],[data-nf-type=metric],[data-nf-type=total],[data-nf-type=currency],[data-nf-type=ui],[data-nf-type=emphasis]){color:var(--nf-tone-heading)!important}
body.composition-site :is(#hero,#key-parameters,#about,#architecture,#gallery,#location,#amenities,#lots,#payment,#investment,#brochure,#developer,#purchase,#faq,#related,#cta,#expert-cta,#footer) :is([data-nf-type=body],[data-nf-type=compact],[data-nf-type=caption],[data-nf-type=note]){color:var(--nf-tone-body)!important}
body.composition-site :is(#hero,#key-parameters,#about,#architecture,#gallery,#location,#amenities,#lots,#payment,#investment,#brochure,#developer,#purchase,#faq,#related,#cta,#expert-cta,#footer) [data-nf-type=eyebrow]{color:var(--nf-tone-label)!important;text-transform:uppercase!important}
body.composition-site :is(#key-parameters,#about,#architecture,#gallery,#location,#amenities,#lots,#payment,#investment,#brochure,#developer,#purchase,#faq,#related) [data-nf-type=section]{margin-block:16px 24px!important}
body.composition-site :is(#about,#architecture,#developer,#purchase,#related) [data-nf-type=subheading]{margin-block:0 12px!important}
body.composition-site :is(#about,#architecture,#developer,#purchase,#related) [data-nf-type=card]{margin-block:0 8px!important}
body.composition-site #footer .v3-mark{font-size:clamp(44px,10.2vw,320px)}
@media(min-width:1920px){
 body.composition-site{--header-height:96px;--nf-type-project:112px}
 body.composition-site #hero{min-height:clamp(900px,100svh,1440px)}
 body.composition-site #hero .hero-copy{max-width:min(100%,1440px)}
 body.composition-site #hero h1{font-size:var(--nf-type-project);max-width:none}
 body.composition-site #hero .hero-description{max-width:48ch}
 body.composition-site #site-header .brand-name{font-size:calc(var(--nf-type-ui)*2)}
 body.composition-site #site-header .brand-caption{font-size:calc(var(--nf-type-ui)*.62)}
 body.composition-site #site-header .header-actions{gap:12px}
 body.composition-site #site-header .header-cta{padding-inline:22px;min-height:52px}
}
@media(min-width:2560px){body.composition-site{--nf-type-project:136px;--header-height:104px}}
@media(min-width:3440px){body.composition-site{--nf-type-project:152px;--header-height:112px}}
@media(min-width:3840px){body.composition-site{--nf-type-project:160px}}
@media(max-width:900px){body.composition-site #architecture .b3-main{grid-template-columns:1fr}}
@media(max-width:750px){body.composition-site #developer .v01{grid-template-columns:1fr;row-gap:32px}}
body.composition-site #site-header:not(.is-filled){--nf-tone-heading:#F7F5F1}
body.composition-site #site-header:not(.is-filled) .header-cta{--nf-tone-heading:#2D2B29}
body.composition-site #architecture .b3-copy p{max-width:none}
body.composition-site :is(#lots .chip.active,#payment .p5-presets button.active,#payment .p5-presets button[aria-pressed=true],#investment .preset-button[aria-pressed=true]){--nf-tone-heading:#F7F5F1}
body.composition-site #investment .chart-tick{font-size:var(--nf-type-caption)}
body.composition-site #investment .chart-unit{font-size:calc(var(--nf-type-caption)*.8)}
body.composition-site #related .image-index{--nf-tone-body:#F7F5F1}
body.composition-site #lots .flag{--nf-tone-label:#F7F5F1}
/* Photo text participates in sizing instead of being clipped by a fixed-height panel. */
body.composition-site #about .v2-main{height:auto;min-height:clamp(340px,28vw,720px);display:grid;align-items:end}
body.composition-site #about .v2-main>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
body.composition-site #about .v2-overlay{position:relative;left:auto;bottom:auto;max-width:min(78%,1100px);padding:clamp(22px,4vw,64px)}
body.composition-site #about .v2-overlay h2{max-width:none}
@media(max-width:700px){body.composition-site #about .v2-overlay{max-width:100%}}
/* Long headings remain in flow in the gallery and FAQ photo panels as well. */
body.composition-site #gallery .v3 .shot{height:auto;min-height:clamp(560px,32vw,760px);display:grid;align-items:end;padding-top:76px}
body.composition-site #gallery .v3 .shot>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
body.composition-site #gallery .v3 .shadowinfo{position:relative;inset:auto;min-width:0;width:100%;padding:clamp(24px,3vw,48px)}
body.composition-site #faq .v2visual{display:grid;align-items:end;min-height:340px}
body.composition-site #faq .v2visual>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
body.composition-site #faq .v2overlay{position:relative;inset:auto;max-width:none;padding:clamp(24px,3vw,56px)}
body.composition-site #faq .v2overlay h2{max-width:none}
@media(max-width:700px){body.composition-site #gallery .v3 .shot{min-height:440px}}
body.composition-site #faq .v2visual{height:auto}
body.composition-site #faq .v2overlay{align-self:stretch}
body.composition-site #gallery .v3 .shadowinfo>div:first-child{flex:1;min-width:0}
body.composition-site #gallery .v3 .shadowinfo h2{overflow-wrap:anywhere}
body.composition-site #payment .p5-results{--nf-tone-heading:#F7F5F1;--nf-tone-body:#EBE8E1;--nf-tone-label:#F7F5F1}
body.composition-site #lots .flag{--nf-tone-label:#65584D}
body.composition-site #lots .v2 .unitCard .unit-plan>svg{max-height:none}
body.composition-site :is(#key-parameters,#about,#architecture,#gallery,#location,#amenities,#lots,#payment,#investment,#brochure,#developer,#purchase,#faq,#related) [data-nf-type=section]{max-width:none}
body.composition-site #payment .p5-top>div,body.composition-site #investment .v5-head>div,body.composition-site #brochure .q-top>div,body.composition-site #purchase .purchase-intro>div{max-width:none}
body.composition-site #brochure .q-form{align-items:start;grid-template-columns:minmax(180px,.24fr) minmax(0,1fr)}

/* Equal desktop modules; mobile district spans both columns, price closes the grid. */
body.composition-site #key-parameters .variant-04 .cards{grid-template-columns:repeat(5,minmax(0,1fr));grid-auto-rows:1fr;background:transparent;border:0}
body.composition-site #key-parameters .variant-04 .card:first-child{grid-column:auto;min-height:194px}
@container(max-width:600px){
 body.composition-site #key-parameters .variant-04 .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
 body.composition-site #key-parameters .variant-04 .card:first-child{grid-column:1 / -1;min-height:144px}
 body.composition-site #key-parameters .variant-04 .card:nth-child(2){grid-column:2;grid-row:3}
}
body.composition-site #key-parameters .variant-04 .card{outline:1px solid var(--nightfall-border);outline-offset:-1px}
/* Inverse controls on Lifestyle photos and its dark dialog close button. */
body.composition-site #amenities .tile-copy i{color:#F7F5F1;border-color:#F7F5F1}
body.composition-site #amenities .modal-close{--nf-tone-heading:#F7F5F1;color:#F7F5F1!important}
body.composition-site #amenities :is(.tile-copy i,.modal-close) svg{display:block;flex:none}
/* The photograph bleeds to all three edges; calculator controls keep their inset. */
body.composition-site #payment .p5-edit{--nf-payment-inset:36px;padding:0 0 28px}
body.composition-site #payment .p5-edit>div>*:not(.p5-img){margin-inline:var(--nf-payment-inset)}
body.composition-site #payment .p5-edit .p5-range{width:calc(100% - var(--nf-payment-inset)*2)}
body.composition-site #payment .p5-edit .p5-img{width:100%;height:clamp(174px,16vw,360px);margin:0 0 26px}
@media(max-width:1100px){body.composition-site #payment .p5-edit{--nf-payment-inset:22px}}
@media(max-width:750px){body.composition-site #payment .p5-edit{--nf-payment-inset:21px}}
/* A hairline belongs only to a section eyebrow immediately preceding an H2. */
body.composition-site :is(#hero,#key-parameters,#about,#architecture,#gallery,#location,#amenities,#lots,#payment,#investment,#brochure,#developer,#purchase,#faq,#related,#cta,#expert-cta,#footer) [data-nf-type=eyebrow]:has(+h2)::before{content:"";display:inline-block;width:36px;height:1px;background:currentColor;opacity:.55;vertical-align:middle;margin-right:14px;flex:0 0 36px}
body.composition-site #purchase .eyeline{gap:0}
body.composition-site #hero .hero-eyebrow .small-dot{display:none}
/* FAQ questions share the card-heading role; answers keep the body role. */
body.composition-site #faq .faq-answer p{max-width:none}

/* Wider shared margins on Full HD and above; smaller viewports keep their grid. */
@media(min-width:1920px){body.composition-site{--nf-page-gutter:clamp(144px,8vw,320px);--nf-page-width:min(2240px,calc(100% - var(--nf-page-gutter)*2))}}

/* Mobile section content follows the same page edges without nested gutters. */
@media(max-width:700px){
 body.composition-site #location .v05 .routes{padding-inline:0}
 body.composition-site #amenities .v03-top{margin-inline:0}
 body.composition-site #faq .v2content{padding-inline:0}
}

/* Interior heading and copy share the full width of the photo above. */
body.composition-site #architecture .b3-side{grid-template-columns:minmax(0,1fr)}
body.composition-site #architecture .b3-side>div:not(.photo){width:100%;min-width:0}
body.composition-site #architecture .b3-side :is(h3,p){max-width:none}

/* Keep the reset action in its original desktop column after removing the note. */
body.composition-site #investment .v5-foot>.standard-btn{grid-column:2}

body.composition-site #cta{width:var(--nf-page-width);max-width:none;margin-inline:auto}
body.composition-site #cta .cta{margin:0;padding:0}

/* Second CTA shares the assembled page edges and the site's type scale. */
body.composition-site #expert-cta{width:var(--nf-page-width);max-width:none;margin-inline:auto}
body.composition-site #expert-cta .v3{margin:0}
body.composition-site #expert-cta .expert-eyebrow::before{display:none}
body.composition-site #expert-cta .expert-eyebrow:has(+h2)::before{display:block}
body.composition-site #expert-cta .cta-btn{--nf-tone-heading:#F7F5F1;color:#F7F5F1!important}
body.composition-site #expert-cta .v3-photo .vertical-tag{--nf-tone-body:#F7F5F1}