/* Winter-Schicht fotomeetup.ch: Weihnachts-Meetup 13.12.2026 (Auftrag Jairo 30.10.2026).
   Ersetzt die Abstimmungs-Fassung vom 26.10.2026 (Sicherung: _ARCHIV\Geloeschte-Dateien\2026-10-30\fotomeetup-dezember\).
   Szene, Schnee, Figuren und Countdown baut winter.js; ohne JavaScript bleibt die Seite vollständig lesbar.
   Entfernen: diese Datei und winter.js aus dem <head> nehmen. */
:root {
  --wi-gold: #E7C877;
  --wi-gold-tief: #B6892E;
  --wi-eis: #CFE6F5;
  --wi-eis-glow: rgba(207, 230, 245, .35);
  --wi-nacht: #0C1824;
  --wi-rot: #D2394A;
  --wi-tanne: #1F5C45;
  --wi-szene-h: clamp(170px, 34vh, 380px);
}

/* ---------- Hero ---------- */
.hero.wi-hat-szene { height: auto; min-height: 100vh; min-height: 100dvh; padding-bottom: var(--wi-szene-h); }
.hero__eyebrow, .hero__date { color: var(--wi-gold) !important; }
.hero__title em { color: var(--wi-gold); text-shadow: 0 0 32px rgba(231, 200, 119, .5); }
/* «Weihnachts-» ist länger als «Foto-»: bei 7rem 12 px breiter als die Spalte (gemessen 30.10. bei 1454 px) */
.hero.wi-hat-szene .hero__title { font-size: clamp(2.6rem, 7.6vw, 6.1rem); }
.hero__overlay { background:
    radial-gradient(ellipse at 50% 0%, rgba(40, 80, 130, .35) 0%, transparent 60%),
    linear-gradient(180deg, rgba(8, 20, 34, .66) 0%, rgba(8, 14, 22, .42) 45%, rgba(8, 10, 14, .9) 100%) !important; }
.wi-hero-zeile { font-family: var(--font-display); font-style: italic; color: var(--wi-eis); font-size: clamp(17px, 4.4vw, 24px); margin: 4px 0 14px; }

.wi-himmel, .wi-schnee-canvas, .wi-szene { position: absolute; left: 0; right: 0; pointer-events: none; }
.wi-himmel { top: var(--chrome-h); bottom: 0; z-index: 1; width: 100%; height: calc(100% - var(--chrome-h)); }
.wi-schnee-canvas { top: var(--chrome-h); bottom: 0; z-index: 3; width: 100%; height: calc(100% - var(--chrome-h)); }
.wi-szene { bottom: -1px; z-index: 2; width: 100%; height: var(--wi-szene-h); }
.hero__content { z-index: 4; }
.hero.wi-hat-szene .hero__content { padding-top: clamp(64px, 10vh, 100px); }
.hero.wi-hat-szene .hero__scroll { display: none; }

/* Sterne, Lichterkette, Hüttenfenster, Rauch */
.wi-stern { animation: wi-funkeln 3.2s ease-in-out infinite; }
@keyframes wi-funkeln { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }
.wi-birne { animation: wi-birne 2.4s ease-in-out infinite; }
.wi-birne-glow { animation: wi-glow 2.4s ease-in-out infinite; }
@keyframes wi-birne { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
@keyframes wi-glow { 0%, 100% { opacity: .08; } 50% { opacity: .55; } }
.wi-kette { transform-box: fill-box; transform-origin: 50% 0; animation: wi-kette-schwingen 6s ease-in-out infinite alternate; }
@keyframes wi-kette-schwingen { from { transform: rotate(-.6deg); } to { transform: rotate(.6deg); } }
.wi-fenster { animation: wi-fenster 4s ease-in-out infinite; }
@keyframes wi-fenster { 0%, 100% { opacity: .85; } 45% { opacity: 1; } 55% { opacity: .7; } }
.wi-rauch { transform-box: fill-box; transform-origin: 50% 100%; animation: wi-rauch 5s ease-out infinite; opacity: 0; }
@keyframes wi-rauch { 0% { opacity: 0; transform: translate(0, 0) scale(.6); } 20% { opacity: .45; } 100% { opacity: 0; transform: translate(18px, -60px) scale(1.8); } }
.wi-baumlicht { animation: wi-birne 1.8s ease-in-out infinite; }

/* ---------- Adventskalender-Countdown ---------- */
.wi-advent { display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px; margin: 0 0 1.6rem; opacity: 0; animation: fadeUp 800ms var(--ease, ease) 600ms forwards; }
.wi-advent__tuer { position: relative; min-width: 64px; padding: 10px 8px 8px; text-align: center; border-radius: 10px;
  background: linear-gradient(180deg, rgba(210, 57, 74, .92), rgba(130, 22, 36, .92)); border: 1px solid rgba(231, 200, 119, .65);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .35), inset 0 0 0 3px rgba(231, 200, 119, .18); overflow: hidden; }
.wi-advent__tuer::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 6px; transform: translateX(-50%); background: rgba(231, 200, 119, .55); }
.wi-advent__tuer::after { content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 6px; transform: translateY(-50%); background: rgba(231, 200, 119, .35); }
.wi-advent__zahl, .wi-advent__wort { position: relative; z-index: 1; display: block; }
.wi-advent__zahl { font-family: var(--font-display); font-weight: 800; font-size: clamp(24px, 6vw, 34px); line-height: 1.05; color: #fff8e6;
  font-variant-numeric: tabular-nums; text-shadow: 0 2px 8px rgba(0, 0, 0, .45); }
.wi-advent__wort { font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: #fbe7b4; margin-top: 3px; text-shadow: 0 1px 4px rgba(0,0,0,.5); }
.wi-advent__tuer.is-neu .wi-advent__zahl { animation: wi-umblaettern .45s ease-out; }
@keyframes wi-umblaettern { from { transform: translateY(-40%) rotateX(70deg); opacity: 0; } to { transform: none; opacity: 1; } }
.wi-advent__text { align-self: center; color: var(--wi-eis); font-size: 14px; max-width: 12rem; line-height: 1.35; }
@media (max-width: 420px) { .wi-advent__tuer { min-width: 0; flex: 1 1 0; padding-inline: 4px; } .wi-advent__text { flex-basis: 100%; max-width: none; } }

/* ---------- Schneekappen auf Karten ---------- */
.price-card, .equipment__col, .payment__card, .wi-vertrag, .form-wrap { position: relative; }
.wi-vertrag .checkbox-field input { flex: none; }
.wave::before, .price-card::before, .equipment__col::before, .payment__card::before, .form-wrap::before {
  content: ''; position: absolute; left: 0; right: 0; top: -11px; height: 24px; pointer-events: none; z-index: 1;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 24'%3E%3Cpath d='M0 13 Q8 3 18 9 Q28 1 40 8 Q52 2 62 10 Q74 0 86 8 Q98 3 108 9 Q120 1 132 8 Q144 3 160 11 L160 15 Q156 15 155 19 Q153 23 151 17 Q148 15 138 16 Q130 16 128 22 Q126 25 124 17 Q118 15 104 16 Q96 16 95 20 Q93 23 91 16 Q80 15 66 16 Q58 16 57 21 Q55 24 53 16 Q44 15 30 16 Q22 16 21 19 Q19 22 17 16 Q8 15 0 16 Z' fill='%23F4F9FD'/%3E%3C/svg%3E") repeat-x 0 0 / 160px 24px;
  filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .25)); }

/* ---------- Symbole an den Abschnittstiteln ---------- */
.wi-ico { display: inline-block; margin-right: .35em; font-style: normal; filter: drop-shadow(0 0 6px var(--wi-eis-glow)); }

/* ---------- Einstieg «Weihnachts-Meetup» ---------- */
.wi-gate { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 16px; overflow: hidden;
  background: radial-gradient(circle at 50% 30%, rgba(60, 110, 160, .45), rgba(8, 10, 14, .97) 65%); backdrop-filter: blur(4px); }
.wi-gate canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.wi-gate__box { position: relative; z-index: 3; max-width: 540px; width: 100%; text-align: center; padding: 30px 22px 30px; border-radius: 22px;
  border: 1px solid rgba(231, 200, 119, .5); background: rgba(12, 20, 30, .93); box-shadow: 0 0 70px rgba(207, 230, 245, .16); }
.wi-gate__bild { display: block; width: 100%; height: auto; max-height: 150px; margin: -6px auto 6px; }
.wi-gate h2 { font-family: var(--font-display); font-size: clamp(26px, 6.8vw, 40px); line-height: 1.12; margin: 6px 0 6px; color: #f5f1e8; overflow-wrap: break-word; hyphens: auto; }
.wi-gate h2 em { color: var(--wi-gold); }
.wi-gate__sub { font-family: var(--font-display); font-style: italic; color: var(--wi-eis); margin: 0 0 22px; font-size: 18px; }
.wi-gate__btns { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.wi-btn { min-height: 48px; padding: 12px 22px; border-radius: 12px; font-size: 16px; font-weight: 700; cursor: pointer; border: 0; font-family: var(--font-body); }
.wi-btn--ja { background: var(--wi-gold); color: #1a1206; box-shadow: 0 0 24px rgba(231, 200, 119, .35); }
.wi-btn--nein { background: transparent; color: #d9e2ea; border: 1px solid rgba(207, 230, 245, .35); }
.wi-btn:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.wi-gate__hinweis { margin: 16px 0 0; font-size: 13px; color: #a9b6c2; }

/* ---------- Schalter unten links: Ton und Bewegung ---------- */
.wi-schalter { position: fixed; left: 16px; bottom: 16px; z-index: 900; display: flex; gap: 10px; }
.wi-schalter button { width: 48px; height: 48px; border-radius: 50%; font-size: 20px; line-height: 1; cursor: pointer; display: grid; place-items: center;
  border: 1px solid rgba(231, 200, 119, .5); background: rgba(12, 20, 30, .9); color: #fff; box-shadow: 0 4px 18px rgba(0, 0, 0, .4); }
.wi-schalter button:focus-visible { outline: 3px solid var(--wi-gold); outline-offset: 3px; }

/* Bewegung angehalten: alles steht (Szene, Laufband, Diashow, Karten) */
html.wi-still *, html.wi-still *::before, html.wi-still *::after { animation-play-state: paused !important; }
html.wi-still .wi-gate * { animation-play-state: running !important; }

/* ---------- Teilnahme-Vereinbarung im Formular ---------- */
.wi-vertrag { margin: 1.75rem 0 1.25rem; padding: 22px 18px 18px; border-radius: 14px; border: 1px solid rgba(231, 200, 119, .45);
  background: linear-gradient(180deg, rgba(14, 26, 38, .92), rgba(10, 14, 20, .92)); min-width: 0; }
.wi-vertrag legend, .wi-vertrag__titel { font-family: var(--font-display); font-size: clamp(1.25rem, 3.6vw, 1.6rem); color: #f5f1e8; margin: 0 0 6px; padding: 0; }
.wi-vertrag__lead { font-size: 14.5px; color: var(--text-muted); margin: 0 0 12px; line-height: 1.55; }
.wi-vertrag__text { max-height: 300px; overflow-y: auto; overscroll-behavior: contain; padding: 14px 14px; border-radius: 10px; background: #fcf9f2; color: #241a0c;
  font-size: 13.5px; line-height: 1.55; border: 1px solid #eadfc4; }
.wi-vertrag__text:focus-visible { outline: 3px solid var(--wi-gold); outline-offset: 2px; }
.wi-vertrag__text b { color: #1A1206; }
.wi-vertrag .checkbox-field { margin-top: 12px; }
.wi-vertrag__sign { margin-top: 14px; }
.wi-vertrag__sign input { font-family: var(--font-display); font-style: italic; font-size: 20px !important; letter-spacing: .01em; }
.wi-vertrag__klein { margin: 10px 0 0; font-size: 12.5px; color: var(--text-muted); }
.wi-vertrag__klein a { color: var(--accent); }

/* ---------- Fuss: Schneemann und Tannen ---------- */
.wi-fuss-szene { display: block; width: 100%; max-width: 980px; height: auto; margin: 0 auto 1.5rem; }
.wi-arm { transform-box: fill-box; transform-origin: 0% 100%; animation: wi-winken 1.6s ease-in-out infinite alternate; }
@keyframes wi-winken { from { transform: rotate(-8deg); } to { transform: rotate(22deg); } }
.wi-fuss-gruss { text-align: center; font-family: var(--font-display); font-style: italic; color: var(--wi-gold); font-size: clamp(18px, 4.6vw, 24px); margin: 0 0 2rem; }

/* ---------- Schneeflocken-Funken bei Klick ---------- */
.wi-funke { position: fixed; z-index: 10000; pointer-events: none; color: var(--wi-eis); font-size: 16px; transform: translate(-50%, -50%);
  animation: wi-jubel 1s ease-out forwards; }
@keyframes wi-jubel { to { transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) rotate(160deg); opacity: 0; } }

@media not all {
  .wi-stern, .wi-birne, .wi-birne-glow, .wi-kette, .wi-fenster, .wi-rauch, .wi-baumlicht, .wi-arm, .wi-advent, .wi-advent__zahl { animation: none !important; opacity: 1; }
  .wi-rauch { opacity: 0 !important; }
}