/* ============================================================
   Super Cities podcast page (pcpod-* namespace).
   Loaded only on podcast.hbs via contentFor "styles".
   Translated from the design mockup; scoped under .podcast-page
   so it never touches other templates. All values are px to match
   the spec (Ghost screen.css sets html{font-size:62.5%}).
   ============================================================ */

/* ---- Page shell: full-bleed dark field, mockup body gradient ---- */
.podcast-page .site-content {
  max-width: none !important;
  padding: 0 !important;
  background: transparent !important;
}
.pcpod {
  --pcpod-ink: #071a2d;
  --pcpod-line: rgba(255, 255, 255, 0.14);
  --pcpod-line-strong: rgba(255, 255, 255, 0.24);
  --pcpod-white: #ffffff;
  --pcpod-muted: rgba(255, 255, 255, 0.68);
  --pcpod-soft: rgba(255, 255, 255, 0.48);
  --pcpod-coral: #f26d5b;
  --pcpod-serif: var(--pc-serif, "Minion Pro", "Minion 3", Georgia, serif);
  --pcpod-ui: "Instrument Sans", "InstrumentSans", Inter, system-ui, sans-serif;
  width: 100%;
  overflow-x: hidden;
  color: var(--pcpod-white);
  font-family: var(--pcpod-serif);
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  background:
    radial-gradient(
      120% 92% at 76% 8%,
      rgba(27, 64, 103, 0.96) 0%,
      rgba(18, 55, 89, 0.74) 22%,
      rgba(10, 39, 66, 0.42) 44%,
      transparent 66%
    ),
    radial-gradient(
      96% 80% at 10% 34%,
      rgba(236, 102, 89, 0.12),
      transparent 54%
    ),
    radial-gradient(
      130% 118% at 82% 72%,
      rgba(20, 54, 85, 0.74),
      transparent 58%
    ),
    linear-gradient(180deg, #061626 0%, #08203a 28%, #0a2540 52%, #06182c 100%);
}
.pcpod * {
  box-sizing: border-box;
}
.pcpod-container {
  width: min(1180px, calc(100vw - 40px));
  margin: 0 auto;
}

/* ---- Page body: anchors the top of the page to the same dark base the pcpod
   gradient starts with, so a transparent header blends seamlessly. ---- */
body.podcast-page {
  background: #061626 !important;
}

/* ---- Seamless header: transparent so the body's dark base (#061626) shows
   through, matching the pcpod gradient's 0% stop and eliminating the lighter
   band that a gradient header would create at the top edge. ---- */
body.podcast-page #site-header.site-header {
  background: transparent !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ---- Footer: transparent so the body's dark base continues through it. ---- */
body.podcast-page .site-footer {
  background: transparent !important;
  border-top: 0 !important;
}
body.podcast-page #site-header .logo-image-navy {
  display: none !important;
}
body.podcast-page #site-header .logo-image-white {
  display: block !important;
}
body.podcast-page
  #site-header
  :is(.menu-item, .header-search-link, .button-text, .logo) {
  color: rgba(255, 255, 255, 0.9) !important;
}

/* ---- Shared bits ---- */
.pcpod a {
  color: inherit;
  text-decoration: none;
}
.pcpod .pcpod-kicker {
  margin: 0 0 18px;
  color: var(--pcpod-coral);
  font-family: var(--pcpod-ui);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.pcpod :is(h1, h2, h3, h4) {
  margin-top: 0;
  font-weight: 500;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
.pcpod p {
  margin-top: 0;
}
.pcpod-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 18px;
  border: 1px solid transparent;
  border-radius: 4px;
  background: var(--pcpod-coral);
  color: #fff;
  font-family: var(--pcpod-ui);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
}
.pcpod-btn--secondary {
  border-color: var(--pcpod-line-strong);
  background: rgba(255, 255, 255, 0.04);
  color: #fff;
}
.pcpod audio {
  display: block;
  width: 100%;
  min-width: 0;
  height: 44px;
  accent-color: var(--pcpod-coral);
}

/* ---- Audio card ---- */
.pcpod-audio-card {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 22px;
  align-items: center;
  height: 100%;
  min-height: 100%;
  padding: clamp(18px, 3vw, 30px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  background:
    radial-gradient(
      circle at 86% 16%,
      rgba(242, 109, 91, 0.22),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.1),
      rgba(255, 255, 255, 0.035)
    );
}
.pcpod-audio-card > div {
  min-width: 0;
}
.pcpod-audio-art {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border: 1px solid rgba(255, 255, 255, 0.22);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.28);
}
.pcpod-audio-card h4 {
  margin: 0 0 12px;
  color: var(--pcpod-coral) !important;
  -webkit-text-fill-color: var(--pcpod-coral) !important;
  font-family: var(--pcpod-ui);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.pcpod-audio-card p {
  margin: 0 0 22px;
  color: #fff;
  font-size: clamp(18px, 1.45vw, 23px);
  font-weight: 600;
  line-height: 1.12;
}

/* ============================================================
   HERO
   ============================================================ */
.pcpod-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(40px, 6vw, 86px) 0 0;
  background:
    radial-gradient(
      125% 95% at 72% 18%,
      rgba(18, 55, 89, 0.92) 0%,
      rgba(10, 39, 66, 0.58) 42%,
      rgba(6, 22, 38, 0) 76%
    ),
    linear-gradient(
      90deg,
      rgba(8, 32, 58, 0.92) 0%,
      rgba(8, 32, 58, 0.64) 38%,
      rgba(8, 32, 58, 0) 76%
    );
}
.pcpod-hero::before {
  position: absolute;
  top: -22%;
  right: 0;
  width: min(520px, 42vw);
  aspect-ratio: 1;
  border: 1px solid rgba(123, 211, 255, 0.14);
  border-radius: 999px;
  background:
    radial-gradient(
      circle at 48% 48%,
      rgba(123, 211, 255, 0.16),
      transparent 50%
    ),
    radial-gradient(
      circle at 32% 32%,
      rgba(236, 102, 89, 0.08),
      transparent 32%
    ),
    linear-gradient(135deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0));
  box-shadow:
    inset 0 0 86px rgba(123, 211, 255, 0.08),
    0 0 100px rgba(3, 14, 27, 0.42);
  content: "";
  pointer-events: none;
}
.pcpod-hero::after {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(213, 179, 108, 0.16) 0 1px,
      transparent 2px
    ),
    radial-gradient(
      circle at 80% 26%,
      rgba(213, 179, 108, 0.14) 0 1px,
      transparent 2px
    ),
    radial-gradient(
      circle at 92% 40%,
      rgba(213, 179, 108, 0.12) 0 1px,
      transparent 2px
    ),
    radial-gradient(
      circle at 73% 18%,
      rgba(255, 255, 255, 0.1) 0 1px,
      transparent 2px
    );
  opacity: 0.8;
  pointer-events: none;
}
/* City art clipped inside the circle, top-right */
.pcpod-hero-art {
  position: absolute;
  top: -22%;
  right: 0;
  z-index: 0;
  width: min(520px, 42vw);
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 999px;
  opacity: 0.48;
  pointer-events: none;
}
.pcpod-hero-art img {
  position: absolute;
  inset: 16%;
  width: 68%;
  height: 68%;
  object-fit: contain;
  opacity: 0.66;
  filter: brightness(0) saturate(100%) invert(76%) sepia(21%) saturate(886%)
    hue-rotate(343deg) brightness(89%) contrast(88%);
}
.pcpod-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 0.84fr) minmax(400px, 0.62fr);
  gap: clamp(58px, 7vw, 118px);
  align-items: center;
  min-height: 480px;
}
.pcpod-hero h1 {
  max-width: 13ch;
  margin: 0 0 28px;
  font-size: clamp(52px, 6.2vw, 84px);
  font-weight: 500;
  line-height: 0.92;
  letter-spacing: -0.01em;
  text-wrap: balance;
}
.pcpod-hero-deck {
  max-width: 620px;
  margin-bottom: 34px;
  color: rgba(255, 255, 255, 0.82);
  font-size: clamp(22px, 2.35vw, 32px);
  font-weight: 500;
  line-height: 1.12;
}
.pcpod-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.pcpod-hero-media {
  position: relative;
  display: grid;
  gap: 22px;
  align-content: center;
  align-self: center;
}
.pcpod-hero-player {
  position: relative;
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  padding: 0 0 0 clamp(20px, 3vw, 34px);
  border-left: 1px solid rgba(255, 255, 255, 0.18);
}
.pcpod-hero-player h2 {
  max-width: 13ch;
  margin-bottom: 22px;
  font-size: clamp(32px, 3vw, 48px);
  line-height: 0.96;
}
.pcpod-hero-player .pcpod-audio-card {
  grid-template-columns: 104px minmax(0, 1fr);
  gap: 18px;
  height: auto;
  min-height: 0;
  padding: 18px;
  border-color: rgba(255, 255, 255, 0.16);
  background:
    radial-gradient(
      120% 140% at 100% 0%,
      rgba(236, 102, 89, 0.18),
      transparent 46%
    ),
    linear-gradient(
      165deg,
      rgba(255, 255, 255, 0.09),
      rgba(255, 255, 255, 0.026)
    );
  box-shadow: 0 20px 54px rgba(0, 0, 0, 0.22);
}
.pcpod-hero-player .pcpod-audio-art {
  max-width: 104px;
}
.pcpod-hero-player .pcpod-audio-card h4 {
  margin-bottom: 8px;
}
.pcpod-hero-player .pcpod-audio-card p {
  margin-bottom: 14px;
  font-size: clamp(16px, 1.35vw, 20px);
  line-height: 1.12;
}

/* ---- Signal (topic) band ---- */
.pcpod-signal-band {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  overflow-x: auto;
  margin-top: clamp(54px, 6vw, 78px);
  padding: 0 max(20px, calc((100vw - 1180px) / 2));
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  background:
    radial-gradient(
      100% 120% at 78% 0%,
      rgba(20, 54, 85, 0.64),
      transparent 60%
    ),
    #08203a;
  color: rgba(255, 255, 255, 0.74);
  font-family: var(--pcpod-ui);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  scrollbar-width: none;
  text-transform: uppercase;
  white-space: nowrap;
}
.pcpod-signal-band::-webkit-scrollbar {
  display: none;
}
.pcpod-signal-band span {
  display: inline-flex;
  align-items: center;
  min-height: 54px;
  padding: 0 24px;
  border-left: 1px solid rgba(255, 255, 255, 0.12);
}
.pcpod-signal-band span:first-child {
  border-left: 0;
  padding-left: 0;
}
.pcpod-signal-band span::before {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 10px;
  border-radius: 999px;
  background: var(--pcpod-coral);
  box-shadow: 0 0 0 4px rgba(242, 109, 91, 0.1);
  content: "";
}

/* ============================================================
   NEW SEASON
   ============================================================ */
.pcpod-newseason {
  padding: clamp(38px, 4.5vw, 58px) 0 24px;
  background:
    radial-gradient(
      110% 120% at 82% 0%,
      rgba(27, 64, 103, 0.62),
      transparent 58%
    ),
    linear-gradient(180deg, rgba(8, 32, 58, 0.18), rgba(8, 32, 58, 0));
}
.pcpod-newseason-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(280px, 0.38fr);
  gap: clamp(24px, 3.8vw, 48px);
  align-items: center;
  padding: clamp(22px, 3vw, 34px);
  border: 1px solid var(--pcpod-line);
  background:
    radial-gradient(
      120% 130% at 86% 8%,
      rgba(20, 54, 85, 0.82) 0%,
      rgba(10, 37, 64, 0.72) 46%,
      rgba(6, 24, 44, 0.58) 100%
    ),
    linear-gradient(
      165deg,
      rgba(255, 255, 255, 0.08),
      rgba(255, 255, 255, 0.02)
    );
  box-shadow: 0 24px 72px rgba(0, 0, 0, 0.22);
}
.pcpod-newseason h2 {
  max-width: 820px;
  margin-bottom: 12px;
  font-size: clamp(32px, 3.7vw, 48px);
  line-height: 0.98;
}
.pcpod-newseason p {
  max-width: 650px;
  margin-bottom: 0;
  color: var(--pcpod-muted);
  font-size: 16px;
  line-height: 1.5;
}
.pcpod-season-signup {
  display: grid;
  gap: 12px;
  padding: 20px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(242, 109, 91, 0.16),
      transparent 34%
    ),
    rgba(8, 25, 41, 0.68);
}
.pcpod-season-signup .pcpod-kicker {
  margin-bottom: 0;
}
.pcpod-season-signup .pcpod-btn {
  justify-content: center;
  width: 100%;
}
.pcpod-signup-form {
  display: grid;
  gap: 12px;
}
.pcpod-signup-form label {
  color: var(--pcpod-soft);
  font-family: var(--pcpod-ui);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.pcpod-signup-form input {
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--pcpod-line-strong);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  font: inherit;
  font-family: var(--pcpod-ui);
  padding: 0 16px;
}
.pcpod-signup-form input::placeholder {
  color: rgba(255, 255, 255, 0.42);
}
.pcpod-signup-form .message-success,
.pcpod-signup-form .message-error {
  display: none;
  margin: 0;
  font-family: var(--pcpod-ui);
  font-size: 13px;
  color: rgba(255, 255, 255, 0.8);
}
.pcpod-signup-form.success .message-success,
.pcpod-signup-form.error .message-error {
  display: block;
}

/* ============================================================
   EPISODES
   ============================================================ */
.pcpod-episodes {
  padding: 48px 0 clamp(80px, 9vw, 132px);
}
.pcpod-episode-preface {
  max-width: 940px;
  margin-bottom: clamp(34px, 5vw, 58px);
}
.pcpod-episode-preface h2 {
  max-width: 760px;
  margin-bottom: 0;
  font-size: clamp(42px, 5.4vw, 76px);
  line-height: 0.96;
}
.pcpod-episode-list {
  display: grid;
  gap: clamp(34px, 5vw, 64px);
  list-style: none;
  margin: 0;
  padding: 0;
}
.pcpod-episode {
  position: relative;
  display: grid;
  grid-template-columns: 64px minmax(280px, 0.78fr) minmax(400px, 1fr);
  align-items: stretch;
  min-height: 344px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  background: rgba(255, 255, 255, 0.055);
  box-shadow:
    0 26px 82px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.07);
}
.pcpod-episode:nth-child(odd) {
  background:
    radial-gradient(
      120% 140% at 92% 8%,
      rgba(22, 57, 93, 0.56),
      transparent 46%
    ),
    linear-gradient(165deg, rgba(12, 40, 67, 0.96), rgba(7, 26, 45, 0.94));
}
.pcpod-episode:nth-child(even) {
  grid-template-columns: 64px minmax(400px, 1fr) minmax(280px, 0.78fr);
  margin-left: min(8vw, 90px);
  background:
    radial-gradient(
      125% 120% at 12% 0%,
      rgba(20, 54, 85, 0.58),
      transparent 48%
    ),
    linear-gradient(165deg, rgba(14, 46, 77, 0.96), rgba(7, 27, 48, 0.94));
}
.pcpod-episode:nth-child(even) .pcpod-episode-copy {
  grid-column: 3;
}
.pcpod-episode:nth-child(even) .pcpod-episode-player {
  grid-column: 2;
  grid-row: 1;
  border-right: 1px solid var(--pcpod-line);
  border-left: 0;
}
.pcpod-episode-number {
  display: grid;
  place-items: center;
  border-right: 1px solid var(--pcpod-line);
  color: var(--pcpod-coral);
  font-family: var(--pcpod-ui);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}
.pcpod-episode-copy {
  display: grid;
  align-content: center;
  padding: clamp(24px, 4vw, 42px);
}
.pcpod-episode-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 9px 16px;
  margin-bottom: 16px;
  color: var(--pcpod-soft);
  font-family: var(--pcpod-ui);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.pcpod-episode h3 {
  max-width: 15ch;
  margin-bottom: 10px;
  font-size: clamp(30px, 3.4vw, 52px);
  line-height: 0.96;
}
.pcpod-episode-org {
  display: block;
  margin-bottom: 20px;
  color: var(--pcpod-coral);
  font-family: var(--pcpod-ui);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.pcpod-episode p {
  max-width: 560px;
  margin-bottom: 0;
  color: var(--pcpod-muted);
  font-size: 16px;
  line-height: 1.58;
}
.pcpod-episode-player {
  display: grid;
  align-content: stretch;
  padding: 0;
  border-left: 1px solid var(--pcpod-line);
  background:
    radial-gradient(
      circle at 14% 18%,
      rgba(255, 255, 255, 0.3),
      transparent 30%
    ),
    radial-gradient(
      circle at 88% 76%,
      rgba(255, 255, 255, 0.18),
      transparent 34%
    ),
    var(
      --pcpod-episode-gradient,
      linear-gradient(135deg, #a7d9e5 0%, #6ebac7 48%, #90e1db 100%)
    );
}
.pcpod-episode .pcpod-episode-player .pcpod-audio-card {
  border-color: rgba(7, 26, 45, 0.22);
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.28),
    rgba(255, 255, 255, 0.08)
  );
}
.pcpod-episode .pcpod-episode-player .pcpod-audio-card h4 {
  color: #071a2d !important;
  -webkit-text-fill-color: #071a2d !important;
}
.pcpod-episode .pcpod-episode-player .pcpod-audio-card p {
  color: #071a2d !important;
  -webkit-text-fill-color: #071a2d !important;
}
.pcpod-episode .pcpod-episode-player .pcpod-audio-art {
  border-color: rgba(7, 26, 45, 0.28);
  box-shadow: 0 18px 44px rgba(7, 26, 45, 0.2);
}
/* Per-episode player gradients (mockup order, Episode 19 → 01) */
.pcpod-episode:nth-child(1) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #9ed8ea 0%,
    #4fb7c7 46%,
    #d4e7ee 100%
  );
}
.pcpod-episode:nth-child(2) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #f07b68 0%,
    #d85f83 48%,
    #f0c2b6 100%
  );
}
.pcpod-episode:nth-child(3) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #76d9bd 0%,
    #4e9fa9 46%,
    #c8a4d4 100%
  );
}
.pcpod-episode:nth-child(4) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #8052c7 0%,
    #b56ac1 48%,
    #d5ccdf 100%
  );
}
.pcpod-episode:nth-child(5) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #7f95ac 0%,
    #a7b9cc 48%,
    #e4c0cf 100%
  );
}
.pcpod-episode:nth-child(6) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #d39463 0%,
    #ef7f78 46%,
    #e5b0cf 100%
  );
}
.pcpod-episode:nth-child(7) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #c6ece7 0%,
    #74c8ce 46%,
    #d9d5e7 100%
  );
}
.pcpod-episode:nth-child(8) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #b8ad96 0%,
    #c8938b 48%,
    #c9c6e6 100%
  );
}
.pcpod-episode:nth-child(9) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #7695bd 0%,
    #9c8fd8 46%,
    #dfa7d7 100%
  );
}
.pcpod-episode:nth-child(10) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #e9a05f 0%,
    #d76f9f 48%,
    #b8bfd0 100%
  );
}
.pcpod-episode:nth-child(11) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #e3e9ef 0%,
    #76d3dc 46%,
    #d2c8ec 100%
  );
}
.pcpod-episode:nth-child(12) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #8b73cf 0%,
    #c17ad0 48%,
    #e9adc8 100%
  );
}
.pcpod-episode:nth-child(13) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #7fb0a6 0%,
    #a7c680 48%,
    #d5d1e8 100%
  );
}
.pcpod-episode:nth-child(14) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #dd745b 0%,
    #d95386 46%,
    #9ed0d5 100%
  );
}
.pcpod-episode:nth-child(15) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #766be3 0%,
    #6fc7d2 46%,
    #a7e0b9 100%
  );
}
.pcpod-episode:nth-child(16) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #cdb195 0%,
    #d891bf 48%,
    #a8d2d6 100%
  );
}
.pcpod-episode:nth-child(17) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #7068bf 0%,
    #b06bd8 46%,
    #e0a8bb 100%
  );
}
.pcpod-episode:nth-child(18) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #d9e0e9 0%,
    #94d7ec 46%,
    #beb8e8 100%
  );
}
.pcpod-episode:nth-child(19) .pcpod-episode-player {
  --pcpod-episode-gradient: linear-gradient(
    135deg,
    #d06ac4 0%,
    #7aa4dd 46%,
    #e1a96f 100%
  );
}

/* ============================================================
   TOPIC PANEL (light)
   ============================================================ */
.pcpod-topic-panel {
  padding: clamp(62px, 8vw, 112px) 0;
  border-top: 1px solid #e3ebf0;
  border-bottom: 1px solid #e3ebf0;
  background: #fff;
  color: var(--pcpod-ink);
}
.pcpod-topic-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(320px, 0.5fr);
  gap: clamp(34px, 6vw, 88px);
  align-items: center;
}
.pcpod-topic-panel .pcpod-kicker {
  margin-bottom: 18px;
}
.pcpod-topic-panel h2 {
  max-width: 760px;
  margin-bottom: 28px;
  font-size: clamp(42px, 5.5vw, 82px);
  line-height: 0.96;
  color: var(--pcpod-ink) !important;
  -webkit-text-fill-color: var(--pcpod-ink) !important;
}
.pcpod-topic-panel > .pcpod-topic-grid > div > p {
  color: #425466;
  font-size: 17px;
}
.pcpod-topic-list {
  display: grid;
  gap: 1px;
  border: 1px solid #e3ebf0;
  background: #e3ebf0;
}
.pcpod-topic-list > div {
  padding: 24px;
  background: #fff;
}
.pcpod-topic-list span {
  display: block;
  margin-bottom: 20px;
  color: var(--pcpod-coral);
  font-family: var(--pcpod-ui);
  font-size: 12px;
  font-weight: 600;
}
.pcpod-topic-list h3 {
  margin-bottom: 8px;
  font-size: 30px;
  line-height: 1;
  color: var(--pcpod-ink) !important;
  -webkit-text-fill-color: var(--pcpod-ink) !important;
}
.pcpod-topic-list p {
  margin: 0;
  color: #425466;
  font-size: 16px;
  line-height: 1.5;
}

/* ============================================================
   FOOTER CTA (subscribe)
   ============================================================ */
.pcpod-footercta {
  padding: clamp(62px, 8vw, 110px) 0;
  background: radial-gradient(
    115% 130% at 85% 12%,
    #1b4067 0%,
    #0e2c4a 45%,
    #081f37 100%
  );
  color: #fff;
}
.pcpod-footercta-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.76fr) minmax(320px, 0.48fr);
  gap: clamp(24px, 4vw, 44px);
  align-items: stretch;
  padding: clamp(18px, 2.4vw, 28px);
  border: 1px solid var(--pcpod-line);
  background:
    radial-gradient(
      circle at 88% 18%,
      rgba(123, 211, 255, 0.1),
      transparent 34%
    ),
    rgba(255, 255, 255, 0.055);
}
.pcpod-footercta-copy {
  display: grid;
  align-content: center;
  min-height: 300px;
  padding: clamp(28px, 4.5vw, 52px);
  background:
    radial-gradient(
      circle at 18% 18%,
      rgba(179, 233, 239, 0.42),
      transparent 34%
    ),
    radial-gradient(
      circle at 84% 76%,
      rgba(188, 148, 238, 0.34),
      transparent 36%
    ),
    linear-gradient(135deg, #b3e9ef 0%, #bc94ee 38%, #f2b9d8 72%, #e99f89 100%);
  color: #071a2d;
}
.pcpod-footercta-copy .pcpod-kicker,
.pcpod-footercta-copy h2,
.pcpod-footercta-copy p {
  color: #071a2d !important;
  -webkit-text-fill-color: #071a2d !important;
}
.pcpod-footercta h2 {
  max-width: 760px;
  margin-bottom: 10px;
  font-size: clamp(38px, 4.6vw, 68px);
  line-height: 0.96;
}
.pcpod-footercta-copy p {
  max-width: 620px;
  margin-bottom: 0;
  font-size: 16px;
  line-height: 1.5;
}
.pcpod-footercta .pcpod-signup-form {
  align-content: center;
  min-height: 300px;
  padding: clamp(24px, 4vw, 42px);
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(8, 25, 41, 0.5);
}
.pcpod-footercta .pcpod-signup-form .pcpod-btn {
  justify-content: center;
  width: 100%;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 980px) {
  .pcpod-hero-grid,
  .pcpod-newseason-panel,
  .pcpod-topic-grid,
  .pcpod-footercta-panel {
    grid-template-columns: 1fr;
  }
  .pcpod-hero-media {
    min-height: 0;
  }
  .pcpod-hero-art {
    top: -14%;
    right: -86px;
    width: min(440px, 68vw);
    opacity: 0.28;
  }
  .pcpod-hero-player {
    max-width: 620px;
    padding-left: 0;
    border-left: 0;
  }
  .pcpod-episode,
  .pcpod-episode:nth-child(even) {
    grid-template-columns: 58px 1fr;
    margin-left: 0;
  }
  .pcpod-episode:nth-child(even) .pcpod-episode-copy,
  .pcpod-episode-copy {
    grid-column: 2;
  }
  .pcpod-episode:nth-child(even) .pcpod-episode-player,
  .pcpod-episode-player {
    grid-column: 2;
    grid-row: auto;
    border-top: 1px solid var(--pcpod-line);
    border-left: 0;
    border-right: 0;
  }
}
@media (max-width: 620px) {
  .pcpod-container {
    width: min(100% - 28px, 1180px);
  }
  .pcpod-hero {
    padding-top: 40px;
  }
  .pcpod-hero-art {
    top: -82px;
    right: -134px;
    width: 340px;
    opacity: 0.22;
  }
  .pcpod-hero h1 {
    font-size: clamp(42px, 13vw, 58px);
  }
  .pcpod-hero-deck {
    font-size: 22px;
  }
  .pcpod-hero-player {
    padding: 0;
  }
  .pcpod-hero-player h2 {
    font-size: clamp(30px, 9vw, 40px);
  }
  .pcpod-hero-player .pcpod-audio-card {
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 14px;
    padding: 14px;
  }
  .pcpod-hero-player .pcpod-audio-art {
    max-width: 82px;
  }
  .pcpod-hero-player .pcpod-audio-card p {
    font-size: 16px;
  }
  .pcpod-signal-band {
    padding-top: 13px;
    padding-bottom: 13px;
    font-size: 11px;
  }
  .pcpod-audio-card {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 16px;
    padding: 16px;
  }
  .pcpod-newseason {
    padding-top: 56px;
  }
  .pcpod-newseason h2,
  .pcpod-topic-panel h2,
  .pcpod-footercta h2 {
    font-size: 42px;
  }
  .pcpod-newseason-panel {
    grid-template-columns: 1fr;
  }
  .pcpod-episode,
  .pcpod-episode:nth-child(even) {
    grid-template-columns: 1fr;
  }
  .pcpod-episode-number {
    display: block;
    padding: 18px 22px 0;
    border-right: 0;
    writing-mode: initial;
    transform: none;
  }
  .pcpod-episode-copy,
  .pcpod-episode:nth-child(even) .pcpod-episode-copy,
  .pcpod-episode-player,
  .pcpod-episode:nth-child(even) .pcpod-episode-player {
    grid-column: 1;
  }
  .pcpod-episode-copy {
    padding: 18px 22px 22px;
  }
  .pcpod-episode-player {
    padding: 0 16px 18px;
    border-top: 0;
  }
  .pcpod-episode h3 {
    font-size: 31px;
  }
}
