
.branch-hero { padding: 46px 0 72px; background: var(--soft); }
.breadcrumb { margin-bottom: 30px; color: var(--muted); font-size: .9rem; }
.breadcrumb a { text-decoration: underline; text-underline-offset: 3px; }
.branch-layout { display: grid; grid-template-columns: 1.15fr .85fr; gap: 48px; align-items: center; }
.branch-hero h1 { color: var(--navy); font-size: clamp(2.4rem,5vw,4.4rem); line-height: 1.08; letter-spacing: -.045em; margin: 16px 0 24px; }
.branch-hero h1 span { color: #b5106a; }
.branch-hero p { font-size: 1.08rem; }
.branch-hero .hero-points span { color: var(--navy); border-color: var(--line); background: white; }
.branch-photo { margin: 0; background: white; border: 1px solid var(--line); border-radius: 24px; overflow: hidden; }
.branch-photo img { width: 100%; max-height: 520px; height: auto; object-fit: contain; }
.branch-photo figcaption { padding: 14px 22px; color: var(--muted); font-size: .88rem; border-top: 1px solid var(--line); }
.branch-map { width: 100%; height: 340px; border: 0; border-radius: 18px; background: var(--soft); }
.branch-address { font-style: normal; font-size: 1.08rem; margin: 20px 0; }
.branch-note { color: var(--muted); font-size: .94rem; }
.branch-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.branch-steps { padding-left: 22px; }
.branch-steps li { padding-left: 5px; margin-bottom: 16px; }
.branch-steps strong { color: var(--navy); }
.branch-page :focus-visible { outline: 3px solid #087eaa; outline-offset: 4px; }
@media(max-width: 980px) { .branch-layout { grid-template-columns: 1fr; gap: 32px; } .branch-photo { max-width: 620px; } }
@media(max-width: 700px) { .branch-hero { padding: 30px 0 48px; } .branch-hero .hero-actions { margin-top: 24px; } .branch-map { height: 280px; } .branch-links .button { width: 100%; } }

.branch-page .location-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media(max-width: 980px) { .branch-page .location-grid { grid-template-columns: 1fr; } }

.branch-photo figcaption a { text-decoration: underline; font-weight: 700; }
.branch-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.branch-gallery .branch-photo img { height: auto; max-height: none; }
@media(max-width: 700px) { .branch-gallery { grid-template-columns: 1fr; } }

.branch-video { width: min(100%, 360px); justify-self: center; }
.branch-video iframe { display: block; width: 100%; height: auto; aspect-ratio: 9 / 16; border: 0; border-radius: 18px; background: #0f1b3f; }
