
/* ═══════════════════════════════
   PAGE-SPECIFIC: Podcast
   ═══════════════════════════════ */

.page-hero {
  position: relative; height: 320px; overflow: hidden;
  display: flex; align-items: flex-end; background: var(--black);
}
.page-hero-bg {
  position: absolute; inset: 0;
  background: url('https://images.unsplash.com/photo-1478737270239-2f02b77fc618?w=1400&q=80') center/cover no-repeat;
  filter: grayscale(40%) brightness(0.3); transform: scale(1.03);
}
.page-hero-overlay { position:absolute; inset:0; background:linear-gradient(to top, var(--black) 0%, rgba(8,8,8,0.55) 50%, rgba(8,8,8,0.2) 100%); }
.page-hero::before { content:''; position:absolute; inset:0; z-index:1; background-image:linear-gradient(rgba(201,168,76,0.04) 1px,transparent 1px),linear-gradient(90deg,rgba(201,168,76,0.04) 1px,transparent 1px); background-size:64px 64px; }
.page-hero-content { position:relative; z-index:10; padding:0 64px 52px; width:100%; }
.breadcrumb-kbc { display:flex; align-items:center; gap:8px; margin-bottom:14px; }
.breadcrumb-kbc a { font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--gray); text-decoration:none; transition:color .2s; }
.breadcrumb-kbc a:hover { color:var(--gold); }
.breadcrumb-kbc span { font-size:10px; color:var(--gold); letter-spacing:2px; text-transform:uppercase; }
.breadcrumb-sep { color:rgba(201,168,76,0.4); }
.page-hero-title { font-family:var(--font-alt); font-size:clamp(52px,8vw,100px); color:var(--white); letter-spacing:3px; line-height:.9; }
.page-hero-title .accent { color:var(--gold); }
.hero-entry { opacity:0; transform:translateY(20px); animation:heroIn .8s var(--ease-expo) forwards; }
@keyframes heroIn { to { opacity:1; transform:translateY(0); } }

/* ── Platform Strip ── */
.platform-strip {
  background: var(--black);
  border-bottom: 1px solid rgba(201,168,76,0.08);
  padding: 18px 64px;
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
}
.platform-label { font-size: 9px; letter-spacing: 2.5px; text-transform: uppercase; color: var(--gray); margin-right: 4px; }
.platform-pill {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 16px; border-radius: 40px;
  border: 1px solid rgba(255,255,255,0.08);
  font-size: 11px; font-weight: 500; color: var(--gray-light);
  text-decoration: none; transition: all .22s;
}
.platform-pill i { font-size: 14px; }
.platform-pill:hover { transform: translateY(-2px); color: var(--white); }
.platform-pill.yt  { --c:#FF0000; } .platform-pill.sp { --c:#1DB954; }
.platform-pill.ap  { --c:#9933CC; } .platform-pill.go { --c:#4285F4; }
.platform-pill:hover { border-color: var(--c,var(--gold)); color: var(--c,var(--white)); background: rgba(255,255,255,0.04); }

/* ── Featured Episode ── */
.podcast-featured-section { background: var(--dark-2); padding: 64px 0 0; }

.featured-ep {
  background: linear-gradient(135deg, var(--dark-3) 0%, rgba(201,168,76,0.04) 100%);
  border: 1px solid rgba(201,168,76,0.18); border-radius: 10px;
  padding: 44px 48px; position: relative; overflow: hidden;
}
.featured-ep::before {
  content: 'EP'; position: absolute; right: 32px; top: -10px;
  font-family: var(--font-alt); font-size: 140px; color: rgba(201,168,76,0.04);
  line-height: 1; pointer-events: none; user-select: none;
}
.featured-badge { font-size: 9px; letter-spacing: 3px; text-transform: uppercase; color: var(--gold); display: inline-flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.featured-badge::before { content:''; width:24px; height:1px; background:var(--gold); }
.featured-ep-num { font-family: var(--font-alt); font-size: 13px; letter-spacing: 3px; color: var(--gold-dark); margin-bottom: 8px; display: block; }
.featured-ep-title { font-family: var(--font-display); font-size: clamp(22px, 3vw, 36px); font-weight: 700; color: var(--white); line-height: 1.25; margin-bottom: 16px; }
.featured-ep-desc { font-size: 13px; color: var(--gray-light); line-height: 1.85; font-weight: 300; max-width: 540px; margin-bottom: 28px; }

.waveform {
  display: flex; align-items: center; gap: 3px; height: 40px; margin-bottom: 24px;
}
.wave-bar {
  width: 3px; border-radius: 3px; background: var(--gold);
  animation: wave 1.2s ease-in-out infinite;
  opacity: 0.6;
}
.wave-bar:nth-child(odd) { opacity: 0.35; }
@keyframes wave {
  0%,100% { height: 8px; }
  50%      { height: 32px; }
}

.play-btn-large {
  width: 52px; height: 52px; border-radius: 50%;
  background: var(--gold); color: var(--black);
  border: none; font-size: 20px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all .25s; flex-shrink: 0; position: relative;
}
.play-btn-large::after { content:''; position:absolute; width:100%; height:100%; border-radius:50%; background:var(--gold); opacity:.25; animation:ripple 2s ease-out infinite; }
@keyframes ripple { 0%{transform:scale(1);opacity:.25} 100%{transform:scale(2.2);opacity:0} }
.play-btn-large:hover { background:var(--gold-light); transform:scale(1.08); }

.ep-duration { font-size: 11px; color: var(--gray); letter-spacing: 1px; }
.ep-date-tag { font-size: 10px; color: var(--gray); letter-spacing: 1.5px; }

/* ── Podcast Grid ── */
.podcast-section { background: var(--dark-2); padding: 56px 0 80px; }

.podcast-card {
  background: var(--dark-3); border: 1px solid rgba(201,168,76,0.07);
  border-radius: var(--r); overflow: hidden;
  transition: all .35s var(--ease-silk); height: 100%; display: flex; flex-direction: column;
}
.podcast-card:hover { border-color: rgba(201,168,76,0.3); transform: translateY(-6px); box-shadow: 0 20px 48px rgba(0,0,0,0.4); }

.podcast-card-header {
  padding: 22px 22px 0;
  display: flex; align-items: flex-start; gap: 16px;
}
.ep-thumb {
  width: 72px; height: 72px; border-radius: var(--r-sm);
  background: linear-gradient(135deg, var(--dark) 0%, rgba(201,168,76,0.12) 100%);
  display: flex; align-items: center; justify-content: center;
  font-size: 28px; flex-shrink: 0;
  border: 1px solid rgba(201,168,76,0.1);
}
.ep-meta { flex: 1; }
.ep-series { font-size: 9px; letter-spacing: 2px; text-transform: uppercase; color: var(--gold-dark); margin-bottom: 4px; display: block; }
.ep-num    { font-family: var(--font-alt); font-size: 13px; letter-spacing: 2px; color: var(--gold); }

.podcast-card-body { padding: 16px 22px 22px; flex: 1; display: flex; flex-direction: column; }
.podcast-title { font-family: var(--font-display); font-size: 16px; font-weight: 700; color: var(--white); line-height: 1.4; margin-bottom: 10px; flex: 1; }
.podcast-desc  { font-size: 11.5px; color: var(--gray); line-height: 1.7; margin-bottom: 16px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

.podcast-card-footer { padding: 0 22px 20px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }

.play-btn-sm {
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--gold); color: var(--black);
  border: none; font-size: 14px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all .22s; flex-shrink: 0;
}
.play-btn-sm:hover { background: var(--gold-light); transform: scale(1.1); }

.platform-icons { display: flex; gap: 6px; }
.p-icon { width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; color: #fff; cursor: pointer; transition: transform .2s; }
.p-icon:hover { transform: scale(1.18); }
.p-yt{background:#FF0000} .p-sp{background:#1DB954} .p-ap{background:#9933CC} .p-go{background:#4285F4}

/* ── Toolbar ── */
.podcast-toolbar {
  background: var(--dark-2); border-bottom: 1px solid rgba(201,168,76,0.08);
  padding: 18px 64px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  position: sticky; top: 0; z-index: 100;
}
.search-wrap { position: relative; flex: 1; max-width: 380px; }
.search-input { width:100%; background:var(--dark-3); border:1px solid rgba(201,168,76,0.15); color:var(--white); font-family:var(--font-body); font-size:12px; padding:11px 40px 11px 16px; border-radius:var(--r-sm); outline:none; transition:border-color .2s; }
.search-input::placeholder { color:var(--gray); }
.search-input:focus { border-color:rgba(201,168,76,0.45); }
.search-icon { position:absolute; right:14px; top:50%; transform:translateY(-50%); color:var(--gold); font-size:14px; pointer-events:none; }
.sort-select { background:var(--dark-3); border:1px solid rgba(201,168,76,0.15); color:var(--gray-light); font-family:var(--font-body); font-size:11px; letter-spacing:1.5px; text-transform:uppercase; padding:11px 36px 11px 16px; border-radius:var(--r-sm); outline:none; cursor:pointer; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23C9A84C'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; }

/* ── Pagination ── */
.pagination-wrap { display:flex; align-items:center; justify-content:center; gap:6px; padding:48px 0 0; }
.page-btn { width:38px; height:38px; display:flex; align-items:center; justify-content:center; border-radius:var(--r-sm); border:1px solid rgba(201,168,76,0.12); background:transparent; color:var(--gray); font-size:12px; font-weight:500; cursor:pointer; transition:all .2s; font-family:var(--font-body); }
.page-btn:hover { border-color:rgba(201,168,76,0.35); color:var(--gold); }
.page-btn.active { background:var(--gold); color:var(--black); border-color:var(--gold); font-weight:700; }
.page-btn:disabled { opacity:.3; cursor:default; pointer-events:none; }

@media (max-width:991.98px) { .podcast-toolbar,.platform-strip { padding:16px 24px; } .featured-ep { padding:32px 24px; } }
@media (max-width:575.98px) { .page-hero-content { padding:0 20px 36px; } }