/* ───────────────────────────────────────────
   Cookie-Banner + Klick-zum-Laden (DSG/DSGVO)
   Standalone — keine Abhängigkeit von subpage.css
   ─────────────────────────────────────────── */

/* Banner */
.consent{
  position:fixed;
  left:0; right:0; bottom:0;
  z-index:80;
  background:rgba(48,42,39,.96);
  backdrop-filter:blur(18px) saturate(120%);
  -webkit-backdrop-filter:blur(18px) saturate(120%);
  border-top:1px solid rgba(232,229,224,.18);
  color:#E8E5E0;
  font-family:"Switzer","SwitzerLocal","Helvetica Neue",Arial,sans-serif;
  font-size:.92rem;
  line-height:1.55;
  transform:translateY(110%);
  transition:transform .35s ease;
}
.consent.is-visible{ transform:translateY(0); }

.consent__inner{
  max-width:1440px;
  margin:0 auto;
  padding:1.4rem clamp(1.25rem,4vw,2.4rem);
  display:flex;
  align-items:center;
  gap:1.6rem;
  flex-wrap:wrap;
}
.consent__copy{
  flex:1 1 26rem;
  min-width:0;
}
.consent__copy strong{
  display:block;
  font-family:"Satoshi","SatoshiLocal","Helvetica Neue",Arial,sans-serif;
  font-weight:700;
  font-size:1rem;
  letter-spacing:-.01em;
  margin-bottom:.25rem;
}
.consent__copy p{
  margin:0;
  color:rgba(232,229,224,.74);
  max-width:64ch;
}
.consent__copy a{
  color:#D9E6C8;
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
}

.consent__actions{
  display:flex;
  align-items:center;
  gap:.6rem;
  flex-wrap:wrap;
}
.consent__btn{
  display:inline-flex;
  align-items:center;
  font-family:inherit;
  font-weight:500;
  font-size:.85rem;
  letter-spacing:.02em;
  padding:.7rem 1.05rem;
  border:1px solid rgba(232,229,224,.18);
  border-radius:0;
  background:transparent;
  color:#E8E5E0;
  cursor:pointer;
  transition:background .2s, color .2s, border-color .2s;
  white-space:nowrap;
}
.consent__btn:hover{
  border-color:#D9E6C8;
  color:#D9E6C8;
}
.consent__btn--primary{
  background:#D9E6C8;
  border-color:#D9E6C8;
  color:#2a2622;
}
.consent__btn--primary:hover{
  background:#E8F1D9;
  border-color:#E8F1D9;
  color:#2a2622;
}

/* Settings panel */
.consent__settings{
  display:none;
  width:100%;
  margin-top:1rem;
  padding:1.2rem;
  background:rgba(232,229,224,.04);
  border:1px solid rgba(232,229,224,.14);
}
.consent.is-settings .consent__settings{ display:block; }
.consent__row{
  display:flex;
  align-items:flex-start;
  gap:1rem;
  padding:.85rem 0;
  border-bottom:1px solid rgba(232,229,224,.1);
}
.consent__row:last-of-type{ border-bottom:0; }
.consent__row-text{ flex:1 1 auto; min-width:0; }
.consent__row-text b{
  display:block;
  font-family:"Satoshi","SatoshiLocal",sans-serif;
  font-weight:700;
  font-size:.92rem;
  letter-spacing:-.005em;
  margin-bottom:.15rem;
}
.consent__row-text span{
  color:rgba(232,229,224,.62);
  font-size:.84rem;
}
.consent__toggle{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  font-size:.78rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(232,229,224,.62);
  cursor:pointer;
  user-select:none;
}
.consent__toggle input{ position:absolute; opacity:0; pointer-events:none; }
.consent__toggle-track{
  position:relative;
  width:38px; height:20px;
  background:rgba(232,229,224,.18);
  transition:background .2s;
}
.consent__toggle-track::after{
  content:"";
  position:absolute;
  top:2px; left:2px;
  width:16px; height:16px;
  background:#E8E5E0;
  transition:transform .2s, background .2s;
}
.consent__toggle input:checked + .consent__toggle-track{ background:#D9E6C8; }
.consent__toggle input:checked + .consent__toggle-track::after{
  transform:translateX(18px);
  background:#2a2622;
}
.consent__toggle input:disabled + .consent__toggle-track{ opacity:.5; cursor:not-allowed; }

.consent__settings-actions{
  display:flex;
  gap:.6rem;
  margin-top:1rem;
  flex-wrap:wrap;
}

@media (max-width:720px){
  .consent__inner{ padding:1.2rem 1.25rem; gap:1rem; }
  .consent__actions{ width:100%; }
  .consent__btn{ flex:1 1 auto; justify-content:center; }
}

/* ───────────────────────────────────────────
   Klick-zum-Laden — Wistia / Vimeo / Calendly
   ─────────────────────────────────────────── */
.embed-load{
  position:relative;
  cursor:pointer;
  isolation:isolate;
}
.embed-load:focus-visible{
  outline:2px solid #D9E6C8;
  outline-offset:3px;
}

/* When a Wistia swatch is present, darken the stripe placeholder so
   the poster reads clearly. The ::before overlays gradient + grain. */
.embed-load--has-poster::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(40,35,32,.18) 0%, rgba(40,35,32,.52) 100%);
  z-index:1;
  pointer-events:none;
  transition:background .35s ease;
}
.embed-load--has-poster:hover::before{
  background:linear-gradient(180deg, rgba(40,35,32,.08) 0%, rgba(40,35,32,.38) 100%);
}
.embed-load--has-poster .work__play,
.embed-load--has-poster .case__play{
  z-index:2;
  position:relative;
}
.embed-load--has-poster .embed-load__notice{
  z-index:3;
}
/* Notice is hidden by default — the centered play button on each card
   communicates the click affordance. Only shown for error states
   (missing ID, missing URL) via the .is-error modifier. */
.embed-load__notice{
  display:none;
}
.embed-load__notice.is-error{
  position:absolute;
  inset:auto 1rem 1rem 1rem;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.8rem;
  padding:.6rem .8rem;
  background:rgba(48,42,39,.86);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(232,229,224,.18);
  font-family:"Switzer","SwitzerLocal",sans-serif;
  font-size:.7rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(232,229,224,.78);
  pointer-events:none;
}
.embed-load__notice.is-error b{
  font-family:"Satoshi","SatoshiLocal",sans-serif;
  font-weight:700;
  color:#D9E6C8;
}
.embed-load__frame{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  z-index:5;
  border-radius:inherit;
}
.embed-load--has-poster::before,
.embed-load{
  border-radius:inherit;
}
.embed-load.is-loaded .embed-load__notice,
.embed-load.is-loaded .work__play,
.embed-load.is-loaded .case__play,
.embed-load.is-loaded .hero__placeholder-tag,
.embed-load.is-loaded .calendly__inner{
  display:none;
}
.embed-load.is-loaded::before,
.embed-load.is-loaded::after{
  display:none !important;
}
