/* Homepage v57 — one continuous, suspense-led composition. */

body { background: #07131a; }

/* V66 — transparent over the hero, softly legible once content scrolls beneath it. */
.header { isolation: isolate; }
.header::before {
  content: "";
  position: absolute;
  inset: 0 0 -30px;
  z-index: -1;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(180deg,rgba(4,12,17,.82) 0%,rgba(4,12,17,.65) 55%,rgba(4,12,17,.22) 82%,transparent 100%);
  -webkit-backdrop-filter: blur(11px) saturate(.88);
  backdrop-filter: blur(11px) saturate(.88);
  -webkit-mask-image: linear-gradient(180deg,#000 0%,#000 68%,transparent 100%);
  mask-image: linear-gradient(180deg,#000 0%,#000 68%,transparent 100%);
  transition: opacity .38s ease;
}
.header.is-scrolled::before { opacity: 1; }

.hero {
  min-height: 100svh;
  background: #071119;
  isolation: isolate;
}

.hero-image {
  object-position: center center;
  filter: saturate(.9) contrast(1.03) brightness(1);
  animation: hero-pursuit 14s cubic-bezier(.22,.61,.36,1) both;
}

.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: .17;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.24'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}

.hero-shade {
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(3,10,15,.94) 0%, rgba(3,10,15,.68) 25%, rgba(3,10,15,.1) 54%, transparent 76%),
    linear-gradient(180deg, rgba(4,12,17,.16) 0%, transparent 43%, rgba(4,12,17,.5) 100%);
}

.hero-content { z-index: 2; max-width: 650px; }
.hero-content h1 { text-shadow: 0 7px 34px rgba(0,0,0,.42); }
.hero-kicker { display: flex; align-items: center; gap: 12px; }
.hero-kicker::before { content: ""; width: 36px; height: 1px; background: #c5a56c; box-shadow: 0 0 18px #c5a56c; }

@keyframes hero-pursuit {
  from { transform: scale(1.035) translate3d(-.5%,0,0); }
  to { transform: scale(1.085) translate3d(.7%,-.4%,0); }
}

/* The middle now reads as a tightening sequence, rather than separate pages. */
.story-chapter {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 83% 18%, rgba(182,137,71,.1), transparent 30%),
    linear-gradient(180deg, #07131a, #091820 56%, #07131a);
}

.story-chapter::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  background: linear-gradient(transparent, rgba(197,165,108,.42), transparent);
}

.story-prologue { position: relative; z-index: 1; }
.story-pressure { position: relative; z-index: 1; }
.story-pressure > div {
  position: relative;
  overflow: hidden;
  transition: transform .45s ease, background-color .45s ease;
}
.story-pressure > div::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 2px;
  transform: scaleX(.18);
  transform-origin: left;
  background: #c5a56c;
  transition: transform .55s ease;
}
.story-pressure > div:hover { transform: translateY(-5px); background: rgba(255,255,255,.025); }
.story-pressure > div:hover::after { transform: scaleX(1); }

.cast-chapter {
  padding: clamp(82px,9vw,150px) clamp(24px,5vw,84px) clamp(74px,8vw,126px);
  background: #061219;
  overflow: hidden;
}

.cast-opening {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(260px,.42fr);
  gap: 8vw;
  align-items: end;
  max-width: 1540px;
  margin: 0 auto clamp(42px,5vw,76px);
  padding: 0;
}
.cast-opening > .cinema-label { grid-column: 1 / -1; margin: 0; }
.cast-opening > h2 { grid-column: 1; }
.cast-opening > p { grid-column: 2; }
.cast-opening h2 { margin-bottom: 0; }
.cast-opening p { margin: 0 0 .5rem; padding-left: 26px; border-left: 1px solid rgba(197,165,108,.55); }

.cast-reel {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: clamp(14px,1.6vw,28px);
  max-width: 1540px;
  margin: 0 auto;
}

.cast-chapter .cast-cut,
.cast-chapter .cast-jake {
  display: block;
  position: relative;
  min-height: clamp(590px,67vw,780px);
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(183,203,211,.18);
  background: #0a161d;
}

.cast-chapter .cast-image {
  position: absolute;
  inset: 0;
  min-height: 0;
  height: 100%;
}
.cast-chapter .cast-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(2,7,11,.05) 18%, rgba(3,10,14,.2) 45%, rgba(3,10,14,.96) 91%);
}
.cast-chapter .cast-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1.2s cubic-bezier(.2,.7,.2,1), filter .8s ease;
}
.cast-chapter .cast-rosaly .cast-image img { object-position: 61% center; }
.cast-chapter .cast-jake .cast-image img { object-position: 47% center; }
.cast-chapter .cast-cut:hover .cast-image img { transform: scale(1.035); filter: contrast(1.05) brightness(.9); }

.cast-chapter .cast-text,
.cast-chapter .cast-jake .cast-text {
  position: absolute;
  z-index: 2;
  inset: auto clamp(25px,3.3vw,54px) clamp(28px,3.5vw,58px);
  max-width: 560px;
  padding: 0;
  color: #eee9df;
}
.cast-chapter .cast-text h3 {
  margin: 10px 0 16px;
  font-size: clamp(44px,4.8vw,76px);
  line-height: .87;
  letter-spacing: -.035em;
}
.cast-chapter .cast-text p { max-width: 520px; color: rgba(238,233,223,.78); }
.cast-chapter .cast-place { display: none; }
.cast-chapter .image-inspect { top: 24px; right: 24px; z-index: 3; }

.cast-ensemble {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: clamp(12px,1.3vw,22px);
  max-width: 1540px;
  margin: clamp(18px,2vw,32px) auto 0;
}
.ensemble-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: clamp(390px,34vw,530px);
  border: 1px solid rgba(183,203,211,.18);
  background: #0a161d;
}
.ensemble-card img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1.05s cubic-bezier(.2,.7,.2,1), filter .75s ease;
}
.ensemble-card:nth-child(1) img { object-position: 48% center; }
.ensemble-card:nth-child(2) img { object-position: 50% center; }
.ensemble-card:nth-child(3) img { object-position: 47% center; }
.ensemble-card:nth-child(4) img { object-position: 51% center; }
.ensemble-shade {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg,rgba(2,7,11,.02) 28%,rgba(3,10,14,.28) 55%,rgba(3,10,14,.97) 94%);
}
.ensemble-copy {
  position: absolute;
  inset: auto clamp(20px,2vw,31px) clamp(22px,2.4vw,36px);
  display: grid;
  gap: 8px;
}
.ensemble-copy small { color: #d6b78c; font-size: 10px; letter-spacing: .13em; }
.ensemble-copy strong { font: 450 clamp(27px,2.45vw,39px)/1.02 Bodoni,Georgia,serif; letter-spacing: -.025em; }
.ensemble-copy em { color: rgba(238,233,223,.72); font: normal 13px/1.5 Inter,Arial,sans-serif; }
.ensemble-card:hover img { transform: scale(1.045); filter: contrast(1.06) brightness(.88); }
.ensemble-card:focus-visible { outline-offset: 5px; }

.cast-directory-link { max-width: 1540px; margin: 34px auto 0; text-align: right; }

.story-world-entry {
  padding: clamp(78px,8vw,132px) clamp(24px,5vw,84px) clamp(70px,8vw,120px);
  background: linear-gradient(180deg,#061219,#07141b);
}
.story-world-entry .world-opening { max-width: 1540px; margin: 0 auto 48px; padding: 0; }
.story-world-entry .world-portal {
  position: relative;
  display: block;
  max-width: 1540px;
  min-height: clamp(600px,61vw,820px);
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid rgba(183,203,211,.18);
  background: #07141b;
}
.story-world-entry .world-portal::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(3,10,14,.88) 0%, rgba(3,10,14,.32) 40%, rgba(3,10,14,.38) 64%, rgba(3,10,14,.94) 100%),
    linear-gradient(180deg, rgba(3,10,14,.08), rgba(3,10,14,.76));
}
.story-world-entry .world-portal-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.74) contrast(1.05); }
.story-world-entry .world-portal-map {
  position: absolute;
  z-index: 2;
  left: clamp(24px,4vw,68px);
  top: 50%;
  width: min(37vw,520px);
  transform: translateY(-50%);
  border: 0;
  background: transparent;
  -webkit-mask-image: radial-gradient(ellipse 68% 63% at center, #000 28%, transparent 100%);
  mask-image: radial-gradient(ellipse 68% 63% at center, #000 28%, transparent 100%);
}
.story-world-entry .world-portal-map img { opacity: .72; filter: drop-shadow(0 18px 45px rgba(0,0,0,.38)); }
.story-world-entry .world-portal-map .eyebrow { opacity: .65; }
.story-world-entry .world-portal-map a { width: max-content; margin-left: 12%; }
.story-world-entry .world-portal-story {
  position: absolute;
  z-index: 2;
  right: clamp(28px,5vw,82px);
  bottom: clamp(32px,5vw,76px);
  width: min(44%,630px);
  padding: 0;
  background: transparent;
}
.story-world-entry .world-portal-story h3 { font-size: clamp(48px,5.5vw,84px); line-height: .92; text-shadow: 0 10px 36px #02070a; }
.story-world-entry .world-portal-scenes { max-width: 1540px; margin: 0 auto; }

@media (max-width: 1100px) {
  .cast-ensemble { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ensemble-card { min-height: 500px; }
}

@media (max-width: 760px) {
  .hero { min-height: 780px; }
  .hero-image { width: 158%; max-width: none; left: -58%; object-position: 72% center; animation-duration: 11s; }
  .hero-shade { background: linear-gradient(180deg, rgba(3,10,15,.2) 0%, rgba(3,10,15,.22) 35%, rgba(3,10,15,.97) 82%); }
  .hero-content { bottom: 94px; }
  .hero-content h1 { font-size: clamp(58px,17vw,72px); letter-spacing: .015em; }
  .hero-tagline { max-width: 310px; }

  .story-chapter::before { left: 24px; }
  .story-pressure > div { min-height: 150px; }

  .cast-chapter { padding: 68px 18px 64px; }
  .cast-opening { display: block; margin-bottom: 34px; }
  .cast-opening > .cinema-label,
  .cast-opening > h2,
  .cast-opening > p { grid-column: auto; }
  .cast-opening p { margin-top: 24px; }
  .cast-reel { grid-template-columns: 1fr; gap: 18px; }
  .cast-chapter .cast-cut,
  .cast-chapter .cast-jake { min-height: 650px; }
  .cast-chapter .cast-text,
  .cast-chapter .cast-jake .cast-text { inset: auto 22px 28px; }
  .cast-chapter .cast-text h3 { font-size: clamp(46px,15vw,67px); }
  .cast-chapter .cast-text p { font-size: 14px; line-height: 1.55; }
  .cast-chapter .cast-place { display: none; }
  .cast-chapter .cast-rosaly .cast-image img { object-position: 58% center; }
  .cast-chapter .cast-jake .cast-image img { object-position: 35% center; }
  .cast-ensemble { grid-template-columns: 1fr; gap: 16px; margin-top: 18px; }
  .ensemble-card { min-height: 510px; }
  .ensemble-copy { inset: auto 22px 28px; }
  .ensemble-copy strong { font-size: clamp(35px,11vw,48px); }
  .ensemble-copy em { font-size: 14px; }
  .cast-directory-link { text-align: left; }

  .story-world-entry { padding: 70px 18px 58px; }
  .story-world-entry .world-opening { margin-bottom: 30px; }
  .story-world-entry .world-portal { min-height: 700px; }
  .story-world-entry .world-portal::after { background: linear-gradient(180deg, rgba(3,10,14,.12), rgba(3,10,14,.35) 34%, rgba(3,10,14,.98) 76%); }
  .story-world-entry .world-portal-photo { object-position: 57% center; }
  .story-world-entry .world-portal-map { left: -20px; top: 26px; width: 74%; transform: none; opacity: .8; }
  .story-world-entry .world-portal-map .eyebrow { display: none; }
  .story-world-entry .world-portal-map a { margin-left: 28px; }
  .story-world-entry .world-portal-story { left: 22px; right: 22px; bottom: 30px; width: auto; }
  .story-world-entry .world-portal-story h3 { font-size: clamp(47px,14vw,66px); }
  .story-world-entry .world-portal-actions { display: grid; grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-image { animation: none; }
  .cast-chapter .cast-image img,
  .ensemble-card img,
  .story-pressure > div { transition: none; }
}
