:root {
  --ink: #04060c;
  --night: #081120;
  --stone: #16233a;
  --steel: #3a4d6e;
  --silver: #d6deea;
  --mist: #8d9bb3;
  --ice: #9fbdf0;
  --ember: #d98a2b; /* the gold on the statues' masks, used once or twice */
  --display: "Cinzel", "Times New Roman", serif;
  --wide: "Syncopate", "Arial Black", sans-serif;
  --body: "Inter Tight", system-ui, sans-serif;
  --gut: clamp(16px, 3vw, 44px);
  --ease: cubic-bezier(.7, 0, .2, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
body {
  background: var(--ink);
  color: var(--silver);
  font-family: var(--body);
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
img, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
p { margin: 0; }
h1, h2, h3 { margin: 0; font-weight: 400; }
::selection { background: var(--ice); color: var(--ink); }

.silver {
  background: linear-gradient(180deg, #ffffff 0%, #c3cfdf 45%, #6f819e 70%, #dfe7f2 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ---------- small type ---------- */
.kicker, .cap, .bar__meta, .god__idx, .god__enters, .tier__tag, .house-count, .close__sign, .gods__hint, .tickets__fine {
  font-family: var(--wide);
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
}
.kicker { color: var(--mist); margin-bottom: 18px; }

/* ---------- bar ---------- */
.bar {
  position: fixed; inset: 0 0 auto; z-index: 50;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 18px var(--gut);
  mix-blend-mode: normal;
  transition: background .5s var(--ease), padding .5s var(--ease);
}
.bar.is-scrolled { background: rgba(4, 6, 12, .72); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); padding-block: 12px; }
.bar__home img { height: 14px; width: auto; opacity: .9; transition: opacity .3s; }
.bar__home:hover img { opacity: 1; }
.bar__meta { display: flex; gap: 28px; color: var(--mist); }
@media (max-width: 720px) { .bar__meta { display: none; } }

/* ---------- buttons: rolling label, filling ground ---------- */
.btn {
  position: relative; display: inline-flex; align-items: center; gap: 14px;
  font-family: var(--wide); font-weight: 700; text-transform: uppercase; letter-spacing: .16em;
  color: var(--ink); background: var(--silver);
  border: 1px solid var(--silver); border-radius: 999px;
  overflow: hidden; isolation: isolate; cursor: pointer;
  transition: color .5s var(--ease);
}
.btn::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: var(--ink); border-radius: inherit;
  transform: translateY(101%); transition: transform .55s var(--ease);
}
.btn:hover, .btn:focus-visible { color: var(--silver); }
.btn:hover::before, .btn:focus-visible::before { transform: translateY(0); }
.btn:focus-visible { outline: 1px solid var(--ice); outline-offset: 4px; }
.btn__roll { position: relative; display: inline-grid; overflow: hidden; line-height: 1.25; }
.btn__roll > span { grid-area: 1 / 1; transition: transform .55s var(--ease); }
.btn__roll > span + span { transform: translateY(110%); }
.btn:hover .btn__roll > span:first-child { transform: translateY(-110%); }
.btn:hover .btn__roll > span + span { transform: translateY(0); }
.btn__arrow { display: inline-block; transition: transform .55s var(--ease); font-family: var(--body); font-size: 1.3em; line-height: 1; }
.btn:hover .btn__arrow { transform: rotate(45deg); }
.btn--small { font-size: 10px; padding: 11px 18px; }
.btn--big { font-size: clamp(11px, 1vw, 13px); padding: 22px 30px; }
.btn--ghost { background: transparent; color: var(--silver); }
.btn--ghost::before { background: var(--silver); }
.btn--ghost:hover, .btn--ghost:focus-visible { color: var(--ink); }

.ulink { position: relative; display: inline-block; }
.ulink::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -3px; height: 1px; background: currentColor;
  transform: scaleX(0); transform-origin: right; transition: transform .6s var(--ease);
}
.ulink:hover::after { transform: scaleX(1); transform-origin: left; }

/* ---------- house counter ---------- */
.house-count {
  position: fixed; left: var(--gut); bottom: 22px; z-index: 40;
  display: flex; flex-direction: column; gap: 4px; color: var(--mist);
  pointer-events: none;
}
.house-count__num { font-family: var(--display); font-size: 22px; letter-spacing: .04em; color: var(--silver); text-transform: none; }
.house-count__num span { display: inline-block; min-width: 1.4em; }
@media (max-width: 720px) { .house-count { display: none; } }

/* ---------- 01 threshold ---------- */
.threshold { position: relative; height: 100vh; height: 100svh; }
.threshold__stage { position: relative; height: 100vh; height: 100svh; overflow: hidden; }
.threshold__art { position: absolute; inset: 0; will-change: transform; transform-origin: 50% 90%; }
.threshold__art img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.threshold__veil {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse at 50% 0%, rgba(159, 189, 240, .18), transparent 55%),
    linear-gradient(180deg, rgba(4, 6, 12, .55) 0%, transparent 18%, transparent 70%, rgba(4, 6, 12, .85) 100%);
}
.threshold__frame { position: absolute; inset: 0; padding: 86px var(--gut) 28px; pointer-events: none; }
.cap { position: absolute; color: var(--silver); line-height: 1.9; }
.cap--tl { top: 86px; left: var(--gut); }
.cap--tr { top: 86px; right: var(--gut); text-align: right; color: var(--mist); }
.cap--bl { bottom: 84px; left: var(--gut); }
.cap--br { bottom: 28px; right: var(--gut); display: flex; align-items: center; gap: 12px; }
.cue i { display: block; width: 1px; height: 38px; background: linear-gradient(var(--silver), transparent); animation: drip 2.2s var(--ease) infinite; transform-origin: top; }
@keyframes drip { 0% { transform: scaleY(0); } 50% { transform: scaleY(1); transform-origin: top; } 51% { transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }

.threshold__line {
  position: absolute; inset: 0; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;
  gap: 0 .28em; padding: 0 var(--gut); text-align: center;
  font-family: var(--display); font-size: clamp(28px, 4.4vw, 64px); line-height: 1; letter-spacing: .02em;
  pointer-events: none;
}
.threshold__line .w { display: inline-block; overflow: hidden; padding: .06em 0 .12em; }
.threshold__line .w > span { display: inline-block; }
.js .threshold__line .w > span { transform: translateY(115%); }
.threshold__line .w--big { flex-basis: 100%; font-size: clamp(64px, 13.5vw, 230px); font-weight: 600; line-height: .86; }
.threshold__line .w--big > span {
  background: linear-gradient(180deg, #fff 0%, #c7d2e2 50%, #7387a6 78%, #e8eef6 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ---------- 02 years ---------- */
.years {
  position: relative; min-height: 120vh; padding: 20vh var(--gut) 18vh;
  background: linear-gradient(180deg, var(--ink), var(--night) 60%, var(--ink));
  overflow: clip;
}
.years__eleven {
  position: absolute; top: 4vh; left: 50%; transform: translateX(-50%);
  font-family: var(--display); font-weight: 800; font-size: clamp(320px, 62vw, 1000px); line-height: .8;
  color: transparent; -webkit-text-stroke: 1px rgba(159, 189, 240, .18);
  pointer-events: none; user-select: none; white-space: nowrap;
}
.years__img { position: absolute; margin: 0; }
.years__img .mask { overflow: hidden; clip-path: inset(100% 0 0 0); }
.years__img img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; transform: scale(1.3); filter: grayscale(1) contrast(1.05) brightness(.8); }
.years__img--a { width: clamp(150px, 22vw, 340px); left: var(--gut); top: 18vh; }
.years__img--b { width: clamp(120px, 15vw, 240px); right: calc(var(--gut) + 4vw); top: 52vh; }
.years__img--c { width: clamp(130px, 18vw, 280px); left: 26vw; bottom: 6vh; }
.years__copy { position: relative; z-index: 2; max-width: 1100px; margin: 0 auto; padding-left: clamp(0px, 20vw, 300px); }
.years__lines {
  font-family: var(--display); font-size: clamp(34px, 5.6vw, 92px); line-height: 1.04; letter-spacing: -.005em; color: var(--silver);
}
.years__lines .word { opacity: .14; transition: none; }
.years__foot { margin-top: 48px; font-size: clamp(15px, 1.2vw, 18px); color: var(--mist); max-width: 34ch; line-height: 1.6; }
@media (max-width: 720px) {
  .years { min-height: auto; padding: 22vh var(--gut) 18vh; }
  .years__copy { padding-left: 0; }
  .years__img--a { top: 6vh; left: auto; right: var(--gut); width: 38vw; }
  .years__img--b { display: none; }
  .years__img--c { position: relative; left: auto; bottom: auto; width: 56vw; margin: 64px 0 0 auto; }
  .years__lines { font-size: 34px; }
}

/* ---------- 03 gods (horizontal) ---------- */
.gods { position: relative; background: var(--ink); }
.gods__pin { height: 100vh; height: 100svh; overflow: hidden; display: flex; align-items: center; }
.gods__track { display: flex; align-items: center; gap: clamp(40px, 6vw, 110px); padding: 0 var(--gut); will-change: transform; }
.gods__intro { flex: 0 0 auto; width: min(560px, 84vw); }
.gods__title { font-family: var(--display); font-size: clamp(40px, 5.6vw, 88px); line-height: .98; display: flex; flex-direction: column; }
.gods__title em { font-style: normal; color: var(--ice); margin-top: .2em; }
.gods__hint { margin-top: 40px; display: flex; align-items: center; gap: 16px; color: var(--mist); }
.gods__hint i { display: block; width: 64px; height: 1px; background: var(--mist); position: relative; }
.gods__hint i::after { content: ""; position: absolute; right: 0; top: -3px; width: 7px; height: 7px; border-top: 1px solid var(--mist); border-right: 1px solid var(--mist); transform: rotate(45deg); }

.god { flex: 0 0 auto; position: relative; display: grid; grid-template-columns: auto auto; align-items: end; gap: 0; }
.god__media { width: clamp(240px, 27vw, 420px); position: relative; z-index: 1; }
.god__media .mask { overflow: hidden; clip-path: inset(0 0 0 100%); }
.god__media img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; transform: scale(1.25); filter: saturate(.75); }
.god__text { position: relative; z-index: 2; margin-left: 28px; padding-bottom: 6%; width: clamp(260px, 30vw, 460px); }
.god__idx { color: var(--mist); display: flex; gap: 14px; align-items: center; margin-bottom: 14px; }
.god__idx span { color: var(--ink); background: var(--ice); padding: 4px 8px; letter-spacing: .18em; }
.god__name {
  font-family: var(--display); font-weight: 600; text-transform: uppercase;
  font-size: clamp(48px, 6.4vw, 110px); line-height: .88; letter-spacing: -.01em;
  background: linear-gradient(180deg, #fff 0%, #c7d2e2 52%, #7387a6 80%, #e8eef6 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 6px 24px rgba(0, 0, 0, .6));
  margin-left: clamp(-180px, -10vw, -80px); position: relative;
}
.god__enters { margin: 18px 0 22px; color: var(--ice); }
.god__q { font-size: clamp(14px, 1.05vw, 16px); line-height: 1.55; color: var(--silver); max-width: 34ch; }
.god__q + .god__q { margin-top: 8px; color: var(--mist); }
.god:last-child { margin-right: 8vw; }

@media (max-width: 720px) {
  .god { grid-template-columns: 1fr; width: 82vw; }
  .god__media { width: 70vw; }
  .god__name { margin-left: 0; }
  .god__text { margin: -64px 0 0 0; width: 82vw; padding-bottom: 0; }
  .god__name { font-size: 46px; }
  .gods__intro { width: 84vw; }
}

/* ---------- 04 film ---------- */
.film { position: relative; background: var(--ink); }
.film__pin { height: 100vh; height: 100svh; position: relative; display: grid; place-items: center; overflow: hidden; }
.film__frame { position: relative; z-index: 1; height: 38vh; aspect-ratio: 9 / 16; overflow: hidden; border-radius: 4px; will-change: transform; }
.film__frame video { width: 100%; height: 100%; object-fit: cover; }
.film__word {
  position: absolute; z-index: 2; top: 50%; font-family: var(--display); font-weight: 600;
  font-size: clamp(54px, 11vw, 200px); line-height: .9; white-space: nowrap; pointer-events: none;
  background: linear-gradient(180deg, #fff 0%, #c7d2e2 50%, #7387a6 80%, #e8eef6 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  mix-blend-mode: normal;
}
.film__word { font-size: clamp(44px, 9vw, 168px); }
.film__word--l { left: var(--gut); top: 14%; }
.film__word--r { right: var(--gut); bottom: 14%; top: auto; }
@media (max-width: 720px) { .film__word { font-size: 50px; } }

/* ---------- 05 tickets ---------- */
.tickets { position: relative; padding: 14vh var(--gut) 10vh; background: radial-gradient(ellipse at 50% 0%, rgba(58, 77, 110, .45), transparent 60%), var(--ink); }
.tickets__head { max-width: 1280px; margin: 0 auto 72px; }
.tickets__title { font-family: var(--display); font-size: clamp(42px, 7.2vw, 128px); line-height: .95; }
.tickets__title .line { display: block; overflow: hidden; padding-bottom: .06em; }
.tickets__title .line > span { display: inline-block; }
.tiers { list-style: none; margin: 0 auto; padding: 0; max-width: 1280px; border-top: 1px solid rgba(214, 222, 234, .18); }
.tier {
  position: relative; display: grid; grid-template-columns: 60px 1fr auto 180px; align-items: baseline; gap: 20px;
  padding: 26px 0; border-bottom: 1px solid rgba(214, 222, 234, .18);
}
.tier::before {
  content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(159, 189, 240, .1), transparent);
  transform: scaleX(0); transform-origin: left; transition: transform .7s var(--ease); pointer-events: none;
}
.tier:hover::before { transform: scaleX(1); }
.tier__n { font-family: var(--display); color: var(--mist); font-size: 16px; }
.tier__name { font-family: var(--display); font-size: clamp(24px, 3vw, 44px); }
.tier__price { font-family: var(--display); font-weight: 600; font-size: clamp(24px, 3vw, 44px); letter-spacing: .01em; }
.tier__price--sm { font-weight: 400; color: var(--mist); }
.tier__tag { text-align: right; color: var(--ice); }
.tier--gone .tier__name, .tier--gone .tier__price { color: var(--steel); text-decoration: line-through; text-decoration-thickness: 1px; }
.tier--gone .tier__tag { color: var(--ember); }
.tickets__cta { max-width: 1280px; margin: 56px auto 0; display: flex; flex-wrap: wrap; gap: 14px; }
.tickets__fine { max-width: 1280px; margin: 28px auto 0; color: var(--mist); }
@media (max-width: 720px) {
  .tier { grid-template-columns: 34px 1fr auto; row-gap: 6px; }
  .tier__tag { grid-column: 2 / -1; text-align: left; }
  .tier__name, .tier__price { font-size: 22px; }
  .tickets__cta .btn { width: 100%; justify-content: space-between; }
}

/* ---------- 06 close ---------- */
.close { position: relative; padding: 10vh 0 44px; background: var(--ink); border-top: 1px solid rgba(214, 222, 234, .1); overflow: hidden; }
.close__toast { padding: 5vh var(--gut) 7vh; font-family: var(--display); font-size: clamp(22px, 2.6vw, 38px); text-align: center; color: var(--silver); }
.close__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; padding: 0 var(--gut) 10vh; max-width: 1280px; margin: 0 auto; line-height: 1.9; font-size: 15px; }
.close__spk img { height: 20px; width: auto; }
.close__sponsors { display: flex; align-items: center; gap: 24px; }
.close__sponsors img { height: 44px; width: auto; object-fit: contain; }
.close__sign { padding: 0 var(--gut); text-align: center; color: var(--mist); }
.close__sign span { color: var(--ember); margin: 0 10px; }
@media (max-width: 720px) {
  .close__grid { grid-template-columns: 1fr; gap: 28px; }
  .close { padding-bottom: 80px; }
}

/* ---------- reduced motion: everything visible, nothing pinned ---------- */
@media (prefers-reduced-motion: reduce) {
  .threshold__line .w > span { transform: none; }
  .years__img .mask, .god__media .mask { clip-path: none; }
  .years__lines .word { opacity: 1; }
  .cue i { animation: none; }
}
.no-motion .gods__pin { height: auto; padding: 16vh 0; }
.no-motion .gods__track { flex-direction: column; align-items: flex-start; gap: 80px; }
.no-motion .threshold__line .w > span { transform: none; }
.no-motion .years__img .mask, .no-motion .god__media .mask { clip-path: none; }
.no-motion .years__lines .word { opacity: 1; }

/* ---------- finishing pass ---------- */
.bar__end { display: flex; align-items: center; gap: 8px; }
.sound { gap: 10px; }
.sound .eq { display: inline-flex; align-items: flex-end; gap: 2px; height: 10px; }
.sound .eq i { display: block; width: 2px; height: 10px; background: currentColor; transform-origin: 50% 100%; transform: scaleY(.3); transition: transform .2s; }
.sound.is-on { background: var(--silver); color: var(--ink); }
.sound.is-on::before { background: var(--ink); }
.sound.is-on:hover { color: var(--silver); }
@media (max-width: 420px) { .sound .btn__roll { display: none; } .sound { padding-inline: 14px; } }

.house-count__label { display: flex; align-items: center; gap: 8px; }
.house-count__label::after { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--ice); opacity: calc(.15 + var(--pulse, 0) * .85); }
.house-count__num { text-shadow: 0 0 calc(var(--pulse, 0) * 14px) rgba(159, 189, 240, .7); }

/* gods: names sit beside the portrait, portraits pulled toward temple blue */
.god__media { width: clamp(220px, 22vw, 340px); }
.god__media .mask { position: relative; }
.god__media .mask::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, #2b4a7e, #0a1426); mix-blend-mode: multiply; opacity: .62; }
.god__media img { filter: saturate(.55) brightness(.9); }
.god__name { margin-left: 0; font-size: clamp(44px, 5.2vw, 92px); }
.god__text { margin-left: 32px; width: clamp(240px, 26vw, 400px); }
.gods__track { gap: clamp(40px, 5vw, 90px); }
@media (max-width: 720px) {
  .god__text { margin: 20px 0 0 0; }
  .god__media { width: 64vw; }
}

/* film: the line stands either side of the frame, never over it */
.film__word { top: 50%; bottom: auto; font-size: clamp(48px, 6.2vw, 108px); line-height: .92; }
.film__word--l { left: auto; right: calc(50% + 20.25vh + 3vw); text-align: right; transform: translateY(-50%); }
.film__word--r { right: auto; left: calc(50% + 20.25vh + 3vw); transform: translateY(-50%); }
@media (max-width: 720px) {
  .film__word { font-size: 40px; line-height: 1; left: 0; right: 0; text-align: center; }
  .film__word br { display: none; }
  .film__word--l { top: calc(50% - 33vh); transform: translateY(calc(-100% - 14px)); }
  .film__word--r { top: calc(50% + 33vh + 14px); transform: none; }
}

/* the closing line holds still and breathes on the beat */
.awaits { padding: 0 var(--gut); text-align: center; font-family: var(--display); font-weight: 600; text-transform: uppercase; font-size: clamp(40px, 7vw, 120px); line-height: .98; }
.awaits span { display: inline-block; background: linear-gradient(180deg, #fff 0%, #c7d2e2 50%, #7387a6 80%, #e8eef6 100%); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 calc(var(--pulse, 0) * 22px) rgba(159, 189, 240, .45)); }
@media (max-width: 720px) { .awaits { font-size: 50px; } .awaits span { display: block; } }
.sound .eq i:nth-child(1) { transform: scaleY(.4); }
.sound .eq i:nth-child(2) { transform: scaleY(.8); }
.sound .eq i:nth-child(3) { transform: scaleY(.55); }
.sound .eq i:nth-child(4) { transform: scaleY(.9); }
@media (min-width: 721px) {
  .years__copy { max-width: 1000px; padding-left: 22vw; }
  .years__lines { font-size: clamp(34px, 4.6vw, 76px); }
  .years__img--b { right: var(--gut); width: clamp(110px, 12vw, 200px); top: 48vh; }
  .years__img--c { left: calc(var(--gut) + 8vw); bottom: 14vh; width: clamp(120px, 13vw, 210px); }
}

/* ---------- third pass: one god per screen ---------- */
.gods__track { gap: 0; padding: 0; }
.gods__intro, .god { flex: 0 0 100vw; width: 100vw; margin: 0; }
.gods__intro { display: flex; flex-direction: column; justify-content: center; padding: 0 var(--gut) 0 max(var(--gut), calc(50vw - 300px)); }
.god { display: flex; align-items: flex-end; justify-content: center; padding: 0 var(--gut); }
.god:last-child { margin-right: 0; }
@media (max-width: 720px) {
  .god { flex-direction: column; align-items: flex-start; justify-content: center; padding: 0 9vw; }
  .god__text { width: 100%; }
  .gods__intro { padding: 0 var(--gut); }
}
/* phone: the procession stands in a column, one god per screen, and the page pages through it */
@media (max-width: 720px) {
  .gods__pin { display: block; height: auto; overflow: visible; }
  .gods__track { flex-direction: column; align-items: stretch; }
  .gods__intro, .god { flex: none; width: 100%; height: 100vh; height: 100svh; }
  .gods__hint { flex-direction: column; align-items: flex-start; gap: 14px; }
  .gods__hint i { margin-left: 3px; width: 1px; height: 44px; background: linear-gradient(var(--mist), transparent 140%); }
  .gods__hint i::after { right: -3px; top: auto; bottom: 0; border-top: 0; border-bottom: 1px solid var(--mist); }
}

/* tickets: heading, four tiers and both buttons on one screen */
.tickets { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding: 76px var(--gut) 28px; }
.tickets > * { width: 100%; }
.tickets__head { margin-bottom: 32px; }
.tickets__head .kicker { margin-bottom: 12px; }
.tickets__title { font-size: clamp(36px, 5vw, 84px); }
.tier { padding: 16px 0; }
.tier__name, .tier__price { font-size: clamp(22px, 2.4vw, 36px); }
.tickets__cta { margin-top: 28px; }
.tickets__fine { margin-top: 18px; }
@media (max-width: 720px) {
  .tickets { padding: 70px var(--gut) 18px; }
  .tickets__title { font-size: 34px; }
  .tickets__head { margin-bottom: 20px; }
  .tier { padding: 11px 0; row-gap: 2px; }
  .tier__name, .tier__price { font-size: 20px; }
  .tickets__cta { margin-top: 18px; gap: 8px; }
  .tickets__cta .btn { padding: 17px 22px; }
  .tickets__fine { margin-top: 12px; line-height: 1.7; }
}

/* ---------- the song drives the page ---------- */
/* bass: the key art breathes, light from above swells, the big silver type brightens */
.threshold__art { scale: calc(1 + var(--bass, 0) * .018); }
.threshold__veil::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 50% at 50% 0%, rgba(190, 212, 255, .35), transparent 70%); opacity: calc(var(--bass, 0) * .7); }
.threshold__line .w--big > span, .film__word, .tickets__title .line > span { filter: brightness(calc(1 + var(--bass, 0) * .22)); }
.god__name { filter: brightness(calc(1 + var(--bass, 0) * .2)) drop-shadow(0 6px 24px rgba(0, 0, 0, .6)); }
.awaits span { filter: brightness(calc(1 + var(--bass, 0) * .22)) drop-shadow(0 0 calc(var(--pulse, 0) * 22px) rgba(159, 189, 240, .45)); }
/* mids: the blue tint over the portraits breathes */
.god__media .mask::after { opacity: calc(.62 - var(--mid, 0) * .2); }
.god__media .mask::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; box-shadow: inset 0 0 calc(40px + var(--mid, 0) * 50px) rgba(4, 6, 12, calc(.5 + var(--mid, 0) * .3)); }
/* highs: fine shimmer on the counter and the small captions */
.house-count__num, .cap, .kicker, .god__enters {
  text-shadow: 0 0 calc(var(--high, 0) * 10px) rgba(190, 212, 255, calc(var(--high, 0) * .8));
}
.house-count__num { text-shadow: 0 0 calc(var(--pulse, 0) * 12px + var(--high, 0) * 8px) rgba(159, 189, 240, .7); }
/* the grid: a dot on every beat (above), a hairline under the bar on each downbeat */
.bar::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--ice), transparent); opacity: calc(var(--down, 0) * .7); pointer-events: none; }
/* a portrait shot under warm club light goes olive under the blue: take its colour out first */
.god__media img.is-warm { filter: grayscale(.9) brightness(1.3) contrast(1.06); }