/* Weihnachtsedition – ergänzt style.css, ändert nichts an der Grundgestaltung */
:root{--x-gold:#A8844A;--x-gold-hell:#E9DCC3;--x-tanne:#24322B;--x-creme:#F6F2EA}

/* Hinweisleiste ganz oben */
.x-bar{background:var(--x-tanne);color:#F3EEE4;font-size:14px;letter-spacing:.04em;text-align:center;padding:10px 16px;line-height:1.5}
.x-bar a{color:#F3EEE4;text-decoration:underline;text-underline-offset:3px}
.x-bar a:hover{color:var(--x-gold-hell)}

/* Goldener Akzent */
.x-gold{color:var(--x-gold)}
.x-kicker{display:inline-flex;align-items:center;gap:10px;margin:0 0 22px;font-size:12px;letter-spacing:.28em;color:var(--x-gold);text-transform:uppercase}
.x-kicker::before{content:"";width:28px;height:1px;background:currentColor}

/* Festliche Gutschein-Bühne */
.x-stage{background:var(--x-tanne);color:#F3EEE4;border-radius:24px;overflow:hidden;position:relative}
.x-stage::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 30%,rgba(233,220,195,.16),transparent 45%),radial-gradient(circle at 85% 80%,rgba(168,132,74,.22),transparent 50%);pointer-events:none}
.x-stage h2,.x-stage p{color:inherit}
.x-btn-gold{background:var(--x-gold) !important;color:#FFFFFF !important}
.x-btn-gold:hover{background:#8C6C39 !important}
.x-btn-hell{border:1px solid rgba(243,238,228,.7) !important;color:#F3EEE4 !important}
.x-btn-hell:hover{background:#F3EEE4 !important;color:var(--x-tanne) !important}

/* Gutschein mit Schleife */
.x-ribbon-v,.x-ribbon-h{position:absolute;background:var(--x-gold);pointer-events:none}
.x-ribbon-v{top:0;bottom:0;right:34px;width:12px}
.x-ribbon-h{left:0;right:0;top:41%;height:12px}
.x-bow{position:absolute;right:40px;top:calc(41% + 6px);width:0;height:0;pointer-events:none;z-index:2}
.x-bow::before,.x-bow::after{content:"";position:absolute;top:-14px;width:30px;height:28px;border:5px solid var(--x-gold);background:rgba(250,250,248,.6);box-sizing:border-box}
.x-bow::before{right:2px;border-radius:60% 10% 60% 60%;transform:rotate(-18deg)}
.x-bow::after{left:2px;border-radius:10% 60% 60% 60%;transform:rotate(18deg)}
/* Handy: Karte ist schmaler, Text darf nicht unter die Bänder laufen */
@media (max-width:600px){
  .x-vtext{padding-right:30px}
  .x-vtitle{font-size:22px !important;line-height:1.15}
  .x-vsub{font-size:10px !important;letter-spacing:.14em !important;line-height:1.5}
  .x-ribbon-h{top:33%}
  .x-bow{top:calc(33% + 6px)}
}
@media (max-width:400px){
  .x-vtext{padding-right:14px}
  .x-vtitle{font-size:19px !important}
  .d-voucher img{height:36px !important}
  .x-ribbon-v{right:16px}
  .x-ribbon-h{top:31%}
  .x-bow{right:22px;top:calc(31% + 6px)}
}

/* Aktion nur bis 24.12. zeigen, vor dem 1.12. als Vorankündigung (Klassen setzt das Skript im Kopf von index.html) */
.x-nur-aktion,.x-nur-bald,.x-nur-an{display:none !important}
.x-aktion-sichtbar .x-nur-aktion{display:revert !important}
.x-aktion-sichtbar .x-badge.x-nur-aktion{display:flex !important}
.x-aktion-sichtbar .x-ohne-aktion{display:none !important}
.x-aktion-bald .x-nur-bald,.x-aktion-an .x-nur-an{display:inline !important}

/* Aktion: Bonus-Plakette und Bedingungen */
.x-badge{position:absolute;right:-20px;top:-30px;z-index:3;width:92px;height:92px;border-radius:50%;background:var(--x-gold);color:#FFFFFF;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:Jost,sans-serif;font-size:26px;font-weight:400;line-height:1;transform:rotate(-10deg);box-shadow:0 10px 24px rgba(0,0,0,.3)}
.x-badge small{font-family:Lato,Verdana,sans-serif;font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin-top:5px}
.x-bedingungen{margin:26px 0 0;font-size:13px;line-height:1.6;opacity:.7;max-width:560px}

/* Festtagsfrisuren */
.x-looks{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.x-looks figure{margin:0}
.x-looks figcaption{margin-top:12px;font-size:12px;letter-spacing:.2em;color:#6B6B67}

/* Feiertags-Öffnungszeiten */
.x-hours{border:1px solid var(--x-gold-hell);background:var(--x-creme);border-radius:18px;padding:36px}
.x-todo{background:#FFF1B8;padding:0 4px}

/* Schneefall */
.x-snow{position:fixed;inset:0;pointer-events:none;z-index:60}
@media (prefers-reduced-motion:reduce){.x-snow{display:none}}