/* ── Google Fonts ── */
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500;600;700&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,600;1,8..60,400&family=IBM+Plex+Mono:wght@400;500&display=swap');

/* ── Variables ── */
:root {
  --cream:     #F3ECE0;
  --cream-dim: #E8DEC9;
  --charcoal:  #1A1410;
  --rust:      #B5432A;
  --rust-dark: #8E3320;
  --ochre:     #C8902F;
  --brown:     #5E4434;
  --line:      rgba(26,20,16,0.14);
  --line-dark: rgba(243,236,224,0.18);
}

/* ── Base ── */
body, .main-page {
  background: var(--cream) !important;
  color: var(--charcoal) !important;
  font-family: 'Source Serif 4', Georgia, serif !important;
  font-size: 17px;
  line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Oswald', 'Arial Narrow', sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  font-weight: 600 !important;
  color: var(--charcoal) !important;
}

a { color: var(--rust) !important; text-decoration: none !important; }
a:hover { text-decoration: underline !important; color: var(--rust-dark) !important; }

/* ── Navigation ── */
.cc-navigation1,
.navigation,
.navbar {
  background: var(--cream) !important;
  border-bottom: 1px solid var(--line) !important;
  box-shadow: none !important;
}

.nav-link,
.navbar-nav .nav-link {
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: var(--charcoal) !important;
  font-weight: 500 !important;
}

.nav-link:hover,
.navbar-nav .nav-link:hover {
  color: var(--rust) !important;
}

/* ── Hero / Header ── */
.cc-top-content,
.home-header-bg {
  background: var(--charcoal) !important;
  border-bottom: 4px solid var(--rust) !important;
  padding: 48px 0 40px !important;
}

.cc-top-content h1,
.home-header-bg h1,
.cc-top-content .mt-5 {
  font-family: 'Oswald', sans-serif !important;
  font-size: 42px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  color: var(--cream) !important;
  line-height: 1.1 !important;
}

/* ── Podcast description ── */
.cc-podcast-head-desc-box,
.cc-podcast-head-desc,
.p-description {
  color: var(--cream-dim) !important;
  font-family: 'Source Serif 4', serif !important;
  font-size: 17px !important;
  line-height: 1.7 !important;
  font-style: italic !important;
  max-width: 680px !important;
  margin: 0 auto !important;
}

/* ── Platform badges (Listen on) ── */
.cc-podcast-apps-content {
  background: var(--charcoal) !important;
  padding-bottom: 32px !important;
}

.cc-podcast-apps .podcast-app a,
.podcast-app a {
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: var(--cream-dim) !important;
  border: 1px solid var(--line-dark) !important;
  border-radius: 3px !important;
  padding: 8px 16px !important;
  background: transparent !important;
  display: inline-block !important;
}

.podcast-app a:hover {
  background: var(--rust) !important;
  border-color: var(--rust) !important;
  color: var(--cream) !important;
  text-decoration: none !important;
}

/* ── Episode list section ── */
.list-container,
.cc-customize-container {
  background: var(--cream) !important;
  padding: 48px 0 !important;
}

.cc-episode-list {
  background: transparent !important;
}

/* ── Episode cards ── */
.episode-content,
.list .episode-content {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: 4px !important;
  transition: border-color 0.2s, transform 0.15s !important;
  overflow: hidden !important;
}

.episode-content:hover {
  border-color: var(--rust) !important;
  transform: translateY(-2px) !important;
}

/* ── Episode title ── */
.cc-episode-title,
.cc-episode-title a {
  font-family: 'Oswald', sans-serif !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  color: var(--charcoal) !important;
}

.cc-episode-title a:hover {
  color: var(--rust) !important;
  text-decoration: none !important;
}

/* ── Episode date ── */
.episode-date {
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--brown) !important;
}

/* ── Episode description ── */
.episode-description {
  font-family: 'Source Serif 4', serif !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  color: #4a3828 !important;
}

/* ── Play button ── */
.cc-post-toolbar .btn,
button[class*="play"],
.play-btn {
  background: var(--rust) !important;
  border-color: var(--rust) !important;
  color: var(--cream) !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  border-radius: 3px !important;
}

button[class*="play"]:hover,
.play-btn:hover {
  background: var(--rust-dark) !important;
  border-color: var(--rust-dark) !important;
}

/* ── Footer ── */
.cc-footer2,
.footer {
  background: var(--charcoal) !important;
  color: var(--cream-dim) !important;
  border-top: 1px solid var(--line-dark) !important;
  padding: 40px 0 24px !important;
}

.cc-footer2 a,
.footer a {
  color: var(--cream-dim) !important;
}

.cc-footer2 a:hover,
.footer a:hover {
  color: var(--ochre) !important;
}

.cc-footer2 p,
.footer p {
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 13px !important;
  color: var(--cream-dim) !important;
}