/* VOSZETT · freiwillige Unterstützung · Vorschaltfenster + Artikelaktion */
:root{
  --vz-support-bg:#fffdf9;
  --vz-support-ink:#17191c;
  --vz-support-muted:#66707a;
  --vz-support-line:#e1e5e8;
  --vz-support-red:#b3131b;
  --vz-support-red-dark:#8f0f15;
  --vz-support-coffee:#72533c;
}

.vz-support-gate[hidden]{display:none!important}
.vz-support-gate{
  position:fixed;
  inset:0;
  z-index:10000;
  display:grid;
  place-items:start center;
  padding:clamp(34px,8vh,78px) 18px 24px;
  overflow:auto;
  background:rgba(12,14,17,.48);
  backdrop-filter:blur(3px) saturate(.72) brightness(.82);
  -webkit-backdrop-filter:blur(3px) saturate(.72) brightness(.82);
}
.vz-support-gate::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 22%,rgba(179,19,27,.09),transparent 34%),
    radial-gradient(circle at 50% 50%,transparent 20%,rgba(0,0,0,.18) 100%);
}
.vz-support-panel{
  position:relative;
  z-index:1;
  width:min(100%,490px);
  max-height:calc(100dvh - 68px);
  overflow:auto;
  border:1px solid rgba(255,255,255,.72);
  border-top:6px solid var(--vz-support-red);
  border-radius:18px;
  background:
    linear-gradient(180deg,#ffffff 0%,#fffdf9 62%,#fbf7f2 100%);
  color:var(--vz-support-ink);
  box-shadow:0 26px 78px rgba(0,0,0,.34),0 3px 12px rgba(0,0,0,.12);
}
.vz-support-brandbar{
  display:flex;
  align-items:center;
  gap:12px;
  padding:20px 22px 0;
}
.vz-support-cup{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  flex:0 0 auto;
  border-radius:50%;
  background:#f5ede6;
  color:var(--vz-support-coffee);
}
.vz-support-cup svg{
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.vz-support-brandcopy{
  min-width:0;
}
.vz-support-wordmark{
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.04rem;
  line-height:1;
  letter-spacing:.08em;
  white-space:nowrap;
}
.vz-support-wordmark .z{color:var(--vz-support-red)}
.vz-support-kicker{
  margin-top:5px;
  color:#7b848c;
  font:800 .62rem/1.1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.vz-support-close{
  position:absolute;
  top:13px;
  right:13px;
  width:34px;
  height:34px;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#78818a;
  font:500 23px/1 Arial,sans-serif;
  cursor:pointer;
}
.vz-support-close:hover,
.vz-support-close:focus-visible{
  background:#f0f2f3;
  color:#17191c;
  outline:none;
}
.vz-support-main{
  padding:17px 22px 20px;
}
.vz-support-main h2{
  max-width:420px;
  margin:0;
  color:#17191c;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.8rem,4.2vw,2.45rem);
  line-height:1.02;
  letter-spacing:-.035em;
  font-weight:800;
}
.vz-support-lead{
  max-width:420px;
  margin:12px 0 0;
  color:#59626b;
  font:500 .9rem/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
.vz-support-lead strong{
  color:#272c31;
  font-weight:800;
}
.vz-support-amounts{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:18px 0 12px;
}
.vz-support-chip{
  min-height:39px;
  padding:8px 13px;
  border:1px solid #d5dadd;
  border-radius:999px;
  background:#fff;
  color:#39424a;
  font:800 .78rem/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  cursor:pointer;
}
.vz-support-chip:hover,
.vz-support-chip:focus-visible{
  border-color:#aeb8bf;
  outline:none;
}
.vz-support-chip.is-selected{
  border-color:var(--vz-support-red-dark);
  background:var(--vz-support-red-dark);
  color:#fff;
}
.vz-support-primary{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  min-height:46px;
  border-radius:8px;
  background:#181b1f;
  color:#fff!important;
  text-decoration:none!important;
  font:850 .86rem/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
.vz-support-primary:hover,
.vz-support-primary:focus-visible{
  background:#2b3035;
  outline:none;
}
.vz-support-trust{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--vz-support-line);
  color:#77818a;
}
.vz-support-trust span{
  padding:0 6px;
  border-right:1px solid #e5e8ea;
  font:700 .64rem/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  text-align:center;
}
.vz-support-trust span:last-child{border-right:0}
.vz-support-legal{
  margin:11px 0 0;
  color:#858d94;
  font:600 .63rem/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
.vz-support-continue{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:40px;
  width:100%;
  margin:10px 0 0;
  border:1px solid #dfe3e6;
  border-radius:8px;
  background:#fff;
  color:#4f5962;
  font:800 .77rem/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  cursor:pointer;
}
.vz-support-continue:hover,
.vz-support-continue:focus-visible{
  border-color:#c8ced3;
  color:#17191c;
  outline:none;
}
.vz-support-continue span{
  font-size:1rem;
  line-height:1;
}
body.vz-support-open{overflow:hidden}

@media(max-width:560px){
  .vz-support-gate{
    padding:18px 12px;
    place-items:center;
  }
  .vz-support-panel{
    width:min(100%,430px);
    max-height:calc(100dvh - 28px);
    border-radius:16px;
  }
  .vz-support-brandbar{
    padding:17px 17px 0;
    gap:10px;
  }
  .vz-support-cup{
    width:38px;
    height:38px;
  }
  .vz-support-main{
    padding:14px 17px 17px;
  }
  .vz-support-main h2{
    font-size:clamp(1.55rem,7vw,1.95rem);
  }
  .vz-support-lead{
    margin-top:10px;
    font-size:.84rem;
  }
  .vz-support-amounts{
    margin-top:15px;
  }
  .vz-support-chip{
    min-height:37px;
    padding:8px 12px;
    font-size:.74rem;
  }
  .vz-support-primary{min-height:44px}
  .vz-support-trust span{font-size:.58rem}
  .vz-support-legal{font-size:.59rem}
}
@media(prefers-reduced-motion:reduce){
  .vz-support-gate *,
  .vz-support-gate *::before,
  .vz-support-gate *::after{scroll-behavior:auto!important;transition:none!important}
}