/*
    about_mobile.css
    Stili specifici per il contenuto della pagina About (versione mobile).
    Questi stili sovrascrivono e affinano quelli di mobile_base.css se necessario.
*/

/* Media Queries per affinamenti su schermi più piccoli */
/* Queste regole sono riprese direttamente dalle media queries del tuo about.css originale,
   ora destinate unicamente alla versione mobile. */

/* Stili per schermi fino a 768px (es. tablet in verticale) */
@media (max-width: 768px) {
    #main-container {
        padding: 15px;
        /* Riduci il padding generale del contenitore */
    }

    #about-content {
        width: 98%;
        /* Aumenta leggermente la larghezza su schermi medi */
        padding: 0 8px;
        /* Riduci leggermente il padding laterale */
    }

    h1 {
        font-size: clamp(1.1em, 4.5vw, 1.6em);
        /* Rendi h1 un po' più piccolo */
    }

    h2 {
        font-size: clamp(0.9em, 3.8vw, 1.3em);
        /* Rendi h2 un po' più piccolo */
        margin: 0.8em 0 0.4em;
        /* Riduci ulteriormente i margini di h2 */
    }

    p,
    ul,
    .contact-emails {
        font-size: clamp(0.78em, 2.2vw, 0.95em);
        /* Rendi il testo un po' più piccolo */
        margin: 0.6em 0;
        /* Riduci ulteriormente i margini del testo */
    }
}

/* Stili per schermi fino a 480px (es. smartphone in verticale) */
@media (max-width: 480px) {
    #main-container {
        padding: 10px;
        /* Ulteriore riduzione del padding */
    }

    #about-content {
        width: 100%;
        /* Occupare quasi tutta la larghezza per dispositivi molto piccoli */
        padding: 0 5px;
        /* Assicurati che ci sia un minimo padding */
    }

    h1 {
        font-size: clamp(1em, 5vw, 1.5em);
    }

    h2 {
        font-size: clamp(0.85em, 4.2vw, 1.1em);
        /* Ulteriore riduzione per h2 */
        margin: 0.7em 0 0.3em;
        /* Ulteriore riduzione dei margini di h2 */
    }

    p,
    ul,
    .contact-emails {
        font-size: clamp(0.72em, 2.8vw, 0.88em);
        /* Ulteriore riduzione del testo */
        margin: 0.5em 0;
        /* Ulteriore riduzione dei margini del testo */
    }
}