/* MAPPA OPENSTREETMAP */
.pagina-mappa {
    padding-block: 2rem 4rem;
}

.mappa-descrizione {
    max-width: 48rem;
    margin-block: 0 1.5rem;
}

.mappa-esempio {
    margin-top: 2rem;
}

.mappa-esempio:first-of-type {
    margin-top: 0;
}

.mappa-osm,
.mappa-google {
    min-height: 24rem;
    background: #eef1f3;
}

.mappa-osm-placeholder {
    display: grid;
    min-height: 24rem;
    place-content: center;
    justify-items: center;
    gap: 1rem;
    padding: 1.5rem;
    text-align: center;
}

.mappa-osm-placeholder p {
    margin: 0;
}

.mappa-osm-placeholder button {
    padding: 0.7rem 1rem;
    border: 0;
    color: #fff;
    background: var(--colore-principale);
    cursor: pointer;
}

.mappa-osm-canvas,
.mappa-google-canvas {
    width: 100%;
    height: 450px;
}

@media all and (max-width: 700px) {
    .mappa-osm,
    .mappa-google,
    .mappa-osm-placeholder {
        min-height: 20rem;
    }

    .mappa-osm-canvas,
    .mappa-google-canvas {
        height: 320px;
    }
}