/* Podcast, topic filter chips + episode card grid. Lazy. Mobile-first: 1-up. */
.podcast-grid-sec{padding:16px 0 64px}
.podcast-grid-sec .pg-head{display:flex;flex-direction:column;gap:20px;margin-bottom:28px}
.podcast-grid-sec .kicker{color:var(--accent-deep);font-size:12px;letter-spacing:0.16em;text-transform:uppercase;display:block;margin-bottom:10px}
.podcast-grid-sec h2{font-family:var(--f-display);font-weight:700;font-size:clamp(26px,4.6vw,36px);letter-spacing:-0.02em;color:var(--ink)}
.podcast-grid-sec .pg-chips{display:flex;flex-wrap:wrap;gap:8px}
.podcast-grid-sec .chip{background:var(--card);border:1px solid var(--line);border-radius:999px;padding:9px 16px;font-size:13.5px;font-weight:500;color:var(--muted);cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.podcast-grid-sec .chip:hover{border-color:var(--accent)}
.podcast-grid-sec .chip.is-active{background:var(--ink);border-color:var(--ink);color:#fff}
.podcast-grid-sec .pg-grid{display:flex;flex-direction:column;gap:14px}
.podcast-grid-sec .pg-card{position:relative;display:grid;grid-template-columns:1fr;background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;transition:transform .18s,box-shadow .18s}
.podcast-grid-sec .pg-card:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(23,33,46,0.12)}
.podcast-grid-sec .pg-art{position:relative;height:160px;background:var(--ph)}
.podcast-grid-sec .pg-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.podcast-grid-sec .pg-badge{position:absolute;top:12px;right:12px;background:#FDF3DC;color:#8A6116;border-radius:999px;padding:4px 10px;font-weight:600;font-size:11px}
.podcast-grid-sec .pg-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:999px;background:rgba(15,19,25,0.55);color:#fff;display:flex;align-items:center;justify-content:center;transition:transform .18s,background .18s}
.podcast-grid-sec .pg-play svg{width:20px;height:20px;margin-left:2px}
.podcast-grid-sec .pg-card:hover .pg-play{background:var(--accent);transform:translate(-50%,-50%) scale(1.08)}
.podcast-grid-sec .pg-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:8px}
.podcast-grid-sec .pg-show{color:var(--accent-deep);font-size:11px;letter-spacing:0.12em;text-transform:uppercase}
.podcast-grid-sec .pg-body h3{font-family:var(--f-display);font-weight:600;font-size:18.5px;line-height:1.28;letter-spacing:-0.015em;color:var(--ink)}
.podcast-grid-sec .pg-body p{font-size:14px;color:var(--muted)}
.podcast-grid-sec .pg-meta{display:flex;flex-wrap:wrap;gap:8px;font-size:12.5px;color:var(--muted);padding-top:2px}
.podcast-grid-sec .pg-meta span+span::before{content:"· ";margin-right:8px}
.podcast-grid-sec .pg-cta{margin:0 22px 22px;align-self:flex-start;border:none;font-family:inherit;cursor:pointer}
.podcast-grid-sec .pg-empty{color:var(--muted);padding:32px 0;text-align:center}

/* no-art: podcast episodes have no cover art uploaded, so the art column is
   dropped entirely rather than showing an empty placeholder box. */
.podcast-grid-sec.no-art .pg-body{padding:20px 22px}
.podcast-grid-sec.no-art .pg-badge--standalone{display:inline-block;align-self:flex-start;background:#FDF3DC;color:#8A6116;border-radius:999px;padding:4px 10px;font-weight:600;font-size:11px;margin:16px 22px 0}

/* layout-slider: horizontal scroll-snap row of cards, half-width at desktop. */
.podcast-grid-sec.layout-slider .pg-grid{display:flex;flex-direction:row;overflow-x:auto;scroll-snap-type:x mandatory;gap:16px;padding-bottom:8px;scrollbar-width:thin}
.podcast-grid-sec.layout-slider .pg-card{flex:0 0 86%;scroll-snap-align:start}
.podcast-grid-sec.pg-see-all,
.podcast-grid-sec .pg-see-all{display:inline-flex;margin-top:24px}

/* band-spotify / band-youtube: dark homepage variants, same tint language as
   podcast-featured's bands, for when podcast-grid is used as a slider teaser. */
.podcast-grid-sec.band-spotify,.podcast-grid-sec.band-youtube{padding:64px 0 56px;color:#EDF1F6}
.podcast-grid-sec.band-spotify .kicker,.podcast-grid-sec.band-youtube .kicker{color:#fff}
.podcast-grid-sec.band-spotify h2,.podcast-grid-sec.band-youtube h2{color:#fff}
.podcast-grid-sec.band-spotify .pg-card,.podcast-grid-sec.band-youtube .pg-card{border:1px solid rgba(237,241,246,0.12)}
.podcast-grid-sec.band-spotify .pg-body h3,.podcast-grid-sec.band-youtube .pg-body h3{color:#fff}
.podcast-grid-sec.band-spotify .pg-body p,.podcast-grid-sec.band-youtube .pg-body p{color:rgba(237,241,246,0.7)}
.podcast-grid-sec.band-spotify .pg-meta,.podcast-grid-sec.band-youtube .pg-meta{color:rgba(237,241,246,0.55)}
.podcast-grid-sec.band-spotify .pg-see-all,.podcast-grid-sec.band-youtube .pg-see-all{border:1.5px solid rgba(237,241,246,0.4);color:#fff}
.podcast-grid-sec.band-spotify{background:#0D2818}
.podcast-grid-sec.band-spotify .pg-show{color:#3BE07C}
.podcast-grid-sec.band-spotify .pg-card{background:#123A22}
.podcast-grid-sec.band-spotify .pg-cta.btn-accent{background:#1ED760;color:#0D2818}
.podcast-grid-sec.band-spotify .pg-cta.btn-accent:hover{background:#1FDF63}
.podcast-grid-sec.band-youtube{background:#1C1013}
.podcast-grid-sec.band-youtube .pg-show{color:#FF6A6E}
.podcast-grid-sec.band-youtube .pg-card{background:#271518}
.podcast-grid-sec.band-youtube .pg-cta.btn-accent{background:#FF3B3F;color:#fff}
.podcast-grid-sec.band-youtube .pg-cta.btn-accent:hover{background:#E8282C}

/* YouTube "watch" lightbox, one shared overlay per grid, JS injects the
   iframe src on open and clears it on close so playback actually stops. */
.yt-lightbox{position:fixed;inset:0;z-index:100;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}
.yt-lightbox.is-open{opacity:1;visibility:visible}
.yt-lightbox__scrim{position:absolute;inset:0;background:rgba(10,13,18,0.86);backdrop-filter:blur(4px)}
.yt-lightbox__panel{position:relative;max-width:960px;margin:6vh auto 0;padding:0 20px}
.yt-lightbox__frame{position:relative;height:0;padding-top:56.25%;border-radius:16px;overflow:hidden;background:#000}
.yt-lightbox__frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.yt-lightbox.is-audio .yt-lightbox__frame{height:352px;padding-top:0;background:transparent;border-radius:12px}
.yt-lightbox.is-audio .yt-lightbox__frame iframe{position:static;width:100%;height:100%}
.yt-lightbox__close{position:absolute;top:-44px;right:20px;width:36px;height:36px;border-radius:999px;background:rgba(255,255,255,0.12);color:#fff;font-size:22px;line-height:1;border:0;cursor:pointer}
.yt-lightbox__close:hover{background:rgba(255,255,255,0.22)}
