/* Grundlegendes Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Schriftarten und Farben */
body {
    font-family: 'Roboto', sans-serif; /* Modernere Schriftart */
    background-color: #1a1a1a;
    color: #f0f0f0;
    line-height: 1.6;
}

/* Entfernt Kursivschrift aus dem Address-Bereich */
address {
    font-style: normal; /* Setzt die Schrift auf "normal", statt "italic" */
    line-height: 1.5; /* Optional: Verbessert die Lesbarkeit */
    color: #f0f0f0; /* Optional: Gleiche Farbe wie der restliche Text */
}

/* Header */
header {
    background-color: #333;
    padding: 1rem;
    text-align: center;
}

.logo {
    max-width: 150px;
    height: auto;
    transition: transform 0.3s ease;
}

.logo:hover {
    transform: scale(1.05);
}

/* Links */
a {
    color: #ffffff; /* Weiß für Links */
    text-decoration: none; /* Optional: Unterstreichung entfernen */
}

a:hover {
    color: #ff0000; /* Rot beim Hovern */
    text-decoration: underline; /* Optional: Unterstreichung beim Hovern */
}

/* Einleitung */
.intro {
    text-align: center;
    padding: 2rem;
    background: #262626;
}

.intro h1 {
    font-size: 2.5rem;
    color: #ff0000; /* Farbe aus dem Logo */
    margin-bottom: 1rem;
}

.intro p {
    font-size: 1.2rem;
    margin-bottom: 0.5rem;
}

/* Kompetenzen */
.kompetenzen {
    padding: 2rem;
    background: #333;
}

.kompetenzen h2 {
    font-size: 2rem;
    color: #ff0000;
    text-align: center;
    margin-bottom: 1rem;
}

.kompetenzen ul {
    list-style: none;
    max-width: 800px;
    margin: 0 auto;
}

.kompetenzen li {
    background: #444;
    margin: 0.5rem 0;
    padding: 1rem;
    border-radius: 8px;
}
.kompetenzen li strong {
    font-size: 1.2rem; /* Erhöht die Schriftgröße der Schlagworte */
    font-weight: bold; /* Setzt die Schrift fett */
    color: #000000; /* Passt die Farbe an (optional, passend zum Design) */
}
/* Kontakt */
.kontakt {
    padding: 2rem;
    background: #262626;
    text-align: center;
}

.kontakt address, .kontakt p {
    margin-bottom: 0.5rem;
}
.kontakt h2 {
    color: #ff0000;
}


/* Footer */
footer {
    background-color: #1a1a1a;
    padding: 1rem;
    text-align: center;
    font-size: 0.9rem;
    color: #777;
}

@media (max-width: 768px) {
    .intro h1 {
        font-size: 2rem;
    }

    .kompetenzen ul {
        padding: 0;
    }

    .kompetenzen li {
        font-size: 1rem;
        padding: 0.8rem;
    }
}