@font-face{font-family:"Host Grotesk";src:url(/_vindelis/datei/dateien/hg-400.woff2?v=1) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Host Grotesk";src:url(/_vindelis/datei/dateien/hg-500.woff2?v=1) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Host Grotesk";src:url(/_vindelis/datei/dateien/hg-600.woff2?v=1) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Host Grotesk";src:url(/_vindelis/datei/dateien/hg-800.woff2?v=1) format("woff2");font-weight:800;font-style:normal;font-display:swap}

:root{
  --heidel:#3E0D37; --erika:#6B4E58; --kalk:#A29B84; --flechte:#B6B798;
  --nacht:#22101E; --kw:#F4F2EC;
  --rand:clamp(20px,5vw,72px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:"Host Grotesk",system-ui,sans-serif;font-size:clamp(16px,0.6vw + 13px,19px);line-height:1.5;color:var(--nacht);background:var(--kw);-webkit-font-smoothing:antialiased}
a{color:inherit;text-underline-offset:.18em}
.unsichtbar{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--flechte);outline-offset:4px;border-radius:4px}

/* ---------- Bühne ---------- */
.buehne{position:relative;isolation:isolate;min-height:100vh;min-height:100svh;display:grid;place-items:center;
  padding:clamp(80px,12vh,130px) var(--rand) clamp(110px,16vh,150px);color:#fff;overflow:hidden;
  background:
    radial-gradient(55% 45% at 10% 100%,rgba(28,6,25,.55),transparent 70%),
    radial-gradient(45% 55% at 95% 0%,rgba(128,130,80,.55),transparent 70%),
    radial-gradient(40% 35% at 48% 102%,rgba(150,110,118,.35),transparent 70%),
    linear-gradient(100deg,#3E0D37 0%,#6B4E58 33%,#A29B84 67%,#B6B798 100%)}
.buehne::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.5;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='k'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23k)'/%3E%3C/svg%3E")}
.buehne-inhalt{width:min(100%,980px);display:flex;flex-direction:column;align-items:center;text-align:center}

.jodel{--lw:min(84vw,860px);position:relative;display:block;font:inherit;width:var(--lw);margin:0;padding:0;border:0;background:none;color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent}
.logo{display:block;width:100%;height:auto;fill:currentColor;overflow:visible;
  filter:drop-shadow(calc(var(--lw)*.021) calc(var(--lw)*.021) calc(var(--lw)*.016) rgba(30,9,26,.5))}
.logo g,.logo .hut{transform-box:fill-box;transform-origin:50% 100%}
.logo .g-ex,.logo .hut{transform-origin:50% 50%}
.logo .g-ex{transition:transform .25s ease}
.jodel:hover .g-ex,.jodel:focus-visible .g-ex{transform:translateY(-26px) rotate(8deg)}
.psst{position:absolute;right:0;top:-2.6em;margin:0;font-weight:500;font-size:clamp(13px,1.1vw,16px);line-height:1.2;color:#fff;transform:rotate(-4deg);transform-origin:right bottom;transition:opacity .4s ease;white-space:nowrap}
.psst.weg{opacity:0}

.claim{margin:clamp(30px,4.6vw,58px) 0 0;font-weight:600;font-size:clamp(21px,2.4vw,32px);line-height:1.2;letter-spacing:-.012em;text-wrap:balance;text-shadow:0 1px 18px rgba(30,9,26,.35)}
.countdown{margin-top:clamp(26px,3.6vw,46px);text-shadow:0 1px 14px rgba(30,9,26,.3)}
.cd-label{margin:0 0 12px;font-weight:500;font-size:clamp(14px,1vw,16px);opacity:.92}
.cd-zahlen{display:flex;justify-content:center;gap:clamp(16px,3vw,44px)}
.cd-zahlen span{display:flex;flex-direction:column;align-items:center;min-width:2.4em}
.cd-zahlen b{font-weight:800;font-size:clamp(36px,5vw,66px);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.cd-zahlen small{margin-top:8px;font-weight:500;font-size:clamp(12px,.9vw,14px);opacity:.85}
.countdown.fertig .cd-zahlen{display:none}

.runter{position:absolute;left:50%;bottom:clamp(22px,4vh,40px);transform:translateX(-50%);display:inline-flex;gap:.5em;align-items:center;
  padding:.7em 1.25em;border-radius:999px;background:rgba(255,255,255,.16);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  color:#fff;text-decoration:none;font-weight:600;font-size:15px;white-space:nowrap;transition:background .2s}
.runter:hover{background:rgba(255,255,255,.28)}

/* Jodel-Choreografie: 2.7 s, passend zu den Silben im Ton */
.jodel.jutzt .g-j{animation:jutz-j 2.7s both}
.jodel.jutzt .g-u{animation:jutz-u 2.7s both}
.jodel.jutzt .g-tz{animation:jutz-tz 2.7s both}
.jodel.jutzt .g-ex{animation:jutz-ex 2.7s both}
.jodel.jutzt .hut{animation:jutz-hut 2.7s both}
.jodel.jutzt .logo *{animation-timing-function:cubic-bezier(.45,0,.55,1)}
@keyframes jutz-j{
  0%,8.5%{transform:translateY(0) scale(1,1)} 14%{transform:translateY(-70px) scale(1,1)} 19.5%,52%{transform:translateY(0) scale(1,1)}
  56.7%{transform:translateY(0) scale(1.05,.86)} 61%{transform:translateY(-90px) scale(.97,1.06)} 74%{transform:translateY(-220px) scale(1,1)}
  89%{transform:translateY(0) scale(1.06,.88)} 94%{transform:translateY(0) scale(.98,1.03)} 100%{transform:translateY(0) scale(1,1)}}
@keyframes jutz-u{
  0%,18.1%{transform:translateY(0) scale(1,1)} 23.6%{transform:translateY(-70px) scale(1,1)} 29.1%,52%{transform:translateY(0) scale(1,1)}
  56.7%{transform:translateY(0) scale(1.05,.86)} 61%{transform:translateY(-100px) scale(.97,1.06)} 74%{transform:translateY(-250px) scale(1,1)}
  89%{transform:translateY(0) scale(1.06,.88)} 94%{transform:translateY(0) scale(.98,1.03)} 100%{transform:translateY(0) scale(1,1)}}
@keyframes jutz-tz{
  0%,27.8%{transform:translateY(0) scale(1,1)} 33.3%{transform:translateY(-70px) scale(1,1)} 38.8%,52%{transform:translateY(0) scale(1,1)}
  56.7%{transform:translateY(0) scale(1.04,.88)} 61%{transform:translateY(-95px) scale(.98,1.05)} 74%{transform:translateY(-230px) scale(1,1)}
  89%{transform:translateY(0) scale(1.05,.9)} 94%{transform:translateY(0) scale(.99,1.02)} 100%{transform:translateY(0) scale(1,1)}}
@keyframes jutz-ex{
  0%,37%{transform:translateY(0) scale(1,1) rotate(0deg)} 42.5%{transform:translateY(-80px) scale(1,1) rotate(0deg)} 48%,52%{transform:translateY(0) scale(1,1) rotate(0deg)}
  56.7%{transform:translateY(0) scale(1.06,.84) rotate(0deg)} 61%{transform:translateY(-120px) scale(.96,1.08) rotate(40deg)} 74%{transform:translateY(-300px) scale(1,1) rotate(200deg)}
  89%{transform:translateY(0) scale(1.06,.88) rotate(360deg)} 94%{transform:translateY(0) scale(.98,1.03) rotate(360deg)} 100%{transform:translateY(0) scale(1,1) rotate(360deg)}}
@keyframes jutz-hut{
  0%,57.4%{transform:translateY(0) rotate(0deg)} 66%{transform:translateY(-300px) rotate(120deg)} 78%{transform:translateY(-420px) rotate(260deg)}
  92%{transform:translateY(-60px) rotate(345deg)} 97%{transform:translateY(0) rotate(368deg)} 100%{transform:translateY(0) rotate(360deg)}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .jodel.jutzt .logo *,.logo .g-ex{animation:none!important;transition:none!important}
}

/* ---------- Liste ---------- */
.liste{display:grid;gap:clamp(32px,5vw,88px);max-width:1280px;margin:0 auto;padding:clamp(64px,10vw,140px) var(--rand) clamp(48px,7vw,96px)}
@media (min-width:900px){.liste{grid-template-columns:1.05fr .95fr;align-items:start}}
.kicker{margin:0 0 .7em;font-weight:600;font-size:.82em;color:var(--erika)}
h2{margin:0 0 .5em;font-weight:800;font-size:clamp(34px,4.6vw,62px);line-height:1;letter-spacing:-.028em;text-wrap:balance}
.liste .text p{max-width:33em;margin:0 0 1em}
.formular{position:relative;display:grid;gap:18px;padding:clamp(22px,3vw,40px);background:#fff;border-radius:6px}
.formular label{display:grid;gap:6px;font-weight:600;font-size:.88em}
.formular label span.frei{font-weight:400;color:var(--erika)}
.formular input[type=email],.formular input[type=text],.formular select{width:100%;font:inherit;font-size:16px;font-weight:400;color:var(--nacht);
  padding:.75em .9em;background:#fff;border:1.5px solid var(--kalk);border-radius:4px;appearance:none;-webkit-appearance:none}
.formular select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2322101E' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .9em center;padding-right:2.4em}
.formular input:focus,.formular select:focus{outline:none;border-color:var(--heidel);box-shadow:0 0 0 3px rgba(62,13,55,.16)}
.formular .zustimmung{grid-template-columns:auto 1fr;align-items:start;gap:10px;font-weight:400}
.zustimmung input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--heidel)}
.senden{justify-self:start;font:inherit;font-weight:800;font-size:1.05em;letter-spacing:-.01em;padding:.85em 1.5em;border:0;border-radius:4px;background:var(--heidel);color:#fff;cursor:pointer;transition:background .2s}
.senden:hover{background:#56164E}
.senden:disabled{opacity:.6;cursor:wait}
#liste-meldung{margin:0;min-height:1.5em;font-weight:600}
#liste-meldung[data-state=ok]{color:var(--heidel)}
#liste-meldung[data-state=fehler]{color:#A3243F}
.honig{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}

/* ---------- Partner ---------- */
.partner{max-width:1280px;margin:0 auto;padding:clamp(24px,4vw,56px) var(--rand) clamp(64px,9vw,128px)}
.partner h2{font-size:clamp(28px,3.4vw,46px)}
.partner-intro{margin:-.3em 0 0;color:var(--erika);max-width:36em}
.partner h3{margin:2.2em 0 .9em;font-weight:600;font-size:.82em;color:var(--erika)}
.logos{list-style:none;margin:0;padding:0;display:grid;gap:clamp(8px,1.4vw,16px)}
.logos.gross{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.logos.klein{grid-template-columns:repeat(auto-fill,minmax(118px,1fr))}
.logos a{display:block;aspect-ratio:16/9;padding:7%;background:#fff;border-radius:6px;transition:transform .2s ease}
.logos a:hover{transform:translateY(-3px)}
.logos img{display:block;width:100%;height:100%;object-fit:contain}

/* ---------- Fuss ---------- */
.fuss{background:var(--heidel);color:#fff;padding:clamp(48px,7vw,96px) var(--rand) 32px}
.fuss-raster{max-width:1280px;margin:0 auto;display:grid;gap:32px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.fuss h2{margin:0 0 .6em;font-size:.82em;font-weight:600;letter-spacing:0;opacity:.75}
.fuss p{margin:0}
.fuss-marke{font-weight:800;font-size:30px;line-height:1;letter-spacing:-.02em;margin:0 0 .5em!important}
.fuss details{max-width:1280px;margin:44px auto 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.22)}
.fuss summary{cursor:pointer;font-weight:600;width:max-content}
.fuss details div{max-width:46em;margin-top:12px;font-size:.9em;opacity:.92}
.fuss details p{margin:0 0 .8em}
.fuss-klein{max-width:1280px;margin:28px auto 0!important;font-size:.8em;opacity:.65}