/* THE PETER McCORMACK SHOW - Broadcast v3 design system */
/* Fonts are loaded async from the document head (non-render-blocking) - do not @import here. */

:root{
  --ink:#08080a; --ink-2:#0d0d11; --panel:#141419; --panel-2:#17171d; --band-warm:#160f0e;
  --ivory:#efe9dd; --dim:#a6a099; --faint:#67635c;
  --cherry:#e0113b; --cherry-s:#ff4d6d;
  --white:#fff; --ink-3:#050506;
  /* third-party brand marks - exempt from the palette, used only for platform-icon hover */
  --brand-spotify:#1db954; --brand-apple:#9d5bd2; --brand-youtube:#ff0000; --brand-fountain:#f8a919; --brand-rumble:#85c742; --brand-rss:#f26522;
  --money:#e8a44c; --power:#ff5a72; --tech:#6aa6ff; --science:#54d6b6;
  --line:rgba(239,233,221,.12); --line-soft:rgba(239,233,221,.06);
  --sans:'Inter',system-ui,sans-serif; --serif:'Fraunces',Georgia,serif;
  --maxw:1280px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--ivory);font-family:var(--sans);-webkit-font-smoothing:antialiased;line-height:1.5;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 44px}
.eyebrow{font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--dim);font-weight:500;display:inline-flex;align-items:center;gap:11px}
.eyebrow::before{content:"";width:22px;height:2px;border-radius:2px;background:var(--cherry)}
.serif{font-family:var(--serif)}

/* -- NAV -- */
header{position:sticky;top:0;z-index:100;backdrop-filter:blur(20px);background:rgba(8,8,10,.72);border-bottom:1px solid var(--line-soft)}
nav{display:flex;align-items:center;justify-content:space-between;height:76px;gap:24px}
.logo{display:flex;align-items:center}
.logo img{height:26px;width:auto}
.brand{display:inline-flex;align-items:center;gap:12px}
.brand .bar{width:3px;height:22px;background:var(--cherry);border-radius:2px;flex:none}
.brand .wordmark{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ivory);line-height:1;white-space:nowrap}
.foot-brand .brand{margin-bottom:18px}
.foot-brand .brand .wordmark{color:var(--ivory)}
.navlinks{display:flex;gap:36px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--dim)}
.navlinks a{position:relative;padding:6px 0;transition:color .22s}
.navlinks a:hover,.navlinks a.active{color:var(--ivory)}
.navlinks a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:1px;background:var(--cherry);transition:width .25s}
.navlinks a:hover::after,.navlinks a.active::after{width:100%}

/* watch/listen dropdown */
.wl{position:relative}
.wl-btn{display:inline-flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  padding:11px 20px;border:1px solid var(--line);border-radius:100px;transition:.25s;cursor:pointer;background:none;color:var(--ivory);font-family:inherit}
.wl-btn:hover{background:var(--ivory);color:var(--ink);border-color:var(--ivory)}
.wl-btn .chev{transition:transform .25s;font-size:9px}
.wl.open .wl-btn .chev{transform:rotate(180deg)}
.wl-menu{position:absolute;top:calc(100% + 12px);right:0;min-width:248px;background:var(--panel);border:1px solid var(--line);
  border-radius:16px;padding:8px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:.22s;
  box-shadow:0 30px 70px -20px rgba(0,0,0,.85);z-index:120}
.wl.open .wl-menu{opacity:1;visibility:visible;transform:translateY(0)}
.wl-menu .wl-head{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--faint);padding:10px 12px 6px}
.wl-item{display:flex;align-items:center;gap:13px;padding:11px 12px;border-radius:10px;font-size:14px;color:var(--dim);transition:.18s}
.wl-item:hover{background:var(--panel-2);color:var(--ivory)}
.wl-item svg{width:19px;height:19px;color:inherit;fill:currentColor;flex:none;transition:.18s}
.wl-item .sub{margin-left:auto;font-size:11px;color:var(--faint);transition:.18s}
.wl-item:hover .sub{color:var(--dim)}

/* -- BUTTONS -- */
.btn{display:inline-flex;align-items:center;gap:13px;font-weight:600;font-size:15px;padding:15px 26px;border-radius:100px;transition:.25s;cursor:pointer;font-family:inherit;border:none}
.btn-primary{background:var(--ivory);color:var(--ink)}
.btn-primary:hover{transform:translateY(-2px);background:var(--white)}
.btn-primary .circ{width:26px;height:26px;border-radius:50%;background:var(--cherry);display:grid;place-items:center;color:var(--white);font-size:11px}
.btn-ghost{border:1px solid var(--line);color:var(--ivory);background:none}
.btn-ghost:hover{border-color:var(--ivory)}

/* platform icon row */
.platrow{display:flex;align-items:center;gap:16px}
.platrow a{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;color:var(--dim);background:transparent;transition:.25s}
.platrow a:hover{color:var(--ivory);border-color:var(--ivory);background:var(--panel-2);transform:translateY(-2px)}
.platrow a svg{width:19px;height:19px;fill:currentColor}
.icons-row svg{fill:currentColor}

/* -- SECTION HEAD -- */
.sec{padding:92px 0}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:44px;gap:20px}
.sec-head .l .eyebrow{margin-bottom:16px}
.sec-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3.4vw,38px);letter-spacing:-.01em;line-height:1.05}
.sec-head .sub{color:var(--dim);font-size:15px;margin-top:8px}
.sec-head .more{font-size:14px;color:var(--dim);display:inline-flex;gap:8px;align-items:center;transition:.2s;white-space:nowrap}
.sec-head .more:hover{color:var(--ivory);gap:12px}

/* -- HERO -- */
.hero{padding:74px 0 78px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.hero-kick{display:flex;align-items:center;gap:14px;margin-bottom:26px}
.hero-kick .n{font-family:var(--serif);font-size:15px;color:var(--cherry-s)}
.hero-kick .d{width:5px;height:5px;border-radius:50%;background:var(--faint)}
.hero h1{font-family:var(--serif);font-weight:300;font-size:clamp(44px,5.4vw,80px);line-height:.98;letter-spacing:-.02em;margin-bottom:26px}
.hero h1 em{font-style:italic;font-weight:400}
.hero-guest{font-family:var(--serif);font-style:italic;font-size:21px;color:var(--dim);margin:-8px 0 32px}
.hero .lead{font-size:18px;line-height:1.6;color:var(--dim);max-width:32ch;margin-bottom:34px}
.hero-actions{display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin-bottom:30px}
.hero-listen{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin-bottom:14px}
.hero-art{position:relative}
.poster{position:relative;border-radius:16px;overflow:hidden;aspect-ratio:1/1;border:1px solid var(--line);box-shadow:0 40px 120px -40px rgba(0,0,0,.9)}
.poster img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.poster:hover img{transform:scale(1.06)}
.poster::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 52%,rgba(8,8,10,.6));pointer-events:none}
.poster .ptag{position:absolute;top:18px;left:18px;z-index:2;font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  background:rgba(8,8,10,.55);backdrop-filter:blur(8px);border:1px solid var(--line);padding:7px 13px;border-radius:100px;color:var(--ivory)}
.poster .pcap{position:absolute;left:22px;bottom:20px;z-index:2}
.poster .pcap .g{font-family:var(--serif);font-size:21px}
.poster .pcap .m{font-size:12px;color:var(--dim);margin-top:2px}
.glow{position:absolute;inset:-40px;z-index:-1;background:radial-gradient(circle at 60% 40%,rgba(224,17,59,.2),transparent 60%);filter:blur(30px)}

/* -- SPONSORS -- */
.sponsors{border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);padding:38px 0;background:var(--ink-2)}
.sponsors-in{display:flex;align-items:center;gap:44px;flex-wrap:wrap;justify-content:center}
.sponsors .lbl{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--faint)}
.sponsor-row{display:flex;gap:52px;flex-wrap:wrap;align-items:center;font-family:var(--serif);font-size:22px;color:var(--dim)}
.sponsor-row span{transition:color .2s;cursor:default;letter-spacing:.01em}
.sponsor-row span:hover{color:var(--ivory)}
.sponsor-row a{transition:color .2s;letter-spacing:.01em}
.sponsor-row a:hover{color:var(--ivory)}

/* -- EPISODE CARDS -- */
.zone-panel{background:var(--panel);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.eps{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.ep{cursor:pointer;display:block}
.ep-img{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:1/1;border:1px solid var(--line);margin-bottom:16px;transition:.35s}
.ep-img img{width:100%;height:100%;object-fit:cover;transition:transform .55s ease}
.ep:hover .ep-img{transform:translateY(-6px);border-color:rgba(239,233,221,.3)}
.ep:hover .ep-img img{transform:scale(1.05)}
.ep-num{position:absolute;top:12px;left:12px;font-family:var(--serif);font-size:13px;background:rgba(8,8,10,.55);backdrop-filter:blur(6px);padding:4px 10px;border-radius:100px;border:1px solid var(--line)}
.ep-topic{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--cherry-s);margin-bottom:7px}
.ep h3{font-family:var(--serif);font-weight:400;font-size:19px;line-height:1.18;letter-spacing:-.01em}
.ep .guest{font-size:13px;color:var(--dim);margin-top:7px}

/* -- FEATURE BANNER (essential listening) -- */
.feature{background:var(--panel);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.feature-in{display:grid;grid-template-columns:1fr 1fr;min-height:520px}
.feature-img{position:relative;overflow:hidden}
.feature-img img{width:100%;height:100%;object-fit:cover}
.feature-img::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 55%,var(--panel))}
.feature-copy{padding:78px 64px;display:flex;flex-direction:column;justify-content:center}
.feature-copy .eyebrow{margin-bottom:20px}
.feature-copy h2{font-family:var(--serif);font-weight:300;font-size:clamp(38px,4.2vw,60px);line-height:1.0;letter-spacing:-.02em;margin-bottom:20px}
.feature-copy h2 em{font-style:italic}
.feature-copy p{font-size:17px;color:var(--dim);line-height:1.65;max-width:42ch;margin-bottom:28px}
.feature-copy .who{font-family:var(--serif);font-style:italic;font-size:18px;color:var(--ivory);margin-bottom:28px}
.feature-copy .go{display:inline-flex;align-items:center;gap:12px;font-size:14px;color:var(--ivory);border-bottom:1px solid var(--cherry);padding-bottom:8px;width:fit-content;transition:.25s}
.feature-copy .go:hover{gap:18px}

/* -- TOPICS -- */
.topics{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.topic{border-radius:18px;padding:34px 28px 30px;min-height:224px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid;cursor:pointer;transition:.3s}
.topic:hover{transform:translateY(-6px)}
.topic .tn{font-family:var(--serif);font-size:14px;opacity:.7;color:var(--ivory)}
.topic h3{font-family:var(--serif);font-weight:400;font-size:32px;margin:0;color:var(--ivory)}
.topic p{font-size:13px;line-height:1.5;margin-top:10px;color:var(--dim)}
.topic .arrow{font-size:20px;margin-top:20px;transition:.3s}
.topic:hover .arrow{transform:translateX(6px)}
.tp-money{background:rgba(232,164,76,.08);border-color:rgba(232,164,76,.26);color:var(--money)}
.tp-power{background:rgba(255,90,114,.08);border-color:rgba(255,90,114,.26);color:var(--power)}
.tp-tech{background:rgba(106,166,255,.08);border-color:rgba(106,166,255,.26);color:var(--tech)}
.tp-science{background:rgba(84,214,182,.08);border-color:rgba(84,214,182,.26);color:var(--science)}

/* -- NEWSLETTER PANEL -- */
.news{padding:92px 0}
.news-box{border-radius:24px;background:radial-gradient(120% 140% at 12% 0%,rgba(224,17,59,.17),transparent 55%),var(--panel);border:1px solid var(--line);padding:74px 62px;display:grid;grid-template-columns:1fr auto;gap:50px;align-items:center}
.news-box h2{font-family:var(--serif);font-weight:300;font-size:clamp(38px,4vw,50px);line-height:1.02;letter-spacing:-.02em}
.news-box h2 em{font-style:italic;color:var(--cherry-s)}
.news-box p{color:var(--dim);font-size:16px;margin-top:16px;max-width:42ch}
.news-form{min-width:340px}
.news-form .r{display:flex;gap:10px}
.news-form input{flex:1;background:var(--ink);border:1px solid var(--line);color:var(--ivory);padding:16px 18px;border-radius:100px;font-size:15px;font-family:inherit;outline:none;transition:.2s}
.news-form input:focus{border-color:var(--cherry-s)}
.news-form button{background:var(--cherry);color:var(--white);border:none;padding:16px 26px;border-radius:100px;font-weight:600;font-size:15px;cursor:pointer;transition:.25s;font-family:inherit}
.news-form button:hover{background:var(--cherry-s)}
.news-form .fine{font-size:12px;color:var(--faint);margin-top:12px}
.formok{background:rgba(84,214,182,.1);border:1px solid rgba(84,214,182,.4);color:var(--science);border-radius:100px;padding:12px 18px;font-size:14px;margin-bottom:14px}
.formerr{background:rgba(224,17,59,.1);border:1px solid rgba(224,17,59,.4);color:var(--cherry-s);border-radius:100px;padding:12px 18px;font-size:14px;margin-bottom:14px}
.formok:focus,.formerr:focus{outline:none}
.news-form button.is-sending,.cform button.is-sending{opacity:.6;cursor:default}
.sponsor-row .spon-fallback{font-size:13px;color:var(--dim)}

/* -- STATS -- */
.statband{border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);background:var(--ink-2)}
.stats{display:flex;justify-content:space-between;padding:40px 0;flex-wrap:wrap;gap:24px}
.stat{text-align:center;flex:1;min-width:130px}
.stat b{font-family:var(--serif);font-weight:400;font-size:40px;display:block;color:var(--ivory)}
.stat span{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}

/* -- FOOTER -- */
footer{background:var(--ink-3);border-top:1px solid var(--line-soft);padding:64px 0 46px;margin-top:0}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:52px}
.foot-brand img{height:24px;margin-bottom:18px}
.foot-brand p{color:var(--dim);font-size:14px;max-width:34ch;line-height:1.6}
.foot-col h4{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);margin-bottom:18px}
.foot-col a{display:block;font-size:14px;color:var(--dim);margin-bottom:12px;transition:.2s}
.foot-col a:hover{color:var(--ivory)}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line-soft);padding-top:26px;font-size:13px;color:var(--faint);flex-wrap:wrap;gap:12px}

/* -- PAGE HEADER (interior pages) -- */
.pagehead{padding:84px 0 46px;border-bottom:1px solid var(--line-soft)}
.pagehead .eyebrow{margin-bottom:20px}
.pagehead h1{font-family:var(--serif);font-weight:300;font-size:clamp(40px,5vw,68px);line-height:1.0;letter-spacing:-.02em}
.pagehead .lead{font-size:18px;color:var(--dim);max-width:52ch;margin-top:22px;line-height:1.6}

/* -- ARCHIVE -- */
.toolbar{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:30px 0;border-bottom:1px solid var(--line-soft)}
.search{flex:1;min-width:240px;display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:100px;padding:13px 20px}
.search input{flex:1;background:none;border:none;color:var(--ivory);font-size:15px;font-family:inherit;outline:none}
.search input::placeholder{color:var(--faint)}
.search svg{width:17px;height:17px;color:var(--faint)}
.filters{display:flex;gap:8px;flex-wrap:wrap}
.chip{font-size:12px;letter-spacing:.06em;padding:11px 18px;border:1px solid var(--line);border-radius:100px;color:var(--dim);cursor:pointer;transition:.2s;background:none;font-family:inherit}
.chip:hover{color:var(--ivory);border-color:var(--ivory)}
.chip.on{background:var(--ivory);color:var(--ink);border-color:var(--ivory)}
.arch-list{display:grid;grid-template-columns:repeat(4,1fr);gap:26px 26px;padding:52px 0}

/* -- EPISODE PAGE -- */
.epwrap{max-width:1140px;margin:0 auto;padding:0 44px}
.ep-hero{padding:56px 0 44px;display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:start}
.ep-cover{border-radius:16px;overflow:hidden;border:1px solid var(--line);aspect-ratio:1/1;box-shadow:0 40px 110px -50px rgba(0,0,0,.9)}
.ep-cover img{width:100%;height:100%;object-fit:cover}
.ep-head .crumb{font-size:12px;letter-spacing:.06em;color:var(--faint);margin-bottom:20px}
.ep-head .crumb a:hover{color:var(--ivory)}
.ep-head .topic{display:inline-block;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--cherry-s);border:1px solid rgba(255,77,109,.38);border-radius:100px;padding:5px 13px;min-height:0;margin-bottom:16px;cursor:pointer;transition:.2s}
.ep-head h1{font-family:var(--serif);font-weight:300;font-size:clamp(34px,4vw,54px);line-height:1.02;letter-spacing:-.02em;margin-bottom:18px}
.ep-head .who{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--ivory);margin-bottom:10px}
.ep-head .meta{font-size:13px;color:var(--faint);letter-spacing:.02em;margin-bottom:30px}
.ep-actions{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-bottom:30px}
.player{background:var(--panel);border:1px solid var(--line);border-radius:16px;aspect-ratio:16/9;display:grid;place-items:center;color:var(--faint);margin:8px 0 0;overflow:hidden}
.player iframe{width:100%;height:100%;border:0}
.ep-body{display:grid;grid-template-columns:1fr 300px;gap:56px;padding:56px 0 20px;border-top:1px solid var(--line-soft)}
.prose h2{font-family:var(--serif);font-weight:400;font-size:26px;margin:36px 0 14px;letter-spacing:-.01em}
.ep-body .prose > h2:first-child{margin-top:0}
.prose h3{font-family:var(--serif);font-weight:400;font-size:20px;margin:28px 0 10px}
.prose p{color:var(--dim);font-size:16px;line-height:1.75;margin-bottom:18px}
.prose a{color:var(--cherry-s);border-bottom:1px solid rgba(255,77,109,.3)}
.prose ul{color:var(--dim);font-size:16px;line-height:1.7;padding-left:20px;margin-bottom:18px}
.rail .card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px 22px;margin-bottom:20px}
.rail h4{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);margin-bottom:16px}
.rail .ts{display:flex;gap:12px;font-size:14px;color:var(--dim);padding:7px 0}
.rail .ts .t{font-family:var(--serif);color:var(--cherry-s);min-width:52px}
/* Chapters - now under the description in the main column */
.chapters{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px 24px;margin:32px 0 6px}
.chapters h4{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);margin-bottom:12px}
.chapters .ts{display:flex;gap:16px;font-size:15px;color:var(--dim);padding:9px 0;border-top:1px solid var(--line-soft)}
.chapters .ts:first-of-type{border-top:none;padding-top:2px}
.chapters .ts .t{font-family:var(--serif);color:var(--cherry-s);min-width:60px}
.rail .spon{display:flex;align-items:center;gap:12px;padding:10px 0;color:var(--dim);font-size:15px}

/* -- PROSE PAGE -- */
.article{max-width:760px;margin:0 auto;padding:64px 44px 40px}
.article .prose p{font-size:17px}

/* -- TOPIC HERO (ported from topic.html page style block) -- */
.topic-hero{padding:84px 0 46px;border-bottom:1px solid var(--line-soft)}
.topic-hero .tt{font-family:var(--serif);font-weight:300;font-size:clamp(52px,8vw,110px);line-height:.9;letter-spacing:-.03em}
.topic-hero .lead{font-size:19px;color:var(--dim);max-width:56ch;margin-top:22px;line-height:1.6}
.topic-hero .count{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);margin-top:24px}
.th-money{background:radial-gradient(120% 160% at 10% 0%,rgba(232,164,76,.12),transparent 55%)}
.th-money .tt{color:var(--money)}
.th-power{background:radial-gradient(120% 160% at 10% 0%,rgba(255,90,114,.12),transparent 55%)}
.th-power .tt{color:var(--power)}
.th-tech{background:radial-gradient(120% 160% at 10% 0%,rgba(106,166,255,.12),transparent 55%)}
.th-tech .tt{color:var(--tech)}
.th-science{background:radial-gradient(120% 160% at 10% 0%,rgba(84,214,182,.12),transparent 55%)}
.th-science .tt{color:var(--science)}
.guide{margin:46px 0 8px;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:34px 36px;display:flex;gap:26px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.guide .l h3{font-family:var(--serif);font-weight:400;font-size:24px;margin-bottom:8px}
.guide .l p{color:var(--dim);font-size:15px;max-width:60ch}
.guide a{white-space:nowrap}

/* -- EPISODE PAGE play overlay (ported from episode.html page style block) -- */
.play-over{position:relative;cursor:pointer}
.play-over .pb{position:absolute;inset:0;display:grid;place-items:center}
.play-over .pb span{width:76px;height:76px;border-radius:50%;background:rgba(224,17,59,.92);display:grid;place-items:center;color:var(--white);font-size:24px;transition:.25s;box-shadow:0 20px 50px -10px rgba(224,17,59,.6)}
.play-over:hover .pb span{transform:scale(1.08)}

/* -- ABOUT (ported from about.html page style block) -- */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;padding:70px 0}
.about-grid img{width:100%;border-radius:16px;border:1px solid var(--line);filter:saturate(.96)}
.about-fig{margin:0}
.about-fig figcaption{margin-top:20px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);font-weight:500}
.about-grid .prose p:first-child{font-family:var(--serif);font-weight:300;font-size:26px;line-height:1.4;color:var(--ivory);margin-bottom:22px}
.follow{display:flex;gap:14px;margin-top:30px;flex-wrap:wrap}

/* -- NEWSLETTER benefits (ported from newsletter.html page style block) -- */
.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:20px 0 40px}
.benefit{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:30px 28px}
.benefit .n{font-family:var(--serif);font-size:15px;color:var(--cherry-s);margin-bottom:14px}
.benefit h3{font-family:var(--serif);font-weight:400;font-size:21px;margin-bottom:8px}
.benefit p{color:var(--dim);font-size:14px;line-height:1.6}

/* -- CONTACT (ported from contact.html page style block) -- */
.contact-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:56px;padding:64px 0}
.cform label{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin:0 0 9px}
.cform .field{margin-bottom:22px}
.cform input,.cform textarea,.cform select{width:100%;background:var(--panel);border:1px solid var(--line);border-radius:12px;color:var(--ivory);font-family:inherit;font-size:15px;padding:15px 17px;outline:none;transition:.2s}
.cform input:focus,.cform textarea:focus,.cform select:focus{border-color:var(--cherry-s)}
.cform textarea{min-height:150px;resize:vertical}
.cside .block{margin-bottom:32px}
.cside h4{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);margin-bottom:12px}
.cside p{color:var(--dim);font-size:15px;line-height:1.6}
.cside a{color:var(--cherry-s)}

/* -- LEGAL (ported from legal.html page style block) -- */
.legal-nav{display:flex;gap:10px;margin:34px 0 8px}
.legal-nav a{font-size:12px;letter-spacing:.1em;text-transform:uppercase;padding:10px 18px;border:1px solid var(--line);border-radius:100px;color:var(--dim);transition:.2s}
.legal-nav a:hover{color:var(--ivory);border-color:var(--ivory)}
.prose h1.doc,.prose h2.doc{font-family:var(--serif);font-weight:300;font-size:40px;margin:40px 0 8px;letter-spacing:-.02em}
.prose .upd{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin-bottom:24px}

/* -- MOBILE NAV BUTTON (ported: server nav keeps a working mobile toggle) -- */
.menu-btn{display:none;background:none;border:1px solid var(--line);color:var(--ivory);width:42px;height:42px;border-radius:12px;font-size:18px;cursor:pointer;font-family:inherit}

@media(max-width:960px){
  .wrap,.epwrap,.article{padding-left:22px;padding-right:22px}
  .navlinks{display:none}
  .menu-btn{display:grid;place-items:center}
  body.nav-open .navlinks{display:flex;position:absolute;top:76px;left:0;right:0;flex-direction:column;gap:0;background:var(--panel);border-bottom:1px solid var(--line);padding:8px 22px;z-index:110}
  body.nav-open .navlinks a{padding:14px 0;border-bottom:1px solid var(--line-soft)}
  .hero-grid{grid-template-columns:1fr;gap:44px}.hero-art{order:-1;max-width:360px}
  .eps,.arch-list{grid-template-columns:repeat(2,1fr)}
  .topics{grid-template-columns:repeat(2,1fr)}
  .feature-in{grid-template-columns:1fr}.feature-img{min-height:280px}.feature-img::after{background:linear-gradient(0deg,var(--panel),transparent 60%)}.feature-copy{padding:48px 30px}
  .news-box{grid-template-columns:1fr;padding:48px 30px}.news-form{min-width:0}
  .ep-hero{grid-template-columns:1fr;gap:36px}.ep-cover{max-width:360px;order:-1}
  .ep-body{grid-template-columns:1fr;gap:36px}
  .foot-grid{grid-template-columns:1fr 1fr}.stats{gap:28px}
  .about-grid{grid-template-columns:1fr;gap:40px}.about-grid img{max-width:460px}.about-fig{order:-1}
  .benefits{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr;gap:40px}
}

/* ── ACCESSIBILITY + MOTION (Broadcast v3) ── */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:2px solid var(--cherry-s); outline-offset:3px; border-radius:4px;
}
.wl-btn:focus-visible, .btn:focus-visible, .btn-primary:focus-visible{ outline-offset:4px; }
.navlinks a:focus-visible{ outline-offset:6px; }
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important;
  }
  .poster:hover img, .ep:hover .ep-img, .ep:hover .ep-img img,
  .card:hover .card-img, .card:hover .card-img img, .topic:hover, .btn-primary:hover{ transform:none !important; }
}

/* -- SPONSOR LOGOS -- */
.sponsor-row .has-logo{display:inline-flex;align-items:center}
.sponsor-row .has-logo img{height:60px;width:auto;max-width:300px;object-fit:contain;opacity:.78;transition:opacity .2s}
.sponsor-row .has-logo:hover img{opacity:1}
.card .spon.has-logo{display:inline-flex;align-items:center;padding:8px 0}
.card .spon.has-logo img{height:72px;width:auto;max-width:320px;object-fit:contain;opacity:.9;transition:opacity .2s}
.card a.spon.has-logo:hover img{opacity:1}
@media (max-width:600px){
  .sponsor-row .has-logo img{height:44px;max-width:220px}
  .card .spon.has-logo img{height:56px;max-width:260px}
}

/* -- PLATFORM ICON BRAND HOVER (also-on row + watch/listen menu) -- */
.platrow a, .wl-item{transition:color .2s}
.platrow a[data-brand="spotify"]:hover,  .wl-item[data-brand="spotify"]:hover{color:var(--brand-spotify)}
.platrow a[data-brand="apple"]:hover,    .wl-item[data-brand="apple"]:hover{color:var(--brand-apple)}
.platrow a[data-brand="youtube"]:hover,  .wl-item[data-brand="youtube"]:hover{color:var(--brand-youtube)}
.platrow a[data-brand="fountain"]:hover, .wl-item[data-brand="fountain"]:hover{color:var(--brand-fountain)}
.platrow a[data-brand="rumble"]:hover,   .wl-item[data-brand="rumble"]:hover{color:var(--brand-rumble)}
.platrow a[data-brand="rss"]:hover,      .wl-item[data-brand="rss"]:hover{color:var(--brand-rss)}
/* the icon circle (border) also takes the platform colour on hover */
.platrow a[data-brand="spotify"]:hover{border-color:var(--brand-spotify)}
.platrow a[data-brand="apple"]:hover{border-color:var(--brand-apple)}
.platrow a[data-brand="youtube"]:hover{border-color:var(--brand-youtube)}
.platrow a[data-brand="fountain"]:hover{border-color:var(--brand-fountain)}
.platrow a[data-brand="rumble"]:hover{border-color:var(--brand-rumble)}
.platrow a[data-brand="rss"]:hover{border-color:var(--brand-rss)}

/* Related interviews block on the episode page */
.ep-related{padding:46px 0 10px;border-top:1px solid var(--line-soft);margin-top:8px}
.ep-related .sec-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:26px}
.ep-related .sec-head h2{font-family:var(--serif);font-weight:400;font-size:28px;margin-top:8px}
.ep-related .more{font-size:13px;color:var(--dim)}
.ep-related .more:hover{color:var(--ivory)}
.ep-head .topic:hover{color:var(--ivory);border-color:var(--ivory)}

/* hero + essential-panel text links inherit, with a subtle hover */
.feature-img{display:block}
.hero h1 a, .hero-guest a, .hero-kick a, .feature-copy h2 a, .feature-copy .who a{color:inherit;transition:color .2s}
.hero h1 a:hover, .feature-copy h2 a:hover{color:var(--cherry-s)}
.hero-guest a:hover, .hero-kick a:hover, .feature-copy .who a:hover{color:var(--ivory)}

/* -- COOKIE BANNER -- */
.cookie-banner{position:fixed;left:16px;right:16px;bottom:16px;z-index:200;max-width:var(--maxw);margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
  padding:16px 20px;background:rgba(20,20,25,.94);backdrop-filter:blur(20px);
  border:1px solid var(--line);border-radius:14px;box-shadow:0 24px 70px -20px rgba(0,0,0,.8)}
.cookie-banner[hidden]{display:none}
.cookie-banner p{font-size:13px;color:var(--dim);margin:0;max-width:640px}
.cookie-banner a{color:var(--cherry-s);text-decoration:underline}
.cookie-banner .cb-actions{display:flex;gap:10px;flex:none}
.cookie-banner .btn{padding:9px 18px;font-size:13px}
@media (max-width:600px){
  .cookie-banner{flex-direction:column;align-items:stretch;gap:12px;text-align:left}
  .cookie-banner .cb-actions{justify-content:flex-end}
}