/* V4 funnel: status sticker, soft gates, payment calculator. */
/* status sticker */
.status-sticker{display:inline-flex;align-items:stretch;flex-wrap:wrap;justify-content:center;margin:0 0 22px;background:rgba(255,253,248,.94);color:var(--ink);font-size:12px;box-shadow:0 10px 30px rgba(0,0,0,.18);border-radius:999px;overflow:hidden}
.status-sticker>span{display:flex;align-items:center;gap:8px;padding:9px 16px;border-left:1px solid var(--line)}
.status-sticker>span:first-child{border-left:0}
.status-sticker .live{background:#1f2a24;color:#fff;font-weight:600;letter-spacing:.6px;text-transform:uppercase;font-size:11px}
.status-sticker .live i{width:8px;height:8px;border-radius:50%;background:#3ddc84;box-shadow:0 0 0 0 rgba(61,220,132,.7);animation:pulse 1.8s infinite}
.status-sticker>span:nth-child(2){font-weight:600;color:var(--brown)}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(61,220,132,.7)}70%{box-shadow:0 0 0 9px rgba(61,220,132,0)}100%{box-shadow:0 0 0 0 rgba(61,220,132,0)}}
@media(prefers-reduced-motion:reduce){.status-sticker .live i{animation:none}}
@media(max-width:760px){.status-sticker{border-radius:14px;font-size:11px}.status-sticker .extra{display:none}.status-sticker>span{padding:8px 12px}}
.local-preview-flag a{color:#e2d6bd;text-decoration:underline}

/* soft gates */
.gate-val .masked{filter:blur(5px);user-select:none;display:inline-block}
body.unlocked .gate-val .masked{filter:none}
.unit-price{margin:0;text-align:right;font:400 22px/1.1 var(--serif);color:var(--brown)}
.unit-price small{display:flex;align-items:center;justify-content:flex-end;gap:5px;font:11px/1.4 var(--sans);color:#5d5e55;letter-spacing:.4px}
.unit-price .lock{width:12px;height:12px;color:var(--brown)}
a.unit-price.locked{display:grid;justify-items:end;gap:2px;border:1px dashed #bda988;padding:8px 12px;background:rgba(255,253,248,.6)}
a.unit-price.locked em{font:600 11px var(--sans);font-style:normal;color:var(--brown);text-decoration:underline;text-underline-offset:3px}
a.unit-price.locked:hover{border-color:var(--brown);background:var(--paper)}
body.unlocked a.unit-price.locked{border-style:solid;border-color:transparent;background:none;padding:0}
body.unlocked a.unit-price.locked em,body.unlocked .unit-price .lock{display:none}

.pl4{border-top:1px solid var(--line)}
.gate-wrap{position:relative}
.gated-cell .masked{color:var(--brown)}
.gate-cta{position:absolute;right:24px;bottom:24px;max-width:420px;background:var(--dark);color:#f1ece3;padding:22px 24px;display:grid;gap:14px;box-shadow:0 20px 50px rgba(20,24,21,.3)}
.gate-cta p{display:grid;grid-template-columns:20px 1fr;gap:2px 10px;margin:0;color:#cfd0c6;font-size:13px}
.gate-cta p .lock{width:18px;height:18px;color:#e2d6bd;grid-row:1/3;margin-top:2px}
.gate-cta b{font:400 22px/1.2 var(--serif);color:#f6f1e7}
.gate-cta .button{background:#f1ece3;border-color:#f1ece3;color:var(--dark);justify-content:center}
body.unlocked .gate-cta{display:none}
@media(max-width:900px){.gate-cta{position:static;max-width:none;margin-top:14px}}

/* payment calculator */
.calc{background:var(--dark);color:#f1ece3;padding:clamp(24px,4vw,48px);display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:24px 48px}
.calc .chip{background:rgba(241,236,227,.1);color:#e2d6bd}
.calc h3{color:#f6f1e7;font-size:clamp(28px,2.6vw,38px);margin-bottom:10px}
.calc-head p:not(.chip){color:#cfd0c6;font-size:14px}
.calc-homes{display:flex;flex-wrap:wrap;gap:8px;align-content:start;grid-column:1;grid-row:2}
.calc-home{padding:11px 14px;border:1px solid rgba(241,236,227,.35);background:transparent;color:#f1ece3;font-size:13px;text-align:left}
.calc-home:hover{border-color:#f1ece3}
.calc-home[aria-pressed=true]{background:#f1ece3;color:var(--dark);border-color:#f1ece3}
.calc-stage{grid-column:2;grid-row:1/4;background:#1c2420;border:1px solid rgba(241,236,227,.12);padding:24px;min-height:360px;position:relative}
.calc-idle{display:grid;place-items:center;height:100%;min-height:300px;color:#9ea195;font-size:14px}
.calc-idle p{color:#9ea195}
.calc-loading{display:grid;align-content:center;gap:14px;min-height:300px}
.calc-loading p{color:#cfd0c6;font-size:13px;letter-spacing:.6px;text-transform:uppercase}
.calc-bar{height:6px;background:rgba(241,236,227,.12);overflow:hidden}
.calc-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#c9b48f,#f1ece3)}
.calc-loading.run .calc-bar i{animation:fill 1.3s cubic-bezier(.3,.7,.3,1) forwards}
@keyframes fill{to{width:100%}}
.calc-count{font:400 42px/1 var(--serif)!important;color:#f6f1e7!important;text-transform:none!important;letter-spacing:-.5px!important}
.calc-sum{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-bottom:1px solid rgba(241,236,227,.15);padding-bottom:12px;margin-bottom:6px}
.calc-name{font:400 22px var(--serif);color:#f6f1e7}
.calc-total{font-size:12px;color:#cfd0c6;text-align:right}
.calc-rows{list-style:none;margin:0;padding:0}
.calc-rows li{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:baseline;padding:11px 0;border-bottom:1px solid rgba(241,236,227,.08);font-size:13px;color:#cfd0c6;opacity:0;transform:translateY(6px);animation:rowin .35s forwards}
.calc-rows li b{font:400 20px var(--serif);color:#e2d6bd}
.calc-rows li .amt{font:400 18px var(--serif);color:#f6f1e7;text-align:right}
.calc-rows li small{display:block;font-size:11px;color:#9ea195}
.calc-rows li.gated .amt,.calc-rows li.gated small{filter:blur(6px);user-select:none}
body.unlocked .calc-rows li.gated .amt,body.unlocked .calc-rows li.gated small{filter:none}
@keyframes rowin{to{opacity:1;transform:none}}
.calc-lock{position:absolute;left:24px;right:24px;bottom:24px;background:rgba(28,36,32,.92);backdrop-filter:blur(2px);border:1px solid rgba(241,236,227,.18);padding:18px;display:grid;gap:12px}
.calc-lock p{display:grid;grid-template-columns:20px 1fr;gap:2px 10px;margin:0;font-size:12px;color:#cfd0c6}
.calc-lock .lock{width:18px;height:18px;color:#e2d6bd;grid-row:1/3}
.calc-lock b{font:400 20px var(--serif);color:#f6f1e7}
.calc-lock .button{background:#f1ece3;border-color:#f1ece3;color:var(--dark);justify-content:center}
body.unlocked .calc-lock{display:none}
.calc-note{grid-column:1;grid-row:3;align-self:end;font-size:12px;color:#9ea195!important}
@media(prefers-reduced-motion:reduce){.calc-rows li{animation:none;opacity:1;transform:none}.calc-loading.run .calc-bar i{animation-duration:.01s}}
@media(max-width:900px){
 .calc{grid-template-columns:1fr}
 .calc-homes,.calc-stage,.calc-note{grid-column:1;grid-row:auto}
 .calc-stage{min-height:0;padding:18px}
 .calc-lock{position:static;margin-top:14px}
}
.calc-count.scramble{filter:blur(2px)}
.calc{grid-template-rows:auto auto 1fr}.calc-homes{align-self:start}.unit-foot{align-items:flex-end}
@media(max-width:900px){.calc-homes{display:grid;grid-template-columns:1fr 1fr}.calc-home{font-size:12px;padding:10px}.calc-rows li{grid-template-columns:42px 1fr auto;gap:10px}.calc-rows li b{font-size:17px}.calc-rows li .amt{font-size:15px}.calc-name{font-size:19px}}
/* clickable affordances */
a.clickable{color:inherit;text-decoration:none;cursor:pointer;transition:transform .25s,box-shadow .25s,border-color .25s,background .25s}
a.clickable:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(40,30,15,.12)}
a.clickable:focus-visible{outline:3px solid #94713c;outline-offset:3px}
[data-card]{cursor:pointer}
.more{display:inline-flex;gap:6px;align-items:center;margin-top:12px;font-size:12px;letter-spacing:.3px;color:var(--brown);border-bottom:1px solid currentColor;padding-bottom:2px;width:max-content}
.dark-band .more,.plots .more{color:#e2d6bd}
a.clickable .more i,a.clickable .go{transition:transform .25s}
a.clickable:hover .more i{transform:translateX(4px)}
a.clickable:hover .go{transform:translate(3px,-3px)}
/* fact panel rows */
.fact-panel>a.fact{display:block;padding:34px clamp(24px,4vw,64px);border-bottom:1px solid #d6cab4;position:relative}
.fact-panel>a.fact:last-child{border-bottom:0}
.fact-panel>a.fact:hover{background:#efe7da;transform:none;box-shadow:none}
.fact-panel>a.fact:after{content:'→';position:absolute;right:clamp(24px,4vw,64px);top:50%;transform:translateY(-50%);color:var(--brown);font-size:20px;transition:transform .25s}
.fact-panel>a.fact:hover:after{transform:translate(5px,-50%)}
.fact-panel .dt{display:block;font-size:12px;letter-spacing:.6px;color:var(--ink);margin-bottom:6px}
.fact-panel .dd strong{display:block;font:400 clamp(36px,3.6vw,54px)/1.05 var(--serif);color:var(--brown);letter-spacing:-.5px}
.fact-panel .dd small{display:block;font-size:12px;color:#5d5e55;margin-top:8px}
@media(max-width:760px){.fact-panel>a.fact{padding:22px}}
/* hero chips */
.hero-chips a.hchip{font-size:12px;padding:7px 12px;border:1px solid rgba(255,255,255,.45);background:rgba(20,24,21,.25);color:#fff;backdrop-filter:blur(6px)}
.hero-chips a.hchip:hover{background:rgba(255,253,248,.92);color:var(--ink);box-shadow:none}
/* gallery + features */
.gal3 .track li{position:relative}
.gal3 a.gal-item{display:block;position:relative;width:100%;height:100%;overflow:hidden}
.gal3 a.gal-item:hover{transform:none;box-shadow:none}
.gal3 a.gal-item img{transition:transform .6s}
.gal3 a.gal-item:hover img{transform:scale(1.04)}
.gal3 a.gal-item p{position:absolute;left:16px;bottom:14px;font-size:11px;letter-spacing:1.4px;text-transform:uppercase;color:#fff;background:rgba(20,24,21,.45);padding:6px 10px;margin:0}
.gal3 .go{position:absolute;right:14px;top:14px;width:38px;height:38px;border-radius:50%;background:rgba(255,253,248,.9);color:var(--ink);display:grid;place-items:center;font-size:15px}
.feat3 a.feat-item{display:flex;flex-direction:column;gap:14px;height:100%}
.feat3 a.feat-item:hover{transform:translateY(-4px);box-shadow:none}
.feat3 a.feat-item img{aspect-ratio:16/10;height:auto;width:100%;object-fit:cover}
.feat3 a.feat-item h3{font-size:26px;margin-top:6px;color:#f6f1e7}
.feat3 a.feat-item p{font-size:14px;color:#cfd0c6}
/* media links */
a.media-link{display:block;position:relative;height:100%}
a.media-link:hover{transform:none;box-shadow:none}
a.media-link img{transition:transform .8s}
a.media-link:hover img{transform:scale(1.02)}
.split-media>a.media-link{position:absolute;inset:0}
.split-media>a.media-link img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.masterplan-map a.media-link .zoom{position:absolute;right:16px;bottom:16px;background:var(--dark);color:#f1ece3;font-size:12px;padding:10px 14px}
a.covers-link{position:absolute;inset:0;display:block}
a.covers-link:hover{transform:none;box-shadow:none}
a.covers-link:hover .cover.c1{transform:translate(-6%,4%) rotate(-3deg)}
/* drive strip, chips, amenities, plots, dev */
.drive-strip li{padding:0}
.drive-strip a.drive{display:grid;gap:4px;padding:18px 14px;height:100%}
.drive-strip a.drive:hover{background:#efe7da;transform:none;box-shadow:none}
.experience-list li{padding:0;border:0;background:none}
.experience-list a.exp{display:block;font-size:12px;border:1px solid var(--line);padding:7px 12px;background:var(--paper)}
.experience-list a.exp:hover{border-color:var(--brown);transform:none;box-shadow:none}
a.am{display:flex;gap:16px;background:var(--paper);padding:24px;position:relative}
a.am .go{position:absolute;right:16px;top:14px;font-style:normal;color:var(--brown);opacity:.5}
a.am:hover .go{opacity:1}
a.plot-card{display:block;border:1px solid rgba(241,236,227,.28);padding:26px;color:#f1ece3}
a.plot-card:hover{border-color:#f1ece3;background:rgba(241,236,227,.05);box-shadow:none}
a.dev-card{display:block;background:var(--sand);padding:26px}
.price-table a.row-link{color:inherit;text-decoration:none;font:inherit}
.price-table tr[data-card]:hover{background:#f6efe3}
.unit[data-card]{transition:transform .25s,box-shadow .25s}
.unit[data-card]:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(40,30,15,.12)}
@media(prefers-reduced-motion:reduce){a.clickable,a.clickable img,.unit[data-card]{transition:none!important;transform:none!important}}
.dock-enquire.swap{animation:swapin .35s}@keyframes swapin{from{opacity:.2;transform:translateY(4px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.dock-enquire.swap{animation:none}}
/* ===== Round 1 QA fixes (critique 08, CTO 11, copy 09, sales 10) ===== */
/* 12px minimum + contrast */
.eyebrow,.chip,.spec-card .eyebrow,.unit-body .eyebrow,.plot-card .eyebrow,.price-table thead th,.keyfacts dt{font-size:12px!important}
.unit-price small,.calc-total,.calc-note,.calc-rows li small,.drive-strip span,.footnote,.fact-panel .dd small,.am p,.unit-meta{font-size:12px!important}
.am3 p,.faq p,.contact3 p,.am p,.dev-card p,body.v3 .faq details p,.band-head.row>p{color:#4f5048!important}
/* tap targets */
.hero-chips a.hchip,.experience-list a.exp,.calc-home,.pill,.section-link-index a,.text-link{min-height:44px;display:inline-flex;align-items:center}
.price-table a.row-link{display:inline-flex;min-height:44px;align-items:center}
/* hover only where hover exists */
@media(hover:none){a.clickable:hover,.unit[data-card]:hover{transform:none!important;box-shadow:none!important}}
/* price list: unlock box below the table, basis line */
.gate-cta{position:static!important;max-width:none!important;margin-top:16px;grid-template-columns:1fr auto;align-items:center;box-shadow:none}
@media(max-width:760px){.gate-cta{grid-template-columns:1fr}}
.price-basis{font-size:13px;color:var(--ink);margin:12px 0 0}
.row-meta{display:none}
@media(max-width:760px){.row-meta{display:block;font:12px/1.4 var(--sans);color:#4f5048;margin-top:2px}}
/* calculator: lock box under rows, masked amounts */
.calc-lock{position:static!important;margin-top:14px}
.calc-rows li .amt .masked{filter:blur(4px);user-select:none}
.calc-result.is-open .calc-lock{display:none}
.hero-money{color:#f1ece3;font-size:13px;letter-spacing:.4px;margin-top:10px}
.pay-safety{font-size:13px;color:var(--ink);border-left:2px solid var(--brown);padding:8px 12px;background:var(--sand);margin-top:18px;max-width:520px}
.plot-plan{color:#e3e5dc;font-size:14px;margin:0}
.button.ghost-light{background:transparent;border:1px solid rgba(241,236,227,.6);color:#f1ece3}
.plot-build .cta-row{grid-column:1;margin-top:6px}
/* one dark tone */
.dark-band,.sales-band,.calc{background:#26302b}
/* masterplan header */
.masterplan .masterplan-head{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:12px clamp(40px,6vw,96px);align-items:end}
.masterplan .masterplan-head .chip{grid-column:1/-1;justify-self:start;margin:0}
@media(max-width:760px){.masterplan .masterplan-head{grid-template-columns:1fr}}
/* schools card + lang/privacy notes */
a.life-card{display:inline-grid;grid-template-columns:auto auto;gap:2px 14px;align-items:center;text-align:left;background:var(--sand);padding:16px 20px;margin-top:14px}
a.life-card b{font:400 20px var(--serif);color:var(--brown)}
a.life-card span{grid-column:1;font-size:13px;color:#4f5048}
a.life-card i{grid-row:1/3;grid-column:2;font-style:normal;color:var(--brown)}
.lang-note,.privacy-note{font-size:13px!important;color:#4f5048!important;margin:12px 0}
/* dialog: hide duplicated header title visually (kept for aria-labelledby) */
#enquiry-dialog .dialog-header #enquiry-dialog-title{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
/* fuller nav (JEV nav_coverage) */
#site-header.v3 nav{gap:20px;font-size:12.5px}
@media(max-width:1320px){#site-header.v3 nav{gap:14px;font-size:12px}#site-header.v3 .brand img{width:120px}}
/* 1 Oct 2026 (Fares): larger header nav + header buttons */
#site-header.v3 nav{gap:24px;font-size:15px}
#site-header.v3 .header-btn,#site-header.v3 .header-btn span{font-size:14px!important}
@media(max-width:1560px){#site-header.v3 nav{gap:18px;font-size:14px}}
@media(max-width:1380px){#site-header.v3 nav{gap:14px;font-size:13.5px}#site-header.v3 .brand img{width:120px}}
/* 1 Oct 2026 (Fares): no divider lines between sections */
main>.pay3,main>#masterplan,main>#faq{border-top:0!important}
/* 1 Oct 2026 (Fares): calculator on a light surface so it doesn't merge with the dark schedule panel above and the dark gallery below; even 96px rhythm */
.pay3 .calc{background:var(--sand)!important;color:var(--ink)}
.pay3 .calc .chip{background:var(--paper);color:var(--brown)}
.pay3 .calc h3{color:var(--brown)!important}
.pay3 .calc-head p:not(.chip){color:var(--ink)}
.pay3 .calc-home{border-color:#b9ad98;color:var(--ink);background:var(--paper)}
.pay3 .calc-home:hover{border-color:var(--brown)}
.pay3 .calc-home[aria-pressed=true]{background:var(--brown);border-color:var(--brown);color:#fffdf8}
.pay3 .calc-stage{background:var(--paper);border-color:var(--line)}
.pay3 .calc-idle,.pay3 .calc-idle p,.pay3 .calc-loading p{color:var(--muted)}
.pay3 .calc-bar{background:#e4dccd}.pay3 .calc-bar i{background:linear-gradient(90deg,#c9b48f,var(--brown))}
.pay3 .calc-count{color:var(--brown)!important}
.pay3 .calc-sum{border-bottom-color:var(--line)}
.pay3 .calc-name{color:var(--brown)}
.pay3 .calc-total{color:var(--muted)}
.pay3 .calc-rows li{border-bottom-color:#ece5d8;color:var(--ink)}
.pay3 .calc-rows li b{color:var(--brown)}
.pay3 .calc-rows li .amt{color:var(--ink)}
.pay3 .calc-rows li small{color:var(--muted)}
.pay3 .calc-lock{background:var(--sand);border-color:var(--line)}
.pay3 .calc-lock p{color:var(--ink)}
.pay3 .calc-lock .lock{color:var(--brown)}
.pay3 .calc-lock b{color:var(--brown)}
.pay3 .calc-lock .button{background:var(--brown);border-color:var(--brown);color:#fffdf8}
/* gallery: brochure CTA on the same row as the arrows (no empty band) */
.car-nav.with-cta{align-items:center;margin-top:24px}.car-nav.with-cta>.button{margin-right:auto}

/* ===== Spacing system (framework rule, Fares 1 Oct 2026) =====
   One vertical rhythm: --rhythm between every block (96px desktop / 56px mobile), --rhythm-sm inside bands (48/32).
   Sections on the same surface never stack two paddings; bleed media may touch section edges (0).
   Verified by qa/spacing-audit.js before every deploy. */
:root{--rhythm:96px;--rhythm-sm:48px}
@media(max-width:760px){:root{--rhythm:56px;--rhythm-sm:32px}}
#prices{padding-bottom:var(--rhythm)!important}
.pay3 .schedule{padding-top:var(--rhythm)!important;padding-bottom:var(--rhythm)!important}
.pay3 .calc{margin:0!important}
.loc3 .loc-figure>.media-link{height:auto!important}
.loc3>.band-foot{padding-top:var(--rhythm-sm)!important;padding-bottom:var(--rhythm-sm)!important}
.sales-band{padding-top:var(--rhythm)!important;padding-bottom:var(--rhythm)!important}
#about+#faq{padding-top:0!important}
/* ===== Type scale (framework rule, Fares 1 Oct 2026) =====
   One size per role, everywhere on the page. Lead form card keeps the live form styling.
   h1 hero display · h2 section title (shared clamp) · h3-lead sub-section title (calculator) · h3 card title 26/22
   intro 16 (paragraph under a section title) · card text 14 · meta/eyebrow/chip 12 · button 15 · choice chips 14 */
:root{--fs-h3:26px;--fs-intro:16px;--fs-card:14px;--fs-meta:12px;--fs-btn:15px;--fs-choice:14px}
@media(max-width:760px){:root{--fs-h3:22px;--fs-card:14px}}
main section h2:not(.enquiry-card h2),.sales-band h2{font-size:clamp(34px,3.5vw,52px)!important}
main section h3:not(.calc h3):not(.enquiry-card h3){font-size:var(--fs-h3)!important}
.band-head p:not(.chip):not(.eyebrow),.band-head .dev-intro>p,.prices-head>p,.plots-intro>p:not(.chip),.masterplan-head>p:not(.chip),.sales-band p:not(.chip),.ov3-text>p:not(.chip),.split-text>p:not(.chip):not(.eyebrow){font-size:var(--fs-intro)!important}
.feat-txt p,.dev-card p,.am p,.calc-head p:not(.chip),.plot-card p:not(.eyebrow),.plot-plan{font-size:var(--fs-card)!important}
main .button:not(.header-btn):not(.enquiry-card .button),.car-nav.with-cta>.button{font-size:var(--fs-btn)!important}
.calc-home{font-size:var(--fs-choice)!important}
/* Header: links never wrap; small laptops/tablets (761–1100px) use the Menu button like mobile */
#site-header.v3 nav a{white-space:nowrap}
@media(min-width:761px) and (max-width:1100px){
 #site-header .menu-toggle{display:flex;align-items:center;gap:12px;padding:10px 12px;background:transparent;border:1px solid var(--line);color:var(--brown);font-size:14px;min-height:44px;margin-left:auto}
 #site-header.v3 nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--paper);padding:12px var(--gutter) 20px;box-shadow:0 10px 18px #25302018;border-bottom:1px solid var(--line);max-height:75dvh;overflow:auto;font-size:16px}
 #site-header.v3 nav.open{display:flex;flex-direction:column;gap:0}
 #site-header.v3 nav a{padding:14px 0;border-bottom:1px solid var(--line)}
}
/* RULEBOOK lint fixes (3 Oct 2026): LAY-03 spacing + LAY-04 type roles */
.plots-intro>.chip:first-child{margin-top:0!important}
#faq details:last-of-type{margin-bottom:0!important}
.plot-plan{font-size:var(--fs-intro)!important}
#site-header.v3 .header-btn,#site-header.v3 .header-btn span{font-size:var(--fs-btn)!important}
.car-nav button{font-size:var(--fs-btn)!important}
/* ===== OP-04 Ask an adviser (Passo bxb pattern, Bay palette) ===== */
.bxb{max-width:none;background:var(--sand);padding:var(--rhythm) var(--gutter)}
.bxb .band-head{max-width:1296px;margin:0 auto var(--rhythm-sm)}
.bxb-wrap{max-width:1296px;margin:0 auto}
.bxb-switch{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--brown);margin:0;padding:0;min-inline-size:0;background:var(--paper)}
.bxb-switch label{position:relative;display:flex;align-items:center;justify-content:center;min-height:60px;padding:12px 16px;cursor:pointer;margin:0;font-size:var(--fs-btn);color:var(--brown);transition:background .25s,color .25s}
.bxb-switch label+label{border-left:1px solid var(--brown)}
.bxb-switch input{position:absolute;opacity:0;pointer-events:none}
.bxb-switch label:has(input:checked){background:var(--brown);color:#fffdf8}
.bxb-switch label:has(input:focus-visible){outline:2px solid var(--brown);outline-offset:-5px}
.bxb-panel{display:grid;grid-template-columns:6fr 5fr;background:var(--paper);border:1px solid var(--line);border-top:0}
.bxb-media{position:relative;min-height:520px;overflow:hidden;background:#e5ddcf}
.bxb-media picture{position:absolute!important;inset:0;margin:0;opacity:0;transition:opacity .6s ease}
.bxb-media picture.on{opacity:1}
.bxb-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.bxb-body{padding:48px 48px 44px;display:flex;flex-direction:column}
.bxb-body h3{line-height:1.18;color:var(--brown);margin:0 0 10px;font-weight:400}
.bxb-lede{font-size:var(--fs-intro)!important;line-height:1.6;color:var(--muted);margin:0 0 24px}
.bxb-qs{list-style:none;margin:0 0 28px;padding:0;display:grid;gap:10px}
.bxb-qs label{display:grid;grid-template-columns:22px 1fr;gap:14px;align-items:start;padding:14px 16px;background:#f6f1e7;border:1px solid transparent;cursor:pointer;font-size:var(--fs-btn);line-height:1.45;color:var(--ink);transition:border-color .2s,background .2s}
.bxb-qs label:hover{border-color:#c9bfa9}
.bxb-qs input{appearance:none;-webkit-appearance:none;width:20px;height:20px;margin:1px 0 0;border:1px solid var(--brown);background:#fff;display:grid;place-content:center;cursor:pointer}
.bxb-qs input:checked{background:var(--brown)}
.bxb-qs input:checked:after{content:'';width:10px;height:6px;border:solid #fffdf8;border-width:0 0 2px 2px;transform:translateY(-1px) rotate(-45deg)}
.bxb-qs input:focus-visible{outline:2px solid var(--brown);outline-offset:2px}
.bxb-qs label:has(input:checked){background:#efe6d6;border-color:#c9b48f}
.bxb-set[hidden]{display:none}
.bxb-cta{margin-top:auto;width:100%;justify-content:center;display:flex;align-items:center}
@media(max-width:900px){
 .bxb-panel{grid-template-columns:1fr}
 .bxb-media{min-height:0;aspect-ratio:16/10}
 .bxb-body{padding:28px 20px 24px}
 .bxb-switch label{min-height:52px;padding:10px 8px}
 .bxb-qs label{padding:12px 14px;gap:12px}
}
.bxb .bxb-cta{background:var(--brown)!important;border-color:var(--brown)!important;color:#fffdf8!important}
.bxb .bxb-cta:hover{background:#5f451f!important}
/* LAY-09 (RULEBOOK 3 Oct 2026): no visible text under 13px outside the footer, form fine print and masked values.
   The meta/eyebrow/chip role moves from 12px to 13px; the lead form card keeps its live styling. */
:root{--fs-meta:13px}
main :is(.chip,.eyebrow,small,.more,.more i,.dt,.zoom,.zoom i,dt,th,.row-meta,.exp,.drive span,.gal-item p,.hchip,.calc-total,.calc-lock p span,.unit-meta span,.unit-title span,.unit-price em):not(.enquiry-card *),
.hero-overlay :is(h1 span,.status-sticker span),.hero-gallery-bar span{font-size:var(--fs-meta)!important}
.enquiry-card>.eyebrow{font-size:var(--fs-meta)!important}
/* status sticker on very narrow phones: the two parts stack cleanly (no divider, full-width live part) */
@media(max-width:360px){.status-sticker{flex-direction:column;align-items:stretch;overflow:hidden}.status-sticker>span{justify-content:center;border-left:0}}
