html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent
}

body {
    margin: 0;
    background: var(--color-ink);
    color: var(--color-bone);
    font-family: "Aeonik", "Hanken Grotesk", system-ui, sans-serif;
    -webkit-font-smoothing: antialiased
}

[x-cloak] {
    display: none !important
}

.hero-scrim {
    background: linear-gradient(90deg, var(--color-ink) 0%, color-mix(in srgb, var(--color-ink) 60%, transparent) 10%, transparent 34%),
    linear-gradient(0deg, var(--color-ink) 0%, transparent 30%)
}

@media (max-width: 1023px) {
    .hero-scrim {
        background: linear-gradient(0deg, var(--color-ink) 0%, transparent 50%)
    }
}

.glow-tickets {
    background-image: radial-gradient(ellipse 60% 50% at 10% 20%, color-mix(in srgb, var(--color-brand) 14%, transparent), transparent 70%)
}

.glow-venue {
    background-image: radial-gradient(ellipse 50% 60% at 72% 55%, color-mix(in srgb, var(--color-brand) 22%, transparent), transparent 70%)
}

.glow-cta {
    background-image: radial-gradient(ellipse 55% 45% at 50% 0%, color-mix(in srgb, var(--color-brand) 35%, transparent), transparent 70%)
}

.venue-lines {
    background-image: linear-gradient(115deg, transparent 49.8%, color-mix(in srgb, var(--color-brand) 35%, transparent) 50%, transparent 50.2%),
    linear-gradient(35deg, transparent 49.8%, color-mix(in srgb, var(--color-brand) 25%, transparent) 50%, transparent 50.2%)
}

.venue-map {
    transform-style: preserve-3d;
    will-change: transform;
    transform: rotateX(calc(var(--t) * 54deg)) rotateZ(calc(var(--t) * -26deg)) scale(calc(0.86 + var(--t) * 0.12))
}

.venue-map-img {
    mix-blend-mode: lighten;
    filter: invert(1) grayscale(1) sepia(1) saturate(7) hue-rotate(-42deg) brightness(1.05)
}

.venue-map-floor {
    transform: translateZ(calc(var(--t) * 70px))
}

.venue-map-stage {
    transform: translateZ(calc(var(--t) * 110px))
}

.cta-slice {
    will-change: transform;
    opacity: calc(0.3 + var(--e) * 0.7);
    transform: translate(calc((1 - var(--e)) * var(--dx)), calc((1 - var(--e)) * var(--dy)))
}

.map-zone {
    cursor: pointer;
    transition: opacity .2s
}