/* V21 flagship demo refinement */
:root{--demo-ease:cubic-bezier(.22,.78,.18,1)}
body[data-showroom]{overflow-x:hidden}
body[data-showroom] .topbar{backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
body[data-showroom] .menu-btn{transition:transform .25s var(--demo-ease),background .25s ease}
body[data-showroom] .menu-btn:active{transform:scale(.96)}
body[data-showroom] img{display:block;max-width:100%;height:auto}
body[data-showroom] .btn,body[data-showroom] a{touch-action:manipulation}

/* Construction: one cinematic hero image, never tiled. */
.build-page .build-hero{position:relative;min-height:88svh;display:flex;align-items:flex-end;overflow:hidden;background:#12120f!important}
.build-page .build-hero .hero-image{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;background-image:linear-gradient(180deg,rgba(10,10,8,.06),rgba(10,10,8,.22) 44%,rgba(10,10,8,.78) 100%),url('../media/construction-finished-development.webp')!important;background-repeat:no-repeat!important;background-size:cover!important;background-position:center 52%!important;z-index:0!important}
.build-page .build-hero>.container{position:relative;z-index:2;width:100%;padding-bottom:clamp(52px,8vw,104px)}
.build-page .build-hero .hero-copy{max-width:780px;padding:clamp(24px,4vw,48px);border-radius:28px;background:linear-gradient(145deg,rgba(10,10,8,.64),rgba(10,10,8,.32));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 26px 80px rgba(0,0,0,.24)}
.build-page .build-hero .hero-copy *{color:#fffaf1!important;text-shadow:0 2px 18px rgba(0,0,0,.28)}
.build-page .build-hero .hero-number{color:rgba(255,255,255,.18)!important}

/* Cleaning: prevent editorial labels from breaking into vertical fragments. */
.clean-page .standards-grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)!important;gap:clamp(38px,7vw,100px)!important}
.clean-page .standard-list article{display:grid!important;grid-template-columns:minmax(160px,.36fr) minmax(0,1fr)!important;align-items:start!important;gap:22px!important;padding:30px 0!important}
.clean-page .standard-list h3{font-size:clamp(32px,4vw,56px)!important;line-height:.98!important;word-break:normal!important;overflow-wrap:normal!important;hyphens:none!important;white-space:normal!important}
.clean-page .standard-list p{font-size:clamp(17px,1.8vw,24px)!important;line-height:1.55!important}

/* Mila: cleaner crop + one cohesive editorial grade. */
.creator-page .creator-photo{background-position:center 32%!important;filter:saturate(.90) contrast(1.05) brightness(.91) sepia(.04)!important}
.creator-page .creator-hero{min-height:92svh!important}
.creator-page .media-wall img,.creator-page .creator-photo,.creator-page .image-stack img{filter:saturate(.90) contrast(1.045) brightness(.96) sepia(.035)!important}
.creator-page .media-wall .media{overflow:hidden;border-radius:24px}.creator-page .media-wall img{transition:transform .7s var(--demo-ease),filter .4s ease}.creator-page .media-wall .media:hover img{transform:scale(1.035)}

/* Universal flagship rhythm. */
body[data-showroom] .section{padding-block:clamp(78px,10vw,150px)!important}
body[data-showroom] .reveal{will-change:auto}
body[data-showroom] .navlinks a{position:relative}
body[data-showroom] .navlinks a::after{content:'';position:absolute;left:0;right:100%;bottom:-5px;height:1px;background:currentColor;transition:right .25s ease}body[data-showroom] .navlinks a:hover::after{right:0}
body[data-showroom] .service-row,body[data-showroom] .project-card,body[data-showroom] .package-card,body[data-showroom] .plan-card{transition:transform .35s var(--demo-ease),box-shadow .35s ease}
@media(pointer:fine){body[data-showroom] .service-row:hover,body[data-showroom] .project-card:hover,body[data-showroom] .package-card:hover,body[data-showroom] .plan-card:hover{transform:translateY(-5px);box-shadow:0 26px 72px rgba(0,0,0,.10)}}

@media(max-width:760px){
 body[data-showroom] .container{padding-inline:22px!important}
 body[data-showroom] .section{padding-block:66px!important}
 body[data-showroom] .display{font-size:clamp(42px,12.5vw,68px)!important;line-height:.96!important;text-wrap:balance}
 body[data-showroom] .navlinks{max-height:calc(100svh - 86px);overflow:auto;padding-bottom:max(22px,env(safe-area-inset-bottom))}
 .build-page .build-hero{min-height:82svh}.build-page .build-hero .hero-image{background-position:56% center!important}.build-page .build-hero .hero-copy{padding:22px;border-radius:22px}.build-page .build-hero .hero-number{display:none!important}
 .clean-page .standards-grid{grid-template-columns:1fr!important;gap:28px!important}.clean-page .standard-list article{grid-template-columns:1fr!important;gap:10px!important;padding:24px 0!important}.clean-page .standard-list h3{font-size:clamp(34px,10vw,48px)!important}
 .creator-page .creator-hero{min-height:auto!important}.creator-page .creator-photo{min-height:76svh!important;background-position:58% 20%!important}.creator-page .ticker{white-space:nowrap;overflow:hidden}.creator-page .media-wall{gap:14px!important}.creator-page .media-wall .media{border-radius:18px}
}

/* DEMO HOUSE V22 — SHOWROOM FLAGSHIP STANDARD */
:root{--demo22-ease:cubic-bezier(.22,.78,.18,1);--demo22-shadow:0 36px 110px rgba(0,0,0,.16)}
body{overflow-x:hidden}
.topbar{backdrop-filter:blur(22px) saturate(135%);-webkit-backdrop-filter:blur(22px) saturate(135%);border-bottom:1px solid rgba(255,255,255,.08)}
.topbar .nav{min-height:76px}.topbar .brand{letter-spacing:-.025em}.menu-btn{width:48px;height:48px;border-radius:15px!important;display:none;place-items:center}
.navlinks a{position:relative}.navlinks a::after{content:'';position:absolute;left:20%;right:20%;bottom:-8px;height:1px;background:currentColor;transform:scaleX(0);transition:transform .25s var(--demo22-ease);opacity:.45}.navlinks a:hover::after,.navlinks a.is-v22-active::after{transform:scaleX(1)}

/* Every demo gets a business-native route rail immediately after the hero. */
.v22-demo-route-strip{position:relative;z-index:8;padding:0;background:var(--v22-route-bg,#f3eee7);border-bottom:1px solid rgba(35,25,18,.10)}
.v22-demo-route-inner{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.v22-demo-route-copy{display:flex;align-items:baseline;gap:12px;white-space:nowrap}.v22-demo-route-copy small{font:850 9px/1 Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;opacity:.54}.v22-demo-route-copy b{font:700 14px/1.2 Arial,sans-serif;letter-spacing:-.02em}
.v22-demo-route-links{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.v22-demo-route-links a{min-height:38px;display:inline-flex;align-items:center;padding:0 12px;border:1px solid rgba(35,25,18,.13);border-radius:999px;font:760 10px/1 Arial,sans-serif;letter-spacing:.04em;text-decoration:none;transition:transform .2s var(--demo22-ease),background .2s ease,color .2s ease}.v22-demo-route-links a:hover,.v22-demo-route-links a.is-v22-active{transform:translateY(-1px);background:#17110d;color:#fff;border-color:#17110d}

/* Stronger image handling and section rhythm without turning demos into the same template. */
body[data-showroom] main>section{scroll-margin-top:92px}body[data-showroom] .section{padding-block:clamp(78px,9vw,138px)!important}
body[data-showroom] img{display:block;max-width:100%;height:auto}body[data-showroom] .reveal{will-change:transform,opacity}
body[data-showroom] .media img,body[data-showroom] figure img,body[data-showroom] .gallery img{transition:transform 1s var(--demo22-ease),filter .5s ease}
@media(pointer:fine){body[data-showroom] .media:hover img,body[data-showroom] figure:hover img,body[data-showroom] .gallery img:hover{transform:scale(1.025);filter:contrast(1.025) saturate(1.03)}}

/* Mila: a new hero image with deliberate editorial crop; not the coffee frame. */
.creator-page .creator-photo{background-image:linear-gradient(180deg,rgba(31,8,25,.05),rgba(31,8,25,.22)),url('../media/creator-rooftop.webp')!important;background-position:center 42%!important;filter:saturate(.92) contrast(1.035)!important}
.creator-page .creator-hero{min-height:min(940px,94svh)!important}.creator-page .creator-main{max-width:900px}.creator-page .creator-main p{max-width:640px!important}.creator-page .creator-rooftop-feature img{object-position:center 40%!important}
.creator-page .media{box-shadow:0 28px 80px rgba(72,25,58,.10)}

/* Construction: one image owns the hero; contrast is deterministic. */
.build-page .build-hero{isolation:isolate!important;min-height:90svh!important}.build-page .build-hero::after{content:'';position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,rgba(9,10,9,.86) 0%,rgba(9,10,9,.55) 46%,rgba(9,10,9,.16) 78%),linear-gradient(0deg,rgba(9,10,9,.58),transparent 44%);pointer-events:none}.build-page .build-hero>*{position:relative;z-index:1}

/* Maison Care labels keep one clean hierarchy instead of awkward stacked micro-labels. */
.clean-page .standards .eyebrow,.clean-page .spaces .eyebrow,.clean-page .plans .eyebrow{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:999px;white-space:normal!important;line-height:1.2!important}
.clean-page .plan-card,.clean-page .space-card{height:100%}

/* Detailing + barber: stronger premium geometry without changing each brand language. */
.detail-page .detail-hero,.barber-page .barber-hero{min-height:90svh!important}.detail-page .package,.barber-page .service{border-radius:28px!important;overflow:hidden}.barber-page .gallery img,.detail-page .proof img{border-radius:26px!important}

/* Market Systems: data-set types are now explicit and interactive. */
.v22-market-modes{background:linear-gradient(145deg,#eef2ed,#f7f4ed)!important}.v22-market-lens-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:30px 0 14px}.v22-market-lens-tabs button{min-height:44px;padding:0 15px;border:1px solid rgba(15,37,25,.16);border-radius:999px;background:transparent;color:#183224;font-weight:800;cursor:pointer}.v22-market-lens-tabs button.is-active{background:#173426;color:#fff;border-color:#173426}.v22-market-lens-panel{padding:clamp(24px,4vw,42px);border:1px solid rgba(18,43,29,.13);border-radius:28px;background:#fff;box-shadow:0 24px 80px rgba(24,50,32,.08)}.v22-market-lens-panel small{color:#62836d;font:900 9px/1 Arial,sans-serif;letter-spacing:.16em}.v22-market-lens-panel h3{margin:13px 0 10px;color:#173426;font-size:clamp(30px,4vw,52px);letter-spacing:-.045em}.v22-market-lens-panel p{max-width:780px;color:#5a6c61;line-height:1.7}.v22-market-lens-flow{display:flex;gap:7px;flex-wrap:wrap;margin-top:20px}.v22-market-lens-flow span{padding:8px 10px;border-radius:999px;background:#eaf0eb;color:#31563e;font:800 9px/1 Arial,sans-serif;letter-spacing:.07em;text-transform:uppercase}

@media(max-width:900px){
  .menu-btn{display:grid!important}.navlinks{position:absolute!important;left:14px!important;right:14px!important;top:calc(100% + 8px)!important;display:none!important;grid-template-columns:1fr!important;gap:3px!important;padding:12px!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:19px!important;background:rgba(16,13,11,.98)!important;box-shadow:0 30px 90px rgba(0,0,0,.42)!important;overflow:visible!important;max-height:none!important}.navlinks.v22-open{display:grid!important}.navlinks a{min-height:46px;display:flex!important;align-items:center;padding:0 12px!important;border-bottom:1px solid rgba(255,255,255,.07)!important;border-radius:9px!important}.navlinks a:last-child{border-bottom:0!important}
  .v22-demo-route-inner{min-height:0;padding-block:16px;align-items:flex-start;flex-direction:column;gap:12px}.v22-demo-route-copy{white-space:normal}.v22-demo-route-links{width:100%;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px;scroll-snap-type:x proximity}.v22-demo-route-links a{flex:0 0 auto;scroll-snap-align:start}
  body[data-showroom] .section{padding-block:68px!important}.creator-page .creator-hero{min-height:0!important}.creator-page .creator-photo{min-height:60svh!important;background-position:center 38%!important}
}
@media(max-width:620px){.v22-demo-route-copy{display:grid;gap:5px}.v22-demo-route-links a{min-height:40px}.v22-market-lens-tabs{display:grid;grid-template-columns:1fr}.v22-market-lens-tabs button{width:100%}.pc-section{padding-inline:18px!important}}
@media(prefers-reduced-motion:reduce){.v22-demo-route-links a,body[data-showroom] img{transition:none!important}}