/* Cookie-Banner & Einstellungen — nutzt die Design-Tokens aus styles.css */
.consent-lock { overflow: hidden !important; }

.consent {
  position: fixed; left: 24px; bottom: 24px; z-index: 80; width: min(460px, calc(100vw - 48px));
  padding: 28px; border: 1px solid rgba(74,230,215,0.35); border-radius: 4px;
  background: rgba(8,8,8,0.94); -webkit-backdrop-filter: blur(18px) saturate(140%); backdrop-filter: blur(18px) saturate(140%);
  box-shadow: 0 30px 90px rgba(0,0,0,0.65);
  opacity: 0; transform: translateY(24px); transition: opacity .6s var(--ease-out), transform .6s var(--ease-out);
}
.consent[hidden], .consent-modal[hidden] { display: none; }
.consent.is-in { opacity: 1; transform: none; }

.consent__eyebrow { margin: 0 0 12px; font-family: var(--font-display); font-weight: 700; font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); }
.consent__title { margin: 0 0 12px; font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 22px; line-height: 1.1; letter-spacing: -0.01em; color: var(--text); }
.consent__text { margin: 0 0 14px; font-size: 14px; line-height: 1.65; color: rgba(255,255,254,0.8); font-weight: 300; }
.consent__text a, .consent__links a { color: var(--text); border-bottom: 1px solid var(--accent); }
.consent__text a:hover, .consent__links a:hover { color: var(--accent); }
.consent__links { display: flex; gap: 18px; margin: 0 0 20px; font-size: 12px; letter-spacing: .04em; }

/* Alle Buttons gleich groß; "Alle akzeptieren" und "Nur notwendige" gleich gewichtet */
.consent__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.consent__btn {
  flex: 1 1 calc(50% - 5px); min-height: 46px; padding: 12px 18px; border-radius: 999px; cursor: pointer;
  font-family: var(--font-display); font-weight: 700; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; text-align: center;
  border: 1px solid transparent; transition: background .3s, color .3s, border-color .3s, transform .3s var(--ease-out);
}
.consent__actions .consent__btn:last-child { flex-basis: 100%; }
.consent__btn--primary { background: var(--accent); color: #000; border-color: var(--accent); }
.consent__btn--primary:hover { background: var(--text); border-color: var(--text); }
.consent__btn--ghost { background: transparent; color: var(--text); border-color: rgba(255,255,255,0.28); }
.consent__btn--ghost:hover { border-color: var(--text); background: rgba(255,255,255,0.06); }
.consent__btn:focus-visible, .consent-modal__close:focus-visible, .consent-cat__details summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* Einstellungen */
.consent-modal { position: fixed; inset: 0; z-index: 85; display: flex; align-items: center; justify-content: center; padding: 20px; opacity: 0; transition: opacity .4s; }
.consent-modal.is-in { opacity: 1; }
.consent-modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.78); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.consent-modal__panel {
  position: relative; width: min(680px, 100%); max-height: min(88vh, 900px); overflow-y: auto; overscroll-behavior: contain;
  padding: 40px; background: #0a0a0a; border: 1px solid rgba(74,230,215,0.35); border-radius: 4px; outline: none;
  box-shadow: 0 40px 120px rgba(0,0,0,0.7);
}
.consent-modal__close { position: absolute; top: 14px; right: 16px; width: 40px; height: 40px; font-size: 28px; line-height: 1; color: var(--muted); cursor: pointer; background: none; border: 0; border-radius: 50%; transition: color .3s; }
.consent-modal__close:hover { color: var(--accent); }
.consent-modal .consent__title { font-size: clamp(24px, 3vw, 32px); }
.consent-cats { margin: 26px 0 8px; border-top: 1px solid var(--line); }
.consent-cat { padding: 22px 0; border-bottom: 1px solid var(--line); }
.consent-cat__head { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.consent-cat__title { display: inline; margin: 0 12px 0 0; font-family: var(--font-display); font-weight: 700; font-size: 16px; color: var(--text); }
.consent-cat__badge { display: inline-block; padding: 4px 10px; border-radius: 999px; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; font-family: var(--font-display); color: var(--accent); border: 1px solid rgba(74,230,215,0.45); }
.consent-cat__desc { margin: 10px 0 12px; font-size: 14px; line-height: 1.65; color: rgba(255,255,254,0.72); font-weight: 300; }
.consent-cat__details summary { cursor: pointer; display: inline-block; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); font-weight: 700; font-family: var(--font-display); }
.consent-cat__details dl { margin: 14px 0 0; display: grid; grid-template-columns: 150px 1fr; gap: 8px 18px; font-size: 13px; line-height: 1.55; }
.consent-cat__details dt { color: var(--muted); }
.consent-cat__details dd { margin: 0; color: rgba(255,255,254,0.85); }
.consent-modal__meta { margin: 18px 0 22px; font-size: 12px; color: var(--muted); letter-spacing: .02em; }

/* Schalter */
.consent-switch { position: relative; flex: 0 0 auto; display: inline-block; width: 50px; height: 28px; cursor: pointer; }
.consent-switch input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; z-index: 2; }
.consent-switch input:disabled { cursor: not-allowed; }
.consent-switch__track { position: absolute; inset: 0; border-radius: 999px; background: #262626; border: 1px solid rgba(255,255,255,0.22); transition: background .3s, border-color .3s; }
.consent-switch__track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: transform .35s var(--ease-out), background .3s; }
.consent-switch input:checked + .consent-switch__track { background: var(--accent); border-color: var(--accent); }
.consent-switch input:checked + .consent-switch__track::after { transform: translateX(22px); background: #000; }
.consent-switch input:disabled:checked + .consent-switch__track { opacity: .55; }
.consent-switch input:focus-visible + .consent-switch__track { outline: 2px solid var(--accent); outline-offset: 3px; }

@media (max-width: 600px) {
  .consent { left: 12px; right: 12px; bottom: 12px; width: auto; padding: 18px 18px 16px; }
  .consent .consent__eyebrow { margin-bottom: 8px; }
  .consent .consent__title { font-size: 18px; margin-bottom: 8px; }
  .consent .consent__text { font-size: 13px; line-height: 1.55; margin-bottom: 10px; }
  .consent .consent__links { margin-bottom: 14px; }
  .consent .consent__actions { gap: 8px; }
  .consent .consent__btn { flex-basis: calc(50% - 4px); min-height: 44px; padding: 10px 6px; font-size: 11px; letter-spacing: .05em; }
  .consent .consent__actions .consent__btn:last-child { flex-basis: 100%; }
  .consent-modal .consent__btn { flex-basis: 100%; }
  .consent-modal { padding: 0; align-items: flex-end; }
  .consent-modal__panel { max-height: 92vh; padding: 28px 22px 24px; border-radius: 4px 4px 0 0; }
  .consent-cat__details dl { grid-template-columns: 1fr; gap: 2px; }
  .consent-cat__details dd { margin-bottom: 8px; }
}
@media (prefers-reduced-motion: reduce) { .consent, .consent-modal, .consent-switch__track, .consent-switch__track::after { transition: none; } }