:root {
  /* Primary Purple Theme, inspired by new-main.css */
  --bg-1: #2B1B54;
  --bg-2: #7c3aed;
  --bg-3: #A374FF;
  --card: rgba(59, 42, 112, 0.55);
  --muted: rgba(255,255,255,0.90);
  --text: #ffffff;
  --text-strong: #ffffff;
  --primary: #7c3aed;
  --primary-light: #9B6DFF;
  --primary-dark: #5B21EA;
  --header-height: 80px;
  --glass-border: rgba(155, 109, 255, 0.12);
}

/* Reset */
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: var(--header-height); }
body {
  font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  color: var(--text);
  background: linear-gradient(135deg, var(--bg-1) 0%, var(--bg-2) 50%, var(--bg-3) 100%);
  background-attachment: fixed;
  padding-top: 0; /* header sits at the absolute top */
  -webkit-font-smoothing: antialiased;
}

/* Particles background layer - sits behind content */
.particles-background {
  position: fixed;
  inset: 0; /* top:0; right:0; bottom:0; left:0 */
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(124,58,237,0.04) 0%, rgba(124,58,237,0.02) 30%, transparent 60%);
}

/* Ensure main content and hero sit above the particles canvas */
main, .hero, .card, .site-header, .container { position: relative; }
main { z-index: 2; padding-top: var(--header-height); }
.hero { z-index: 2; }
.site-header { z-index: 1200; top: 0; left: 0; right: 0; }

/* Container */
.container { max-width: 1200px; margin: 0 auto; padding: 0 1.5rem; }

/* Header */
.site-header {
  height: var(--header-height);
  --muted: #C4B5FF;
  --text: #ffffff;
  --text-strong: rgba(242,238,255,0.98);
  background: linear-gradient(180deg, rgba(11,8,22,0.55), rgba(11,8,22,0.35));
  border-bottom: 1px solid var(--glass-border);
}
.navbar { padding: 0.6rem 0; }
.navbar-brand { display: flex; align-items: center; gap: 1rem; text-decoration: none; }
.logo { width: 56px; height: 56px; border-radius: 12px; box-shadow: 0 8px 30px rgba(155,109,255,0.12); }
.brand-text h1 { font-size: 1.25rem; font-weight: 800; margin: 0; color: var(--text-strong); }
.brand-text .tag { color: var(--muted); font-size: 0.85rem; margin: 0; }
.navbar-nav { display: flex; gap: 0.5rem; align-items: center; }
.nav-link { color: var(--text); padding: 0.5rem 0.75rem; border-radius: 8px; transition: all 0.18s ease; text-decoration: none; }
.nav-link:hover { color: var(--text); background: rgba(124,58,237,0.12); }

/* Hero */
.hero { padding: 6rem 1.5rem; border-radius: 20px; margin-bottom: 3.5rem; position: relative; overflow: hidden; }
.hero-inner { text-align: center; max-width: 980px; margin: 0 auto; }
.hero-logo { width: 110px; height: 110px; border-radius: 20px; box-shadow: 0 0 48px rgba(163,116,255,0.15); display:inline-block; }
.hero-title {
  font-size: 2.4rem;
  margin-top: 1rem;
  font-weight: 800;
  line-height: 1.05;
  color: #000000 !important;
  background: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  -webkit-text-fill-color: initial;
  text-shadow: none;
}
.hero-subtitle { margin-top: 1rem; font-size: 1.1rem; color: var(--text); }
.stats-row { display:flex; gap:2.5rem; justify-content:center; margin-top:2rem; }
.stat-item { text-align:center; }
.stat-value { font-size:2rem; font-weight:700; color: var(--text); }
.stat-label { color: var(--text); font-size:0.95rem; }

/* Cards */
.card { background: linear-gradient(180deg, rgba(16,12,30,0.72), rgba(36,24,70,0.72)); border-radius: 18px; padding: 2.25rem; border: 1px solid rgba(255,255,255,0.04); box-shadow: 0 10px 48px rgba(11,7,30,0.5); margin-bottom: 2.5rem; }
.card h2 { margin-bottom:1rem; color: var(--text); }

/* About */
.about-grid { display:grid; grid-template-columns: 1fr 380px; gap:2.5rem; align-items:center; }
.feature-item { background: rgba(12,9,26,0.72); padding:1.25rem; border-radius:12px; border:1px solid rgba(255,255,255,0.06); }
.feature-item h3 { color: var(--text); margin-bottom:0.5rem; }
.feature-item p { color: var(--text); }
.about-media { text-align:center; }
.about-media img { width: 180px; height:180px; border-radius:18px; box-shadow: 0 12px 48px rgba(155,109,255,0.12); }

/* Roster */
.roster { list-style:none; padding:0; margin:0; }
.roster li { display:flex; justify-content:space-between; align-items:center; padding:0.9rem 1rem; border-radius:12px; background: rgba(11,8,22,0.4); border:1px solid rgba(155,109,255,0.05); margin-bottom:0.8rem; }
.roster .name { font-weight:700; color:var(--text); }
.roster .role { color: var(--text); background: rgba(124,58,237,0.12); padding:0.35rem 0.8rem; border-radius:20px; }

/* Sponsors */
.sponsor-list { display:flex; gap:1rem; flex-wrap:wrap; }
.sponsor { padding:0.8rem 1.25rem; border-radius:10px; background: rgba(11,8,22,0.72); color:var(--text); border:1px solid rgba(155,109,255,0.06); text-decoration:none; }

/* Contact & Footer */
.contact-email { color: var(--text); font-weight:700; }
.site-footer { margin-top:3rem; padding:2rem 0; text-align:center; color:var(--text); }

/* Utilities */
.text-muted { color: var(--text) !important; opacity: 0.95; }

/* Ensure important content within cards and lists is clearly visible */
.card, .card h2, .card p, .card li, .card ul, .card ol { color: var(--text) !important; }
.feature-list, .feature-list li, .feature-list li strong { color: var(--text) !important; }
.feature-list li::marker { color: var(--text) !important; }
.feature-item p, .about-grid p { color: var(--text) !important; }
.hero-subtitle, .hero-subtitle .text-muted { color: var(--text) !important; }
.contact-email, .card a, .card a:visited { color: var(--text) !important; }

/* Spacing */
section { padding: 0; margin-bottom: 2.5rem; }

/* Responsive */
@media (max-width: 992px) { .about-grid { grid-template-columns: 1fr; } .hero-title { font-size:2rem; } }
@media (max-width: 576px) { .hero-logo { width:86px; height:86px; } .hero-title { font-size:1.6rem; } .stats-row { flex-direction:column; gap:1rem; } }

/* Reverted: removed forced left alignment and margin overrides */

