.location-map {
    --map-line: color-mix(in oklab, var(--color-ink) 16%, var(--color-paper));
    --map-muted: color-mix(in oklab, var(--color-ink) 75%, var(--color-paper));
    margin-block: 0 3rem;
    border: 1px solid var(--map-line);
    border-radius: .5rem;
    overflow: hidden;
    background: var(--color-paper);
}

.location-map-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    padding: 1.75rem 2rem;
    border-left: 4px solid var(--color-brand);
}

.location-map .location-map-label {
    margin: 0 0 .5rem;
    color: var(--map-muted);
    font-size: .6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .13em;
}

.location-map h2 {
    margin: 0;
    font-family: var(--font-display);
    font-size: clamp(1.5rem, 2.5vw, 2rem);
    line-height: 1.2;
    font-weight: 600;
    letter-spacing: -.02em;
}

.location-map .location-map-address {
    margin: .65rem 0 0;
    color: var(--map-muted);
    font-size: .9375rem;
    overflow-wrap: anywhere;
}

.location-map-open {
    flex-shrink: 0;
    padding-block: .8rem;
    color: var(--color-ink);
    font-size: .875rem;
    font-weight: 500;
    text-decoration: underline;
    text-underline-offset: .25em;
}

.location-map-new-tab { display: block; font-size: .75rem; color: var(--map-muted); font-weight: 400; }
.location-map a:focus-visible { outline: 3px solid var(--color-action); outline-offset: 4px; }
.location-map-frame { background: color-mix(in oklab, var(--color-ink) 6%, var(--color-paper)); border-block: 1px solid var(--map-line); }
.location-map iframe { display: block; border: 0; width: 100%; height: 380px; }
.location-map-footer { display: flex; justify-content: space-between; align-items: start; gap: 1rem 2rem; padding: 1rem 2rem; }
.location-map-footer p { margin: 0; max-width: 64ch; color: var(--map-muted); font-size: .8125rem; line-height: 1.6; }
.location-map-footer a { flex-shrink: 0; color: var(--map-muted); font-size: .75rem; text-decoration: underline; text-underline-offset: .25em; padding-block: .25rem; }

@media (max-width: 767px) {
    .location-map-heading { display: block; padding: 1.25rem; }
    .location-map-open { display: inline-block; margin-top: .5rem; }
    .location-map-new-tab { display: inline; margin-left: .2rem; }
    .location-map iframe { height: 320px; }
    .location-map-footer { flex-direction: column; padding: 1rem 1.25rem; gap: .5rem; }
    .location-map-footer a { flex-shrink: 1; }
}