/* =========================================================
   WESTLAKE GIRLS BASKETBALL — design system
   Edit colors/fonts here once; every page follows.
   ========================================================= */

:root{
  /* Color — sampled from the official Westlake Basketball marks */
  --orange:     #F26522;   /* brand orange */
  --orange-lt:  #FF8244;
  --blue:       #2E3192;   /* brand blue */
  --banner:     #2E3192;   /* brand blue, matching the logo */
  --ink:        #0C1030;   /* deep end of the brand blue — page background */
  --ink-2:      #191E5E;   /* raised panels */
  --ink-3:      #070A22;   /* footer */
  --court:      #E7DCC6;   /* the gym floor */
  --court-line: #D3C4A8;
  --charcoal:   #414042;   /* brand charcoal, from the official mark */
  --chalk:      #FFFFFF;
  --steel:      #6A739E;
  --steel-lt:   #B4BAD8;

  /* Type */
  --display: "Big Shoulders Display", "Arial Narrow", sans-serif;
  --body:    "Barlow", system-ui, sans-serif;
  --data:    "Barlow Condensed", "Arial Narrow", sans-serif;

  /* Scale */
  --gut: clamp(1.25rem, 4vw, 2.5rem);
  --pad-section: clamp(3.5rem, 8vw, 7rem);
  --maxw: 1200px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ink);color:var(--chalk);
  font-family:var(--body);font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--orange-lt);outline-offset:3px}

.shell{width:min(var(--maxw),92vw);margin-inline:auto}

h1,h2,h3,.d{
  font-family:var(--display);font-weight:800;
  text-transform:uppercase;line-height:.88;letter-spacing:-.005em;margin:0;
}
.d-xl{font-size:clamp(3.25rem,9vw,7.5rem)}
.d-lg{font-size:clamp(2.6rem,6vw,5rem)}
.d-md{font-size:clamp(1.9rem,3.6vw,3rem)}
.d-sm{font-size:clamp(1.4rem,2.4vw,2rem)}

.eyebrow{
  font-family:var(--data);font-weight:600;font-size:.9rem;
  text-transform:uppercase;letter-spacing:.22em;color:var(--orange-lt);
  display:flex;align-items:center;gap:.7em;margin:0 0 .7rem;
}
.eyebrow::before{content:"";width:2.2rem;height:2px;background:var(--orange);flex:none}
.eyebrow.on-light{color:#B0430F}

.lede{font-size:1.1rem;color:var(--steel-lt);max-width:58ch;margin:1rem 0 0}
.on-light .lede,.light .lede{color:#4A5563}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.55em;min-height:50px;
  padding:0 1.35rem;font-family:var(--data);font-weight:600;
  font-size:1rem;letter-spacing:.14em;text-transform:uppercase;
  border:2px solid transparent;transition:transform .16s ease,background .16s ease,color .16s ease;
}
.btn:hover{transform:translateY(-2px)}
.btn--fill{background:var(--orange);color:#fff}
.btn--fill:hover{background:var(--orange-lt)}
.btn--line{border-color:currentColor;color:inherit}
.btn--line:hover{background:var(--chalk);color:var(--ink);border-color:var(--chalk)}
.btn--ink{background:var(--blue);color:#fff}
.btn--ink:hover{background:var(--ink-2)}

/* ---------- Header ---------- */
.masthead{position:sticky;top:0;z-index:60;background:var(--chalk);
  border-bottom:4px solid var(--orange);box-shadow:0 2px 14px rgba(0,0,0,.28)}
.masthead__bar{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:86px}
.masthead__logo{height:46px;width:auto}
.mainnav{display:flex;align-items:center;gap:1.35rem;font-family:var(--data);
  font-weight:600;font-size:1rem;letter-spacing:.13em;text-transform:uppercase;color:var(--blue)}
.mainnav a{padding:.3rem 0;border-bottom:3px solid transparent;color:var(--blue)}
.mainnav a:hover,.mainnav a[aria-current="page"]{border-bottom-color:var(--orange);color:var(--orange)}
.mainnav .give{background:var(--orange);color:#fff;padding:.6rem .95rem;border:0}
.mainnav .give:hover{background:var(--blue);color:#fff}
.navtoggle{display:none;background:none;border:2px solid var(--blue);color:var(--blue);
  font-family:var(--data);font-weight:600;font-size:1rem;letter-spacing:.14em;
  padding:.5rem .85rem;text-transform:uppercase;cursor:pointer}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:clamp(460px,76vh,700px);display:flex;align-items:flex-end;
  background:var(--ink-2);overflow:hidden}
.hero__img{position:absolute;inset:0;background-image:var(--hero-src,none);
  background-size:cover;background-position:50% 38%;filter:saturate(.9)}
.hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(6,18,35,.55) 0%,rgba(6,18,35,.15) 35%,rgba(6,18,35,.94) 100%),
             linear-gradient(90deg,rgba(6,18,35,.85) 0%,rgba(6,18,35,.1) 65%)}
.hero__body{position:relative;z-index:2;padding:clamp(3rem,9vw,6rem) 0 clamp(2.5rem,6vw,4rem);width:100%}
.hero h1{margin:0 0 .4rem}
.hero h1 em{font-style:normal;color:var(--orange);display:block}
.hero__motto{font-family:var(--data);font-weight:600;font-size:clamp(1.1rem,2.4vw,1.6rem);
  letter-spacing:.24em;text-transform:uppercase;color:var(--chalk);margin:.9rem 0 1.6rem}
.hero__actions{display:flex;flex-wrap:wrap;gap:.7rem}

/* ---------- SIGNATURE: the rafters ----------
   Modelled on the banners hanging in the Westlake gym: royal blue field,
   white lettering, hung from a beam.                                       */
.rafters{background:var(--ink-3);padding:0 0 clamp(2.5rem,6vw,4.5rem);position:relative}
.rafters__beam{height:12px;background:linear-gradient(180deg,#3A3021 0%,#241D12 60%,#120E08 100%);
  box-shadow:0 4px 14px rgba(0,0,0,.6)}
.rafters__row{display:flex;justify-content:center;gap:clamp(.75rem,2.6vw,2rem);flex-wrap:wrap;align-items:flex-start}
.banner{
  --w:clamp(140px,17.5vw,196px);
  width:var(--w);position:relative;text-align:center;
  background:linear-gradient(175deg,var(--banner) 0%,#232677 100%);
  padding:1.6rem 1rem 2.9rem;
  border-left:3px solid rgba(255,255,255,.9);
  border-right:3px solid rgba(255,255,255,.9);
  clip-path:polygon(0 0,100% 0,100% 86%,50% 100%,0 86%);
  transform-origin:50% 0;
  box-shadow:0 16px 34px rgba(0,0,0,.55);
}
.banner::before{content:"";position:absolute;top:-14px;left:50%;width:3px;height:14px;
  background:#8A8FA8;transform:translateX(-50%)}
.banner::after{ /* inner keyline, like the stitched border on a real banner */
  content:"";position:absolute;left:9px;right:9px;top:9px;bottom:14%;
  border:2px solid rgba(255,255,255,.55);pointer-events:none}
.banner__rule{width:34px;height:3px;background:var(--orange);margin:0 auto .65rem}
.banner__title{font-family:var(--display);font-weight:800;text-transform:uppercase;
  font-size:clamp(1.2rem,2.3vw,1.7rem);line-height:.9;color:var(--chalk)}
.banner__sub{font-family:var(--data);font-weight:600;font-size:.82rem;letter-spacing:.15em;
  text-transform:uppercase;color:rgba(255,255,255,.82);margin:.45rem 0 .55rem;line-height:1.15}
.banner__year{font-family:var(--display);font-weight:800;font-size:1.7rem;color:var(--orange);
  text-shadow:0 1px 0 rgba(0,0,0,.35)}
@keyframes settle{
  0%{transform:rotate(0deg) translateY(-16px);opacity:0}
  55%{transform:rotate(1.5deg) translateY(0);opacity:1}
  78%{transform:rotate(-.9deg)}
  100%{transform:rotate(0deg);opacity:1}
}
.banner{animation:settle .95s cubic-bezier(.22,.8,.3,1) both}
.banner:nth-child(2){animation-delay:.12s}
.banner:nth-child(3){animation-delay:.24s}
.banner:nth-child(4){animation-delay:.36s}
.banner:nth-child(5){animation-delay:.48s}
@media (prefers-reduced-motion:reduce){
  .banner{animation:none}
  html{scroll-behavior:auto}
}

/* ---------- Sections ---------- */
.band{padding:var(--pad-section) 0}
.band--light{
  background:var(--court);color:var(--ink);
  background-image:repeating-linear-gradient(90deg,
    var(--court-line) 0 1px, transparent 1px clamp(70px,9vw,120px));
}
.band--light h1,.band--light h2,.band--light h3{color:var(--ink)}
.band--ink2{background:var(--ink-2)}
.band__head{margin-bottom:clamp(1.8rem,4vw,3rem)}

/* ---------- Teams ---------- */
.teams{display:grid;gap:1px;background:rgba(255,255,255,.14);
  grid-template-columns:repeat(3,1fr);border:1px solid rgba(255,255,255,.14)}
.band--light .teams{background:var(--court-line);border-color:var(--court-line)}
.team{position:relative;background:var(--ink);min-height:300px;display:flex;
  flex-direction:column;justify-content:flex-end;padding:1.6rem;overflow:hidden;
  transition:background .2s ease}
.band--light .team{background:#FFFDF9}
.team:hover{background:var(--ink-2)}
.band--light .team:hover{background:#fff}
.team__photo{position:absolute;inset:0;background-size:cover;background-position:50% 30%;opacity:.42;
  transition:transform .4s ease,opacity .3s ease}
.team:hover .team__photo{transform:scale(1.04);opacity:.55}
.team__inner{position:relative;z-index:2}
.team h3{color:var(--chalk);margin:0 0 .1rem}
.band--light .team h3{color:var(--ink)}
.team__level{font-family:var(--data);font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;font-size:.78rem;color:var(--orange)}
.team__links{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem;
  font-family:var(--data);font-weight:600;letter-spacing:.13em;text-transform:uppercase;font-size:.88rem}
.team__links a{border-bottom:2px solid var(--orange);padding-bottom:2px}
.team__links a:hover{color:var(--orange-lt)}

/* ---------- Split feature ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.split--narrow{grid-template-columns:.85fr 1.15fr}
.split__media img{width:100%;border:3px solid var(--orange)}
.split__media--frame{background:var(--ink-2);aspect-ratio:4/5;border:3px solid var(--orange);
  background-size:cover;background-position:center}

/* ---------- Data tables (roster / schedule) ---------- */
.tablewrap{overflow-x:auto;border:1px solid rgba(255,255,255,.16)}
.band--light .tablewrap{border-color:var(--court-line);background:#FFFDF9}
table.data{width:100%;border-collapse:collapse;font-family:var(--data);font-size:1.05rem}
table.data th{
  background:var(--ink-3);color:var(--steel-lt);text-align:left;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;font-size:.8rem;padding:.85rem .9rem;white-space:nowrap}
.band--light table.data th{background:var(--ink);color:#fff}
table.data td{padding:.8rem .9rem;border-top:1px solid rgba(255,255,255,.1);vertical-align:middle}
.band--light table.data td{border-top-color:var(--court-line)}
table.data tbody tr:hover{background:rgba(232,84,31,.09)}
td.num{font-family:var(--display);font-weight:800;font-size:1.5rem;color:var(--orange);width:1%;padding-right:.4rem}
td.name{font-family:var(--body);font-weight:600;font-size:1rem}
.tag{font-family:var(--data);font-weight:600;font-size:.75rem;letter-spacing:.14em;
  text-transform:uppercase;padding:.2rem .5rem;border:1px solid currentColor}
.tag--home{color:var(--orange)}
.tag--away{color:var(--steel)}
.tag--tourn{color:#C9932E}
.res-w{color:#4FA96B;font-weight:600}
.res-l{color:#B8505A;font-weight:600}
.emptystate{padding:2rem 1.2rem;text-align:center;color:var(--steel-lt)}
.band--light .emptystate{color:var(--steel)}

/* ---------- Sponsors ---------- */
.champ{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(1.5rem,4vw,3rem);align-items:center;
  background:#FFFDF9;border:3px solid var(--orange);padding:clamp(1.5rem,4vw,2.5rem)}
.champ__logo{display:grid;place-items:center;background:#fff;padding:1.5rem;min-height:170px;
  border:1px solid var(--court-line)}
.champ h3{color:var(--ink)}
.champ p{color:#4A5563}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.16);margin-top:2rem}
.tier{background:var(--ink);padding:1.4rem}
.tier__amt{font-family:var(--display);font-weight:800;font-size:2.4rem;color:var(--orange);line-height:1}
.tier__name{font-family:var(--data);font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  font-size:.85rem;color:var(--steel-lt);margin-top:.35rem}
.logogrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem;margin-top:1.5rem}
.logogrid a,.logogrid div{background:#fff;display:grid;place-items:center;padding:1rem;min-height:100px}
.logogrid img{max-height:64px;width:auto;object-fit:contain}

/* ---------- Callout strip ---------- */
.strip{background:var(--orange);color:#fff;padding:clamp(2rem,5vw,3rem) 0}
.strip__inner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
.strip h2{color:#fff}
.strip p{margin:.4rem 0 0;font-family:var(--data);letter-spacing:.14em;text-transform:uppercase;font-size:.95rem}

/* ---------- Page hero (interior) ---------- */
.pagehero{background:var(--blue);padding:clamp(2.5rem,6vw,4.5rem) 0 clamp(2rem,5vw,3.5rem);
  border-bottom:2px solid var(--orange);position:relative;overflow:hidden}
.pagehero__img{position:absolute;inset:0;background-size:cover;background-position:50% 35%;opacity:.28}
.pagehero__body{position:relative;z-index:2}

/* ---------- Footer ---------- */
.foot{background:var(--ink-3);padding:clamp(2.5rem,6vw,4rem) 0 2rem;border-top:2px solid var(--orange)}
.foot__grid{display:grid;grid-template-columns:1.4fr .8fr .8fr;gap:2rem}
.foot h4{font-family:var(--data);font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  font-size:.85rem;color:var(--orange);margin:0 0 .9rem}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.foot a:hover{color:var(--orange-lt)}
.foot p{color:var(--steel-lt);margin:.3rem 0}
.foot__motto{font-family:var(--display);font-weight:800;text-transform:uppercase;
  font-size:1.3rem;color:#fff;margin-top:1rem}
.foot__legal{border-top:1px solid rgba(255,255,255,.1);margin-top:2rem;padding-top:1.2rem;
  font-family:var(--data);font-size:.85rem;letter-spacing:.1em;color:var(--steel);text-transform:uppercase}

/* ---------- Responsive ---------- */
@media (max-width:1150px){
  .mainnav{position:absolute;top:100%;left:0;right:0;background:var(--ink-3);
    flex-direction:column;align-items:stretch;gap:0;padding:.5rem 4vw 1.2rem;
    border-bottom:2px solid var(--orange);display:none}
  .mainnav[data-open="true"]{display:flex}
  .mainnav a{padding:.85rem 0;border-bottom:1px solid rgba(255,255,255,.09)}
  .mainnav .give{margin-top:.8rem;text-align:center;justify-content:center}
  .navtoggle{display:block}
  .teams,.split,.split--narrow,.champ,.foot__grid{grid-template-columns:1fr}
  .tiers{grid-template-columns:1fr 1fr}
  .team{min-height:210px}
}
@media (max-width:560px){
  .tiers{grid-template-columns:1fr}
  .banner:not(.banner--wide){width:calc(50% - .6rem)}
  .rafters__row{gap:1rem}
  .strip__inner{flex-direction:column;align-items:flex-start}
}

/* ---------- Footer mark ---------- */
.foot__mark{width:190px;margin-bottom:1.2rem}
.masthead__bar .wordmark{display:none}
.champ__logo img{max-height:150px;width:auto}
.crest{width:min(300px,60%);margin:0 auto 1.5rem;filter:drop-shadow(0 12px 26px rgba(0,0,0,.45))}
.leaguemark{height:54px;width:auto;margin-top:1.2rem;opacity:.9}

/* ---------- Team panels (stand-in until Media Day photos land) ---------- */
.team--flat{background:var(--ink)}
.band--light .team--flat{background:var(--ink)}
.band--light .team--flat h3{color:var(--chalk)}
.team__panel{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden}
.team__panel img{width:44%;max-width:130px;opacity:.16;filter:grayscale(1) brightness(2.4)}
.team__panel--varsity{background:linear-gradient(150deg,var(--blue) 0%,#1E2068 100%)}
.team__panel--jv{background:linear-gradient(150deg,var(--orange) 0%,#C24512 100%)}
.team__panel--frosh{background:linear-gradient(150deg,var(--charcoal) 0%,#232324 100%)}
.team__panel::after{content:"";position:absolute;inset:0;
  background:linear-gradient(0deg,rgba(7,10,34,.72),rgba(7,10,34,0) 62%)}

/* ---------- Program photo band ---------- */
.programshot{position:relative;min-height:clamp(320px,52vh,520px);
  background-size:cover;background-position:50% 42%}
.programshot::after{content:"";position:absolute;inset:0;
  background:linear-gradient(0deg,rgba(7,10,34,.94) 0%,rgba(7,10,34,.05) 58%)}
.programshot__cap{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:0 0 clamp(1.5rem,4vw,2.5rem)}
.programshot__cap p{color:var(--steel-lt);max-width:52ch;margin:.6rem 0 0}

/* ---------- Team colour system ----------
   Varsity = brand blue, JV = brand orange, Frosh/Soph = brand charcoal.
   Set once per page via .pagehero--<team>; the table header follows.        */
.pagehero--varsity{background:var(--blue)}
.pagehero--jv{background:var(--orange)}
.pagehero--frosh{background:var(--charcoal)}
.pagehero--jv .eyebrow{color:#FFE2D2}
.pagehero--jv .eyebrow::before{background:var(--chalk)}
.pagehero--frosh .eyebrow{color:#D6D6D8}
.pagehero--frosh .eyebrow::before{background:var(--orange)}

.team-varsity table.data th{background:var(--blue)}
.team-jv      table.data th{background:var(--orange);color:#fff}
.team-frosh   table.data th{background:var(--charcoal)}
.team-varsity .eyebrow{color:#9FA4E8}
.team-jv      .eyebrow{color:#FFA877}
.team-frosh   .eyebrow{color:#9AA0AE}
.team-jv      .eyebrow::before{background:var(--orange)}
.team-frosh   .eyebrow::before{background:var(--charcoal)}
.band--light .team-frosh .eyebrow{color:var(--charcoal)}

/* the card colour block reads on the light band too */
.team--flat h3{color:var(--chalk)}

.programshot__cap .btn{color:var(--chalk)}

/* ---------- Record book ---------- */
.tiers--six{grid-template-columns:repeat(3,1fr)}
.records{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;
  background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.16)}
.recgroup{background:var(--ink);padding:1.5rem}
.recgroup h3{color:var(--orange);margin-bottom:.6rem}
.recgroup table.data td{border-top-color:rgba(255,255,255,.09)}
.recgroup tr:first-child td{border-top:0}
td.reclabel{font-family:var(--data);font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;font-size:.8rem;color:var(--steel-lt);width:1%;white-space:nowrap}
td.recyr{font-family:var(--data);color:var(--steel);white-space:nowrap;text-align:right}
tr.rowbest{background:rgba(242,101,34,.14)}
tr.rowtotal td{border-top:3px solid var(--orange);font-weight:700;
  font-family:var(--display);text-transform:uppercase;font-size:1.15rem}
@media(max-width:900px){
  .tiers--six{grid-template-columns:1fr 1fr}
  .records{grid-template-columns:1fr}
}
@media(max-width:560px){.tiers--six{grid-template-columns:1fr}}

/* ---------- Wide league banner (nine titles, one banner — as it hangs) ---- */
.banner--wide{--w:clamp(210px,27vw,290px);padding-bottom:3.2rem}
.banner--wide .banner__title{font-size:clamp(1.3rem,2.6vw,2rem)}
.banner__years{display:grid;grid-template-columns:repeat(var(--cols,3),1fr);
  gap:.45rem .5rem;margin-top:.85rem;padding:0 .35rem;justify-items:center}
.banner__years span{font-family:var(--display);font-weight:800;font-size:clamp(1.05rem,1.9vw,1.45rem);
  color:var(--orange);text-shadow:0 1px 0 rgba(0,0,0,.35);line-height:1}
.banner--wide::after{bottom:15%}

/* ---------- Coaches ---------- */
.coaches{display:grid;gap:1.5rem}
.coach{display:grid;grid-template-columns:8px 1fr;background:var(--ink-2);overflow:hidden}
.coach--lead{background:linear-gradient(140deg,var(--ink-2) 0%,#111546 100%)}
.coach__bar{background:var(--steel)}
.coach--varsity .coach__bar{background:var(--blue)}
.coach--jv      .coach__bar{background:var(--orange)}
.coach--frosh   .coach__bar{background:var(--charcoal)}
.coach__body{padding:clamp(1.4rem,3.5vw,2.4rem)}
.coach__role{font-family:var(--data);font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  font-size:.85rem;color:var(--orange);margin:0 0 .35rem}
.coach__body h2{margin-bottom:.9rem}
.coach__body p{color:var(--steel-lt);margin:0 0 .85rem;max-width:70ch}
.coach__body p:last-child{margin-bottom:0}
.coach--lead .coach__body p{color:#CDD3EC}

/* ---------- Year chips ---------- */
.yearchips{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin-top:1.5rem}
.yearchip{font-family:var(--display);font-weight:800;font-size:1.5rem;
  background:var(--blue);color:#fff;padding:.4rem .75rem;line-height:1}
.band--light .yearchip{background:var(--blue)}


/* ---------- State championship banner ----------
   White field instead of the blue section banners, so a state title reads as
   a different order of achievement at a glance.                            */
.banner--white{
  background:linear-gradient(175deg,#FFFFFF 0%,#EDEFF6 100%);
  border-left-color:var(--blue);border-right-color:var(--blue);
  box-shadow:0 16px 34px rgba(0,0,0,.5);
}
.banner--white::after{border-color:rgba(46,49,146,.3)}
.banner--white::before{background:#8A8FA8}
.banner--white .banner__rule{background:var(--orange)}
.banner--white .banner__title{color:var(--blue);text-shadow:none}
.banner--white .banner__sub{color:#5B6285}
.banner--white .banner__year{color:var(--orange);text-shadow:none}

/* ---------- Tip-Off hub ---------- */
.tipoff-head{display:grid;grid-template-columns:minmax(0,220px) 1fr;gap:clamp(1.5rem,4vw,3rem);align-items:center}
.tipoff-head .crest{width:100%;margin:0}
.tipoff-links{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.5rem}
.sitelist{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.16)}
.sitelist .site{background:var(--ink-2);padding:1.6rem;display:flex;align-items:baseline;gap:.9rem;
  font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:1.5rem;line-height:1}
.site__n{color:var(--orange);font-size:2.2rem}
.teamchips{display:flex;flex-wrap:wrap;gap:.5rem}
.teamchip{font-family:var(--data);font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  font-size:.95rem;background:var(--blue);color:#fff;padding:.55rem .9rem;
  display:inline-flex;align-items:center;gap:.5rem}
.teamchip--host{background:var(--orange)}
.teamchip b{font-size:.7rem;letter-spacing:.12em;opacity:.85;
  border-left:1px solid rgba(255,255,255,.5);padding-left:.5rem}
@media(max-width:800px){
  .tipoff-head{grid-template-columns:1fr}
  .tipoff-head .crest{width:min(200px,55%)}
  .sitelist{grid-template-columns:1fr}
}

/* ---------- Tournament divisions ---------- */
.divisions{display:grid;gap:2.2rem}
.division h3{color:var(--ink);display:flex;align-items:baseline;gap:.7rem;margin-bottom:.9rem}
.division h3 em{font-family:var(--data);font-style:normal;font-weight:600;font-size:.85rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--orange)}
.division__format{font-family:var(--data);font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;font-size:.85rem;color:#5C6675;margin:-.5rem 0 .9rem}

.livenote{font-family:var(--data);font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  font-size:.78rem;color:var(--orange);margin:.3rem 0 0}
.livenote::before{content:"";display:inline-block;width:.5rem;height:.5rem;border-radius:50%;
  background:var(--orange);margin-right:.5rem;vertical-align:middle}

/* centred league-title block on the history page */
.titleblock{text-align:center}
.titleblock .eyebrow{justify-content:center}
.pcard__num--tbd{font-size:1.2rem;opacity:.55}
.gtag--league{color:#8FA0E8}
.band--light .gtag--league{color:var(--blue)}

/* ---------- Roster wall ---------- */
.rostermeta{display:flex;flex-wrap:wrap;gap:1.4rem;margin-bottom:1.6rem;
  font-family:var(--data);font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  font-size:.85rem;color:var(--steel-lt)}
.band--light .rostermeta{color:#5C6675}
.rostermeta b{font-family:var(--display);font-size:1.5rem;color:var(--orange);margin-right:.3rem}
.rosterwall{display:grid;gap:1px;background:rgba(255,255,255,.14);
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr));border:1px solid rgba(255,255,255,.14)}
.band--light .rosterwall{background:var(--court-line);border-color:var(--court-line)}
.pcard{background:var(--ink-2);display:flex;align-items:stretch;gap:0;
  transition:background .18s ease,transform .18s ease;position:relative;overflow:hidden}
.band--light .pcard{background:#FFFDF9}
.pcard:hover{background:var(--blue);transform:translateY(-2px);z-index:2}
.band--light .pcard:hover{background:#fff}
.pcard__num{flex:none;width:74px;display:grid;place-items:center;
  font-family:var(--display);font-weight:800;font-size:2.5rem;line-height:1;color:#fff;
  background:var(--blue)}
.pcard--jv    .pcard__num{background:var(--orange)}
.pcard--frosh .pcard__num{background:var(--charcoal)}
.pcard:hover .pcard__num{background:var(--orange)}
.pcard--jv:hover .pcard__num{background:var(--blue)}
.pcard__body{padding:.95rem 1rem;min-width:0}
.pcard__body h3{font-family:var(--body);font-weight:700;font-size:1.05rem;text-transform:none;
  letter-spacing:0;line-height:1.2;color:#fff;margin:0 0 .25rem}
.band--light .pcard__body h3{color:var(--ink)}
.pcard__pos{font-family:var(--data);font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  font-size:.8rem;color:var(--orange);margin:0 0 .45rem}
.pcard__meta{display:flex;gap:.5rem;align-items:center;margin:0;
  font-family:var(--data);font-size:.85rem;color:var(--steel-lt)}
.band--light .pcard__meta{color:#6B7484}
.gradepill{border:1px solid currentColor;padding:.05rem .4rem;font-weight:600;letter-spacing:.08em}

/* ---------- Schedule: game cards ---------- */
.recordline{font-family:var(--data);letter-spacing:.14em;text-transform:uppercase;
  font-size:.9rem;color:var(--steel-lt);margin-bottom:1.4rem}
.recordline b{font-family:var(--display);font-size:2rem;color:var(--orange);margin-right:.5rem}
.schedhead{font-family:var(--data);font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  font-size:.85rem;color:var(--orange);margin:2rem 0 .8rem}
.gamelist{display:grid;gap:1px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.14)}
.band--light .gamelist{background:var(--court-line);border-color:var(--court-line)}
.gcard{background:var(--ink-2);display:grid;grid-template-columns:78px 1fr auto;
  align-items:center;gap:1rem;padding:.9rem 1.1rem .9rem 0;transition:background .18s}
.band--light .gcard{background:#FFFDF9}
.gcard:hover{background:var(--blue)}
.band--light .gcard:hover{background:#fff}
.gcard__date{align-self:stretch;display:grid;place-content:center;text-align:center;
  background:rgba(0,0,0,.22);padding:.7rem .4rem;font-family:var(--data)}
.band--light .gcard__date{background:var(--ink);color:#fff}
.gcard__date span{display:block;font-size:.75rem;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--orange)}
.gcard__date b{display:block;font-family:var(--display);font-size:1.9rem;line-height:1;color:#fff}
.gcard__main{min-width:0}
.gcard__main h3{font-family:var(--body);font-weight:700;font-size:1.15rem;text-transform:none;
  letter-spacing:0;color:#fff;margin:.2rem 0}
.band--light .gcard__main h3{color:var(--ink)}
.gcard__tags{display:flex;gap:.5rem;align-items:center;margin:0}
.gtag{font-family:var(--data);font-weight:600;font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;padding:.1rem .45rem;border:1px solid currentColor}
.gtag--home{color:var(--orange)}
.gtag--away{color:var(--steel-lt)}
.gtag--tourn{color:#D9A441}
.gtime{font-family:var(--data);font-size:.85rem;color:var(--steel-lt)}
.band--light .gtime{color:#6B7484}
.gcard__site{font-family:var(--data);font-size:.9rem;color:var(--steel);margin:0}
.gcard__res{font-family:var(--display);font-weight:800;font-size:1.5rem;padding-left:.5rem}
.gcard__res .pending{color:var(--steel);font-size:1.2rem}
.gcard--w{box-shadow:inset 4px 0 0 #3E9E63}
.gcard--l{box-shadow:inset 4px 0 0 #B8505A}
.gcard--w .score{color:#4FA96B}
.gcard--l .score{color:#C4626C}

/* ---------- Announcements ---------- */
.annwall{display:grid;gap:1px;background:rgba(255,255,255,.14);
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));border:1px solid rgba(255,255,255,.14)}
.ann{background:var(--ink-2);padding:1.6rem}
.ann__meta{display:flex;gap:.7rem;align-items:center;margin:0 0 .6rem;
  font-family:var(--data);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--steel-lt)}
.ann__tag{background:var(--orange);color:#fff;padding:.15rem .5rem;font-weight:600}
.ann__soon{margin-left:auto;border:1px solid var(--steel);padding:.12rem .45rem;
  font-weight:600;color:var(--steel-lt)}
.ann__soon--now{border-color:var(--orange);color:var(--orange)}
.ann h3{color:#fff;margin-bottom:.5rem}
.ann__body{color:var(--steel-lt);margin:0 0 .8rem;font-size:.98rem}
.ann__link{font-family:var(--data);font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  font-size:.85rem;color:var(--orange)}
.ann__link:hover{color:var(--orange-lt)}

/* ---------- Boosters ---------- */
.officerwall{display:grid;gap:1px;background:rgba(255,255,255,.14);
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));border:1px solid rgba(255,255,255,.14)}
.officer{background:var(--ink-2);padding:1.6rem}
.officer__role{font-family:var(--data);font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  font-size:.78rem;color:var(--orange);margin:0 0 .4rem}
.officer h3{color:#fff}
.officer--open{background:var(--ink);border-top:3px solid var(--orange)}
.officer--open h3{color:var(--steel-lt)}

.committee{background:var(--ink-2);padding:1.6rem;grid-column:1/-1}
.memberchips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.6rem}
.memberchip{font-family:var(--data);font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  font-size:.9rem;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.2);
  color:#fff;padding:.45rem .8rem}

.committee{background:var(--ink);border-top:3px solid var(--orange);padding:1.6rem;margin-top:1px}
.committee__names{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.7rem}
.committee__names span{font-family:var(--body);font-weight:600;font-size:1.05rem;color:#fff;
  background:var(--blue);padding:.4rem .8rem}

/* ---------- Alumni cards ---------- */
.alumwall{display:grid;gap:1px;background:var(--court-line);
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));border:1px solid var(--court-line)}
.acard{background:#FFFDF9;padding:1.5rem}
.acard h3{color:var(--ink);margin-bottom:.35rem}
.acard__now{font-family:var(--data);font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  font-size:.85rem;color:#B0430F;margin:0}

@media(max-width:560px){
  .rosterwall{grid-template-columns:1fr}
  .pcard__num{width:62px;font-size:2rem}
  .gcard{grid-template-columns:64px 1fr auto;gap:.7rem}
  .gcard__date b{font-size:1.6rem}
  .gcard__main h3{font-size:1rem}
  .gcard__res{font-size:1.2rem}
}

/* ---------- Sitewide sponsor rail ----------
   Same band, same position, every page. Sponsors get consistent placement
   instead of living on one page nobody visits.                            */
.rail{background:var(--court);color:var(--ink);padding:2.2rem 0 2rem;
  background-image:repeating-linear-gradient(90deg,var(--court-line) 0 1px,transparent 1px clamp(70px,9vw,120px))}
.rail__head{font-family:var(--data);font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  font-size:.8rem;color:#6B7484;text-align:center;margin:0 0 1.1rem}
.rail__row{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:1px;
  background:var(--court-line);border:1px solid var(--court-line)}
.rail__slot{background:#fff;min-height:88px;display:grid;place-items:center;padding:.9rem;
  transition:background .18s}
.rail__slot img{max-height:56px;width:auto;object-fit:contain}
.rail__slot--championship{box-shadow:inset 0 3px 0 #D6A02E}
.rail__slot--warrior{box-shadow:inset 0 3px 0 var(--orange)}
.rail__slot--open{background:#F7F3EA;border:1px dashed var(--court-line)}
.rail__slot--open span{font-family:var(--data);font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;font-size:.72rem;color:#9AA0AA;text-align:center;line-height:1.4}
.rail__slot--open:hover{background:#fff;color:var(--orange)}
.rail__cta{text-align:center;margin:1.1rem 0 0;font-family:var(--data);font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;font-size:.82rem}
.rail__cta a{color:#B0430F}
.rail__cta a:hover{color:var(--orange)}
@media(max-width:560px){
  .rail__row{grid-template-columns:1fr 1fr}
  .rail__slot{min-height:72px}
}

/* ---------- Pro banner ----------
   Orange field. One banner for the category — add names as players sign,
   so nobody needs a banner of their own.                                   */
.banner--pro{
  --w:clamp(160px,21vw,225px);
  background:linear-gradient(175deg,var(--orange) 0%,#C2440F 100%);
  border-left-color:#FFD9C6;border-right-color:#FFD9C6;
  padding-bottom:2.8rem;
}
.banner--pro::after{border-color:rgba(255,255,255,.5)}
.banner--pro .banner__rule{background:#fff}
.banner--pro .banner__sub{color:rgba(255,255,255,.9)}
.banner__names{display:grid;gap:.4rem;margin-top:.7rem}
.banner__names span{font-family:var(--body);font-weight:700;font-size:.9rem;
  color:#fff;line-height:1.25}

/* ---------- Stat banner (college players) ---------- */
.banner--stat{--w:clamp(150px,19vw,205px)}
.banner__lines{display:grid;gap:.3rem;margin-top:.6rem}
.banner__lines span{font-family:var(--data);font-weight:600;font-size:.82rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--orange)}

/* ---------- Alumni level badges ---------- */
.acard__level{display:inline-block;font-family:var(--data);font-weight:600;font-size:.72rem;
  letter-spacing:.16em;text-transform:uppercase;padding:.2rem .5rem;margin:0 0 .6rem;color:#fff}
.acard__level--DI{background:var(--blue)}
.acard__level--DIII{background:var(--charcoal)}
.acard__level--JC{background:var(--orange)}
.acard__level--Pro{background:#D6A02E;color:#1A1400}
.tier--pro{border-top:3px solid #D6A02E}
.acard__role{font-family:var(--data);font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;
  color:#7A8290;margin:.35rem 0 0}

/* ---------- Team watch/stats strip ---------- */
.teamlinks{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.4rem}
.livedot{width:.55rem;height:.55rem;border-radius:50%;background:#fff;display:inline-block;
  margin-right:.15rem;animation:pulse 1.8s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.livedot{animation:none}}

/* ---------- Store ---------- */
.storewall{display:grid;gap:1px;background:rgba(255,255,255,.14);margin-top:2rem;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));border:1px solid rgba(255,255,255,.14)}
.storecard{background:var(--ink-2);padding:1.8rem;display:flex;flex-direction:column;gap:.7rem}
.storecard h3{color:#fff}
.storecard p{color:var(--steel-lt);margin:0;flex:1}
.storecard .btn{align-self:flex-start}
.storecard--soon{background:var(--ink)}
.soonpill{align-self:flex-start;font-family:var(--data);font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;font-size:.75rem;color:var(--orange);border:1px solid var(--orange);
  padding:.45rem .8rem}

/* ---------- Rafters, small screens ----------
   MUST stay last in the file: these override the base .banner widths above. */
@media (max-width:760px){
  .rafters__row{gap:.7rem}
  .banner--wide{width:100%;order:3;--w:100%}
  .banner--wide .banner__years{max-width:280px;margin-inline:auto}
  .banner--wide .banner__years span{font-size:1.3rem}
}
@media (max-width:560px){
  .banner:not(.banner--wide){width:calc(50% - .35rem)}
  .banner--wide{width:100%;--w:100%;padding-bottom:3rem}
  .banner--wide .banner__years{gap:.4rem .4rem;max-width:250px;margin-inline:auto}
  .banner--wide .banner__years span{font-size:1.2rem}
}