/* Commercial landing follows the condominium landing's visual language. */
.commercial-page .landing-hero{position:relative;min-height:76vh;padding:0;overflow:hidden;background:var(--coal)}
.commercial-page .landing-hero .landing-hero-media{position:absolute;inset:0;max-width:none}
.commercial-page .landing-hero-media img{width:100%;height:100%;object-fit:cover;filter:brightness(.44);transform:scale(1.02)}
.commercial-page .landing-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,7,6,.92) 0%,rgba(8,7,6,.56) 52%,rgba(8,7,6,.18) 100%),linear-gradient(0deg,rgba(8,7,6,.92),transparent 48%)}
.commercial-page .landing-hero .landing-hero-inner{position:relative;z-index:2;width:min(1180px,90vw);max-width:none;margin:0 auto;padding:10rem 0 5.5rem}
.commercial-page .landing-hero h1{max-width:1040px;font-size:clamp(3rem,8vw,6.5rem);font-weight:200;letter-spacing:.06em;line-height:1;color:#fff;margin:0}
.commercial-page .landing-hero h1 em{display:block;font-style:normal;color:var(--brass)}
.commercial-page .landing-hero p{max-width:650px;margin-top:2rem;font-size:clamp(.95rem,1.5vw,1.15rem);line-height:1.85;color:#ddd7ce}
.commercial-page .landing-actions{gap:1rem;margin-top:2.3rem}
.commercial-page .landing-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:.75rem 1.5rem;border:1px solid rgba(255,255,255,.28);font-size:.68rem;font-weight:700;letter-spacing:.2em;transition:.25s}
.commercial-page .landing-actions .primary{border-color:var(--brass)}
.commercial-page .landing-actions a:hover{border-color:var(--brass);color:var(--brass);background:transparent}
.commercial-page .landing-body{padding:0}
.commercial-page .landing-intro{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(2rem,7vw,7rem);padding:7rem 5vw;max-width:1280px;margin:auto}
.commercial-page .landing-body h2{font-size:clamp(1.8rem,4vw,3rem);font-weight:200;letter-spacing:.08em;line-height:1.15}
.commercial-page .landing-intro h2{margin:1.1rem 0 0}
.commercial-page .landing-intro p{align-self:end;color:#c9c3ba;font-size:1rem;line-height:1.9}
.commercial-page .landing-body>h2,.commercial-page .landing-body>.service-grid{width:min(1180px,90vw);margin-left:auto;margin-right:auto}
.commercial-page .landing-body>h2{margin-top:0;padding-top:3rem}
.commercial-page .service-grid{gap:0;border-top:1px solid rgba(255,255,255,.12);margin-bottom:4rem}
.commercial-page .service-grid div{border:0;border-bottom:1px solid rgba(255,255,255,.1);padding:2rem 1.6rem;color:#b8b1a7;font-size:.9rem;line-height:1.85}
.commercial-page .service-grid strong{display:block;font-size:.68rem;letter-spacing:.16em;margin-bottom:.8rem}
.commercial-page .landing-project-section{background:#f1eee8;color:#1a1814;padding:6rem max(5vw,calc((100vw - 1180px)/2)) 7rem}
.commercial-page .landing-project-section h2{margin:0 0 3rem}
.commercial-page .landing-projects{grid-template-columns:1fr;gap:2.5rem}
.commercial-page .landing-project{display:grid;grid-template-columns:.83fr 1.17fr;aspect-ratio:auto;min-height:310px;background:#fff;box-shadow:0 16px 40px rgba(41,31,23,.07);transition:transform .35s,box-shadow .35s}
.commercial-page .landing-project:hover{transform:translateY(-4px);box-shadow:0 24px 50px rgba(41,31,23,.13)}
.commercial-page .landing-project img{height:310px}
.commercial-page .landing-project span{position:static;display:flex;flex-direction:column;justify-content:center;padding:clamp(1.5rem,3vw,2.5rem);background:none;font-size:clamp(1.35rem,2.4vw,2rem);font-weight:500;line-height:1.4}
.commercial-page .landing-project span::after{content:"View case study →";margin-top:2rem;color:#7e4c2c;font-size:.68rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.commercial-page .landing-project-section .portfolio-link{color:#7e4c2c}
.commercial-page .landing-faq{padding:7rem 5vw;width:min(1108px,100%);margin:auto}
.commercial-page .landing-faq h2{margin:1rem 0 2.5rem}
.commercial-page .faq-list{max-width:none}
.commercial-page .faq-list details{padding:0}
.commercial-page .faq-list summary{display:flex;justify-content:space-between;gap:2rem;padding:1.5rem 0;list-style:none;font-size:1rem;font-weight:500}
.commercial-page .faq-list summary::-webkit-details-marker{display:none}
.commercial-page .faq-list summary::after{content:"+";color:var(--brass)}
.commercial-page .faq-list details[open] summary::after{content:"−"}
.commercial-page .faq-list p{max-width:760px;margin:0;padding:0 0 1.7rem;color:#aaa39a;line-height:1.85;font-size:.9rem}
.commercial-page .landing-cta{padding:7rem 5vw;text-align:center;background:var(--brass);color:var(--ink)}
.commercial-page .landing-cta h2{max-width:900px;margin:1rem auto 2rem;font-size:clamp(1.8rem,4.5vw,3.2rem);font-weight:200;line-height:1.15;letter-spacing:.08em}
.commercial-page .landing-cta a{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:.85rem 1.7rem;border:1px solid var(--ink);font-size:.68rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.commercial-page .landing-cta a:hover{background:var(--ink);color:var(--bone)}
@media(max-width:720px){
.commercial-page .landing-hero{min-height:680px}
.commercial-page .landing-hero::after{background:linear-gradient(0deg,rgba(8,7,6,.94) 0%,rgba(8,7,6,.52) 76%,rgba(8,7,6,.35) 100%)}
.commercial-page .landing-hero .landing-hero-inner{padding:9rem 0 4rem}
.commercial-page .landing-hero h1{font-size:2.6rem}
.commercial-page .landing-intro{grid-template-columns:1fr;gap:2rem;padding:5rem 6vw}
.commercial-page .landing-actions{flex-direction:column}
.commercial-page .landing-project-section,.commercial-page .landing-faq,.commercial-page .landing-cta{padding:5rem 6vw}
.commercial-page .landing-project{grid-template-columns:1fr}
.commercial-page .landing-project img{height:auto;aspect-ratio:4/3}
.commercial-page .landing-project span{min-height:200px}
}
