/* A quiet editorial setting for the approved TITANIUM artwork. */
:root{
  --paper:#dfd2bd;
  --content:1320px;
  --gutter:clamp(24px,6vw,96px);
  --section-line:rgba(214,177,113,.34);
}
body{-webkit-font-smoothing:antialiased}
.wrap{width:min(var(--content),calc(100% - var(--gutter)*2))}
.site-masthead{padding-block:clamp(24px,2.4vw,36px)}
h1,h2,h3{line-height:1.12;letter-spacing:-.025em}
h1{font-size:clamp(44px,5.2vw,76px)}
h2{font-size:clamp(36px,4vw,58px)}
h3{font-size:clamp(26px,2.25vw,32px)}
.eyebrow{font-size:11px;line-height:1.6;letter-spacing:.16em}
.button{min-height:54px;padding:15px 23px;border-radius:3px;font-size:15px}
.button:hover{background:rgba(214,177,113,.09);color:var(--sand)}
.button:focus-visible{outline-color:var(--gold)}

/* Approved full figure and surf, with separate desktop and mobile framing. */
.podcast-hero{padding-top:8px}
.podcast-hero .hero-art{
  position:relative;
  isolation:isolate;
  container-type:inline-size;
  aspect-ratio:1672/941;
  max-height:none;
  border:1px solid rgba(214,177,113,.48);
  border-radius:18px;
  background:var(--espresso);
}
.podcast-hero .hero-art picture{display:block;width:100%;height:100%}
.podcast-hero .hero-art img{display:block;width:100%;height:100%;object-fit:contain;max-width:none;margin:0;filter:saturate(.82)}
.podcast-hero .hero-art::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(25,18,12,.56) 0%,rgba(25,18,12,.36) 28%,rgba(25,18,12,0) 56%);
}
.hero-title{position:absolute;z-index:2;top:12%;left:7%;width:52%;color:var(--sand);text-shadow:0 2px 20px rgba(25,18,12,.35)}
.hero-title-season{margin:0 0 14px;font:11px/1.5 Body,Arial,sans-serif;letter-spacing:.16em}
.hero-title h1{font-size:clamp(56px,8.5vw,127px);font-size:9.6cqw;line-height:.90;letter-spacing:-.025em;color:inherit;margin:0}
.hero-title h1 span{display:block;white-space:nowrap}
/* Enlarge I AM through its font size, preserving Gravity's natural proportions. */
.hero-title h1 span:first-child{font-size:1.65em}
.hero-quote{margin:1.85cqw 0 0;padding:0;border:0;color:var(--sand);font:400 max(11px,1.65cqw)/1.45 Body,Arial,sans-serif;letter-spacing:0}
.hero-quote p{margin:0;font:inherit;font-style:italic;color:inherit}
.hero-quote strong{font:inherit;font-weight:700;color:inherit}
.hero-quote footer{margin-top:.7cqw;font:400 max(10px,.98cqw)/1.5 Body,Arial,sans-serif;color:inherit;letter-spacing:.035em;opacity:.85}
.hero-quote footer span{font:inherit}
.hero-quote footer span::before{content:"· ";}
@media(max-width:700px){
  .podcast-hero .hero-art{aspect-ratio:940/1670}
  .podcast-hero .hero-art::after{background:linear-gradient(180deg,rgba(25,18,12,.48) 0%,rgba(25,18,12,.18) 21%,rgba(25,18,12,0) 33%)}
  .hero-title{top:2.7%;left:7%;width:86%}
  .hero-title-season{font-size:9px;letter-spacing:.13em;margin-bottom:10px}
  .hero-title h1{font-size:clamp(42px,14.3vw,100px);font-size:16.2cqw;line-height:.90}
  .hero-title h1 span:first-child{font-size:1.4em}
  .hero-quote{width:55%;margin-top:4cqw;font-size:max(12px,3.2cqw);line-height:1.5}
  .hero-quote footer{margin-top:2cqw;font-size:max(10px,2.65cqw)}
  .hero-quote footer span{display:block}
  .hero-quote footer span::before{content:none}
  .hero-quote br{display:none}
}
.hero-caption{gap:32px;padding-block:30px 36px}
.hero-caption-copy{min-width:0}
.hero-caption-copy .eyebrow{margin:0 0 12px;color:var(--gold)}
.hero-caption-copy .hero-line{
  margin:0;
  font-size:clamp(22px,2.25vw,32px);
  line-height:1.4;
  letter-spacing:-.012em;
}
.hero-caption .button{flex:0 0 auto;align-self:center}

.introduction{
  position:relative;
  isolation:isolate;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(36px,7vw,108px);
  align-items:start;
  padding:clamp(42px,4.6vw,70px) clamp(12px,2vw,30px);
  margin-block:18px clamp(46px,5vw,76px);
  border:0;
}
.introduction:before{
  content:'';
  position:absolute;
  z-index:-1;
  inset:0;
  border:1px solid var(--section-line);
  border-radius:20px;
  background:linear-gradient(125deg,rgba(214,177,113,.035),transparent 78%);
  pointer-events:none;
}
.introduction .eyebrow{margin-bottom:24px}
.intro-copy{max-width:49ch;font-size:clamp(16px,1.3vw,18px);line-height:1.75}
.intro-copy p{margin-bottom:22px}
.intro-copy p:last-child{margin-bottom:0}
.intro-copy .intro-note{font-size:14px;line-height:1.65}

.season{
  background:var(--paper);
  color:var(--espresso);
  border-block:1px solid rgba(97,70,30,.24);
  padding-block:clamp(52px,6vw,88px) clamp(54px,6vw,88px);
}
.season-heading{margin-bottom:30px;align-items:center;gap:28px}
.season-heading .eyebrow{margin-bottom:16px}
.season-heading>p{font-size:14px;line-height:1.6;letter-spacing:.035em}
.season-intro{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:32px;
  margin-bottom:30px;
}
.season-intro p{margin:0}
.season-lead{max-width:53ch;font-size:17px;line-height:1.65}
.season-note{max-width:34ch;font-size:14px;line-height:1.65;color:var(--bronze)}
.chapter-index{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:8px;
  padding-block:16px;
  margin-bottom:clamp(38px,4vw,58px);
  border-block:1px solid rgba(97,70,30,.22);
}
.chapter-index-link{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  min-height:44px;
  padding:8px 4px;
  color:var(--bronze);
  text-decoration:none;
  border:1px solid transparent;
  border-radius:3px;
  font-size:13px;
  line-height:1;
  letter-spacing:.05em;
  font-variant-numeric:tabular-nums;
}
.chapter-index-link:hover{border-color:rgba(97,70,30,.36);color:var(--espresso);background:rgba(36,28,18,.035)}
.chapter-index-link:focus-visible{outline-color:var(--bronze);outline-offset:2px}

.chapter-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:56px 32px;align-items:stretch}
.chapter{display:flex;flex-direction:column;min-width:0;scroll-margin-top:28px}
.cover-button{
  flex:0 0 auto;
  aspect-ratio:1;
  border:1px solid rgba(97,70,30,.24);
  border-radius:10px;
  background:var(--espresso);
}
.cover-button img{width:100%;height:100%;object-fit:contain;transform:none}
.chapter-meta{
  flex:0 0 auto;
  margin:22px 0 14px;
  gap:12px;
  color:var(--bronze);
  font-size:10px;
  line-height:1.5;
  letter-spacing:.13em;
  font-variant-numeric:tabular-nums;
}
.chapter-copy{flex:1;min-width:0}
.chapter h3{min-height:2.24em;line-height:1.12}
.chapter-subtitle{margin:10px 0 0;font-size:13px;line-height:1.6}
.teaser{margin:18px 0 22px;font-size:16px;line-height:1.75;color:#403222}
.chapter-actions{
  flex:0 0 auto;
  margin-top:auto;
  padding-top:0;
  gap:0;
  border-top:1px solid rgba(97,70,30,.3);
}
.chapter-actions details{width:100%;flex:1 1 100%;min-width:0}
.chapter-actions summary,
.chapter-actions details[open] summary{
  justify-content:space-between;
  gap:12px;
  min-height:52px;
  padding:13px 0;
  font-size:13px;
  line-height:1.5;
  color:var(--bronze);
}
.chapter-actions summary>span{flex:0 0 auto;font-size:22px;line-height:1}
.chapter-actions summary:hover{color:var(--espresso)}
.chapter-actions summary:focus-visible{outline-color:var(--bronze);outline-offset:3px}
.description{
  padding:20px;
  border:1px solid rgba(97,70,30,.2);
  border-radius:6px;
  background:rgba(255,255,255,.18);
  font-size:15px;
  line-height:1.75;
  color:#403222;
}
.description p{margin:0 0 18px}
.description p:last-child{margin-bottom:0}

/* Share the cover, metadata and story baselines within each desktop row. */
@supports(grid-template-rows:subgrid){
  .chapter-grid{row-gap:0}
  .chapter{
    display:grid;
    grid-template-rows:subgrid;
    grid-row:span 4;
    row-gap:0;
  }
  .chapter-copy{align-self:start}
  .chapter-actions{margin-top:0;padding-bottom:56px}
  .chapter:nth-last-child(-n+3) .chapter-actions{padding-bottom:0}
}

.about-ali{
  padding-block:clamp(58px,6.4vw,98px);
  border-bottom:0;
}
.about-ali-inner{gap:clamp(36px,6vw,88px);grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.about-ali-portrait{max-width:590px;width:100%}
.about-ali-copy .eyebrow{margin-bottom:22px}
.about-ali-copy h3{font-size:clamp(30px,3.2vw,46px);line-height:1.14;margin-bottom:26px}
.about-ali-copy>p:not(.eyebrow){font-size:clamp(16px,1.35vw,18px);line-height:1.75;margin-bottom:22px}
.about-ali-copy .button{margin-top:8px}
.footer{padding-block:28px 38px;gap:20px;border-top-color:var(--section-line)}
.footer p{font-size:14px;margin:0}
.footer nav{gap:24px}

@media(max-width:1050px){
  .chapter-grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:30px}
  .chapter h3{font-size:clamp(26px,3vw,32px)}
  .season-intro{gap:28px}
  @supports(grid-template-rows:subgrid){
    .chapter:nth-last-child(-n+3) .chapter-actions{padding-bottom:56px}
    .chapter:nth-last-child(-n+2) .chapter-actions{padding-bottom:0}
  }
}
@media(max-width:800px){
  .hero-caption{align-items:flex-start;gap:24px}
  .hero-caption .button{font-size:13px;padding-inline:17px;gap:12px}
  .introduction{gap:36px;padding:38px 28px}
  .introduction h1{font-size:clamp(40px,5.8vw,48px)}
  .season-intro{display:block}
  .season-lead{max-width:58ch}
  .season-intro .season-note{max-width:58ch;margin-top:15px}
  .chapter-index{grid-template-columns:repeat(6,minmax(0,1fr))}
  .about-ali-inner{grid-template-columns:1fr;gap:30px}
  .about-ali-portrait{margin-inline:auto}
  .about-ali-copy{max-width:58ch}
}
@media(max-width:650px){
  :root{--gutter:24px}
  .site-masthead{padding-block:22px 18px}
  .podcast-hero{padding-top:2px}
  .podcast-hero .hero-art{border-radius:10px}
  .hero-caption{display:block;padding-block:24px 30px}
  .hero-caption-copy .eyebrow{font-size:9px;letter-spacing:.13em;margin-bottom:12px}
  .hero-caption-copy .hero-line{font-size:23px;line-height:1.4}
  .hero-caption .button{width:100%;font-size:14px;margin-top:24px}
  .introduction{grid-template-columns:1fr;gap:28px;padding:32px 23px;margin-block:10px 36px}
  .introduction:before{border-radius:16px}
  .introduction .eyebrow{font-size:10px;letter-spacing:.13em;margin-bottom:20px}
  .introduction h1{font-size:clamp(38px,10.6vw,52px)}
  .intro-copy{font-size:16px;line-height:1.75}
  .season{padding-block:46px 50px}
  .season-heading{display:block;margin-bottom:24px}
  .season-heading .eyebrow{font-size:10px;margin-bottom:14px}
  .season-heading>p{margin-top:16px;font-size:13px}
  .season-lead{font-size:16px}
  .season-note{font-size:13px}
  .chapter-index{grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;padding-block:10px;margin-bottom:34px}
  .chapter-grid{grid-template-columns:1fr;gap:40px}
  .chapter{display:flex;grid-row:auto}
  .chapter h3{font-size:clamp(28px,7.4vw,34px);min-height:0}
  .chapter-meta{margin-top:18px;font-size:10px}
  .teaser{font-size:16px;margin-block:16px 20px}
  .chapter-actions{margin-top:auto}
  .chapter-grid .chapter .chapter-actions{padding-bottom:0}
  .chapter-actions summary,.chapter-actions details[open] summary{font-size:13px;min-height:50px}
  .description{padding:17px;font-size:15px}
  .about-ali{padding-block:48px 54px}
  .about-ali-copy .eyebrow{font-size:10px;letter-spacing:.13em}
  .about-ali-copy h3{font-size:clamp(28px,7vw,36px);margin-bottom:24px}
  .about-ali-copy>p:not(.eyebrow){font-size:16px}
  .footer{padding-block:26px 32px;gap:18px}
  .footer p{font-size:13px}
}
@media(prefers-reduced-motion:reduce){
  .podcast-hero .hero-art,.cover-button img{transition:none;transform:none}
}