/* ════════════════════════════════════════════════════════════════════
   pretix-interstitial.css — Zwischenschritt vor dem Ticketdienstleister
   Klick auf einen „Buchen →"-Button öffnet erst ein Overlay, das klar-
   macht: Die Buchung läuft extern über Pretix und öffnet ein neues
   Fenster. Stil übernommen vom thesen-„Profil zurücksetzen"-Modal
   (css/thesen15.css · .v12-modal), auf die Produktseiten-Tokens gemappt.
   ════════════════════════════════════════════════════════════════════ */

body.cu-px-lock{ overflow:hidden; }

.cu-px-modal{
  --ink:var(--color-near-black); --paper:var(--color-white); --graphite:#46484B;
  --blue:var(--color-blue); --blue-wash:var(--color-light-blue);
  --ease-out:cubic-bezier(.22,.61,.36,1);
  position:fixed; inset:0; z-index:1200;
  display:flex; align-items:center; justify-content:center; padding:24px;
}
.cu-px-modal[hidden]{ display:none; }

.cu-px-modal__scrim{
  position:absolute; inset:0; background:rgba(10,10,10,.55);
  opacity:0; transition:opacity .24s var(--ease-out);
}
.cu-px-modal.is-open .cu-px-modal__scrim{ opacity:1; }

.cu-px-modal__dialog{
  position:relative; width:min(440px,100%); box-sizing:border-box;
  background:var(--paper); border:1px solid var(--ink);
  box-shadow:10px 10px 0 -1px var(--blue-wash), 0 30px 60px -24px rgba(10,10,10,.5);
  padding:30px 30px 26px;
  opacity:0; transform:translateY(12px);
  transition:opacity .24s var(--ease-out), transform .24s var(--ease-out);
}
.cu-px-modal.is-open .cu-px-modal__dialog{ opacity:1; transform:none; }

.cu-px-modal__eyebrow{
  display:block; font-family:var(--font-sans-breit); font-size:10px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--blue); margin-bottom:12px;
}
.cu-px-modal__title{
  font-family:var(--font-serif); font-weight:500; font-style:italic; font-size:30px;
  line-height:1.08; letter-spacing:-.02em; color:var(--ink); margin:0 0 12px; text-transform:none;
}
.cu-px-modal__text{
  font-family:var(--font-sans); font-size:15px; line-height:1.6; color:var(--graphite); margin:0 0 24px;
}
.cu-px-modal__text strong{ color:var(--ink); font-weight:600; }

.cu-px-modal__actions{ display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap; }
.cu-px-modal__btn{
  appearance:none; cursor:pointer; font-family:var(--font-sans); font-weight:600; font-size:14px;
  padding:11px 20px; border:1px solid var(--ink); background:var(--paper); color:var(--ink);
  text-decoration:none; display:inline-flex; align-items:center; gap:.4em;
  transition:background .12s var(--ease-out), color .12s var(--ease-out),
             transform .12s var(--ease-out), border-color .12s var(--ease-out);
}
.cu-px-modal__btn:hover{ transform:translateY(-1px); }
.cu-px-modal__btn--ghost{ background:transparent; border-color:rgba(10,10,10,.3); color:var(--graphite); }
.cu-px-modal__btn--ghost:hover{ border-color:var(--ink); color:var(--ink); }
.cu-px-modal__btn--go{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.cu-px-modal__btn--go:hover{ background:var(--blue); border-color:var(--blue); color:var(--paper); }

@media (prefers-reduced-motion:reduce){
  .cu-px-modal__scrim,.cu-px-modal__dialog{ transition:none !important; }
}
