.worldmap-headline {
    grid-column: 2 / span 12;
    text-align: center;
    margin-bottom: 0;
}

.worldmap-description {
    grid-column: 2 / span 12;
    width: min(100%, 84ch);
    justify-self: center;
    text-align: center;
    margin-top: var(--s-sm);
}

.worldmap-map-wrapper {
    position: relative;
    grid-column: 3 / span 10;
    margin-top: var(--s-md);
}

.worldmap-destinations {
    position: absolute;
    width: 100%;
    height: 100%;
}

.worldmap-destination {
    aspect-ratio: 1;
    position: absolute;
    border-radius: 100%;
    font-size: calc(4.814233385661957 / 100 * (9 * var(--grid-gap) + 10 * var(--grid-col-width)));

    width: 1em;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    flex-direction: column;
    transition: transform 0.4s ease;
}

.worldmap-destination:hover {
    transform: scale(1.2);
}

.worldmap-destination img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    left: 0;
    top: 0;
}

.worldmap-destination-country {
    position: relative;
    color: var(--white);
    font-size: 0.1847826086956522em;
    font-family: "Ubuntu";
    font-weight: 700;
    z-index: 2;
    order: 2;
    line-height: 1;
    padding-inline: 0.5ch;
    text-align: center;
}

.worldmap-destination::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-color: var(--black);
    opacity: 0.2;
}

.worldmap-destination::after {
    content: "";
    mask-image: url("../../img/location.svg");
    background-color: var(--white);
    aspect-ratio: 113/150;
    z-index: 2;
    mask-repeat: no-repeat;
    mask-size: contain;
    height: 0.1618478260869565em;
    position: absolute;
    top: 16.30434782608696%;
}

@media (max-width: 1599.98px) {
    .worldmap-map-wrapper {
        grid-column: 2 / span 12;
    }
    .worldmap-destination {
        font-size: calc(4.814233385661957 / 100 * (100vw - 2 * var(--grid-margin)));
    }
}