:root{
  --pod-deep:#302b25;
  --pod-brown:#6f5842;
  --pod-gold:#a8824c;
  --pod-soft:#f1ece4;
  --pod-ink:#312c27;
  --pod-line:#dfd5c8;
}

.podcast-page{
  padding:18px;
}

.podcast-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:24px;
  align-items:end;
  margin:4px 2px 16px;
}

.podcast-head h1{
  margin:0;
  font-family:"Libre Caslon Display",serif;
  font-size:50px;
  line-height:.92;
  letter-spacing:-.04em;
  font-weight:400;
  color:var(--ink);
}

.podcast-head p{
  max-width:820px;
  margin:7px 0 0;
  color:var(--muted);
  font-size:13px;
}

.podcast-status{
  display:flex;
  align-items:center;
  gap:9px;
  padding:10px 13px;
  border:1px solid var(--pod-line);
  border-radius:999px;
  background:#fff;
  color:#5b5046;
  font-size:10px;
  font-weight:700;
  box-shadow:var(--shadow-soft);
}

.podcast-status::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--pod-gold);
  box-shadow:0 0 0 5px rgba(168,130,76,.12);
}

.podcast-hero{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
  min-height:610px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:32px;
  background:#fff;
  box-shadow:var(--shadow);
}

.hero-story{
  position:relative;
  overflow:hidden;
  padding:42px 40px 34px;
  background:
    radial-gradient(circle at 86% 10%,rgba(168,130,76,.15),transparent 29%),
    radial-gradient(circle at 8% 90%,rgba(111,88,66,.08),transparent 32%),
    linear-gradient(145deg,#fffefa,#f2eee6);
}

.hero-story::after{
  content:"";
  position:absolute;
  width:480px;
  height:480px;
  right:-250px;
  bottom:-220px;
  border-radius:50%;
  border:1px solid rgba(111,88,66,.09);
  box-shadow:
    0 0 0 55px rgba(111,88,66,.024),
    0 0 0 110px rgba(111,88,66,.016);
}

.hero-story-inner{
  position:relative;
  z-index:2;
  max-width:780px;
}

.pod-kicker{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.pod-label{
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:var(--pod-brown);
  font-size:9px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.pod-label::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--pod-gold);
}

.podcast-hero h2{
  margin:18px 0 14px;
  max-width:780px;
  font-family:"Libre Caslon Display",serif;
  font-size:clamp(58px,5.7vw,92px);
  line-height:.9;
  letter-spacing:-.05em;
  font-weight:400;
  color:var(--ink);
}

.hero-story p{
  max-width:700px;
  margin:0;
  color:#584f47;
  font-size:15px;
  line-height:1.52;
}

.hero-hosts{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:22px;
}

.host-stack{
  display:flex;
}

.host-stack img{
  width:42px;
  height:42px;
  object-fit:cover;
  border-radius:50%;
  border:3px solid #f7f3ec;
  margin-left:-9px;
}

.host-stack img:first-child{margin-left:0}

.host-copy strong{
  display:block;
  color:#332d28;
  font-size:11px;
}

.host-copy span{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:8px;
}

.wave-player{
  position:relative;
  z-index:2;
  margin-top:26px;
  padding:16px;
  border:1px solid #dfd6ca;
  border-radius:18px;
  background:rgba(255,255,255,.82);
}

.player-row{
  display:grid;
  grid-template-columns:48px 1fr auto;
  gap:12px;
  align-items:center;
}

.play-button{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--pod-deep);
  color:#fff;
  font-size:13px;
}

.player-info strong{
  display:block;
  color:#332d28;
  font-size:11px;
}

.player-info span{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:8px;
}

.player-time{
  color:#73685d;
  font-size:9px;
  font-weight:700;
}

.waveform{
  height:62px;
  display:flex;
  align-items:center;
  gap:3px;
  margin-top:14px;
  overflow:hidden;
}

.waveform i{
  display:block;
  width:3px;
  border-radius:999px;
  background:linear-gradient(180deg,var(--pod-gold),var(--pod-brown));
  opacity:.8;
}

.player-progress{
  display:flex;
  justify-content:space-between;
  color:#8a8178;
  font-size:7px;
  margin-top:4px;
}

.hero-programs{
  display:grid;
  grid-template-rows:auto 1fr auto;
  gap:13px;
  padding:18px;
  background:
    radial-gradient(circle at 100% 0%,rgba(168,130,76,.17),transparent 30%),
    linear-gradient(180deg,#39312a,#241f1a);
  color:#fff;
}

.hero-programs-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding-bottom:12px;
  border-bottom:1px solid rgba(255,255,255,.12);
}

.hero-programs-head h3{
  margin:0;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.07em;
}

.hero-programs-head span{
  color:#c5b8aa;
  font-size:8px;
}

.program-feature-list{
  display:grid;
  align-content:start;
}

.program-feature{
  display:grid;
  grid-template-columns:82px 1fr;
  gap:12px;
  padding:12px 0;
  border-bottom:1px solid rgba(255,255,255,.1);
}

.program-cover{
  position:relative;
  width:82px;
  height:82px;
  overflow:hidden;
  border-radius:14px;
  background:#78624f;
}

.program-cover img{
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.78;
}

.program-cover::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent,rgba(20,14,10,.5));
}

.program-feature strong{
  display:block;
  font-family:"Libre Caslon Display",serif;
  font-size:20px;
  line-height:1;
  font-weight:400;
}

.program-feature p{
  margin:6px 0 0;
  color:#cdbfb1;
  font-size:8px;
  line-height:1.35;
}

.program-feature span{
  display:block;
  margin-top:7px;
  color:#a89480;
  font-size:8px;
}

.hero-programs-more{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:13px;
  background:rgba(255,255,255,.06);
  color:#f0e6dd;
  font-size:9px;
  font-weight:800;
}

.podcast-nav{
  display:flex;
  gap:8px;
  margin:18px 0;
  overflow:auto;
  scrollbar-width:none;
}

.podcast-nav::-webkit-scrollbar{display:none}

.podcast-nav a{
  flex:0 0 auto;
  padding:10px 13px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.76);
  color:#425248;
  font-size:11px;
  font-weight:700;
}

.podcast-nav a.active{
  background:var(--pod-deep);
  border-color:var(--pod-deep);
  color:#fff;
}

.originals{
  padding:22px;
  border:1px solid var(--line);
  border-radius:28px;
  background:#fff;
  box-shadow:var(--shadow-soft);
}

.originals-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin-top:15px;
}

.original-card{
  overflow:hidden;
  border:1px solid var(--pod-line);
  border-radius:20px;
  background:#fff;
}

.original-cover{
  position:relative;
  aspect-ratio:1/1;
  overflow:hidden;
  background:#473c33;
}

.original-cover img{
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.82;
}

.original-cover::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 35%,rgba(26,20,16,.82) 100%);
}

.original-mark{
  position:absolute;
  z-index:3;
  left:14px;
  top:14px;
  padding:6px 8px;
  border-radius:999px;
  background:rgba(255,255,255,.9);
  color:var(--pod-brown);
  font-size:8px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.original-title{
  position:absolute;
  z-index:3;
  left:16px;
  right:16px;
  bottom:15px;
  color:#fff;
}

.original-title strong{
  display:block;
  font-family:"Libre Caslon Display",serif;
  font-size:28px;
  line-height:1;
  font-weight:400;
}

.original-copy{
  padding:13px;
}

.original-copy p{
  margin:0;
  color:var(--muted);
  font-size:9px;
  line-height:1.4;
}

.original-copy span{
  display:block;
  margin-top:7px;
  color:#887b6e;
  font-size:8px;
}

.podcast-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:18px;
  align-items:start;
  margin-top:18px;
}

.podcast-main{
  display:grid;
  gap:18px;
}

.latest-episodes{
  padding:22px;
  border:1px solid var(--line);
  border-radius:28px;
  background:#fff;
  box-shadow:var(--shadow-soft);
}

.episode-list{
  display:grid;
  margin-top:10px;
}

.episode{
  display:grid;
  grid-template-columns:64px minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  padding:14px 0;
  border-bottom:1px solid var(--line);
}

.episode:last-child{border-bottom:0}

.episode-play{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:1px solid var(--pod-line);
  background:#f6f1e9;
  color:var(--pod-deep);
  font-size:12px;
}

.episode-info span{
  display:block;
  color:var(--pod-brown);
  font-size:8px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.episode-info strong{
  display:block;
  margin-top:5px;
  color:#2e2925;
  font-size:14px;
  line-height:1.2;
}

.episode-info small{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:8px;
}

.episode-meta{
  text-align:right;
  color:#8b8178;
  font-size:8px;
}

.episode-meta b{
  display:block;
  margin-bottom:4px;
  color:#51483f;
  font-size:10px;
}

.deep-conversation{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:28px;
  background:#fff;
  box-shadow:var(--shadow-soft);
}

.deep-image{
  position:relative;
  min-height:440px;
  overflow:hidden;
  background:#2c3029;
}

.deep-image img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.82;
}

.deep-image::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 30%,rgba(27,23,19,.8) 100%);
}

.deep-image .listen{
  position:absolute;
  z-index:3;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:74px;
  height:74px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.3);
  color:#fff;
  font-size:21px;
  backdrop-filter:blur(10px);
}

.deep-copy{
  padding:28px;
  align-self:center;
}

.deep-copy h2{
  margin:10px 0;
  font-family:"Libre Caslon Display",serif;
  font-size:42px;
  line-height:1;
  font-weight:400;
  color:var(--ink);
}

.deep-copy p{
  margin:0;
  color:var(--muted);
  font-size:12px;
  line-height:1.5;
}

.deep-quote{
  margin-top:20px;
  padding:16px;
  border-left:3px solid var(--pod-gold);
  background:#f8f4ed;
  color:#554a40;
  font-family:"Libre Caslon Display",serif;
  font-size:21px;
  line-height:1.2;
}

.deep-meta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:18px;
}

.deep-meta span{
  padding:8px 10px;
  border:1px solid var(--pod-line);
  border-radius:999px;
  background:#fbf8f3;
  color:#665a4f;
  font-size:8px;
  font-weight:700;
}

.chain-podcasts{
  padding:22px;
  border:1px solid var(--line);
  border-radius:28px;
  background:#fff;
  box-shadow:var(--shadow-soft);
}

.chain-podcast-grid{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:9px;
  margin-top:14px;
}

.chain-podcast-card{
  min-height:150px;
  padding:13px;
  border:1px solid var(--pod-line);
  border-radius:16px;
  background:linear-gradient(145deg,#fff,#f8f4ed);
}

.chain-podcast-card span{
  display:block;
  color:var(--pod-brown);
  font-size:8px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.chain-podcast-card strong{
  display:block;
  margin:8px 0 6px;
  color:#302b27;
  font-size:12px;
  line-height:1.17;
}

.chain-podcast-card small{
  color:var(--muted);
  font-size:8px;
  line-height:1.3;
}

.voices{
  padding:22px;
  border:1px solid var(--line);
  border-radius:28px;
  background:#fff;
  box-shadow:var(--shadow-soft);
}

.voices-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin-top:14px;
}

.voice-card{
  display:grid;
  grid-template-columns:62px 1fr;
  gap:12px;
  align-items:center;
  padding:13px;
  border:1px solid var(--pod-line);
  border-radius:16px;
  background:#fbf8f3;
}

.voice-card img{
  width:62px;
  height:62px;
  object-fit:cover;
  border-radius:50%;
}

.voice-card strong{
  display:block;
  color:#302a26;
  font-size:11px;
}

.voice-card span{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:8px;
}

.podcast-sidebar{
  display:grid;
  gap:14px;
  position:sticky;
  top:98px;
}

.now-playing{
  color:#fff;
  background:
    radial-gradient(circle at 100% 0%,rgba(168,130,76,.17),transparent 30%),
    linear-gradient(145deg,#39312a,#241f1a);
  border-color:#39312a;
}

.now-playing h3{color:#fff}

.now-badge{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:6px 8px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  color:#e8dbcf;
  font-size:8px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.07em;
}

.now-playing h4{
  margin:12px 0 7px;
  font-family:"Libre Caslon Display",serif;
  font-size:27px;
  line-height:1;
  font-weight:400;
}

.now-playing p{
  margin:0;
  color:#cdbfb2;
  font-size:9px;
}

.mini-wave{
  height:38px;
  display:flex;
  align-items:center;
  gap:3px;
  margin-top:13px;
}

.mini-wave i{
  width:3px;
  border-radius:999px;
  background:#bfa486;
}

.now-time{
  display:flex;
  justify-content:space-between;
  margin-top:5px;
  color:#a99889;
  font-size:7px;
}

.top-episode{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:10px;
  padding:10px 0;
  border-bottom:1px solid var(--line);
}

.top-episode:last-child{border-bottom:0}

.top-num{
  color:var(--pod-gold);
  font-family:"Libre Caslon Display",serif;
  font-size:25px;
  line-height:1;
}

.top-episode strong{
  display:block;
  color:#302a26;
  font-size:11px;
  line-height:1.18;
}

.top-episode span{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:8px;
}

.newsletter{
  background:linear-gradient(145deg,#f2ece4,#faf7f1);
}

.ad{min-height:255px}

.podcast-note{
  margin-top:10px;
  padding:0 3px;
  color:#8b918b;
  font-size:8px;
}

@media(max-width:1180px){
  .podcast-hero{
    grid-template-columns:minmax(0,1fr) 340px;
  }
  .podcast-grid{
    grid-template-columns:minmax(0,1fr) 290px;
  }
  .originals-grid{
    grid-template-columns:repeat(3,1fr);
  }
  .chain-podcast-grid{
    grid-template-columns:repeat(4,1fr);
  }
  .voices-grid{
    grid-template-columns:1fr 1fr;
  }
}

@media(max-width:980px){
  .podcast-head{
    grid-template-columns:1fr;
    align-items:start;
  }
  .podcast-status{justify-self:start}
  .podcast-hero{grid-template-columns:1fr}
  .program-feature-list{
    grid-template-columns:1fr 1fr;
    gap:0 18px;
  }
  .podcast-grid{grid-template-columns:1fr}
  .podcast-sidebar{
    position:static;
    grid-template-columns:1fr 1fr;
  }
  .podcast-sidebar .ad{grid-column:span 2}
  .originals-grid{grid-template-columns:1fr 1fr}
  .chain-podcast-grid{grid-template-columns:repeat(3,1fr)}
}

@media(max-width:820px){
  .deep-conversation{grid-template-columns:1fr}
}

@media(max-width:640px){
  .podcast-page{padding:12px}
  .podcast-head h1{font-size:42px}
  .podcast-hero{border-radius:23px}
  .hero-story{padding:26px 19px 22px}
  .podcast-hero h2{font-size:50px}
  .hero-story p{font-size:14px}
  .program-feature-list{grid-template-columns:1fr}
  .originals{padding:17px}
  .originals-grid{grid-template-columns:1fr}
  .latest-episodes{padding:17px}
  .episode{grid-template-columns:54px 1fr}
  .episode-meta{display:none}
  .deep-copy{padding:18px}
  .deep-copy h2{font-size:35px}
  .chain-podcasts{padding:17px}
  .chain-podcast-grid{grid-template-columns:1fr 1fr}
  .voices{padding:17px}
  .voices-grid{grid-template-columns:1fr}
  .podcast-sidebar{grid-template-columns:1fr}
  .podcast-sidebar .ad{grid-column:auto}
}

@media(max-width:430px){
  .chain-podcast-grid{grid-template-columns:1fr}
}

