@import url('https://fonts.googleapis.com/css2?family=Anton&family=Work+Sans:wght@400;500;600;700&family=Space+Mono:wght@400;700&display=swap');

:root{
  --pitch-dark:#2B1454;
  --pitch:#512888;
  --pitch-light:#7A4FAE;
  --chalk:#F5F2FA;
  --chalk-card:#FFFFFF;
  --mud:#6B6577;
  --gold:#C9A0FF;
  --ink:#1F1530;
  --ink-soft:#5B5566;
  --line:#E4DEEE;
  --social:#1B0E30;
}

*{box-sizing:border-box; margin:0; padding:0;}
body{
  font-family:'Work Sans', sans-serif;
  background:var(--chalk);
  color:var(--ink);
  line-height:1.5;
}
h1,h2,h3,.display{
  font-family:'Anton', sans-serif;
  font-weight:400;
  letter-spacing:0.5px;
  text-transform:uppercase;
}
.mono{ font-family:'Space Mono', monospace; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }
img{ max-width:100%; display:block; }
:focus-visible{ outline:3px solid var(--gold); outline-offset:2px; }

.topbar{
  background:var(--pitch-dark);
  border-bottom:3px solid var(--gold);
  position:sticky; top:0; z-index:100;
}
.topbar-inner{
  max-width:1440px; margin:0 auto; padding:18px 24px;
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
}
.brand-block{ display:flex; align-items:center; gap:20px; }
.crest-link{ display:flex; flex-shrink:0; }
.crest{
  width:168px; height:94.5px;
  object-fit:contain;
}
.brand-text{ display:flex; flex-direction:column; gap:10px; }
.brand-name{ color:var(--chalk); font-size:28px; letter-spacing:1px; line-height:1; }
.social-row{ display:flex; gap:12px; }
.social-icon{
  width:32px; height:32px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  transition:transform .15s;
}
.social-icon svg{ width:100%; height:100%; display:block; }
.social-icon:hover{ transform:scale(1.12); }

.nav-area{ display:flex; flex-direction:column; align-items:flex-end; gap:12px; position:relative; }
.nav-toggle{ display:none; }
.nav-links{ display:flex; gap:6px; list-style:none; flex-wrap:wrap; justify-content:flex-end; align-items:center; }
.nav-links a{
  color:var(--chalk); font-size:14px; letter-spacing:1px;
  text-transform:uppercase; padding:9px 14px; border-radius:3px;
  transition:background .15s; font-weight:600;
}
.nav-links a:hover{ background:var(--pitch); }

.nav-dropdown{ position:relative; }
.nav-dropdown-toggle{
  background:none; border:none; color:var(--chalk); font-family:inherit; cursor:pointer;
  font-size:14px; letter-spacing:1px; text-transform:uppercase; padding:9px 14px; border-radius:3px;
  font-weight:600; display:inline-flex; align-items:center; gap:5px;
}
.nav-dropdown-toggle:hover, .nav-dropdown.open .nav-dropdown-toggle{ background:var(--pitch); }
.nav-dropdown-caret{ font-size:10px; transition:transform .15s; }
.nav-dropdown.open .nav-dropdown-caret{ transform:rotate(180deg); }
.nav-dropdown-menu{
  display:none; flex-direction:column; gap:2px;
  position:absolute; top:100%; left:0; min-width:170px; margin-top:4px;
  background:var(--pitch-dark); border:1px solid var(--pitch-light); border-radius:6px;
  padding:6px; z-index:110;
}
.nav-dropdown.open .nav-dropdown-menu{ display:flex; }
.nav-dropdown-menu a{
  color:var(--chalk); font-size:13px; letter-spacing:0.5px;
  text-transform:uppercase; padding:9px 12px; border-radius:4px; font-weight:600;
}
.nav-dropdown-menu a:hover{ background:var(--pitch); }

@media (max-width:1150px){
  .nav-area{ width:auto; align-items:center; }
  .nav-links{
    display:none; position:absolute; top:100%; right:24px; z-index:101;
    width:260px; flex-direction:column; align-items:stretch; justify-content:flex-start;
    background:var(--pitch-dark); border:1px solid var(--pitch-light); border-radius:6px;
    padding:8px; gap:4px;
  }
  .nav-links.open{ display:flex; }
  .nav-toggle{ display:block; background:none; border:none; color:var(--chalk); font-size:24px; }
  .nav-dropdown-menu{
    display:none; position:static; background:transparent; border:none;
    padding:2px 0 2px 14px; margin-top:0;
  }
  .nav-dropdown.open .nav-dropdown-menu{ display:flex; }
}

.hero-slideshow{
  position:relative; height:min(72vh, 620px); min-height:380px; overflow:hidden;
  background:var(--pitch-dark);
}
@media (max-width:600px){
  .hero-slideshow{ min-height:480px; }
}
.slide{
  position:absolute; inset:0; opacity:0; transition:opacity 1s ease;
  background-size:cover; background-position:center;
}
.slide.active{ opacity:1; }
.slide::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(20,10,40,0.25) 0%, rgba(20,10,40,0.75) 100%);
}
.hero-content{
  position:absolute; left:0; right:0; bottom:0; z-index:2;
  padding:50px 24px; max-width:1280px; margin:0 auto; color:var(--chalk);
}
@media (max-width:600px){
  .hero-content{ padding:28px 18px; }
}
.eyebrow{ font-family:'Space Mono',monospace; font-size:13px; color:var(--gold); letter-spacing:3px; margin-bottom:14px; }
.hero-content h1{ font-size:clamp(34px,7vw,74px); line-height:0.95; }
.hero-content h1 span{ color:var(--gold); }
.hero-content p{ max-width:520px; margin-top:16px; font-size:16px; color:#E3D9F0; }
.hero-ctas{ display:flex; gap:14px; margin-top:26px; flex-wrap:wrap; }
.btn{
  display:inline-block; padding:14px 26px; font-size:13px; letter-spacing:1.5px;
  text-transform:uppercase; font-weight:700; border-radius:2px; border:2px solid transparent;
  transition:transform .12s ease;
}
.btn:hover{ transform:translateY(-2px); }
.btn-gold{ background:var(--gold); color:var(--pitch-dark); }
.btn-outline{ border-color:var(--chalk); color:var(--chalk); }
.slide-dots{ position:absolute; bottom:22px; right:24px; z-index:3; display:flex; gap:8px; }
.slide-dot{ width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,0.4); border:none; padding:0; }
.slide-dot.active{ background:var(--gold); }

section{ padding:70px 24px; max-width:1280px; margin:0 auto; }
@media (max-width:600px){
  section{ padding:44px 16px; }
}
.section-head{ display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:34px; }
.section-head h2{ font-size:clamp(30px,5vw,44px); }
.section-tag{ font-family:'Space Mono',monospace; font-size:12px; color:var(--mud); letter-spacing:2px; }
.section-alt{ background:var(--chalk-card); }

.fixtures-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:22px; margin-bottom:28px; }
.ticket{
  background:var(--chalk-card); border:2px dashed var(--line); border-radius:10px;
  position:relative; display:flex; overflow:hidden;
}
.ticket::before, .ticket::after{
  content:""; position:absolute; width:20px; height:20px; background:var(--chalk);
  border:2px dashed var(--line); border-radius:50%; top:50%; transform:translateY(-50%);
}
.ticket::before{ left:-12px; } .ticket::after{ right:-12px; }
.ticket-main{ flex:1; padding:20px; }
.ticket-vs{ font-family:'Anton',sans-serif; font-size:22px; margin-bottom:6px; }
.ticket-meta{ font-family:'Space Mono',monospace; font-size:12.5px; color:var(--ink-soft); display:flex; flex-direction:column; gap:3px; }
.ticket-tag{
  display:inline-block; font-size:10.5px; font-family:'Space Mono',monospace; letter-spacing:1px;
  padding:3px 8px; border-radius:20px; margin-bottom:10px; text-transform:uppercase;
}
.tag-home{ background:#E8DBF7; color:var(--pitch-dark); }
.tag-away{ background:#EAE7EE; color:var(--mud); }
.ticket-stub{
  width:70px; background:var(--pitch-dark); color:var(--gold);
  writing-mode:vertical-rl; text-orientation:mixed;
  display:flex; align-items:center; justify-content:center;
  font-family:'Space Mono',monospace; font-size:12px; letter-spacing:2px;
  border-left:2px dashed var(--pitch-light);
}
.ticket-actions{ position:absolute; bottom:8px; right:8px; display:flex; gap:6px; }
.icon-btn{ background:var(--chalk); border:1px solid var(--line); border-radius:4px; padding:7px 11px; font-size:12px; min-height:32px; }
.icon-btn.danger{ color:#B23A3A; }
.card-actions{ display:flex; gap:6px; }

[draggable="true"]{ cursor:grab; }
[draggable="true"]:active{ cursor:grabbing; }
.dragging{ opacity:0.4; touch-action:none; }
.empty-note{ font-size:14px; color:var(--ink-soft); font-style:italic; }
.cal-cta{ text-align:center; }

.manager-panel{
  background:var(--pitch-dark); color:var(--chalk); border-radius:10px; padding:22px;
  margin-bottom:28px; display:none;
}
.manager-panel.open{ display:block; }
.manager-panel h3{ font-size:16px; color:var(--gold); margin-bottom:14px; }
.form-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px; margin-bottom:14px; }
.form-grid input, .form-grid select, .form-grid textarea{
  width:100%; padding:10px 12px; border-radius:4px; border:1px solid var(--pitch-light);
  background:var(--pitch); color:var(--chalk); font-family:'Work Sans',sans-serif; font-size:16px;
}
.form-grid input::placeholder, .form-grid textarea::placeholder{ color:#D7CCE6; }
.form-grid label{ font-size:11px; letter-spacing:1px; text-transform:uppercase; color:#D7CCE6; display:block; margin-bottom:5px; }

.cal-export{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:24px; }
.cal-export .btn{ padding:10px 18px; font-size:12px; }
.cal-controls{ display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; flex-wrap:wrap; gap:12px; }
.cal-nav-btn{ background:var(--pitch-dark); color:var(--chalk); border:none; border-radius:4px; padding:9px 14px; font-size:14px; }
.cal-month-label{ font-family:'Anton',sans-serif; font-size:22px; letter-spacing:1px; }
.cal-legend{ display:flex; gap:16px; flex-wrap:wrap; font-family:'Space Mono',monospace; font-size:12px; color:var(--ink-soft); margin-bottom:18px; }
.cal-legend span{ display:inline-flex; align-items:center; gap:6px; }
.dot{ width:9px; height:9px; border-radius:50%; display:inline-block; }
.dot-game{ background:var(--gold); }
.dot-practice{ background:var(--pitch); }
.dot-social{ background:var(--mud); }
.dot-other{ background:#8B8594; }

.cal-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:6px; }
.cal-dow{ font-family:'Space Mono',monospace; font-size:11px; letter-spacing:1px; color:var(--ink-soft); text-align:center; padding-bottom:6px; text-transform:uppercase; }
.cal-cell{
  background:var(--chalk-card); border:1px solid var(--line); border-radius:6px;
  min-height:150px; padding:8px; display:flex; flex-direction:column; gap:5px;
}
.cal-cell.empty{ background:transparent; border:none; }
.cal-cell.today{ border-color:var(--pitch); border-width:2px; }
.cal-daynum{ font-family:'Space Mono',monospace; font-size:12px; color:var(--ink-soft); }
.cal-chips{ display:flex; flex-direction:column; gap:3px; overflow:hidden; }
.cal-chip{
  font-size:11px; font-family:'Space Mono',monospace; font-weight:700;
  padding:4px 6px; border-radius:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.cal-chip-more{ font-size:10.5px; color:var(--ink-soft); padding:1px 6px; }

@media (max-width:600px){
  .cal-grid{ gap:3px; }
  .cal-dow{ font-size:8.5px; padding-bottom:3px; letter-spacing:0.5px; }
  .cal-cell{ min-height:74px; padding:3px; gap:2px; border-radius:4px; }
  .cal-daynum{ font-size:10px; }
  .cal-chip{ font-size:8px; padding:2px 3px; border-radius:3px; }
  .cal-chip-more{ font-size:7.5px; padding:0 3px; }
}

.cal-list{ margin-top:34px; display:flex; flex-direction:column; gap:10px; }
.cal-event-row{
  display:flex; align-items:center; gap:14px; background:var(--chalk-card); border:1px solid var(--line);
  border-radius:6px; padding:12px 16px; flex-wrap:wrap;
}
.cal-event-date{ font-family:'Space Mono',monospace; font-size:12.5px; color:var(--ink-soft); width:130px; flex-shrink:0; }
.cal-event-type{ font-size:10.5px; font-family:'Space Mono',monospace; letter-spacing:1px; text-transform:uppercase; padding:3px 8px; border-radius:20px; }
.type-game{ background:#F2E4FB; color:#6C2E9C; }
.type-practice{ background:#E8DBF7; color:var(--pitch-dark); }
.type-social{ background:#EAE7EE; color:var(--mud); }
.type-other{ background:#ECE9EF; color:var(--ink-soft); }
.cal-event-title{ font-weight:600; flex:1; min-width:160px; }
.cal-event-meta{ font-family:'Space Mono',monospace; font-size:12px; color:var(--ink-soft); }

.roster-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:20px; }
.player-card{ background:var(--chalk-card); border-radius:8px; overflow:hidden; border:1px solid var(--line); position:relative; }
.player-photo{
  aspect-ratio:3/4; background:linear-gradient(160deg,var(--pitch) 0%, var(--pitch-dark) 100%);
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.player-photo img{ width:100%; height:100%; object-fit:cover; }
.player-num{ font-family:'Anton',sans-serif; font-size:54px; color:rgba(255,255,255,0.85); }
.player-info{ padding:14px; }
.player-name{ font-weight:700; font-size:15px; }
.player-pos{ font-family:'Space Mono',monospace; font-size:11.5px; color:var(--mud); text-transform:uppercase; letter-spacing:1px; }

.exec-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:20px; }
.exec-card{ background:var(--chalk-card); border:1px solid var(--line); border-radius:8px; padding:20px; }
.exec-role{ font-family:'Space Mono',monospace; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--gold); background:var(--pitch-dark); display:inline-block; padding:4px 9px; border-radius:3px; margin-bottom:10px; }
.exec-name{ font-family:'Anton',sans-serif; font-size:19px; margin-bottom:4px; }
.exec-email{ font-family:'Space Mono',monospace; font-size:12.5px; color:var(--ink-soft); }

.gallery-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px; }
.gal-item{ position:relative; border-radius:8px; overflow:hidden; aspect-ratio:4/3; background:var(--pitch-dark); }
.gal-item img{ width:100%; height:100%; object-fit:cover; }
.gal-item > a{ display:block; width:100%; height:100%; }
.gal-caption{
  position:absolute; bottom:0; left:0; right:0; padding:10px 12px;
  background:linear-gradient(0deg, rgba(0,0,0,0.75), transparent); color:#fff; font-size:12.5px; font-family:'Space Mono',monospace;
  display:flex; align-items:baseline; justify-content:space-between; gap:10px;
}
.gal-album-link{ color:var(--gold); font-weight:700; white-space:nowrap; }
.gal-album-link:hover{ text-decoration:underline; }

.join-wrap{ display:grid; grid-template-columns:1.1fr 1fr; gap:50px; align-items:start; }
@media (max-width:820px){ .join-wrap{ grid-template-columns:1fr; } .join-wrap-img{ order:-1; } }
.join-form{ background:var(--chalk-card); border:1px solid var(--line); border-radius:10px; padding:28px; }
.join-form label{ font-size:12px; letter-spacing:1px; text-transform:uppercase; color:var(--ink-soft); display:block; margin-bottom:6px; }
.join-form .field{ margin-bottom:18px; }
.join-form input, .join-form select, .join-form textarea{
  width:100%; padding:12px 14px; border-radius:4px; border:1px solid var(--line);
  font-family:'Work Sans',sans-serif; font-size:16px; background:var(--chalk);
}
.join-form textarea{ min-height:100px; resize:vertical; }
.join-info-card{ background:var(--pitch-dark); color:var(--chalk); border-radius:10px; padding:26px; }
.join-info-card h3{ color:var(--gold); font-size:20px; margin-bottom:10px; }
.join-info-card ul{ list-style:none; margin-top:14px; }
.join-info-card li{ font-family:'Space Mono',monospace; font-size:13px; padding:6px 0; border-bottom:1px solid var(--pitch); }
.status-msg{ font-size:13px; margin-top:10px; padding:10px 12px; border-radius:4px; display:none; }
.status-msg.show{ display:block; }
.status-ok{ background:#E8DBF7; color:var(--pitch-dark); }

footer{ background:var(--pitch-dark); color:#D7CCE6; padding:36px 24px; text-align:center; font-size:13px; }
.footer-brand{
  background:none; border:none; padding:0; margin:0; cursor:pointer;
  color:var(--chalk); font-family:'Anton',sans-serif; letter-spacing:1px; font-size:16px;
}
.footer-brand.active{ color:var(--gold); }

.sponsor-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; }
@media (max-width:820px){ .sponsor-grid{ grid-template-columns:1fr; } }
.sponsor-card{
  background:var(--chalk-card); border:1px solid var(--line); border-radius:10px; overflow:hidden; position:relative;
  transition:transform .15s ease, box-shadow .15s ease;
}
.sponsor-card.has-link{ cursor:pointer; }
.sponsor-card.has-link:hover{ transform:scale(1.05); box-shadow:0 10px 26px rgba(0,0,0,0.22); z-index:2; }
.sponsor-logo{ aspect-ratio:3/4; background:#fff; display:flex; align-items:center; justify-content:center; padding:12px; }
.sponsor-logo img{ max-width:100%; max-height:100%; object-fit:contain; }
.sponsor-info{ padding:16px; }
.sponsor-name{ font-family:'Anton',sans-serif; font-size:19px; margin-bottom:6px; }
.sponsor-desc{ font-size:13.5px; color:var(--ink-soft); margin-bottom:10px; }
.sponsor-link{ font-family:'Space Mono',monospace; font-size:12px; color:var(--pitch); font-weight:700; }
.sponsor-link:hover{ text-decoration:underline; }
.become-sponsor-heading{ font-size:clamp(30px,5vw,44px); margin-top:36px; }
.divider{ height:1px; background:var(--line); max-width:1280px; margin:0 auto; }
