/* Map page — layout and decoration for map.html */

.gs-map-frame {
    position: relative;
    margin-top: 5.5rem;
    border: 12px solid var(--gs-dark-purple);
    border-radius: 1.25rem;
    box-shadow:
        0 0 0 3px var(--gs-dark-purple, #3c0777),
        0 16px 56px rgba(60, 7, 119, 0.35),
        0 4px 16px rgba(60, 7, 119, 0.18);
}

.gs-map-frame__mascot-peek {
    position: absolute;
    top: -20px;
    right: 2.5rem;
    transform: translateY(-60%);
    z-index: -10;
    pointer-events: none;
    filter: drop-shadow(0 4px 10px rgba(60, 7, 119, 0.3));
}

.gs-map-frame__mascot-peek dotlottie-wc {
    display: block;
    width: 160px;
    height: 160px;
    min-height: unset;
}

#svg-container {
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 0.5rem;
    overflow: hidden;
}

#svg-container a,
#svg-container-modal a {
    transition: opacity 0.2s ease;
}

#svg-container a:hover,
#svg-container-modal a:hover {
    opacity: 0.75;
}

/* Mobile CTA card */
.gs-map-mobile-cta {
    background: url('/static/images/map_full.webp') no-repeat center center;
    background-size: cover;
    border-radius: 1.25rem;
    min-height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gs-map-mobile-cta__overlay {
    background: rgba(60, 7, 119, 0.88);
    border-radius: 1.25rem;
    padding: 2rem 1.5rem;
    text-align: center;
    width: 100%;
}

/* Fullscreen map modal */
.gs-map-modal-content {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.gs-map-modal-body {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    flex: 1;
}

#svg-container-modal {
    flex: 1;
    width: 100%;
    min-height: 0;
    overflow: hidden;
}