:root{
  --canvas:#140f0c;
  --panel:#1c1612;
  --ivory:#f3ece2;
  --linen:#e6dccf;
  --stone:#b7aa9a;
  --ash:#8d8174;
  --rule:rgba(243,236,226,.14);
  --oxblood:#e24a1c;
  --oxblood-deep:#c43b14;
  --shadow:rgba(0,0,0,.55);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;background:var(--canvas);color:var(--ivory);font-family:Newsreader,Georgia,"Times New Roman",serif}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
.wrap{width:min(1120px,calc(100% - 2.4rem));margin-inline:auto}
.skip{position:absolute;left:-999px;top:0}
.skip:focus{left:1rem;top:1rem;z-index:80;background:var(--ivory);color:var(--canvas);padding:.6rem 1rem}

header.site{
  position:sticky;top:0;z-index:40;
  display:flex;align-items:center;justify-content:space-between;
  padding:.85rem 1.2rem;
  background:rgba(20,15,12,.88);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--rule);
}
.brand{font-family:Newsreader,serif;font-size:1.15rem;letter-spacing:.01em}
.brand b{font-family:Oswald,sans-serif;color:var(--oxblood);font-weight:600;margin-left:.2rem;letter-spacing:.04em}
nav.desk{display:flex;gap:1.4rem;align-items:center}
nav.desk a{font-family:Oswald,sans-serif;font-size:.72rem;letter-spacing:.16em;color:var(--stone);text-transform:uppercase}
nav.desk a.active,nav.desk a:hover{color:var(--ivory)}
.coming-chip{font-family:Oswald,sans-serif;font-size:.68rem;letter-spacing:.16em;color:var(--oxblood);text-transform:uppercase}
.menu-btn{display:none;background:none;border:0;color:var(--ivory);font-size:1.4rem;padding:.3rem}
nav.mobile{display:none}

.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden}
.hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%}
.hero .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,15,12,.45),rgba(20,15,12,.55) 45%,#140f0c)}
.hero .copy{position:relative;width:min(1120px,calc(100% - 2.4rem));margin:0 auto;padding:7rem 0 3.2rem}
.kicker{font-family:Oswald,sans-serif;letter-spacing:.22em;font-size:.72rem;color:var(--stone);text-transform:uppercase}

.lockup{margin:.9rem 0 0;max-width:16.5ch;line-height:.82}
.lockup .bright{display:block;font-family:Newsreader,serif;font-weight:500;font-size:clamp(3.1rem,8vw,6.4rem);letter-spacing:-.02em}
.lockup .but,.lockup .unrel{display:block;font-family:Oswald,sans-serif;font-weight:600;color:var(--oxblood);letter-spacing:.01em}
.lockup .but{font-size:clamp(1.7rem,4.6vw,3.4rem);margin-top:.08em;line-height:.86}
.lockup .unrel{font-size:clamp(2.3rem,6.2vw,5.1rem);line-height:.84;margin-top:.02em}

.subtitle{margin:1rem 0 0;font-style:italic;font-size:clamp(1.15rem,2.4vw,1.85rem);color:var(--linen);max-width:22ch}
.epigraph{margin:.7rem 0 0;font-family:Oswald,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--stone);font-size:.78rem;max-width:36rem}
.cta-row{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.6rem}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:2.8rem;padding:0 1.1rem;font-family:Oswald,sans-serif;letter-spacing:.16em;text-transform:uppercase;font-size:.72rem}
.btn.primary{background:var(--ivory);color:var(--canvas)}
.btn.ghost{border:1px solid rgba(243,236,226,.35);color:var(--ivory)}
.readon{display:inline-flex;gap:.45rem;margin-top:1.4rem;color:var(--ash);font-family:Oswald,sans-serif;letter-spacing:.16em;text-transform:uppercase;font-size:.68rem}

.marquee{overflow:hidden;border-block:1px solid var(--rule);background:var(--panel);padding:.7rem 0}
.marquee-track{display:flex;width:max-content;animation:slide 32s linear infinite;white-space:nowrap}
.marquee-track span{padding:0 1.1rem;font-family:Oswald,sans-serif;letter-spacing:.18em;text-transform:uppercase;font-size:.72rem;color:var(--stone)}
.marquee-track i{color:var(--oxblood);font-style:normal;margin-right:.7rem}
@keyframes slide{to{transform:translateX(-50%)}}

section.block{padding:4.2rem 0}
h2.display{font-family:Newsreader,serif;font-weight:500;font-size:clamp(2rem,5vw,3.8rem);line-height:1.05;margin:.6rem 0 0;max-width:18ch}
.lead{font-size:1.15rem;line-height:1.65;color:var(--stone);max-width:40rem;margin-top:1.1rem}
.prose p{font-size:1.08rem;line-height:1.7;color:var(--linen);margin:0 0 1rem;max-width:42rem}
.grid-2{display:grid;gap:2.2rem}
@media(min-width:860px){.grid-2{grid-template-columns:1fr 1fr;align-items:center}}
.cover{width:min(22rem,100%);margin:0 auto;filter:drop-shadow(12px 20px 36px var(--shadow))}
.questions{list-style:none;padding:0;margin:1.2rem 0 0}
.questions li{border-left:1px solid var(--rule);padding:.2rem 0 .2rem 1rem;margin:0 0 .8rem;color:var(--linen);max-width:40rem}

.essay-list{display:grid;gap:0}
.essay-list a{display:block;padding:1.4rem 0;border-bottom:1px solid var(--rule)}
.essay-list h3{margin:0;font-family:Oswald,sans-serif;text-transform:uppercase;letter-spacing:.04em;font-size:1.25rem}
.essay-list p{margin:.45rem 0 0;color:var(--stone);max-width:36rem}
.listen-home{display:grid;gap:1rem}
@media(min-width:800px){.listen-home{grid-template-columns:1fr 1fr}}

.player{border:1px solid var(--rule);background:var(--panel);padding:1rem 1.05rem 1.05rem;margin:1.1rem 0 1.4rem}
.player .label{font-family:Oswald,sans-serif;letter-spacing:.16em;text-transform:uppercase;font-size:.68rem;color:var(--oxblood);margin:0 0 .55rem}
.player audio{width:100%;height:2.4rem}
.player.missing{color:var(--ash);font-size:.95rem}

.author-card{display:grid;gap:1.4rem 1.8rem;align-items:start}
@media(min-width:800px){.author-card{grid-template-columns:168px minmax(0,1fr)}}
.portrait{
  width:168px;
  max-width:46vw;
  height:auto;
  object-fit:contain;
  object-position:center top;
}

footer.site{border-top:1px solid var(--rule);padding:2.4rem 0 3rem;color:var(--ash);text-align:center}
footer.site .links{display:flex;justify-content:center;gap:1.2rem;flex-wrap:wrap;margin-bottom:1.1rem}
footer.site a{font-family:Oswald,sans-serif;letter-spacing:.14em;text-transform:uppercase;font-size:.68rem}

.page-hero{padding:5.5rem 0 1.5rem}
.crumb{font-family:Oswald,sans-serif;letter-spacing:.16em;text-transform:uppercase;font-size:.68rem;color:var(--ash)}

@media(max-width:820px){
  nav.desk,.coming-chip{display:none}
  .menu-btn{display:block}
  nav.mobile.open{display:flex;flex-direction:column;position:absolute;top:58px;left:0;right:0;background:#140f0c;border-bottom:1px solid var(--rule);padding:1rem 1.2rem 1.3rem;gap:.9rem}
  nav.mobile a{font-family:Oswald,sans-serif;letter-spacing:.16em;text-transform:uppercase}
}

.portrait{
  width:168px;height:168px;max-width:46vw;max-height:46vw;
  object-fit:cover;object-position:center 18%;
}
.byline{display:flex;align-items:center;gap:.7rem;margin:1.1rem 0 0;color:var(--ash);
  font-family:Oswald,sans-serif;letter-spacing:.14em;text-transform:uppercase;font-size:.68rem}
.byline-photo{width:36px;height:36px;max-width:36px;border-radius:0}
.author-hero{display:grid;gap:1.4rem;align-items:end}
@media(min-width:720px){.author-hero{grid-template-columns:168px minmax(0,1fr)}}
.player[hidden],.player.is-missing{display:none !important}