/* Info-Panel shell (Embed-Chrome). Sichtbar: .is-story-view. Regeln für .info-window-grid = Legacy 3-Spalten, nicht im DOM. */

.info-window[hidden] {
  display: none;
}

body.info-window-open {
  overflow: hidden;
}

body.info-window-open .sidebar-trigger-tab,
body.info-window-open .sidebar-edge-tab,
body.info-window-story-open .sidebar-trigger-tab,
body.info-window-story-open .sidebar-edge-tab,
body.info-window-open.sidebar-open .sidebar-edge-tab,
body.info-window-open.sidebar-pinned .sidebar-edge-tab,
body.info-window-open.sidebar-plus-mobile-open .sidebar-edge-tab,
body.info-window-story-open.sidebar-open .sidebar-edge-tab,
body.info-window-story-open.sidebar-pinned .sidebar-edge-tab,
body.info-window-story-open.sidebar-plus-mobile-open .sidebar-edge-tab {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.info-window-open .quick-nav,
body.info-window-open .sidebar-markers,
body.info-window-open .sidebar-nav,
body.info-window-story-open .quick-nav,
body.info-window-story-open .sidebar-markers,
body.info-window-story-open .sidebar-nav {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Cover bleibt sichtbar (unter Info-Layer), sonst nur auf Desktop (::after ab 1025px) — iPad Landscape ok, Portrait/Phone schwarz. */
body.info-window-story-open .img-panel {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
}

body.info-window-story-open .img-panel .hero-chapter,
body.info-window-story-open .img-panel #chapterLabel,
body.info-window-story-open .img-panel #heroChapter {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.info-window-open #sidebar-panel,
body.info-window-open #sidebar-overlay,
body.info-window-story-open #sidebar-panel,
body.info-window-story-open #sidebar-overlay {
  visibility: hidden !important;
  pointer-events: none !important;
}

body.info-window-open #sidebar-panel,
body.info-window-open.sidebar-open #sidebar-panel,
body.info-window-open.sidebar-pinned #sidebar-panel,
body.info-window-story-open #sidebar-panel,
body.info-window-story-open.sidebar-open #sidebar-panel,
body.info-window-story-open.sidebar-pinned #sidebar-panel {
  transform: translateX(100%) !important;
}

body.info-window-open #sidebarTriggerTab,
body.info-window-open #sidebarPlusTab,
body.info-window-story-open #sidebarTriggerTab,
body.info-window-story-open #sidebarPlusTab {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.info-window-open #sidebar-overlay,
body.info-window-story-open #sidebar-overlay {
  display: none !important;
}

/* Logo über Info-Panel (klickbar zum Cover); Rest der Top-Nav unsichtbar, kein Layer-Konflikt. */
body.info-window-open .top-nav,
body.info-window-story-open .top-nav {
  z-index: 2300;
  pointer-events: none;
}

body.info-window-open .top-nav .nav-logo,
body.info-window-story-open .top-nav .nav-logo {
  pointer-events: auto;
}

body.info-window-open .top-nav .nav-chapters,
body.info-window-open .top-nav .nav-sep,
body.info-window-open .top-nav .menu-btn,
body.info-window-story-open .top-nav .nav-chapters,
body.info-window-story-open .top-nav .nav-sep,
body.info-window-story-open .top-nav .menu-btn {
  visibility: hidden;
  pointer-events: none;
}

/* Soft-Reload + Info-Restore: Cover-Chrome bis Panel sichtbar (kein Blitz). */
body.info-window-restore-boot .sidebar-trigger-tab,
body.info-window-restore-boot .sidebar-edge-tab,
body.info-window-restore-boot .quick-nav,
body.info-window-restore-boot .sidebar-markers,
body.info-window-restore-boot .sidebar-nav,
body.info-window-restore-boot #chapterLabel,
body.info-window-restore-boot #heroChapter,
body.info-window-restore-boot #sidebar-panel,
body.info-window-restore-boot #sidebar-overlay,
body.info-window-restore-boot #sidebarTriggerTab,
body.info-window-restore-boot #sidebarPlusTab,
body.info-window-restore-boot #topNavPanelActions,
body.info-window-restore-boot .top-nav-cover-invite {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.info-window-restore-boot #sidebar-panel,
body.info-window-restore-boot.sidebar-open #sidebar-panel,
body.info-window-restore-boot.sidebar-pinned #sidebar-panel {
  transform: translateX(100%) !important;
}

body.info-window-restore-boot #sidebar-overlay {
  display: none !important;
}

body.info-window-restore-boot .top-nav .nav-chapters,
body.info-window-restore-boot .top-nav .nav-sep,
body.info-window-restore-boot .top-nav .menu-btn {
  visibility: hidden !important;
  pointer-events: none !important;
}

.info-window {
  position: fixed;
  inset: 0;
  z-index: 2200;
}

.info-window-panel {
  position: fixed;
  z-index: 245;
  top: 50%;
  left: 50%;
  width: min(calc(100vw - 56px), 1460px);
  height: min(calc(100vh - 64px), 820px);
  transform: translate(-50%, -50%);
  min-width: var(--oorigin-panel-min-w);
  min-height: var(--oorigin-panel-min-h);
  max-width: calc(100vw - 56px);
  max-height: calc(100vh - 64px);
  box-sizing: border-box;
  display: grid;
  grid-template-rows: auto 1fr;
  border: 1px solid var(--oorigin-info-panel-border, var(--oorigin-panel-border));
  border-radius: var(--oorigin-panel-radius);
  background: var(--oorigin-info-panel-fill, var(--oorigin-panel-fill));
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: var(--oorigin-info-panel-shadow, var(--oorigin-panel-shadow));
  padding: var(--oorigin-panel-padding);
  overflow: hidden;
  --info-divider-line: 1px solid rgba(240, 234, 248, 0.07);
  --info-gap-before-divider: clamp(20px, 3vh, 28px);
  --info-gap-after-divider: clamp(16px, 2.4vh, 22px);
  --info-gap-after-divider-inner: 8px;
  --info-surface-radius: var(--oorigin-frost-panel-radius);
  --info-surface-padding: 15px 24px 30px 17px;
  --info-surface-bg:
    radial-gradient(circle at 84% 86%, rgba(var(--purple-rgb), 0.038), transparent 58%),
    linear-gradient(145deg, rgba(8, 7, 12, 0.18), rgba(8, 7, 12, 0.06) 74%, transparent);
  /* Typo-Skala (alle Browser); Breakpoints überschreiben nur diese Variablen am Panel */
  /* Hero-Titel Spalte 1 („Ein Satz…“): Desktop + 3-Spalten-Landscape hier anpassen (nicht in responsive). */
  --info-fs-chapter: clamp(0.88rem, 1.08vw, 1.02rem);
  --info-fs-title: clamp(2.42rem, 3.9vw, 4.05rem);
  --info-fs-subtitle: clamp(2.1rem, 3.38vw, 3.38rem);
  --info-fs-subtitle-col23: clamp(2.05rem, 3.22vw, 3.22rem);
  --info-fs-lead: clamp(1.12rem, 1.55vw, 1.34rem);
  --info-fs-list: clamp(1.04rem, 1.36vw, 1.14rem);
  --info-fs-copy: clamp(1.02rem, 1.38vw, 1.12rem);
  --info-fs-line: clamp(1.02rem, 1.28vw, 1.1rem);
  --info-fs-line-span: clamp(1.6rem, 2.2vw, 2.05rem);
  --info-fs-line-note: clamp(1.38rem, 1.86vw, 1.74rem);
  --info-fs-focus-title: clamp(1.06rem, 1.26vw, 1.14rem);
  --info-fs-focus-copy: clamp(0.9rem, 0.98vw, 0.98rem);
  --info-fs-cta-label: 0.9rem;
  --info-fs-cta-price: clamp(1.04rem, 1.2vw, 1.1rem);
  --info-fs-cta-detail: clamp(0.8rem, 0.92vw, 0.86rem);
  --info-fs-access-meta: clamp(0.87rem, 1.02vw, 0.93rem);
  /* Story-Layout-Tokens (Embed-Modus): Breakpoints in oorigin-responsive.css */
  --story-pad-x: clamp(10px, 2.4vw, 22px);
  --story-pad-bottom: clamp(32px, 5vh, 56px);
  --story-content-pad-top: clamp(8px, 1.2vh, 16px);
  --story-hero-pad-bottom: clamp(28px, 4vh, 44px);
  --story-section-gap: clamp(40px, 5vh, 60px);
  --story-section-pad-top: clamp(126px, calc(90px + 4.5vh), 142px);
  --story-chapter-gap: clamp(14px, 2vh, 22px);
  --story-heading-gap: clamp(16px, 2.2vh, 24px);
  --story-body-gap: clamp(14px, 2vh, 20px);
  --story-block-gap: clamp(24px, 3vh, 32px);
  --story-quote-pad-y: clamp(18px, 2.4vh, 24px);
  --story-quote-pad-x: clamp(20px, 2.8vw, 28px);
  --story-end-gap: clamp(20px, 3vh, 28px);
  --story-max-w: min(36rem, 100%);
  --story-figure-rail: 0px;
}

.info-window-backdrop {
  position: fixed;
  inset: 0;
  z-index: 238;
  background: var(--oorigin-info-panel-backdrop);
}

/* Anfrage/Einladung offen: nur ein Backdrop (Einladung), Info bleibt für Header. */
body.invite-window-open .info-window-backdrop {
  background: transparent;
}

.info-window-panel:focus {
  outline: none;
}

.info-window-panel:focus-visible {
  outline: none;
}

.info-window-head {
  position: relative;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding: 0 0 10px;
  border-bottom: none;
}

.info-window-story-top-actions {
  display: none;
}

.info-window-panel.is-story-view .info-window-story-top-actions {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  padding-left: 30px;
  margin-right: 8px;
  color: rgba(var(--white-rgb), 0.5);
  font-size: 0.74rem;
  font-weight: 300;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.info-window-story-top-meta {
  color: rgba(var(--white-rgb), 0.92);
  font-weight: 400;
  font-synthesis: weight;
}

.info-window-story-top-link,
.info-window-story-top-cta {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  color: rgba(var(--white-rgb), 0.58);
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  cursor: pointer;
  padding: 0;
}

.info-window-story-top-link {
  color: rgba(var(--white-rgb), 0.92);
  font-weight: 500;
}
.info-window-story-top-link:hover,
.info-window-story-top-link:focus-visible {
  color: rgba(var(--white-rgb), 0.98);
  outline: none;
}

body.oorigin-member-session #infoWindowStoryLoginBtn {
  display: none;
}

/* Kopf-Pill: lila CTA — gut lesbar auf Story-Overlay. */
.info-window-story-top-cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 29px;
  padding: 7px 12px 6px;
  border: 1px solid rgba(var(--purple-rgb), 0.32);
  border-radius: 999px;
  background: rgba(var(--purple-rgb), 0.42);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    0 2px 10px rgba(var(--purple-rgb), 0.12);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  color: rgba(var(--white-rgb), 0.98);
  font-weight: 400;
  font-synthesis: weight;
  text-decoration: none;
  transition:
    border-color 0.42s ease,
    color 0.42s ease,
    background-color 0.42s ease,
    box-shadow 0.42s ease;
}

.info-window-story-top-cta::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0.55;
  background: linear-gradient(
    168deg,
    rgba(255, 255, 255, 0.16) 0%,
    transparent 52%
  );
  transition: opacity 0.42s ease;
}

.info-window-story-top-cta::after {
  content: none;
  display: none;
}

.info-window-story-top-cta:hover,
.info-window-story-top-cta:focus-visible {
  border-color: rgba(var(--purple-rgb), 0.5);
  background-color: rgba(var(--purple-rgb), 0.58);
  color: rgb(var(--white-rgb));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.14),
    0 3px 14px rgba(var(--purple-rgb), 0.2);
  outline: none;
}

.info-window-story-top-cta:hover::before,
.info-window-story-top-cta:focus-visible::before {
  opacity: 0.72;
}

.info-window-head::after {
  content: none;
  display: none;
}

.info-window-close {
  appearance: none;
  -webkit-appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  border: 1px solid rgba(var(--white-rgb), 0.1);
  background: rgba(var(--white-rgb), 0.03);
  color: rgba(var(--white-rgb), 0.56);
  cursor: pointer;
  transition: color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.info-window-close svg,
.info-window-close svg path {
  pointer-events: none;
}

.info-window-close svg {
  width: 12px;
  height: 12px;
  display: block;
}

@media (hover: hover) and (pointer: fine) {
  .info-window-close:hover {
    color: rgba(var(--white-rgb), 0.78);
    border-color: rgba(var(--purple-rgb), 0.26);
    background: rgba(var(--purple-rgb), 0.08);
  }
}

.info-window-close:focus {
  outline: none;
}

.info-window-close:focus-visible {
  color: rgba(var(--white-rgb), 0.78);
  border-color: rgba(var(--purple-rgb), 0.3);
  background: rgba(var(--purple-rgb), 0.08);
  box-shadow: 0 0 0 1px rgba(var(--purple-rgb), 0.24);
  border-radius: 50%;
}

.info-window-grid {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr) 1px minmax(0, 1fr);
  gap: 0;
  height: 100%;
  overflow: hidden;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.info-window-grid::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.info-window-col {
  min-height: 0;
  overflow: hidden;
  padding: clamp(24px, 3.2vw, 42px);
  color: rgba(var(--white-rgb), 0.72);
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.info-window-col::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.info-window-col--one {
  grid-column: 1;
  display: flex;
  flex-direction: column;
}

.info-window-col--two {
  grid-column: 3;
  display: flex;
  flex-direction: column;
}

.info-window-col--three {
  grid-column: 5;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  --info-col-two-slider-gap: calc(clamp(28px, 4.2vh, 38px) + 30px);
}

.info-window-col--three .info-window-note {
  min-height: 0;
}

.info-window-grid::before,
.info-window-grid::after {
  content: '';
  grid-row: 1;
  align-self: stretch;
  width: 100%;
  min-height: 100%;
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(120, 103, 156, 0.3) 18%,
    rgba(120, 103, 156, 0.3) 82%,
    transparent 100%
  );
}

.info-window-grid::before {
  grid-column: 2;
}

.info-window-grid::after {
  grid-column: 4;
}

.info-window-chapter {
  margin: 0 0 clamp(18px, 3vh, 28px);
  color: rgba(var(--purple-rgb), 0.86);
  font-family: var(--font);
  font-size: var(--info-fs-chapter);
  font-weight: 300;
  line-height: 1.35;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.info-window-title {
  margin: 0;
  color: rgba(var(--white-rgb), 0.72);
  font-family: var(--font);
  font-size: var(--info-fs-title);
  font-weight: 100;
  line-height: 1;
  letter-spacing: 0.01em;
  font-synthesis-weight: none;
}

.info-window-title em {
  color: rgba(var(--purple-rgb), 0.82);
  font-style: italic;
  font-weight: 100;
}

.info-window-title-line {
  display: inline-block;
  white-space: nowrap;
}

.info-window-title-accent {
  color: rgba(var(--white-rgb), 0.82);
  font-weight: 200;
}

.info-window-subtitle {
  margin: 0;
  color: rgba(var(--white-rgb), 0.88);
  font-family: 'Cormorant Garamond', serif;
  font-size: var(--info-fs-subtitle);
  font-weight: 300;
  line-height: 1;
  letter-spacing: 0;
}

.info-window-col--two .info-window-subtitle,
.info-window-col--three .info-window-subtitle {
  font-size: var(--info-fs-subtitle-col23);
}

.info-window-lead {
  max-width: 23rem;
  margin: 0;
  color: rgba(var(--white-rgb), 0.7);
  font-size: var(--info-fs-lead);
  font-weight: 400;
  line-height: 1.64;
}

.info-window-note {
  max-width: 23rem;
}

.info-window-finale {
  max-width: 23rem;
  margin-top: var(--info-gap-before-divider);
  padding: var(--info-surface-padding);
  padding-bottom: clamp(22px, 3.2vh, 30px);
  border-radius: var(--info-surface-radius);
  background: var(--info-surface-bg);
}

.info-window-hero-note.info-window-finale {
  padding-left: calc(17px + 8px);
}

.info-window-col--two .info-window-copy--preline {
  max-width: 18rem;
  margin-top: clamp(12px, 2vh, 20px);
  margin-bottom: 0;
  padding-bottom: var(--info-gap-after-divider);
  border-bottom: var(--info-divider-line);
  color: rgba(var(--white-rgb), 0.8);
  font-size: clamp(1rem, 1.38vw, 1.12rem);
  font-style: italic;
  line-height: 1.5;
}

.info-window-col--two {
  --info-col-two-slider-gap: calc(clamp(28px, 4.2vh, 38px) + 30px);
}

.info-window-col--two .info-window-note,
.info-window-col--three .info-window-note {
  position: relative;
  margin-top: clamp(12px, 2vh, 20px);
  padding: 0;
  background: transparent;
  border: none;
}

.info-window-col--two .info-window-note::after,
.info-window-col--three .info-window-note::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  width: min(calc(16.5rem + 20px), calc(92% + 20px), 100%);
  height: 1px;
  margin: 0 auto;
  bottom: calc(-0.5 * var(--info-col-two-slider-gap) - 15.5px);
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(240, 234, 248, 0.065) 22%,
    rgba(240, 234, 248, 0.065) 78%,
    transparent 100%
  );
  pointer-events: none;
}

.info-window-col--two .info-window-finale,
.info-window-col--three .info-window-finale.info-window-closure {
  max-width: 23rem;
  margin-top: var(--info-col-two-slider-gap);
  margin-bottom: 0;
  border-top: var(--info-divider-line);
  padding: calc(var(--info-gap-after-divider) + 15px) 24px clamp(28px, 4vh, 38px) 29px;
  border-radius: var(--info-surface-radius);
  text-align: left;
  background:
    linear-gradient(
      180deg,
      transparent 0%,
      rgba(8, 7, 12, 0.01) 12%,
      rgba(8, 7, 12, 0.045) 45%,
      rgba(8, 7, 12, 0.085) 100%
    ),
    radial-gradient(circle at 84% 86%, rgba(var(--purple-rgb), 0.02), transparent 62%),
    linear-gradient(145deg, rgba(8, 7, 12, 0.08), rgba(8, 7, 12, 0.02) 72%, transparent);
}

.info-window-col--two .info-window-finale .info-window-line--note {
  margin: 0;
  padding: 0;
  border-top: none;
}

.info-window-col--two .info-window-finale .info-window-line--note span {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  justify-content: start;
  gap: 12px;
  margin: 0;
  max-width: 17rem;
  padding-left: 0;
  text-align: left;
  text-wrap: balance;
  font-size: clamp(1.35rem, 1.755vw, 1.638rem);
  line-height: 1.18;
}

.info-window-col--two .info-window-finale .info-window-line--note span i {
  position: relative;
  top: 0;
  flex-shrink: 0;
  align-self: flex-start;
  margin-top: calc(0.5lh - 3px);
  width: 6px;
  height: 6px;
  box-shadow: 0 0 0 5px rgba(var(--purple-rgb), 0.06);
}

.info-window-focus-slider {
  --info-focus-slider-h: 240px;
  --info-focus-gap-above-nav: 0px;
  --info-focus-nav-h: 32px;
  --info-focus-track-h: 188px;
  --info-focus-fade-duration: 1.1s;
  position: relative;
  display: grid;
  grid-template-rows: var(--info-focus-track-h) var(--info-focus-nav-h);
  grid-template-columns: minmax(0, 1fr);
  row-gap: var(--info-focus-gap-above-nav);
  flex: 0 0 auto;
  flex-shrink: 0;
  height: var(--info-focus-slider-h);
  min-height: var(--info-focus-slider-h);
  max-height: var(--info-focus-slider-h);
  box-sizing: border-box;
  overflow: hidden;
}

.info-window-col--two .info-window-finale.info-window-focus-slider,
.info-window-col--three .info-window-finale.info-window-closure,
.info-window-story-end .info-window-finale.info-window-closure {
  padding: max(0px, calc(var(--info-gap-after-divider) + 15px - 20px)) 24px 10px 29px;
  border-top: none;
  border-radius: 0 0 var(--info-surface-radius) var(--info-surface-radius);
  background: transparent;
  overflow: visible;
}

.info-window-col--two .info-window-finale.info-window-focus-slider::before,
.info-window-col--three .info-window-finale.info-window-closure::before,
.info-window-story-end .info-window-finale.info-window-closure::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: -36px;
  bottom: 0;
  z-index: 0;
  pointer-events: none;
  border-radius: 0 0 var(--info-surface-radius) var(--info-surface-radius);
  background:
    linear-gradient(
      180deg,
      transparent 0%,
      rgba(8, 7, 12, 0.012) 20%,
      rgba(8, 7, 12, 0.045) 50%,
      rgba(8, 7, 12, 0.085) 100%
    ),
    radial-gradient(circle at 84% 86%, rgba(var(--purple-rgb), 0.02), transparent 62%),
    linear-gradient(145deg, rgba(8, 7, 12, 0.07), rgba(8, 7, 12, 0.02) 72%, transparent);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.35) 14%, black 30%, black 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.35) 14%, black 30%, black 100%);
}

.info-window-col--two .info-window-finale.info-window-focus-slider > .info-window-focus-track,
.info-window-col--two .info-window-finale.info-window-focus-slider > .info-window-focus-nav,
.info-window-col--three .info-window-finale.info-window-closure > .info-window-closure-lead,
.info-window-col--three .info-window-finale.info-window-closure > .info-window-closure-cta,
.info-window-col--three .info-window-finale.info-window-closure > .info-window-closure-sub,
.info-window-story-end .info-window-finale.info-window-closure > .info-window-closure-lead,
.info-window-story-end .info-window-finale.info-window-closure > .info-window-closure-cta,
.info-window-story-end .info-window-finale.info-window-closure > .info-window-closure-sub {
  position: relative;
  z-index: 1;
}

.info-window-focus-input {
  position: absolute;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  opacity: 0;
  clip-path: inset(50%);
  border: 0;
  white-space: nowrap;
  pointer-events: none;
}

.info-window-focus-track {
  position: relative;
  grid-row: 1;
  grid-column: 1;
  height: var(--info-focus-track-h);
  min-height: var(--info-focus-track-h);
  max-height: var(--info-focus-track-h);
  overflow: hidden;
  box-sizing: border-box;
}

.info-window-focus-slide {
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  padding: 10px 6px 8px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity var(--info-focus-fade-duration) ease-in-out,
    visibility 0s linear var(--info-focus-fade-duration);
}

#infoWindowFocusSlide1:checked ~ .info-window-focus-track .info-window-focus-slide--1,
#infoWindowFocusSlide2:checked ~ .info-window-focus-track .info-window-focus-slide--2,
#infoWindowFocusSlide3:checked ~ .info-window-focus-track .info-window-focus-slide--3,
#infoWindowFocusSlide4:checked ~ .info-window-focus-track .info-window-focus-slide--4,
#infoWindowFocusSlide5:checked ~ .info-window-focus-track .info-window-focus-slide--5 {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    opacity var(--info-focus-fade-duration) ease-in-out,
    visibility 0s linear 0s;
}

.info-window-focus-slider .info-window-cta-label {
  display: block;
  margin: 0 0 clamp(8px, 1.2vh, 12px);
}

.info-window-focus-title {
  max-width: 21.6rem;
  margin: 0;
  color: rgba(var(--white-rgb), 0.76);
  font-size: var(--info-fs-focus-title);
  font-weight: 300;
  line-height: 1.4;
  text-wrap: wrap;
}

.info-window-focus-copy {
  max-width: 20.4rem;
  margin: clamp(8px, 1.2vh, 12px) 0 0;
  color: rgba(var(--white-rgb), 0.52);
  font-size: var(--info-fs-focus-copy);
  font-weight: 300;
  line-height: 1.42;
  text-wrap: wrap;
}

.info-window-focus-nav {
  position: relative;
  grid-row: 2;
  grid-column: 1;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: var(--info-focus-nav-h);
  min-height: var(--info-focus-nav-h);
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  pointer-events: auto;
  justify-self: center;
}

.info-window-focus-dot {
  display: block;
  flex: 0 0 auto;
  box-sizing: border-box;
  width: 10px;
  height: 10px;
  border: 2px solid transparent;
  border-radius: 50%;
  background: rgba(var(--white-rgb), 0.18);
  box-shadow: none;
  cursor: pointer;
  transition: background 0.65s ease-in-out, border-color 0.65s ease-in-out;
}

#infoWindowFocusSlide1:checked ~ .info-window-focus-nav .info-window-focus-dot--1,
#infoWindowFocusSlide2:checked ~ .info-window-focus-nav .info-window-focus-dot--2,
#infoWindowFocusSlide3:checked ~ .info-window-focus-nav .info-window-focus-dot--3,
#infoWindowFocusSlide4:checked ~ .info-window-focus-nav .info-window-focus-dot--4,
#infoWindowFocusSlide5:checked ~ .info-window-focus-nav .info-window-focus-dot--5 {
  background: rgba(var(--purple-rgb), 0.86);
  border-color: rgba(var(--purple-rgb), 0.42);
}

.info-window-focus-dot:hover,
.info-window-focus-dot:focus-visible {
  background: rgba(var(--purple-rgb), 0.72);
  border-color: rgba(var(--purple-rgb), 0.36);
  outline: none;
}

@media (prefers-reduced-motion: reduce) {
  .info-window-focus-slider {
    --info-focus-fade-duration: 0.01s;
  }

  .info-window-focus-dot {
    transition-duration: 0.01s;
  }
}

.info-window-col--three .info-window-note {
  background: transparent;
  margin-top: clamp(12px, 2vh, 20px);
  padding: 0;
}

.info-window-finale > :first-child {
  margin-top: 0;
}

.info-window-finale .info-window-line {
  margin-top: var(--info-gap-before-divider);
  padding-top: var(--info-gap-after-divider);
  border-top: var(--info-divider-line);
}

.info-window-finale .info-window-copy + .info-window-line {
  margin-top: var(--info-gap-before-divider);
}

.info-window-finale > .info-window-line:only-child {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}

.info-window-note .info-window-list {
  margin-top: clamp(12px, 2vh, 20px);
  gap: clamp(11px, 1.55vh, 16px);
}

.info-window-note .info-window-list li {
  color: rgba(var(--white-rgb), 0.66);
  font-size: var(--info-fs-list);
  line-height: 1.54;
}

.info-window-note .info-window-list li::before {
  background: var(--purple);
}

.info-window-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: clamp(18px, 2.8vh, 28px);
}

.info-window-list li {
  position: relative;
  margin: 0;
  padding-left: 14px;
  color: rgba(var(--white-rgb), 0.66);
  font-size: var(--info-fs-list);
  line-height: 1.5;
}

.info-window-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.5lh;
  transform: translateY(-50%);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--purple);
}

.info-window-list span {
  color: rgba(var(--white-rgb), 0.78);
  font-family: inherit;
  font-size: inherit;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
}

.info-window-list span.info-window-list-tags {
  color: rgba(var(--purple-rgb), 0.82);
  font-weight: inherit;
}

.info-window-copy {
  max-width: 21rem;
  margin: 0;
  color: rgba(var(--white-rgb), 0.66);
  font-size: var(--info-fs-copy);
  line-height: 1.52;
}

.info-window-list + .info-window-copy {
  margin-top: clamp(26px, 4.2vh, 44px);
}

.info-window-copy--preline {
  max-width: 18rem;
}

.info-window-copy--transition {
  margin-top: var(--info-gap-before-divider);
  padding-top: var(--info-gap-after-divider);
  border-top: var(--info-divider-line);
  color: rgba(var(--white-rgb), 0.68);
  font-family: inherit;
  font-size: clamp(1rem, 1.3vw, 1.1rem);
  font-weight: 400;
  line-height: 1.5;
}

.info-window-copy + .info-window-copy {
  margin-top: clamp(18px, 3vh, 30px);
}

.info-window-line {
  margin: var(--info-gap-before-divider) 0 0;
  padding-top: var(--info-gap-after-divider);
  border-top: var(--info-divider-line);
  color: rgba(var(--white-rgb), 0.62);
  font-family: var(--font);
  font-size: var(--info-fs-line);
  font-weight: 300;
  line-height: 1.5;
  letter-spacing: 0.02em;
  text-transform: none;
}

.info-window-line span {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin-top: var(--info-gap-after-divider-inner);
  color: rgba(var(--purple-rgb), 0.88);
  font-family: 'Cormorant Garamond', serif;
  font-size: var(--info-fs-line-span);
  font-style: italic;
  line-height: 1.1;
}

.info-window-line span i {
  display: inline-block;
  flex-shrink: 0;
  margin-top: calc(0.5lh - 3.5px);
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--purple);
  box-shadow: 0 0 0 6px rgba(var(--purple-rgb), 0.075);
}

.info-window-line--note span {
  display: block;
  position: relative;
  margin-top: var(--info-gap-after-divider-inner);
  padding-left: 18px;
  font-size: var(--info-fs-line-note);
  line-height: 1.16;
}

.info-window-col--two .info-window-line--note span {
  max-width: 16rem;
  line-height: 1.18;
  text-wrap: balance;
}

.info-window-line--note span i {
  position: absolute;
  left: 0;
  top: calc(0.5lh - 3px);
  width: 6px;
  height: 6px;
  background: var(--purple);
  box-shadow: 0 0 0 5px rgba(var(--purple-rgb), 0.06);
}

.info-window-cta {
  appearance: none;
  display: inline-flex;
  align-self: flex-start;
  width: auto;
  border: 1px solid rgba(var(--purple-rgb), 0.22);
  border-radius: 999px;
  background:
    radial-gradient(ellipse at 70% 110%, rgba(var(--purple-rgb), 0.18) 0%, rgba(var(--purple-rgb), 0.06) 55%, transparent 100%),
    rgba(8, 7, 12, 0.22);
  color: rgba(var(--purple-rgb), 0.78);
  cursor: pointer;
  font: inherit;
  font-size: 0.76rem;
  font-weight: 400;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  box-shadow: inset 0 0 0 1px rgba(var(--purple-rgb), 0.04);
  transition: background 0.25s, border-color 0.25s, color 0.25s, box-shadow 0.25s;
}

.info-window-cta {
  margin: 0;
  padding: 13px 18px 12px;
}

.info-window-cta.info-window-cta--text {
  border: none;
  border-radius: 0;
  box-shadow: none;
  background: none;
  text-transform: none;
  letter-spacing: normal;
}

.info-window-cta:hover:not(.info-window-cta--text),
.info-window-cta:focus-visible:not(.info-window-cta--text) {
  background:
    radial-gradient(ellipse at 70% 110%, rgba(var(--purple-rgb), 0.28) 0%, rgba(var(--purple-rgb), 0.1) 55%, transparent 100%),
    rgba(8, 7, 12, 0.22);
  border-color: rgba(var(--purple-rgb), 0.38);
  color: rgba(var(--purple-rgb), 0.94);
  box-shadow: inset 0 0 0 1px rgba(var(--purple-rgb), 0.08);
  outline: none;
}

.info-window-access {
  max-width: 22rem;
  margin-top: var(--info-gap-before-divider);
  margin-bottom: 4px;
  border-top: var(--info-divider-line);
  padding-top: var(--info-gap-after-divider);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.info-window-col--three .info-window-finale.info-window-closure,
.info-window-story-end .info-window-finale.info-window-closure {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  text-align: center;
  gap: clamp(10px, 1.6vh, 14px);
  padding-bottom: 29px;
}

.info-window-col--three .info-window-closure-lead,
.info-window-story-end .info-window-closure-lead {
  width: 100%;
  max-width: 18.5rem;
  margin: 0 0 10px;
  padding-top: 0;
  border-top: none;
  text-align: center;
}

.info-window-col--three .info-window-closure-lead span,
.info-window-story-end .info-window-closure-lead span {
  display: block;
  justify-content: center;
  text-align: center;
}

.info-window-col--three .info-window-finale.info-window-closure::before,
.info-window-story-end .info-window-finale.info-window-closure::before {
  top: -52px;
  bottom: -6px;
  background:
    linear-gradient(
      180deg,
      transparent 0%,
      rgba(8, 7, 12, 0.006) 28%,
      rgba(8, 7, 12, 0.035) 52%,
      rgba(8, 7, 12, 0.085) 100%
    ),
    radial-gradient(circle at 84% 92%, rgba(var(--purple-rgb), 0.02), transparent 62%),
    linear-gradient(145deg, rgba(8, 7, 12, 0.06), rgba(8, 7, 12, 0.015) 72%, transparent);
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    transparent 16%,
    rgba(0, 0, 0, 0.18) 26%,
    rgba(0, 0, 0, 0.45) 38%,
    black 50%,
    black 100%
  );
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    transparent 16%,
    rgba(0, 0, 0, 0.18) 26%,
    rgba(0, 0, 0, 0.45) 38%,
    black 50%,
    black 100%
  );
}

.info-window-col--three .info-window-finale.info-window-closure,
.info-window-story-end .info-window-finale.info-window-closure {
  max-width: 28rem;
}

.info-window-col--three .info-window-closure-cta,
.info-window-story-end .info-window-closure-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  box-shadow: none;
  cursor: pointer;
  font: inherit;
  text-align: center;
  text-decoration: none;
}

.info-window-col--three .info-window-finale.info-window-closure,
.info-window-story-end .info-window-finale.info-window-closure {
  max-width: 28rem;
  padding-bottom: clamp(25px, calc(1.4vh + 15px), 29px);
}

.info-window-col--three > .info-window-closure-about {
  flex: 0 0 auto;
  width: 100%;
  max-width: 28rem;
  margin-top: clamp(18px, 2.4vh, 24px);
  margin-left: 0;
  padding-top: 0;
  justify-content: center;
}

.info-window-col--three .info-window-finale.info-window-closure > .info-window-closure-sub,
.info-window-story-end .info-window-finale.info-window-closure > .info-window-closure-sub {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.15em;
  width: 100%;
  max-width: 100%;
  margin: clamp(0px, calc(1.6vh - 10px), 4px) 0 0;
  padding: 0;
  color: rgba(var(--white-rgb), 0.58);
  font-size: calc(var(--info-fs-cta-price) * 0.8);
  font-weight: 300;
  letter-spacing: 0.02em;
  line-height: 1.4;
  text-align: center;
}

.info-window-story-end .info-window-closure-sub {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.info-window-story-end .info-window-closure-sub-line {
  display: block;
  max-width: 22rem;
  margin-left: auto;
  margin-right: auto;
  white-space: normal;
}

.info-window-story-end .info-window-finale.info-window-closure::before {
  bottom: 0;
}

.info-window-story-end .info-window-finale.info-window-closure {
  padding-bottom: clamp(28px, 3.4vh, 36px);
}

.info-window-panel-link,
.info-window-col--three > .info-window-closure-about .slider-about-link.info-window-panel-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 6px 10px 6px 4px;
  border: none;
  background: none;
  color: rgba(var(--white-rgb), 0.62);
  cursor: pointer;
  font: inherit;
  font-size: clamp(0.902rem, 1.045vw, 0.968rem);
  font-weight: 400;
  font-style: normal;
  font-synthesis: none;
  letter-spacing: 0.04em;
  line-height: 1.2;
  text-decoration: none;
  border-bottom: none;
  transition: color 0.2s ease;
  -webkit-font-smoothing: antialiased;
}

.info-window-col--three > .info-window-closure-about .slider-about-link.info-window-panel-link {
  gap: 0;
  padding: 5.5px 4px 6.5px 10px;
}

.info-window-col--three > .info-window-closure-about .slider-about-link.info-window-panel-link:focus-visible,
.info-window-col--three > .info-window-closure-about .slider-about-link.info-window-panel-link:active {
  color: var(--purple);
  border-bottom: none;
  outline: none;
}

@media (hover: hover) and (pointer: fine) {
  .info-window-col--three > .info-window-closure-about .slider-about-link.info-window-panel-link:hover {
    color: var(--purple);
    border-bottom: none;
  }
}

.info-window-panel-link svg,
.info-window-col--three > .info-window-closure-about .slider-about-link.info-window-panel-link svg {
  width: 11px;
  height: 11px;
  flex-shrink: 0;
}

.info-window-col--three > .info-window-closure-about .slider-about-link.info-window-panel-link svg {
  margin-left: 4px;
  margin-right: 0;
  padding: 0 0 1px 0;
  box-sizing: content-box;
}

.info-window-col--three .info-window-closure-pill,
.info-window-story-end .info-window-closure-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(var(--purple-rgb), 0.22);
  border-radius: 999px;
  padding: 13px 32px 12px;
  background:
    radial-gradient(ellipse at 70% 110%, rgba(var(--purple-rgb), 0.18) 0%, rgba(var(--purple-rgb), 0.06) 55%, transparent 100%),
    rgba(8, 7, 12, 0.22);
  box-shadow: inset 0 0 0 1px rgba(var(--purple-rgb), 0.04);
  transition: background 0.25s, border-color 0.25s, box-shadow 0.25s;
}

.info-window-col--three .info-window-finale.info-window-closure {
  max-width: calc(32rem + 40px);
  padding-inline: 20px;
  box-sizing: border-box;
}

.info-window-col--three .info-window-finale.info-window-closure > .info-window-closure-sub {
  align-items: stretch;
  padding-inline: 0;
  box-sizing: border-box;
}

.info-window-col--three .info-window-closure-sub-line {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  white-space: normal;
  text-wrap: wrap;
}

@media (max-width: 40rem) {
  .info-window-col--three .info-window-finale.info-window-closure {
    max-width: calc(26rem + 40px);
  }

  .info-window-story-end .info-window-closure-sub-line {
    white-space: normal;
  }
}

.info-window-col--three .info-window-closure-cta .info-window-cta-label,
.info-window-story-end .info-window-closure-cta .info-window-cta-label,
.info-window-focus-slider .info-window-cta-label {
  color: rgba(var(--purple-rgb), 0.82);
  font-size: var(--info-fs-cta-label);
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.35;
  transition: color 0.2s ease;
}

.info-window-col--three .info-window-closure-cta:focus,
.info-window-story-end .info-window-closure-cta:focus {
  outline: none;
}

.info-window-col--three .info-window-closure-cta:focus-visible .info-window-closure-pill,
.info-window-story-end .info-window-closure-cta:focus-visible .info-window-closure-pill {
  box-shadow:
    inset 0 0 0 1px rgba(var(--purple-rgb), 0.22),
    0 0 0 1px rgba(var(--purple-rgb), 0.35);
}

@media (hover: hover) and (pointer: fine) {
  .info-window-col--three .info-window-closure-cta:hover .info-window-closure-pill,
  .info-window-story-end .info-window-closure-cta:hover .info-window-closure-pill {
    background:
      radial-gradient(ellipse at 70% 110%, rgba(var(--purple-rgb), 0.28) 0%, rgba(var(--purple-rgb), 0.1) 55%, transparent 100%),
      rgba(8, 7, 12, 0.22);
    border-color: rgba(var(--purple-rgb), 0.38);
    box-shadow: inset 0 0 0 1px rgba(var(--purple-rgb), 0.08);
  }

  .info-window-col--three .info-window-closure-cta:hover .info-window-cta-label,
  .info-window-story-end .info-window-closure-cta:hover .info-window-cta-label {
    color: rgba(var(--purple-rgb), 0.94);
  }
}

.info-window-access-meta {
  max-width: 8.4rem;
  margin-top: 2px;
  color: rgba(var(--white-rgb), 0.48);
  font-size: var(--info-fs-access-meta);
  line-height: 1.42;
}

.info-window-access-meta span {
  display: block;
  margin-top: 6px;
  color: rgba(var(--white-rgb), 0.72);
  font-weight: 400;
  letter-spacing: 0.02em;
}

.info-window-col--three .info-window-access-meta {
  max-width: 14rem;
  margin-top: 0;
  text-align: center;
  color: rgba(var(--white-rgb), 0.52);
  font-size: var(--info-fs-access-meta);
  line-height: 1.48;
}

.info-window-col--three .info-window-access-price {
  margin: 0;
  text-align: center;
  color: rgba(var(--white-rgb), 0.8);
  font-size: clamp(0.92rem, 1.06vw, 0.98rem);
  font-weight: 400;
  letter-spacing: 0.03em;
  line-height: 1.4;
}

.info-window-hero-note .info-window-lead {
  max-width: 23rem;
  margin-bottom: clamp(12px, 2vh, 18px);
}

.info-window-hero-note .info-window-hero-list {
  max-width: 23rem;
  margin: 0;
  gap: clamp(5px, calc(1.5vh - 5px), 9px);
}

.info-window-hero-note .info-window-hero-list li {
  color: rgba(var(--white-rgb), 0.58);
  font-size: var(--info-fs-list);
  font-weight: 300;
  line-height: 1.52;
  letter-spacing: 0.02em;
}

.info-window-hero-note .info-window-hero-list li::before {
  background: var(--purple);
}

.info-window-back {
  display: none;
}

.info-window-panel.is-story-view {
  --story-figure-rail: 0px;
  --story-max-w: 100%;
  --info-story-scrollbar-hit: 12px;
  inset: 0;
  width: auto;
  height: auto;
  max-width: none;
  max-height: none;
  min-width: 0;
  min-height: 0;
  transform: none;
  border-radius: 0;
  border: 0;
  position: fixed;
  isolation: isolate;
  overflow: hidden;
  background: var(--oorigin-info-panel-fill, var(--oorigin-panel-fill)) !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
  padding: max(12px, env(safe-area-inset-top, 0px))
    max(12px, env(safe-area-inset-right, 0px))
    max(12px, env(safe-area-inset-bottom, 0px))
    max(12px, env(safe-area-inset-left, 0px));
}

.info-window-panel.is-story-view::before,
.info-window-panel.is-story-view::after {
  content: none;
  display: none;
}

.info-window-panel.is-story-view .info-window-grid {
  display: none;
}

.info-window-panel.is-story-view .info-window-head {
  position: relative;
  z-index: 1;
  padding-top: 15px;
  padding-right: calc(max(4px, env(safe-area-inset-right, 0px)) + 30px);
  padding-left: max(4px, env(safe-area-inset-left, 0px));
  padding-bottom: 10px;
  background: transparent;
}

.info-window-panel.is-story-view .info-window-close {
  margin-top: 0;
  margin-right: 0;
  margin-left: 20px;
  align-self: center;
  font-weight: 400;
  font-synthesis: weight;
  border: none;
  background-color: transparent;
  background-image: radial-gradient(
    circle at 50% 48%,
    rgba(var(--purple-rgb), 0.11) 0%,
    rgba(var(--purple-rgb), 0.055) 36%,
    rgba(var(--purple-rgb), 0.018) 58%,
    rgba(var(--purple-rgb), 0) 76%
  );
  color: rgba(var(--white-rgb), 0.42);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  transition: color 0.18s ease, background-image 0.18s ease, box-shadow 0.18s ease;
}

.info-window-panel.is-story-view .info-window-close svg path {
  stroke-width: 1.35;
}

@media (hover: hover) and (pointer: fine) {
  .info-window-panel.is-story-view .info-window-close:hover {
    border: none;
    color: rgba(var(--white-rgb), 0.68);
    background-image: radial-gradient(
      circle at 50% 48%,
      rgba(var(--purple-rgb), 0.17) 0%,
      rgba(var(--purple-rgb), 0.085) 38%,
      rgba(var(--purple-rgb), 0.03) 58%,
      rgba(var(--purple-rgb), 0) 78%
    );
  }
}

.info-window-panel.is-story-view .info-window-close:focus-visible {
  border: none;
  color: rgba(var(--white-rgb), 0.68);
  background-image: radial-gradient(
    circle at 50% 48%,
    rgba(var(--purple-rgb), 0.18) 0%,
    rgba(var(--purple-rgb), 0.09) 38%,
    rgba(var(--purple-rgb), 0.032) 58%,
    rgba(var(--purple-rgb), 0) 78%
  );
  box-shadow: 0 0 0 1px rgba(var(--purple-rgb), 0.14);
}

/* Story-Head: +5px nur Desktop-Browser (ohne iPad Air/Mini ≤1180px) */
@media (min-width: 1181px) {
  .info-window-panel.is-story-view .info-window-head {
    padding-top: 20px;
  }
}

/* Desktop + iPad: Story-Kopf (14 Tage · Einloggen · Einladung) +15 % */
@media (min-width: 744px) {
  .info-window-panel.is-story-view .info-window-story-top-actions {
    font-size: calc(0.74rem * 1.15);
    gap: calc(18px * 1.15);
  }

  .info-window-story-top-cta {
    min-height: calc(29px * 1.15);
    padding: calc(7px * 1.15) calc(12px * 1.15) calc(6px * 1.15);
  }
}

/* iPad Pro Querformat ab 1366: Story-Kopf im Panel-Scale (+12 %, wie Info-Embed). */
@media (orientation: landscape) and (min-width: 1366px) and (max-width: 1400px) {
  body.single-cover-bg[data-cover-layout="tablet-col"] .info-window-panel.is-story-view .info-window-story-top-actions {
    font-size: calc(0.74rem * 1.15 * 1.12);
    gap: calc(18px * 1.15 * 1.12);
  }

  body.single-cover-bg[data-cover-layout="tablet-col"] .info-window-panel.is-story-view .info-window-story-top-cta {
    min-height: calc(29px * 1.15 * 1.12);
    padding: calc(7px * 1.15 * 1.12) calc(12px * 1.15 * 1.12) calc(6px * 1.15 * 1.12);
  }
}

@media (max-width: 700px) {
  .info-window-panel.is-story-view .info-window-head {
    gap: 6px;
    padding-right: max(4px, env(safe-area-inset-right, 0px));
  }

  .info-window-panel.is-story-view .info-window-story-top-actions {
    max-width: calc(100% - 48px);
    margin-right: 0;
    padding-left: 0;
    gap: 10px;
    font-size: clamp(0.76rem, 3.1vw, 0.86rem);
    letter-spacing: 0.1em;
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .info-window-story-top-meta {
    display: none;
  }

  .info-window-panel.is-story-view .info-window-close {
    margin-left: 8px;
  }
}

body.single-cover-bg[data-cover-layout="phone"] .info-window-panel.is-story-view .info-window-story-top-cta {
  font-size: clamp(0.72rem, 2.75vw, 0.8rem);
  font-weight: 400;
  font-synthesis: weight;
  letter-spacing: 0.1em;
  color: rgba(var(--white-rgb), 0.98);
  min-height: 31px;
  padding: 8px 12px 7px;
}

body.single-cover-bg[data-cover-layout="phone"] .info-window-panel.is-story-view .info-window-close {
  width: 34px;
  height: 34px;
  color: rgba(var(--white-rgb), 0.84);
}

body.single-cover-bg[data-cover-layout="phone"] .info-window-panel.is-story-view .info-window-close svg {
  width: 14px;
  height: 14px;
}

body.single-cover-bg[data-cover-layout="phone"] .info-window-panel.is-story-view .info-window-close svg path {
  stroke-width: 1.35;
}

body.single-cover-bg[data-cover-layout="phone"] .info-window-panel.is-story-view .info-window-close:focus-visible {
  color: rgba(var(--white-rgb), 0.96);
}

body.single-cover-bg[data-cover-layout="phone"] .info-window-panel.is-story-view {
  padding-left: max(8px, env(safe-area-inset-left, 0px));
  padding-right: max(8px, env(safe-area-inset-right, 0px));
}

body.single-cover-bg[data-cover-layout="phone"] .info-window-panel.is-story-view .info-window-story-scroll {
  --info-story-scroll-pad-inline: max(8px, env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px));
}

/* iPhone: kein Scrollbalken — Touch-Scroll, symmetrischer Iframe-Rand. */
body.single-cover-bg[data-cover-layout="phone"] .info-window-panel.is-story-view.is-story-scrollable .info-window-story-shell {
  grid-template-columns: minmax(0, 1fr);
}

body.single-cover-bg[data-cover-layout="phone"] .info-window-panel.is-story-view .info-window-story-scrollbar-host {
  display: none !important;
}

.info-window-story-shell {
  display: none;
  grid-row: 2;
  min-height: 0;
  position: relative;
  overflow: hidden;
}

.info-window-panel.is-story-view .info-window-story-shell {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  grid-template-columns: minmax(0, 1fr) 0;
  min-height: 0;
  height: 100%;
}

.info-window-panel.is-story-view.is-story-scrollable .info-window-story-shell {
  grid-template-columns: minmax(0, 1fr) var(--info-story-scrollbar-hit, 12px);
}

body.invite-window-open.invite-window-from-story .info-window-panel.is-story-view .info-window-story-shell {
  visibility: hidden;
  pointer-events: none;
}

.info-window-story-scrollbar-host {
  grid-column: 2;
  grid-row: 1;
  position: relative;
  min-width: 0;
  min-height: 0;
  height: 100%;
  pointer-events: none;
}

.info-window-panel.is-story-view .info-window-story-scroll {
  grid-column: 1;
  grid-row: 1;
  flex: none;
  width: 100%;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
  -webkit-overflow-scrolling: auto;
  box-sizing: border-box;
  --info-story-scroll-pad-inline: max(12px, env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px));
  padding-left: max(var(--story-figure-rail, 0px), var(--info-story-scroll-pad-inline));
  padding-right: var(--info-story-scroll-pad-inline);
}

.info-window-story-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.info-window-panel.is-story-view .info-window-story-scroll {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

.info-window-panel.is-story-view .info-window-story {
  width: 100%;
  max-width: none;
  height: 100%;
  margin: 0;
  padding: 0;
}

.info-window-story-membership-frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: transparent;
}

.info-window-story-scroll::-webkit-scrollbar,
.info-window-panel.is-story-view .info-window-story-scroll::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
  background: transparent;
}

/* Spalten-Scrollbar: eigene Grid-Spalte (Iframe überdeckt sie nicht). */
.info-window-story-scrollbar-host .info-window-story-column-scrollbar.discover-column-scrollbar {
  position: absolute;
  inset: 0;
  width: auto;
  padding-right: 2px;
  box-sizing: border-box;
  background: transparent;
  pointer-events: auto;
  opacity: 0;
  visibility: visible;
  transition: opacity 0.15s ease;
  touch-action: none;
}

.info-window-panel.is-story-scrollable.is-scrollbar-scrolling .info-window-story-column-scrollbar,
.info-window-panel.is-story-scrollable.is-scrollbar-thumb-dragging .info-window-story-column-scrollbar,
.info-window-panel.is-story-scrollable .info-window-story-scrollbar-host:hover .info-window-story-column-scrollbar {
  opacity: 1;
}

.info-window-panel.is-story-scrollable .info-window-story-column-scrollbar .discover-column-scrollbar__thumb {
  left: auto;
  right: 0;
  width: var(--discover-scrollbar-size, 2px);
}

.info-window-panel.is-story-scrollable:not(.is-scrollbar-scrolling):not(.is-scrollbar-thumb-dragging)
  .info-window-story-scrollbar-host:not(:hover)
  .info-window-story-column-scrollbar
  .discover-column-scrollbar__thumb {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.info-window-panel.is-story-scrollable.is-scrollbar-scrolling .info-window-story-column-scrollbar .discover-column-scrollbar__thumb,
.info-window-panel.is-story-scrollable.is-scrollbar-thumb-dragging .info-window-story-column-scrollbar .discover-column-scrollbar__thumb,
.info-window-panel.is-story-scrollable .info-window-story-scrollbar-host:hover .info-window-story-column-scrollbar .discover-column-scrollbar__thumb {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.info-window-panel:not(.is-story-scrollable) .info-window-story-column-scrollbar .discover-column-scrollbar__thumb {
  min-height: 0;
  height: 0 !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

@media (min-width: 481px) {
  .info-window-panel.is-story-view {
    --info-story-scrollbar-hit: 14px;
  }
}

@media (min-width: 1181px) {
  .info-window-panel.is-story-view {
    --info-story-scrollbar-hit: 16px;
  }
}

@media (hover: none) and (pointer: coarse) {
  .info-window-panel.is-story-view {
    --info-story-scrollbar-hit: max(16px, var(--info-story-scrollbar-hit, 12px));
  }
}

@media (hover: hover) and (pointer: fine) {
  .info-window-panel.is-story-scrollable .info-window-story-scrollbar-host {
    cursor: default;
  }

  .info-window-panel.is-story-scrollable .info-window-story-column-scrollbar .discover-column-scrollbar__thumb {
    cursor: grab;
  }

  .info-window-panel.is-story-scrollable.is-scrollbar-thumb-dragging
    .info-window-story-column-scrollbar
    .discover-column-scrollbar__thumb {
    cursor: grabbing;
  }
}

/* Nur iPhone Portrait: weniger Abstand nach Head-Divider */
@media (max-width: 480px) and (orientation: portrait) {
  .info-window-panel.is-story-view {
    --info-gap-after-divider: clamp(6px, 1.2vh, 10px);
  }

  .info-window-panel.is-story-view .info-window-head {
    padding-bottom: 0;
  }

  .info-window-panel.is-story-view .info-window-story-scroll {
    padding-top: 30px;
  }
}

body.info-window-interacting {
  user-select: none;
}