/* Standort-Badge ("Wir sind gerade hier") im Startseiten-Header
 *
 * A pill above the centred site title, readable on any header photo: white
 * text on a translucent dark ground. Links to the place on Google Maps.
 */
.intro-header .location-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 18px;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.45);
    color: #fff;
    font-size: 15px;
    line-height: 1.3;
    text-decoration: none;
    transition: background-color 0.2s;
}

.intro-header .location-badge:hover,
.intro-header .location-badge:focus {
    background: rgba(0, 0, 0, 0.65);
    color: #fff;
    text-decoration: none;
}

.intro-header .location-badge::before {
    /* Map pin. */
    content: "";
    width: 14px;
    height: 14px;
    flex: none;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 16s6-5.686 6-10A6 6 0 0 0 2 6c0 4.314 6 10 6 10m0-7a3 3 0 1 1 0-6 3 3 0 0 1 0 6'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 16s6-5.686 6-10A6 6 0 0 0 2 6c0 4.314 6 10 6 10m0-7a3 3 0 1 1 0-6 3 3 0 0 1 0 6'/%3E%3C/svg%3E") center / contain no-repeat;
}

.intro-header .location-badge strong {
    font-weight: 700;
}