/* =========================================================
   consent.css · v8 · Cookie-Zettel im Grunge-Stil (Papier, Malerkrepp, VHS-Knöpfe)
   Beide Knöpfe absichtlich identisch: Ablehnen ist genauso leicht wie Akzeptieren.
   ========================================================= */
.cb {
  position: fixed; z-index: 400; right: 24px; bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  width: min(440px, calc(100vw - 32px)); padding: 26px 22px 20px;
  background: #e9e4dc url("../assets/img/tex_paper.webp") center / cover; background-blend-mode: multiply;
  color: #1d1a1c; font-family: "Archivo", "Helvetica Neue", Arial, sans-serif; font-size: 15px; line-height: 1.45;
  box-shadow: 0 18px 40px rgba(0,0,0,.6);
  clip-path: polygon(0 3%, 9% 0, 23% 2%, 41% 0, 58% 2.5%, 77% 0, 93% 2%, 100% 0, 99% 34%, 100% 68%, 98.5% 100%, 81% 98%, 62% 100%, 44% 97.5%, 27% 100%, 10% 98%, 0 100%, 1.2% 66%, 0 32%);
  transform: translateY(24px) rotate(1.2deg); opacity: 0; transition: transform .45s cubic-bezier(.2,1.4,.4,1), opacity .3s;
}
.cb.is-in { transform: translateY(0) rotate(1.2deg); opacity: 1; }
.cb[hidden] { display: none; }
.cb__tape { position: absolute; left: 50%; top: -4px; width: 96px; height: 22px; margin-left: -48px; background: rgba(233,215,160,.9); transform: rotate(-3deg); box-shadow: 0 1px 2px rgba(0,0,0,.15); }
.cb__eyebrow { margin: 0 0 2px; font-family: "VT323", "Courier New", monospace; font-size: 18px; letter-spacing: .08em; color: #c1272d; }
.cb__title { margin: 0 0 8px; font-family: "Permanent Marker", "Gochi Hand", cursive; font-weight: 400; font-size: 27px; line-height: 1.05; transform: rotate(-1deg); }
.cb__text { margin: 0 0 16px; }
.cb__text b { font-weight: 700; }
.cb__text a { color: inherit; text-decoration-thickness: 2px; text-underline-offset: 2px; text-decoration-color: #e0388f; }
.cb__btns { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cb__btn {
  font-family: "VT323", "Courier New", monospace; font-size: 24px; letter-spacing: .08em; text-transform: uppercase;
  padding: 6px 10px; min-height: 44px; background: #1d1a1c; color: #e9e4dc; border: 0; cursor: pointer;
  box-shadow: 4px 4px 0 #e0388f; transition: transform .15s, box-shadow .15s, background .15s, color .15s;
}
.cb__btn:hover, .cb__btn:focus-visible { background: #d7f23a; color: #0d0b0e; transform: translate(-2px,-2px); box-shadow: 6px 6px 0 #e0388f; outline: none; }
.cb__btn:active { transform: translate(2px,2px); box-shadow: 1px 1px 0 #e0388f; }
.cb__btn:focus-visible { outline: 3px solid #0d0b0e; outline-offset: 2px; }
@media (max-width: 520px) {
  .cb { left: 12px; right: 12px; width: auto; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); padding: 22px 16px 16px; font-size: 14px; }
  .cb__title { font-size: 23px; }
}
@media (prefers-reduced-motion: reduce) { .cb, .cb.is-in { transition: none; } }
.reduced .cb { transition: none; }

/* Rechtliches im Footer und im Index */
.legal { display: flex; flex-wrap: wrap; gap: 6px 14px; font-family: "VT323", "Courier New", monospace; font-size: 19px; letter-spacing: .04em; }
.legal a, .legal button { color: inherit; text-decoration: underline; text-decoration-color: rgba(233,228,220,.4); text-underline-offset: 3px; background: none; border: 0; padding: 0; cursor: pointer; font: inherit; }
.legal a:hover, .legal button:hover, .legal a:focus-visible, .legal button:focus-visible { color: #d7f23a; text-decoration-color: #d7f23a; }
