.presale-page { background: var(--void); color: var(--bone); }
.presale-top { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:22px clamp(18px,4vw,54px); border-bottom:1px solid var(--line); }
.presale-top__mark { width:120px; height:auto; }
.presale-top__links { display:flex; gap:22px; align-items:center; font-family:var(--font-mono); font-size:9px; letter-spacing:.12em; text-transform:uppercase; }
.presale-main { min-height:100svh; background:linear-gradient(90deg, rgba(5,8,6,.96) 0%, rgba(5,8,6,.82) 55%, rgba(5,8,6,.55) 100%), url('../assets/img/hero-forest.jpg') center/cover no-repeat; }
.presale-hero { max-width:var(--max); margin:0 auto; padding:clamp(54px,8vw,110px) clamp(18px,4vw,54px) clamp(36px,5vw,72px); }
.presale-hero__eyebrow { font-family:var(--font-mono); font-size:9px; letter-spacing:.18em; text-transform:uppercase; color:var(--fog); }
.presale-hero h1 { margin-top:22px; font-family:var(--font-display); font-size:clamp(4.5rem,12vw,11rem); font-weight:900; letter-spacing:-.07em; line-height:.82; text-transform:uppercase; color:var(--bone); }
.presale-hero h1 span { display:block; color:var(--ember); }
.presale-hero__lede { max-width:54ch; margin-top:30px; color:var(--lichen); font-size:clamp(1rem,1.6vw,1.2rem); line-height:1.65; }
.presale-actions { display:flex; flex-wrap:wrap; gap:14px; align-items:center; margin-top:34px; }
.presale-copy { appearance:none; border:1px solid var(--line-strong); background:transparent; color:var(--bone); padding:15px 18px; font-family:var(--font-mono); font-size:9px; letter-spacing:.12em; text-transform:uppercase; cursor:pointer; }
.presale-copy:hover { border-color:var(--ember); color:var(--ember); }
.presale-status { min-height:1.6em; margin-top:12px; font-family:var(--font-mono); font-size:8px; letter-spacing:.1em; text-transform:uppercase; color:var(--fog); }
.presale-info { max-width:var(--max); margin:0 auto; padding:0 clamp(18px,4vw,54px) clamp(64px,9vw,120px); }
.presale-panel { display:grid; grid-template-columns:1.3fr .7fr; gap:clamp(22px,4vw,64px); border-top:1px solid var(--line); padding-top:clamp(26px,4vw,46px); }
.presale-panel h2 { font-family:var(--font-display); font-size:clamp(2rem,4vw,3.6rem); line-height:.94; letter-spacing:-.04em; text-transform:uppercase; }
.presale-panel p { color:var(--fog); line-height:1.7; }
.presale-meta { display:grid; grid-template-columns:1fr 1fr; gap:18px 26px; margin-top:28px; }
.presale-meta dt { font-family:var(--font-mono); font-size:8px; letter-spacing:.14em; text-transform:uppercase; color:var(--fog); }
.presale-meta dd { margin-top:6px; color:var(--bone); font-size:14px; line-height:1.45; }
.presale-ticket { border:1px solid var(--line-strong); background:rgba(14,23,18,.86); padding:clamp(22px,3vw,34px); }
.presale-ticket__label { font-family:var(--font-mono); font-size:8px; letter-spacing:.16em; text-transform:uppercase; color:var(--fog); }
.presale-ticket__price { margin-top:18px; font-family:var(--font-display); font-size:clamp(3rem,6vw,5.4rem); font-weight:900; letter-spacing:-.05em; line-height:.9; }
.presale-ticket__price small { display:block; margin-top:10px; font-family:var(--font-mono); font-size:8px; letter-spacing:.12em; text-transform:uppercase; color:var(--fog); }
.presale-ticket .btn { width:100%; margin-top:24px; }
.presale-ticket__note { margin-top:16px; font-family:var(--font-mono); font-size:8px; line-height:1.6; letter-spacing:.08em; text-transform:uppercase; color:var(--fog); }
.presale-footer { max-width:var(--max); margin:0 auto; padding:24px clamp(18px,4vw,54px); border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:18px; font-family:var(--font-mono); font-size:8px; letter-spacing:.1em; text-transform:uppercase; color:var(--fog); }
.presale-footer a { color: inherit; }

/* Presale hub */
.presale-hub { max-width:var(--max); margin:0 auto; padding:clamp(54px,8vw,110px) clamp(18px,4vw,54px) clamp(64px,9vw,120px); }
.presale-hub h1 { margin-top:22px; font-family:var(--font-display); font-size:clamp(4.5rem,12vw,11rem); font-weight:900; letter-spacing:-.07em; line-height:.82; text-transform:uppercase; color:var(--bone); }
.presale-hub__lede { max-width:56ch; margin-top:26px; color:var(--lichen); line-height:1.7; }
.presale-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:42px; }
.presale-list a { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:22px 20px; border:1px solid var(--line-strong); color:var(--bone); text-decoration:none; background:rgba(14,23,18,.64); }
.presale-list a:hover { border-color:var(--ember); }
.presale-list__date { flex:0 0 auto; font-family:var(--font-mono); font-size:9px; letter-spacing:.1em; color:var(--fog); text-transform:uppercase; }
.presale-list__city { font-family:var(--font-display); font-size:clamp(1.4rem,2.6vw,2.2rem); font-weight:800; letter-spacing:-.03em; text-transform:uppercase; }
.presale-list__city small { display:block; margin-top:5px; font-family:var(--font-mono); font-size:8px; font-weight:400; letter-spacing:.1em; color:var(--fog); }
.presale-list__arrow { font-family:var(--font-mono); font-size:14px; color:var(--ember); }

@media (max-width:760px) {
  html, body, .presale-page { max-width:100%; overflow-x:hidden; }
  .presale-top, .presale-main, .presale-hero, .presale-info, .presale-footer, .presale-hub { width:100%; box-sizing:border-box; }
  .presale-panel { grid-template-columns:minmax(0,1fr); min-width:0; }
  .presale-top__links a:first-child { display:none; }
  .presale-footer { flex-direction:column; }
  .presale-meta { grid-template-columns:1fr; }
  .presale-hero h1 { font-size:clamp(2.6rem,11.5vw,4.5rem); overflow-wrap:anywhere; }
  .presale-list { grid-template-columns:1fr; }
}

/* Original site navigation is fixed; offset the presale content. */
.presale-main,
.presale-hub {
  padding-top: var(--nav-h);
}

/* Show flyer in the ticket panel */
.presale-flyer {
  margin: 0 0 22px;
  border: 1px solid var(--line-strong);
  background: #0a0f0b;
}

.presale-flyer a {
  display: block;
}

.presale-flyer img {
  display: block;
  width: 100%;
  height: auto;
}

.presale-flyer figcaption {
  padding: 9px 10px;
  border-top: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: 8px;
  letter-spacing: 0.12em;
  line-height: 1.4;
  text-transform: uppercase;
  color: var(--fog);
}
