/* Peu de pàgina amb columnes */
        footer { /* Estils per al peu de pàgina */
            background: #2c3e50; /* Color de fons blau fosc */
            color: white; /* Text blanc */
            padding: 40px 0 20px; /* Espaiat vertical */
            margin-top: 40px; /* Espai sobre el peu de pàgina */
            border-radius: 10px 10px 0 0; /* Cantonades arrodonides a la part superior */
        }

.footer-content { /* Contenidor per al contingut del peu de pàgina */
            display: flex; /* Utilitza Flexbox per al layout */
            flex-wrap: wrap; /* Permet que les columnes es moguin a la següent línia si cal */
            gap: 30px; /* Espai entre les columnes */
            justify-content: space-between; /* Espai entre les columnes */
        }

 .footer-column { /* Estils per a cada columna del peu de pàgina */
            flex: 1 1 250px; /* Flexibilitat per a adaptar-se a diferents mides */
        }

.footer-column h3 { /* Estils per als títols de les columnes */
            color: #fff; /* Text blanc */
            border-bottom: 2px solid #4a6580; /* Línia sota el títol */
            padding-bottom: 10px; /* Espai sota el títol */
            margin-bottom: 20px; /* Espai sobre el contingut */
        }

 .footer-links { /* Estils per a la llista d'enllaços del peu de pàgina */
            list-style: none; /* Elimina els punts de la llista */
        }
        
        .footer-links li { /* Estils per a cada element de la llista */
            margin-bottom: 10px; /* Espai entre els elements */
        }
        
        .footer-links a { /* Estils per als enllaços del peu de pàgina */
            color: #ccc; /* Color gris clar */
            text-decoration: none; /* Elimina la subratllada */
            transition: color 0.3s; /* Transició suau per al color */
        }
        
        .footer-links a:hover { /* Efecte hover per als enllaços */
            color: white; /* Text blanc al passar el cursor */
        }

.social-links { /* Contenidor per als enllaços socials */
            display: flex; /* Utilitza Flexbox per al layout */
            gap: 15px; /* Espai entre les icones */
            margin-top: 15px; /* Espai sobre les icones */
        }
        
        .social-links a { /* Estils per a cada enllaç social */
            display: inline-block; /* Mostra com a bloc en línia */
            color: white; /* Text blanc */
            background: #4a6580; /* Fons blau */
            width: 40px; /* Amplada de la icona */
            height: 40px; /* Alçada de la icona */
            border-radius: 50%; /* Forma circular */
            text-align: center; /* Centra el text */
            line-height: 40px; /* Centra verticalment el text */
            transition: background 0.3s; /* Transició suau per al fons */
        }
        
        .social-links a:hover { /* Efecte hover per als enllaços socials */
            background: #5d7a97; /* Fons blau més clar */
        }

.copyright { /* Estils per al text de copyright */
            text-align: center; /* Centra el text */
            margin-top: 40px; /* Espai sobre el text */
            padding-top: 20px; /* Espaiat superior */
            border-top: 1px solid #4a6580; /* Línia superior */
        }