@font-face{
  font-family:"Oswald";
  src:url("/assets/fonts/oswald-var.woff2") format("woff2");
  font-weight:200 700;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Inter";
  src:url("/assets/fonts/inter-var.woff2") format("woff2");
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
}
:root{
  --bg:#0B0E11;
  --bg-raise:#12171D;
  --bg-card:#161C23;
  --line:rgba(255,255,255,.08);
  --ink:#F4F6F5;
  --muted:#9FA9B2;
  --accent:#0FC5B5;
  --accent-press:#0CA89A;
  --accent-ink:#04211D;
  --display:"Oswald","Arial Narrow",Impact,sans-serif;
  --text:"Inter","Segoe UI",Helvetica,Arial,sans-serif;
  --s1:.25rem; --s2:.5rem; --s3:.75rem; --s4:1rem; --s5:1.5rem;
  --s6:2rem; --s7:3rem; --s8:4rem; --s9:6rem;
  --band:clamp(7.5rem,12vw,10rem);
  --wrap:72rem;
  --radius:.375rem;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--text);
  font-size:1.0625rem;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg,video,iframe{max-width:100%;display:block}
img{height:auto}
::selection{background:var(--accent);color:var(--accent-ink)}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-press)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
.skip-link{
  position:absolute;left:-999px;top:0;z-index:200;
  background:var(--accent);color:var(--accent-ink);
  padding:var(--s3) var(--s5);font-weight:600;
}
.skip-link:focus{left:0}

/* ---------- type ---------- */
h1,h2,h3,.display,.h-band,.foot-title{
  font-family:var(--display);
  text-transform:uppercase;
  line-height:1.04;
  letter-spacing:.015em;
  font-weight:600;
  text-wrap:balance;
}
.display{font-size:clamp(2.875rem,7.5vw,5.5rem)}
.h-band,h2{font-size:clamp(1.875rem,4vw,3rem)}
h3{font-size:clamp(1.25rem,2.2vw,1.5rem)}
.eyebrow{
  display:block;
  font-family:var(--display);
  font-size:.8125rem;
  font-weight:500;
  letter-spacing:.42em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:var(--s4);
}
.lede{
  font-size:clamp(1.0625rem,1.6vw,1.25rem);
  color:var(--muted);
  max-width:38em;
}
.muted{color:var(--muted)}
.center{text-align:center}
.center .lede{margin-inline:auto}

/* heading to paragraph rhythm: open space is the house signal */
h1+p,h2+p,h3+p,.band-head .lede{margin-top:var(--s5)}
.band--hero .lede+p,.hero-copy .lede+p{margin-top:var(--s7)}
.band--hero .lede+.ep-meta{margin-top:var(--s5)}
.breadcrumb+.eyebrow{margin-top:0}

/* ---------- layout ---------- */
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:clamp(1.25rem,5vw,3rem)}
.wrap--narrow{max-width:48rem}
.band{padding-block:var(--band)}
.band--raise{background:var(--bg-raise)}
.band--hero{
  padding-block:calc(var(--band) * 1.15) var(--band);
  border-bottom:1px solid var(--line);
}
.band-head{margin-bottom:var(--s8)}
.band-foot{margin-top:var(--s8);text-align:center}
.stack>*+*{margin-top:var(--s5)}
.stack--loose>*+*{margin-top:var(--s7)}
.credits{margin-top:var(--s7)}
.split{
  display:grid;gap:clamp(2rem,6vw,5rem);
  grid-template-columns:1fr;align-items:center;
}
@media (min-width:56.25em){
  .split{grid-template-columns:1fr 1fr}
  .split--media-right .split-media{order:2}
}
.split-media img{width:100%;border-radius:var(--radius)}
.btn-row{display:flex;gap:var(--s4);justify-content:center;flex-wrap:wrap}
.gallery{
  display:grid;gap:var(--s5);
  grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));
  max-width:48rem;margin-inline:auto;
}
.gallery img{width:100%;border-radius:var(--radius)}
.portrait{max-width:20rem;margin-inline:auto;border-radius:var(--radius)}

/* ---------- hero with host photograph ---------- */
.hero-grid{
  display:grid;gap:clamp(2.5rem,6vw,5rem);
  grid-template-columns:1fr;align-items:center;
}
@media (min-width:56.25em){
  .hero-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
}
.hero-media{position:relative}
.hero-media img{
  width:100%;max-width:23rem;margin-inline:auto;
  border-radius:var(--radius);
  filter:grayscale(.35) contrast(1.05) brightness(.92);
}
.hero-media::after{
  content:"";position:absolute;inset:0;border-radius:var(--radius);
  background:linear-gradient(to top,rgba(11,14,17,.55),rgba(11,14,17,0) 55%);
  pointer-events:none;
}
@media (min-width:56.25em){
  .hero-media::after{left:auto;width:23rem;right:0;margin-inline:auto}
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:var(--s2);
  font-family:var(--display);font-weight:500;
  font-size:.9375rem;letter-spacing:.14em;text-transform:uppercase;
  background:var(--accent);color:var(--accent-ink);
  padding:.875rem 1.75rem;border:1px solid var(--accent);
  border-radius:var(--radius);cursor:pointer;
  transition:background .15s ease,color .15s ease,border-color .15s ease;
}
.btn:hover{background:var(--accent-press);border-color:var(--accent-press);color:var(--accent-ink)}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn--ghost:hover{background:transparent;color:var(--accent);border-color:var(--accent)}
.btn--sm{padding:.5rem 1.125rem;font-size:.8125rem}
.btn svg{width:1.125em;height:1.125em;fill:currentColor}

/* ---------- nav ---------- */
.site-head{
  position:sticky;top:0;z-index:100;
  background:rgba(11,14,17,.92);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-bar{
  display:flex;align-items:center;justify-content:space-between;
  gap:var(--s5);min-height:4.5rem;
}
.brand{display:flex;align-items:center;gap:var(--s3);color:var(--ink)}
.brand:hover{color:var(--ink)}
.brand img{width:2.625rem;height:2.625rem}
.brand-name{
  font-family:var(--display);font-weight:600;
  font-size:1.0625rem;letter-spacing:.08em;
  text-transform:uppercase;line-height:1.1;
}
.brand-name small{
  display:block;font-weight:500;font-size:.625rem;
  letter-spacing:.42em;color:var(--accent);
}
.nav-menu{display:flex;align-items:center;gap:clamp(1rem,2.5vw,2.25rem)}
.nav-menu a:not(.btn){
  font-family:var(--display);font-weight:500;
  font-size:.9375rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);padding-block:var(--s2);
}
.nav-menu a:not(.btn):hover,
.nav-menu a[aria-current="page"]{color:var(--accent)}
.burger{
  display:none;background:none;border:0;cursor:pointer;
  width:2.75rem;height:2.75rem;padding:.625rem;
}
.burger span{
  display:block;height:2px;background:var(--ink);
  border-radius:1px;transition:transform .2s ease,opacity .2s ease;
}
.burger span+span{margin-top:.4375rem}
@media (max-width:53.75em){
  .burger{display:block}
  .nav-menu{
    position:absolute;top:100%;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    background:var(--bg-raise);border-bottom:1px solid var(--line);
    padding:var(--s4) clamp(1.25rem,5vw,3rem) var(--s6);
    display:none;
  }
  .site-head.open .nav-menu{display:flex}
  .nav-menu a:not(.btn){padding-block:var(--s4);border-bottom:1px solid var(--line)}
  .nav-menu .btn{margin-top:var(--s5);justify-content:center}
  .site-head.open .burger span:nth-child(1){transform:translateY(.5625rem) rotate(45deg)}
  .site-head.open .burger span:nth-child(2){opacity:0}
  .site-head.open .burger span:nth-child(3){transform:translateY(-.5625rem) rotate(-45deg)}
}

/* ---------- episode cards ---------- */
.ep-grid{
  display:grid;gap:clamp(1.5rem,3vw,2.5rem);
  grid-template-columns:repeat(auto-fill,minmax(18rem,1fr));
}
.ep-card{
  background:var(--bg-card);border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;
  transition:border-color .15s ease,transform .15s ease;
}
.ep-card:hover{border-color:var(--accent);transform:translateY(-3px)}
.ep-media{position:relative;aspect-ratio:16/9;background:#000}
/* uniform treatment: the grid reads as one system, not mismatched frames */
.ep-media img{
  width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) contrast(1.08) brightness(.8);
  transition:filter .25s ease;
}
.ep-card:hover .ep-media img{filter:grayscale(0) contrast(1) brightness(1)}
.ep-media::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top,rgba(11,14,17,.75),rgba(11,14,17,0) 48%);
}
/* the numeral gets its own guaranteed surface, never thumbnail dependent */
.ep-num{
  position:absolute;z-index:2;
  left:var(--s4);bottom:calc(-1 * var(--s3));
  display:inline-flex;align-items:center;justify-content:center;
  min-width:3.25rem;min-height:2.875rem;padding:0 var(--s3);
  background:var(--bg);border:1px solid var(--line);
  border-radius:var(--radius);
  font-family:var(--display);font-weight:700;
  font-size:2.125rem;line-height:1;color:var(--accent);
}
.ep-num svg{width:1.5rem;height:1.5rem;fill:currentColor}
.ep-body{
  display:flex;flex-direction:column;flex:1;gap:var(--s3);
  padding:var(--s6) var(--s5) var(--s5);
}
.ep-title{font-size:1.1875rem;letter-spacing:.04em}
.ep-title a{color:var(--ink);display:inline-block;padding-block:var(--s1)}
.ep-title a:hover{color:var(--accent)}
.ep-meta{
  font-size:.8125rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);display:flex;gap:var(--s3);flex-wrap:wrap;
}
.ep-meta .tag{color:var(--accent)}
.ep-hook{color:var(--muted);font-size:.9375rem}
.ep-cta{margin-top:auto;padding-top:var(--s3)}

/* ---------- video embed ---------- */
.video-frame{
  aspect-ratio:16/9;background:#000;
  border-radius:var(--radius);overflow:hidden;
  border:1px solid var(--line);
}
.video-frame iframe{width:100%;height:100%;border:0}
.video-cta{margin-top:var(--s6);text-align:center}

/* ---------- subscribe row ---------- */
.sub-row{
  display:flex;flex-wrap:wrap;gap:var(--s3);
  justify-content:center;
}
.sub-pill{
  display:inline-flex;align-items:center;gap:var(--s2);
  background:var(--bg-card);border:1px solid var(--line);
  border-radius:999px;padding:.625rem 1.25rem;
  font-family:var(--display);font-weight:500;
  font-size:.875rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink);
  transition:border-color .15s ease,color .15s ease;
}
.sub-pill:hover{border-color:var(--accent);color:var(--accent)}
.sub-pill svg{width:1.125rem;height:1.125rem;fill:currentColor;flex:none}

/* ---------- breadcrumb ---------- */
.breadcrumb{
  font-size:.8125rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);margin-bottom:var(--s6);
}
.breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s2)}
.breadcrumb li+li::before{content:"/";margin-right:var(--s2);color:var(--line)}
.breadcrumb a{color:var(--muted);padding-block:var(--s1)}
.breadcrumb a:hover{color:var(--accent)}

/* ---------- forms ---------- */
.form-grid{display:grid;gap:var(--s5)}
@media (min-width:40em){
  .form-grid{grid-template-columns:1fr 1fr}
  .form-grid .field--full{grid-column:1 / -1}
}
.field label{
  display:block;font-family:var(--display);font-weight:500;
  font-size:.8125rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);margin-bottom:var(--s2);
}
.field input,.field textarea,.field select{
  width:100%;background:var(--bg-card);color:var(--ink);
  border:1px solid var(--line);border-radius:var(--radius);
  padding:.875rem 1rem;font:inherit;
}
.field input:focus,.field textarea:focus,.field select:focus{
  outline:none;border-color:var(--accent);
}
.field textarea{min-height:9rem;resize:vertical}
.hp-field{display:none}
.cf-turnstile{grid-column:1 / -1;min-height:65px}
.form-note{font-size:.875rem;color:var(--muted)}
.form-status{margin-top:var(--s4);font-weight:600}
.form-status.ok{color:var(--accent)}
.form-status.err{color:#E4685D}
noscript .form-note{display:block;margin-top:var(--s4)}

/* ---------- footer ---------- */
.site-foot{
  border-top:1px solid var(--line);
  background:var(--bg-raise);
  padding-block:var(--s9) var(--s7);
  text-align:center;
}
.foot-title{
  font-size:clamp(1.375rem,2.5vw,1.75rem);
  margin-bottom:var(--s6);
}
.foot-nav{
  display:flex;flex-wrap:wrap;justify-content:center;
  gap:var(--s5);margin-top:var(--s7);
}
.foot-nav a{
  font-family:var(--display);font-weight:500;
  font-size:.8125rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--muted);padding-block:var(--s2);
}
.foot-nav a:hover{color:var(--accent)}
.foot-legal{
  margin-top:var(--s6);padding-top:var(--s6);
  border-top:1px solid var(--line);
  color:var(--muted);font-size:.8125rem;
}

/* ---------- tap targets (WCAG 2.5.8) ---------- */
main p a:not(.btn):not(.sub-pill),.foot-legal a{padding-block:var(--s1)}

/* ---------- reveal on load ---------- */
/* transform only: above the fold content paints on the first frame */
@keyframes rise{
  from{transform:translateY(.875rem)}
  to{transform:none}
}
.reveal{animation:rise .6s cubic-bezier(.22,.8,.35,1) both}
.reveal--2{animation-delay:.08s}
.reveal--3{animation-delay:.16s}
.reveal--4{animation-delay:.24s}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal,.reveal--2,.reveal--3,.reveal--4{animation:none}
  *{transition:none !important}
}
