/* Footer Styles */
footer {
    width: 100%;
    background-color: #ffffff;
    /* Hintergrundfarbe: Weiß */
    color: #333;
    /* Textfarbe: Dunkelgrau */
    font-size: 14px;
    /* Grundschriftgröße */
    padding: 10px 0;
    /* Kompakter Abstand oben und unten */
    border-top: 1px solid #e0e0e0;
    /* Dünne obere Linie */
}

/* Allgemeiner Footer-Bereich */
.footer-content {
    width: 100%;
    /* Ganze Breite nutzen */
    max-width: 1200px;
    /* Optional, um eine maximale Breite zu setzen */
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    /* Verteilt die Elemente über die ganze Breite */
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 10px 20px;
    /* Fügt etwas seitlichen Abstand hinzu */
}

.footer-content ul {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 30px;
    /* Größerer Abstand zwischen den Links */
    width: 100%;
    /* Ganze Breite nutzen */
    justify-content: center;
    /* Links zentrieren, alternativ space-between */
}

/* Einzelne Sektionen */
.footer-section {
    flex: 1;
    /* Gleiche Breite für alle Sektionen */
    min-width: 100px;
    /* Mindestbreite für kleinere Bildschirme */
}

.footer-section h3 {
    font-size: 14px;
    /* Kleinere Überschrift */
    margin-bottom: 8px;
    /* Weniger Abstand unterhalb der Überschrift */
    color: #005a9e;
    /* Primärfarbe */
    font-weight: bold;
    text-transform: uppercase;
    /* Überschriften in Großbuchstaben */
}

.footer-section ul {
    list-style: none;
    /* Entfernt Aufzählungszeichen */
    padding: 0;
    /* Kein Innenabstand */
    margin: 0;
    /* Kein Außenabstand */
}

.footer-section ul li {
    margin-bottom: 5px;
    /* Wenig Abstand zwischen Listenelementen */
    font-size: 13px;
    /* Kleinere Schriftgröße */
    line-height: 1.6;
    /* Optimierter Zeilenabstand */
}

.footer-section ul li a {
    text-decoration: none;
    /* Entfernt Unterstreichung */
    color: #333;
    /* Dezente Farbe */
    transition: color 0.3s ease;
    /* Sanfter Hover-Effekt */
}

.footer-section ul li a:hover {
    color: #005a9e;
    /* Hover-Effekt in Primärfarbe */
    text-decoration: underline;
    /* Unterstreichung bei Hover */
}

/* Compliance-Bereich */
.compliance ul li {
    display: flex;
    /* Flexbox zur Ausrichtung */
    align-items: center;
    /* Symbole und Text zentrieren */
    margin-bottom: 5px;
    /* Abstand zwischen den Listenelementen */
    font-size: 13px;
    /* Kleinere Schriftgröße */
}

.compliance ul li i {
    margin-right: 8px;
    /* Platz zwischen Icon und Text */
    color: #005a9e;
    /* Farbe der Symbole */
}

/* Soziale Medien */
.footer-section.social ul {
    display: flex;
    /* Icons in einer Zeile */
    gap: 10px;
    /* Abstand zwischen Icons */
    padding-top: 5px;
    /* Weniger Abstand oben */
    justify-content: flex-start;
    /* Links ausgerichtet */
}

.footer-section.social ul li a {
    font-size: 16px;
    /* Kleinere Icons */
    color: #555;
    transition: color 0.3s ease;
}

.footer-section.social ul li a:hover {
    color: #005a9e;
    /* Hover-Farbe für Icons */
}

.footer-bottom {
    text-align: center;
    /* Zentriert den gesamten Inhalt */
    color: #777;
    /* Dezente Farbe */
    font-size: 12px;
    /* Kleinere Schriftgröße */
    padding: 10px 0;
    /* Kompakter Abstand oben und unten */
    border-top: 1px solid #e0e0e0;
    /* Linie für visuelle Trennung */
    margin-top: 10px;
}

.footer-bottom-content {
    display: flex;
    /* Flexbox für horizontale Ausrichtung */
    align-items: center;
    /* Vertikale Zentrierung */
    justify-content: center;
    /* Horizontale Zentrierung */
    gap: 15px;
    /* Abstand zwischen Text und Icons */
    flex-wrap: wrap;
    /* Anpassung an kleinere Bildschirme */
}

.footer-bottom-content p {
    margin: 0;
    /* Kein zusätzlicher Außenabstand */
}

.social-links {
    display: flex;
    /* Icons nebeneinander */
    gap: 10px;
    /* Abstand zwischen Icons */
    padding: 0;
    margin: 0;
    list-style: none;
    /* Entfernt Aufzählungspunkte */
}

.social-links li a {
    font-size: 16px;
    /* Größe der Icons */
    color: #555;
    /* Standardfarbe der Icons */
    transition: color 0.3s ease;
    /* Sanfter Hover-Effekt */
}

.social-links li a:hover {
    color: #005a9e;
    /* Hover-Farbe */
}