/* ============================================================================
   PODCAST — /podcast/ archive cards + single episode.
   Enqueued on is_singular('episode') and is_post_type_archive('episode')
   (inc/podcast.php). Moved out of the templates' inline <style> so a deploy
   goes live on every WPE app node. Values are the existing inline tokens.
   The Events & Insights hub keeps its own inline .pod-* rules (2-up grid).
   ============================================================================ */

/* ── Cards (archive + "More episodes" on the single) ── */
.pod-archive .pod-grid,
.ep-single .pod-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));   /* owner 2026-10-14: three across */
  gap: 22px;
  margin-top: 24px;
}
@media (max-width: 1024px) {
  .pod-archive .pod-grid,
  .ep-single .pod-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .pod-archive .pod-grid,
  .ep-single .pod-grid { grid-template-columns: 1fr; }
}
.pod-archive .pod-card,
.ep-single .pod-card {
  background: #fff;
  border: 1px solid var(--line, #e6dfe9);
  border-radius: var(--radius, 16px);
  overflow: hidden;
  box-shadow: 0 10px 30px -24px rgba(50, 0, 61, .55);
  display: flex;
  flex-direction: column;
}
.pod-archive .pod-thumb,
.ep-single .pod-thumb { display: block; aspect-ratio: 1 / 1; overflow: hidden; background: #32003D; }
.pod-archive .pod-thumb img,
.ep-single .pod-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.pod-archive .pod-card:hover .pod-thumb img,
.ep-single .pod-card:hover .pod-thumb img { transform: scale(1.04); }
.pod-archive .pod-body,
.ep-single .pod-body { padding: 18px 20px; display: flex; flex-direction: column; flex: 1; }
.pod-archive .pod-ep,
.ep-single .pod-ep { font-size: .78rem; font-weight: 600; color: #008096; letter-spacing: .05em; text-transform: uppercase; margin-bottom: 6px; }
.pod-archive .pod-title,
.ep-single .pod-title { font-size: 1rem; line-height: 1.35; font-weight: 700; color: #32003D; margin: 0 0 6px; }
.pod-archive .pod-title a,
.ep-single .pod-title a { color: inherit; text-decoration: none; }
.pod-archive .pod-title a:hover,
.ep-single .pod-title a:hover { color: #006376; }
/* QA R1: the hub's 3-line clamp (template-events-insights.php l.133). No
   margin-top:auto, as on the hub: text sits under the title, spare space pools
   at the card bottom, so 3-across rows stay even. */
.pod-archive .pod-guests,
.ep-single .pod-guests { font-size: .88rem; color: #5B5B5B; padding-top: 8px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.pod-archive .pod-guests strong,
.ep-single .pod-guests strong { color: #32003D; }

/* ── Single ── */
.ep-single { max-width: 760px; margin: 0 auto; }
.ep-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  margin-bottom: 28px;
  font-size: 1rem;
  font-weight: 600;
  color: #006376;
}
.ep-meta .ep-meta-guests { color: #32003D; font-weight: 500; flex-basis: 100%; }
.ep-meta .ep-meta-guests strong { font-weight: 700; }
.ep-lead {
  font-size: var(--sx-t-body, 1.125rem);
  line-height: 1.7;
  font-weight: 500;
  color: #32003D;
  margin: 0 0 1.2em;
}
.ep-body > *:first-child { margin-top: 0; }
.ep-body p { font-size: 1.08rem; line-height: 1.75; margin: 0 0 1.2em; color: #2a2333; }
.ep-body p:last-child { margin-bottom: 0; }
.ep-yt-link {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin: 0 0 28px;
  padding: .8rem 1.6rem;
  border-radius: 999px;
  background: #E91346;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  font-size: 1rem;
}
.ep-yt-link:hover { background: #c0102f; }
.ep-yt-link:focus-visible { outline: 3px solid #FAAF00; outline-offset: 3px; }
.ep-video { margin: 0 0 32px; }
.ep-video .ab-video { margin: 0; }

/* Blocks reuse the Events single devices: gold hairline title, lavender row rules. */
.ep-block { margin-top: 40px; }
main .ep-single .ep-block-title {
  font-size: var(--sx-t-h3, 1.5rem) !important;
  font-weight: 700 !important;
  line-height: 1.25;
  color: #32003D;
  margin: 0 0 .8em;
  padding-top: 1.2em;
  border-top: 2px solid #FAAF00;
}
.ep-list { list-style: none; margin: 0; padding: 0; }
main .ep-list > li {
  display: flex;
  align-items: baseline;
  gap: .9rem;
  margin: 0;
  padding: .85rem 0;
  border-bottom: 1px solid rgba(192, 171, 234, .35);
  line-height: 1.6;
  color: #2a2333;
}
.ep-list > li:first-child { border-top: 1px solid rgba(192, 171, 234, .35); }
.ep-takeaways > li::before {
  content: "";
  flex-shrink: 0;
  width: .7rem;
  height: .35rem;
  border-left: 3px solid #FAAF00;
  border-bottom: 3px solid #FAAF00;
  transform: translateY(-.2em) rotate(-45deg);
}
.ep-chapter-time {
  flex-shrink: 0;
  min-width: 5rem;
  font-weight: 700;
  color: #006376;
  text-decoration: none;
  font-variant-numeric: tabular-nums;
}
a.ep-chapter-time:hover { text-decoration: underline; }
a.ep-chapter-time:focus-visible,
.ep-resource-link:focus-visible,
.ep-platform-link:focus-visible,
.ep-person-link:focus-visible { outline: 3px solid #FAAF00; outline-offset: 3px; }
.ep-quote { margin: 40px 0 0; padding: 0; border: 0; }
.ep-quote p {
  font-family: 'Poppins', sans-serif;
  font-size: clamp(1.2rem, 2vw, 1.6rem);
  font-weight: 600;
  font-style: italic;
  line-height: 1.45;
  color: #32003D;
  margin: 0;
  padding-left: 1.4rem;
  border-left: 4px solid #32003D;
}
.ep-quote cite { display: block; margin-top: .7rem; padding-left: 1.4rem; font-style: normal; font-weight: 600; color: #4a4350; }

/* People: same proportions as the Events facilitator discs. */
.ep-people { display: flex; flex-wrap: wrap; gap: 24px; margin: 0; padding: 0; list-style: none; }
.ep-person { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .5rem; width: 160px; margin: 0; }
.ep-person-disc {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: #32003D;
  border: 3px solid #FAAF00;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 2rem;
}
.ep-person-disc img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }
.ep-person-name { font-weight: 700; font-size: 1rem; color: #32003D; line-height: 1.3; }
.ep-person-link { color: inherit; }
.ep-person-meta { font-size: 1rem; color: #4a4350; line-height: 1.4; }
.ep-person-role { font-size: 1rem; font-weight: 600; color: #006376; }
.ep-person-bio { font-size: 1rem; color: #4a4350; line-height: 1.55; text-align: left; margin: .2rem 0 0; }

.ep-resource-link,
.ep-platform-link { font-weight: 600; color: #006376; text-decoration: none; }
.ep-resource-link:hover,
.ep-platform-link:hover { text-decoration: underline; }
.ep-platforms { display: flex; flex-wrap: wrap; gap: 12px 24px; margin: 0; padding: 0; list-style: none; }
.ep-platforms li { margin: 0; }
.ep-transcript summary { cursor: pointer; font-weight: 700; color: #32003D; min-height: 44px; display: flex; align-items: center; }
.ep-transcript summary:focus-visible { outline: 3px solid #FAAF00; outline-offset: 3px; }
.ep-back { margin-top: 40px; }
.ep-back a { color: #006376; font-weight: 600; text-decoration: none; }
.ep-back a:hover { text-decoration: underline; }

@media (max-width: 680px) {
  .ep-person { width: 130px; }
  .ep-person-disc { width: 96px; height: 96px; font-size: 1.6rem; }
}
@media (prefers-reduced-motion: reduce) {
  .pod-archive .pod-thumb img,
  .ep-single .pod-thumb img { transition: none; }
}