/* ============================================================
   BeMED Connect — strategic conversion CTAs
   Editorial interludes between chapters. Premium, not promo.
   Loaded last. No layout/identity/narrative changes elsewhere.
   ============================================================ */

.cta-interlude {
  position: relative;
  text-align: center;
  padding-block: clamp(72px, 12vh, 140px);
  background: var(--ink-0);
}
.cta-interlude .wrap { position: relative; z-index: 1; }

/* a quiet gold hairline to open the moment */
.cta-interlude .ci-rule {
  width: 40px; height: 1px; margin: 0 auto clamp(24px, 4vh, 38px);
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  opacity: 0.8;
}

.cta-interlude .ci-text {
  font-family: var(--serif);
  font-size: clamp(22px, 3vw, 38px);
  font-weight: 400; line-height: 1.22; letter-spacing: -0.01em;
  color: var(--white);
  max-width: 22ch; margin: 0 auto;
  text-wrap: balance;
}
.cta-interlude .ci-text .em { font-style: italic; color: var(--gold-soft); }
.cta-interlude .ci-sub {
  margin: 16px auto 0; max-width: 40ch;
  font-size: clamp(15px, 1.5vw, 18px); font-weight: 300; line-height: 1.6;
  color: var(--silver);
}
.cta-interlude .cta-primary { margin-top: clamp(28px, 4vh, 40px); }

/* emotional variant — faint radial gold wash, a touch more presence */
.cta-interlude.glow::before {
  content: ""; position: absolute; inset: 0; z-index: 0;
  background: radial-gradient(58% 76% at 50% 50%, rgba(212,175,55,0.09), transparent 72%);
  pointer-events: none;
}

/* compact variant — just a line + button, minimal copy */
.cta-interlude.tight { padding-block: clamp(56px, 9vh, 104px); }

/* faint photographic background (used behind the hosts CTA) */
.cta-interlude.has-bg { overflow: hidden; }
.cta-interlude .ci-bg { position: absolute; inset: 0; z-index: 0; }
.cta-interlude .ci-bg img {
  width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%;
  opacity: 0.42; filter: grayscale(0.15);
}
.cta-interlude .ci-bg::after {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(75% 100% at 50% 50%, transparent 0%, rgba(5,7,11,0.45) 100%),
    linear-gradient(0deg, var(--ink-0) 2%, transparent 42%, transparent 58%, var(--ink-0) 98%);
}

@media (max-width: 640px) {
  .cta-interlude { padding-block: clamp(58px, 10vh, 96px); }
  .cta-interlude .ci-text { font-size: clamp(22px, 6.6vw, 30px); }
}
