:root{
  --turf-900:#0d2b1f;
  --turf-700:#144a33;
  --turf-500:#1f6e4a;
  --chalk:#f5f3ea;
  --chalk-dim:#d9d5c4;
  --flag-gold:#f2b632;
  --flag-red:#d5482f;
  --ink:#0d2b1f;
  --radius:2px;
  --display: 'Archivo Black', system-ui, sans-serif;
  --body: 'Archivo', system-ui, sans-serif;
  --mono: 'Space Mono', monospace;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--body);
  color:var(--ink);
  background:var(--chalk);
  line-height:1.5;
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
}

.wrap{max-width:1120px; margin:0 auto; padding:0 24px;}
a{color:inherit;}
h1,h2,h3{font-family:var(--display); line-height:1.05; margin:0 0 .4em;}
p{margin:0 0 1em;}
:focus-visible{outline:3px solid var(--flag-gold); outline-offset:2px;}

.eyebrow{
  font-family:var(--mono); text-transform:uppercase; letter-spacing:.08em;
  font-size:.78rem; color:var(--turf-700); margin-bottom:1em;
}
.eyebrow-light{color:var(--flag-gold);}

/* Header */
.site-header{
  position:sticky; top:0; z-index:20;
  background:var(--chalk); border-bottom:2px solid var(--ink);
}
.header-row{display:flex; align-items:center; gap:24px; height:68px;}
.brand{
  display:flex; align-items:center; gap:10px;
  font-family:var(--display); font-size:1.05rem; text-decoration:none;
}
.brand-mark{
  width:18px; height:18px; background:var(--flag-red);
  clip-path:polygon(0 0, 100% 0, 78% 50%, 100% 100%, 0 100%);
}
.main-nav{display:flex; gap:28px; margin-left:auto; font-size:.92rem; font-weight:600;}
.main-nav a{text-decoration:none;}
.main-nav a:hover{text-decoration:underline; text-decoration-color:var(--flag-gold); text-decoration-thickness:3px;}

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--body); font-weight:700; font-size:.95rem;
  padding:12px 22px; border-radius:var(--radius); text-decoration:none;
  border:2px solid var(--ink); cursor:pointer; transition:transform .12s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--flag-gold); color:var(--ink);}
.btn-ghost{background:transparent; color:var(--ink);}
.btn-small{padding:9px 16px; font-size:.85rem;}
.btn-full{width:100%;}

/* Hero */
.hero{background:var(--turf-900); color:var(--chalk); padding:72px 0 56px; overflow:hidden;}
.hero-grid{display:grid; grid-template-columns:1.2fr .8fr; gap:48px; align-items:center;}
.hero h1{font-size:clamp(2.4rem, 5vw, 3.6rem); color:var(--chalk);}
.hero-sub{font-size:1.05rem; max-width:46ch; color:var(--chalk-dim);}
.hero-actions{display:flex; gap:14px; margin:8px 0 40px; flex-wrap:wrap;}
.hero .btn-ghost{border-color:var(--chalk-dim); color:var(--chalk);}

.hero-stats{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin:0;}
.hero-stats div{border-left:2px solid var(--flag-gold); padding-left:10px;}
.hero-stats dt{font-family:var(--mono); font-size:.7rem; text-transform:uppercase; letter-spacing:.06em; color:var(--chalk-dim); margin-bottom:2px;}
.hero-stats dd{margin:0; font-family:var(--display); font-size:1.5rem; color:var(--flag-gold);}

.hero-visual{position:relative; height:280px;}
.flag-belt{position:relative; width:100%; height:100%;}
.flag{
  position:absolute; width:64%; height:16px; border-radius:0 0 3px 3px;
  box-shadow:0 10px 24px rgba(0,0,0,.35);
}
.flag-1{background:var(--flag-gold); top:26%; left:6%; animation:pull1 3.6s ease-in-out infinite;}
.flag-2{background:var(--chalk); top:48%; left:18%; animation:pull2 3.6s ease-in-out infinite .3s;}
.flag-3{background:var(--flag-red); top:70%; left:2%; animation:pull3 3.6s ease-in-out infinite .6s;}
@keyframes pull1{0%,100%{transform:translateX(0) rotate(-2deg);}50%{transform:translateX(38px) rotate(3deg);}}
@keyframes pull2{0%,100%{transform:translateX(0) rotate(1deg);}50%{transform:translateX(-30px) rotate(-2deg);}}
@keyframes pull3{0%,100%{transform:translateX(0) rotate(-1deg);}50%{transform:translateX(44px) rotate(2deg);}}

/* Strip */
.strip{background:var(--chalk); border-bottom:2px solid var(--ink); padding:48px 0;}
.strip-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:32px;}
.strip-num{font-family:var(--mono); font-size:.75rem; text-transform:uppercase; letter-spacing:.08em; color:var(--turf-500); display:block; margin-bottom:8px;}
.strip-item h3{font-size:1.15rem;}
.strip-item p{color:#41503f; font-size:.95rem; margin:0;}

/* Directory */
.directory{padding:64px 0; background:var(--chalk);}
.directory-head h2{font-size:2rem;}
.directory-head p{color:#41503f;}

.controls{display:flex; gap:10px; margin:24px 0 20px; flex-wrap:wrap;}
.controls input, .controls select{
  font-family:var(--body); font-size:.95rem; padding:11px 14px;
  border:2px solid var(--ink); border-radius:var(--radius); background:#fff;
}
.controls input{flex:1; min-width:220px;}

.table-wrap{border:2px solid var(--ink); overflow-x:auto;}
table{width:100%; border-collapse:collapse; font-size:.92rem;}
thead th{
  text-align:left; font-family:var(--mono); text-transform:uppercase; letter-spacing:.05em;
  font-size:.72rem; background:var(--turf-900); color:var(--chalk); padding:12px 14px;
  position:sticky; top:68px;
}
tbody td{padding:11px 14px; border-top:1px solid var(--chalk-dim);}
tbody tr:hover{background:#eee9d8;}
.loading{text-align:center; color:#7c876f; padding:32px;}
.status-pill{
  display:inline-block; font-family:var(--mono); font-size:.7rem; text-transform:uppercase;
  padding:2px 8px; border-radius:10px; letter-spacing:.03em;
}
.status-varsity{background:#dcefe2; color:var(--turf-700);}
.status-club{background:#fdeacb; color:#8a5a12;}
.status-announced{background:#e6e2f5; color:#463a8f;}
.contact-link{font-weight:600; text-decoration:underline; text-decoration-color:var(--flag-gold); text-decoration-thickness:2px;}
.contact-locked{color:#8a8a7a; font-family:var(--mono); font-size:.82rem;}
.result-count{font-family:var(--mono); font-size:.8rem; color:#7c876f; margin-top:12px;}

/* Membership */
.membership{background:var(--turf-900); color:var(--chalk); padding:72px 0;}
.membership-grid{display:grid; grid-template-columns:1.3fr .7fr; gap:56px; align-items:start;}
.membership h2{font-size:2.2rem;}
.membership-sub{color:var(--chalk-dim); max-width:52ch;}
.membership-list{list-style:none; padding:0; margin:24px 0 0; display:grid; gap:12px;}
.membership-list li{padding-left:26px; position:relative; color:var(--chalk-dim);}
.membership-list li::before{
  content:''; position:absolute; left:0; top:6px; width:14px; height:14px;
  background:var(--flag-gold); clip-path:polygon(0 0, 100% 0, 78% 50%, 100% 100%, 0 100%);
}
.price-card{background:var(--chalk); color:var(--ink); border-radius:var(--radius); padding:32px; border:2px solid var(--flag-gold);}
.price-label{font-family:var(--mono); text-transform:uppercase; font-size:.75rem; letter-spacing:.06em; color:var(--turf-700);}
.price{margin:6px 0 24px;}
.price-amount{font-family:var(--display); font-size:2.6rem;}
.price-period{font-family:var(--mono); color:#7c876f;}
.price-note{font-size:.78rem; color:#7c876f; text-align:center; margin:10px 0 0;}

/* Footer */
.site-footer{background:var(--ink); color:var(--chalk-dim); padding:24px 0;}
.footer-row{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:.85rem;}
.footer-row a{color:var(--flag-gold);}

/* Auth modal */
.modal-backdrop{
  position:fixed; inset:0; background:rgba(13,43,31,.6);
  display:flex; align-items:center; justify-content:center; z-index:50; padding:20px;
}
.modal-backdrop[hidden]{display:none;}
.modal{
  background:var(--chalk); border:2px solid var(--ink); border-radius:var(--radius);
  padding:32px; max-width:380px; width:100%; position:relative;
}
.modal-close{
  position:absolute; top:12px; right:14px; background:none; border:none;
  font-size:1.4rem; cursor:pointer; line-height:1; color:var(--ink);
}
.modal h3{margin-bottom:4px;}
.modal-sub{color:#41503f; font-size:.9rem; margin-bottom:20px;}
#auth-form{display:flex; flex-direction:column; gap:6px;}
#auth-form label{font-family:var(--mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; margin-top:10px;}
#auth-form input{
  font-family:var(--body); font-size:.95rem; padding:10px 12px;
  border:2px solid var(--ink); border-radius:var(--radius);
}
#auth-form button[type="submit"]{margin-top:18px;}
.auth-error{color:var(--flag-red); font-size:.85rem; margin:10px 0 0;}
.auth-success{color:var(--turf-700); font-size:.85rem; margin:10px 0 0;}
.password-field{position:relative; display:flex;}
.password-field input{flex:1; padding-right:56px;}
.password-toggle{
  position:absolute; right:6px; top:50%; transform:translateY(-50%);
  background:none; border:none; font-family:var(--mono); font-size:.72rem;
  text-transform:uppercase; letter-spacing:.04em; color:var(--turf-700);
  cursor:pointer; padding:4px 6px;
}
.auth-forgot{text-align:right; margin:8px 0 0;}
.auth-forgot button{
  background:none; border:none; font-size:.8rem; color:#41503f;
  text-decoration:underline; cursor:pointer; padding:0;
}
.auth-toggle{text-align:center; font-size:.85rem; margin:18px 0 0; color:#41503f;}
.auth-toggle button{
  background:none; border:none; font-weight:700; text-decoration:underline;
  cursor:pointer; color:var(--turf-700); font-size:.85rem; padding:0 0 0 4px;
}

@media (max-width:860px){
  .hero-grid, .membership-grid, .strip-grid{grid-template-columns:1fr;}
  .hero-visual{height:160px; order:-1;}
  .hero-stats{grid-template-columns:repeat(2,1fr);}
  .main-nav{display:none;}
}