/* Homepage composition. Shared component sizing lives in design-system.css. */
.home-hero,.hero-grid{min-height:500px}
.hero-grid{grid-template-columns:1.1fr 1fr}
.hero-copy{padding:70px 0;max-width:650px}
.hero-copy h1{font-size:var(--type-display);line-height:1.12;margin-bottom:24px}
.hero-description{max-width:570px}
/* One integrated scene: the emblem, skyline and foreground share the same image. */
.hero-city{background:#031831}
.hero-city:before{display:none}
.hero-city:after{content:"";position:absolute;inset:0 0 0 28%;background:url("hero-reference-v2.webp") right center/auto 100% no-repeat;mask-image:linear-gradient(90deg,transparent,#000 24%)}
.home-hero:after{background:linear-gradient(90deg,#02142bcc 40%,transparent 68%)}
.hero-visual{min-height:400px}
.hero-aside{top:20px;inset-inline-end:0}
.hero-proof,.brand-stage,.logo-replay,.hero-waves{display:none}
.home-services{background:#edf2f7}
.service-grid.featured{grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}
.services-subline{display:none}
.industries-strip{background:var(--soft)}
.industries-strip-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.industries-strip-grid>div:first-child{grid-column:1/-1;margin-bottom:8px}
.industries-strip h2{white-space:normal;max-width:700px}
.industry-card{height:220px;padding:28px;background-size:cover;background-position:center;border:1px solid #35506c;box-shadow:0 6px 18px #041a3320}
.industry-card:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#03162df5 0%,#03162d99 40%,#03162d10 80%)}
.industry-banking-financial-services{background-image:url("banking-hd.webp")}
.industry-enterprise{background-image:url("architecture-hd.webp")}
.industry-ai{background-image:url("ai-portrait.webp")}
.industry-web{background-image:url("skyline-hd.webp")}
.industry-scene{display:none}
.industry-card>.icon{color:white}
.industry-card h3{margin-top:45px;max-width:calc(100% - 28px);text-shadow:0 1px 2px #0008}
.about-home{background:#fff}
.about-grid{grid-template-columns:1fr 1fr;gap:56px}
.about-art{min-height:360px;height:100%;border-radius:var(--radius)}
.about-photo{position:absolute;inset:0;background:url("office-branded.webp") center/cover no-repeat;opacity:1;transform:none;filter:none}
.about-art-copy,.about-art:after{display:none}
.about-art>img{display:none}
.about-copy p{max-width:600px}
.value-pills{margin-top:28px;padding-top:24px}
[dir="rtl"] .hero-city{transform:none}
[dir="rtl"] .hero-city:after{inset:0 28% 0 0;mask-image:linear-gradient(270deg,transparent,#000 24%)}
[dir="rtl"] .hero-copy h1{font-size:var(--type-display);line-height:1.45}
@media(max-width:1120px){
 .hero-aside{display:none}
 .service-grid.featured{grid-template-columns:repeat(3,minmax(0,1fr))}
 .industries-strip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .about-grid{gap:32px}
}
@media(max-width:1120px){
 .hero-grid{display:block;min-height:640px}
 .hero-copy{padding:48px 0 clamp(285px,43vw,440px);max-width:620px}
 .hero-copy h1{max-width:580px}
 .hero-city:after,[dir="rtl"] .hero-city:after{inset:auto 0 0;height:clamp(270px,40vw,420px);background-size:auto 100%;background-position:72% center;mask-image:linear-gradient(transparent,#000 22%)}
 .hero-visual{display:none}
 .home-hero .eyebrow{white-space:normal}
 .about-grid{grid-template-columns:1fr}
 .about-art{min-height:300px}
}
@media(max-width:600px){
 .hero-copy{padding-top:44px}
 .hero-actions{gap:12px}
 .service-grid.featured{grid-template-columns:1fr}
 .service-card.compact:last-child{grid-column:auto}
 .service-card.compact:last-child .service-icon{position:static}
 .industries-strip-grid{grid-template-columns:1fr}
 .industry-card{height:220px}
 .about-art{min-height:240px}
}

@media(min-width:1600px){
 .hero-city:after{background-size:cover}
 .hero-aside{inset-inline-end:calc((1280px - 100vw)/2 + 48px)}
}

[dir="rtl"] .home-hero:after{background:linear-gradient(270deg,#02142bcc 40%,transparent 68%)}
@media(max-width:1120px){.home-hero:after,[dir="rtl"] .home-hero:after{background:none}}
@media(min-width:601px) and (max-width:1120px){.hero-city:after,[dir="rtl"] .hero-city:after{background-size:cover}}
