@import url('https://fonts.googleapis.com/css2?family=Anton&family=Inter:wght@400;600;700;800;900&display=swap');

:root {
  --navy:#081827;
  --navy2:#12385f;
  --orange:#ff6b00;
  --red:#d71920;
  --blue:#1c63b7;
  --green:#168a5b;
  --bg:#f6f7fb;
  --text:#101827;
  --muted:#667085;
  --card:#fff;
  --line:rgba(16,24,39,.12);
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0;
  font-family:Inter,Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.6;
}
a { color:inherit; }
img { display:block; }

.floating-cta {
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:60;
  background:var(--orange);
  color:white;
  text-decoration:none;
  font-weight:900;
  padding:14px 22px;
  border-radius:999px;
  box-shadow:0 18px 50px rgba(0,0,0,.25);
}

.hero {
  min-height:96vh;
  color:white;
  padding:24px;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,107,0,.25), transparent 28%),
    linear-gradient(90deg,rgba(8,24,39,.94),rgba(8,24,39,.38)),
    url('hero-team.jpg');
  background-size:cover;
  background-position:center;
}

.nav {
  max-width:1180px;
  min-height:62px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin:0 auto;
}
.brand {
  color:white;
  font-weight:900;
  text-decoration:none;
  font-size:1.1rem;
}
.nav-links {
  display:flex;
  gap:20px;
}
.nav-links a {
  color:white;
  text-decoration:none;
  font-weight:800;
  opacity:.94;
}
.menu-toggle {
  display:none;
  background:white;
  color:var(--navy);
  border:0;
  border-radius:999px;
  padding:8px 13px;
  font-size:1.1rem;
  font-weight:900;
}

.hero-inner {
  max-width:980px;
  margin:120px auto 0;
}
.kicker {
  color:var(--orange);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.13em;
  font-size:.78rem;
}
.hero .kicker { color:#ffb46f; }

h1,h2,h3,p { margin-top:0; }
h1 {
  font-family:Anton,Impact,sans-serif;
  font-size:clamp(4rem,10vw,9rem);
  line-height:.9;
  letter-spacing:.01em;
  margin-bottom:24px;
}
h2 {
  font-size:clamp(2.1rem,5vw,4rem);
  line-height:1.05;
  letter-spacing:-.04em;
}
.lead {
  max-width:760px;
  font-size:1.35rem;
}
.hero-actions {
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:30px;
}
.btn {
  display:inline-block;
  text-decoration:none;
  border-radius:999px;
  padding:15px 24px;
  font-weight:900;
  transition: transform .2s ease, box-shadow .2s ease;
}
.btn:hover {
  transform:translateY(-2px);
  box-shadow:0 16px 30px rgba(8,24,39,.18);
}
.primary { background:var(--orange); color:white; }
.secondary { background:white; color:var(--navy); }
.dark { background:var(--navy); color:white; }
.full { width:100%; text-align:center; }

.quick-facts {
  max-width:860px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:15px;
  margin-top:36px;
}
.quick-facts div {
  background:rgba(255,255,255,.92);
  color:var(--navy);
  padding:20px;
  border-radius:24px;
}
.quick-facts strong { display:block; font-size:1.1rem; }
.quick-facts span { color:var(--muted); }

.section {
  max-width:1180px;
  padding:86px 24px;
  margin:0 auto;
}
.section-title {
  max-width:800px;
  text-align:center;
  margin:0 auto 34px;
}
.center { text-align:center; }
.center-actions { justify-content:center; }

.action-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}
.action-card,
.ticket-card,
.sponsor-card,
.partner-row div,
.program-card,
.band-card {
  background:white;
  border:1px solid var(--line);
  border-radius:30px;
  box-shadow:0 18px 50px rgba(8,24,39,.08);
}
.action-card {
  padding:28px;
}
.action-card span {
  font-size:2.4rem;
  display:block;
  margin-bottom:14px;
}
.action-card a {
  color:var(--orange);
  font-weight:900;
}

.feature {
  max-width:1180px;
  padding:0 24px;
  margin:20px auto;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:24px;
  align-items:stretch;
}
.feature-image img {
  width:100%;
  height:540px;
  object-fit:cover;
  border-radius:36px;
}
.feature-copy {
  background:var(--navy);
  color:white;
  border-radius:36px;
  padding:48px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.feature-copy.light {
  background:#eaf8f1;
  color:var(--text);
}
.meta {
  color:var(--orange);
  font-weight:900;
}

.ticket-grid,
.sponsor-grid,
.partner-row {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.ticket-card,
.sponsor-card {
  padding:28px;
}
.ticket-card.featured {
  position:relative;
  background:var(--navy);
  color:white;
  transform:translateY(-12px);
}
.badge {
  position:absolute;
  top:18px;
  right:18px;
  background:var(--red);
  color:white;
  padding:7px 12px;
  border-radius:999px;
  font-size:.78rem;
  font-weight:900;
}
.price,
.sponsor-price {
  color:var(--orange);
  font-size:3.25rem;
  line-height:1;
  font-weight:900;
  margin:10px 0 20px;
}
.sponsor-price {
  color:var(--blue);
  font-size:2.5rem;
}
ul {
  padding-left:20px;
  margin-bottom:24px;
}

.program-band {
  max-width:1180px;
  margin:20px auto;
  padding:0 24px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}
.program-card {
  padding:42px;
}
.program-list div {
  border-top:1px solid var(--line);
  padding-top:18px;
  margin-top:18px;
}
.program-list strong {
  color:var(--red);
}
.band-card {
  overflow:hidden;
}
.band-card img {
  width:100%;
  height:330px;
  object-fit:cover;
}
.band-card div {
  padding:34px;
}
.band-card a {
  color:var(--orange);
  font-weight:900;
}

.pills {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:22px 0;
}
.pills span {
  background:white;
  border:1px solid var(--line);
  border-radius:999px;
  padding:9px 14px;
  font-weight:800;
}

.sponsor {
  background:#fff7ef;
  border-radius:46px;
}
.partner-row {
  margin-top:20px;
  margin-bottom:26px;
}
.partner-row div {
  padding:24px;
  text-align:center;
}

.donate {
  max-width:1180px;
  margin:20px auto 0;
  padding:58px;
  display:flex;
  gap:32px;
  justify-content:space-between;
  align-items:center;
  background:linear-gradient(135deg,var(--navy),var(--navy2));
  color:white;
  border-radius:42px;
}
.donate div {
  max-width:720px;
}

.photo-strip {
  max-width:1180px;
  margin:80px auto 0;
  padding:0 24px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
.photo-strip img {
  width:100%;
  height:300px;
  object-fit:cover;
  border-radius:28px;
}

.final {
  text-align:center;
  padding:96px 24px;
  color:white;
  background:
    linear-gradient(rgba(8,24,39,.78),rgba(8,24,39,.78)),
    url('finish.jpg');
  background-size:cover;
  background-position:center;
}
.final h2 {
  max-width:840px;
  margin:0 auto 18px;
}
.final a { color:white; font-weight:900; }

footer {
  background:var(--navy);
  color:rgba(255,255,255,.82);
  text-align:center;
  padding:38px 24px;
}

.reveal {
  opacity:0;
  transform:translateY(18px);
  transition: opacity .7s ease, transform .7s ease;
}
.reveal.visible {
  opacity:1;
  transform:translateY(0);
}

@media(max-width:900px) {
  .floating-cta {
    left:18px;
    right:18px;
    text-align:center;
  }
  .hero {
    min-height:90vh;
    padding:18px;
  }
  .menu-toggle {
    display:block;
  }
  .nav-links {
    position:fixed;
    left:18px;
    right:18px;
    top:78px;
    z-index:70;
    display:none;
    flex-direction:column;
    background:white;
    color:var(--navy);
    padding:18px;
    border-radius:24px;
    box-shadow:0 20px 60px rgba(0,0,0,.24);
  }
  .nav-links a {
    color:var(--navy);
  }
  body.menu-open .nav-links {
    display:flex;
  }
  .hero-inner {
    margin-top:80px;
  }
  .quick-facts,
  .action-grid,
  .feature,
  .ticket-grid,
  .program-band,
  .sponsor-grid,
  .partner-row,
  .photo-strip {
    grid-template-columns:1fr;
  }
  .feature-image img {
    height:310px;
  }
  .feature-copy {
    padding:34px;
  }
  .ticket-card.featured {
    transform:none;
  }
  .donate {
    margin:18px;
    padding:34px;
    display:block;
  }
}