:root{
  color-scheme:light;
  --navy:#1B2A6B;
  --navy-dark:#141F52;
  --red:#D7282F;
  --red-dark:#B01F26;
  --paper:#FFFFFF;
  --wash:#F7F8FB;
  --ink:#1C2333;
  --muted:#6B7385;
  --line:#E4E7EF;
}
*{margin:0;padding:0;box-sizing:border-box}
html{background:#FFFFFF}
body{font-family:'Inter',sans-serif;color:var(--ink);background:var(--paper);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
h1,h2,h3{font-family:'Oswald',sans-serif;text-transform:uppercase;line-height:1.08}
.lbl{font-family:'Oswald';font-size:11px;font-weight:600;letter-spacing:3px;text-transform:uppercase}

/* ---------- Top nav ---------- */
nav{position:sticky;top:0;z-index:100;background:var(--navy);border-bottom:3px solid var(--red)}
.nav-inner{max-width:1220px;margin:0 auto;display:flex;align-items:center;padding:0 24px;height:66px;gap:4px}
.brand{display:flex;align-items:center;margin-right:auto;cursor:pointer;text-decoration:none}
.dmark{width:60px;height:60px;display:block}
.wordmark{display:flex;flex-direction:column;justify-content:center;margin-left:12px;font-family:'Oswald';font-weight:600;font-size:19px;line-height:1.15;letter-spacing:1.5px;text-transform:uppercase;color:#fff}
.nav-link{background:none;border:none;border-bottom:2px solid transparent;font-family:'Oswald';font-weight:600;font-size:15.5px;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,255,.92);padding:9px 13px;cursor:pointer;transition:all .15s}
.nav-link:hover{color:#fff}
.nav-link.active{color:#fff;border-bottom-color:var(--red)}
.nav-link .car{font-size:11px;opacity:.7;margin-left:3px}
.nav-link.has-caret{padding-right:0}
.nav-ticket-btn{font-family:'Oswald';font-weight:600;font-size:15.5px;letter-spacing:1.5px;text-transform:uppercase;color:#fff;background:transparent;border:2px solid #fff;padding:8px 16px;margin-left:20px;text-decoration:none;display:inline-flex;align-items:center;transition:all .15s}
.nav-ticket-btn:hover{background:rgba(255,255,255,.12)}
button:focus-visible,a:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.hamburger{display:none;background:none;border:none;color:#fff;font-size:26px;cursor:pointer;padding:8px}
.nav-links{display:flex;align-items:center;gap:2px}
.nav-item{position:relative}
.nav-item-row{display:flex;align-items:center}
.nav-item-row .nav-link{padding-right:0}
.nav-caret{background:none;border:none;color:rgba(255,255,255,.7);cursor:pointer;font-size:11px;padding:9px 5px 9px 0;transition:color .15s}
.nav-caret:hover{color:#fff}
.nav-dropdown{display:none;position:absolute;top:100%;left:0;background:#fff;border:1.5px solid var(--line);min-width:230px;z-index:60}
.nav-dropdown.open{display:block}
.nav-dropdown a{display:block;padding:12px 16px;font-family:'Oswald';font-size:12.5px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--navy);border-bottom:1.5px solid var(--line);text-decoration:none}
.nav-dropdown a:last-child{border-bottom:none}
.nav-dropdown a:hover{background:var(--wash);color:var(--red)}
@media(max-width:700px){
  .nav-links{display:none;position:absolute;top:66px;left:0;right:0;background:var(--navy);flex-direction:column;align-items:stretch;padding:12px;border-bottom:3px solid var(--red)}
  .nav-links.open{display:flex}
  .nav-link{text-align:left;padding:13px 14px}
  .hamburger{display:block}
  .nav-item{position:static}
  .nav-dropdown{position:static;background:transparent;border:none;border-top:1.5px solid rgba(255,255,255,.15);margin:2px 0 6px 14px}
  .nav-dropdown a{color:rgba(255,255,255,.85);border-bottom:none;padding:11px 14px}
  .nav-dropdown a:hover{background:rgba(255,255,255,.08);color:#fff}
}

/* ---------- Bottom tab bar (mobile) ---------- */
.tabbar{display:none}
@media(max-width:700px){
  body{padding-bottom:78px}
  .tabbar{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--navy);border-top:3px solid var(--red);z-index:120;padding-bottom:env(safe-area-inset-bottom)}
  .tab{flex:1;background:none;border:none;color:rgba(255,255,255,.8);font-family:'Oswald';font-weight:600;font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase;padding:9px 4px 11px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px;position:relative}
  .tab .ic{font-size:19px;line-height:1}
  .tab.active{color:#fff}
  .tab.active::before{content:'';position:absolute;top:-3px;left:20%;right:20%;height:3px;background:#fff}
}

/* ---------- Pages ---------- */
.page{display:none;animation:fade .3s ease;background:var(--paper)}
.page.active{display:block}
@keyframes fade{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.page{animation:none}*{transition:none!important}}
.wrap{max-width:1220px;margin:0 auto;padding:0 24px}
.section{padding:56px 0}
@media(max-width:700px){.section{padding:48px 0}.wrap{padding:0 16px}}

/* ---------- Buttons & chips ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:'Oswald';font-weight:600;font-size:13px;letter-spacing:2px;text-transform:uppercase;padding:14px 24px;border:1.5px solid transparent;cursor:pointer;text-decoration:none;transition:all .15s;min-height:48px}
.btn-red{background:var(--red);color:#fff}
.btn-red:hover{background:var(--red-dark)}
.btn-outline{background:#fff;color:var(--navy);border-color:var(--line)}
.btn-outline:hover{border-color:var(--navy)}
.btn-navy{background:var(--navy);color:#fff}
.btn-navy:hover{background:var(--navy-dark)}
.chip{font-family:'Oswald';font-weight:600;font-size:11.5px;letter-spacing:2px;text-transform:uppercase;padding:10px 16px;border:1.5px solid var(--navy);background:#fff;color:var(--navy);cursor:pointer;transition:all .12s;min-height:42px}
.chip:hover{background:var(--wash)}
.chip.on{background:var(--red);border-color:var(--red);color:#fff}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;background:#fff}
.hero-grid{position:relative;display:grid;grid-template-columns:minmax(min-content,7fr) minmax(0,9fr);gap:56px;align-items:stretch;padding-top:72px;padding-bottom:56px}
.hero-text{display:flex;flex-direction:column;justify-content:center}
.hero .eyebrow{margin-bottom:20px}
.eyebrow{display:flex;align-items:center;gap:12px;color:var(--red);margin-bottom:14px}
.eyebrow::before{content:'';width:34px;height:2.5px;background:var(--red)}
#page-home .eyebrow{font-size:16.5px}
.eyebrow a{color:inherit;text-decoration:none}
.eyebrow a:hover{text-decoration:underline;text-underline-offset:3px}
.hero h1{font-size:clamp(42px,5.6vw,68px);font-weight:700;letter-spacing:-.5px;line-height:.94;color:var(--navy)}
.hero h1 .red{color:var(--red)}
.hero p{margin:14px 0 40px;color:var(--muted);font-family:'Oswald';font-weight:500;font-size:17px;letter-spacing:1.6px;text-transform:uppercase;max-width:440px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.hero-actions .btn{font-size:17px;padding:16px 28px}
.hero-actions .btn-outline{border:2px solid var(--navy);padding:14.5px 28px}
.hero-photo{background:var(--wash);aspect-ratio:16/10;height:100%;position:relative;display:flex;align-items:center;justify-content:center;border:1.5px solid var(--line);padding:14px}
.bg-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.hero-photo .bg-img{object-fit:cover;object-position:center 70%}
.hero-photo .ph{font-family:'Oswald';font-weight:600;font-size:clamp(22px,2.6vw,32px);letter-spacing:2px;text-transform:uppercase;color:var(--navy);text-align:center;opacity:.85}
.hero-photo::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at center,rgba(27,42,107,0) 45%,rgba(27,42,107,.12) 100%)}
.hero-credit{position:absolute;right:6px;bottom:6px;z-index:2;background:rgba(27,42,107,.45);color:rgba(255,255,255,.85);font-family:'Oswald';font-weight:500;font-size:9.5px;letter-spacing:.3px;padding:3px 7px;text-decoration:none;text-transform:none}
.hero-credit:hover{background:rgba(27,42,107,.82);color:#fff;text-decoration:underline}
@media(max-width:860px){.hero-grid{grid-template-columns:1fr;gap:40px;padding-top:44px;padding-bottom:56px}.hero-photo{aspect-ratio:16/10}}
@media(max-width:700px){.hero-actions{flex-direction:column}.hero-actions .btn{width:100%}}

/* ---------- Status banner ---------- */
.status-banner{background:var(--red);color:#fff}
.status-banner-inner{max-width:1220px;margin:0 auto;padding:16px 24px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.status-banner .lbl{color:var(--red);background:#fff;padding:6px 12px;flex-shrink:0}
.status-banner .msg{font-size:14.5px;font-weight:600;line-height:1.4;flex:1;min-width:220px}
.status-banner .updated{font-family:'Oswald';font-size:10.5px;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,255,.8);white-space:nowrap}
@media(max-width:760px){.status-banner-inner{gap:8px;padding:14px 16px}}

/* ---------- Install app banner ---------- */
/* Small floating pill, mobile only — must not push page content or compete for
   attention like a top banner does; sits above the bottom tab bar. */
.install-banner{display:none;position:fixed;right:14px;bottom:calc(64px + env(safe-area-inset-bottom) + 12px);z-index:110;max-width:240px;background:var(--navy);border:1.5px solid rgba(255,255,255,.2)}
.install-banner.show{display:block}
.install-banner-inner{display:flex;align-items:flex-start;gap:8px;padding:12px 12px 12px 14px}
.install-banner .ib-text{flex:1;font-size:11.5px;line-height:1.4;color:rgba(255,255,255,.85)}
.install-banner .ib-text b{display:block;font-family:'Oswald';font-weight:700;font-size:11.5px;letter-spacing:1px;text-transform:uppercase;color:#fff;margin-bottom:3px}
.install-banner .ib-btn{display:block;margin-top:8px;font-family:'Oswald';font-weight:600;font-size:10.5px;letter-spacing:1px;text-transform:uppercase;color:var(--navy);background:#fff;border:none;padding:7px 12px;cursor:pointer;white-space:nowrap}
.install-banner .ib-btn:hover{background:var(--wash)}
.install-banner .ib-close{background:none;border:none;color:rgba(255,255,255,.5);font-size:16px;cursor:pointer;padding:0 2px;line-height:1;flex-shrink:0}
.install-banner .ib-close:hover{color:#fff}
@media(min-width:701px){.install-banner{display:none!important}}

/* ---------- Instagram follow prompt ---------- */
.ig-follow{display:flex;gap:12px;align-items:center;margin-top:6px;flex-wrap:wrap}
@media(max-width:700px){.ig-follow .btn{width:100%}}

/* ---------- Audience cards ---------- */
.cards4{display:grid;grid-template-columns:repeat(4,1fr);border:1.5px solid var(--line)}
.acard{display:flex;flex-direction:column;padding:28px 26px;border-right:1.5px solid var(--line);cursor:pointer;transition:background .15s;background:#fff}
.acard:last-child{border-right:none}
.acard:hover{background:var(--wash)}
.acard .who{color:var(--muted);font-size:11.5px;letter-spacing:2px;font-weight:600;margin-bottom:8px}
.acard h3{font-size:38.4px;font-weight:700;letter-spacing:-.3px;line-height:1.08;color:var(--navy);margin:0 0 10px}
.acard p{font-size:14.5px;color:var(--muted);line-height:1.5}
.acard .go{font-family:'Oswald';font-size:16px;font-weight:700;letter-spacing:1.5px;color:var(--red);margin-top:auto;padding-top:16px;display:inline-block}
@media(max-width:900px){.cards4{grid-template-columns:1fr 1fr}.acard:nth-child(2){border-right:none}.acard:nth-child(-n+2){border-bottom:1.5px solid var(--line)}}
@media(max-width:540px){.cards4{grid-template-columns:1fr}.acard{border-right:none;border-bottom:1.5px solid var(--line);padding:22px 20px}.acard:last-child{border-bottom:none}}

/* ---------- Sponsor showcase ---------- */
.sponsor-tier-group{margin-top:32px}
.sponsor-tier-group:first-child{margin-top:8px}
.sponsor-tier-label{font-family:'Oswald';font-weight:700;font-size:21px;letter-spacing:1.5px;text-transform:uppercase;color:var(--navy);padding-bottom:12px;border-bottom:1.5px solid var(--line);margin-bottom:20px}
.sponsor-tier-platinum .sponsor-tier-label,.sponsor-tier-silver .sponsor-tier-label{color:#fff;background:var(--navy);border-bottom:none;padding:14px 20px;margin-bottom:20px}
.sponsor-tier-silver .sponsor-tier-label{background:var(--red)}
.sponsor-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
@media(max-width:900px){.sponsor-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:700px){.sponsor-grid{grid-template-columns:1fr 1fr;gap:10px}}
.sponsor-tile{height:130px;perspective:1000px}
.sponsor-tier-platinum .sponsor-tile{height:150px}
.sponsor-flip-inner{position:relative;width:100%;height:100%;transition:transform .4s;transform-style:preserve-3d;border:1.5px solid var(--line);background:#fff}
.sponsor-tile.flippable{cursor:pointer}
@media(hover:hover){.sponsor-tile.flippable:hover .sponsor-flip-inner{transform:rotateY(180deg)}}
.sponsor-tile.flippable.flipped .sponsor-flip-inner{transform:rotateY(180deg)}
.sponsor-face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;backface-visibility:hidden;padding:16px}
.sponsor-face.back{transform:rotateY(180deg);background:var(--navy)}
.sponsor-face img{max-width:100%;max-height:100%;object-fit:contain}
.sponsor-face .name-fallback{font-family:'Oswald';font-weight:700;color:var(--navy);text-align:center;font-size:14px;letter-spacing:.5px;text-transform:uppercase;line-height:1.3}
.sponsor-back-links{display:flex;gap:18px;align-items:center;justify-content:center;width:100%}
.sponsor-back-links a{color:#fff;font-family:'Oswald';font-weight:600;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:4px}
.tile-tap-hint{display:none}
/* Desktop hover already reveals the back face when the cursor lands on a tile
   — that's affordance enough. Touch devices have no hover, so the flip is
   invisible until tapped once by accident; this badge only renders where
   hover doesn't exist, so it never shows on desktop. */
@media(hover:none){
  .sponsor-tile.flippable .tile-tap-hint{
    display:block;position:absolute;bottom:8px;right:8px;
    font-family:'Oswald';font-weight:600;font-size:9px;letter-spacing:1.5px;text-transform:uppercase;
    color:var(--muted);background:var(--wash);border:1px solid var(--line);
    padding:2px 7px;pointer-events:none;
  }
  .sponsor-tile.flippable.flipped .tile-tap-hint{display:none}
}
@media(prefers-reduced-motion:reduce){
  .sponsor-face{backface-visibility:visible}
  .sponsor-face.back{transform:none;opacity:0;pointer-events:none}
  .sponsor-tile.flippable.flipped .sponsor-flip-inner{transform:none}
  .sponsor-tile.flippable.flipped .sponsor-face.front{opacity:0}
  .sponsor-tile.flippable.flipped .sponsor-face.back{opacity:1;pointer-events:auto}
}
@media(prefers-reduced-motion:reduce) and (hover:hover){
  .sponsor-tile.flippable:hover .sponsor-flip-inner{transform:none}
  .sponsor-tile.flippable:hover .sponsor-face.front{opacity:0}
  .sponsor-tile.flippable:hover .sponsor-face.back{opacity:1;pointer-events:auto}
}
.sponsor-invite{display:block;text-align:center;padding:34px 28px;margin-top:36px;border:1.5px solid var(--line);background:#fff;font-family:'Oswald';font-weight:600;font-size:17px;letter-spacing:.3px;color:var(--navy);text-decoration:none;transition:background .15s}
.sponsor-invite:hover{background:var(--wash)}
.sponsor-invite .accent{color:var(--red);text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:3px}
@media(max-width:700px){.sponsor-invite{padding:24px 18px;font-size:15px}}
#sponsorShowcase{scroll-margin-top:var(--nav-h,64px)}

/* ---------- Instagram feed placeholder (future Behold embed) ---------- */
.ig-feed-placeholder{border:1.5px solid var(--line);background:var(--wash);padding:24px;margin-top:24px}
.ig-feed-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-bottom:16px}
.ig-tile{aspect-ratio:1;background:linear-gradient(150deg,#1B2A6B,#141F52)}
.ig-feed-label{text-align:center;font-family:'Oswald';font-weight:600;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}
@media(max-width:700px){.ig-feed-grid{grid-template-columns:repeat(3,1fr)}}

/* ---------- Section headers ---------- */
.sec-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:30px;flex-wrap:wrap}
h2{font-size:clamp(26px,3.6vw,40px);font-weight:700;letter-spacing:1px;color:var(--navy)}
.sec-sub{color:var(--muted);font-size:15px;max-width:560px;margin-top:8px}

/* ---------- Sponsorship page hero (same side-by-side treatment as the home hero) ---------- */
.sponsor-hero-grid{display:grid;grid-template-columns:minmax(min-content,6fr) minmax(0,6fr);gap:40px;align-items:center;margin-bottom:44px}
.sponsor-hero{position:relative;overflow:hidden;border:1.5px solid var(--line);aspect-ratio:16/10}
.sponsor-hero .bg-img{object-fit:cover;object-position:center 58%}
.sponsor-hero-caption{position:absolute;right:6px;bottom:6px;z-index:2;background:rgba(27,42,107,.45);color:rgba(255,255,255,.85);font-family:'Oswald';font-weight:500;font-size:9.5px;letter-spacing:.3px;padding:3px 7px}
@media(max-width:860px){.sponsor-hero-grid{grid-template-columns:1fr;gap:24px}}

/* ---------- Stats band ---------- */
.band{background:var(--wash);border-top:1.5px solid var(--line);border-bottom:1.5px solid var(--line)}
.stats{display:grid;grid-template-columns:repeat(4,1fr)}
.stat{padding:36px 26px;border-right:1.5px solid var(--line);text-align:center}
.stat:last-child{border-right:none}
.stat b{font-family:'Oswald';font-weight:700;font-size:42px;color:var(--red);display:block;line-height:1}
.stat span{color:var(--navy);margin-top:10px;display:inline-block}
@media(max-width:760px){.stats{grid-template-columns:1fr 1fr}.stat{padding:26px 18px}.stat b{font-size:34px}.stat:nth-child(2){border-right:none}.stat:nth-child(-n+2){border-bottom:1.5px solid var(--line)}}

/* ---------- Filters ---------- */
.filter-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.filter-bar .lbl{color:var(--muted);margin-right:4px;min-width:70px}
@media(max-width:700px){
  .filter-bar{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px;margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px}
  .filter-bar::-webkit-scrollbar{display:none}
  .filter-bar .lbl{min-width:auto;flex:none}
  .chip{flex:none;white-space:nowrap}
}

/* ---------- Schedule: view toggle ---------- */
.seg{display:inline-flex;border:1.5px solid var(--navy)}
.seg button{font-family:'Oswald';font-weight:600;font-size:12px;letter-spacing:2px;text-transform:uppercase;padding:11px 22px;background:#fff;color:var(--navy);border:none;cursor:pointer;min-height:44px}
.seg button.on{background:var(--navy);color:#fff}
.seg button:not(:last-child){border-right:1.5px solid var(--navy)}
@media(max-width:700px){.seg{width:100%}.seg button{flex:1}}

/* ---------- Schedule: game day cards ---------- */
#page-schedule{background:var(--wash)}
.gday{border:1.5px solid var(--line);margin-bottom:28px;background:#fff}
.gday.next{border:2px solid var(--red)}
.gday-head{display:flex;align-items:center;gap:16px;padding:18px 22px;border-bottom:2px solid var(--navy);background:var(--wash);flex-wrap:wrap}
.gday.next .gday-head{background:var(--red);border-bottom-color:var(--red-dark);color:#fff}
.gday-date{font-family:'Oswald';font-weight:700;font-size:18px;letter-spacing:1.5px;text-transform:uppercase;color:var(--navy)}
.gday.next .gday-date{color:#fff}
.gday-venue{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:6px}
.gday.next .gday-venue{color:#fff}
.gday-venue a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.region-flag{font-family:'Oswald';font-weight:600;font-size:10px;letter-spacing:2.5px;text-transform:uppercase;background:var(--red);color:#fff;padding:4px 10px}
.next-flag{font-family:'Oswald';font-weight:600;font-size:10px;letter-spacing:2.5px;text-transform:uppercase;background:#fff;color:var(--red);padding:4px 10px}
.event-flag{font-family:'Oswald';font-weight:700;font-size:11px;letter-spacing:2px;text-transform:uppercase;background:var(--navy);color:#fff;padding:5px 11px}
.gday.next .event-flag{background:#fff;color:var(--red)}
/* The region badge is red-on-red inside the featured card's red header, which
   erases its badge shape — outline it instead of filling it, and keep it
   visually distinct from the solid-white .event-flag sitting beside it. */
.gday.next .region-flag{background:transparent;border:1.5px solid rgba(255,255,255,.6);color:#fff;padding:2.5px 8.5px}
.gday-count{flex-basis:100%;font-family:'Oswald';font-weight:700;font-size:22px;letter-spacing:1.5px;text-transform:uppercase;color:#fff;background:rgba(255,255,255,.16);padding:10px 16px;display:flex;align-items:center;gap:8px;margin:2px 0}
.gday-actions{margin-left:auto;display:flex;gap:8px}
.gday.next .gday-actions{margin-left:0}
.mini-btn{font-family:'Oswald';font-weight:600;font-size:10.5px;letter-spacing:1.5px;text-transform:uppercase;padding:9px 14px;border:1.5px solid var(--line);background:#fff;color:var(--navy);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-height:40px}
.mini-btn:hover{border-color:var(--red);color:var(--red)}
.mini-btn.solid{background:var(--navy);border-color:var(--navy);color:#fff}
.mini-btn.solid:hover{background:var(--navy-dark)}
.gday.next .mini-btn{border-color:rgba(255,255,255,.5);background:transparent;color:#fff}
.gday.next .mini-btn:hover{background:#fff;color:var(--red)}
@media(max-width:700px){
  .gday-head{padding:14px 16px;gap:10px}
  .gday-count{font-size:18px;padding:8px 14px}
  .gday-actions{margin-left:0;width:100%;flex-wrap:wrap}
  .gday-actions .mini-btn{flex:1 1 auto;min-width:130px}
}
.gline{display:grid;grid-template-columns:150px 90px 1fr auto;gap:16px;align-items:center;padding:14px 22px;border-bottom:1.5px solid var(--line)}
.gline:last-child{border-bottom:none}
.tbadge{font-family:'Oswald';font-weight:600;font-size:10.5px;letter-spacing:2px;text-transform:uppercase;padding:4px 10px;display:inline-block;text-align:center}
.tb-vb{background:var(--navy);color:#fff}
.tb-vg{background:var(--red);color:#fff}
.tb-jb,.tb-jg,.tb-fb{background:#fff;color:var(--navy);border:1.5px solid var(--navy)}
.gline .time{font-family:'Oswald';font-weight:700;font-size:15px;letter-spacing:1px;color:var(--ink)}
.gline .opp{font-size:14px;color:var(--muted)}
.gline .opp b{font-family:'Oswald';font-weight:600;font-size:15px;letter-spacing:1px;text-transform:uppercase;color:var(--ink)}
.gline .right{text-align:right}
.g-status{font-family:'Oswald';font-weight:600;font-size:10.5px;letter-spacing:2.5px;text-transform:uppercase;color:var(--muted)}
.g-score{font-family:'Oswald';font-weight:700;font-size:18px;letter-spacing:1px}
.g-score.w{color:#1E7A38}.g-score.l{color:var(--red)}
@media(max-width:700px){
  .gline{grid-template-columns:auto 1fr auto;gap:12px;padding:13px 16px}
  .gline .time{font-size:16px}
  .gline .opp{display:none}
  .gline .opp-mobile{display:block;grid-column:1/-1;font-size:13px;color:var(--muted);margin-top:-6px}
  .gline .opp-mobile b{font-family:'Oswald';letter-spacing:1px;text-transform:uppercase;color:var(--ink)}
}
.gline .opp-mobile{display:none}

/* ---------- Collapsible game-day rows (schedule list) ----------
   Flat treatment per the design system: hairline rules, squared corners, no
   shadows. Hierarchy comes from type scale + a team-colored left rule. */
.gacc{border-bottom:1.5px solid var(--line);background:#fff}
.gacc:first-of-type{border-top:1.5px solid var(--line)}
.gacc-head{width:100%;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
  padding:22px 24px;border:none;cursor:pointer;text-align:left;
  font:inherit;color:inherit;transition:background .15s;
  /* Pins under the sticky nav while you scroll an expanded day, so the date you
     are looking at is always on screen. A collapsed .gacc is barely taller than
     its own header, so sticky has no range there and those scroll away normally
     — no stack of pinned bars, without needing a JS toggle. Must be opaque and
     above .grow rows since it now overlaps its own body. z-index stays under
     the nav's 100. */
  position:sticky;top:var(--nav-h,66px);z-index:5;background:#fff}
.gacc-head:hover{background:var(--wash)}
.gacc.open .gacc-head{background:var(--wash);border-bottom:1.5px solid var(--line)}
.gacc-date{font-family:'Oswald';font-weight:700;font-size:23px;letter-spacing:.5px;
  text-transform:uppercase;color:var(--navy);line-height:1.1}
.gacc-opp{font-family:'Oswald';font-weight:500;font-size:16px;letter-spacing:.8px;color:var(--ink)}
.gacc-count{font-family:'Oswald';font-weight:600;font-size:11px;letter-spacing:2px;
  text-transform:uppercase;color:var(--muted)}
.gacc-res{display:inline-flex;gap:14px;flex-wrap:wrap}
.gacc-res-item{font-family:'Oswald';font-weight:600;font-size:11px;letter-spacing:2px;
  text-transform:uppercase;color:var(--muted)}
.gacc-res-item b{font-weight:700;font-size:14px;letter-spacing:.5px}
.gacc-res-item b.w{color:#1E7A38}
.gacc-res-item b.l{color:var(--red)}
.gacc-venue{font-size:12.5px;color:var(--muted);margin-left:auto;white-space:nowrap}
.gacc-chev{width:11px;height:11px;flex-shrink:0;align-self:center;
  border-right:2px solid var(--navy);border-bottom:2px solid var(--navy);
  transform:rotate(45deg) translate(-2px,-2px);transition:transform .28s ease}
.gacc.open .gacc-chev{transform:rotate(-135deg) translate(-2px,-2px)}
/* grid-rows 0fr -> 1fr animates height without hardcoding a max-height that
   would clip a game day with an unusual number of games. */
.gacc-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s ease}
.gacc.open .gacc-body{grid-template-rows:1fr}
.gacc-body>div{overflow:hidden}
.grow{display:grid;grid-template-columns:110px 148px 1fr auto;gap:18px;align-items:center;
  padding:14px 24px 14px 21px;border-top:1.5px solid var(--line);border-left:3px solid var(--line)}
/* "Freshman Boys" is the longest label — let it size the column rather than
   wrapping to two lines and making that one row taller than its neighbours. */
.grow .tbadge{white-space:nowrap;justify-self:start}
.grow[data-team=vb]{border-left-color:var(--navy)}
.grow[data-team=vg]{border-left-color:var(--red)}
.grow[data-team=jvb]{border-left-color:rgba(27,42,107,.32)}
.grow[data-team=jvg]{border-left-color:rgba(215,40,47,.32)}
.grow-time{font-family:'Oswald';font-weight:600;font-size:15px;letter-spacing:.8px;color:var(--muted)}
/* Varsity reads first: heavier, inked time + the filled team badge it already
   gets from .tb-vb/.tb-vg. JV/9th stay full-size and legible — lighter, not smaller. */
.grow.varsity .grow-time{font-weight:700;font-size:18px;color:var(--ink)}
.grow-opp{font-size:14px;color:var(--muted)}
.grow-opp b{font-family:'Oswald';font-weight:600;font-size:15px;letter-spacing:.8px;
  text-transform:uppercase;color:var(--ink)}
.grow-right{text-align:right}
.gacc-foot{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:16px 24px 22px;border-top:1.5px solid var(--line);background:var(--wash)}
.gacc-loc{font-size:12.5px;color:var(--muted)}
.gacc-loc a{color:var(--navy);text-decoration:underline;text-underline-offset:2px}
.gacc-actions{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
@media(max-width:700px){
  .gacc-head{padding:18px 16px;gap:8px}
  .gacc-date{font-size:19px;flex-basis:100%}
  .gacc-venue{margin-left:0;flex-basis:100%;white-space:normal}
  .gacc-chev{position:absolute;right:16px;top:22px}
  .gacc{position:relative}
  /* Stack: time + badge + status share row 1, opponent spans row 2. Placement is
     explicit — with auto-flow the full-width .grow-opp lands before .grow-right
     in DOM order and pushes the status onto a wasted third row. */
  .grow{grid-template-columns:auto auto 1fr;gap:5px 10px;padding:13px 16px 13px 13px}
  .grow-time{grid-column:1;grid-row:1}
  .grow .tbadge{grid-column:2;grid-row:1}
  .grow-right{grid-column:3;grid-row:1}
  .grow-opp{grid-column:1/-1;grid-row:2;font-size:13px}
  .gacc-foot{padding:14px 16px 18px}
  .gacc-actions{margin-left:0;width:100%}
  .gacc-actions .mini-btn{flex:1 1 auto;min-width:130px}
}
@media(prefers-reduced-motion:reduce){
  .gacc-body,.gacc-chev{transition:none}
}

/* Expand/Collapse all — sits just above the game-day list, right-aligned so it
   reads as a control for the list rather than another filter. */
.list-tools{display:flex;justify-content:flex-end;gap:8px;margin-bottom:12px}

/* subscribe row */
.subscribe{border:1.5px dashed var(--navy);padding:20px 24px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-bottom:32px;background:#fff}
.subscribe .txt{font-size:14px;color:var(--ink);flex:1;min-width:220px}
.subscribe .txt b{font-family:'Oswald';font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--navy)}
/* Compact variant for #subscribeRow: one line — label, the two feed buttons,
   then a muted hint. The old block spent a full paragraph explaining itself and
   still left the "filter to subscribe per team" path undiscoverable. */
#subscribeRow{padding:12px 16px;gap:10px 14px;margin-bottom:20px}
#subscribeRow .sub-lead{font-family:'Oswald';font-weight:600;font-size:12.5px;letter-spacing:1.5px;
  text-transform:uppercase;color:var(--navy)}
#subscribeRow .mini-btn{min-height:36px;padding:7px 14px}
#subscribeRow .sub-hint{font-size:12.5px;color:var(--muted);flex:1;min-width:200px}
@media(max-width:700px){
  #subscribeRow .sub-lead{flex:0 0 100%}
  /* Must be the `flex` shorthand, not flex-basis + flex:none — the shorthand
     resets basis to auto, which left the hint unable to shrink and clipped it. */
  #subscribeRow .sub-hint{flex:0 1 100%;min-width:0}
}
@media(max-width:700px){.subscribe{padding:16px}.subscribe .mini-btn{flex:1}}
.results-summary{display:flex;gap:34px;flex-wrap:wrap;border:1.5px solid var(--line);padding:22px 26px;margin-bottom:28px;background:#fff}
.results-summary div span{display:block;font-size:11px;font-family:'Oswald';font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:var(--muted)}
.results-summary div b{font-family:'Oswald';font-weight:700;font-size:26px;color:var(--navy)}
@media(max-width:700px){.results-summary{gap:20px;padding:16px}.results-summary div b{font-size:22px}}


/* ---------- Team header: photo, name/season, coach info ---------- */
.team-hero{position:relative;overflow:hidden;border:1.5px solid var(--line);margin-bottom:0;min-height:340px}
.team-hero.varsity{min-height:420px}
.team-hero .bg-img{object-fit:cover;object-position:center 22%}
@media(min-width:701px){.team-hero.varsity .bg-img{object-position:center 38%}}
.team-hero-placeholder{position:relative;border:1.5px solid var(--line);margin-bottom:0;min-height:96px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:linear-gradient(150deg,#1B2A6B,#141F52);text-align:center;padding:20px}
.team-hero-placeholder.varsity{min-height:120px}
.thp-name{font-family:'Oswald';font-weight:700;font-size:16px;letter-spacing:2px;text-transform:uppercase;color:#fff}
.thp-note{font-family:'Oswald';font-weight:500;font-size:12px;letter-spacing:.5px;color:rgba(255,255,255,.55)}
@media(max-width:700px){.team-hero{min-height:220px}.team-hero.varsity{min-height:280px}}

.team-info{border:1.5px solid var(--line);border-top:none;padding:22px 24px;background:#fff}
.team-info-top{display:flex;align-items:baseline;flex-wrap:wrap;gap:14px;margin-bottom:14px}
.team-info-name{font-family:'Oswald';font-weight:700;font-size:22px;letter-spacing:1px;text-transform:uppercase;color:var(--navy)}
.team-info-name.varsity{font-size:26px}
.team-info-season{font-family:'Oswald';font-weight:600;font-size:13px;letter-spacing:1.5px;color:var(--muted)}
.team-info-actions{margin-left:auto;display:flex;gap:8px}
.team-info-coaches{display:flex;flex-wrap:wrap;gap:28px}
.coach-line{display:flex;flex-direction:column;gap:2px}
.ci-label{font-family:'Oswald';font-weight:600;font-size:10.5px;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
.ci-value{font-size:14px;color:var(--ink)}
@media(max-width:560px){.team-info{padding:18px 18px}.team-info-actions{margin-left:0;width:100%}}
@media print{.team-info-actions{display:none}}

/* ---------- Documentary photo (one deliberate page break, not a gallery) ---------- */
.team-doc-photo{position:relative;overflow:hidden;border:1.5px solid var(--line);aspect-ratio:2.2/1;margin:36px 0}
.team-doc-photo .bg-img{object-fit:cover}
@media(max-width:700px){.team-doc-photo{aspect-ratio:4/3;margin:28px 0}}

/* ---------- Roster ---------- */
.roster-landing{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:8px}
.roster-landing-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:1.5px solid var(--line);background:#fff;padding:48px 24px;cursor:pointer;transition:background .15s,border-color .15s;min-height:160px}
.roster-landing-btn:hover{background:var(--wash);border-color:var(--navy)}
.roster-landing-btn .rl-label{font-family:'Oswald';font-weight:700;font-size:28px;letter-spacing:2px;text-transform:uppercase;color:var(--navy);text-align:center}
.roster-landing-btn .rl-sub{font-family:'Oswald';font-weight:500;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}
.roster-landing-btn.placeholder{cursor:default;border-style:dashed;background:var(--wash)}
.roster-landing-btn.placeholder:hover{background:var(--wash);border-color:var(--line)}
.roster-landing-btn.placeholder .rl-label{color:var(--muted)}
.roster-landing-btn.plaque{background:var(--navy);border:none}
.roster-landing-btn.plaque:hover{background:var(--navy);filter:brightness(1.12)}
.roster-landing-btn.plaque .plaque-rule{width:34px;height:2.5px;background:var(--red);margin-bottom:4px}
.roster-landing-btn.plaque .rl-label{color:#fff}
.roster-landing-btn.plaque .rl-sub{color:rgba(255,255,255,.65)}
.roster-landing-btn.photo{position:relative;overflow:hidden;min-height:340px;align-items:flex-start;justify-content:flex-end;padding:24px;border:none}
.roster-landing-btn.photo .bg-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%;transition:transform .3s}
.roster-landing-btn.photo::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,15,40,0) 30%,rgba(8,12,32,.94) 100%)}
.roster-landing-btn.photo .rl-label,.roster-landing-btn.photo .rl-sub{position:relative;z-index:1;text-align:left}
.roster-landing-btn.photo .rl-label{color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.55)}
.roster-landing-btn.photo .rl-sub{color:rgba(255,255,255,.85);text-shadow:0 1px 6px rgba(0,0,0,.55)}
.roster-landing-btn.photo:hover .bg-img{transform:scale(1.04)}
.roster-landing-btn.photo.placeholder{cursor:default}
.roster-landing-btn.photo.placeholder .bg-img{filter:grayscale(60%) brightness(.8)}
.roster-landing-btn.photo.placeholder::after{background:linear-gradient(180deg,rgba(8,12,32,.2) 0%,rgba(8,12,32,.94) 100%)}
.roster-landing-btn.photo.placeholder .rl-label{color:rgba(255,255,255,.9)}
.roster-landing-btn.photo.placeholder:hover .bg-img{transform:none}
@media(prefers-reduced-motion:reduce){.roster-landing-btn.photo .bg-img{transition:none}}
@media(max-width:700px){.roster-landing{grid-template-columns:1fr;gap:20px}.roster-landing-btn.photo{min-height:220px}}
.roster-subnav{position:sticky;top:69px;z-index:50;background:#fff;border-bottom:1.5px solid var(--line)}
.roster-subnav-inner{padding-top:18px;padding-bottom:16px}
.roster-subnav-inner .eyebrow{margin-bottom:6px}
.roster-subnav-inner h2{font-size:22px;margin-bottom:14px}
.roster-subnav-inner .filter-bar{margin-bottom:0}
.roster-team-section{margin-bottom:44px}
.roster-list{border:1.5px solid var(--line);border-top:none;background:#fff}
@media(min-width:700px){.roster-list{display:grid;grid-template-columns:1fr 1fr}.roster-col:first-child{border-right:1.5px solid var(--line)}}
.player{position:relative;display:flex;align-items:baseline;gap:14px;padding:15px 22px;border-bottom:1.5px solid var(--line);border-left:3px solid transparent;transition:background .15s,border-left-color .15s;break-inside:avoid-column}
.player:last-child{border-bottom:none}
.p-num{flex:0 0 26px;font-family:'Oswald';font-weight:700;font-size:18px;color:var(--red);text-align:center}
.p-num.tbd{font-size:11px;letter-spacing:1px;color:var(--muted)}
.p-name{font-family:'Oswald';font-weight:700;font-size:15px;letter-spacing:.5px;text-transform:uppercase;color:var(--navy)}
.p-grade{font-family:'Oswald';font-weight:500;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}
.player.senior .p-grade{color:var(--red);font-weight:600}
@media(hover:hover){.player:hover{background:var(--wash);border-left-color:var(--red)}}
@media(hover:none){.player:active{background:var(--wash)}}
@media(max-width:560px){.player{padding:13px 16px;gap:10px}.p-num{flex-basis:22px}.p-name{font-size:13.5px}}
@media print{.player{border-left-color:transparent!important;break-inside:avoid}.roster-list{display:grid;grid-template-columns:1fr 1fr}.roster-col:first-child{border-right:1.5px solid var(--line)}}

/* ---------- Coaches ---------- */
.coach-group-photo{position:relative;border:1.5px solid var(--line);min-height:400px;display:flex;align-items:center;justify-content:center;background:linear-gradient(150deg,#1B2A6B,#141F52);margin-bottom:36px}
.coach-group-photo .ph-label{font-family:'Oswald';font-weight:600;font-size:15px;letter-spacing:2.5px;text-transform:uppercase;color:rgba(255,255,255,.45);text-align:center;padding:20px}
@media(max-width:700px){.coach-group-photo{min-height:280px}}
.coach-team-group{margin-top:40px}
.coach-team-group:first-child{margin-top:0}
.coach-team-label{font-family:'Oswald';font-weight:700;font-size:15px;letter-spacing:2px;text-transform:uppercase;color:var(--navy);padding-bottom:10px;border-bottom:1.5px solid var(--line);margin-bottom:16px}
.coach-list{border:1.5px solid var(--line);background:#fff}
.coach-row{padding:18px 22px;border-bottom:1.5px solid var(--line)}
.coach-row:last-child{border-bottom:none}
.coach-name{font-family:'Oswald';font-weight:700;font-size:16px;letter-spacing:.5px;text-transform:uppercase;color:var(--navy)}
.coach-title{font-family:'Oswald';font-weight:600;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--red);margin-top:4px}
.coach-bio{font-size:14px;color:var(--muted);margin-top:10px;line-height:1.6;white-space:pre-line}

/* ---------- Jr Raiders ---------- */
/* Court logo as a faint background watermark rather than a placed photo —
   purely atmospheric/decorative (alt="" on the img), so it needs an explicit
   stacking order: the image sits behind, the inner .wrap gets its own
   stacking context to paint above it. `.jr-watermark-wrap` is deliberately
   NOT `.wrap` itself — that was the earlier bug: overflow:hidden on the same
   box that's already max-width:1220px clips a "full width" child right back
   down to that box, not the viewport. Instead it's a full-width outer
   element with a centered `.wrap` nested inside it for the actual content,
   so the image can just be `inset:0` and genuinely cover edge-to-edge on
   desktop. Mobile drops the watermark entirely (`display:none` under 700px
   — there isn't enough width for a background watermark to read as
   atmosphere rather than a sliver) in favor of the real, full-color
   `.jr-closing-photo` (a `.team-doc-photo` instance) placed at the end of
   the page content — mobile-only (hidden at 701px+ via `.jr-closing-photo`
   below), since on desktop it read as a stray, disconnected insert rather
   than a deliberate placement once the full-bleed watermark was already
   carrying the photography for that breakpoint. */
.jr-watermark-wrap{position:relative;overflow:hidden}
.jr-watermark-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.24;filter:grayscale(35%);pointer-events:none;z-index:0}
@media(min-width:701px){.jr-closing-photo{display:none}}
@media(max-width:700px){.jr-watermark-img{display:none}}
.jr-watermark-wrap>.wrap{position:relative;z-index:1}
.jr-watermark-wrap .jr-card{background:rgba(255,255,255,.85)}
.jr-watermark-wrap .coming-soon-banner{background:rgba(27,42,107,.9)}
.coming-soon-banner{background:var(--navy);color:#fff;border-left:4px solid var(--red);padding:24px 28px;margin-bottom:28px}
.coming-soon-banner .cs-label{font-family:'Oswald';font-weight:700;font-size:20px;letter-spacing:2px;text-transform:uppercase;color:#fff}
.coming-soon-banner p{margin-top:6px;font-size:14px;color:rgba(255,255,255,.8)}
.draft-notice{background:rgba(215,40,47,.08);border:1.5px solid var(--red);border-left:4px solid var(--red);padding:14px 20px;margin-bottom:28px;font-size:14px;font-weight:600;color:var(--red-dark)}
.jr-card{border:1.5px solid var(--line);background:#fff;padding:28px 26px;margin-bottom:24px}
.jr-card .who{color:var(--red)}
.jr-card h3{font-size:19px;font-weight:600;letter-spacing:1px;color:var(--navy);margin:10px 0 6px}
.jr-card p{font-size:13.5px;color:var(--muted)}
@media(max-width:700px){.coming-soon-banner{padding:20px}.jr-card{padding:22px 20px}}

/* ---------- Summer Camps ---------- */
.camp-card{border:1.5px solid var(--line);background:#fff;padding:26px}
.camp-card-head{font-family:'Oswald';font-weight:700;font-size:17px;letter-spacing:1.5px;text-transform:uppercase;color:var(--navy);padding-bottom:14px;border-bottom:1.5px solid var(--line);margin-bottom:18px}
.camp-notes{font-size:14px;color:var(--ink);line-height:1.7;white-space:pre-line}
.camp-notes strong{color:var(--navy)}
.camp-notes a{color:var(--red);text-decoration:underline;text-underline-offset:2px}
@media(max-width:700px){.camp-card{padding:20px}}

/* ---------- Sponsorship ---------- */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);border:1.5px solid var(--line);margin:36px 0 10px}
.tier{padding:34px 30px;border-right:1.5px solid var(--line);display:flex;flex-direction:column;background:#fff;position:relative}
.tier:last-child{border-right:none}
.tier.feature{background:var(--navy);color:#fff}
.tier .flag{position:absolute;top:0;right:0;background:var(--red);color:#fff;font-family:'Oswald';font-size:10px;font-weight:600;letter-spacing:2px;padding:6px 12px;text-transform:uppercase}
.tier h3{font-size:22px;font-weight:700;letter-spacing:1.5px;color:var(--navy)}
.tier.feature h3{color:#fff}
.tier .price{font-family:'Oswald';font-weight:700;font-size:44px;color:var(--red);margin:12px 0 0;line-height:1}
.tier .per{font-size:12px;color:var(--muted);margin-bottom:20px}
.tier.feature .per{color:rgba(255,255,255,.85)}
.tier ul{list-style:none;flex:1;margin-bottom:26px}
.tier li{font-size:13.5px;padding:8px 0 8px 24px;position:relative;border-bottom:1px solid var(--line)}
.tier.feature li{border-color:rgba(255,255,255,.15)}
.tier li::before{content:'—';position:absolute;left:0;color:var(--red);font-weight:700}
@media(max-width:860px){.tiers{grid-template-columns:1fr}.tier{border-right:none;border-bottom:1.5px solid var(--line);padding:26px 20px}}
.cta-band{background:var(--red);color:#fff;padding:46px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;margin-top:46px}
.cta-band h3{font-size:26px;font-weight:700;letter-spacing:1.5px}
.cta-band p{color:#fff;font-size:14px;margin-top:6px;max-width:460px}
.cta-band .btn{background:#fff;color:var(--red)}
@media(max-width:700px){.cta-band{padding:28px 20px}.cta-band .btn{width:100%}}

/* ---------- Footer ---------- */
footer{background:var(--navy);color:rgba(255,255,255,.88);margin-top:72px;padding:46px 0 36px;font-size:13.5px;border-top:3px solid var(--red)}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px}
footer h4{font-family:'Oswald';font-weight:600;color:#fff;font-size:13px;letter-spacing:2.5px;margin-bottom:14px;text-transform:uppercase}
footer a{display:block;color:rgba(255,255,255,.88);text-decoration:none;padding:5px 0}
footer a:hover{color:#fff}
@media(max-width:680px){.foot-grid{grid-template-columns:1fr 1fr}}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(80px);background:var(--navy);color:#fff;padding:13px 24px;font-family:'Oswald';font-size:13px;letter-spacing:1.5px;text-transform:uppercase;opacity:0;transition:all .3s;z-index:200;box-shadow:0 12px 30px rgba(0,0,0,.3);max-width:calc(100vw - 32px);text-align:center}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:700px){.toast{bottom:92px}}

/* ---------- Print (roster pages) ---------- */
@media print{
  nav,.install-banner,.tabbar,footer,.roster-landing,.roster-subnav .filter-bar,.toast{display:none!important}
  .roster-subnav{position:static}
  body{padding-bottom:0}
}

/* ---------- All Time Records ----------
   Deliberately narrower than .wrap's full 1220px: a 3-column board that wide
   puts Girls and Boys so far apart the eye can't connect them to the category
   between. Constraining it to a compact, centered board (like a real plaque,
   not a stretched-out data table) plus inline stat lines (name/value/years on
   ONE line, not stacked) and a row-hover to track across is what fixes both
   "too spread apart" and "underwhelming" at once. */
.records-board{max-width:860px;margin:0 auto}
.records-table{border:1.5px solid var(--line);border-top:3px solid var(--red);background:#fff}
.record-row{display:grid;grid-template-columns:1fr auto 1fr;border-bottom:1px solid var(--line);transition:background .12s}
.record-row:last-child{border-bottom:none}
.record-row.record-head{background:var(--navy)}
.record-row.record-head .rec-cat{color:#fff;font-size:16.8px}
.record-row.record-head .record-cell.category{background:var(--navy);border-color:rgba(255,255,255,.2)}
.record-row:not(.record-head):nth-child(even){background:var(--wash)}
.record-row:not(.record-head):nth-child(even) .record-cell.category{background:#fff}
.record-row:not(.record-head):hover{background:#EFF2FA}
.record-row:not(.record-head):hover .record-cell.category{background:#E7EBF7}
.record-cell{padding:10px 18px;display:flex;align-items:baseline;gap:7px;flex-wrap:wrap}
.record-cell.category{align-items:center;justify-content:center;text-align:center;background:var(--wash);border-left:1px solid var(--line);border-right:1px solid var(--line);min-width:160px;padding:10px 14px}
.record-cell.girls{justify-content:flex-end;text-align:right}
.record-cell.boys{justify-content:flex-start;text-align:left}
.rec-gender-label{display:none}
.rec-cat{font-family:'Oswald';font-weight:600;text-transform:uppercase;letter-spacing:.3px;font-size:12px;color:var(--ink);line-height:1.25}
.record-row:not(.record-head) .rec-cat{font-size:15px}
.rec-name{font-weight:600;color:var(--ink);font-size:13.5px}
.rec-value{font-family:'Oswald';font-size:17px;font-weight:700;color:var(--red);line-height:1}
.rec-years{font-size:11px;color:var(--muted)}
.rec-empty{color:var(--muted)}
.records-note{color:var(--muted);font-size:12.5px;line-height:1.7;margin-top:22px;border-top:1px solid var(--line);padding-top:16px;text-align:center}
@media(max-width:700px){
  .record-row{grid-template-columns:1fr}
  .record-row.record-head{display:none}
  .record-cell.category{order:-1;border:none;border-bottom:1px solid var(--line);padding:9px 18px;justify-content:flex-start;text-align:left}
  .record-cell.girls,.record-cell.boys{justify-content:flex-start;text-align:left}
  .rec-gender-label{display:inline-block;flex-shrink:0;width:40px;font-family:'Oswald';font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
}