/* Cold Arrival -- exact stylesheet extracted from the source production build
   (tailwind-compiled styles.css), reformatted 1:1 with identical selectors and values.
   Cache bust: 2026-08-07-flexbox-crew */

:root {
  --font-sans: "Inter", "Helvetica Neue", Arial, system-ui, -apple-system, sans-serif;
  --font-display: "Canela", "Iowan Old Style", "Baskerville", "Times New Roman", Georgia, serif;
  --font-weight-bold: 700;
  --font-weight-semibold: 600;
}

*,:after,:before,::backdrop {
  box-sizing: border-box;
  border: 0 solid;
  margin: 0;
  padding: 0;
}
html,:host {
  -webkit-text-size-adjust: 100%;
  tab-size: 4;
  line-height: 1.5;
  font-family: var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
  font-feature-settings: var(--default-font-feature-settings,normal);
  font-variation-settings: var(--default-font-variation-settings,normal);
  -webkit-tap-highlight-color: transparent;
}
h1,h2,h3,h4,h5,h6 {
  font-size: inherit;
  font-weight: inherit;
}
a {
  color: inherit;
  -webkit-text-decoration: inherit;
  -webkit-text-decoration: inherit;
  -webkit-text-decoration: inherit;
  -webkit-text-decoration: inherit;
  text-decoration: inherit;
}
img,svg,video,canvas,audio,iframe,embed,object {
  vertical-align: middle;
  display: block;
}
img,video {
  max-width: 100%;
  height: auto;
}
button,input,select,optgroup,textarea {
  font: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  letter-spacing: inherit;
  color: inherit;
  opacity: 1;
  background-color: #0000;
  border-radius: 0;
}
button,input:where([type=button],[type=reset],[type=submit]) {
  appearance: button;
}
.sr-only {
  clip-path: inset(50%);
  white-space: nowrap;
  border-width: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  overflow: hidden;
}
.font-bold {
  --tw-font-weight: var(--font-weight-bold);
  font-weight: var(--font-weight-bold);
}
.font-semibold {
  --tw-font-weight: var(--font-weight-semibold);
  font-weight: var(--font-weight-semibold);
}
html {
  scroll-behavior: smooth;
}
body {
  color: #f8f8f6;
  font-family: var(--font-sans);
  background: #183a5a;
  margin: 0;
  overflow-x: hidden;
}
button,a {
  font: inherit;
}
button {
  color: inherit;
}
img {
  max-width: 100%;
  display: block;
}
h1,h2,h3,p {
  margin-top: 0;
}
h1,h2,h3 {
  font-family: var(--font-display);
  font-weight: 400;
  line-height: .94;
}
.site-shell {
  background: #183a5a;
  min-height: 100vh;
  overflow: hidden;
}
.sr-only {
  clip: rect(0,0,0,0)!important;
  white-space: nowrap!important;
  border: 0!important;
  width: 1px!important;
  height: 1px!important;
  margin: -1px!important;
  padding: 0!important;
  position: absolute!important;
  overflow: hidden!important;
}
.section-pad {
  padding: clamp(5rem,10vw,9rem) max(5vw,50vw - 660px);
}
.eyebrow {
  color: #d6a756;
  letter-spacing: .22em;
  text-transform: uppercase;
  margin-bottom: 1.4rem;
  font-size: .68rem;
  font-weight: 700;
}
.eyebrow--dark {
  color: #183a5a;
}
.topbar {
  z-index: 40;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  height: 82px;
  padding: 0 5vw;
  transition: background .35s,-webkit-backdrop-filter .35s,backdrop-filter .35s,height .35s;
  display: grid;
  position: fixed;
  inset: 0 0 auto;
}
.topbar--scrolled {
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  background: #102a42eb;
  border-bottom: 1px solid #f8f8f61f;
  height: 68px;
}
.wordmark {
  color: #f8f8f6;
  letter-spacing: .16em;
  width: max-content;
  font-size: .8rem;
  line-height: .9;
  text-decoration: none;
}
.wordmark img {
  height: 40px;
  width: auto;
  display: block;
}
.wordmark span,.wordmark strong {
  display: block;
}
.wordmark strong {
  color: #d6a756;
  font-size: 1.3rem;
  font-weight: 700;
}
.desktop-nav {
  gap: 2rem;
  display: flex;
}
.desktop-nav button {
  color: #f8f8f6;
  cursor: pointer;
  background: 0 0;
  border: 0;
  padding: .7rem 0;
  font-size: .75rem;
  position: relative;
}
.desktop-nav button:after {
  content: "";
  background: #d6a756;
  height: 1px;
  transition: right .25s;
  position: absolute;
  bottom: 4px;
  left: 0;
  right: 100%;
}
.desktop-nav button:hover:after {
  right: 0;
}
.status-pill {
  text-align: left;
  cursor: pointer;
  background: #183a5a73;
  border: 1px solid #f8f8f647;
  justify-self: end;
  padding: .65rem .9rem;
  font-size: .72rem;
  font-weight: 700;
}
.status-pill span {
  color: #d6a756;
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-top: .12rem;
  font-size: .5rem;
  display: block;
}
.menu-button {
  cursor: pointer;
  background: 0 0;
  border: 0;
  padding: .75rem;
  display: none;
}
.menu-button svg {
  width: 26px;
}
.hero {
  isolation: isolate;
  border-bottom: 10px solid #d6a756;
  align-items: flex-end;
  min-height: 100svh;
  padding: 9rem 5vw 7vh;
  display: flex;
  position: relative;
}
.golden-bar {
  background: #d6a756;
  height: 10px;
  width: 100%;
  position: relative;
  z-index: 100;
  margin-top: -10px;
}
.hero-image {
  object-fit: cover;
  object-position: center;
  z-index: -3;
  filter: saturate(.82)contrast(1.12);
  width: 100%;
  height: 100%;
  animation: 18s ease-out both heroDrift;
  position: absolute;
  inset: 0;
}
.hero-wash {
  z-index: -2;
  background: linear-gradient(90deg,#0a1e30fa 0%,#183a5ae0 38%,#183a5a33 76%),linear-gradient(#05111c52 0%,#0000 57%,#183a5a 100%);
  position: absolute;
  inset: 0;
}
.hero-wash:after {
  content: "";
  background: linear-gradient(115deg,#0000 60%,#d6a75629 60.2%,#0000 60.7%);
  position: absolute;
  inset: 0;
}
.hero-content {
  width: min(760px,72vw);
  animation: .9s .12s both riseIn;
}
.hero-watermark {
  object-fit: contain;
  object-position: left center;
  filter: drop-shadow(0 15px 30px #030f194d);
  width: min(720px,72vw);
  max-height: 265px;
}
.hero-quote {
  font-family: var(--font-display);
  color: #f8f8f6;
  margin: 2rem 0 1.3rem;
  font-size: clamp(1.5rem,2.7vw,2.5rem);
  font-style: italic;
}
.hero-meta {
  text-transform: uppercase;
  letter-spacing: .14em;
  color: #f8f8f6c7;
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
  font-size: .68rem;
  display: flex;
}
.hero-meta i {
  background: #d6a756;
  border-radius: 50%;
  width: 3px;
  height: 3px;
}
.hero-logline {
  color: #f8f8f6d6;
  max-width: 650px;
  margin: 1.6rem 0 2.2rem;
  font-size: clamp(.95rem,1.4vw,1.12rem);
  line-height: 1.72;
}
.hero-actions {
  flex-wrap: wrap;
  align-items: center;
  gap: 1.7rem;
  display: flex;
}
.primary-button {
  color: #183a5a;
  cursor: pointer;
  background: #f8f8f6;
  border: 0;
  justify-content: center;
  align-items: center;
  gap: .75rem;
  min-height: 52px;
  padding: 0 1.5rem;
  font-weight: 700;
  transition: transform .25s,background .25s;
  display: inline-flex;
}
.primary-button:hover {
  background: #d6a756;
  transform: translateY(-2px);
}
.primary-button svg {
  width: 17px;
}
.primary-button--gold {
  background: #d6a756;
}
.primary-button--gold:hover {
  background: #f8f8f6;
}
.text-button {
  cursor: pointer;
  background: 0 0;
  border: 0;
  align-items: center;
  gap: .6rem;
  padding: .8rem 0;
  display: flex;
}
.text-button svg {
  width: 18px;
  transition: transform .25s;
}
.text-button:hover svg {
  transform: translateY(4px);
}
.hero-credit {
  color: #183a5a;
  letter-spacing: .15em;
  text-transform: uppercase;
  background: #d6a756;
  padding: .65rem .9rem;
  font-size: .57rem;
  font-weight: 700;
  position: absolute;
  bottom: 3.2vh;
  right: 5vw;
}
/* Slideshow and snow effect styles */
.hero-slides {
  position: absolute;
  inset: -6% -6% 0 -6%;
  z-index: -3;
}
.hero-slide {
  position: absolute;
  inset: 0;
  width: 112%;
  height: 112%;
  object-fit: cover;
  object-position: center 42%;
  opacity: 0;
  filter: saturate(1.05) brightness(.88) contrast(1.03);
  animation: kenburns 22s ease-in-out infinite alternate;
  transition: opacity 2.4s ease;
}
.hero-slide.active {
  opacity: 1;
  z-index: 1;
}
@keyframes kenburns {
  0% {
    transform: scale(1) translate3d(0, 0, 0);
  }
  100% {
    transform: scale(1.14) translate3d(-1.6%, -1.1%, 0);
  }
}
.hero-scrim {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    radial-gradient(120% 90% at 20% 15%, rgba(5, 17, 28, 0) 42%, rgba(5, 17, 28, .32) 100%),
    linear-gradient(180deg, rgba(5, 17, 28, .28) 0%, rgba(16, 42, 66, .48) 48%, #183a5a 94%),
    linear-gradient(90deg, #05111c 0%, rgba(5, 17, 28, .22) 34%, rgba(5, 17, 28, .05) 64%);
}
.hero canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  opacity: .5;
}
.story-section {
  background: #183a5a;
  grid-template-columns: 9vw minmax(260px,.75fr) 1fr;
  gap: clamp(2rem,5vw,6rem);
  display: grid;
  position: relative;
}
.section-index {
  color: #d6a75652;
  font-family: var(--font-display);
  border-top: 1px solid #d6a75666;
  padding-top: 1rem;
  font-size: 3rem;
}
.story-lead h2,.section-heading-row h2 {
  letter-spacing: -.035em;
  font-size: clamp(3rem,6vw,6.4rem);
}
.story-lead h2 em,.character-intro h2 em {
  color: #d6a756;
  font-weight: 400;
}
.story-copy {
  align-self: end;
  padding-top: 7rem;
}
.story-copy p {
  color: #f8f8f6b3;
  max-width: 680px;
  line-height: 1.8;
}
.story-copy .large-copy {
  font-family: var(--font-display);
  color: #f8f8f6;
  font-size: 1.45rem;
  line-height: 1.5;
}
.story-copy strong {
  color: #d6a756;
  font-weight: 500;
}
.full-quote {
  font-family: var(--font-display);
  color: #d6a756;
  border-top: 1px solid #f8f8f62e;
  grid-column: 2/4;
  margin: 4rem 0 0;
  padding: 3rem 0 0;
  font-size: clamp(1.7rem,3vw,3.2rem);
  font-style: italic;
  line-height: 1.3;
}
.purpose-section {
  color: #183a5a;
  background: #d6a756;
  grid-template-columns: 1.04fr .96fr;
  min-height: 760px;
  display: grid;
}
.purpose-image-wrap {
  min-height: 680px;
  position: relative;
  overflow: hidden;
}
.purpose-image {
  object-fit: cover;
  filter: saturate(.75);
  width: 100%;
  height: 100%;
}
.image-caption {
  color: #f8f8f6;
  letter-spacing: .16em;
  text-transform: uppercase;
  background: #183a5a;
  padding: .7rem 1rem;
  font-size: .6rem;
  position: absolute;
  bottom: 1.5rem;
  left: 1.5rem;
}
.purpose-content {
  padding: clamp(4rem,8vw,8rem);
}
.purpose-content h2 {
  letter-spacing: -.04em;
  margin-bottom: 3rem;
  font-size: clamp(3.5rem,6.5vw,7.5rem);
}
.principles {
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
  display: grid;
}
.principles article {
  color: #f8f8f6;
  grid-template-columns: 2.5rem 1fr;
  align-content: start;
  gap: 1.2rem;
  min-height: 165px;
  padding: 1.5rem;
  display: grid;
}
.principles article>span {
  opacity: .82;
  font-size: .65rem;
  font-weight: 700;
}
.principles h3 {
  font-family: var(--font-sans);
  margin-bottom: .55rem;
  font-size: 1.05rem;
  font-weight: 700;
}
.principles p {
  color: #f8f8f6d1;
  margin: 0;
  font-size: .82rem;
  line-height: 1.55;
}
.principle--1 {
  background: #3f5f4b;
}
.principle--2 {
  background: #8c5a3c;
}
.principle--3 {
  background: #c96c4a;
}
.principle--4 {
  background: #7c3048;
}
.episodes-section {
  background: #102a42;
}
.section-heading-row {
  justify-content: space-between;
  align-items: end;
  gap: 3rem;
  margin-bottom: 4rem;
  display: flex;
}
.section-heading-row>div:first-child {
  max-width: 950px;
}
.episode-counter {
  align-items: baseline;
  gap: .5rem;
  display: flex;
}
.episode-counter strong {
  font-family: var(--font-display);
  color: #d6a756;
  font-size: 4rem;
}
.episode-counter span {
  color: #f8f8f680;
}
.episode-browser {
  position: relative;
}
.episode-numbers {
  border-bottom: 1px solid #f8f8f629;
  grid-template-columns: repeat(10,1fr);
  margin-bottom: 2.5rem;
  display: grid;
}
.episode-numbers button {
  cursor: pointer;
  color: #f8f8f66b;
  background: 0 0;
  border: 0;
  padding: .85rem .2rem 1.1rem;
  font-size: .7rem;
  position: relative;
}
.episode-numbers button i {
  background: #d6a756;
  height: 3px;
  transition: left .3s,right .3s;
  position: absolute;
  bottom: -2px;
  left: 50%;
  right: 50%;
}
.episode-numbers button[aria-selected=true] {
  color: #d6a756;
}
.episode-numbers button[aria-selected=true] i {
  left: 0;
  right: 0;
}
.episode-feature {
  background: #183a5a;
  grid-template-columns: minmax(340px,.92fr) minmax(0,1.08fr);
  min-height: 480px;
  animation: .4s both softIn;
  display: grid;
}
.episode-art {
  isolation: isolate;
  background: linear-gradient(135deg,#8c5a3c,#183a5a 70%);
  flex-direction: column;
  justify-content: space-between;
  padding: 2.5rem;
  display: flex;
  position: relative;
  overflow: hidden;
}
.episode-art:before {
  content: "";
  background: conic-gradient(from var(--episode-hue),#d6a756,transparent 20%,#74a9d8 38%,transparent 55%,#c96c4a 75%,#d6a756);
  filter: blur(50px);
  opacity: .45;
  z-index: -1;
  animation: 20s linear infinite turn;
  position: absolute;
  inset: -30%;
}
.episode-art>span {
  letter-spacing: .2em;
  text-transform: uppercase;
  font-size: .65rem;
}
.episode-art>strong {
  font-family: var(--font-display);
  max-width: 600px;
  font-size: clamp(3rem,6vw,6rem);
  font-weight: 400;
  line-height: .85;
}
.episode-orbit {
  border: 1px solid #f8f8f640;
  border-radius: 50%;
  width: 210px;
  height: 210px;
  position: absolute;
  top: 50%;
  right: -50px;
  transform: translateY(-50%);
}
.episode-orbit:after {
  content: "";
  background: #d6a756;
  border-radius: 50%;
  width: 12px;
  height: 12px;
  position: absolute;
  top: 25px;
  left: 23px;
}
.episode-info {
  flex-direction: column;
  justify-content: center;
  padding: clamp(3rem,6vw,6rem);
  display: flex;
}
.episode-info h3 {
  margin-bottom: 1.8rem;
  font-size: clamp(3rem,5vw,5.6rem);
}
.episode-info>p:not(.eyebrow) {
  color: #f8f8f6b8;
  max-width: 620px;
  line-height: 1.8;
}
.runtime {
  color: #d6a756;
  align-items: center;
  gap: .55rem;
  margin-top: 1.4rem;
  font-size: .72rem;
  display: flex;
}
.runtime svg {
  width: 16px;
}
.browser-arrows {
  display: flex;
  position: absolute;
  bottom: 1.5rem;
  right: 1.5rem;
}
.browser-arrows button {
  cursor: pointer;
  background: #102a42;
  border: 1px solid #f8f8f62e;
  place-items: center;
  width: 48px;
  height: 48px;
  display: grid;
}
.browser-arrows button:hover {
  color: #183a5a;
  background: #d6a756;
}
.browser-arrows svg {
  width: 18px;
}
.palette-ribbon {
  background: #f8f8f6;
  grid-template-columns: 1.1fr 1.2fr 1fr 1fr .9fr;
  display: grid;
}
.palette-ribbon span {
  color: #f8f8f6;
  letter-spacing: .18em;
  text-transform: uppercase;
  justify-content: center;
  align-items: center;
  min-height: 86px;
  font-size: .62rem;
  font-weight: 700;
  display: flex;
}
.palette-ribbon__maple {
  background: #8c5a3c;
}
.palette-ribbon__evergreen {
  background: #3f5f4b;
}
.palette-ribbon__terracotta {
  background: #c96c4a;
}
.palette-ribbon__burgundy {
  background: #7c3048;
}
.palette-ribbon__sky {
  background: #74a9d8;
  color: #183a5a!important;
}
.characters-section {
  color: #183a5a;
  background: #f8f8f6;
  grid-template-columns: .72fr 1.28fr;
  column-gap: 7vw;
  row-gap: 30px;
  display: grid;
}
.character-intro {
  padding-top: 2rem;
}
.character-intro h2 {
  letter-spacing: -.04em;
  margin-bottom: 2rem;
  font-size: clamp(3rem,5.7vw,6.3rem);
}
.character-intro>p:last-child {
  color: #6e7378;
  max-width: 480px;
  line-height: 1.8;
}
.character-stage {
  grid-template-columns: 310px 420px;
  display: grid;
  gap: 0;
}
.character-portrait {
  color: #f8f8f6;
  align-items: flex-end;
  width: 310px;
  height: 610px;
  padding: 2rem;
  animation: .4s both softIn;
  display: flex;
  position: relative;
  overflow: hidden;
}
.character-portrait img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}
.character-portrait>span {
  font-family: var(--font-display);
  opacity: .22;
  font-size: clamp(7rem,13vw,13rem);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}
.portrait-note {
  letter-spacing: .15em;
  text-transform: uppercase;
  font-size: .58rem;
  line-height: 1.5;
  position: relative;
}
.character-detail {
  color: #f8f8f6;
  background: #183a5a;
  flex-direction: column;
  justify-content: center;
  padding: 3.5rem 3rem;
  animation: .4s both softIn;
  display: flex;
  width: 420px;
  height: 610px;
}
.character-detail>p:first-child {
  text-transform: uppercase;
  letter-spacing: .14em;
  color: #d6a756;
  font-size: .65rem;
}
.character-detail h3 {
  font-size: clamp(1.6rem,2.4vw,2.4rem);
}
.character-detail blockquote {
  font-family: var(--font-display);
  color: #d6a756;
  margin: 1.2rem 0;
  font-size: 1.4rem;
  font-style: italic;
}
.character-detail>p:last-child {
  color: #f8f8f6b3;
  font-size: .8rem;
  line-height: 1.7;
}
.character-tabs {
  flex-wrap: wrap;
  grid-column: 1/3;
  justify-content: flex-end;
  gap: .6rem;
  display: flex;
}
.character-tabs button {
  cursor: pointer;
  color: #183a5a;
  background: 0 0;
  border: 0;
  width: 62px;
  padding: 0;
}
.character-tabs button>span {
  aspect-ratio: 1;
  color: #f8f8f6;
  font-family: var(--font-display);
  filter: grayscale(.6);
  place-items: center;
  font-size: 1.3rem;
  transition: filter .25s,transform .25s;
  display: grid;
}
.character-tabs button small {
  margin-top: .5rem;
  font-size: .56rem;
  display: block;
}
.character-tabs button[aria-selected=true]>span,.character-tabs button:hover>span {
  filter: none;
  transform: translateY(-5px);
}
.crew-section {
  color: #183a5a;
  background: #f8f8f6;
  column-gap: 7vw;
  row-gap: 30px;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}
.crew-intro {
  padding-top: 2rem;
  flex: 1 0 36%;
  min-width: 0;
}
.crew-intro h2 {
  letter-spacing: -.04em;
  margin-bottom: 2rem;
  font-size: clamp(3rem,5.7vw,6.3rem);
}
.crew-intro>p:last-child {
  color: #6e7378;
  max-width: 480px;
  line-height: 1.8;
}
.crew-stage {
  grid-template-columns: 310px 420px;
  display: grid;
  flex: 1 0 64%;
  min-width: 0;
}
.crew-portrait {
  color: #f8f8f6;
  align-items: flex-end;
  width: 310px;
  height: 610px;
  padding: 3rem;
  animation: .4s both softIn;
  display: flex;
  position: relative;
  overflow: hidden;
}
.crew-portrait img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}
.crew-portrait>span {
  font-family: var(--font-display);
  opacity: .22;
  font-size: clamp(7rem,13vw,13rem);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}
.crew-detail {
  color: #f8f8f6;
  background: #183a5a;
  flex-direction: column;
  justify-content: center;
  padding: 3.5rem 3rem;
  animation: .4s both softIn;
  display: flex;
  width: 420px;
  height: 610px;
}
.crew-detail>p:first-child {
  text-transform: uppercase;
  letter-spacing: .14em;
  color: #d6a756;
  font-size: .65rem;
}
.crew-detail h3 {
  font-size: clamp(2.4rem,3.8vw,4.2rem);
}
.crew-detail blockquote {
  font-family: var(--font-display);
  color: #d6a756;
  margin: 1.2rem 0;
  font-size: 1.4rem;
  font-style: italic;
}
.crew-detail>p:last-child {
  color: #f8f8f6b3;
  font-size: .8rem;
  line-height: 1.7;
}
.crew-tabs {
  flex-wrap: wrap;
  grid-column: 1/3;
  justify-content: flex-end;
  gap: .6rem;
  display: flex;
}
.crew-tabs button {
  cursor: pointer;
  color: #183a5a;
  background: 0 0;
  border: 0;
  width: 62px;
  padding: 0;
}
.crew-tabs button>span {
  aspect-ratio: 1;
  color: #f8f8f6;
  font-family: var(--font-display);
  filter: grayscale(.6);
  place-items: center;
  font-size: 1.3rem;
  transition: filter .25s,transform .25s;
  display: grid;
}
.crew-tabs button small {
  margin-top: .5rem;
  font-size: .56rem;
  display: block;
}
.crew-tabs button[aria-selected=true]>span,.crew-tabs button:hover>span {
  filter: none;
  transform: translateY(-5px);
}
.winnipeg-section {
  background: #183a5a;
  border-top: 12px solid #74a9d8;
  grid-template-columns: minmax(0,1.28fr) minmax(0,.72fr);
  min-height: 820px;
  display: grid;
}
.winnipeg-image {
  min-height: 640px;
  position: relative;
  overflow: hidden;
}
.winnipeg-image img {
  object-fit: cover;
  filter: saturate(.88)contrast(1.04);
  width: 100%;
  height: 100%;
}
.winnipeg-overlay {
  justify-content: space-between;
  align-items: end;
  gap: 2rem;
  display: flex;
  position: absolute;
  inset: auto 2rem 2rem;
}
.winnipeg-overlay span {
  letter-spacing: .15em;
  background: #183a5a;
  padding: .55rem .7rem;
  font-size: .58rem;
}
.winnipeg-overlay p {
  color: #183a5a;
  background: #d6a756;
  margin: 0;
  padding: .8rem 1rem;
  font-size: .65rem;
  font-weight: 700;
}
.winnipeg-copy {
  flex-direction: column;
  justify-content: center;
  padding: clamp(4rem,7vw,8rem) clamp(2.5rem,5vw,6rem);
  display: flex;
  position: relative;
}
.winnipeg-copy:before {
  content: "";
  background: #c96c4a;
  width: 74px;
  height: 8px;
  margin-bottom: 2rem;
}
.winnipeg-copy h2 {
  color: #d6a756;
  font-size: clamp(3.8rem,6vw,7rem);
}
.winnipeg-copy>p:not(.eyebrow) {
  color: #f8f8f6bd;
  line-height: 1.75;
}
.visual-language {
  flex-wrap: wrap;
  gap: .65rem;
  margin-top: 2rem;
  display: flex;
}
.visual-language span {
  text-transform: uppercase;
  letter-spacing: .1em;
  border: 1px solid #7C3048;
  color: #7C3048;
  padding: .55rem .75rem;
  font-size: .6rem;
}
.creator-section {
  color: #183a5a;
  background: #d6a756;
  grid-template-columns: minmax(0,.7fr) minmax(0,1fr);
  align-items: center;
  gap: 8vw;
  display: grid;
}
.creator-monogram {
  aspect-ratio: 4/5;
  color: #f8f8f633;
  font-family: var(--font-display);
  background: #8c5a3c;
  place-items: center;
  font-size: clamp(8rem,17vw,16rem);
  display: grid;
  position: relative;
}
.creator-monogram span {
  color: #f8f8f6;
  font-family: var(--font-sans);
  letter-spacing: .15em;
  text-transform: uppercase;
  font-size: .58rem;
  line-height: 1.5;
  position: absolute;
  bottom: 2rem;
  left: 2rem;
}
.creator-copy {
  max-width: 680px;
}
.creator-copy h2 {
  letter-spacing: -.05em;
  font-size: clamp(4rem,8vw,9rem);
}
.creator-role {
  letter-spacing: .13em;
  text-transform: uppercase;
  font-size: .7rem;
  font-weight: 700;
}
.creator-copy blockquote {
  font-family: var(--font-display);
  margin: 2rem 0;
  font-size: clamp(1.5rem,2.4vw,2.4rem);
  font-style: italic;
  line-height: 1.25;
}
.creator-copy>p:not(.eyebrow):not(.creator-role) {
  color: #183a5ac7;
  line-height: 1.8;
}
.distribution-section {
  background: linear-gradient(115deg,#7c3048 0 27%,#102a42 27.2%);
  grid-template-columns: .8fr 1.2fr;
  gap: 9vw;
  display: grid;
}
.distribution-section h2 {
  color: #f8f8f6;
  font-size: clamp(4rem,7vw,8rem);
}
.distribution-section>div:first-child .eyebrow {
  color: #d6a756;
}
.distribution-card {
  background: #183a5a;
  border-top: 1px solid #f8f8f640;
  padding: clamp(1.5rem,4vw,3rem);
}
.distribution-card>div {
  border-bottom: 1px solid #f8f8f624;
  grid-template-columns: 170px 1fr;
  gap: 2rem;
  padding: 1.4rem 0;
  display: grid;
}
.distribution-card span {
  text-transform: uppercase;
  letter-spacing: .14em;
  color: #d6a756;
  font-size: .58rem;
}
.distribution-card strong {
  font-size: .95rem;
  line-height: 1.5;
}
.distribution-card button {
  margin-top: 2.2rem;
}
.partners-section {
  color: #183a5a;
  background: #f8f8f6;
  border-left: 18px solid #3f5f4b;
  padding-top: 4.5rem;
  padding-bottom: 4.5rem;
}
.partner-list {
  flex-wrap: wrap;
  display: flex;
}
.partner-list span {
  font-family: var(--font-display);
  color: #6e7378;
  border: 1px solid #183a5a2e;
  margin: -1px 0 0 -1px;
  padding: 1.15rem 1.6rem;
  font-size: 1.1rem;
  transition: background .25s,color .25s;
}
.partner-list span:hover {
  color: #f8f8f6;
  background: #3f5f4b;
}
.closing-section {
  text-align: center;
  isolation: isolate;
  place-items: center;
  height: min(80vh,820px);
  display: grid;
  position: relative;
}
.closing-section img {
  object-fit: cover;
  filter: brightness(.3)saturate(.65);
  z-index: -1;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}
.closing-section:after {
  content: "";
  z-index: -1;
  background: linear-gradient(#102a4259,#0000 60%,#102a42);
  position: absolute;
  inset: 0;
}
.closing-section div {
  padding: 2rem;
}
.closing-section p {
  font-family: var(--font-display);
  color: #f8f8f6;
  font-size: clamp(2.4rem,5vw,5.5rem);
  line-height: 1.12;
}
.closing-section span {
  color: #d6a756;
  letter-spacing: .2em;
  text-transform: uppercase;
  font-size: .65rem;
}
footer {
  background: #102a42;
  border-top: 1px solid #f8f8f624;
  grid-template-columns: 1fr 1fr 1fr 1fr auto;
  align-items: start;
  gap: 3rem;
  padding: 4rem 5vw;
  display: grid;
}
.footer-brand {
  letter-spacing: .18em;
  font-size: 1rem;
  line-height: .9;
}
.footer-brand img {
  height: 60px;
  width: auto;
  display: block;
}
.footer-brand span,.footer-brand strong {
  display: block;
}
.footer-brand strong {
  color: #d6a756;
  font-size: 1.5rem;
}
footer p {
  color: #f8f8f68c;
  margin: .3rem 0;
  font-size: .68rem;
  line-height: 1.5;
}
footer button {
  color: #d6a756;
  cursor: pointer;
  background: 0 0;
  border: 0;
  align-items: center;
  gap: .6rem;
  font-size: .7rem;
  display: flex;
}
footer button svg {
  width: 18px;
  transform: rotate(-45deg);
}
.footer-contact {
  display: flex;
  flex-direction: column;
  gap: .5rem;
  font-size: .68rem;
}
.footer-contact a {
  color: #f8f8f68c;
  text-decoration: none;
  transition: color .2s ease;
}
.footer-contact a:hover,
.social-links a:hover {
  color: #d6a756;
}
.social-links {
  display: flex;
  flex-direction: row;
  gap: .9rem;
}
.footer-emails {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: .5rem 1rem;
}
.social-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  transition: opacity .2s ease;
}
.social-links a svg {
  width: 100%;
  height: 100%;
}
.social-links a:hover {
  opacity: 0.8;
}
.modal-backdrop {
  z-index: 100;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  background: #05111cdb;
  place-items: center;
  padding: 1.2rem;
  animation: .25s both softIn;
  display: grid;
  position: fixed;
  inset: 0;
}
.preview-modal,.press-modal {
  color: #183a5a;
  background: #f8f8f6;
  width: min(900px,100%);
  max-height: 88vh;
  padding: clamp(2rem,5vw,5rem);
  position: relative;
  overflow: auto;
}
.icon-button {
  cursor: pointer;
  background: 0 0;
  border: 1px solid #183a5a40;
  place-items: center;
  width: 44px;
  height: 44px;
  display: grid;
}
.icon-button svg {
  width: 20px;
}
.modal-close {
  z-index: 2;
  position: absolute;
  top: 1.2rem;
  right: 1.2rem;
}
.preview-frame {
  aspect-ratio: 16/7;
  color: #d6a756;
  background: #183a5a;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  margin-bottom: 2.5rem;
  display: flex;
}
.preview-frame svg {
  width: 40px;
}
.preview-frame span {
  letter-spacing: .2em;
  text-transform: uppercase;
  font-size: .62rem;
}
.preview-modal h2,.press-modal h2 {
  margin-bottom: 1.4rem;
  font-size: clamp(2.8rem,5vw,5rem);
}
.preview-modal>p:last-child,.availability-note {
  color: #6e7378;
  line-height: 1.7;
}
.press-grid {
  background: #183a5a26;
  border: 1px solid #183a5a26;
  grid-template-columns: repeat(3,1fr);
  gap: 1px;
  margin-top: 2rem;
  display: grid;
}
.press-grid span {
  background: #f8f8f6;
  padding: 1.2rem;
  font-weight: 600;
}
.press-grid small {
  color: #c96c4a;
  text-transform: uppercase;
  letter-spacing: .1em;
  margin-top: .7rem;
  font-size: .56rem;
  display: block;
}
.mobile-menu {
  z-index: 90;
  background: #102a42;
  flex-direction: column;
  justify-content: center;
  padding: 7rem 7vw 3rem;
  display: flex;
  position: fixed;
  inset: 0;
}
.menu-close {
  border-color: #f8f8f640;
  position: absolute;
  top: 2rem;
  right: 6vw;
}
.mobile-menu>button:not(.menu-close) {
  text-align: left;
  font-family: var(--font-display);
  cursor: pointer;
  background: 0 0;
  border: 0;
  border-bottom: 1px solid #f8f8f629;
  grid-template-columns: 2.5rem 1fr auto;
  padding: 1.2rem 0;
  font-size: clamp(2rem,9vw,4rem);
  display: grid;
}
.mobile-menu>button span {
  font-family: var(--font-sans);
  color: #d6a756;
  font-size: .6rem;
}
.mobile-menu>button svg {
  width: 24px;
}
@keyframes riseIn { 0%{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none} }
@keyframes softIn { 0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none} }
@keyframes heroDrift { 0%{transform:scale(1.05)}to{transform:scale(1)} }
@keyframes turn { to{transform:rotate(360deg)} }
@media (max-width:1050px) {
  .desktop-nav {
    display: none;
  }
}
@media (max-width:1050px) {
  .menu-button {
    justify-self: end;
    display: block;
  }
}
@media (max-width:1050px) {
  .status-pill {
    display: none;
  }
}
@media (max-width:1050px) {
  .topbar {
    grid-template-columns: 1fr auto;
  }
}
@media (max-width:1050px) {
  .story-section {
    grid-template-columns: 70px 1fr;
  }
}
@media (max-width:1050px) {
  .story-copy {
    grid-column: 2;
    padding-top: 0;
  }
}
@media (max-width:1050px) {
  .full-quote {
    grid-column: 2;
  }
}
@media (max-width:1050px) {
  .purpose-section {
    grid-template-columns: minmax(0,1fr);
  }
}
@media (max-width:1050px) {
  .purpose-image-wrap {
    min-height: 520px;
  }
}
@media (max-width:1050px) {
  .characters-section {
    grid-template-columns: minmax(0,1fr);
  }
}
@media (max-width:1050px) {
  .character-stage,.character-tabs {
    grid-column: 1;
  }
}
@media (max-width:1050px) {
  .winnipeg-section {
    grid-template-columns: minmax(0,1fr);
  }
}
@media (max-width:1050px) {
  .winnipeg-image {
    min-height: 620px;
  }
}
@media (max-width:1050px) {
  .creator-section {
    grid-template-columns: minmax(0,.8fr) minmax(0,1fr);
  }
}
@media (max-width:1050px) {
  .distribution-section {
    grid-template-columns: minmax(0,1fr);
  }
}
@media (max-width:1050px) {
  .distribution-section>div:first-child {
    justify-content: space-between;
    align-items: end;
    gap: 2rem;
    display: flex;
  }
}
@media (max-width:1050px) {
  .distribution-section h2 {
    margin: 0;
  }
}
@media (max-width:1050px) {
  footer {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width:720px) {
  .section-pad {
    padding: 5.5rem 6vw;
  }
}
@media (max-width:720px) {
  .topbar {
    height: 70px;
    padding: 0 6vw;
  }
}
@media (max-width:720px) {
  .hero {
    min-height: 820px;
    padding: 8rem 6vw 5.5rem;
  }
}
@media (max-width:720px) {
  .hero-content {
    width: 100%;
  }
}
@media (max-width:720px) {
  .hero-watermark {
    width: clamp(160px,58vw,300px);
    max-height: 150px;
  }
}
@media (max-width:720px) {
  .hero-wash {
    background: linear-gradient(#07152242 0%,#183a5ad1 43%,#183a5a 100%);
  }
}
@media (max-width:720px) {
  .hero-meta {
    gap: .55rem;
  }
}
@media (max-width:720px) {
  .hero-actions {
    flex-direction: column;
    align-items: flex-start;
    gap: .5rem;
  }
}
@media (max-width:720px) {
  .hero-credit {
    display: none;
  }
}
@media (max-width:720px) {
  .story-section {
    display: block;
  }
}
@media (max-width:720px) {
  .section-index {
    width: 70px;
    margin-bottom: 3rem;
  }
}
@media (max-width:720px) {
  .story-copy {
    margin-top: 2.5rem;
  }
}
@media (max-width:720px) {
  .full-quote {
    margin-top: 3rem;
  }
}
@media (max-width:720px) {
  .purpose-image-wrap {
    min-height: 420px;
  }
}
@media (max-width:720px) {
  .purpose-content {
    padding: 4.5rem 6vw;
  }
}
@media (max-width:720px) {
  .principles {
    grid-template-columns: minmax(0,1fr);
  }
}
@media (max-width:720px) {
  .principles article {
    min-height: auto;
  }
}
@media (max-width:720px) {
  .section-heading-row {
    display: block;
  }
}
@media (max-width:720px) {
  .episode-counter {
    margin-top: 1rem;
  }
}
@media (max-width:720px) {
  .episode-numbers {
    padding-bottom: 1px;
    display: flex;
    overflow-x: auto;
  }
}
@media (max-width:720px) {
  .episode-numbers button {
    min-width: 50px;
  }
}
@media (max-width:720px) {
  .episode-feature {
    grid-template-columns: minmax(0,1fr);
    min-height: 0;
  }
}
@media (max-width:720px) {
  .episode-art {
    min-height: 360px;
  }
}
@media (max-width:720px) {
  .episode-info {
    padding: 3rem 1.5rem 5rem;
  }
}
@media (max-width:720px) {
  .browser-arrows {
    bottom: 1rem;
  }
}
@media (max-width:720px) {
  .palette-ribbon {
    grid-template-columns: minmax(0,1fr);
  }
}
@media (max-width:720px) {
  .palette-ribbon span {
    min-height: 52px;
  }
}
@media (max-width:720px) {
  .characters-section {
    row-gap: 30px;
    column-gap: 3rem;
  }
}
@media (max-width:800px) {
  .character-stage {
    grid-template-columns: minmax(0,1fr);
  }
}
@media (max-width:800px) {
  .character-portrait {
    width: 100%;
    height: 380px;
  }
}
@media (max-width:800px) {
  .character-detail {
    width: 100%;
    height: auto;
    padding: 2.5rem 1.5rem;
  }
}
@media (max-width:800px) {
  .character-tabs {
    flex-wrap: nowrap;
    justify-content: flex-start;
    padding-bottom: 1rem;
    overflow-x: auto;
  }
}
@media (max-width:800px) {
  .character-tabs button {
    min-width: 58px;
  }
}
@media (max-width:1050px) {
  .crew-intro, .crew-stage {
    flex: 1 0 100%;
  }
}
@media (max-width:720px) {
  .crew-section {
    row-gap: 30px;
    column-gap: 3rem;
  }
}
@media (max-width:800px) {
  .crew-stage {
    grid-template-columns: minmax(0,1fr);
  }
}
@media (max-width:800px) {
  .crew-portrait {
    width: 100%;
    height: 380px;
  }
}
@media (max-width:800px) {
  .crew-detail {
    width: 100%;
    height: auto;
    padding: 2.5rem 1.5rem;
  }
}
@media (max-width:800px) {
  .crew-tabs {
    flex-wrap: nowrap;
    justify-content: flex-start;
    padding-bottom: 1rem;
    overflow-x: auto;
  }
}
@media (max-width:800px) {
  .crew-tabs button {
    min-width: 58px;
  }
}
@media (max-width:720px) {
  .winnipeg-image {
    min-height: 480px;
  }
}
@media (max-width:720px) {
  .winnipeg-overlay {
    display: block;
    inset: auto 1rem 1rem;
  }
}
@media (max-width:720px) {
  .winnipeg-overlay span {
    display: none;
  }
}
@media (max-width:720px) {
  .winnipeg-overlay p {
    display: inline-block;
  }
}
@media (max-width:720px) {
  .creator-section {
    grid-template-columns: minmax(0,1fr);
  }
}
@media (max-width:720px) {
  .creator-monogram {
    max-height: 580px;
  }
}
@media (max-width:720px) {
  .creator-copy h2,
  .winnipeg-copy h2,
  .distribution-section h2 {
    font-size: clamp(2.6rem,13vw,4rem);
  }
}
@media (max-width:720px) {
  .distribution-section {
    background: linear-gradient(160deg,#7c3048 0 15%,#102a42 15.2%);
  }
}
@media (max-width:720px) {
  .distribution-section>div:first-child {
    display: block;
  }
}
@media (max-width:720px) {
  .distribution-card>div {
    grid-template-columns: minmax(0,1fr);
    gap: .55rem;
  }
}
@media (max-width:720px) {
  .partner-list span {
    padding: .9rem 1rem;
    font-size: .95rem;
  }
}
@media (max-width:720px) {
  .closing-section {
    height: 650px;
  }
}
@media (max-width:720px) {
  .closing-section p br {
    display: none;
  }
}
@media (max-width:720px) {
  .footer-emails {
    flex-direction: column;
  }
}
@media (max-width:720px) {
  footer {
    grid-template-columns: minmax(0,1fr);
    gap: 1.4rem;
  }
}
@media (max-width:720px) {
  .press-grid {
    grid-template-columns: minmax(0,1fr);
  }
}
@media (max-width:720px) {
  .preview-frame {
    aspect-ratio: 16/10;
  }
}
@media (prefers-reduced-motion:reduce) {
  html {
    scroll-behavior: auto;
  }
}
@media (min-width:1200px) {
  .crew-section {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    grid-template-rows: auto auto;
    align-items: start;
    flex-wrap: initial;
  }
  .crew-intro {
    flex: none;
    grid-column: 1;
    grid-row: 1;
  }
  .crew-stage {
    flex: none;
    grid-column: 2;
    grid-row: 1;
  }
  .crew-tabs {
    grid-column: 2;
    grid-row: 2;
    justify-content: flex-start;
  }
}

/* The source app conditionally mounts the mobile menu and modals via React
   state; this static build toggles the native `hidden` attribute instead.
   Needed because the component rules above set `display` explicitly, which
   otherwise wins the cascade over the user-agent [hidden] rule. */
.mobile-menu[hidden],
.modal-backdrop[hidden] {
  display: none;
}
