:root {color-scheme:dark; --ink:#fff; --muted:#c8c5d0; --purple:#b78cfa;}
* {box-sizing:border-box;}
html {scroll-behavior:smooth; background:#000;}
body {margin:0; color:var(--ink); background:#000; font-family:Arial,Helvetica,sans-serif; line-height:1.65; -webkit-font-smoothing:antialiased;}
a {color:inherit;}
.skip-link {position:fixed; z-index:10; top:12px; left:12px; padding:10px 18px; background:#fff; color:#000; transform:translateY(-180%);}
.skip-link:focus {transform:translateY(0);}
.hero {min-height:450px; padding:24px 24px 62px; text-align:center; background:linear-gradient(rgba(0,0,0,.25),rgba(0,0,0,.25)),url('assets/stadium.png') center center/cover no-repeat;}
.brand {display:inline-block; width:100px; height:100px;}
.brand img {display:block; width:100%; height:100%; object-fit:contain;}
.hero-copy {margin:69px auto 0; max-width:900px;}
h1,h2 {font-family:Georgia,'Times New Roman',serif; font-weight:400; line-height:1.2; margin:0;}
h1 {font-size:clamp(44px,5vw,66px); margin-bottom:12px; letter-spacing:-.025em;}
.hero p {font-size:21px; line-height:1.55; margin:0;}
.section {text-align:center; padding:60px 24px 66px;}
h2 {font-size:clamp(33px,3.4vw,46px);}
.divider {display:block; width:50px; height:1px; background:#6f6a77; margin:28px auto 38px;}
.lead {font-size:22px; margin:24px auto; line-height:1.55;}
.description {color:var(--muted); max-width:820px; font-size:19px; margin:0 auto 30px;}
.button {display:inline-flex; align-items:center; justify-content:center; gap:14px; padding:15px 24px; min-height:54px; border:1px solid #a9a4b2; border-radius:3px; text-decoration:none; text-transform:uppercase; font-size:13px; font-weight:700; letter-spacing:.08em; line-height:1.5; transition:background .16s,border-color .16s;}
.button:hover {background:#21172e; border-color:var(--purple);}
a:focus-visible {outline:3px solid var(--purple); outline-offset:6px;}
.involved {border-top:1px solid #25212a; padding-top:58px;}
.involved .lead {margin:22px auto 30px;}
.actions {display:flex; flex-wrap:wrap; justify-content:center; gap:18px;}
footer {padding:25px 24px; text-align:center; color:#aaa5b3; border-top:1px solid #25212a; font-size:13px;}
footer p {margin:0;}
@media(max-width:600px) {
  .hero {min-height:480px; padding:26px 20px 45px;}
  .hero-copy {margin-top:65px;}
  .hero p {font-size:18px; margin:5px 0;}
  .section {padding:44px 22px 48px;}
  .lead {font-size:20px;}
  .description {font-size:17px;}
  .actions {display:grid; gap:14px;}
  .button {max-width:100%; font-size:12px; padding:15px 18px;}
}
@media(prefers-reduced-motion:reduce) {html{scroll-behavior:auto;} .button{transition:none;}}
