/* ============================================
   PLATINUM PLUS — Real Hip Hop Culture Festival
   ============================================ */

:root {
  --bg: #0a0908;
  --bg-2: #14110f;
  --bg-3: #1c1814;
  --ink: #f5f1e8;
  --ink-dim: #8a857c;
  --ink-mid: #b8b2a6;
  --gold: #d4a84a;
  --gold-bright: #f3cf63;
  --gold-deep: #8a6a22;
  --silver: #cdc8c0;
  --silver-deep: #6e6a62;
  --red: #c8362a;

  --display: "Anton", "Archivo Black", Impact, sans-serif;
  --marker: "Permanent Marker", "Caveat Brush", cursive;
  --body: "Space Grotesk", system-ui, sans-serif;
  --mono: "JetBrains Mono", "IBM Plex Mono", monospace;

  --maxw: 1480px;
  --pad: clamp(20px, 4vw, 64px);
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; }

body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--body);
  font-size: 16px;
  line-height: 1.5;
  overflow-x: hidden;
  position: relative;
}

/* Global grain */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 1000;
  opacity: 0.18;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.7 0'/></filter><rect width='200' height='200' filter='url(%23n)'/></svg>");
  mix-blend-mode: overlay;
}

/* Selection */
::selection { background: var(--gold); color: var(--bg); }

/* Scrollbar */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: var(--gold-deep); }
::-webkit-scrollbar-thumb:hover { background: var(--gold); }

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: 0; background: 0; color: inherit; }

/* ============================================
   UTILITIES
   ============================================ */

.container {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 var(--pad);
}

.eyebrow {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gold);
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.eyebrow::before {
  content: "";
  width: 28px;
  height: 1px;
  background: var(--gold);
}

.section-title {
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(56px, 9vw, 160px);
  line-height: 0.85;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: var(--ink);
}
.section-title .gold { color: var(--gold); }
.section-title .outline {
  -webkit-text-stroke: 1.5px var(--ink);
  color: transparent;
}

.mono { font-family: var(--mono); }
.marker { font-family: var(--marker); }

.btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 18px 28px;
  background: var(--gold);
  color: var(--bg);
  font-family: var(--display);
  font-size: 20px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  border: 2px solid var(--gold);
  transition: all 0.25s cubic-bezier(.2,.7,.2,1);
  position: relative;
  overflow: hidden;
}
.btn::after {
  content: "→";
  transition: transform 0.25s ease;
}
.btn:hover { background: var(--gold-bright); transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--bg-2), 6px 6px 0 1px var(--gold); }
.btn:hover::after { transform: translateX(6px); }

.btn--ghost {
  background: transparent;
  color: var(--ink);
  border-color: var(--ink);
}
.btn--ghost:hover { background: var(--ink); color: var(--bg); box-shadow: 6px 6px 0 var(--bg-2), 6px 6px 0 1px var(--ink); }

.tag {
  display: inline-block;
  padding: 6px 12px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  border: 1px solid var(--silver-deep);
  color: var(--silver);
  border-radius: 999px;
}

/* ============================================
   NAV
   ============================================ */

.nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  padding: 18px var(--pad);
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: background 0.3s, backdrop-filter 0.3s, border-color 0.3s;
  border-bottom: 1px solid transparent;
}
.nav.scrolled {
  background: rgba(10, 9, 8, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom-color: rgba(212, 168, 74, 0.2);
}
.nav__brand {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.nav__brand-logo {
  display: block;
  height: 78px;
  width: auto;
  transition: height 0.35s cubic-bezier(.2,.7,.2,1), transform 0.3s ease, filter 0.3s ease;
  filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.6));
}
.nav.scrolled .nav__brand-logo {
  height: 48px;
}
.nav__brand:hover .nav__brand-logo {
  transform: rotate(-2deg) scale(1.04);
}
.nav__brand-mark {
  width: 36px; height: 36px;
  display: grid; place-items: center;
  background: var(--gold);
  color: var(--bg);
  font-family: var(--display);
  font-size: 18px;
  line-height: 1;
  transform: rotate(-4deg);
  border: 2px solid var(--bg);
  box-shadow: 0 0 0 1px var(--gold);
}
.nav__brand-text small {
  display: block;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.3em;
  color: var(--gold);
  margin-top: 2px;
  font-weight: 400;
}
.nav__links {
  display: flex;
  gap: 32px;
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.nav__links a {
  position: relative;
  padding: 6px 0;
  transition: color 0.2s;
}
.nav__links a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--gold);
  transition: width 0.25s ease;
}
.nav__links a:hover { color: var(--gold); }
.nav__links a:hover::after { width: 100%; }

.nav__cta {
  padding: 10px 18px;
  background: var(--gold);
  color: var(--bg);
  font-family: var(--display);
  font-size: 14px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition: all 0.2s;
}
.nav__cta:hover { background: var(--gold-bright); transform: translateY(-1px); }

.nav__burger {
  display: none;
  flex-direction: column;
  gap: 5px;
  width: 32px;
}
.nav__burger span {
  height: 2px;
  background: var(--ink);
}

/* ============================================
   HERO
   ============================================ */

.hero {
  min-height: 100vh;
  padding-top: 100px;
  padding-bottom: 60px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
}

.hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
.hero__bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 20% 80%, rgba(212, 168, 74, 0.18), transparent 60%),
    radial-gradient(ellipse at 80% 20%, rgba(200, 54, 42, 0.12), transparent 50%),
    var(--bg);
}
.hero__bg-graffiti {
  position: absolute;
  inset: -10% -5%;
  opacity: 0.04;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600'><text x='10' y='80' font-family='cursive' font-size='80' fill='%23fff' transform='rotate(-12 10 80)'>SCRATCH</text><text x='80' y='220' font-family='cursive' font-size='100' fill='%23fff' transform='rotate(6 80 220)'>BOOM BAP</text><text x='30' y='360' font-family='cursive' font-size='90' fill='%23fff' transform='rotate(-3 30 360)'>NAPOLI</text><text x='100' y='500' font-family='cursive' font-size='110' fill='%23fff' transform='rotate(8 100 500)'>REAL HIP HOP</text></svg>");
  background-size: 700px;
  background-repeat: repeat;
  filter: blur(0.3px);
}

.hero__container {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 var(--pad);
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 60px;
  align-items: center;
}

.hero__left { position: relative; }

.hero__meta-top {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 32px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  color: var(--gold);
}
.hero__meta-top .dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--red);
  box-shadow: 0 0 12px var(--red);
  animation: pulse 2s infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(1.3); }
}

.hero__title {
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(72px, 14vw, 240px);
  line-height: 0.82;
  letter-spacing: -0.03em;
  text-transform: uppercase;
}
.hero__title-row {
  display: block;
  overflow: hidden;
}
.hero__title-row span {
  display: inline-block;
  animation: dropIn 0.9s cubic-bezier(.2,.8,.2,1) backwards;
}
.hero__title-row:nth-child(1) span { animation-delay: 0.15s; }
.hero__title-row:nth-child(2) span { animation-delay: 0.3s; }
@keyframes dropIn {
  from { transform: translateY(110%) rotate(2deg); opacity: 0; }
  to { transform: translateY(0) rotate(0); opacity: 1; }
}

.hero__title .word--platinum {
  color: var(--ink);
  background: linear-gradient(180deg, #f5f1e8 0%, #cdc8c0 40%, #6e6a62 60%, #cdc8c0 90%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.hero__title .word--plus {
  color: var(--gold);
  background: linear-gradient(180deg, #f3cf63 0%, #d4a84a 40%, #8a6a22 60%, #d4a84a 90%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  position: relative;
}
.hero__title .word--plus::after {
  content: "";
  position: absolute;
  right: -4%;
  top: 0;
  bottom: 0;
  width: 8px;
  background: var(--gold);
  opacity: 0;
  animation: blink 1.2s infinite 1.5s;
}
@keyframes blink {
  0%, 50% { opacity: 1; }
  51%, 100% { opacity: 0; }
}

.hero__subtitle {
  font-family: var(--marker);
  font-size: clamp(22px, 3vw, 38px);
  color: var(--ink);
  margin-top: 20px;
  letter-spacing: 0.02em;
  opacity: 0;
  animation: fadeUp 0.8s 0.7s forwards;
  transform: rotate(-2deg);
  display: inline-block;
}
.hero__subtitle .gold { color: var(--gold); }

.hero__details {
  margin-top: 48px;
  display: flex;
  flex-wrap: wrap;
  gap: 28px 48px;
  align-items: center;
  opacity: 0;
  animation: fadeUp 0.8s 0.9s forwards;
}
.hero__detail {
  display: flex;
  flex-direction: column;
}
.hero__detail-label {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.25em;
  color: var(--ink-dim);
  text-transform: uppercase;
  margin-bottom: 6px;
}
.hero__detail-value {
  font-family: var(--display);
  font-size: 24px;
  letter-spacing: 0.02em;
  line-height: 1;
  text-transform: uppercase;
}

.hero__cta {
  margin-top: 48px;
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  opacity: 0;
  animation: fadeUp 0.8s 1.1s forwards;
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Hero right - Countdown */
.hero__right {
  display: flex;
  flex-direction: column;
  gap: 24px;
  opacity: 0;
  animation: fadeUp 0.8s 1.3s forwards;
}

.countdown {
  border: 1px solid rgba(212, 168, 74, 0.3);
  background: linear-gradient(180deg, rgba(212, 168, 74, 0.06), rgba(212, 168, 74, 0));
  padding: 32px;
  position: relative;
}
.countdown::before, .countdown::after {
  content: "";
  position: absolute;
  width: 16px; height: 16px;
  border: 2px solid var(--gold);
}
.countdown::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
.countdown::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }

.countdown__label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.25em;
  color: var(--gold);
  margin-bottom: 16px;
  text-transform: uppercase;
  display: flex;
  justify-content: space-between;
}
.countdown__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.countdown__cell {
  text-align: center;
  border-top: 1px solid rgba(212, 168, 74, 0.2);
  padding-top: 12px;
}
.countdown__num {
  font-family: var(--display);
  font-size: clamp(38px, 5vw, 64px);
  line-height: 0.9;
  color: var(--ink);
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.countdown__unit {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.25em;
  color: var(--ink-dim);
  text-transform: uppercase;
  margin-top: 6px;
}

.hero__flyer-mini {
  position: relative;
  border: 1px solid rgba(212, 168, 74, 0.2);
  padding: 8px;
  background: var(--bg-2);
  transform: rotate(2deg);
  transition: transform 0.4s ease;
}
.hero__flyer-mini:hover { transform: rotate(0deg) scale(1.02); }
.hero__flyer-mini img {
  width: 100%;
  filter: contrast(1.05);
}
.hero__flyer-tag {
  position: absolute;
  top: -14px;
  left: 16px;
  background: var(--red);
  color: var(--ink);
  padding: 4px 10px;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.hero__scroll {
  position: absolute;
  bottom: 28px;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.25em;
  color: var(--ink-dim);
  text-transform: uppercase;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  z-index: 3;
}
.hero__scroll::after {
  content: "";
  width: 1px;
  height: 40px;
  background: linear-gradient(180deg, var(--gold), transparent);
  animation: scrollLine 2s infinite;
}
@keyframes scrollLine {
  0% { height: 0; opacity: 1; }
  100% { height: 40px; opacity: 0; }
}

/* ============================================
   MARQUEE
   ============================================ */

.marquee {
  background: var(--gold);
  color: var(--bg);
  padding: 22px 0;
  overflow: hidden;
  border-top: 1px solid var(--gold-deep);
  border-bottom: 1px solid var(--gold-deep);
  position: relative;
}
.marquee__track {
  display: flex;
  white-space: nowrap;
  animation: marquee 40s linear infinite;
  gap: 56px;
}
.marquee__item {
  font-family: var(--display);
  font-size: clamp(32px, 4vw, 56px);
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  display: inline-flex;
  align-items: center;
  gap: 56px;
}
.marquee__item::after {
  content: "★";
  font-family: var(--display);
  color: var(--bg);
}
@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

.marquee--dark {
  background: var(--bg);
  color: var(--ink);
  border-color: var(--bg-3);
}
.marquee--dark .marquee__item::after { color: var(--gold); }

/* ============================================
   SECTIONS
   ============================================ */

section { position: relative; padding: clamp(80px, 12vw, 160px) 0; }

.section-head {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 40px;
  align-items: end;
  margin-bottom: 80px;
}
.section-head__lead {
  max-width: 420px;
  color: var(--ink-mid);
  font-size: 15px;
  line-height: 1.6;
}
.section-num {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.25em;
  color: var(--gold);
  text-transform: uppercase;
}

/* About */
.about {
  border-top: 1px solid var(--bg-3);
}
.about__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: start;
}
.about__lead {
  font-family: var(--display);
  font-size: clamp(28px, 3.6vw, 56px);
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: -0.01em;
}
.about__lead em {
  font-style: normal;
  color: var(--gold);
}
.about__body p {
  font-size: 16px;
  line-height: 1.7;
  color: var(--ink-mid);
  margin-bottom: 20px;
}
.about__body p:first-child::first-letter {
  font-family: var(--display);
  float: left;
  font-size: 90px;
  line-height: 0.85;
  padding: 4px 14px 0 0;
  color: var(--gold);
}

.stats {
  margin-top: 80px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--bg-3);
  border-bottom: 1px solid var(--bg-3);
}
.stat {
  padding: 32px 24px;
  border-right: 1px solid var(--bg-3);
  position: relative;
  overflow: hidden;
  transition: background 0.3s;
}
.stat:last-child { border-right: 0; }
.stat:hover { background: var(--bg-2); }
.stat__num {
  font-family: var(--display);
  font-size: clamp(48px, 6vw, 96px);
  line-height: 0.9;
  color: var(--gold);
  letter-spacing: -0.02em;
}
.stat__sub {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ink-mid);
  margin-top: 10px;
}

/* Headliners */
.headliners {
  background: var(--bg-2);
}
.headliners__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}
.headliner {
  display: grid;
  grid-template-columns: 100px 1fr 2fr 220px;
  align-items: center;
  gap: 40px;
  padding: 48px 0;
  border-top: 1px solid var(--bg-3);
  position: relative;
  transition: padding-left 0.4s ease;
  cursor: pointer;
}
.headliner:last-child { border-bottom: 1px solid var(--bg-3); }
.headliner:hover { padding-left: 24px; background: linear-gradient(90deg, rgba(212, 168, 74, 0.08), transparent 50%); }
.headliner__num {
  font-family: var(--display);
  font-size: 64px;
  line-height: 1;
  color: var(--gold-deep);
  -webkit-text-stroke: 1px var(--gold);
  -webkit-text-fill-color: transparent;
  transition: color 0.3s;
}
.headliner:hover .headliner__num {
  -webkit-text-fill-color: var(--gold);
  -webkit-text-stroke: 0;
}
.headliner__name {
  font-family: var(--display);
  font-size: clamp(48px, 6vw, 96px);
  line-height: 0.9;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  background: linear-gradient(180deg, #f3cf63 0%, #d4a84a 40%, #8a6a22 70%, #d4a84a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.headliner__bio {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-mid);
}
.headliner__meta {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-align: right;
}
.headliner__meta-row {
  margin-bottom: 8px;
  color: var(--ink-mid);
}
.headliner__meta-row strong { color: var(--ink); font-weight: 400; }
.headliner__meta-tag {
  display: inline-block;
  padding: 4px 10px;
  background: var(--gold);
  color: var(--bg);
  margin-top: 8px;
}

/* Cultura - 4 elements */
.cultura__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1px;
  background: var(--bg-3);
  border: 1px solid var(--bg-3);
}
.element {
  background: var(--bg);
  padding: 48px;
  position: relative;
  overflow: hidden;
  transition: background 0.3s;
  min-height: 380px;
  display: flex;
  flex-direction: column;
}
.element:hover { background: var(--bg-2); }
.element__num {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.25em;
  color: var(--gold);
  text-transform: uppercase;
  margin-bottom: 24px;
}
.element__name {
  font-family: var(--display);
  font-size: clamp(48px, 6vw, 96px);
  line-height: 0.85;
  text-transform: uppercase;
  letter-spacing: -0.02em;
  color: var(--ink);
  position: relative;
}
.element__name::after {
  content: attr(data-shadow);
  position: absolute;
  left: 6px;
  top: 6px;
  color: transparent;
  -webkit-text-stroke: 1px rgba(212, 168, 74, 0.3);
  z-index: -1;
}
.element__desc {
  margin-top: 20px;
  color: var(--ink-mid);
  font-size: 14px;
  line-height: 1.6;
}
.element__details {
  margin-top: auto;
  padding-top: 24px;
  border-top: 1px dashed var(--bg-3);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.element__detail-row {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 16px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.element__detail-row span:first-child {
  color: var(--gold);
}
.element__prize {
  margin-top: 16px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  background: var(--gold);
  color: var(--bg);
  font-family: var(--display);
  font-size: 18px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  align-self: flex-start;
}

/* DJ lineup */
.lineup {
  background: var(--bg-2);
}
.lineup__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.dj {
  padding: 32px;
  border: 1px solid var(--bg-3);
  background: var(--bg);
  transition: all 0.3s;
  position: relative;
  overflow: hidden;
}
.dj::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 4px; height: 100%;
  background: var(--gold);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform 0.4s ease;
}
.dj:hover { border-color: var(--gold); transform: translate(-4px, -4px); box-shadow: 8px 8px 0 var(--bg-3); }
.dj:hover::before { transform: scaleY(1); }
.dj__name {
  font-family: var(--display);
  font-size: clamp(32px, 3.6vw, 48px);
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: -0.01em;
}
.dj__crew {
  font-family: var(--marker);
  color: var(--gold);
  font-size: 22px;
  margin-top: 8px;
}
.dj__bio {
  margin-top: 20px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-mid);
}
.dj__tags {
  margin-top: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

/* Location */
.location__layout {
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.location__map {
  position: relative;
  aspect-ratio: 21/9;
  background: var(--bg-2);
  border: 1px solid var(--bg-3);
  overflow: hidden;
}
.location__map-canvas {
  width: 100%;
  height: 100%;
  background: #1a1814;
}
/* Leaflet dark-tone treatment */
.location__map-canvas .leaflet-tile-pane {
  filter: invert(0.92) hue-rotate(180deg) saturate(0.3) brightness(0.95);
}
.location__map-canvas .leaflet-control-attribution {
  background: rgba(10, 9, 8, 0.7);
  color: var(--ink-dim);
  font-family: var(--mono);
  font-size: 9px;
}
.location__map-canvas .leaflet-control-attribution a {
  color: var(--gold);
}
.location__map-canvas .leaflet-control-zoom a {
  background: var(--bg-2);
  color: var(--gold);
  border-color: var(--bg-3);
}
.location__map-canvas .leaflet-control-zoom a:hover {
  background: var(--bg-3);
}
.location__map-canvas .leaflet-popup-content-wrapper {
  background: var(--bg);
  color: var(--ink);
  border: 1px solid var(--gold);
  border-radius: 0;
  padding: 0;
  box-shadow: 0 4px 18px rgba(0,0,0,0.5);
}
.location__map-canvas .leaflet-popup-content {
  margin: 14px 18px;
  font-family: var(--body);
  font-size: 13px;
  line-height: 1.5;
}
.location__map-canvas .leaflet-popup-content strong {
  font-family: var(--display);
  font-size: 18px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--ink);
  display: block;
  margin-bottom: 4px;
}
.location__map-canvas .leaflet-popup-content small {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.15em;
  color: var(--gold);
  text-transform: uppercase;
}
.location__map-canvas .leaflet-popup-tip {
  background: var(--gold);
}
.location__map-canvas .leaflet-popup-close-button {
  color: var(--ink-dim);
}

/* Custom gold pin marker */
.platinum-pin {
  position: relative;
  width: 36px;
  height: 48px;
}
.platinum-pin svg {
  display: block;
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.55));
  animation: pin-drop 0.7s cubic-bezier(.4, 1.3, .5, 1) backwards;
}
.platinum-pin .pin-body {
  animation: pin-pulse 2.2s ease-in-out infinite;
  transform-origin: 24px 60px;
  transform-box: fill-box;
}
@keyframes pin-drop {
  0%   { transform: translateY(-160%); opacity: 0; }
  60%  { opacity: 1; }
  100% { transform: translateY(0); opacity: 1; }
}
@keyframes pin-pulse {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.08); }
}
.platinum-pin-pulse {
  position: absolute;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(212, 168, 74, 0.4);
  left: -10px;
  top: -4px;
  z-index: -1;
  animation: pin-ripple 2.2s ease-out infinite;
}
@keyframes pin-ripple {
  0%   { transform: scale(0.4); opacity: 0.7; }
  100% { transform: scale(2.4); opacity: 0; }
}
.location__map-tag {
  position: absolute;
  top: 16px;
  left: 16px;
  background: var(--bg);
  border: 1px solid var(--gold);
  padding: 8px 14px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gold);
  z-index: 600;
  pointer-events: none;
}
.location__map-pin {
  position: absolute;
  bottom: 16px;
  right: 16px;
  z-index: 3;
  background: var(--bg);
  padding: 12px 16px;
  border: 1px solid var(--bg-3);
  max-width: 280px;
}
.location__map-pin strong {
  font-family: var(--display);
  font-size: 22px;
  letter-spacing: 0.02em;
  display: block;
}
.location__map-pin small {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  color: var(--ink-mid);
  text-transform: uppercase;
}

/* Custom map marker (Google-style pin) overlaid on iframe */
.location__map-marker {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -100%);
  z-index: 2;
  pointer-events: none;
  animation: pin-drop 0.7s cubic-bezier(.4, 1.3, .5, 1) 0.3s backwards;
}
.location__map-marker svg {
  display: block;
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.5));
}
.location__map-marker .pin-body {
  animation: pin-pulse 2s ease-in-out infinite;
  transform-origin: 24px 60px;
  transform-box: fill-box;
}
@keyframes pin-drop {
  0%   { transform: translate(-50%, -260%); opacity: 0; }
  60%  { opacity: 1; }
  100% { transform: translate(-50%, -100%); opacity: 1; }
}
@keyframes pin-pulse {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.08); }
}

.location__map-link {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 600;
  background: var(--gold);
  color: var(--bg);
  padding: 8px 14px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  transition: all 0.2s;
}
.location__map-link:hover {
  background: var(--gold-bright);
  transform: translate(-2px, -2px);
  box-shadow: 4px 4px 0 var(--bg-2);
}

/* Old static pin elements (no longer used, kept for legacy) */
.location__map-marker { display: none; }
.location__map-pin { display: none; }

.location__cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: stretch;
}
.location__col {
  scroll-margin-top: 100px;
  display: flex;
  flex-direction: column;
}
.location__col .travel {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.location__col .travel__item {
  display: flex;
  flex-direction: column;
}

/* Static info block (no accordion) — sits flush with the accordion items */
.travel__item--info {
  background: var(--bg-2);
  border: 1px solid var(--bg-3);
  border-left: 3px solid var(--gold);
  flex: 1;
  margin-top: auto;
}
.travel__info-block {
  padding: 20px 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 100%;
}
.travel__info-block-label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--gold);
}
.travel__info-block p {
  color: var(--ink-mid);
  font-size: 14px;
  line-height: 1.6;
}
.travel__info-block .travel__cta {
  align-self: flex-start;
}

.travel {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.travel__item {
  border: 1px solid var(--bg-3);
  background: var(--bg-2);
  overflow: hidden;
}
.travel__head {
  width: 100%;
  text-align: left;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  font-family: var(--display);
  font-size: 24px;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  transition: background 0.2s;
}
.travel__head:hover { background: var(--bg-3); }
.travel__head-left {
  display: flex;
  align-items: center;
  gap: 16px;
}
.travel__icon {
  width: 36px; height: 36px;
  display: grid; place-items: center;
  background: var(--gold);
  color: var(--bg);
  font-size: 18px;
}
.travel__toggle {
  font-family: var(--mono);
  font-size: 24px;
  color: var(--gold);
  transition: transform 0.3s;
}
.travel__item.open .travel__toggle { transform: rotate(45deg); }
.travel__body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
}
.travel__item.open .travel__body { max-height: 500px; }
.travel__content {
  padding: 0 24px 24px 76px;
  color: var(--ink-mid);
  font-size: 14px;
  line-height: 1.7;
}
.travel__info {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
  background: var(--bg-3);
  border-left: 2px solid var(--gold);
  font-size: 13px;
  line-height: 1.5;
  color: var(--ink);
}
.travel__info-label {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gold);
}
.travel__actions {
  margin-top: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.travel__icon--gold {
  background: transparent;
  color: var(--gold);
  border: 1px solid var(--gold);
  font-size: 16px;
}
.travel__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gold);
  border-bottom: 1px solid rgba(212, 168, 74, 0.4);
  padding-bottom: 4px;
  transition: all 0.2s;
}
.travel__cta:hover {
  color: var(--gold-bright);
  border-bottom-color: var(--gold-bright);
  letter-spacing: 0.25em;
}

.travel-group-head {
  margin-bottom: 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.travel-group-num {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--gold);
}
.travel-group-head h3 {
  font-family: var(--display);
  font-size: clamp(28px, 3.4vw, 44px);
  text-transform: uppercase;
  letter-spacing: -0.01em;
  line-height: 1;
  scroll-margin-top: 100px;
}
.travel-group-head p {
  color: var(--ink-mid);
  font-size: 14px;
  line-height: 1.6;
  margin-top: 4px;
}

/* ============================================
   DOVE DORMIRE
   ============================================ */

.stay {
  background: var(--bg-2);
  border-top: 1px solid var(--bg-3);
}
.stay__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.stay__card {
  background: var(--bg);
  border: 1px solid var(--bg-3);
  padding: 28px 24px 24px;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: all 0.3s cubic-bezier(.2,.7,.2,1);
  overflow: hidden;
}
.stay__card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 3px;
  background: linear-gradient(90deg, var(--gold), transparent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
}
.stay__card:hover {
  border-color: var(--gold);
  transform: translate(-4px, -4px);
  box-shadow: 8px 8px 0 var(--bg-3);
}
.stay__card:hover::before {
  transform: scaleX(1);
}

.stay__card-tag {
  position: absolute;
  top: 16px;
  right: 16px;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gold);
  padding: 4px 8px;
  border: 1px solid rgba(212, 168, 74, 0.4);
  background: rgba(212, 168, 74, 0.06);
}

.stay__card-icon {
  width: 56px;
  height: 56px;
  color: var(--gold);
  margin-bottom: 20px;
}
.stay__card-icon svg {
  width: 100%;
  height: 100%;
}

.stay__card-body {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.stay__card-distance {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ink-dim);
  margin-bottom: 10px;
}
.stay__card-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 8px rgba(212, 168, 74, 0.6);
}
.stay__card-name {
  font-family: var(--display);
  font-size: 28px;
  line-height: 1;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  margin-bottom: 12px;
  text-wrap: balance;
}
.stay__card-desc {
  font-size: 13px;
  line-height: 1.6;
  color: var(--ink-mid);
  margin-bottom: 20px;
  flex: 1;
}
.stay__card-meta {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding-top: 16px;
  border-top: 1px dashed var(--bg-3);
  margin-bottom: 16px;
}
.stay__card-stars {
  color: var(--gold);
  letter-spacing: 0.1em;
  font-size: 14px;
}
.stay__card-price {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.05em;
  color: var(--ink);
}

.stay__card-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  background: transparent;
  border: 1px solid var(--bg-3);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ink);
  transition: all 0.25s;
}
.stay__card-cta:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--bg);
}
.stay__card-arrow {
  font-family: var(--display);
  font-size: 18px;
  transition: transform 0.25s;
}
.stay__card-cta:hover .stay__card-arrow {
  transform: translateX(6px);
}

.stay__note {
  margin-top: 32px;
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 20px 24px;
  background: var(--bg);
  border: 1px solid var(--bg-3);
  border-left: 3px solid var(--gold);
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-mid);
}
.stay__note strong {
  color: var(--ink);
  font-weight: 600;
}
.stay__note a {
  color: var(--gold);
  border-bottom: 1px solid rgba(212, 168, 74, 0.4);
  transition: border-color 0.2s;
}
.stay__note a:hover {
  border-color: var(--gold);
}
.stay__note-icon {
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  background: var(--gold);
  color: var(--bg);
  border-radius: 50%;
  font-family: var(--display);
  font-size: 16px;
  line-height: 1;
}

/* Tickets */
.tickets {
  background: linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 100%);
  position: relative;
}
.tickets__lead {
  max-width: 920px;
  margin: 0 auto 80px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}
.tickets__lead .eyebrow {
  margin: 0 auto;
}
.tickets__lead-text {
  font-size: clamp(20px, 2vw, 26px);
  line-height: 1.4;
  color: var(--ink-mid);
  text-wrap: balance;
}
.tickets__hero {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 60px;
  align-items: center;
}
.tickets__heading {
  font-family: var(--display);
  font-size: clamp(60px, 9vw, 160px);
  line-height: 0.85;
  text-transform: uppercase;
  letter-spacing: -0.02em;
}
.tickets__heading .strike {
  text-decoration: line-through;
  text-decoration-color: var(--red);
  text-decoration-thickness: 6px;
  color: var(--ink-dim);
}
.tickets__heading .gold {
  background: linear-gradient(180deg, #f3cf63, #d4a84a 50%, #8a6a22);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.tickets__body {
  color: var(--ink-mid);
  font-size: 15px;
  line-height: 1.6;
  margin-top: 24px;
  max-width: 460px;
}
.tickets__buy {
  margin-top: 56px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

.releases {
  margin-top: 60px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.release {
  padding: 24px;
  border: 1px solid var(--bg-3);
  background: var(--bg);
  position: relative;
  transition: all 0.3s;
}
.release--soldout {
  opacity: 0.55;
}
.release--current {
  border-color: var(--gold);
  background: linear-gradient(180deg, rgba(212, 168, 74, 0.1), var(--bg));
}
.release__label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--ink-mid);
}
.release__price {
  font-family: var(--display);
  font-size: 56px;
  line-height: 1;
  margin-top: 16px;
  letter-spacing: -0.02em;
}
.release--current .release__price { color: var(--gold); }
.release__status {
  margin-top: 12px;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.release--soldout .release__status { color: var(--red); }
.release--current .release__status { color: var(--gold); }
.release--current .release__status::before {
  content: "";
  width: 6px; height: 6px;
  background: var(--gold);
  border-radius: 50%;
  animation: pulse 1.4s infinite;
}

.tickets__btn {
  padding: 28px 32px;
  background: linear-gradient(135deg, var(--gold-bright) 0%, var(--gold) 55%, var(--gold-deep) 100%);
  border: 2px solid var(--gold-bright);
  color: var(--bg);
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  transition: transform 0.25s cubic-bezier(.2,.7,.2,1), box-shadow 0.25s ease, filter 0.2s;
  position: relative;
  overflow: hidden;
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, 0.4),
    0 6px 24px rgba(212, 168, 74, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.35);
}
.tickets__btn::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.3 0'/></filter><rect width='120' height='120' filter='url(%23n)'/></svg>");
  opacity: 0.18;
  mix-blend-mode: multiply;
  pointer-events: none;
}
.tickets__btn::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0; left: -120%;
  width: 60%;
  background: linear-gradient(110deg, transparent 0%, rgba(255, 255, 255, 0.4) 50%, transparent 100%);
  transition: left 0.7s cubic-bezier(.2,.7,.2,1);
  pointer-events: none;
}
.tickets__btn:hover {
  transform: translate(-3px, -3px);
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, 0.5),
    8px 8px 0 var(--bg),
    8px 8px 0 1px var(--gold),
    0 12px 40px rgba(212, 168, 74, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.35);
  filter: brightness(1.05);
}
.tickets__btn:hover::after { left: 120%; }
.tickets__btn:active {
  transform: translate(0, 0);
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, 0.5),
    2px 2px 0 var(--bg-2),
    inset 0 1px 0 rgba(255, 255, 255, 0.35);
}
.tickets__btn-left {
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 1;
  width: 100%;
}
.tickets__btn-name-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 6px;
}
.tickets__btn-vendor {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--bg);
  opacity: 0.72;
  font-weight: 700;
}
.tickets__btn-name {
  font-family: var(--display);
  font-size: 38px;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1;
  color: var(--bg);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
}
.tickets__btn-arrow {
  font-family: var(--body);
  font-size: 30px;
  font-weight: 600;
  line-height: 1;
  color: var(--bg);
  transition: transform 0.25s cubic-bezier(.2,.7,.2,1);
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
}
.tickets__btn:hover .tickets__btn-arrow { transform: translateX(10px) scale(1.1); }

/* Partners — flex-wrap with per-logo width hints for natural editorial layout */
.partners {
  border-top: 1px solid var(--bg-3);
}
.partners__group {
  margin-top: 48px;
}
.partners__group:first-of-type {
  margin-top: 0;
}
.partners__group-label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.partners__group-label::after {
  content: "";
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, rgba(212, 168, 74, 0.3), transparent);
}
.partners__row {
  display: flex;
  flex-wrap: wrap;
  gap: 1px;
  background: var(--bg-3);
  border: 1px solid var(--bg-3);
}
.partner {
  background: var(--bg);
  flex: 1 1 var(--w, 180px);
  min-width: var(--w, 180px);
  height: 130px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px 22px;
  transition: background 0.3s, transform 0.3s;
  position: relative;
  overflow: hidden;
}
.partner img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  opacity: 0.85;
  transition: opacity 0.3s, transform 0.3s, filter 0.3s;
}
.partner--invert img {
  filter: invert(1);
}
.partner:hover {
  background: var(--bg-2);
  z-index: 1;
}
.partner:hover img {
  opacity: 1;
  transform: scale(1.05);
}
.partner--venue {
  flex-grow: 1.4;
  position: relative;
}
.partner--venue::after {
  content: "VENUE";
  position: absolute;
  top: 10px;
  right: 12px;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.25em;
  color: var(--gold);
  opacity: 0.75;
}
.partner img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 0.85;
  transition: opacity 0.3s, transform 0.3s, filter 0.3s;
}
.partner__placeholder {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink-dim);
  text-align: center;
  padding: 8px;
  border: 1px dashed rgba(212, 168, 74, 0.25);
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  transition: color 0.25s, border-color 0.25s;
}
.partner:hover .partner__placeholder {
  color: var(--gold);
  border-color: rgba(212, 168, 74, 0.6);
}

/* Footer */
.footer {
  background: var(--bg);
  border-top: 1px solid var(--bg-3);
  padding: 80px 0 32px;
}
.footer__top {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
  padding-bottom: 60px;
  border-bottom: 1px solid var(--bg-3);
}
.footer__lockup {
  font-family: var(--display);
  font-size: clamp(48px, 6vw, 96px);
  line-height: 0.9;
  text-transform: uppercase;
  letter-spacing: -0.01em;
}
.footer__lockup .gold {
  background: linear-gradient(180deg, #f3cf63, #d4a84a 50%, #8a6a22);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.footer__contact {
  display: flex;
  flex-direction: column;
  gap: 12px;
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-mid);
}
.footer__contact a:hover { color: var(--gold); }

.footer__bottom {
  margin-top: 32px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  color: var(--ink-dim);
  text-transform: uppercase;
}

/* ============================================
   REVEAL ANIMATIONS
   ============================================ */

.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s cubic-bezier(.2,.7,.2,1), transform 0.8s cubic-bezier(.2,.7,.2,1);
}
.reveal.in {
  opacity: 1;
  transform: translateY(0);
}

.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 1100px) {
  .hero__container { grid-template-columns: 1fr; gap: 48px; }
  .hero__right { max-width: 480px; }
  .about__grid { grid-template-columns: 1fr; gap: 40px; }
  .stats { grid-template-columns: repeat(2, 1fr); }
  .stat { border-bottom: 1px solid var(--bg-3); }
  .stat:nth-child(odd) { border-right: 1px solid var(--bg-3); }
  .stat:nth-child(even) { border-right: 0; }
  .headliner { grid-template-columns: 60px 1fr; grid-template-areas: "num name" "bio bio" "meta meta"; gap: 20px; }
  .headliner__num { grid-area: num; font-size: 40px; }
  .headliner__name { grid-area: name; font-size: clamp(40px, 8vw, 64px); }
  .headliner__bio { grid-area: bio; }
  .headliner__meta { grid-area: meta; text-align: left; }
  .cultura__grid { grid-template-columns: 1fr; }
  .lineup__grid { grid-template-columns: 1fr; }
  .location__cols { grid-template-columns: 1fr; gap: 40px; }
  .location__map { aspect-ratio: 16/9; }
  .tickets__hero { grid-template-columns: 1fr; }
  .releases { grid-template-columns: repeat(2, 1fr); }
  .tickets__buy { grid-template-columns: 1fr; }
  .partners__row { gap: 1px; }
  .partner { height: 110px; min-width: 140px; }
  .stay__grid { grid-template-columns: repeat(2, 1fr); }
  .footer__top { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .nav__links { display: none; }
  .nav__cta { font-size: 12px; padding: 8px 12px; }
  .nav__brand-logo { height: 40px; }
  .nav.scrolled .nav__brand-logo { height: 36px; }
  .section-head { grid-template-columns: 1fr; }
  .element { padding: 32px 24px; min-height: 320px; }
  .partner { height: 96px; min-width: 130px; padding: 14px 18px; }
  .stay__grid { grid-template-columns: 1fr; }
  .footer__bottom { flex-direction: column; gap: 16px; text-align: center; }
  .hero { padding-top: 110px; }
}