/* Compact, edge-to-edge page banners: reference ratio 1353 / 427. */
:root{--top-banner-height:31.56vw}
.work-banner{width:100%;max-width:none;margin:0;border:0;border-radius:0;box-shadow:none}
.work-banner>img{height:var(--top-banner-height);min-height:350px;object-fit:cover}
.work-banner-copy{padding:24px max(32px,calc((100vw - 1200px)/2));max-width:62%}
.work-banner-copy h2{font-size:clamp(28px,3vw,42px);margin:10px 0}
.work-banner-copy p{line-height:1.55;margin-bottom:12px}
.work-banner-copy .work-banner-note{margin-top:10px!important}
.web-offer{padding-top:0}
.web-offer>.wrap{width:100%;max-width:none}
.web-offer-shell{border:0;border-radius:0;box-shadow:none}
.web-offer-banner{width:100%;height:var(--top-banner-height);object-fit:cover;object-position:center 40%;background:#fff4e8}
.msme-banner-wrap:not([id]){padding-top:0}
.msme-banner-wrap:not([id])>.wrap{width:100%;max-width:none}
.msme-banner-wrap:not([id]) .msme-banner{height:var(--top-banner-height);object-fit:cover;object-position:center 40%;background:#fff4e8;border:0;border-radius:0;box-shadow:none}
.svc-photo-hero{width:100%;min-height:0;height:auto;padding:28px 0;min-height:max(350px,var(--top-banner-height));display:flex;align-items:center;background-position:center;background-size:cover}
.svc-photo-hero h1{font-size:clamp(30px,3.5vw,48px);margin:12px 0}
.svc-photo-hero p{font-size:16px;line-height:1.6;margin:12px 0;max-width:540px}
.home-refresh .hp-hero{padding:24px 0;min-height:max(350px,var(--top-banner-height));display:flex;align-items:center}
.home-refresh .hp-hero h1{font-size:clamp(32px,3.5vw,48px);margin:12px 0 16px}
.home-refresh .hp-hero-copy>p{font-size:14px;line-height:1.65;margin-bottom:18px}
.home-refresh .hp-hero-links{margin-top:18px}
.home-refresh .hp-hero-art{padding-bottom:24px}
.home-refresh .hp-hero-art>img{width:100%;margin-left:0;max-height:26vw;object-fit:contain}
@media(max-width:900px){
 .work-banner-copy{max-width:65%;padding:22px}
 .work-banner-copy h2{font-size:30px}
 .work-banner-copy p{font-size:13px}
 .home-refresh .hp-hero-grid{grid-template-columns:1.1fr .9fr;gap:15px}
 .home-refresh .hp-hero h1{font-size:34px}
 .home-refresh .hp-art-label{position:relative;right:auto;padding:10px}
}
@media(max-width:620px){
 /* Stack live text on narrow screens so links and copy remain readable. */
 .work-banner{margin:0;border-radius:0;display:flex;flex-direction:column}
 .work-banner>img{height:var(--top-banner-height);min-height:0;object-position:center}
 .work-banner-copy{position:relative;max-width:none;padding:22px;inset:auto}
 .work-banner-copy h2{font-size:29px}
 .work-banner-copy p{font-size:14px}
 .svc-photo-hero{min-height:0;padding:28px 0;background-size:cover;background-position:center}
 .svc-photo-hero:before{background:linear-gradient(90deg,#fff9f0f5,#fff7edce)}
 .svc-photo-hero h1{font-size:32px}
 .svc-photo-hero p{font-size:14px}
 .home-refresh .hp-hero{min-height:0;padding:28px 0}
 .home-refresh .hp-hero-grid{grid-template-columns:1fr}
 .home-refresh .hp-hero h1{font-size:36px}
 .home-refresh .hp-hero-art>img{max-height:190px;width:100%;margin:0}
 .home-refresh .hp-art-label{position:absolute;right:0;bottom:0}
}

/* Mobile: keep the photograph and live copy in one banner. */
@media(max-width:620px){
 .work-banner{display:block;position:relative;isolation:isolate;min-height:0}
 .work-banner>img{position:absolute;inset:0;width:100%;height:100%;min-height:100%;object-fit:cover;object-position:68% center}
 .work-banner:after{display:block;z-index:0;background:linear-gradient(90deg,rgba(255,248,238,.98) 0%,rgba(255,248,238,.94) 42%,rgba(255,248,238,.76) 74%,rgba(255,248,238,.54) 100%)}
 .work-banner-copy{position:relative;inset:auto;z-index:1;max-width:none;width:100%;box-sizing:border-box;padding:28px 22px;min-height:360px;justify-content:center}
 .work-banner-copy small{font-size:9px;line-height:1.5;letter-spacing:.06em;max-width:94%}
 .work-banner-copy h2{font-size:clamp(28px,7.5vw,35px);line-height:1.12;max-width:95%;margin:12px 0}
 .work-banner-copy p{font-size:14px;line-height:1.5;max-width:95%;margin:0 0 16px;color:#514337}
 .work-banner-copy a{padding:12px 18px;font-size:13px}
 .work-banner-copy .work-banner-note{font-size:11px!important;line-height:1.5;max-width:95%;margin:12px 0 0!important}
}
