:root {
  color-scheme: dark;
  --paper: #ede6da;
  --paper-soft: rgba(237, 230, 218, .68);
  --ink: #050707;
  --amber: #f1a04f;
  --line: rgba(237, 230, 218, .23);
  --serif: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  --sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --progress: 0;
  --beat-alone: 1;
  --beat-look: 0;
  --beat-reveal: 0;
  --beat-answer: 0;
  --beat-another: 0;
  --beat-steps: 0;
  --beat-fire: 0;
  --beat-recognize: 0;
  --beat-water-memory: 0;
  --beat-water-reflection: 0;
  --beat-worlds: 0;
  --beat-orbit: 0;
  --beat-ground: 0;
  --beat-air: 0;
  --beat-breathe: 0;
  --beat-one-sound: 0;
  --beat-four-forces: 0;
  --beat-not-stage: 0;
  --beat-between: 0;
  --beat-human: 0;
  --beat-place: 0;
  --beat-finale: 0;
  --beat-afterglow: 0;
  --end-frame: 0;
  --focus-x: 50%;
  --alone-y: 0px;
  --alone-blur: 0px;
  --look-y: 26px;
  --look-blur: 8px;
  --reveal-y: 30px;
  --reveal-blur: 7px;
  --answer-y: 26px;
  --answer-blur: 7px;
  --another-y: 22px;
  --another-blur: 6px;
  --steps-y: 28px;
  --steps-blur: 7px;
  --fire-y: 28px;
  --fire-blur: 7px;
  --recognize-y: 22px;
  --recognize-blur: 6px;
  --water-memory-y: 26px;
  --water-memory-blur: 7px;
  --water-reflection-y: 22px;
  --water-reflection-blur: 6px;
  --worlds-y: 26px;
  --worlds-blur: 7px;
  --orbit-y: 22px;
  --orbit-blur: 6px;
  --ground-y: 26px;
  --ground-blur: 7px;
  --air-y: 24px;
  --air-blur: 7px;
  --breathe-y: 20px;
  --breathe-blur: 6px;
  --one-sound-y: 22px;
  --one-sound-blur: 7px;
  --four-forces-y: 26px;
  --four-forces-blur: 7px;
  --not-stage-y: 22px;
  --not-stage-blur: 6px;
  --between-y: 24px;
  --between-blur: 7px;
  --human-y: 24px;
  --human-blur: 7px;
  --place-y: 24px;
  --place-blur: 7px;
  --finale-y: 30px;
  --finale-blur: 7px;
  --afterglow-y: 18px;
  --afterglow-blur: 5px;
  --track-x: -100%;
  --guide-opacity: 1;
  --film-height-desktop: 750svh;
  --film-height-mobile: 680svh;
}

* { box-sizing: border-box; }
html { background: var(--ink); }
body {
  margin: 0;
  min-width: 320px;
  color: var(--paper);
  background: var(--ink);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid #f1a04f; outline-offset: 4px; }
.skip-link {
  position: fixed;
  z-index: 100;
  left: 18px;
  top: -80px;
  padding: 10px 16px;
  color: #111;
  background: var(--paper);
}
.skip-link:focus { top: 18px; }

.film { height: var(--film-height-desktop); position: relative; }
.film__stage {
  position: sticky;
  inset: 0 0 auto;
  height: 100svh;
  min-height: 560px;
  overflow: hidden;
  isolation: isolate;
  background: #050707;
}
.film__media,
.film__video,
.film__poster,
.film__shade,
.film__grain {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.film__media,
.film__shade,
.film__grain,
.masthead,
.narrative,
.scroll-guide,
.scene-index,
.film__disclosure,
.chapter-dots,
.film__loader { position: fixed; }
.film__media { z-index: -4; overflow: hidden; background: #050707; }
.film__video,
.film__poster {
  object-fit: cover;
  object-position: var(--focus-x) center;
  transform: scale(1.015);
}
.film__poster { filter: saturate(.78) contrast(1.04); }
.film__poster--start { opacity: calc(1 - var(--end-frame)); }
.film__poster--end { opacity: var(--end-frame); }
.film__video {
  z-index: 2;
  opacity: 0;
  filter: saturate(.8) contrast(1.03) brightness(.94);
  transition: opacity 1.2s ease;
}
.film.is-video-ready .film__video { opacity: 1; }
.film__shade {
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(2, 4, 4, .52) 0%, rgba(2, 4, 4, .08) 48%, rgba(2, 4, 4, .24) 100%),
    linear-gradient(0deg, rgba(2, 4, 4, .52) 0%, transparent 36%, rgba(2, 4, 4, .2) 100%),
    radial-gradient(circle at 50% 43%, transparent 24%, rgba(0, 0, 0, .36) 120%);
}
.film__grain {
  z-index: 8;
  pointer-events: none;
  opacity: .14;
  mix-blend-mode: soft-light;
  background-image:
    repeating-radial-gradient(circle at 18% 37%, transparent 0 1px, rgba(255,255,255,.06) 1px 2px),
    repeating-linear-gradient(113deg, rgba(255,255,255,.025) 0 1px, transparent 1px 5px);
  background-size: 5px 5px, 11px 11px;
}
.film__grain::after {
  content: "";
  position: absolute;
  inset: -8%;
  border: 2.7vw solid rgba(3, 4, 4, .5);
  filter: blur(26px);
}

.masthead {
  position: absolute;
  z-index: 20;
  inset: 0 0 auto;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: max(24px, env(safe-area-inset-top)) clamp(22px, 3.4vw, 58px) 0;
  text-transform: uppercase;
}
.wordmark {
  justify-self: start;
  font-family: var(--serif);
  font-size: 17px;
  letter-spacing: .35em;
}
.event-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  color: rgba(237, 230, 218, .65);
  font-size: 10px;
  font-weight: 570;
  letter-spacing: .18em;
}
.event-meta span { width: 3px; height: 3px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 10px var(--amber); }
.ticket-link {
  justify-self: end;
  display: inline-flex;
  align-items: center;
  gap: 20px;
  min-height: 42px;
  padding: 0 7px 0 18px;
  border: 1px solid var(--line);
  border-radius: 100px;
  font-size: 10px;
  font-weight: 620;
  letter-spacing: .16em;
  backdrop-filter: blur(12px);
  background: rgba(3, 5, 5, .2);
  transition: color .3s ease, background .3s ease, border-color .3s ease, transform .3s ease;
  appearance: none;
  cursor: pointer;
}
.masthead__actions {
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 10px;
}
.skip-film,
.sound-toggle {
  min-height: 42px;
  padding: 0 15px;
  border: 1px solid var(--line);
  border-radius: 100px;
  color: rgba(237, 230, 218, .68);
  background: rgba(3, 5, 5, .2);
  backdrop-filter: blur(12px);
  font-size: 9px;
  font-weight: 620;
  letter-spacing: .15em;
  text-transform: uppercase;
  cursor: pointer;
  transition: color .3s ease, border-color .3s ease, background .3s ease;
}
.skip-film:hover,
.sound-toggle:hover { color: var(--paper); border-color: rgba(237,230,218,.48); background: rgba(237,230,218,.07); }
.sound-toggle { display: inline-flex; align-items: center; gap: 10px; }
.sound-toggle i { display: flex; align-items: center; gap: 2px; height: 14px; font-style: normal; }
.sound-toggle i b { display: block; width: 1px; height: 5px; background: currentColor; transition: height .3s ease; }
.sound-toggle[aria-pressed="true"] { color: #f4c18e; border-color: rgba(241,160,79,.48); }
.sound-toggle[aria-pressed="true"] i b:nth-child(1) { height: 9px; animation: soundbar .8s ease-in-out infinite alternate; }
.sound-toggle[aria-pressed="true"] i b:nth-child(2) { height: 14px; animation: soundbar .65s .15s ease-in-out infinite alternate; }
.sound-toggle[aria-pressed="true"] i b:nth-child(3) { height: 7px; animation: soundbar .9s .25s ease-in-out infinite alternate; }
@keyframes soundbar { to { height: 3px; } }
.ticket-link i {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  color: #1b1008;
  border-radius: 50%;
  background: var(--amber);
  font-size: 13px;
  font-style: normal;
}
.ticket-link:hover { transform: translateY(-2px); border-color: rgba(237,230,218,.5); background: rgba(237,230,218,.08); }

.narrative { position: absolute; z-index: 10; inset: 0; pointer-events: none; }
.beat { position: absolute; transition: visibility .35s linear; }
.beat__eyebrow {
  margin: 0 0 17px;
  color: var(--amber);
  font-size: 9px;
  font-weight: 650;
  letter-spacing: .28em;
  text-transform: uppercase;
}
.beat__line,
.beat h1 {
  margin: 0;
  font-family: var(--serif);
  font-weight: 400;
  letter-spacing: -.045em;
  text-wrap: balance;
}
.beat__line { font-size: clamp(48px, 6.5vw, 106px); line-height: .86; }
.beat__line em,
.beat h1 em { color: #f1c392; font-weight: 400; }
.beat--alone {
  left: clamp(24px, 8.5vw, 150px);
  bottom: clamp(108px, 17vh, 180px);
  opacity: var(--beat-alone);
  transform: translateY(var(--alone-y));
  filter: blur(var(--alone-blur));
}
.beat--look {
  top: 31%;
  left: 50%;
  width: min(720px, calc(100vw - 48px));
  text-align: center;
  opacity: var(--beat-look);
  transform: translate(-50%, var(--look-y));
  filter: blur(var(--look-blur));
}
.beat--look .beat__line { font-size: clamp(54px, 7.4vw, 116px); }
.beat--reveal {
  left: clamp(24px, 7.6vw, 132px);
  bottom: clamp(78px, 11vh, 120px);
  width: min(700px, calc(100vw - 48px));
  opacity: var(--beat-reveal);
  transform: translateY(var(--reveal-y));
  filter: blur(var(--reveal-blur));
  pointer-events: auto;
}
.beat--reveal h1 { font-size: clamp(64px, 8.4vw, 132px); line-height: .77; }
.beat--answer {
  left: clamp(24px, 7.6vw, 132px);
  bottom: clamp(104px, 16vh, 168px);
  width: min(760px, calc(100vw - 48px));
  opacity: var(--beat-answer);
  transform: translateY(var(--answer-y));
  filter: blur(var(--answer-blur));
}
.beat--another {
  right: clamp(24px, 8vw, 138px);
  top: 31%;
  width: min(610px, calc(100vw - 48px));
  opacity: var(--beat-another);
  transform: translateY(var(--another-y));
  filter: blur(var(--another-blur));
}
.beat--another p {
  margin: 0;
  color: var(--paper-soft);
  font-family: var(--serif);
  font-size: clamp(30px, 3.3vw, 54px);
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: -.035em;
  text-align: right;
}
.beat--another em { color: #f1c392; font-weight: 400; }
.beat--steps {
  left: clamp(24px, 6.4vw, 112px);
  top: 27%;
  width: min(700px, calc(100vw - 48px));
  opacity: var(--beat-steps);
  transform: translateY(var(--steps-y));
  filter: blur(var(--steps-blur));
}
.beat--steps .beat__line { font-size: clamp(47px, 5.6vw, 88px); }
.beat--fire {
  right: clamp(24px, 6.4vw, 112px);
  top: 23%;
  width: min(760px, calc(100vw - 48px));
  text-align: right;
  opacity: var(--beat-fire);
  transform: translateY(var(--fire-y));
  filter: blur(var(--fire-blur));
}
.beat--fire .beat__line { font-size: clamp(47px, 5.6vw, 90px); }
.beat--recognize {
  left: clamp(24px, 7.6vw, 132px);
  bottom: clamp(96px, 14vh, 150px);
  width: min(650px, calc(100vw - 48px));
  opacity: var(--beat-recognize);
  transform: translateY(var(--recognize-y));
  filter: blur(var(--recognize-blur));
}
.beat--recognize p {
  margin: 0;
  color: var(--paper-soft);
  font-family: var(--serif);
  font-size: clamp(29px, 3.1vw, 50px);
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: -.035em;
}
.beat--recognize em { color: #f1c392; font-weight: 400; }
.beat--water-memory {
  top: 22%;
  left: 50%;
  width: min(980px, calc(100vw - 48px));
  text-align: center;
  opacity: var(--beat-water-memory);
  transform: translate(-50%, var(--water-memory-y));
  filter: blur(var(--water-memory-blur));
}
.beat--water-memory .beat__line {
  font-size: clamp(43px, 5.5vw, 88px);
  line-height: .9;
}
.beat--water-reflection {
  left: 50%;
  bottom: clamp(88px, 14vh, 148px);
  width: min(820px, calc(100vw - 48px));
  text-align: center;
  opacity: var(--beat-water-reflection);
  transform: translate(-50%, var(--water-reflection-y));
  filter: blur(var(--water-reflection-blur));
}
.beat--water-reflection p {
  margin: 0;
  color: var(--paper-soft);
  font-family: var(--serif);
  font-size: clamp(32px, 3.7vw, 60px);
  font-weight: 400;
  line-height: .98;
  letter-spacing: -.035em;
}
.beat--water-reflection em { color: #c9d9df; font-weight: 400; }
.beat--worlds {
  top: 19%;
  left: 50%;
  width: min(980px, calc(100vw - 48px));
  text-align: center;
  opacity: var(--beat-worlds);
  transform: translate(-50%, var(--worlds-y));
  filter: blur(var(--worlds-blur));
}
.beat--worlds .beat__line {
  font-size: clamp(43px, 5.4vw, 86px);
  line-height: .9;
}
.beat--orbit {
  top: 23%;
  left: 50%;
  width: min(900px, calc(100vw - 48px));
  text-align: center;
  opacity: var(--beat-orbit);
  transform: translate(-50%, var(--orbit-y));
  filter: blur(var(--orbit-blur));
}
.beat--orbit p {
  margin: 0;
  color: var(--paper-soft);
  font-family: var(--serif);
  font-size: clamp(35px, 4.3vw, 68px);
  font-weight: 400;
  line-height: .96;
  letter-spacing: -.04em;
}
.beat--orbit em { color: #f1c392; font-weight: 400; }
.beat--ground {
  left: clamp(24px, 7.6vw, 132px);
  bottom: clamp(96px, 15vh, 158px);
  width: min(760px, calc(100vw - 48px));
  opacity: var(--beat-ground);
  transform: translateY(var(--ground-y));
  filter: blur(var(--ground-blur));
}
.beat--ground .beat__line { font-size: clamp(48px, 6.1vw, 98px); }
.beat--air,
.beat--breathe,
.beat--one-sound,
.beat--four-forces,
.beat--not-stage,
.beat--between,
.beat--human,
.beat--place,
.beat--afterglow {
  font-family: var(--serif);
  font-weight: 400;
  letter-spacing: -.04em;
}
.beat--air {
  top: 25%;
  right: clamp(24px, 8vw, 138px);
  opacity: var(--beat-air);
  transform: translateY(var(--air-y));
  filter: blur(var(--air-blur));
}
.beat--air p,
.beat--breathe p,
.beat--one-sound p,
.beat--not-stage p,
.beat--between p,
.beat--human p,
.beat--place p,
.beat--afterglow p { margin: 0; }
.beat--air p { font-size: clamp(48px, 6vw, 96px); }
.beat--air em,
.beat--breathe em,
.beat--one-sound em,
.beat--four-forces em,
.beat--not-stage em,
.beat--between em,
.beat--human em,
.beat--place em,
.beat--afterglow em { color: #f1c392; font-weight: 400; }
.beat--breathe {
  top: 36%;
  left: 50%;
  text-align: center;
  opacity: var(--beat-breathe);
  transform: translate(-50%, var(--breathe-y));
  filter: blur(var(--breathe-blur));
}
.beat--breathe p { font-size: clamp(55px, 7.4vw, 118px); white-space: nowrap; }
.beat--one-sound {
  left: clamp(24px, 10vw, 172px);
  top: 38%;
  opacity: var(--beat-one-sound);
  transform: translateY(var(--one-sound-y));
  filter: blur(var(--one-sound-blur));
}
.beat--one-sound p { color: rgba(237,230,218,.72); font-size: clamp(45px, 5.2vw, 84px); line-height: .92; }
.beat--one-sound em { color: #dce3e3; }
.beat--four-forces {
  left: clamp(24px, 7vw, 120px);
  top: 20%;
  width: min(800px, calc(100vw - 48px));
  opacity: var(--beat-four-forces);
  transform: translateY(var(--four-forces-y));
  filter: blur(var(--four-forces-blur));
}
.beat--four-forces .beat__line { font-size: clamp(46px, 5.8vw, 94px); }
.beat--not-stage {
  right: clamp(24px, 7vw, 120px);
  bottom: clamp(98px, 15vh, 160px);
  width: min(700px, calc(100vw - 48px));
  text-align: right;
  opacity: var(--beat-not-stage);
  transform: translateY(var(--not-stage-y));
  filter: blur(var(--not-stage-blur));
}
.beat--not-stage p { color: var(--paper-soft); font-size: clamp(35px, 4.2vw, 68px); line-height: .98; }
.beat--between {
  top: 22%;
  left: 50%;
  width: min(820px, calc(100vw - 48px));
  text-align: center;
  opacity: var(--beat-between);
  transform: translate(-50%, var(--between-y));
  filter: blur(var(--between-blur));
}
.beat--between p { font-size: clamp(47px, 5.8vw, 94px); line-height: .9; }
.beat--human {
  left: clamp(24px, 7vw, 120px);
  bottom: clamp(96px, 14vh, 150px);
  opacity: var(--beat-human);
  transform: translateY(var(--human-y));
  filter: blur(var(--human-blur));
}
.beat--human p { font-size: clamp(48px, 6vw, 98px); line-height: .88; }
.beat--place {
  top: 21%;
  left: 50%;
  width: min(880px, calc(100vw - 48px));
  text-align: center;
  opacity: var(--beat-place);
  transform: translate(-50%, var(--place-y));
  filter: blur(var(--place-blur));
}
.beat--place p { font-size: clamp(46px, 5.7vw, 92px); line-height: .9; }
.beat--finale {
  z-index: 3;
  left: 50%;
  bottom: clamp(64px, 8vh, 92px);
  width: min(1040px, calc(100vw - 48px));
  text-align: center;
  opacity: var(--beat-finale);
  transform: translate(-50%, var(--finale-y));
  filter: blur(var(--finale-blur));
  pointer-events: auto;
}
.beat--finale::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 50%;
  bottom: 100%;
  width: 1px;
  height: 32vh;
  background: linear-gradient(0deg, rgba(241,160,79,.9), rgba(255,255,255,.75) 42%, transparent);
  box-shadow: 0 0 18px rgba(241,160,79,.7);
  opacity: 0;
  transform: scaleY(.08);
  transform-origin: bottom;
  transition: opacity .45s ease, transform .9s cubic-bezier(.2,.8,.2,1);
}
.beat--finale:has(.final-cta--primary:hover)::before,
.beat--finale:focus-within::before { opacity: .85; transform: scaleY(1); }
.beat--finale h2 {
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(52px, 6.4vw, 102px);
  font-weight: 400;
  line-height: .82;
  letter-spacing: -.05em;
}
.beat--finale h2 em { color: #f1c392; font-weight: 400; }
.finale__facts {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px 0;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
  color: rgba(237,230,218,.74);
  font-size: 9px;
  font-weight: 590;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.finale__facts li { padding: 0 18px; border-right: 1px solid rgba(237,230,218,.22); }
.finale__facts li:last-child { border: 0; }
.finale__actions { display: flex; justify-content: center; gap: 12px; margin-top: 24px; }
.final-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
  min-height: 48px;
  padding: 0 23px;
  border: 1px solid rgba(237,230,218,.3);
  border-radius: 100px;
  color: var(--paper);
  background: rgba(3,5,5,.42);
  backdrop-filter: blur(14px);
  font-size: 9px;
  font-weight: 650;
  letter-spacing: .18em;
  text-transform: uppercase;
  cursor: pointer;
  transition: color .3s ease, background .3s ease, border-color .3s ease, transform .3s ease;
}
.final-cta--primary { color: #1b1008; border-color: var(--amber); background: var(--amber); }
.final-cta:hover { transform: translateY(-2px); border-color: rgba(237,230,218,.65); }
.final-cta--primary:hover { border-color: #ffd1a2; background: #f6bd84; }
.beat--afterglow {
  top: 18%;
  left: 50%;
  width: min(720px, calc(100vw - 48px));
  text-align: center;
  opacity: var(--beat-afterglow);
  transform: translate(-50%, var(--afterglow-y));
  filter: blur(var(--afterglow-blur));
}
.beat--afterglow p { color: rgba(237,230,218,.55); font-size: clamp(24px, 2.6vw, 42px); line-height: 1.04; }
.beat__promise {
  margin: 27px 0 0;
  color: var(--paper-soft);
  font-family: var(--serif);
  font-size: clamp(16px, 1.5vw, 22px);
  line-height: 1.43;
}
.story-link {
  display: inline-flex;
  align-items: center;
  gap: 34px;
  margin-top: 27px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(241, 160, 79, .55);
  color: #f5cfaa;
  font-size: 10px;
  font-weight: 630;
  letter-spacing: .2em;
  text-transform: uppercase;
  transition: gap .3s ease, color .3s ease;
}
.story-link span { font-size: 16px; }
.story-link:hover { gap: 46px; color: #fff0df; }

.scroll-guide {
  position: absolute;
  z-index: 18;
  left: 50%;
  bottom: max(27px, env(safe-area-inset-bottom));
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 8px;
  border: 0;
  color: rgba(237, 230, 218, .72);
  background: transparent;
  transform: translateX(-50%);
  opacity: var(--guide-opacity);
  cursor: pointer;
  transition: opacity .4s ease;
}
.scroll-guide__label { font-size: 9px; letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; }
.scroll-guide__label b { color: var(--paper); font-weight: 640; }
.scroll-guide__track {
  width: 68px;
  height: 1px;
  overflow: hidden;
  background: rgba(237, 230, 218, .24);
}
.scroll-guide__track i {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--paper);
  transform: translateX(var(--track-x));
}
.scene-index {
  position: absolute;
  z-index: 18;
  right: clamp(22px, 3.4vw, 58px);
  bottom: max(32px, env(safe-area-inset-bottom));
  margin: 0;
  color: rgba(237, 230, 218, .64);
  font-size: 9px;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.scene-index span { margin-right: 13px; color: rgba(237, 230, 218, .35); }
.scene-index b { font-weight: 500; }
.film__disclosure {
  position: absolute;
  z-index: 18;
  left: clamp(22px, 3.4vw, 58px);
  bottom: max(32px, env(safe-area-inset-bottom));
  margin: 0;
  color: rgba(237,230,218,.34);
  font-size: 8px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.chapter-dots {
  position: absolute;
  z-index: 19;
  left: clamp(22px, 3.4vw, 58px);
  top: 50%;
  display: flex;
  flex-direction: column;
  gap: 9px;
  transform: translateY(-50%);
}
.chapter-dots button {
  width: 5px;
  height: 5px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(237,230,218,.25);
  box-shadow: none;
  cursor: pointer;
  transition: background .35s ease, box-shadow .35s ease, transform .35s ease;
}
.chapter-dots button:hover,
.chapter-dots button:focus-visible { background: rgba(237,230,218,.7); transform: scale(1.5); }
.chapter-dots button.is-active { background: var(--amber); box-shadow: 0 0 11px rgba(241,160,79,.8); transform: scale(1.35); }

.details-panel {
  width: 100vw;
  max-width: none;
  height: 100svh;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  color: var(--paper);
  background: rgba(5,7,7,.94);
  backdrop-filter: blur(22px);
}
.details-panel::backdrop { background: rgba(0,0,0,.56); backdrop-filter: blur(8px); }
.details-panel__inner { width: min(1120px, calc(100% - 48px)); margin: 0 auto; }
.details-panel__header {
  position: sticky;
  z-index: 2;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 34px 0 24px;
  border-bottom: 1px solid rgba(237,230,218,.13);
  background: linear-gradient(180deg, #080a0a 65%, transparent);
}
.details-panel__header h2 { margin: 0; font-family: var(--serif); font-size: clamp(42px, 5vw, 76px); font-weight: 400; letter-spacing: -.05em; }
.details-panel__header button,
.ticket-loader__close {
  width: 46px;
  height: 46px;
  border: 1px solid rgba(237,230,218,.24);
  border-radius: 50%;
  color: var(--paper);
  background: transparent;
  font-size: 25px;
  cursor: pointer;
}
.details-panel__body { padding: 30px 0 80px; }
.details-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin: 0; background: rgba(237,230,218,.12); }
.details-facts div { min-height: 135px; padding: 24px; background: #090c0c; }
.details-facts dt { margin-bottom: 20px; color: var(--amber); font-size: 8px; font-weight: 650; letter-spacing: .2em; text-transform: uppercase; }
.details-facts dd { margin: 0; font-family: var(--serif); font-size: 19px; line-height: 1.25; }
.details-section { padding: 32px 0; border-bottom: 1px solid rgba(237,230,218,.12); }
.details-section--split { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; }
.details-section h3 { margin: 0 0 12px; color: #f1c392; font-family: var(--serif); font-size: 27px; font-weight: 400; }
.details-section p { max-width: 760px; margin: 0; color: rgba(237,230,218,.67); font-size: 14px; line-height: 1.65; }
.details-section a { display: inline-block; margin-top: 13px; padding-bottom: 3px; border-bottom: 1px solid rgba(241,160,79,.5); color: #f1c392; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; }
.evening-program { border-bottom: 1px solid rgba(237,230,218,.12); }
.evening-program summary { display: flex; justify-content: space-between; padding: 28px 0; color: var(--paper); font-family: var(--serif); font-size: 26px; cursor: pointer; list-style: none; }
.evening-program summary::-webkit-details-marker { display: none; }
.evening-program[open] summary span { transform: rotate(45deg); }
.evening-program ol { columns: 2; column-gap: 60px; margin: 0; padding: 0 0 30px 24px; color: rgba(237,230,218,.62); font-size: 12px; line-height: 1.55; }
.evening-program li { break-inside: avoid; margin-bottom: 8px; padding-left: 7px; }
.details-proof { display: grid; grid-template-columns: auto 1fr auto 1fr; align-items: baseline; gap: 10px 18px; padding: 30px 0; }
.details-proof strong { color: #f1c392; font-family: var(--serif); font-size: 38px; font-weight: 400; }
.details-proof span { color: rgba(237,230,218,.55); font-size: 9px; letter-spacing: .14em; text-transform: uppercase; }
.details-panel__note { max-width: 720px; margin: 24px 0 0; color: rgba(237,230,218,.35); font-size: 10px; line-height: 1.5; }

.ticket-loader {
  position: fixed;
  z-index: 80;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(14px);
}
.ticket-loader__panel { position: relative; width: min(480px, 100%); padding: 48px; border: 1px solid rgba(237,230,218,.18); text-align: center; background: #090c0c; }
.ticket-loader__close { position: absolute; top: 16px; right: 16px; width: 38px; height: 38px; font-size: 20px; }
.ticket-loader h2 { margin: 18px 0 10px; font-family: var(--serif); font-size: 38px; font-weight: 400; }
.ticket-loader p { margin: 0 0 24px; color: var(--paper-soft); font-size: 13px; line-height: 1.5; }
.loader-flame { width: 42px; height: 55px; margin: 0 auto; border-radius: 60% 40% 55% 45%; background: radial-gradient(circle at 50% 70%, #fff1cc 0 8%, #f1a04f 25%, rgba(241,160,79,.1) 68%, transparent 70%); filter: drop-shadow(0 0 18px rgba(241,160,79,.65)); animation: flame 1.4s ease-in-out infinite alternate; }
@keyframes flame { to { transform: scale(.92,1.06) rotate(2deg); filter: drop-shadow(0 0 28px rgba(241,160,79,.75)); } }

.film__loader {
  position: absolute;
  z-index: 30;
  inset: 0;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 18px;
  background: #050707 url("assets/hero-start.webp") center/cover no-repeat;
  transition: opacity 1s ease, visibility 1s;
}
.film__loader::before { content: ""; position: absolute; inset: 0; background: rgba(2,4,4,.58); }
.film__loader span,
.film__loader p { position: relative; }
.film__loader span {
  width: 42px;
  height: 42px;
  border: 1px solid rgba(237, 230, 218, .18);
  border-top-color: var(--amber);
  border-radius: 50%;
  animation: turn 1.4s linear infinite;
}
.film__loader p { margin: 0; color: var(--paper-soft); font-size: 9px; letter-spacing: .22em; text-transform: uppercase; }
.film.is-loaded .film__loader { opacity: 0; visibility: hidden; }
@keyframes turn { to { transform: rotate(360deg); } }

.film__media,
.film__shade,
.film__grain,
.masthead,
.narrative,
.scroll-guide,
.scene-index,
.film__disclosure,
.chapter-dots,
.film__loader { position: fixed; }

.noscript-note {
  position: fixed;
  z-index: 100;
  left: 20px;
  bottom: 20px;
  margin: 0;
  padding: 12px 16px;
  color: #161616;
  background: var(--paper);
  font-size: 13px;
}

@media (max-width: 900px) {
  .masthead { grid-template-columns: 1fr auto; }
  .event-meta,
  .skip-film { display: none; }
  .sound-toggle { width: 42px; padding: 0; justify-content: center; }
  .sound-toggle span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .ticket-link { white-space: nowrap; }
}

@media (max-width: 760px) {
  .film { height: var(--film-height-mobile); }
  .masthead { grid-template-columns: 1fr auto; padding-inline: 18px; }
  .wordmark { font-size: 15px; letter-spacing: .28em; }
  .event-meta { display: none; }
  .masthead__actions { gap: 7px; }
  .skip-film { display: none; }
  .sound-toggle { width: 38px; min-height: 38px; padding: 0; justify-content: center; }
  .sound-toggle span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .ticket-link { min-height: 38px; padding-left: 15px; gap: 13px; }
  .ticket-link i { width: 25px; height: 25px; }
  .film__video,
  .film__poster { object-position: var(--focus-x) center; }
  .film__shade {
    background:
      linear-gradient(0deg, rgba(2,4,4,.68) 0%, transparent 48%, rgba(2,4,4,.3) 100%),
      radial-gradient(circle at 50% 43%, transparent 15%, rgba(0,0,0,.42) 110%);
  }
  .beat--alone { left: 22px; bottom: 19vh; }
  .beat--look { top: 27%; width: calc(100vw - 36px); }
  .beat--reveal { left: 22px; bottom: 13vh; width: calc(100vw - 44px); }
  .beat--answer { left: 22px; bottom: 18vh; width: calc(100vw - 44px); }
  .beat--another { left: 22px; right: auto; top: 30%; width: calc(100vw - 44px); }
  .beat--another p { font-size: clamp(30px, 9.5vw, 44px); text-align: left; }
  .beat--steps { left: 22px; top: 26%; width: calc(100vw - 44px); }
  .beat--fire { left: 22px; right: auto; top: 23%; width: calc(100vw - 44px); text-align: left; }
  .beat--recognize { left: 22px; bottom: 17vh; width: calc(100vw - 44px); }
  .beat--water-memory { top: 21%; width: calc(100vw - 36px); }
  .beat--water-reflection { bottom: 17vh; width: calc(100vw - 44px); }
  .beat--worlds { top: 19%; width: calc(100vw - 36px); }
  .beat--orbit { top: 22%; width: calc(100vw - 40px); }
  .beat--ground { left: 22px; bottom: 17vh; width: calc(100vw - 44px); }
  .beat--air { top: 24%; right: 22px; }
  .beat--breathe { top: 35%; width: calc(100vw - 40px); }
  .beat--one-sound { left: 22px; top: 33%; width: calc(100vw - 44px); }
  .beat--four-forces { left: 22px; top: 20%; width: calc(100vw - 44px); }
  .beat--not-stage { left: 22px; right: auto; bottom: 17vh; width: calc(100vw - 44px); text-align: left; }
  .beat--between { top: 21%; width: calc(100vw - 36px); }
  .beat--human { left: 22px; bottom: 18vh; width: calc(100vw - 44px); }
  .beat--place { top: 20%; width: calc(100vw - 36px); }
  .beat--finale { bottom: 7vh; width: calc(100vw - 28px); }
  .beat--afterglow { top: 17%; width: calc(100vw - 36px); }
  .beat__line { font-size: clamp(49px, 16vw, 76px); }
  .beat--look .beat__line { font-size: clamp(54px, 17vw, 82px); }
  .beat--reveal h1 { font-size: clamp(61px, 17.8vw, 88px); }
  .beat--steps .beat__line { font-size: clamp(43px, 13.2vw, 68px); }
  .beat--fire .beat__line { font-size: clamp(43px, 13.2vw, 68px); }
  .beat--recognize p { font-size: clamp(29px, 8.8vw, 41px); }
  .beat--water-memory .beat__line { font-size: clamp(39px, 12vw, 62px); }
  .beat--water-reflection p { font-size: clamp(29px, 8.8vw, 43px); }
  .beat--worlds .beat__line { font-size: clamp(38px, 11.8vw, 60px); }
  .beat--orbit p { font-size: clamp(30px, 9vw, 45px); }
  .beat--ground .beat__line { font-size: clamp(43px, 13.2vw, 68px); }
  .beat--air p { font-size: clamp(48px, 14vw, 72px); }
  .beat--breathe p { font-size: clamp(55px, 16vw, 82px); }
  .beat--one-sound p { font-size: clamp(43px, 12.8vw, 66px); }
  .beat--four-forces .beat__line { font-size: clamp(39px, 12vw, 62px); }
  .beat--not-stage p { font-size: clamp(30px, 9vw, 44px); }
  .beat--between p,
  .beat--human p,
  .beat--place p { font-size: clamp(40px, 12vw, 62px); }
  .beat--finale .beat__eyebrow { margin-bottom: 11px; }
  .beat--finale h2 { font-size: clamp(46px, 13.4vw, 68px); }
  .finale__facts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 0; margin-top: 17px; font-size: 7px; }
  .finale__facts li { padding: 0 8px; }
  .finale__facts li:nth-child(2) { border: 0; }
  .finale__actions { gap: 8px; margin-top: 17px; }
  .final-cta { min-height: 44px; padding: 0 15px; gap: 12px; font-size: 7px; }
  .beat--afterglow p { font-size: clamp(23px, 7vw, 34px); }
  .beat__promise { max-width: 340px; font-size: 16px; }
  .beat__promise br { display: none; }
  .scroll-guide { left: 18px; transform: none; }
  .scroll-guide__label { font-size: 8px; }
  .scroll-guide__track { display: none; }
  .scroll-guide__label b { font-size: 0; }
  .scroll-guide__label b::after { content: "Проведите вверх"; font-size: 8px; }
  .scene-index { right: 18px; }
  .scene-index span { display: none; }
  .film__disclosure { display: none; }
  .chapter-dots { left: 50%; top: auto; bottom: 58px; flex-direction: row; gap: 8px; transform: translateX(-50%); }
  .chapter-dots button { width: 4px; height: 4px; }
  .details-panel__inner { width: calc(100% - 32px); }
  .details-panel__header { padding: 22px 0 18px; }
  .details-panel__header h2 { font-size: 43px; }
  .details-panel__header button { width: 40px; height: 40px; }
  .details-panel__body { padding-top: 18px; }
  .details-facts { grid-template-columns: 1fr 1fr; }
  .details-facts div { min-height: 124px; padding: 18px; }
  .details-facts dd { font-size: 16px; }
  .details-section--split { grid-template-columns: 1fr; gap: 30px; }
  .evening-program summary { font-size: 21px; }
  .evening-program ol { columns: 1; }
  .details-proof { grid-template-columns: auto 1fr; }
  .ticket-loader__panel { padding: 44px 24px 30px; }
}

@media (max-height: 680px) and (min-width: 761px) {
  .beat--alone { bottom: 110px; }
  .beat--reveal { bottom: 66px; }
  .beat--reveal h1 { font-size: clamp(58px, 7.2vw, 96px); }
  .beat__promise { margin-top: 18px; }
  .story-link { margin-top: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .film { height: 100svh; }
  .film__video,
  .film__poster--start,
  .beat--alone,
  .beat--look,
  .beat--reveal,
  .beat--answer,
  .beat--another,
  .beat--steps,
  .beat--fire,
  .beat--recognize,
  .beat--water-memory,
  .beat--water-reflection,
  .beat--worlds,
  .beat--orbit,
  .beat--ground,
  .beat--air,
  .beat--breathe,
  .beat--one-sound,
  .beat--four-forces,
  .beat--not-stage,
  .beat--between,
  .beat--human,
  .beat--place,
  .beat--afterglow,
  .scroll-guide,
  .chapter-dots,
  .sound-toggle,
  .skip-film { display: none; }
  .film__poster--end { opacity: 1; }
  .beat--finale { opacity: 1; transform: translateX(-50%); filter: none; }
  .film__loader { display: none; }
}

.reduce-motion .film { height: 100svh; }
.reduce-motion .film__video,
.reduce-motion .film__poster--start,
.reduce-motion .beat--alone,
.reduce-motion .beat--look,
.reduce-motion .beat--reveal,
.reduce-motion .beat--answer,
.reduce-motion .beat--another,
.reduce-motion .beat--steps,
.reduce-motion .beat--fire,
.reduce-motion .beat--recognize,
.reduce-motion .beat--water-memory,
.reduce-motion .beat--water-reflection,
.reduce-motion .beat--worlds,
.reduce-motion .beat--orbit,
.reduce-motion .beat--ground,
.reduce-motion .beat--air,
.reduce-motion .beat--breathe,
.reduce-motion .beat--one-sound,
.reduce-motion .beat--four-forces,
.reduce-motion .beat--not-stage,
.reduce-motion .beat--between,
.reduce-motion .beat--human,
.reduce-motion .beat--place,
.reduce-motion .beat--afterglow,
.reduce-motion .scroll-guide,
.reduce-motion .chapter-dots,
.reduce-motion .sound-toggle,
.reduce-motion .skip-film { display: none; }
.reduce-motion .film__poster--end { opacity: 1; }
.reduce-motion .beat--finale { opacity: 1; transform: translateX(-50%); filter: none; }
.reduce-motion .film__loader { display: none; }

@media (hover: none) {
  .ticket-link:hover,
  .story-link:hover { transform: none; }
}
