.bzgk5fb-component {
    box-sizing: border-box;
    margin: var(--margin-tb) 0;
    background-color: var(--background-color);
    background-image: var(--background-image);
    background-position: var(--background-position);
    background-size: var(--background-size);
    background-repeat: var(--background-repeat);
    overflow: hidden;
    color: #111827;
}

.bzgk5fb-component * {
    box-sizing: border-box;
}

.bzgk5fb-component__inner {
    width: 100%;
    max-width: var(--custom-content-max-width);
    margin-left: auto;
    margin-right: auto;
    padding-top: var(--padding-tb);
    padding-right: var(--padding_lr);
    padding-bottom: var(--padding-tb);
    padding-left: var(--padding_lr);
}

.bzgk5fb-component__header {
    margin-bottom: 30px
}

.bzgk5fb-component__kicker,
.bzgk5fb-component__title,
.bzgk5fb-component__intro {
    margin: 0;
    color: var(--color, var(--theme_color));
    font-size: var(--font-size);
    font-family: var(--font-family, inherit);
    font-weight: var(--font-weight);
    font-style: var(--font-style);
    text-align: var(--text-align, left);
    text-decoration: var(--text-decoration);
    text-transform: var(--text-transform, none);
    line-height: var(--line-height, normal);
    letter-spacing: var(--letter-spacing, 0);
    transition: color .35s cubic-bezier(.16, 1, .3, 1), font-size .35s cubic-bezier(.16, 1, .3, 1)
}

.bzgk5fb-component__kicker:hover,
.bzgk5fb-component__title:hover,
.bzgk5fb-component__intro:hover {
    color: var(--hover-color, var(--color, var(--theme_color)));
    font-size: var(--hover-font-size, var(--font-size));
    font-family: var(--hover-font-family, var(--font-family, inherit))
}

.bzgk5fb-component__kicker {
    margin-bottom: 8px
}

.bzgk5fb-component__title {
    line-height: var(--line-height, 1.2)
}

.bzgk5fb-component__intro {
    margin: 12px auto 0;
    line-height: var(--line-height, 1.65)
}

.bzgk5fb-component__map {
    position: relative;
    width: min(1080px, 100%);
    aspect-ratio: 1080/657;
    margin: 30px auto 0
}

.bzgk5fb-component__map-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: var(--image-fit);
    border-radius: var(--image-shape)
}

.bzgk5fb-component__items {
    position: absolute;
    inset: 0
}

.bzgk5fb-component__hotspot {
    position: absolute;
    left: var(--position-x, 50%);
    top: var(--position-y, 50%);
    z-index: 5;
    display: flex;
    flex-direction: column;
    align-items: center;
    transform: translate(-50%, -50%);
    cursor: pointer;
    outline: none
}

.bzgk5fb-component__beacon {
    position: relative;
    display: block;
    width: 14px;
    height: 14px;
    margin-bottom: 5px;
    background: var(--item-theme-color, var(--theme_color));
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 14px color-mix(in srgb, var(--item-theme-color, var(--theme_color)) 95%, transparent);
    transition: transform .3s cubic-bezier(.175, .885, .32, 1.275)
}

.bzgk5fb-component__beacon::before,
.bzgk5fb-component__beacon::after {
    content: "";
    position: absolute;
    inset: -5px;
    border: 2px solid color-mix(in srgb, var(--item-theme-color, var(--theme_color)) 75%, transparent);
    border-radius: 50%;
    animation: bzgk5fb-pulse 2.4s cubic-bezier(0, .2, .8, 1) infinite
}

.bzgk5fb-component__beacon::after {
    animation-delay: 1.2s
}

.bzgk5fb-component__bubble {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 6px 12px;
    text-align: center;
    white-space: nowrap;
    background: #fff;
    border: 1.5px solid var(--item-theme-color, var(--theme_color));
    border-radius: 9999px;
    box-shadow: 0 6px 18px rgba(15, 23, 42, .08), 0 0 15px color-mix(in srgb, var(--item-theme-color, var(--theme_color)) 20%, transparent);
    transition: all .3s cubic-bezier(.175, .885, .32, 1.275)
}

.bzgk5fb-component__hotspot-name {
    display: block;
    width: 100%;
    margin: 0;
    color: var(--label-color, rgb(15, 23, 42));
    font-size: var(--label-font-size, 10.5px);
    font-family: var(--label-font-family, inherit);
    font-weight: var(--label-font-weight, 700);
    font-style: var(--label-font-style, normal);
    text-align: var(--label-text-align, left);
    text-decoration: var(--label-text-decoration, none);
    text-transform: var(--label-text-transform, uppercase);
    line-height: var(--label-line-height, 1.35);
    letter-spacing: var(--label-letter-spacing, .06em)
}

.bzgk5fb-component__hotspot-description {
    display: block;
    width: 100%;
    margin: 1px 0 0;
    color: var(--description-color, rgb(100, 116, 139));
    font-size: var(--description-font-size, 8.5px);
    font-family: var(--description-font-family, inherit);
    font-weight: var(--description-font-weight, 400);
    font-style: var(--description-font-style, normal);
    text-align: var(--description-text-align, left);
    text-decoration: var(--description-text-decoration, none);
    text-transform: var(--description-text-transform, none);
    line-height: var(--description-line-height, 1.35);
    letter-spacing: var(--description-letter-spacing, 0);
    transition: color .2s
}

.bzgk5fb-component__hotspot.is-compact .bzgk5fb-component__bubble {
    padding: 3px 8px;
    opacity: .92;
    transform: scale(.95)
}

.bzgk5fb-component__hotspot.is-compact .bzgk5fb-component__hotspot-description {
    display: none
}

.bzgk5fb-component__hotspot.is-highlighted {
    z-index: 8
}

.bzgk5fb-component__hotspot.is-highlighted .bzgk5fb-component__beacon {
    width: 16px;
    height: 16px;
    background: var(--highlighted-item-theme-color, #f59e0b);
    box-shadow: 0 0 20px color-mix(in srgb, var(--highlighted-item-theme-color, #f59e0b) 95%, transparent)
}

.bzgk5fb-component__hotspot.is-highlighted .bzgk5fb-component__beacon::before,
.bzgk5fb-component__hotspot.is-highlighted .bzgk5fb-component__beacon::after {
    border-color: color-mix(in srgb, var(--highlighted-item-theme-color, #f59e0b) 85%, transparent)
}

.bzgk5fb-component__hotspot.is-highlighted .bzgk5fb-component__bubble {
    padding: 7px 14px;
    opacity: 1;
    background: color-mix(in srgb, var(--highlighted-item-theme-color, #f59e0b) 8%, #fff);
    border-color: var(--highlighted-item-theme-color, #f59e0b);
    box-shadow: 0 8px 24px color-mix(in srgb, var(--highlighted-item-theme-color, #f59e0b) 25%, transparent);
    transform: none
}

.bzgk5fb-component__hotspot.is-highlighted.is-compact .bzgk5fb-component__bubble {
    padding: 3px 8px;
    opacity: .92;
    transform: scale(.95)
}

.bzgk5fb-component__hotspot:hover .bzgk5fb-component__beacon,
.bzgk5fb-component__hotspot:focus-visible .bzgk5fb-component__beacon {
    transform: scale(1.25)
}

.bzgk5fb-component__hotspot:hover .bzgk5fb-component__bubble,
.bzgk5fb-component__hotspot:focus-visible .bzgk5fb-component__bubble {
    background: var(--item-theme-color, var(--theme_color));
    border-color: var(--item-theme-color, var(--theme_color));
    box-shadow: 0 10px 24px color-mix(in srgb, var(--item-theme-color, var(--theme_color)) 45%, transparent);
    transform: translateY(-4px) scale(1.06)
}

.bzgk5fb-component__hotspot:hover .bzgk5fb-component__hotspot-name,
.bzgk5fb-component__hotspot:focus-visible .bzgk5fb-component__hotspot-name {
    color: var(--label-hover-color, #fff);
    font-size: var(--label-hover-font-size, var(--label-font-size, 10.5px));
    font-family: var(--label-hover-font-family, var(--label-font-family, inherit))
}

.bzgk5fb-component__hotspot:hover .bzgk5fb-component__hotspot-description,
.bzgk5fb-component__hotspot:focus-visible .bzgk5fb-component__hotspot-description {
    color: var(--description-hover-color, rgba(255, 255, 255, .92));
    font-size: var(--description-hover-font-size, var(--description-font-size, 8.5px));
    font-family: var(--description-hover-font-family, var(--description-font-family, inherit))
}

.bzgk5fb-component__hotspot.is-compact:hover .bzgk5fb-component__bubble,
.bzgk5fb-component__hotspot.is-compact:focus-visible .bzgk5fb-component__bubble {
    padding: 7px 14px;
    z-index: 10;
    transform: translateY(-5px) scale(1.08)
}

.bzgk5fb-component__hotspot.is-compact:hover .bzgk5fb-component__hotspot-description,
.bzgk5fb-component__hotspot.is-compact:focus-visible .bzgk5fb-component__hotspot-description {
    display: block
}

.bzgk5fb-component__hotspot.is-highlighted:hover .bzgk5fb-component__bubble,
.bzgk5fb-component__hotspot.is-highlighted:focus-visible .bzgk5fb-component__bubble {
    background: var(--highlighted-item-theme-color, #f59e0b);
    border-color: var(--highlighted-item-theme-color, #f59e0b);
    box-shadow: 0 12px 28px color-mix(in srgb, var(--highlighted-item-theme-color, #f59e0b) 50%, transparent);
    transform: translateY(-4px) scale(1.06)
}

.bzgk5fb-component__hotspot.is-highlighted:hover .bzgk5fb-component__hotspot-name,
.bzgk5fb-component__hotspot.is-highlighted:focus-visible .bzgk5fb-component__hotspot-name {
    color: var(--label-hover-color, #fff)
}

.bzgk5fb-component__hotspot.is-active .bzgk5fb-component__beacon {
    animation: bzgk5fb-activate .25s ease
}

@keyframes bzgk5fb-pulse {
    0% {
        transform: scale(.6);
        opacity: 1
    }

    100% {
        transform: scale(2.8);
        opacity: 0
    }
}

@keyframes bzgk5fb-activate {
    50% {
        transform: scale(1.15)
    }
}

@media (max-width:959px) {
    .bzgk5fb-component__inner {
        padding-left: 1rem;
        padding-right: 1rem
    }

    .bzgk5fb-component__kicker,
    .bzgk5fb-component__title,
    .bzgk5fb-component__intro {
        font-size: var(--mo-font-size)
    }

    .bzgk5fb-component__hotspot-name {
        font-size: var(--label-mo-font-size, var(--label-font-size, 10px))
    }

    .bzgk5fb-component__hotspot-description {
        font-size: var(--description-mo-font-size, var(--description-font-size, 8px))
    }

    .bzgk5fb-component__map {
        width: 100%
    }

    .bzgk5fb-component__hotspot .bzgk5fb-component__bubble {
        padding: 5px 8px;
        transform: scale(.78);
        transform-origin: top center
    }

    .bzgk5fb-component__hotspot:hover .bzgk5fb-component__bubble,
    .bzgk5fb-component__hotspot:focus-visible .bzgk5fb-component__bubble {
        transform: translateY(-3px) scale(.82)
    }

    .bzgk5fb-component__hotspot.is-compact .bzgk5fb-component__bubble {
        padding: 3px 6px;
        transform: scale(.74)
    }

    .bzgk5fb-component__hotspot.is-compact:hover .bzgk5fb-component__bubble,
    .bzgk5fb-component__hotspot.is-compact:focus-visible .bzgk5fb-component__bubble {
        padding: 5px 8px;
        transform: translateY(-3px) scale(.84)
    }

    .bzgk5fb-component__hotspot.is-highlighted .bzgk5fb-component__bubble {
        padding: 5px 8px;
        transform: scale(.78)
    }

    .bzgk5fb-component__hotspot.is-highlighted:hover .bzgk5fb-component__bubble,
    .bzgk5fb-component__hotspot.is-highlighted:focus-visible .bzgk5fb-component__bubble {
        transform: translateY(-3px) scale(.82)
    }
}

@media (prefers-reduced-motion:reduce) {
    .bzgk5fb-component * {
        animation-duration: .001ms;
        animation-iteration-count: 1;
        transition-duration: .001ms
    }
}
