:root{color-scheme:dark;--ink:#091f30;--navy:#0d2b43;--blue:#144b77;--sky:#78bde9;--paper:#f7fbff;--muted:#c4d3df;--line:#41627a;font-family:Arial,Helvetica,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--paper)}a{color:inherit;text-underline-offset:5px}a:focus-visible,summary:focus-visible{outline:3px solid var(--sky);outline-offset:6px}.skip{position:absolute;top:-4rem;left:1rem;padding:1rem;background:var(--ink);z-index:5}.skip:focus{top:1rem}.wrap{width:min(90%,1180px);margin-inline:auto}header,footer{background:linear-gradient(105deg,var(--ink),var(--blue));border-bottom:1px solid var(--line)}.nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:1rem}.nav a{text-decoration:none}.nav a:hover,.under:hover{color:var(--sky)}.brand{font-weight:800;letter-spacing:.02em}.brand span{color:var(--sky);margin-right:.35rem}.nav nav{display:flex;gap:clamp(.9rem,4vw,2.6rem)}.nav nav a,.label,.button,.strip,small{font-size:.76rem;text-transform:uppercase;font-weight:800;letter-spacing:.13em}
.hero{position:relative;overflow:hidden;background:radial-gradient(ellipse at 88% 14%,#0b3b65,transparent 58%),linear-gradient(115deg,#031322,#07243b);isolation:isolate}.hero-copy{position:relative;padding-block:clamp(3.5rem,7vw,6rem);text-align:center}h1,h2,p{margin:0}h1,h2{letter-spacing:-.055em;line-height:.98}h1{font-size:clamp(3.05rem,10vw,8.7rem);margin-block:.65rem 1.4rem}em{color:var(--sky);font-style:normal}p,li{line-height:1.65;color:var(--muted)}.label{color:var(--sky);line-height:1.4}.intro{max-width:58rem;margin-inline:auto;font-size:clamp(1.15rem,2.4vw,1.55rem)}.button{display:inline-flex;gap:1.2rem;padding:1.15rem 1.35rem;background:var(--blue);border:1px solid #5e93b7;text-decoration:none;margin-top:2rem}.button:hover{background:#1a5d91}.strip{border-block:1px solid var(--line);background:var(--navy)}.strip .wrap{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:.7rem 1.8rem;padding-block:1.15rem}.strip span{color:var(--sky);font-size:.55rem}.section{padding-block:clamp(3rem,8vw,7rem)}.episode{display:grid;grid-template-columns:minmax(140px,1fr) 3fr;border:1px solid var(--line);margin-top:1rem;background:#0e2a40}.number{display:grid;align-content:center;justify-items:center;min-height:230px;background:linear-gradient(145deg,#194f79,#0d304d);font-size:clamp(4rem,12vw,8rem);font-weight:800;color:var(--sky);line-height:1}.number small{color:var(--paper)}.episode-copy{padding:clamp(1.25rem,5vw,3rem)}h2{font-size:clamp(2.1rem,5vw,4.5rem);margin-block:.45rem 1rem}details{margin-top:1.25rem}summary{cursor:pointer;color:var(--sky);font-weight:700}.about{background:#0c263b;border-block:1px solid var(--line)}.about-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:2rem}.about p+p{margin-block:1rem}.under{font-weight:700}footer{font-size:.9rem}
@media(max-width:660px){.episode,.about-grid{grid-template-columns:1fr}.number{min-height:120px}.strip .wrap{gap:.65rem;font-size:.66rem}footer .nav{flex-wrap:wrap;padding-block:1rem}.about-grid{gap:1rem}}

.episode-copy h3 {
  margin-block: .45rem 1rem;
  font-size: clamp(1.85rem, 4vw, 3.65rem);
  line-height: 1.02;
  letter-spacing: -.045em;
}
@media (max-width: 380px) {
  header .nav {
    flex-wrap: wrap;
    padding-block: 1rem;
  }
}
.hero-subtitle {
  margin-block: 0 .85rem;
  font-size: clamp(1.4rem, 3vw, 2.35rem);
  letter-spacing: -.025em;
  line-height: 1.15;
}
.about-tagline {
  margin: 0;
  font-size: clamp(1.35rem, 3vw, 2.2rem);
  line-height: 1.15;
}

.wave {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: .53;
  pointer-events: none;
  z-index: -1;
}

.wave > .wave-drift {
  transform-box: view-box;
}

.wave-drift {
  transform-origin: center;
  animation: wave-drift 16s ease-in-out infinite alternate;
}

@keyframes wave-drift {
  from { transform: translate(-4%, 38%) scaleY(.48); }
  to { transform: translate(4%, 32%) scaleY(.58); }
}

@media (max-width: 660px) {
  .wave { opacity: .38; }
}

@media (prefers-reduced-motion: reduce) {
  .wave-drift { animation: none; transform: translateY(35%) scaleY(.53); }
}

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
