:root {
  color-scheme: dark;
  --black: #0a2522;
  --ink: #102c28;
  --paper: #ececdf;
  --paper-2: #d4dbd0;
  --light: #f5f6ee;
  --signal: #d8f45d;
  --violet: #a8ccff;
  --release-bg: #28263e;
  --facts-orange: #f45125;
  --newsletter-bg: #f39a74;
  --footer-blue: #111313;
  --surface-dark: #13332f;
  --surface-deep: #071c1a;
  --muted-dark: #a9b9b3;
  --line-dark: rgba(245, 246, 238, .2);
  --line-light: rgba(16, 44, 40, .2);
  --header-pad: clamp(1rem, 2vw, 2rem);
  --section-x: clamp(1.2rem, 6vw, 7rem);
}

html[data-palette="plum"] {
  --black: #261529;
  --ink: #2e1932;
  --paper: #f1e8df;
  --paper-2: #dfd2cb;
  --light: #fbf4ee;
  --signal: #f1dc62;
  --violet: #b9c8ff;
  --release-bg: #30253a;
  --newsletter-bg: #e9987e;
  --footer-blue: #111313;
  --surface-dark: #351d3a;
  --surface-deep: #1d0f21;
  --muted-dark: #c4b2c2;
  --line-dark: rgba(251, 244, 238, .2);
  --line-light: rgba(46, 25, 50, .2);
}

html[data-palette="midnight"] {
  --black: #101b33;
  --ink: #14213d;
  --paper: #ece9df;
  --paper-2: #d8d8d2;
  --light: #f8f4e9;
  --signal: #7edbd1;
  --violet: #d5b8ff;
  --release-bg: #202940;
  --newsletter-bg: #e89a72;
  --footer-blue: #111313;
  --surface-dark: #192a4b;
  --surface-deep: #0b1529;
  --muted-dark: #aebbd2;
  --line-dark: rgba(248, 244, 233, .2);
  --line-light: rgba(20, 33, 61, .2);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: #111313; scroll-padding-top: 5.5rem; }
body { margin: 0; background: #111313; color: var(--light); font-family: Arial, Helvetica, sans-serif; overflow-x: hidden; }
body.is-loading, body.menu-open { overflow: hidden; }
main { position: relative; z-index: 2; background: var(--black); box-shadow: 0 3rem 7rem rgba(0, 0, 0, .45); }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
a { color: inherit; }
img { display: block; max-width: 100%; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.icon-external { position: relative; display: inline-block; flex: 0 0 auto; width: .72rem; height: .72rem; margin-inline-start: .42rem; font-size: 0; vertical-align: -.04rem; }
.icon-external::before { content: ""; position: absolute; top: 50%; left: 7%; width: 88%; height: 1px; background: currentColor; transform: rotate(-45deg); transform-origin: center; }
.icon-external::after { content: ""; position: absolute; top: 0; right: 0; width: 44%; height: 44%; border-top: 1px solid currentColor; border-right: 1px solid currentColor; }
.icon-direction { position: relative; display: inline-block; flex: 0 0 auto; width: .9rem; height: .7rem; margin-inline-start: .4rem; font-size: 0; }
.icon-direction::before { content: ""; position: absolute; top: calc(50% - .5px); right: 0; width: 100%; height: 1px; background: currentColor; }
.icon-direction::after { content: ""; position: absolute; top: 50%; right: 0; width: .42rem; height: .42rem; border-top: 1px solid currentColor; border-right: 1px solid currentColor; transform: translateY(-50%) rotate(45deg); }
.icon-direction--back { margin: 0; transform: rotate(180deg); }

.loader {
  position: fixed; inset: 0; z-index: 1000; display: grid; align-content: end; gap: .75rem;
  padding: clamp(1.25rem, 3vw, 3rem); background: #000; transition: opacity .55s ease, visibility .55s;
}
.loader.is-complete { opacity: 0; visibility: hidden; pointer-events: none; }
.loader__meta { display: flex; justify-content: space-between; text-transform: uppercase; font-size: .72rem; letter-spacing: .14em; }
.loader__track { height: 2px; background: rgba(255,255,255,.14); overflow: hidden; }
.loader__bar { width: 100%; height: 100%; background: var(--paper); transform: scaleX(0); transform-origin: left; }

.site-header {
  position: fixed; z-index: 200; top: 0; left: 0; width: 100%; display: grid; grid-template-columns: auto 1fr auto;
  align-items: center; gap: clamp(1rem, 3vw, 3.5rem); padding: var(--header-pad); pointer-events: none;
}
.site-header::before {
  content: ""; position: absolute; inset: 0; z-index: -1; background: color-mix(in srgb, var(--surface-deep) 86%, transparent);
  border-bottom: 1px solid transparent; backdrop-filter: blur(16px); opacity: 0; transition: opacity .35s ease, border-color .35s ease;
}
.site-header.is-visible::before { opacity: 1; border-color: var(--line-dark); }
.site-header__brand { width: clamp(7.2rem, 9vw, 9rem); opacity: 0; pointer-events: auto; }
.site-header__brand img { width: 100%; height: auto; }
.site-nav { justify-self: center; display: flex; gap: clamp(.9rem, 2vw, 2.2rem); opacity: 0; transform: translateY(-12px); }
.site-nav a, .header-ticket {
  position: relative; font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; pointer-events: auto;
}
.site-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -.45rem; height: 1px; background: currentColor; transition: right .25s ease; }
.site-nav a:hover::after, .site-nav a:focus-visible::after { right: 0; }
.header-ticket { opacity: 0; justify-self: end; padding: .7rem 1rem; border: 1px solid color-mix(in srgb, var(--light) 55%, transparent); }
.menu-button { display: none; border: 0; color: var(--light); background: none; padding: .5rem; pointer-events: auto; }

.reveal { position: relative; height: 100svh; background: #000; }
.reveal__stage { position: sticky; top: 0; width: 100%; height: 100svh; overflow: hidden; background: #000; }
.intro-simple { position: absolute; inset: 0; overflow: hidden; isolation: isolate; background: #000; }
.hero-video { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; background: #000; filter: saturate(.9) contrast(1.04) brightness(.94); }
.intro-simple::before {
  content: ""; position: absolute; z-index: 2; inset: 0; pointer-events: none; opacity: .38;
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,.24) 0 1px, rgba(255,255,255,.035) 1px 2px, transparent 2px 4px),
    radial-gradient(circle, rgba(255,255,255,.24) 0 .55px, transparent .75px) 0 0 / 4px 4px;
  mix-blend-mode: soft-light;
}
.hero-fluid { position: absolute; z-index: 4; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: .92; mix-blend-mode: difference; }
.hero-fluid[hidden] { display: none; }
.hero-draw-zone { position: absolute; z-index: 6; inset: 0; }
.hero-video-logo {
  position: absolute; z-index: 5; left: 50%; top: 46%; width: min(76vw, 68rem); aspect-ratio: 9860 / 1179;
  transform: translate(-50%, -50%); mix-blend-mode: difference; pointer-events: none;
}
.hero-video-logo img { width: 100%; height: 100%; }
.intro-simple::after { content: ""; position: absolute; z-index: 3; inset: 0; pointer-events: none; background: radial-gradient(circle at 50% 44%, transparent 0 38%, rgba(0,0,0,.28) 78%, rgba(0,0,0,.68) 100%), linear-gradient(180deg, rgba(0,0,0,.1), transparent 40%, rgba(0,0,0,.45)); }
.intro-end { position: absolute; z-index: 60; left: 50%; bottom: clamp(2.5rem, 6vh, 5rem); transform: translate(-50%, 0); width: min(92vw, 52rem); text-align: center; opacity: 0; }
.intro-end__claim { display: flex; justify-content: center; flex-wrap: wrap; gap: .3em .48em; margin: 0 0 1.55rem; font-size: clamp(1rem, 1.75vw, 1.4rem); letter-spacing: -.02em; }
.intro-end__claim span { display: inline-block; opacity: 0; filter: blur(.3rem); transform: translateY(.7rem); transition: opacity .6s ease, filter .7s ease, transform .7s cubic-bezier(.22,1,.36,1); will-change: opacity, transform, filter; }
.intro-end__claim span:nth-child(1) { transition-delay: .18s; }
.intro-end__claim span:nth-child(2) { transition-delay: .55s; }
.intro-end__claim span:nth-child(3) { transition-delay: .92s; }
.intro-end.is-visible .intro-end__claim span { opacity: 1; filter: none; transform: translateY(0); }
.scroll-hint { position: relative; display: block; width: 1.55rem; height: 2.55rem; margin: 0 auto; border: 1px solid currentColor; border-radius: 999px; color: var(--light); opacity: 0; transition: opacity .5s ease 1.35s; }
.intro-end.is-visible .scroll-hint { opacity: 1; }
.scroll-hint span { position: absolute; top: .48rem; left: 50%; width: 2px; height: .55rem; border-radius: 999px; background: currentColor; transform: translateX(-50%); animation: scroll-cue 1.7s cubic-bezier(.45, 0, .25, 1) infinite; }
@keyframes scroll-cue {
  0% { opacity: 0; transform: translate(-50%, -.12rem); }
  20% { opacity: 1; }
  75% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, .8rem); }
}

.section { position: relative; z-index: var(--section-stack, 2); margin-top: -1px; padding: clamp(6rem, 10vw, 10rem) var(--section-x); overflow: hidden; box-shadow: 0 -2.25rem 4.5rem rgba(0, 0, 0, .16); }
.section > :not(.facts) { translate: 0 var(--section-parallax-y, 0px); }
.section--dark { color: var(--light); background: var(--black); }
.section--signal { color: var(--ink); background: var(--signal); }
.section-head { display: grid; grid-template-columns: minmax(12rem, .7fr) 1.7fr minmax(16rem, .7fr); align-items: start; gap: 2rem; margin-bottom: clamp(4rem, 9vw, 8rem); }
.eyebrow, .mini-label { margin: 0; font-size: .68rem; line-height: 1.4; letter-spacing: .15em; text-transform: uppercase; }
.section h2 { margin: 0; font-family: "Arial Narrow", Arial, Helvetica, sans-serif; font-stretch: condensed; font-size: clamp(4rem, 9.2vw, 9.5rem); line-height: .82; letter-spacing: -.075em; text-transform: uppercase; }
.section-intro, .section-copy { align-self: end; max-width: 27rem; margin: 0; font-size: clamp(1rem, 1.45vw, 1.3rem); line-height: 1.45; }
.section-intro p { margin: 0 0 2rem; }
.button {
  display: inline-flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-width: min(100%, 15rem);
  padding: 1rem 1.15rem; border: 1px solid currentColor; background: transparent; color: inherit; text-decoration: none;
  text-transform: uppercase; font-size: .66rem; letter-spacing: .12em; cursor: pointer; transition: color .2s ease, background .2s ease;
}
.button--dark:hover, .button--dark:focus-visible { color: var(--signal); background: var(--ink); }
.button--light:hover, .button--light:focus-visible { color: var(--ink); background: var(--light); }
.button--dark.is-touch-active { color: var(--signal); background: var(--ink); }
.button--light.is-touch-active { color: var(--ink); background: var(--light); }
.sub-link { display: inline-block; margin-top: 1.2rem; font-size: .75rem; text-underline-offset: .25rem; }
.reveal-item { opacity: 0; filter: blur(5px); transform: translateY(2.5rem); transition: opacity .8s ease, filter .8s ease, transform .8s cubic-bezier(.2,.7,.2,1); }
.reveal-item.in-view { opacity: 1; filter: none; transform: none; }
.motion-heading { opacity: 1; translate: 0 0; }
.motion-heading .motion-word { display: inline-block; opacity: 0; filter: blur(7px); translate: -.72em 0; will-change: opacity, filter, translate; transition: opacity .52s ease, filter .62s ease, translate .72s cubic-bezier(.22,1,.36,1); transition-delay: calc(var(--motion-word) * 95ms); }
.motion-heading.in-view .motion-word { opacity: 1; filter: none; translate: 0 0; }
.motion-copy { opacity: 0; will-change: opacity, translate; transition: opacity .8s ease, translate 1s cubic-bezier(.22,1,.36,1); }
.motion-copy { translate: clamp(3.5rem, 7vw, 7rem) 0; }
.motion-copy.in-view { opacity: 1; translate: 0 0; }

.tour { color: var(--ink); background: var(--signal); }
.tour-list { border-top: 1px solid var(--line-light); }
.tour-more { display: contents; }
.tour-date { position: relative; isolation: isolate; display: grid; grid-template-columns: 8rem 1fr auto; align-items: center; gap: 2rem; min-height: 8.5rem; margin: 0 -1.25rem; padding: 0 1.25rem; border-bottom: 1px solid var(--line-light); transition: color .35s ease; }
.tour-date::before { content: ""; position: absolute; z-index: -1; inset: 0; background: var(--ink); transform: scaleX(0); transform-origin: right center; transition: transform .55s cubic-bezier(.22, 1, .36, 1); }
.tour-date time { display: flex; align-items: baseline; gap: .6rem; }
.tour-date time strong { font-size: clamp(2.3rem, 4vw, 4rem); line-height: 1; letter-spacing: -.06em; transition: transform .45s cubic-bezier(.22, 1, .36, 1); }
.tour-date time span, .tour-date p { font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; }
.tour-date h3 { margin: 0 0 .3rem; font-size: clamp(1.7rem, 3.2vw, 3.4rem); line-height: 1; letter-spacing: -.045em; text-transform: uppercase; transition: transform .45s cubic-bezier(.22, 1, .36, 1); }
.tour-date p { margin: 0; }
.terminal-text { font-family: "SFMono-Regular", "Roboto Mono", Consolas, "Liberation Mono", monospace; font-stretch: normal; font-variant-numeric: tabular-nums; letter-spacing: -.08em; perspective: 14rem; }
.terminal-char { position: relative; display: inline-grid; place-items: center; min-width: .62em; margin-right: .035em; overflow: hidden; border-radius: .055em; background: color-mix(in srgb, var(--ink) 13%, transparent); transform: translateZ(0); transform-origin: 50% 50%; }
.terminal-char::after { content: ""; position: absolute; z-index: 2; left: 0; right: 0; top: 50%; height: 1px; background: color-mix(in srgb, currentColor 26%, transparent); box-shadow: 0 1px 0 rgba(255,255,255,.08); pointer-events: none; }
.terminal-char.is-space { min-width: .34em; margin: 0; background: transparent; }
.terminal-char.is-space::after { display: none; }
.terminal-char.is-flipping { animation: split-flap .1s cubic-bezier(.35,0,.65,1) both; }
.tour-date > a { padding: .75rem 1rem; border: 1px solid transparent; border-radius: 999px; font-size: .7rem; letter-spacing: .12em; text-decoration: none; text-transform: uppercase; transition: border-color .3s ease, background .3s ease, color .3s ease; }
.tour-date > a span { display: inline-block; margin-left: .5rem; transition: transform .2s ease; }
.tour-date > a:hover span { transform: translate(.2rem, -.2rem); }
.tour-date:focus-within { color: var(--light); }
.tour-date:focus-within::before { transform: scaleX(1); transform-origin: left center; }
.tour-date:focus-within > a { border-color: rgba(255,255,255,.55); }
.tour-date.is-touch-active { color: var(--light); }
.tour-date.is-touch-active::before { transform: scaleX(1); transform-origin: left center; }
.tour-date.is-touch-active time strong { transform: translateX(.35rem) rotate(-3deg); }
.tour-date.is-touch-active h3 { transform: translateX(.75rem); }
@media (hover: hover) {
  .tour-date:hover { color: var(--light); }
  .tour-date:hover::before { transform: scaleX(1); transform-origin: left center; }
  .tour-date:hover time strong { transform: translateX(.35rem) rotate(-3deg); }
  .tour-date:hover h3 { transform: translateX(.75rem); }
  .tour-date:hover > a { border-color: rgba(255,255,255,.55); }
  .tour-date > a:hover { color: var(--ink); background: var(--light); }
}

@keyframes split-flap {
  0% { filter: brightness(1); transform: rotateX(0); }
  48% { filter: brightness(.42); transform: rotateX(-88deg); }
  52% { filter: brightness(.42); transform: rotateX(88deg); }
  100% { filter: brightness(1); transform: rotateX(0); }
}

.music { background: radial-gradient(circle at 70% 25%, color-mix(in srgb, var(--violet) 24%, transparent), transparent 38%), var(--black); }
.latest-release { display: grid; grid-template-columns: minmax(16rem, .72fr) 1.28fr; align-items: stretch; background: var(--release-bg); color: var(--light); }
.latest-release--divider { width: 100%; margin: 0; }
.latest-release__cover { min-height: 24rem; overflow: hidden; }
.latest-release__cover img { width: 100%; height: 100%; object-fit: cover; }
.latest-release__copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(2rem, 5vw, 5rem); }
.latest-release__copy .mini-label { color: rgba(245,246,238,.68); }
.latest-release__copy h2 { margin: 1rem 0 1.5rem; font-size: clamp(3.5rem, 8vw, 8rem); line-height: .84; letter-spacing: -.07em; text-transform: uppercase; }
.latest-release__copy > p:not(.mini-label) { max-width: 34rem; margin: 0 0 2rem; font-size: clamp(1rem, 1.4vw, 1.25rem); line-height: 1.55; }
.shorts { overflow: hidden; background: #111313; }
.shorts-head { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(18rem, .55fr); align-items: end; gap: clamp(2rem, 7vw, 8rem); margin-bottom: clamp(3rem, 6vw, 6rem); }
.shorts-head h2 { margin-top: 2rem; font-size: clamp(4rem, 9vw, 9rem); line-height: .8; letter-spacing: -.075em; text-transform: uppercase; }
.shorts-head > p { max-width: 30rem; margin: 0 0 .5rem; color: var(--muted-dark); font-size: clamp(1rem, 1.4vw, 1.25rem); line-height: 1.55; }
.shorts-rail { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: clamp(14rem, 18vw, 20rem); width: calc(100% + var(--section-x) * 2); margin-inline: calc(var(--section-x) * -1); padding-inline: var(--section-x); gap: clamp(.75rem, 1.4vw, 1.4rem); overflow-x: auto; overflow-y: hidden; overscroll-behavior-inline: contain; scroll-padding-inline: var(--section-x); scroll-snap-type: x proximity; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.shorts-rail::-webkit-scrollbar { display: none; }
.short-card { min-width: 0; scroll-snap-align: start; }
.short-card__media { position: relative; display: block; width: 100%; aspect-ratio: 9 / 16; padding: 0; overflow: hidden; border: 0; background: #000; color: var(--light); cursor: pointer; }
.short-card__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 58%, rgba(0,0,0,.52)); pointer-events: none; }
.short-card__media img { width: 100%; height: 100%; max-width: none; object-fit: cover; transition: transform .65s cubic-bezier(.22,1,.36,1), filter .4s ease; }
.short-card__media:hover img, .short-card__media:focus-visible img { transform: scale(1.035); filter: brightness(.84); }
.short-card__media:focus-visible { outline: 2px solid var(--signal); outline-offset: 3px; }
.short-card__play { position: absolute; z-index: 2; top: 50%; left: 50%; display: grid; place-items: center; width: clamp(3rem, 4.5vw, 4.5rem); aspect-ratio: 1; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; background: rgba(10,37,34,.72); backdrop-filter: blur(8px); transform: translate(-50%, -50%); transition: color .25s ease, background .25s ease, transform .25s ease; }
.short-card__play::before { content: ""; width: 0; height: 0; margin-left: .18rem; border-top: .48rem solid transparent; border-bottom: .48rem solid transparent; border-left: .72rem solid currentColor; }
.short-card__media:hover .short-card__play, .short-card__media:focus-visible .short-card__play { color: var(--ink); background: var(--signal); transform: translate(-50%, -50%) scale(1.06); }
.short-card__status { position: absolute; z-index: 2; right: .75rem; bottom: .75rem; display: inline-flex; align-items: center; padding: .45rem .55rem; background: rgba(10,37,34,.78); font-size: .54rem; letter-spacing: .1em; text-transform: uppercase; backdrop-filter: blur(8px); }
.short-card__copy { padding-top: 1rem; }
.short-card__copy span { color: var(--muted-dark); font-size: .58rem; letter-spacing: .11em; text-transform: uppercase; }
.short-card__copy h3 { margin: .45rem 0 0; font-size: clamp(1.15rem, 1.65vw, 1.75rem); line-height: 1; letter-spacing: -.04em; text-transform: uppercase; }
.shorts-note { margin: 2rem 0 0; color: var(--muted-dark); font-size: .62rem; letter-spacing: .06em; }
.chapter-reveal { position: relative; z-index: 3; height: 280svh; background: #050607; }
.chapter-reveal__stage { position: sticky; top: 0; width: 100%; height: 100svh; overflow: hidden; background: #050607; }
.chapter-reveal__panel { position: absolute; inset: 0; margin: 0; overflow: hidden; background: #050607; clip-path: inset(0); will-change: clip-path; }
.chapter-reveal__panel:nth-of-type(1) { z-index: 3; }
.chapter-reveal__panel:nth-of-type(2) { z-index: 2; }
.chapter-reveal__panel:nth-of-type(3) { z-index: 1; }
.chapter-reveal__panel > img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.chapter-reveal__panel:nth-of-type(1) > img { object-position: center 48%; }
.chapter-reveal__panel:nth-of-type(2) > img { object-position: center 62%; }
.chapter-reveal__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.12) 44%, rgba(0,0,0,.76)); }
.chapter-reveal__content { position: absolute; z-index: 2; right: var(--section-x); bottom: clamp(3rem, 8vh, 7rem); left: var(--section-x); color: var(--light); }
.chapter-reveal__content p { margin: 0 0 1.1rem; font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; }
.chapter-reveal__content a { display: flex; align-items: end; justify-content: space-between; gap: 2rem; text-decoration: none; }
.chapter-reveal__content strong { font-size: clamp(5rem, 14vw, 14rem); font-weight: 700; line-height: .72; letter-spacing: -.08em; text-transform: uppercase; }
.chapter-reveal__panel:last-of-type .chapter-reveal__content strong { display: block; font-size: clamp(3rem, 9vw, 9rem); line-height: .82; letter-spacing: -.065em; }
.chapter-reveal__content span { padding-bottom: .35rem; font-size: .7rem; letter-spacing: .11em; text-transform: uppercase; }
.chapter-reveal__dissolve { position: absolute; z-index: 10; inset: 0; pointer-events: none; }
.chapter-reveal__cell { position: absolute; display: grid; place-items: center; overflow: hidden; visibility: hidden; color: #faf1e2; background: var(--facts-orange); font-family: "SFMono-Regular", "Roboto Mono", Consolas, monospace; font-size: var(--cell-font); line-height: 1; }
.chapter-reveal__progress { position: absolute; z-index: 12; top: 50%; right: 1.2rem; width: 2px; height: min(28vh, 12rem); background: rgba(255,255,255,.28); transform: translateY(-50%); }
.chapter-reveal__progress span { display: block; width: 100%; height: 100%; background: var(--facts-orange); transform: scaleY(var(--chapter-progress, 0)); transform-origin: top; }
.music-layout { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(16rem, .7fr); gap: clamp(1.5rem, 4vw, 4rem); }
.spotify-player { display: grid; align-content: start; gap: 1rem; }
.spotify-player__title { padding-bottom: .5rem; }
.spotify-player__title h3 { margin: .45rem 0 0; font-size: clamp(2rem, 4vw, 4.5rem); line-height: .9; letter-spacing: -.055em; text-transform: uppercase; }
.spotify-player__title h3 span { display: block; margin-top: .55rem; color: var(--muted-dark); font-size: clamp(.85rem, 1.2vw, 1.1rem); line-height: 1; letter-spacing: .08em; }
.spotify-embed, .spotify-player iframe { display: block; width: 100%; height: 352px; border: 0; border-radius: .75rem; background: var(--surface-dark); }
.spotify-embed { overflow: hidden; }
.spotify-embed__load { display: grid; align-content: center; justify-items: center; gap: 1.15rem; width: 100%; height: 100%; padding: 2rem; border: 1px solid var(--line-dark); border-radius: inherit; background: linear-gradient(145deg, rgba(255,255,255,.035), transparent 55%), var(--surface-dark); color: var(--light); text-align: center; cursor: pointer; transition: color .2s ease, border-color .2s ease, background-color .2s ease; }
.spotify-embed__load:hover, .spotify-embed__load:focus-visible { color: var(--signal); border-color: var(--signal); outline: 0; }
.spotify-embed__play { position: relative; width: 3.5rem; height: 3.5rem; border: 1px solid currentColor; border-radius: 50%; }
.spotify-embed__play::after { content: ""; position: absolute; top: 50%; left: 53%; width: 0; height: 0; border-top: .48rem solid transparent; border-bottom: .48rem solid transparent; border-left: .72rem solid currentColor; transform: translate(-42%, -50%); }
.spotify-embed__load > span:last-child { display: grid; gap: .5rem; }
.spotify-embed__load strong { font-size: clamp(1.1rem, 2vw, 1.55rem); font-weight: normal; letter-spacing: -.02em; }
.spotify-embed__load small { color: var(--muted-dark); font-size: .68rem; letter-spacing: .04em; }
.spotify-player .sub-link { justify-self: start; color: var(--muted-dark); font-size: .65rem; letter-spacing: .08em; text-underline-offset: .25rem; text-transform: uppercase; }
.platforms { align-self: stretch; border-top: 1px solid var(--line-dark); }
.platforms .mini-label { padding: 1.25rem 0; color: var(--muted-dark); border-bottom: 1px solid var(--line-dark); }
.platforms a { position: relative; isolation: isolate; display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0 -1rem; padding: 1.35rem 1rem; overflow: hidden; border-bottom: 1px solid var(--line-dark); text-decoration: none; transition: color .3s ease; }
.platforms a::before { content: ""; position: absolute; z-index: -1; inset: 0; background: var(--signal); transform: scaleX(0); transform-origin: right center; transition: transform .5s cubic-bezier(.22,1,.36,1); }
.platforms a span { font-size: clamp(1.25rem, 2vw, 2rem); letter-spacing: -.03em; }
.platforms a b { font-weight: normal; transition: transform .2s ease; }
.platforms a:hover, .platforms a:focus-visible { color: var(--ink); }
.platforms a:hover::before, .platforms a:focus-visible::before { transform: scaleX(1); transform-origin: left center; }
.platforms a:hover b, .platforms a:focus-visible b { transform: translate(.2rem, -.2rem); }
.platforms a.is-touch-active { color: var(--ink); }
.platforms a.is-touch-active::before { transform: scaleX(1); transform-origin: left center; }
.music-history { margin-top: clamp(5rem, 10vw, 10rem); scroll-margin-top: 7rem; }
.timeline-head { display: grid; grid-template-columns: 1.2fr minmax(18rem, .65fr) auto; align-items: end; gap: clamp(2rem, 5vw, 6rem); margin-bottom: clamp(2.5rem, 5vw, 5rem); }
.timeline-head h3 { margin: 1.2rem 0 0; font-size: clamp(3rem, 6vw, 6rem); line-height: .88; letter-spacing: -.06em; text-transform: uppercase; }
.timeline-head > p { max-width: 27rem; margin: 0; color: var(--muted-dark); font-size: 1rem; line-height: 1.6; }
.timeline-controls { display: flex; gap: .6rem; }
.timeline-controls button { display: grid; place-items: center; width: 3.2rem; aspect-ratio: 1; border: 1px solid var(--line-dark); border-radius: 50%; background: transparent; color: var(--light); font-size: 1.1rem; cursor: pointer; transition: color .2s ease, background .2s ease, opacity .2s ease; }
.timeline-controls .icon-direction { margin: 0; }
.timeline-controls button:hover, .timeline-controls button:focus-visible { color: var(--ink); background: var(--light); }
.timeline-controls button:disabled { opacity: .25; cursor: default; }
.timeline-viewport { width: calc(100% + var(--section-x) * 2); margin-inline: calc(var(--section-x) * -1); padding-bottom: 1.25rem; overflow-x: auto; overflow-anchor: none; overscroll-behavior-inline: contain; scroll-behavior: auto; scroll-snap-type: none; scrollbar-width: none; }
.timeline-viewport::-webkit-scrollbar { display: none; }
.timeline-track { --rail-start: 50vw; --rail-end: clamp(1.25rem, 2.5vw, 2.5rem); position: relative; display: flex; width: max-content; margin: 0; padding: 0 var(--rail-end) 1rem var(--rail-start); list-style: none; }
.timeline-track::before { content: ""; position: absolute; top: 4.25rem; left: var(--rail-start); right: var(--rail-end); height: 1px; background: var(--line-dark); }
.timeline-item { position: relative; flex: 0 0 clamp(19rem, 29vw, 27rem); padding-right: clamp(1rem, 2.2vw, 2rem); }
.timeline-marker { position: relative; z-index: 1; display: grid; gap: 1.2rem; justify-items: start; height: 6rem; }
.timeline-marker time { color: var(--signal); font-size: 1.05rem; font-weight: 700; letter-spacing: .06em; }
.timeline-marker span { display: block; width: 1rem; aspect-ratio: 1; border: .25rem solid var(--black); border-radius: 50%; background: var(--signal); box-shadow: 0 0 0 1px var(--signal); }
.timeline-card { min-height: 21rem; padding: 0 clamp(1.5rem, 2.5vw, 2.5rem) 2rem 0; }
.timeline-cover { --cover-size: 13rem; --cover-angle: 0deg; width: min(100%, var(--cover-size)); margin: 0 0 1.6rem; transform: translate3d(var(--timeline-cover-shift, 0), var(--timeline-cover-lift, 0), 0) rotate(calc(var(--cover-angle) + var(--timeline-cover-turn, 0deg))) scale(var(--timeline-cover-scale, 1)); transform-origin: 50% 55%; will-change: transform; }
.timeline-cover--small { --cover-size: 11.7rem; }
.timeline-cover--medium { --cover-size: 12.6rem; }
.timeline-cover--large { --cover-size: 14rem; }
.timeline-cover--wide { --cover-size: 13.3rem; }
.timeline-cover--future { --cover-size: 12.8rem; --cover-angle: 6deg; }
.timeline-cover img { display: block; width: 100%; height: auto; }
.timeline-item:nth-child(1) .timeline-cover { --cover-angle: -4deg; }
.timeline-item:nth-child(2) .timeline-cover { --cover-angle: 3deg; }
.timeline-item:nth-child(3) .timeline-cover { --cover-angle: -7deg; }
.timeline-item:nth-child(4) .timeline-cover { --cover-angle: 1.5deg; }
.timeline-item:nth-child(5) .timeline-cover { --cover-angle: 6deg; }
.timeline-item:nth-child(6) .timeline-cover { --cover-angle: -2deg; }
.timeline-item:nth-child(7) .timeline-cover { --cover-angle: 4.5deg; }
.timeline-item:nth-child(8) .timeline-cover { --cover-angle: -5deg; }
.timeline-item:nth-child(9) .timeline-cover { --cover-angle: 4deg; }
.timeline-item:nth-child(10) .timeline-cover { --cover-angle: -3deg; }
.timeline-item:nth-child(3n + 2) .timeline-cover { margin-left: 6%; }
.timeline-item:nth-child(4n) .timeline-cover { margin-top: 1.1rem; }
.timeline-kicker { margin: 0 0 1.2rem; color: var(--signal); font-size: .62rem; letter-spacing: .11em; text-transform: uppercase; }
.timeline-card h4 { min-height: 2em; margin: 0 0 1.5rem; font-size: clamp(1.7rem, 2.7vw, 2.8rem); line-height: .98; letter-spacing: -.05em; }
.timeline-card > p:not(.timeline-kicker) { margin: 0; color: var(--muted-dark); font-size: .9rem; line-height: 1.65; }
.timeline-link { display: inline-block; margin-top: 1rem; color: var(--light); font-size: .65rem; letter-spacing: .08em; text-underline-offset: .25rem; text-transform: uppercase; transition: color .2s ease; }
.timeline-link:hover, .timeline-link:focus-visible { color: var(--signal); }
.timeline-item:nth-child(even) .timeline-card { padding-top: clamp(2rem, 5vw, 5rem); }
.timeline-item--chapter .timeline-marker time, .timeline-item--future .timeline-marker time { color: var(--signal); }
.timeline-progress { width: min(18rem, 46vw); height: 4px; margin: .85rem auto 0; overflow: hidden; border-radius: 999px; background: color-mix(in srgb, var(--signal) 18%, transparent); }
.timeline-progress span { display: block; width: 28%; height: 100%; border-radius: inherit; background: var(--signal); transform: translateX(calc(var(--timeline-progress, 0) * 257.142%)); will-change: transform; }

.story { --story-cream: #faf1e2; --story-blue: #263bbb; --story-pink: #ed176f; padding-bottom: 0; color: #15194e; background: var(--story-cream); }
.story-lead { display: grid; grid-template-columns: minmax(12rem, .7fr) 2.4fr; gap: 2rem; margin-bottom: clamp(4rem, 9vw, 8rem); }
.story .eyebrow { color: var(--story-pink); }
.story-lead h2 { grid-column: 2; color: var(--story-blue); }
.story-grid { display: grid; grid-template-columns: minmax(22rem, 1.12fr) minmax(20rem, .88fr); align-items: start; gap: clamp(2rem, 5vw, 6rem); }
section.story > .story-grid { translate: none; }
.story-image { position: relative; z-index: 1; align-self: end; margin-bottom: -1px; overflow: hidden; background: transparent; }
.story-image img { display: block; width: 100%; height: auto; object-fit: contain; object-position: center bottom; }
.story-copy { max-width: 43rem; }
.story-copy p { font-size: clamp(1rem, 1.5vw, 1.3rem); line-height: 1.6; }
.story-copy .story-copy__lead { margin-top: 0; font-size: clamp(1.75rem, 3vw, 3rem); line-height: 1.1; letter-spacing: -.04em; }
.facts { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0 calc(var(--section-x) * -1); color: var(--story-cream); background: var(--facts-orange); }
.facts div { padding: clamp(2rem, 4vw, 4.5rem) var(--section-x); border-right: 1px solid rgba(250, 241, 226, .24); }
.facts div:last-child { border-right: 0; }
.facts strong, .facts span { display: block; }
.facts strong { margin-bottom: .6rem; font-variant-numeric: tabular-nums; font-size: clamp(2rem, 4vw, 4.5rem); letter-spacing: -.06em; }
.facts span { font-size: .65rem; letter-spacing: .12em; text-transform: uppercase; }

@media (min-width: 981px) {
  .story-copy { padding-top: clamp(1.5rem, 2.5vw, 3rem); }
}

.social { position: relative; isolation: isolate; display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(3rem, 8vw, 10rem); color: var(--light); background: var(--black); }
.social-media { position: absolute; z-index: 0; inset: 0; overflow: hidden; translate: none !important; pointer-events: none; }
.social-video { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; background: var(--black); filter: saturate(.86) contrast(1.06) brightness(.86); }
.social-media__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4,15,14,.76), rgba(4,15,14,.54) 48%, rgba(4,15,14,.68)), repeating-linear-gradient(0deg, rgba(0,0,0,.22) 0 1px, rgba(255,255,255,.025) 1px 2px, transparent 2px 4px), radial-gradient(circle, rgba(255,255,255,.17) 0 .5px, transparent .7px) 0 0 / 4px 4px; }
.social-copy, .social-links { position: relative; z-index: 1; }
.social-copy h2 { position: relative; z-index: 2; margin-top: 3rem; color: #fff; mix-blend-mode: difference; }
.social-links { border-top: 1px solid var(--line-dark); }
.social-links a { position: relative; isolation: isolate; display: grid; grid-template-columns: 1fr 1.3fr auto; align-items: center; gap: 1rem; margin: 0 -1.2rem; padding: 1.7rem 1.2rem; border-bottom: 1px solid var(--line-dark); overflow: hidden; text-decoration: none; transition: color .3s ease; }
.social-links a::before { content: ""; position: absolute; z-index: -1; inset: 0; background: var(--signal); transform: scaleX(0); transform-origin: right center; transition: transform .5s cubic-bezier(.22,1,.36,1); }
.social-links a span { font-size: clamp(1.4rem, 2.5vw, 2.4rem); letter-spacing: -.04em; }
.social-links a b { font-size: .7rem; font-weight: normal; letter-spacing: .09em; text-transform: uppercase; }
.social-links a i { font-style: normal; transition: transform .2s ease; }
.social-links a:hover, .social-links a:focus-visible, .social-links a.is-touch-active { color: var(--ink); }
.social-links a:hover::before, .social-links a:focus-visible::before { transform: scaleX(1); transform-origin: left center; }
.social-links a:hover i, .social-links a:focus-visible i { transform: translate(.2rem, -.2rem); }
.social-links a.is-touch-active::before { transform: scaleX(1); transform-origin: left center; }

.newsletter { min-height: 85svh; display: grid; place-items: center; color: var(--ink); background: var(--newsletter-bg); text-align: center; }
.newsletter-inner { width: min(72rem, 100%); }
.newsletter h2 { margin: 2rem 0; }
.newsletter-inner > p:not(.eyebrow) { margin: 0 auto 3rem; font-size: clamp(1rem, 1.5vw, 1.3rem); }
#sib-form-container { margin-top: -5rem; padding-top: 5rem; }
.newsletter-form { width: min(48rem, 100%); margin: 0 auto; }
.newsletter-form__row { display: grid; grid-template-columns: minmax(0, 1fr) 11rem; align-items: end; gap: 1.25rem; }
.newsletter-form__field { min-width: 0; }
.newsletter-form__field > input { width: 100%; min-height: 4.5rem; padding: 0 1rem; border: 0; border-bottom: 1px solid var(--ink); background: transparent; color: var(--ink); border-radius: 0; outline: 0; box-shadow: none; transition: background-color .2s ease, box-shadow .2s ease; }
.newsletter-form__field > input:focus,
.newsletter-form__field > input:focus-visible { outline: 0; background: rgba(8, 41, 34, .06); box-shadow: inset 0 -2px 0 var(--ink); }
.newsletter-form__field > input::placeholder { color: rgba(8,8,8,.65); }
.newsletter-form__row > button { width: 100%; min-height: 4.5rem; border: 1px solid var(--ink); background: var(--ink); color: var(--light); text-transform: uppercase; font-size: .65rem; letter-spacing: .1em; cursor: pointer; }
.newsletter-form__row > button svg { width: .9rem; height: .9rem; margin-right: .45rem; fill: currentColor; animation: newsletter-spin .8s linear infinite; }
.newsletter-form__row > button:disabled { cursor: wait; opacity: .72; }
.sib-hide-loader-icon { display: none; }
.sib-form-message-panel { display: none; }
.sib-form-message-panel--active { display: block; }
.newsletter .form-status { max-width: 48rem; margin: 0 auto 1rem; padding: .85rem 1rem; border: 1px solid currentColor; text-align: left; }
.newsletter .entry__error { display: block; padding-top: .35rem; color: #721c14; font-size: .7rem; text-align: left; }
.newsletter .entry__error:empty { display: none; }
.brevo-honeypot { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; pointer-events: none !important; }
.newsletter .check input { accent-color: var(--ink); }
.check { display: flex; align-items: flex-start; gap: .7rem; margin-top: 1.15rem; text-align: left; font-size: .7rem; line-height: 1.45; }
.check input { flex: 0 0 auto; margin-top: .15rem; accent-color: var(--signal); }
.check button { display: inline; padding: 0; border: 0; background: transparent; color: inherit; text-decoration: underline; cursor: pointer; }
.form-status { min-height: 1.2rem; margin: 1rem 0 0; font-size: .72rem; }

@keyframes newsletter-spin { to { transform: rotate(360deg); } }

.contact { background: var(--black); }
.contact-head { display: grid; grid-template-columns: .7fr 2.3fr; gap: 2rem; margin-bottom: clamp(4rem, 9vw, 8rem); }
.contact-layout { display: grid; grid-template-columns: .85fr 1.15fr; align-items: start; gap: clamp(3rem, 8vw, 10rem); }
.contact-direct { border-top: 1px solid var(--line-dark); }
.contact-direct a { display: block; padding: 1.3rem 0; border-bottom: 1px solid var(--line-dark); text-decoration: none; }
.contact-direct span, .contact-direct strong { display: block; }
.contact-direct span { margin-bottom: .45rem; color: var(--muted-dark); font-size: .62rem; letter-spacing: .13em; text-transform: uppercase; }
.contact-direct strong { font-size: clamp(1rem, 1.6vw, 1.45rem); font-weight: normal; }
.contact-form { display: grid; gap: 1.5rem; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.contact-form > label, .field-row label, .contact-field { display: grid; gap: .55rem; }
.contact-form label > span, .contact-field > span { font-size: .65rem; letter-spacing: .11em; text-transform: uppercase; }
.contact-form input:not([type="checkbox"]), .contact-form textarea { width: 100%; padding: 1rem 0; border: 0; border-bottom: 1px solid var(--line-dark); border-radius: 0; background: transparent; color: var(--light); outline: 0; box-shadow: none; transition: background-color .2s ease, box-shadow .2s ease; }
.contact-form input:not([type="checkbox"]):focus,
.contact-form input:not([type="checkbox"]):focus-visible,
.contact-form textarea:focus,
.contact-form textarea:focus-visible { outline: 0; background: rgba(245, 246, 238, .035); box-shadow: inset 0 -2px 0 var(--signal); }
.contact-form textarea { resize: vertical; }
.custom-select { position: relative; }
.custom-select__trigger { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; min-height: 3.6rem; padding: 1rem 0; border: 0; border-bottom: 1px solid var(--line-dark); border-radius: 0; background: transparent; color: var(--light); text-align: left; cursor: pointer; }
.custom-select__trigger:focus-visible { outline: 2px solid var(--signal); outline-offset: 3px; }
.custom-select__trigger i { width: .55rem; height: .55rem; margin-right: .2rem; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: translateY(-.18rem) rotate(45deg); transition: transform .25s ease; }
.custom-select.is-open .custom-select__trigger i { transform: translateY(.18rem) rotate(225deg); }
.custom-select__menu { position: absolute; z-index: 30; top: calc(100% - 1px); left: 0; width: 100%; padding: .35rem; border: 1px solid var(--line-dark); background: var(--black); box-shadow: 0 1.25rem 3rem rgba(0,0,0,.28); }
.custom-select__menu button { display: block; width: 100%; padding: .85rem .9rem; border: 0; background: transparent; color: var(--light); text-align: left; cursor: pointer; transition: color .18s ease, background .18s ease; }
.custom-select__menu button:hover, .custom-select__menu button:focus-visible, .custom-select__menu button[aria-selected="true"] { background: var(--signal); color: var(--ink); outline: 0; }
.contact-form .check { display: flex; }
.contact-form .check span { font-size: .7rem; line-height: 1.45; letter-spacing: 0; text-transform: none; }
.contact-form .button { justify-self: start; }
.contact-form .button:disabled { cursor: wait; opacity: .68; }
.contact-honeypot { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; opacity: 0 !important; pointer-events: none !important; }
.contact-form .form-status[data-state="success"] { color: var(--signal); }
.contact-form .form-status[data-state="error"] { color: #ff9b8f; }

.parallax-media { --parallax-y: 0px; height: 112% !important; margin-top: -6%; transform: translate3d(0, var(--parallax-y), 0) scale(1.02); will-change: transform; }

.site-footer { position: sticky; z-index: 1; bottom: 0; height: clamp(30rem, 55svh, 38rem); min-height: 0; color: #fff; background: var(--footer-blue); }
.site-footer__stage { position: absolute; inset: 0; overflow: hidden; background: var(--footer-blue); }
.site-footer__content { position: absolute; z-index: 10; inset: 0; display: grid; grid-template-columns: 1fr; grid-template-rows: auto auto 1fr; align-content: stretch; gap: 1rem; padding: clamp(2.25rem, 4vw, 4rem) var(--section-x) max(1.5rem, env(safe-area-inset-bottom)); color: #fff; text-shadow: 0 1px 1rem rgba(0,0,0,.35); pointer-events: none; }
.site-footer__content a, .site-footer__content button { pointer-events: auto; }
.site-footer__logo { grid-column: 1; grid-row: 1; width: min(48vw, 38rem); }
.site-footer__logo img { width: 100%; }
.site-footer__nav { grid-column: 1; grid-row: 2; display: grid; grid-template-columns: repeat(2, max-content); justify-self: start; gap: .8rem 3rem; }
.site-footer__nav a, .site-footer__nav button, .site-footer__copyright { font-size: .65rem; letter-spacing: .11em; text-transform: uppercase; }
.site-footer__nav a { text-decoration: none; }
.site-footer__nav button { padding: 0; border: 0; background: transparent; color: inherit; text-align: left; cursor: pointer; }
.site-footer__copyright { position: absolute; z-index: 10; right: var(--section-x); bottom: max(1.5rem, env(safe-area-inset-bottom)); margin: 0; color: #fff; text-shadow: 0 1px 1rem rgba(0,0,0,.35); }
.footer-motion { position: absolute; z-index: 1; top: clamp(.75rem, 2vw, 1.5rem); right: 0; bottom: 0; left: 0; overflow: hidden; cursor: ns-resize; touch-action: pan-y; }
.footer-motion__slide { position: absolute; left: 0; bottom: 0; overflow: hidden; border: 0; background: var(--ink); backface-visibility: hidden; contain: layout paint; will-change: transform, width, height; }
.footer-motion__slide img { position: absolute; inset: -1px; display: block; width: calc(100% + 2px); height: calc(100% + 2px); max-width: none; border: 0; outline: 0; box-shadow: none; object-fit: cover; pointer-events: none; }

.mobile-nav { position: fixed; z-index: 190; inset: 0; padding: 7rem 1.25rem 2rem; background: var(--black); overflow: auto; visibility: hidden; transform: translate3d(0,-100%,0); }
.mobile-nav[hidden] { display: none; }
.mobile-nav.is-open { visibility: visible; animation: mobile-menu-in .65s cubic-bezier(.22,1,.36,1) forwards; }
.mobile-nav.is-closing { visibility: visible; animation: mobile-menu-out .55s cubic-bezier(.64,0,.78,0) forwards; }
.mobile-nav a { display: block; padding: .9rem 0; border-bottom: 1px solid #333; font-size: clamp(1.8rem, 8vw, 3rem); line-height: 1; text-decoration: none; text-transform: uppercase; opacity: 0; transform: translate3d(0,-1.5rem,0); }
.mobile-nav.is-open a { animation: mobile-menu-link-in .48s cubic-bezier(.22,1,.36,1) forwards; }
.mobile-nav.is-closing a { opacity: 1; transform: none; animation: mobile-menu-link-out .25s ease forwards; }
.mobile-nav.is-open a:nth-child(1) { animation-delay: .16s; }
.mobile-nav.is-open a:nth-child(2) { animation-delay: .23s; }
.mobile-nav.is-open a:nth-child(3) { animation-delay: .30s; }
.mobile-nav.is-open a:nth-child(4) { animation-delay: .37s; }
.mobile-nav.is-open a:nth-child(5) { animation-delay: .44s; }
.mobile-nav.is-open a:nth-child(6) { animation-delay: .51s; }
.mobile-nav.is-open a:nth-child(7) { animation-delay: .58s; }
.mobile-nav.is-closing a:nth-child(7) { animation-delay: 0s; }
.mobile-nav.is-closing a:nth-child(6) { animation-delay: .04s; }
.mobile-nav.is-closing a:nth-child(5) { animation-delay: .08s; }
.mobile-nav.is-closing a:nth-child(4) { animation-delay: .12s; }
.mobile-nav.is-closing a:nth-child(3) { animation-delay: .16s; }
.mobile-nav.is-closing a:nth-child(2) { animation-delay: .20s; }
.mobile-nav.is-closing a:nth-child(1) { animation-delay: .24s; }
.mobile-nav .mobile-nav__ticket { margin-top: 2rem; border: 1px solid var(--light); padding: 1rem; font-size: .8rem; letter-spacing: .12em; }

@keyframes mobile-menu-in { from { transform: translate3d(0,-100%,0); } to { transform: translate3d(0,0,0); } }
@keyframes mobile-menu-out { from { transform: translate3d(0,0,0); } to { transform: translate3d(0,-100%,0); } }
@keyframes mobile-menu-link-in { from { opacity: 0; transform: translate3d(0,-1.5rem,0); } to { opacity: 1; transform: translate3d(0,0,0); } }
@keyframes mobile-menu-link-out { from { opacity: 1; transform: translate3d(0,0,0); } to { opacity: 0; transform: translate3d(0,-1rem,0); } }

dialog { color: inherit; }
dialog::backdrop { background: rgba(0,0,0,.86); backdrop-filter: blur(8px); }
.dialog-close { position: absolute; z-index: 2; top: 1rem; right: 1rem; width: 2.5rem; aspect-ratio: 1; border: 1px solid currentColor; border-radius: 50%; background: transparent; font-size: 1.4rem; cursor: pointer; }
.legal-dialog { width: min(92vw, 48rem); max-height: 88svh; padding: clamp(2rem, 5vw, 5rem); border: 1px solid var(--line-dark); background: var(--surface-deep); line-height: 1.6; }
.legal-dialog h2 { margin: 1rem 0 2rem; overflow-wrap: anywhere; font-size: clamp(2rem, 10vw, 6rem); line-height: .9; letter-spacing: -.06em; text-transform: uppercase; }
.legal-dialog a { text-underline-offset: .2rem; }
.credits-dialog { width: min(92vw, 56rem); padding: clamp(2rem, 4vw, 3.5rem); }
.credits-dialog h2 { margin-bottom: 1.5rem; font-size: clamp(3rem, 7vw, 5.25rem); }
.credits-dialog__intro { max-width: 42rem; margin: 0 0 1.5rem; font-size: clamp(1rem, 1.6vw, 1.25rem); line-height: 1.5; }
.credits-dialog__intro span { display: block; margin-top: .25em; }
.credits-list { margin: 0; padding: 0; border-top: 1px solid var(--line-dark); list-style: none; }
.credits-list li { border-bottom: 1px solid var(--line-dark); }
.credits-list a { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1rem; margin: 0 -.8rem; padding: .75rem .8rem; text-decoration: none; transition: color .35s ease; }
.credits-list a::before { content: ""; position: absolute; z-index: -1; inset: 0; background: var(--signal); transform: scaleX(0); transform-origin: right center; transition: transform .55s cubic-bezier(.22, 1, .36, 1); }
.credits-list a:hover, .credits-list a:focus-visible { color: var(--ink); outline: 0; }
.credits-list a:hover::before, .credits-list a:focus-visible::before { transform: scaleX(1); transform-origin: left center; }
.credits-person strong, .credits-person small { display: block; }
.credits-person strong { font-size: clamp(1rem, 1.8vw, 1.3rem); font-weight: 600; line-height: 1.2; }
.credits-person small { margin-top: .35rem; color: var(--muted-dark); font-size: .7rem; letter-spacing: .08em; transition: color .35s ease; }
.credits-list a:hover small, .credits-list a:focus-visible small { color: color-mix(in srgb, var(--ink) 70%, transparent); }
.credits-list i { font-style: normal; font-size: 1.25rem; transition: transform .18s ease; }
.credits-list a:hover i, .credits-list a:focus-visible i { transform: translate3d(.2rem, -.2rem, 0); }
.credits-list__web { margin-top: .75rem; border-top: 1px solid var(--line-dark); }

@media (max-width: 980px) {
  .site-header { grid-template-columns: auto 1fr auto; }
  .site-nav { display: none; }
  .header-ticket { justify-self: end; }
  .menu-button { display: grid; grid-template-columns: auto 1.5rem; align-items: center; gap: .15rem .7rem; font-size: .65rem; letter-spacing: .12em; text-transform: uppercase; opacity: 0; }
  .menu-button span { grid-row: 1 / 3; }
  .menu-button i { display: block; width: 1.5rem; height: 1px; background: currentColor; transition: transform .2s ease; }
  .site-header.is-menu-open .menu-button i:first-of-type { transform: translateY(3px) rotate(45deg); }
  .site-header.is-menu-open .menu-button i:last-of-type { transform: translateY(-3px) rotate(-45deg); }
  .section-head { grid-template-columns: .65fr 1.35fr; }
  .section-head .section-intro, .section-head .section-copy { grid-column: 2; }
  .music-layout { grid-template-columns: 1fr; }
  .platforms { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 2rem; }
  .platforms .mini-label { grid-column: 1 / -1; }
  .shorts-head { grid-template-columns: 1fr; }
  .shorts-head > p { max-width: 40rem; }
  .shorts-rail { grid-auto-columns: min(62vw, 20rem); }
  .social { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .reveal { height: 100svh; }
  .site-header { grid-template-columns: auto 1fr; padding: 1rem; }
  .site-header__brand { width: 7.2rem; }
  .header-ticket { display: none; }
  .menu-button { justify-self: end; }
  .intro-simple::before { opacity: .3; }
  .hero-fluid { opacity: .78; }
  .hero-draw-zone { bottom: max(9rem, calc(env(safe-area-inset-bottom) + 7.5rem)); touch-action: none; }
  .hero-video-logo { top: 43%; width: min(88vw, 42rem); }
  .intro-end { bottom: max(2.25rem, calc(env(safe-area-inset-bottom) + 1.35rem)); }
  .intro-end__claim { font-size: clamp(.92rem, 4.1vw, 1.18rem); }
  .chapter-reveal { height: 240svh; }
  .chapter-reveal__content { right: 1.2rem; bottom: max(2rem, calc(env(safe-area-inset-bottom) + 1.5rem)); left: 1.2rem; }
  .chapter-reveal__content a { display: block; }
  .chapter-reveal__content strong { display: block; margin-bottom: 1.2rem; font-size: clamp(4.5rem, 25vw, 8rem); }
  .chapter-reveal__content span { display: block; padding: 0; }
  .chapter-reveal__panel:nth-of-type(2) > img { object-position: center 62%; }
  .chapter-reveal__progress { right: .6rem; }
  .section { padding-top: 5.5rem; padding-bottom: 5.5rem; }
  .section-head, .story-lead, .contact-head { grid-template-columns: 1fr; gap: 2rem; }
  .section-head .section-intro, .section-head .section-copy { grid-column: auto; }
  .story-lead h2 { grid-column: auto; }
  .section h2 { font-size: clamp(3.6rem, 18vw, 6.4rem); }
  .music .section-head h2 { max-width: 100%; font-size: clamp(2.9rem, 12.5vw, 3.3rem); line-height: .86; }
  .music .section-copy { max-width: 100%; font-size: 1rem; overflow-wrap: anywhere; }
  .music h2.motion-heading,
  .music .section-copy.motion-copy { translate: 0 0; }
  .tour-date { grid-template-columns: 3.75rem minmax(0, 1fr); gap: .7rem; min-height: 7rem; }
  .tour-date time { display: block; }
  .tour-date time strong { display: block; font-size: 2.3rem; }
  .tour-date time span { font-size: .56rem; }
  .tour-date h3 { max-width: 100%; font-size: clamp(1.22rem, 5.65vw, 1.7rem); white-space: nowrap; }
  .tour-date p { font-size: .58rem; line-height: 1.35; }
  .tour-date > a { position: absolute; z-index: 4; inset: 0; padding: 0; border: 0; border-radius: 0; font-size: 0; }
  .tour-date::before,
  .social-links a::before,
  .platforms a::before { transition-duration: .62s; }
  a.button { transition-duration: .35s; }
  .tour-date > a:hover,
  .tour-date > a:focus,
  .tour-date > a:focus-visible,
  .tour-date > a:active,
  .tour-date > a.is-touch-active { background: transparent; color: inherit; outline: 0; }
  .tour-date:focus-within:not(.is-touch-active) { color: var(--ink); }
  .tour-date:focus-within:not(.is-touch-active)::before { transform: scaleX(0); transform-origin: right center; }
  .tour-date:focus-within > a { border-color: transparent; }
  .tour-date > a span,
  .newsletter-form__row > button span,
  .social-links a i,
  .platforms a b { display: none; }
  .tour-date > a,
  .social-links a,
  .platforms a,
  a.button,
  .header-ticket,
  .mobile-nav__ticket { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; touch-action: pan-y; }
  .tour-date > a { -webkit-tap-highlight-color: transparent; }
  .latest-release { grid-template-columns: 1fr; }
  .latest-release__cover { min-height: auto; aspect-ratio: 1; }
  .shorts-head h2 { margin-top: 1.5rem; font-size: clamp(3.6rem, 18vw, 5.5rem); }
  .shorts-rail { grid-auto-columns: min(76vw, 19rem); }
  .shorts-note { max-width: 18rem; line-height: 1.5; }
  .platforms { grid-template-columns: 1fr; }
  .timeline-head { grid-template-columns: 1fr; }
  .timeline-head > p { max-width: 100%; }
  .timeline-controls { justify-self: end; }
  .timeline-item { flex-basis: min(82vw, 22rem); }
  .timeline-card { min-height: 22rem; }
  .story-grid { grid-template-columns: 1fr; }
  .story { padding-bottom: 0; }
  .story-image { width: calc(100% + var(--section-x)); margin-left: calc(var(--section-x) * -1); }
  .story-copy { padding-bottom: clamp(3rem, 10vw, 6rem); }
  .facts { grid-template-columns: repeat(2, 1fr); }
  .facts div:nth-child(2) { border-right: 0; }
  .facts div:nth-child(-n+2) { border-bottom: 1px solid rgba(250, 241, 226, .24); }
  .social-links a { grid-template-columns: minmax(0, 1fr); }
  .social-links a b { display: none; }
  .newsletter { min-height: 0; place-items: stretch; text-align: left; }
  .newsletter-inner { width: 100%; }
  .newsletter h2 { max-width: 100%; margin: 1.5rem 0; font-size: clamp(3rem, 13.4vw, 4rem); line-height: .84; overflow-wrap: normal; }
  .newsletter-inner > p:not(.eyebrow) { max-width: 28rem; margin: 0 0 2.5rem; font-size: 1rem; line-height: 1.45; }
  .newsletter-form { width: 100%; }
  .newsletter-form__row { grid-template-columns: minmax(0, 1fr); gap: .8rem; }
  .newsletter-form__field > input { min-width: 0; padding-inline: 0; font-size: 1rem; }
  .newsletter-form__row > button { min-height: 4rem; }
  .newsletter .check { gap: .85rem; font-size: .82rem; line-height: 1.45; }
  .field-row, .contact-layout { grid-template-columns: 1fr; }
  .contact { padding-bottom: 0; }
  .contact-form .button { justify-self: stretch; width: calc(100% + var(--section-x) * 2); min-height: 6.5rem; margin: .5rem calc(var(--section-x) * -1) 0; padding-inline: var(--section-x); border: 0; background: var(--surface-dark); justify-content: flex-start; font-size: .78rem; }
  .contact-form .form-status:empty { display: none; }
  .site-footer { position: relative; bottom: auto; height: auto; min-height: 0; background: #111313; }
  .site-footer__stage { position: relative; inset: auto; display: flex; flex-direction: column; overflow: hidden; background: #111313; }
  .site-footer__content { position: relative; inset: auto; order: 1; display: grid; grid-template-columns: 1fr; grid-template-rows: auto auto; gap: 1rem; padding: 1.8rem var(--section-x) 1rem; background: #111313; }
  .site-footer__logo { grid-column: 1; grid-row: 1; width: 100%; }
  .site-footer__nav { grid-column: 1; grid-row: 2; grid-template-columns: repeat(3, minmax(0, 1fr)); justify-content: stretch; gap: .75rem .8rem; }
  .site-footer__nav a, .site-footer__nav button { font-size: .62rem; white-space: nowrap; }
  .credits-dialog { padding: 2rem 1.25rem 1.5rem; }
  .credits-dialog h2 { margin-bottom: 1.5rem; font-size: clamp(2.25rem, 11.5vw, 3.25rem); }
  .credits-dialog__intro { margin-bottom: 1.5rem; padding-right: 1.5rem; }
  .credits-list a { gap: .8rem; margin-inline: -.55rem; padding: .8rem .55rem; }
  .credits-person strong { font-size: 1rem; }
  .footer-motion { position: relative; inset: auto; order: 2; display: flex; width: 100%; height: min(82vw, 22rem); margin-top: 0; overflow-x: auto; overflow-y: hidden; cursor: ew-resize; touch-action: pan-x; overscroll-behavior-inline: contain; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .footer-motion::-webkit-scrollbar { display: none; }
  .footer-motion__slide { position: relative; inset: auto; flex: 0 0 min(66vw, 19rem); width: auto !important; height: 100% !important; transform: none !important; scroll-snap-align: start; contain: layout paint; will-change: auto; }
  .footer-motion__slide img { object-position: center; }
  .site-footer__copyright { position: relative; inset: auto; order: 3; margin: 0; padding: 1rem var(--section-x) max(1rem, env(safe-area-inset-bottom)); background: #111313; text-shadow: none; }
}

@media (max-width: 760px) and (orientation: portrait) {
  .spotify-embed, .spotify-player iframe { height: 152px; }
  .spotify-embed__load { grid-template-columns: auto 1fr; justify-items: start; gap: 1rem; padding: 1.25rem; text-align: left; }
  .spotify-embed__play { width: 2.75rem; height: 2.75rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { height: 100svh; }
  .chapter-reveal { height: auto; }
  .chapter-reveal__stage { position: relative; height: auto; overflow: visible; }
  .chapter-reveal__panel { position: relative; height: 72svh; clip-path: none !important; will-change: auto; }
  .chapter-reveal__dissolve, .chapter-reveal__progress { display: none; }
  .reveal-item { opacity: 1; transform: none; transition: none; }
  .motion-heading, .motion-copy { opacity: 1; translate: none; transition: none; }
  .motion-heading .motion-word { opacity: 1; filter: none; translate: none; transition: none; }
  .section > :not(.facts) { translate: none; }
  .terminal-char { transform: none; transition: none; }
  .terminal-char.is-flipping { animation: none; }
  .footer-motion__slide { will-change: auto; }
  .parallax-media { height: 100% !important; margin-top: 0; transform: none !important; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
