/* =======================================================================
   Viktor Torno — Cookie-Consent (DSGVO)
   Tinte auf Papier, Haarlinien, Tannengrün-Akzent. Nutzt die _ds-Tokens.
   ======================================================================= */
.ck-root, .ck-root * { box-sizing: border-box; }

/* ---------- Einwilligungs-Leiste (unten) ---------- */
.ck-bar{
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 2147483600;
  background: var(--vt-paper, #F5F4F0);
  border-top: 1px solid var(--vt-border, #1A1A1A);
  box-shadow: 0 -10px 30px -18px rgba(10,10,10,.35);
  transform: translateY(110%);
  transition: transform .48s cubic-bezier(.2,.7,.2,1);
  font-family: var(--vt-font-sans, 'Space Grotesk', system-ui, sans-serif);
}
.ck-bar.is-in{ transform: translateY(0); }
.ck-bar__inner{
  max-width: 1240px; margin-inline: auto;
  padding: clamp(1.1rem,2.6vw,1.6rem) clamp(1rem,3vw,2rem);
  display: grid; grid-template-columns: 1fr auto; gap: 1.2rem 2.4rem; align-items: center;
}
@media (max-width: 820px){ .ck-bar__inner{ grid-template-columns: 1fr; } }

.ck-bar__eyebrow{
  font-family: var(--vt-font-mono, 'JetBrains Mono', monospace);
  font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  color: var(--vt-signal, #0F3B2E); display: inline-flex; align-items: center; gap: .6rem;
  margin-bottom: .65rem;
}
.ck-bar__eyebrow::before{ content:""; width: 26px; height: 1px; background: var(--vt-signal, #0F3B2E); }
.ck-bar__text{
  margin: 0; max-width: 64ch; font-size: .95rem; line-height: 1.55;
  color: var(--vt-fg-muted, #595959);
}
.ck-bar__text a{ color: var(--vt-ink, #0A0A0A); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.ck-bar__text a:hover{ text-decoration-thickness: 2px; }

.ck-actions{ display: flex; flex-wrap: wrap; gap: .7rem; align-items: center; }
@media (max-width: 820px){ .ck-actions{ width: 100%; } }

/* Buttons — gleichwertig (DSGVO): Ablehnen so leicht wie Akzeptieren */
.ck-btn{
  appearance: none; cursor: pointer; white-space: nowrap;
  font-family: inherit; font-weight: 600; font-size: .9rem; letter-spacing: -.01em;
  padding: .8rem 1.4rem; border-radius: 999px;
  border: 1px solid var(--vt-ink, #0A0A0A);
  background: var(--vt-paper, #F5F4F0); color: var(--vt-ink, #0A0A0A);
  transition: background .2s cubic-bezier(.2,.7,.2,1), color .2s, border-color .2s, transform .12s;
}
.ck-btn:hover{ background: var(--vt-chalk, #ECECEC); }
.ck-btn:active{ transform: scale(.98); }
.ck-btn--primary{ background: var(--vt-ink, #0A0A0A); color: var(--vt-paper, #F5F4F0); }
.ck-btn--primary:hover{ background: var(--vt-signal, #0F3B2E); border-color: var(--vt-signal, #0F3B2E); color: var(--vt-paper,#F5F4F0); }
.ck-btn--link{
  border: 0; background: none; padding: .8rem .6rem; border-radius: 0;
  font-family: var(--vt-font-mono, monospace); font-size: 11px; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase; color: var(--vt-fg-muted, #595959);
}
.ck-btn--link:hover{ background: none; color: var(--vt-ink, #0A0A0A); }
@media (max-width: 820px){
  .ck-btn{ flex: 1 1 auto; text-align: center; }
  .ck-btn--link{ flex-basis: 100%; }
}

/* ---------- Einstellungen-Dialog ---------- */
.ck-modal{
  position: fixed; inset: 0; z-index: 2147483601;
  display: none; align-items: center; justify-content: center;
  padding: clamp(1rem,4vw,2rem);
  background: rgba(10,10,10,.62);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
  opacity: 0; transition: opacity .3s cubic-bezier(.2,.7,.2,1);
  font-family: var(--vt-font-sans, 'Space Grotesk', system-ui, sans-serif);
}
.ck-modal.is-open{ display: flex; opacity: 1; }
.ck-card{
  width: min(620px, 100%); max-height: 90vh; overflow: auto;
  background: var(--vt-paper-pure, #fff);
  border: 1px solid var(--vt-border, #1A1A1A);
  padding: clamp(1.4rem,3.4vw,2.4rem);
  transform: translateY(12px); transition: transform .3s cubic-bezier(.2,.7,.2,1);
}
.ck-modal.is-open .ck-card{ transform: none; }
.ck-card__eyebrow{
  font-family: var(--vt-font-mono, monospace); font-size: 11px; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase; color: var(--vt-signal, #0F3B2E);
  display: inline-flex; align-items: center; gap: .6rem;
}
.ck-card__eyebrow::before{ content:""; width: 26px; height: 1px; background: var(--vt-signal, #0F3B2E); }
.ck-card__title{
  margin: .8rem 0 0; font-family: var(--vt-font-display, inherit); font-weight: 500;
  font-size: clamp(1.5rem,3.4vw,2rem); letter-spacing: -.03em; line-height: 1.05;
  color: var(--vt-ink, #0A0A0A);
}
.ck-card__lead{ margin: .8rem 0 0; font-size: .95rem; line-height: 1.55; color: var(--vt-fg-muted, #595959); max-width: 54ch; }

.ck-list{ margin: 1.6rem 0 0; border-top: 1px solid var(--vt-border, #1A1A1A); }
.ck-item{
  display: grid; grid-template-columns: 1fr auto; gap: .3rem 1.4rem; align-items: start;
  padding: 1.1rem 0; border-bottom: 1px solid var(--vt-divider, #ECECEC);
}
.ck-item__name{ font-weight: 600; font-size: 1rem; letter-spacing: -.01em; color: var(--vt-ink, #0A0A0A); }
.ck-item__tag{
  font-family: var(--vt-font-mono, monospace); font-size: 9.5px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--vt-fg-subtle, #8A8A8A);
}
.ck-item__desc{ grid-column: 1 / -1; margin: .2rem 0 0; font-size: .86rem; line-height: 1.5; color: var(--vt-fg-muted, #595959); max-width: 52ch; }

/* Schalter */
.ck-switch{ position: relative; width: 46px; height: 26px; flex: none; }
.ck-switch input{ position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.ck-track{
  position: absolute; inset: 0; border-radius: 999px;
  background: var(--vt-mist, #DADADA); border: 1px solid var(--vt-concrete, #8A8A8A);
  transition: background .2s cubic-bezier(.2,.7,.2,1), border-color .2s;
}
.ck-track::after{
  content:""; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px;
  border-radius: 50%; background: var(--vt-paper-pure, #fff);
  box-shadow: 0 1px 2px rgba(10,10,10,.3);
  transition: transform .2s cubic-bezier(.2,.7,.2,1);
}
.ck-switch input:checked + .ck-track{ background: var(--vt-signal, #0F3B2E); border-color: var(--vt-signal, #0F3B2E); }
.ck-switch input:checked + .ck-track::after{ transform: translateX(20px); }
.ck-switch input:disabled + .ck-track{ background: var(--vt-signal, #0F3B2E); border-color: var(--vt-signal, #0F3B2E); opacity: .55; cursor: not-allowed; }
.ck-switch input:focus-visible + .ck-track{ outline: 2px solid var(--vt-ink, #0A0A0A); outline-offset: 2px; }

.ck-card__actions{ margin-top: 1.8rem; display: flex; flex-wrap: wrap; gap: .7rem; }
@media (max-width: 560px){ .ck-card__actions .ck-btn{ flex: 1 1 auto; text-align: center; } }

@media (prefers-reduced-motion: reduce){
  .ck-bar, .ck-modal, .ck-card, .ck-track, .ck-track::after{ transition: none !important; }
}