.cb26-popup {
  --cb26-bg:   #0d2957;
  --cb26-gold: #ffd700;
  --cb26-radius: 1rem;

  width: min(36rem, calc(100vw - 2rem));
  max-height: calc(100dvh - 2rem);
  padding: 0;
  border: 0;
  border-radius: var(--cb26-radius);
  background: #fff;
  color: #212529;
  box-shadow: 0 1.5rem 4rem rgba(13, 41, 87, .35);
  overflow: auto;
  overscroll-behavior: contain;
}
/* Seite dahinter sperren, solange ein Popup offen ist */
html:has(.cb26-popup[open]) { overflow: hidden; }
.cb26-popup::backdrop {
  background: rgba(13, 41, 87, .7);
  backdrop-filter: blur(4px);
}

/* Ein-/Ausblenden */
.cb26-popup[open] { animation: cb26-popup-in .35s cubic-bezier(.2, .8, .2, 1); }
.cb26-popup[open]::backdrop { animation: cb26-popup-fade .35s ease; }
@keyframes cb26-popup-in { from { opacity: 0; transform: translateY(1.5rem) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes cb26-popup-fade { from { opacity: 0; } to { opacity: 1; } }

.cb26-popup__head {
  position: relative;
  overflow: hidden;
  background-color: var(--cb26-bg);
  color: #fff;
  text-align: center;
  padding: 2.5rem 2rem 2rem;
}
.cb26-popup__head::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 15% 15%, rgba(30, 95, 202, .35), transparent 55%),
    radial-gradient(circle at 85% 85%, rgba(255, 215, 0, .15), transparent 50%);
  pointer-events: none;
}
.cb26-popup__icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  background: rgba(255, 215, 0, .12);
  color: var(--cb26-gold);
}
.cb26-popup__icon svg { width: 1.75rem; height: 1.75rem; }
.cb26-popup__title {
  position: relative;
  margin: 1rem 0 0;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.25;
}

/* Leiste mit Hoehe 0, klebt beim Scrollen oben im Dialog: Schliessen bleibt immer erreichbar */
.cb26-popup__bar {
  position: sticky;
  top: 0;
  z-index: 2;
  height: 0;
  display: flex;
  justify-content: flex-end;
}
.cb26-popup__close {
  margin: .75rem .75rem 0 0;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border: 0;
  border-radius: 50%;
  background: rgba(13, 41, 87, .85);
  color: #fff;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .25);
  cursor: pointer;
  transition: background .2s;
}
.cb26-popup__close:hover,
.cb26-popup__close:focus-visible { background: #0d2957; }
.cb26-popup__close:focus-visible { outline: 2px solid var(--cb26-gold); outline-offset: 2px; }
.cb26-popup__close svg { width: 1.1rem; height: 1.1rem; }

.cb26-popup__body { padding: 1.75rem 2rem 2rem; }
.cb26-popup__text { font-size: 1.0625rem; line-height: 1.6; color: #333; }
.cb26-popup__text p:last-child { margin-bottom: 0; }
.cb26-popup__embed { margin-top: 1.5rem; }

/* Formular-Feinschliff (greift auf das eingebettete KlickTipp-Markup) */
.cb26-popup__embed .form-label { font-weight: 500; font-size: .95rem; }
.cb26-popup__embed .form-control { padding: .7rem .9rem; border-radius: .6rem; border-color: #ced4da; }
.cb26-popup__embed .form-control:focus { border-color: #1b56b8; box-shadow: 0 0 0 .2rem rgba(27, 86, 184, .2); }
.cb26-popup__embed .btn-primary {
  width: 100%;
  padding: .85rem 1.5rem;
  border: 0;
  border-radius: .6rem;
  background: var(--cb26-gold);
  color: #0d2957;
  font-weight: 700;
  font-size: 1.05rem;
  transition: transform .15s, box-shadow .15s;
}
.cb26-popup__embed .btn-primary:hover,
.cb26-popup__embed .btn-primary:focus-visible {
  background: #ffe24d;
  color: #0d2957;
  transform: translateY(-1px);
  box-shadow: 0 .5rem 1.25rem rgba(255, 215, 0, .35);
}

.cb26-popup__footnote {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid #eee;
  font-size: .875rem;
  color: #6c757d;
}
.cb26-popup__footnote p:last-child { margin-bottom: 0; }

/* Mobil: Bottom-Sheet */
@media (max-width: 575.98px) {
  .cb26-popup {
    width: 100vw;
    max-width: 100vw;
    max-height: 92dvh;
    margin: auto 0 0;
    border-radius: var(--cb26-radius) var(--cb26-radius) 0 0;
  }
  .cb26-popup[open] { animation-name: cb26-popup-sheet; }
  @keyframes cb26-popup-sheet { from { transform: translateY(100%); } to { transform: none; } }
  .cb26-popup__head { padding: 2rem 1.5rem 1.5rem; }
  .cb26-popup__title { font-size: 1.5rem; }
  .cb26-popup__body { padding: 1.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  .cb26-popup[open],
  .cb26-popup[open]::backdrop { animation: none; }
}

/* Icon aus dem Iconpack (SVG oder Font) */
.cb26-popup__icon svg,
.cb26-popup__icon .iconpack-icon {
  width: 1.75rem;
  height: 1.75rem;
  font-size: 1.75rem;
  line-height: 1;
}