:root{
  --sky:#89ACFE; --sky-2:#B9CDFE; --pale:#EEF3FF; --navy:#2C5595; --ink:#16213A;
  --muted:#5B6782; --line:#DCE4F5; --white:#fff; --gold:#F5B82E; --silver:#AEB8C8; --bronze:#D98A4E;
  --radius:18px;
}
*{box-sizing:border-box}
body{margin:0;font-family:Nunito,system-ui,sans-serif;color:var(--ink);background:var(--white);font-size:17px;line-height:1.55}
a{color:var(--navy)}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}

/* header */
header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}
.nav{display:flex;align-items:center;gap:24px;height:76px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--navy);font-weight:900;font-size:20px;letter-spacing:-.2px}
.brand img{width:52px;height:52px}
.links{display:flex;gap:22px;margin-left:auto}
.links a{text-decoration:none;color:var(--ink);font-weight:700;font-size:16px}
.links a:hover{color:var(--navy)}
.btn{display:inline-block;border:0;border-radius:999px;padding:12px 22px;font:inherit;font-weight:800;text-decoration:none;cursor:pointer;transition:transform .15s ease}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--navy);color:#fff}
.btn-light{background:#fff;color:var(--navy);box-shadow:inset 0 0 0 2px var(--navy)}
.nav .btn{padding:10px 18px;font-size:15px}

/* hero */
.hero{background:linear-gradient(180deg,var(--pale) 0%,#fff 100%);overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;padding-top:64px;padding-bottom:72px}
.eyebrow{display:inline-block;background:#fff;color:var(--navy);font-weight:800;font-size:14px;padding:6px 14px;border-radius:999px;box-shadow:0 0 0 1px var(--line)}
h1{font-size:54px;line-height:1.05;margin:18px 0 16px;color:var(--navy);font-weight:900;letter-spacing:-1px}
h1 span{color:var(--sky)}
.lead{font-size:20px;color:var(--muted);max-width:540px;margin:0 0 28px}
.cta{display:flex;gap:12px;flex-wrap:wrap}
.hero-logo{justify-self:center;position:relative}
.hero-logo img{width:340px;height:340px;filter:drop-shadow(0 18px 30px rgba(44,85,149,.18));animation:bob 3.2s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-10px)}}
@media (prefers-reduced-motion:reduce){.hero-logo img{animation:none}}

/* round banner */
.round{margin-top:-36px;position:relative}
.round-card{background:var(--navy);color:#fff;border-radius:var(--radius);padding:22px 28px;display:flex;align-items:center;gap:28px;flex-wrap:wrap;box-shadow:0 14px 30px rgba(44,85,149,.25)}
.round-card .label{font-size:14px;font-weight:700;color:var(--sky-2);text-transform:uppercase;letter-spacing:.8px}
.round-card .big{font-size:24px;font-weight:900}
.count{display:flex;gap:10px;margin-left:auto}
.count div{background:rgba(255,255,255,.12);border-radius:12px;padding:8px 14px;text-align:center;min-width:70px}
.count b{display:block;font-size:26px;line-height:1.1}
.count small{color:var(--sky-2);font-weight:700;font-size:12px}

/* sections */
section{padding:72px 0}
h2{font-size:34px;color:var(--navy);margin:0 0 8px;font-weight:900;letter-spacing:-.5px}
.sub{color:var(--muted);margin:0 0 28px}

/* league table */
.table-head{display:flex;align-items:end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.tabs{display:inline-flex;background:var(--pale);border-radius:999px;padding:5px}
.tabs button{border:0;background:transparent;font:inherit;font-weight:800;font-size:15px;padding:9px 18px;border-radius:999px;color:var(--muted);cursor:pointer}
.tabs button.on{background:#fff;color:var(--navy);box-shadow:0 2px 6px rgba(22,33,58,.1)}
.filters{display:flex;gap:10px;flex-wrap:wrap}
select{font:inherit;font-weight:700;font-size:15px;border:1px solid var(--line);border-radius:12px;padding:9px 12px;background:#fff;color:var(--ink)}
.board{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
table{width:100%;border-collapse:collapse}
th{background:var(--pale);text-align:left;font-size:13px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);padding:12px 18px}
td{padding:14px 18px;border-top:1px solid var(--line);font-weight:600}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
.pos{width:64px}
.medal{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;font-weight:900;font-size:15px;color:#fff}
.m1{background:var(--gold)}.m2{background:var(--silver)}.m3{background:var(--bronze)}
.plain{background:var(--pale);color:var(--navy)}
.team{font-weight:800}
.school{color:var(--muted);font-weight:600;font-size:15px}
.score{font-weight:900;color:var(--navy);font-size:19px}
.counted{color:var(--muted);font-size:14px}
tr.me td{background:#FFFBEA}

/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.step{background:var(--pale);border-radius:var(--radius);padding:24px}
.step .n{width:40px;height:40px;border-radius:50%;background:var(--sky);color:#fff;display:grid;place-items:center;font-weight:900;font-size:19px;margin-bottom:12px}
.step h3{margin:0 0 6px;color:var(--navy);font-size:19px}
.step p{margin:0;color:var(--muted);font-size:16px}

/* disciplines */
.disc{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.d{border:2px solid var(--line);border-radius:16px;padding:18px 14px;text-align:center;font-weight:800;color:var(--navy)}
.d small{display:block;font-weight:700;color:var(--muted);font-size:13px;margin-top:4px}
.d.live{border-color:var(--sky);background:var(--pale)}
.d.live small{color:var(--navy)}
.d.soon{opacity:.55}

/* join */
.join{background:var(--navy);color:#fff;border-radius:28px;padding:48px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}
.join h2{color:#fff}
.join p{color:var(--sky-2);margin:0;font-size:18px}
.join .btn-primary{background:#fff;color:var(--navy)}
footer{padding:36px 0;color:var(--muted);font-size:15px;border-top:1px solid var(--line);margin-top:72px}
footer .wrap{display:flex;gap:18px;flex-wrap:wrap;align-items:center}
footer .sp{margin-left:auto}


@media (max-width:900px){
  .hero .wrap{grid-template-columns:1fr;text-align:center;padding-top:40px}
  .lead{margin-left:auto;margin-right:auto}.cta{justify-content:center}
  .hero-logo img{width:220px;height:220px}
  h1{font-size:40px}
  .steps{grid-template-columns:1fr 1fr}
  .disc{grid-template-columns:repeat(3,1fr)}
  .join{grid-template-columns:1fr;padding:32px}
  .links{display:none}
  .nav .btn{margin-left:auto}
  .count{margin-left:0}
}
@media (max-width:560px){
  .steps{grid-template-columns:1fr}.disc{grid-template-columns:1fr 1fr}
  td,th{padding:12px 10px}.hide-sm{display:none}
  .brand span{display:none}
}

.empty-row td{text-align:center;color:var(--muted);padding:34px 18px;font-weight:700}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(120px);opacity:0;color:#fff;font-weight:800;padding:14px 22px;border-radius:14px;transition:all .25s ease;z-index:50}
.toast.show{transform:translateX(-50%);opacity:1}
.round-card .note{color:var(--sky-2);font-weight:700;margin-left:auto}