/* 1. Hintergrund der gesamten Seite auf das Bus-Gelb setzen */
:root {
    --body-bg: #F6E90E !important;
}

body {
    background-color: #F6E90E !important;
    background-image: none !important;
}
/* 2. Den Header (Bereich oben) in das Bus-Rot tauchen */
.header {
    background-color: #E60012 !important;
    background-image: none !important;
}

/* 3. Den Inhaltsbereich in Weiß absetzen (schwebender Kasten) */
.container-component, .container-main, .main-grid {
    background-color: #ffffff !important;
    border: 2px solid #E60012 !important; /* Roter Rand passend zum Bus */
    border-radius: 8px !important;
    padding: 30px !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2) !important;
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}

/* 4. Die Überschriften in Rot */
h1, h2, h3, .page-header h1 {
    color: #E60012 !important;
}
.readmore-link a {
    background-color: #2C7FB8 !important; /* Das Blau aus Ihrem Logo */
    color: #ffffff !important;
    padding: 10px 20px;
    border-radius: 5px;
    display: inline-block;
    text-decoration: none;
    font-weight: bold;
    margin-top: 15px;
}
.readmore-link a:hover {
    background-color: #E60012 !important; /* Rot beim Drüberfahren */
}
/* Den Footer-Bereich in Bus-Rot färben */
.footer {
    background-color: #E60012 !important; /* Das Rot aus Ihrem Logo */
    color: #ffffff !important; /* Weißer Text */
    padding: 20px 0 !important;
    border-top: 5px solid #F6E90E !important; /* Gelbe Trennlinie */
}

/* Links im Footer weiß machen */
.footer a {
    color: #ffffff !important;
    text-decoration: underline;
    margin: 0 10px;
}

.footer a:hover {
    color: #F6E90E !important; /* Gelb beim Drüberfahren */
}