@charset "utf-8";
/*CSS-Dokument*/

/* ==========================================================
   WUNSCHERFÜLLER 2026 – HINTERGRUNDGESTALTUNG
========================================================== */

#site.weihnachtsseite {
    background-color: #12382D;
    background-image: url('../images/background/weihnachten-hintergrund.webp');
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}


/* ==========================================================
   WUNSCHERFÜLLER 2026 – INHALTSGESTALTUNG
========================================================== */

/* Einleitung auf dem Weihnachtshintergrund */

.wunsch-header {
    color: #ffffff;
    max-width: 850px;
    margin: 45px auto 55px;
    padding: 30px;
    background-color: rgba(12, 45, 34, 0.88);
    border: 1px solid rgba(241, 192, 33, 0.5);
    border-radius: 18px;
}

.wunsch-header h1 {
    color: #f1c021;
    margin-bottom: 20px;
}

.wunsch-jahr {
    color: #f1c021;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.wunsch-motto {
    font-size: 1.3rem;
    font-style: italic;
    color: #f8e2a5;
    margin-bottom: 25px;
}

/* Die beiden Hauptkarten */

.wunsch-card {
    background-color: #f8f2e5;
    color: #545454;
    border-radius: 18px;
    padding: 35px;
    height: 100%;
    border-top: 5px solid #f1c021;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.25);
}

.wunsch-card h2 {
    color: #12382d;
    margin-bottom: 25px;
    text-align: center;
}

.wunsch-card h3 {
    color: #545454;
    font-size: 1.3rem;
    margin-top: 30px;
    margin-bottom: 15px;
}

.wunsch-card li {
    margin-bottom: 10px;
}

/* Kontakt und Geschenkübergabe */

.wunsch-kontakt,
.wunsch-uebergabe {
    background-color: #f8f2e5;
    color: #545454;
    border-radius: 18px;
    padding: 35px;
    margin-top: 35px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.25);
}

.wunsch-kontakt h2,
.wunsch-uebergabe h2 {
    color: #12382d;
    margin-bottom: 20px;
}

.wunsch-mail {
    color: #8b2525;
    font-weight: 700;
    font-size: 1.15rem;
    overflow-wrap: anywhere;
}

.wunsch-mail:hover {
    color: #12382d;
}

.wunsch-datum {
    color: #8b2525;
    font-size: 1.3rem;
    font-weight: 700;
}

/* Abschluss */

.wunsch-abschluss {
    color: #ffffff;
    background-color: rgba(12, 45, 34, 0.88);
    border-radius: 18px;
    padding: 30px;
    margin-top: 35px;
}

.wunsch-abschluss p:first-child {
    color: #f1c021;
    font-size: 1.4rem;
    font-style: italic;
}

/* Smartphone */

@media (max-width: 767px) {

    .wunsch-header {
        margin: 25px auto 35px;
        padding: 22px;
    }

    .wunsch-card,
    .wunsch-kontakt,
    .wunsch-uebergabe {
        padding: 25px 20px;
    }

    .wunsch-header h1 {
        font-size: 1.8rem;
    }

    .wunsch-mail {
        font-size: 1rem;
    }

    #site.weihnachtsseite {
        background-attachment: scroll;
    }
}