/* POSTER THEME (theme_css=poster.css) — bold statement poster: a saturated
   yellow hero with mega grotesk type and offset-print artwork, dropping into a dark
   gallery of episode thumbnails.

   Colors/type/radii/layout come from settings (homepage_header_background_color,
   background_color, primary_color, heading_font, title size/weight, feed layout).
   This file owns only the bespoke skin: the offset hero artwork, the outline
   pill CTAs, the gallery grid, and the image-first cards. */

:root {
  --po-accent: var(--primary-color);
  --po-ink: var(--btn-text-color);      /* type on the yellow hero */
  --po-rule: color-mix(in srgb, var(--text-color) 12%, transparent);
}

/* ---------- NAV (sits on the yellow hero) ---------- */
.show-page:has(#header-hero) .navbar-brand,
.show-page:has(#header-hero) .navbar-brand div,
.show-page:has(#header-hero) .navbar-nav .nav-link {
  color: var(--po-ink) !important;
  letter-spacing: -0.01em;
}
.show-page:not(:has(#header-hero)) .navbar-brand,
.show-page:not(:has(#header-hero)) .navbar-brand div {
  color: var(--text-color) !important;
}
.navbar-nav .nav-link:hover { opacity: 0.65; }
/* nav CTA: solid ink pill on the yellow */
#nav-cta .btn, .navbar .btn-base-1 {
  border: none !important; font-weight: 600 !important; padding: 10px 22px !important;
}
.show-page:has(#header-hero) #nav-cta .btn,
.show-page:has(#header-hero) .navbar .btn-base-1 {
  background: var(--po-ink) !important;
  color: var(--po-accent) !important;
}

/* ---------- HERO ---------- */
/* hero bg + type colour come from homepage_header_background_color /
   homepage_header_text_color — the design layer already paints #header-hero and
   its headings/paragraphs, so don't restate them here. */
#header-hero { border-bottom: none !important; }
/* the highlight span just inherits the hero ink (no gradient in this theme) */
#homepage-header-title .text-highlight {
  color: inherit !important; background: none !important;
  -webkit-text-fill-color: currentColor !important;
}
#homepage-header-description { opacity: 0.82; }
/* artwork: a square offset-print block, deliberately upright */
#header-hero #c-artwork img {
  border: 3px solid var(--po-ink);
  box-shadow: 18px 18px 0 color-mix(in srgb, var(--po-ink) 82%, transparent);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
#header-hero #c-artwork img:hover { transform: translate(-4px, -4px); box-shadow: 22px 22px 0 color-mix(in srgb, var(--po-ink) 82%, transparent); }
/* hero CTAs: outline pills on yellow */
#header-hero #c-text .btn {
  background: transparent !important; color: var(--po-ink) !important;
  border: 1.5px solid var(--po-ink) !important; font-weight: 600 !important; padding: 10px 22px !important; box-shadow: none !important;
}
#header-hero #c-text .btn:hover { background: var(--po-ink) !important; color: var(--header-bg-color) !important; }

/* ---------- THE GALLERY (dark feed) ---------- */
#recent-episodes-header .col-4 a {
  color: var(--po-accent) !important;
  font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600;
}
/* A dense four-column wall gives the archive its poster-gallery identity. */
@media (min-width: 1200px) {
  .feed-section .pp-list--grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}
/* image-first cards: art leads, minimal text under it */
.feed-section .pp-card.card {
  background: transparent !important; border: none !important; }
.feed-section .pp-card .pp-card-image img { transition: transform 0.3s ease; }
.feed-section .pp-card:hover .pp-card-image img { transform: translateY(-4px); }
/* date sits above the title as a small eyebrow */
.feed-section .pp-card-date {
  color: var(--text-light-color) !important;
  font-size: 0.68rem !important; letter-spacing: 0.06em; text-transform: uppercase;
  margin-bottom: 6px !important;
}
/* titles are links, so link_color would tint them accent — keep them plain and
   let the accent do the work on hover; clamp to 2 lines so the gallery rows stay even */
.feed-section .pp-card-title,
.feed-section .pp-card-title a {
  line-height: 1.3 !important; color: var(--heading-color) !important;
}
.feed-section .pp-card-title {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.feed-section .pp-card-title a:hover { color: var(--po-accent) !important; }
/* the poster look is art + title + date — no excerpt, no CTA button */
.feed-section .pp-card-description { display: none !important; }

/* ---------- FOOTER ---------- */
#footer.footer { border-top: 1px solid var(--po-rule); }
.footer-links a:hover, .copy-links a:hover, #footer.footer a:hover { color: var(--po-accent) !important; }