/* --- Ottimizzazione Splash Screen per Smartphone (Responsive Fedele al PC) --- */
@media screen and (max-width: 767px) {
    #splash-screen {
        padding: 10px !important;
        justify-content: space-between !important;
    }

    /* Compatta l'header in alto */
    .splash-header {
        padding: 5px 10px !important;
    }

    .header-left-group {
        width: 100%;
        max-width: 220px;
        gap: 6px;
        padding-left: 0;
        margin: 0 auto;
    }

    .splash-logo-top {
        max-width: 90px !important;
    }

    .splash-tagline {
        font-size: 0.95rem !important;
        line-height: 1.2 !important;
    }

    /* Contenitore centrale bloccato per mantenere le stesse proporzioni del desktop */
    .splash-center-content {
        flex: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        max-width: 100%;
        margin: 0;
    }

    .italy-map-wrapper {
        position: relative !important;
        width: 100% !important;
        max-width: 320px !important; /* Riduci leggermente a 320px o 300px per farla rientrare nello schermo */
        margin: 0 auto !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }

    .italy-map-img {
        width: 100% !important;
        height: auto !important;
        display: block !important;
        transform: scale(1.3) !important; /* Riduce drasticamente la mappa al 60% */
        margin-left: -25px;
    }

    #pins-container {
        position: absolute !important;
        top: 0 !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        width: 320px !important;
        height: 100% !important;
    }

    /* Adattamento pulito dei pin senza margini negativi errati */
    .map-pin {
        width: 26px !important;
        height: 26px !important;
    }

    /* Dimensioni proporzionate dei pin per smartphone */
    .map-pin.anim-food { width: 28px; height: 28px; }
    .map-pin.anim-comics { width: 28px; height: 28px; }
    .map-pin.anim-folk { width: 26px; height: 26px; }
    .map-pin.anim-wild { width: 24px; height: 24px; }

    /* --- CORREZIONE COORDINATE SPECIFICHE PER I PIN SU MOBILE --- */
    /* Sostituisci i valori percentuali qui sotto con quelli corretti per i pin che su mobile sbavavano fuori */

    .pin-1  { top: -10% !important; left: 20 !important; }
    .pin-2  { top: -12% !important; left: 45% !important; }
    .pin-3  { top: 42% !important; left: 48% !important; }
    .pin-4  { top: -5% !important; left: -5% !important; }
    .pin-5  { top: 12% !important; left: 15% !important; }
    .pin-6  { top: 55% !important; left: 5% !important; }
    .pin-7  { top: 55% !important; left: 68% !important; }
    .pin-8  { top: 20% !important; left: 25% !important; }
    .pin-9  { top: 30% !important; left: 42% !important; }
    .pin-10 { top: 30% !important; left: 30% !important; }
    .pin-11 { top: 22% !important; left: 50% !important; }
    .pin-12 { top: 38% !important; left: 38% !important; }
    .pin-13 { top: 18% !important; left: 38% !important; }
    .pin-14 { top: 105% !important; left: 65% !important; }
    .pin-15 { top: 5% !important; left: 32% !important; }
    .pin-16 { top: 5% !important; left: 22% !important; }
    .pin-17 { top: 100% !important; left: 56% !important; }
    .pin-18 { top: 97% !important; left: 45% !important; }
    .pin-19 { top: -15% !important; left: 33% !important; }
    .pin-20 { top: 2% !important; left: 10% !important; }
    .pin-21 { top: 0% !important; left: 28% !important; }
    .pin-22 { top: 68% !important; left: 78% !important; }
    .pin-23 { top: 58% !important; left: 72% !important; }
    .pin-24 { top: 12% !important; left: -2% !important; }
    .pin-25 { top: 50% !important; left: 52% !important; }
    .pin-26 { top: 45% !important; left: 58% !important; }
    .pin-27 { top: 48% !important; left: 65% !important; }
    .pin-28 { top: 88% !important; left: 75% !important; }
    .pin-29 { top: 78% !important; left: 82% !important; }
    .pin-30 { top: 59% !important; left: 90% !important; }
    .pin-31 { top: 15% !important; left: 30% !important; }
    .pin-32 { top: 70% !important; left: 8% !important; }

    /* Compatta la barra di caricamento in basso */
    .splash-bottom-content {
        margin-bottom: 20px !important;
        max-width: 280px !important;
    }

    .loader-text {
        font-size: 1.1rem !important;
    }

    .progress-bar {
        height: 16px;
    }
}