/* Stili globali e reset minimi */
body {
    margin: 0;
    padding: 0;
    font-family: Arial, sans-serif; /* Font di default come nel tuo codice */
    background-image: url('im/sfondo.gif'); /* Sfondo originale */
    background-repeat: repeat;
    color: #000000; /* Colore testo di default */
}

/* Stile per i link generici */
a {
    color: #000080; /* Blu scuro per maggiore contrasto su sfondo chiaro */
    text-decoration: none;
    font-weight: bold;
}

a:hover {
    color: #FFFF00; /* Giallo al passaggio del mouse */
    text-decoration: underline;
}

/* Contenitore principale che centra il contenuto */
.container {
    max-width: 950px; /* Larghezza massima come la tua tabella originale */
    margin: 0 auto;
    padding: 10px; /* Un po' di padding per i bordi */
    background-color: transparent; /* Se necessario, impostalo a un colore per visibilità */
}

/* Header */
.main-header {
    text-align: center;
}

.site-logo {
    max-width: 100%; /* Rende il logo responsivo */
    height: auto;
}

.facebook-link img {
    max-width: 275px; /* Larghezza originale */
    height: auto;
    border: none;
}

.service-description p {
    font-family: Verdana, sans-serif;
    font-size: 18px; /* Taglia 5 del Verdana */
    font-weight: 400;
    color: #000000;
    text-align: center;
}

/* Stili specifici per i link dei numeri di contatto (fisso, cellulare, whatsapp) */
.contact-numbers p {
    margin: 10px 0; /* AUMENTATA L'INTERLINEA (da 5px a 10px) */
    text-align: center; /* Centra il contenuto del paragrafo */
}

.contact-numbers a {
    color: #0000FF; /* Blu normale come in riversamenti.css */
    font-size: 36px; /* AUMENTATO del 50% (da 24px a 36px) */
    font-family: Arial, sans-serif;
    display: inline-block; /* Permette all'area cliccabile di adattarsi al testo */
    text-decoration: none; /* Rimuove la sottolineatura di default */
    padding: 0; /* Rimuove eventuale padding indesiderato */
    /* Rimuovi width: auto; se presente, per non forzare larghezza */
}

/* Nuovo stile per il contenuto interno dei link per controllare l'area cliccabile */
.contact-numbers a span {
    display: inline-flex; /* Usa inline-flex per allineare icona e testo */
    align-items: center; /* Centra verticalmente gli elementi */
}


.contact-numbers a:hover {
    color: #0000CC; /* Blu leggermente più chiaro come in riversamenti.css */
    text-decoration: underline; /* Sottolineatura al hover come in riversamenti.css */
}

.contact-numbers a:active {
    color: #8BBA8B; /* Verde spento al click come in riversamenti.css */
    text-decoration: underline; /* Sottolineatura al click come in riversamenti.css */
}

/* Stile per le icone WhatsApp nei link */
/* SOLO DESKTOP: Icona più grande */
.contact-numbers .whatsapp-link img {
    width: 60px; /* AUMENTATA ulteriormente (da 40px a 60px) */
    height: 60px; /* AUMENTATA ulteriormente (da 40px a 60px) */
    margin-right: 10px; /* Spazio tra icona e testo */
    vertical-align: middle; /* Allinea l'icona al centro del testo */
}

/* Icona WhatsApp nel footer (solo per coerenza se vuoi le stesse dimensioni) */
.collaboration-section a[href*="wa.me"] img {
    width: 60px; /* AUMENTATA ulteriormente (da 40px a 60px) */
    height: 60px; /* AUMENTATA ulteriormente (da 40px a 60px) */
    margin-right: 10px; /* Spazio tra icona e testo */
    vertical-align: middle;
}


/* Sezione Mappa */
.map-section {
    text-align: center;
    margin-top: 20px;
}

.map-heading a {
    font-size: 30pt; /* Dimensione originale */
    color: #0000FF; /* Colore originale del link */
    font-family: Verdana, sans-serif;
    display: block;
    margin-bottom: 20px;
}

.map-image-wrapper {
    text-align: center;
}

.map-image {
    max-width: 100%; /* Rende l'immagine della mappa responsiva */
    height: auto;
    border: none;
}

/* Navigazione HOME / Volantino / Bigliettini */
.navigation-bar {
    margin-top: 30px;
    background-color: #19ADED; /* Colore di sfondo originale */
    padding: 10px 0;
    text-align: center; /* Centra gli elementi della nav */
}

.main-nav a {
    color: #000000; /* Nero per un contrasto sufficiente su sfondo azzurro */
    font-family: Arial, sans-serif;
    font-size: 20px; /* Taglia 5 dell'Arial */
    padding: 0 15px; /* Spaziatura tra i link */
    display: inline-block; /* Per allinearli orizzontalmente */
}

.main-nav span {
    color: #000000; /* Modificato a nero per un contrasto sufficiente su sfondo azzurro */
    font-family: Arial, sans-serif;
    font-size: 20px;
}

/* Sezioni Categorie Servizi */
.service-categories {
    margin-top: 40px;
}

.category-row {
    display: flex; /* Utilizza flexbox per allineare le categorie */
    justify-content: space-around; /* Spazia uniformemente le colonne */
    flex-wrap: wrap; /* Permette il wrapping su più righe in schermi piccoli */
    margin-bottom: 30px; /* Spazio tra le righe */
}

.service-category {
    flex-basis: 30%; /* Tre colonne con un po' di spazio */
    text-align: center;
    padding: 10px;
    margin: 10px; /* Spazio intorno a ogni categoria */
    box-sizing: border-box; /* Include padding e border nella larghezza */
}

.service-category h3 {
    margin-bottom: 10px;
    text-align: center;
}

.service-category h3 a {
    color: #000000; /* Nero per un contrasto sufficiente */
    font-family: Arial, sans-serif;
    font-size: 24px; /* Taglia 6 dell'Arial */
    display: block;
}

.service-category img.service-icon {
    max-width: 100%; /* Rende le icone dei servizi responsive */
    height: auto;
    border: none;
    margin-top: 10px;
}

.empty-category {
    /* Può essere usato per mantenere allineamento se non ci sono 3 elementi perfetti */
    flex-basis: 30%;
    margin: 10px;
}

/* Divisori orizzontali */
hr {
    border: none;
    border-top: 1px solid #FF0000; /* Rosso come da originale */
    margin: 40px 0;
}

.red-divider {
    border-top: 1px solid #FF0000;
}

/* Link Sostituzione LCD */
.lcd-service-link p {
    text-align: center;
    font-family: Verdana, sans-serif;
    font-size: 20px; /* Taglia 5 */
}

.lcd-service-link a {
    color: #0000FF; /* Blu come da originale */
}

/* Sezione Promozione Principale */
.main-promo {
    text-align: center;
    margin-top: 30px;
    /* NUOVA REGOLA AGGIUNTA PER ELIMINARE BORDINO GRIGIO */
    border-bottom: none !important;
}

.promo-text {
    font-family: Arial, sans-serif;
    font-size: 42pt; /* Dimensione grande come da originale */
    font-weight: bold;
    line-height: 1.2; /* Migliora la leggibilità */
    text-align: center; /* Assicurati che il testo del paragrafo sia centrato */
}

/* Stili per il testo rosso "PREZZI CONVENIENTI" */
.promo-highlight-red {
    color: #FF0000; /* Rosso originale */
    font-size: inherit; /* Mantiene la dimensione del promo-text */
    display: block; /* Rende lo span un blocco per centrare il contenuto se necessario */
    text-align: center; /* Centra il contenuto di questo span */
}

.promo-highlight-blue {
    color: #000080; /* Blu originale */
}

.promo-highlight-green {
    color: #008000; /* Verde originale */
}

.wink-icon {
    width: 100px; /* Mantiene la dimensione originale */
    height: 100px;
    vertical-align: middle; /* Allinea l'icona al testo */
    border: none;
}

.tv-lcd-image {
    max-width: 100%; /* Rende l'immagine TV responsiva */
    height: auto;
    border: none;
    margin-top: 20px;
}

/* Footer */
.main-footer {
    text-align: center;
    margin-top: 50px;
    padding-top: 20px;
    /* NUOVA REGOLA AGGIUNTA PER ELIMINARE BORDINO GRIGIO */
    border-top: none !important;
}

/* Rimuove il bordo inferiore dal MAIN che crea la linea grigia */
main.main-content {
    border-bottom: none !important; /* Forza la rimozione del bordo inferiore */
}

.collaboration-section p {
    font-family: Arial, sans-serif;
    color: #000000;
    margin-bottom: 5px;
}

/* Stili per i link del footer */
.collaboration-section a {
    color: #0000FF; /* Blu per l'indirizzo */
    font-size: 36px; /* AUMENTATO del 50% (da 24px a 36px) */
    font-family: Arial, sans-serif;
}

.collaboration-section .saturday-info {
    color: #FF0000; /* Rosso per il sabato */
    font-weight: bold;
    font-size: 36px; /* AUMENTATO del 50% (da 24px a 36px) */
}

.copyright-info p {
    font-family: Verdana, sans-serif;
    font-size: 16px; /* Taglia 4 */
    color: #000000;
    margin-top: 15px;
    margin-bottom: 5px;
}

/* --- Media Queries per la Responsività (Mobile First) --- */
/* Stili per schermi più piccoli (es. smartphone) */
@media (max-width: 768px) {
    .container {
        padding: 10px;
    }

    .site-logo {
        width: 100%; /* Il logo occupa tutta la larghezza disponibile */
        height: auto;
    }

    .facebook-link {
        margin-bottom: 20px;
    }

    .service-description p {
        font-size: 16px; /* Riduci la dimensione del testo per mobile */
        text-align: center;
    }

    /* Regola per i link telefono/whatsapp su mobile */
    .contact-numbers a,
    .collaboration-section a,
    .collaboration-section .saturday-info {
        font-size: 18.24px; /* Mantenuto il 20% in meno rispetto al 28.5px */
    }

    /* Regola per le icone WhatsApp su mobile */
    .contact-numbers .whatsapp-link img,
    .collaboration-section a[href*="wa.me"] img {
        width: 40px; /* RADDOPPIATA (100% in più) rispetto alla base di 20px ANCHE SU MOBILE */
        height: 40px; /* RADDOPPIATA (100% in più) rispetto alla base di 20px ANCHE SU MOBILE */
    }

    .map-heading a {
        font-size: 20pt; /* Riduci la dimensione del titolo mappa */
    }

    .main-nav a {
        font-size: 16px;
        padding: 5px 10px; /* Meno padding per i link di navigazione */
        display: block; /* I link di navigazione si impilano */
        margin-bottom: 5px;
    }

    .main-nav span {
        font-size: 14px;
        display: block;
    }

    .category-row {
        flex-direction: column; /* Le categorie si impilano verticalmente */
        align-items: center; /* Centra le categorie impilate */
    }

    .service-category {
        flex-basis: 90%; /* Le categorie occupano quasi tutta la larghezza */
        margin: 15px 0; /* Più margine verticale tra le categorie */
        padding: 15px;
        border: 1px solid #eee; /* Un leggero bordo per separarle */
    }

    .service-category h3 a {
        font-size: 20px; /* Riduci la dimensione del titolo categoria */
    }

    .promo-text {
        font-size: 20pt; /* Riduci significativamente la dimensione del testo promozionale */
        line-height: 1.5;
    }

    .copyright-info p {
        font-size: 14px; /* Riduci la dimensione del testo nel footer */
    }
}

/* Stili per schermi di tablet (opzionale, tra mobile e desktop) */
@media (min-width: 769px) and (max-width: 1024px) {
    .container {
        max-width: 760px; /* Adatta la larghezza del container per tablet */
    }

    .service-category {
        flex-basis: 45%; /* Due colonne per tablet */
    }

    .main-nav a {
        font-size: 18px;
    }

    .promo-text {
        font-size: 30pt;
    }

    /* Regola per i link telefono/whatsapp su tablet - mantenuta come ultima richiesta per coerenza */
    .contact-numbers a,
    .collaboration-section a,
    .collaboration-section .saturday-info {
        font-size: 30px; /* Mantenuto da richiesta precedente */
    }

    /* Regola per le icone WhatsApp su tablet */
    .contact-numbers .whatsapp-link img,
    .collaboration-section a[href*="wa.me"] img {
        width: 60px; /* RADDOPPIATA (100% in più) rispetto alla base di 20px ANCHE SU TABLET */
        height: 60px; /* RADDOPPIATA (100% in più) rispetto alla base di 20px ANCHE SU TABLET */
    }
}