/* The original brand artwork is the card, not a thumbnail beside it. */
/* One continuous mosaic: no air between branches, sides alternating. */
.location-grid { display:grid; grid-template-columns:1fr; gap:0; }
/* The card is only as wide as its artwork needs, so the row stays short and the map takes the rest. */
.branch-location { --branch-panel-height:clamp(420px, 38vw, 680px); display:grid; grid-template-columns:auto minmax(0,1fr); gap:0; align-items:start; padding:0; }
@media(min-width:761px) { .branch-location:nth-child(even) { grid-template-columns:minmax(0,1fr) auto; } .branch-location:nth-child(even) .branch-details { order:2; } }
.branch-details { position:relative; min-width:0; height:var(--branch-panel-height); aspect-ratio:1122/1402; background:#000 url('/assets/images/branch-brand-card-v1.webp') center / 100% 100% no-repeat; }
.branch-identity { position:absolute; top:39%; left:17%; right:17%; height:7%; display:flex; align-items:center; justify-content:center; }
.branch-identity h3 { margin:0; color:#fff; font-size:clamp(28px,3vw,40px); text-align:center; line-height:1; }
.branch-card-copy { position:absolute; top:49%; left:10%; right:10%; text-align:center; }
.branch-address { margin:0; color:#f3ecdd; font-size:14px; line-height:1.5; }
.branch-hours { margin:16px 0; }
.branch-hours h4 { margin:0 0 6px; font-size:13px; color:#e3b575; }
.branch-hours p { margin:0; font-size:14px; line-height:1.6; white-space:pre-line; color:#fff; }
.branch-actions { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:12px; }
.branch-actions .button { min-height:44px; font-size:11px; padding:12px 16px; }
.branch-actions .text-link { color:#fff; font-size:12px; padding:8px 0; }
.branch-map { min-width:0; margin:0; height:var(--branch-panel-height); display:flex; flex-direction:column; }
.branch-map iframe { display:block; box-sizing:border-box; width:100%; flex:1 1 auto; min-height:0; border:0; background:#24231e; }
/* The strip under the map is gone; its text stays for screen readers, and the card already links the map. */
.branch-map figcaption { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.branch-map figcaption a { display:inline-block; color:#e3b575; margin-left:4px; text-underline-offset:4px; }
.branch-location a:focus-visible { outline:2px solid #e3b575; outline-offset:6px; }
@media(max-width:760px) {
 .location-grid { gap:0; }
 .branch-location { --branch-panel-height:min(125vw, 760px); grid-template-columns:1fr; gap:0; padding:0; }
 .branch-details { height:auto; width:100%; }
 .branch-details,.branch-map { width:100%; max-width:480px; margin-inline:auto; }
 .branch-identity h3 { font-size:30px; }
 .branch-card-copy { left:8%; right:8%; }
}

/* Edge to edge: no width cap, no side padding and no rule on top. */
.locations-section { max-width:none; padding-inline:0; padding-top:clamp(24px, 3vw, 40px); border-top:0; }
.locations-section .section-heading { padding-inline:clamp(20px, 2.5vw, 48px); }
@media(max-width:760px) { .locations-section .branch-details, .locations-section .branch-map { max-width:none; } }
