/* Eigene Datei (11.11.): geladen von den Kundenseiten (shop/rahmen, nach shop.css) UND von der Verwaltung (Shop → Marketing → Weihnachten zeigt
   die drei Stufen als Vorschau) – eine Stelle für das Aussehen. */
/* ── Das Weihnachtsbanner (11.11., Dominik: »wirklich Ausnahme«, App\Dienste\Marketing\Weihnachten, shop/teile/weihnachten) – über den
   Sparpaketen, nur von Mitte November bis Heiligabend. Ein ruhiges Tannengrün statt der weißen Shop-Karte: zarter grüner Grund, feine grüne Linie,
   innen eine zweite Haarlinie wie bei einer Grußkarte. Nie Rot, nichts blinkt, nichts bewegt sich. Im dunklen Design (Nacht, Fotobox) abgewandelt.
   Kontrast: Titel Tinte, Satz --neben #5E6168 auf #F2F7F3 5,8 : 1; Baum #2E6A4E auf #F2F7F3 6,1 : 1. ── */
.weihnachten {
    --tanne: #2E6A4E;
    --tanne-grund: #F2F7F3;
    --tanne-linie: #CBDFD2;
    --tanne-ring: rgba(46, 106, 78, 0.08);
    display: flex; align-items: flex-start; gap: 14px; width: 100%; max-width: 560px; margin-top: 24px; padding: 16px 18px 17px 16px;
    border: 1px solid var(--tanne-linie); border-radius: 16px; background: var(--tanne-grund);
    box-shadow: inset 0 0 0 3px var(--tanne-grund), inset 0 0 0 4px var(--tanne-ring);
    color: var(--text, var(--tinte)); text-align: left;
}
.weihnachten .sym { flex: none; width: 24px; height: 24px; margin-top: 1px; color: var(--tanne); }
.weihnachten-text { min-width: 0; }
.weihnachten-titel { margin: 0; color: var(--tinte); font-size: 16px; font-weight: 600; line-height: 1.35; text-wrap: balance; }
.weihnachten-satz { margin: 4px 0 0; color: var(--neben); font-size: 15px; line-height: 1.5; text-wrap: pretty; }
/* Darunter rücken die Sparpakete näher heran – Banner und Pakete gehören zusammen. */
.weihnachten + .titel-kaufen :is(.titel-pakete, .titel-laden) { margin-top: 12px; }
/* Schlichter Kopf: das Banner steht in der Zeile der Taten über »Sparpakete« (eine eigene Reihe); am Rechner rechts, nicht breiter als 480 px. */
.schlicht-taten .weihnachten { flex: 1 1 100%; margin: 10px 0 12px; }
@media (min-width: 900px) {
    .titel-schlicht:has(.weihnachten) .schlicht-taten { max-width: 480px; }
    .schlicht-taten .weihnachten { margin-top: 6px; }
}
/* Mittig gesetzte Köpfe (Album, Nacht, Fotobox, Passepartout): das Banner mittig, der Text darin links. */
:is(.design-nacht .nt-titel, .design-fotobox .fn-titel, .design-album .titel-text, .design-passepartout .titel-text) > .weihnachten { max-width: 440px; margin-inline: auto; }
.design-nacht .weihnachten + .nt-taten, .design-fotobox .weihnachten + .fn-taten { margin-top: 14px; }
/* Nacht: fast schwarz mit einem Hauch Grün, die Linie gedämpft, der Baum hell. Satz #9C988F auf #121915 6,6 : 1; Baum #86BD9B 8,6 : 1. */
.design-nacht .weihnachten { --tanne: #86BD9B; --tanne-grund: #121915; --tanne-linie: #2A3D31; --tanne-ring: rgba(134, 189, 155, 0.10); }
/* Fotobox (Petrol): etwas grüner und heller als der Grund, die Linie wie Tannennadeln im Dunkeln. Satz #B5C1BE auf #1D4741 5,6 : 1. */
.design-fotobox .weihnachten { --tanne: #A3D6B5; --tanne-grund: #1D4741; --tanne-linie: #3C6C5C; --tanne-ring: rgba(163, 214, 181, 0.10); }