/* Shared image-led service opening, based on the Order landing page. */
.branch-hero{--pad:clamp(22px,5vw,80px);position:relative;isolation:isolate;display:flex;align-items:center;min-height:min(calc(100svh - 72px),848px);padding:90px 0 100px;overflow:hidden;background:#000;color:#f0f2f3}
.branch-hero>.wrap{position:relative;z-index:1;width:100%;max-width:calc(1320px + 2*var(--pad));margin-inline:auto;padding-inline:var(--pad);display:block}
.branch-hero-media{position:absolute;inset:0;margin:0;z-index:0}
.branch-hero-media img{display:block;width:100%;height:100%;object-fit:cover;object-position:76% 50%}
.branch-hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.86),rgba(0,0,0,.75) 30%,rgba(0,0,0,.25) 63%,transparent 82%),linear-gradient(0deg,#000,transparent 24%);pointer-events:none}
.branch-hero-media figcaption{position:absolute;right:var(--pad);bottom:25px;z-index:2;color:#c5c8ca;font-size:10px;line-height:1.4;text-shadow:0 1px 4px #000}
.branch-hero-copy{max-width:min(640px,54%)}
.branch-hero-copy .eyebrow{display:block;font-size:11px;font-weight:500;line-height:1.5;letter-spacing:.12em;text-transform:uppercase;color:#c9cdd0;margin:0 0 22px}
.branch-hero-copy h1{font-family:Supreme,Arial,sans-serif;font-size:clamp(40px,5vw,76px);font-weight:500;line-height:1.04;letter-spacing:-.035em;max-width:none;margin:0;overflow-wrap:break-word;hyphens:auto;text-wrap:balance}
.branch-hero-copy .lead{font-size:18px;line-height:1.55;color:#c9cdd0;max-width:32em;margin:26px 0 0}
.branch-hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:34px}
.branch-hero-actions .btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:13px 22px;border:1px solid #626568;border-radius:99px;font:500 14px/1.3 Supreme,Arial,sans-serif;text-align:center;text-decoration:none;white-space:normal;gap:0;margin:0}
.branch-hero-actions .solid{color:#000;background:#f0f2f3;border-color:#f0f2f3}
.branch-hero-actions .ghost{color:#f0f2f3;background:#0003}
.branch-hero-actions .btn:focus-visible{outline:2px solid #fff;outline-offset:5px}
@media(hover:hover) and (pointer:fine){.branch-hero-actions .solid:hover{background:#fff}.branch-hero-actions .ghost:hover{background:#0008;border-color:#fff}}
.service-preview{padding-block:68px 56px;scroll-margin-top:90px}
.service-preview-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(35px,6vw,90px);align-items:center}
.service-preview-intro h2{max-width:17ch;font-size:clamp(30px,3.3vw,46px);line-height:1.1}
.service-preview-intro p{max-width:34ch;margin-top:22px;font-size:16px;line-height:1.55}
.service-preview .proof-note{margin-top:16px}
.service-preview .gym-product{max-width:none}
.service-preview .tour-preview{height:430px;margin:0}
.creative-brand-preview .creative-intro-mark{min-height:260px}
@media(max-width:980px){
 .branch-hero-copy{max-width:min(650px,75%)}
 .branch-hero{min-height:660px;padding-block:88px 94px}
 .branch-hero-media::after{background:linear-gradient(90deg,#000d,#0009 55%,#0003),linear-gradient(0deg,#000,transparent 30%)}
 .service-preview-grid{grid-template-columns:1fr 1.15fr;gap:30px}
}
@media(max-width:640px){
 .branch-hero{min-height:calc(100svh - 65px);padding-block:80px 84px;align-items:center}
 .branch-hero-copy{max-width:none}
 .branch-hero-media img{object-position:72% 50%}
 .branch-hero-media::after{background:linear-gradient(90deg,#000c,#0008),linear-gradient(0deg,#000,transparent 38%),linear-gradient(180deg,#0004,transparent 40%)}
 .branch-hero-copy h1{font-size:clamp(32px,8.5vw,46px);line-height:1.08}
 .branch-hero-copy .eyebrow{font-size:10px;margin-bottom:20px}
 .branch-hero-copy .lead{font-size:16px;line-height:1.55;margin-top:24px;max-width:36ch}
 .branch-hero-actions{gap:10px;margin-top:28px}
 .branch-hero-actions .btn{min-height:46px;font-size:13px;padding:12px 18px}
 .branch-hero-media figcaption{bottom:23px;font-size:9px}
 .service-preview{padding-block:44px 35px}
 .service-preview-grid{grid-template-columns:1fr;gap:28px}
 .service-preview-intro h2{font-size:30px;max-width:20ch}
 .service-preview-intro p{font-size:15px;margin-top:16px}
 .service-preview .tour-preview{height:370px}
}
