/* Metro Project Services — responsive overrides. Desktop styles are inline in the section JSX; these media queries adapt layout for iPad (<=1024px) and phones (<=680px). */
@media (max-width:1024px){body{overflow-x:hidden}.sectors-grid{grid-template-columns:repeat(2,1fr)!important}}
@media (max-width:1000px){.site-nav{display:none!important}.site-menu-btn{display:inline-flex!important}}
@media (max-width:900px){
.hero-stats{grid-template-columns:repeat(2,1fr)!important}
.hero-stats>div{padding:20px 0!important}
.hero-stats>div:nth-child(odd){border-left:none!important;padding-left:0!important}
.hero-stats>div:nth-child(even){padding-left:24px!important}
.hero-stats>div:nth-child(n+3){border-top:1px solid rgba(255,255,255,0.14)}
.projects-grid{grid-template-columns:1fr!important}
.approach-grid,.team-grid,.contact-grid{grid-template-columns:1fr!important;gap:40px!important}
.footer-grid{grid-template-columns:1fr 1fr!important}
.footer-brand{grid-column:1/-1}
}
@media (max-width:680px){
.mps-wrap{padding-left:20px!important;padding-right:20px!important}
.footer-wrap{padding:48px 20px 24px!important}
.mps-section{padding:64px 0!important}
.mps-h2{font-size:clamp(28px,7.5vw,34px)!important}
.site-header-inner{height:64px!important;gap:16px!important}
.site-phone{display:none!important}
.site-cta{display:none!important}
.hero-inner{padding:88px 0 60px!important}
.hero-h1{font-size:clamp(28px,8.5vw,40px)!important}
.hero-h1+p{font-size:16px!important}
.hero-stats>div>div:first-child{font-size:30px!important}
.approach-photo{height:280px!important}
.sectors-grid{grid-template-columns:1fr!important}
.team-cards{grid-template-columns:1fr!important}
.contact-card{padding:24px 20px!important}
.contact-form-row{grid-template-columns:1fr!important}
}

/* --- Sub-pages (about, safety, careers) ------------------------------- */
@media (max-width:1024px){.values-grid{grid-template-columns:repeat(2,1fr)!important}.clients-grid{grid-template-columns:repeat(3,1fr)!important}.pillars-grid,.docs-grid,.accred-grid{grid-template-columns:1fr 1fr!important}}
@media (max-width:1100px){.page-facts>div>div:first-child{font-size:27px!important}}
@media (max-width:900px){
.page-facts{grid-template-columns:repeat(2,1fr)!important}
.page-facts>div{padding:22px 0 0!important}
.page-facts>div:nth-child(even){padding-left:24px!important}
.page-facts>div:nth-child(odd){border-left:none!important}
.about-grid{grid-template-columns:1fr!important;gap:40px!important}
.about-photo{height:340px!important;order:-1}
.pillars-grid,.docs-grid,.accred-grid{grid-template-columns:1fr!important}
.docs-grid,.clients-grid{gap:1px!important}
.role-body{grid-template-columns:1fr!important;gap:24px!important}
.cta-band{padding:44px 20px!important}
}
@media (max-width:680px){
.page-hero-inner{padding:56px 20px 52px!important}
.page-hero-h1{font-size:clamp(28px,8.2vw,38px)!important}
.page-hero-inner p{font-size:16px!important}
.values-grid,.clients-grid{grid-template-columns:1fr!important}
.page-facts>div>div:first-child{font-size:28px!important}
.role-main{gap:8px 12px!important}
.cta-band h2{font-size:26px!important}
}

/* --- Leadership / Sustainability / News -------------------------------- */
@media (max-width:1024px){.news-grid{grid-template-columns:1fr 1fr!important}}
@media (max-width:900px){
.leader-grid,.news-grid{grid-template-columns:1fr!important}
.news-featured{grid-template-columns:1fr!important}
.news-featured>div:first-child{min-height:260px!important}
.news-featured>div:last-child{padding:32px 24px!important}
}