/* TETC HP v2 — page components (athletes, results, program, recruiting, portal) */

/* Page header band */
.pagehead{background:var(--tetc-navy);color:#fff;position:relative;overflow:hidden;border-bottom:var(--tetc-rule) solid var(--tetc-gold)}
.pagehead .wrap{padding:56px var(--tetc-gutter) 50px;position:relative;z-index:1}
.pagehead h1{color:#fff;font:900 var(--tetc-h2) var(--tetc-font-display);text-transform:uppercase;margin:6px 0 0}
.pagehead .tetc-kicker{color:var(--tetc-gold)}
.pagehead .asof{color:#9BB0D4;display:block;margin-top:10px}

/* Filter chips */
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:var(--tetc-s4)}
.chip{font:600 12px var(--tetc-font-body);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;padding:9px 15px;border:1px solid var(--tetc-cloud);background:#fff;color:var(--tetc-navy);cursor:pointer}
.chip.is-on{background:var(--tetc-navy);color:#fff;border-color:var(--tetc-navy)}

/* Results filter — a short row of GROUP chips plus a "jump to a meet" dropdown, so
   forty-odd meets are two rows and a menu instead of a wall of buttons.
   Sal, 18 Aug 2026: "these results selector is getting wild ... group them better,
   and drop down or something." */
.meetfilter{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:6px}
.meetfilter .chips{margin:0}
.meetpick{position:relative;margin-left:auto}
.meetpick select{appearance:none;-webkit-appearance:none;font:600 12px var(--tetc-font-body);letter-spacing:.06em;
  text-transform:uppercase;color:var(--tetc-navy);background:#fff;border:1px solid var(--tetc-cloud);
  padding:9px 34px 9px 15px;cursor:pointer;max-width:320px}
.meetpick::after{content:"▾";position:absolute;right:13px;top:50%;transform:translateY(-50%);
  pointer-events:none;color:var(--tetc-muted);font-size:11px}
.meetpick select:focus{outline:2px solid var(--tetc-gold);outline-offset:1px}
.chip__grpn{margin-left:7px;font-weight:700;opacity:.6}

/* Athlete cards */
.ath-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--tetc-s3)}
.ath-card{display:block;text-align:left;background:#fff;border:var(--tetc-border);padding:18px 18px 16px;cursor:pointer;font:inherit}
.ath-card:hover{border-color:var(--tetc-navy)}
.ath-card__top{display:flex;align-items:center;gap:13px;min-height:64px}
.avatar-c{width:62px;height:62px;flex:0 0 62px;border-radius:50%;overflow:hidden;background:var(--tetc-navy);display:grid;place-items:center;border:1px solid var(--tetc-cloud)}
.avatar-c img{width:100%;height:100%;object-fit:cover;object-position:center 18%}
.avatar-c span{font:900 22px var(--tetc-font-display);color:#fff}
.ath-card__name{font:900 21px var(--tetc-font-display);text-transform:uppercase;color:var(--tetc-navy);line-height:1;margin-bottom:4px}
.ath-card__hr{border:0;border-top:var(--tetc-border);margin:14px 0}
.ath-card__mark{font:900 17px var(--tetc-font-display);color:var(--tetc-navy)}
.ath-card__team{display:inline-block;margin-top:10px;font:600 10.5px var(--tetc-font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--tetc-navy);background:var(--tetc-tint);padding:4px 9px}
.ath-card__cta{display:flex;justify-content:space-between;align-items:center;margin-top:14px}
.ath-card .pill-live{font:700 11px var(--tetc-font-body);letter-spacing:.06em;text-transform:uppercase;color:#1E9E5A;white-space:nowrap}
.ath-card .view{font:700 11px var(--tetc-font-body);letter-spacing:.06em;text-transform:uppercase;color:var(--tetc-royal);white-space:nowrap}
.ath-card--more{display:grid;place-items:center;text-align:center;border:1px dashed var(--tetc-cloud);background:var(--tetc-paper);padding:22px}
.ath-card--more .ath-card__more-n{font:900 40px var(--tetc-font-display);color:var(--tetc-muted)}
.ath-card--more p{font:400 13px var(--tetc-font-body);color:var(--tetc-muted);margin:8px 0 0}

/* Quick-view modal */
.qmodal{position:fixed;inset:0;z-index:80;display:none;align-items:center;justify-content:center;padding:20px}
.qmodal.open{display:flex}
.qscrim{position:absolute;inset:0;background:rgba(20,32,46,.6)}
.qcard{position:relative;z-index:1;width:min(560px,100%);background:#fff;border:1px solid var(--tetc-navy);max-height:90vh;overflow:auto}
/* Tall enough for a full-body action shot. A 4:5 hero in a short landscape box
   crops to a face; at 380px the whole stride stays in frame, and athletes who
   only have a square head crop show more of it than before, not less. */
.qmedia{position:relative;height:380px;background:var(--tetc-navy);overflow:hidden}
.qmedia img{width:100%;height:100%;object-fit:cover;object-position:center 22%}
@media(max-width:520px){ .qmedia{height:320px} }
.qmedia .ph{position:absolute;inset:0;display:grid;place-content:center;gap:8px;justify-items:center}
.qmedia .ph img{height:52px;opacity:.9}
.qmedia .ph span{font:900 44px var(--tetc-font-display);color:#fff}
.qhead{background:var(--tetc-navy);color:#fff;padding:18px 22px}
.qname{font:900 30px var(--tetc-font-display);text-transform:uppercase;line-height:1;margin:6px 0 3px}
.qsub{font:400 13px var(--tetc-font-body);color:#9BB0D4}
.qclose{position:absolute;top:12px;right:12px;z-index:3;background:rgba(20,32,46,.55);border:0;color:#fff;width:34px;height:34px;font-size:20px;cursor:pointer}
.qbody{padding:20px 22px}
.qstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px;margin-bottom:14px}
.qstat{border-top:var(--tetc-rule) solid var(--tetc-navy);padding-top:8px}
.qstat .k{font:600 10.5px var(--tetc-font-body);letter-spacing:.12em;text-transform:uppercase;color:var(--tetc-muted)}
.qstat .v{font:900 24px var(--tetc-font-display);color:var(--tetc-navy);line-height:1.1}
.qbody p{margin:0 0 14px;color:var(--tetc-body);font-size:15px}
.qlist{list-style:none;margin:0;padding:0}
.qlist li{padding:8px 0;border-bottom:var(--tetc-border);font-size:14px;color:var(--tetc-body)}
.qlist li b{color:var(--tetc-navy);font-family:var(--tetc-font-display);font-weight:900;margin-right:8px}

/* Program: training week + Six E's */
.week{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--tetc-s2)}
.week__day{background:#fff;border:1px solid var(--tetc-cloud);border-top:var(--tetc-rule) solid var(--tetc-navy);padding:14px 14px 16px;transition:transform .16s ease,border-color .16s ease}
.week__day:hover{transform:translateY(-3px);border-color:var(--tetc-navy)}
.week__day.is-quality{border-top-color:var(--tetc-gold)}
.week__day .d{font:900 15px var(--tetc-font-display);text-transform:uppercase;color:var(--tetc-navy)}
.week__day .w{font:400 14px var(--tetc-font-body);color:var(--tetc-body);margin-top:6px}
.split2{display:grid;grid-template-columns:1fr 1fr;gap:var(--tetc-s5);align-items:start}
.deflist dt{font:900 20px var(--tetc-font-display);text-transform:uppercase;color:var(--tetc-navy);margin-top:14px}
.deflist dd{margin:2px 0 0;color:var(--tetc-body);font-size:15px}

/* Six E's — card grid with alternating gold/navy rules */
.sixe{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:8px}
.sixe__item{background:#fff;border:1px solid var(--tetc-cloud);border-top:var(--tetc-rule) solid var(--tetc-navy);padding:16px 16px 18px;transition:transform .16s ease,border-color .16s ease}
.sixe__item:hover{transform:translateY(-3px);border-color:var(--tetc-navy)}
.sixe__item:nth-child(even){border-top-color:var(--tetc-gold)}
.sixe__item h4{font:900 17px var(--tetc-font-display);text-transform:uppercase;color:var(--tetc-navy);margin:0 0 4px}
.sixe__item p{margin:0;color:var(--tetc-body);font-size:14px}
.panel-navy{background:var(--tetc-navy);color:#fff;padding:var(--tetc-s4)}
.panel-navy h3{color:#fff;font:900 var(--tetc-h3) var(--tetc-font-display);text-transform:uppercase;margin:0 0 8px}
.panel-navy p{color:#C6D3E6;margin:0;font-size:15px}
.photo-block{aspect-ratio:4/5;background:var(--tetc-navy);position:relative;overflow:hidden}
.photo-block img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* Recruiting */
.numlist{list-style:none;counter-reset:n;margin:0;padding:0}
.numlist li{counter-increment:n;display:grid;grid-template-columns:auto 1fr;gap:16px;padding:14px 0;border-bottom:var(--tetc-border)}
.numlist li::before{content:counter(n,decimal-leading-zero);font:900 22px var(--tetc-font-display);color:var(--tetc-gold)}
.numlist li b{display:block;color:var(--tetc-navy);font:900 17px var(--tetc-font-display);text-transform:uppercase}
.numlist li span{color:var(--tetc-body);font-size:14.5px}
.destinations{display:flex;flex-wrap:wrap;gap:8px}
.destinations .chip{cursor:default}

/* Portal */
.login{min-height:60vh;display:grid;place-items:center;background:var(--tetc-paper);padding:40px}
.login__card{width:min(400px,100%);background:#fff;border:1px solid var(--tetc-navy)}
.login__head{background:var(--tetc-navy);color:#fff;padding:20px 24px;text-align:center}
.login__head .init{font:900 30px var(--tetc-font-display);text-transform:uppercase}
.login__body{padding:24px}
.login__body input{width:100%;padding:13px 14px;border:1px solid var(--tetc-cloud);font:inherit;margin-bottom:12px}
.dash{display:grid;grid-template-columns:1.4fr .6fr;gap:var(--tetc-s5);align-items:start}
.rail>*{margin-bottom:var(--tetc-s3)}
.rail .panel-navy .n{font:900 26px var(--tetc-font-display)}

/* Quick-view actions */
.qactions{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.qactions .tetc-btn{padding:12px 18px}

/* ---- Full profile ---- */
.prof-crumbs{font:600 12px var(--tetc-font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--tetc-muted);padding:16px 0}
.prof-crumbs a{color:var(--tetc-muted)}
.prof-hero{background:var(--tetc-navy);color:#fff;overflow:hidden}
.prof-hero .wrap{padding:46px var(--tetc-gutter) 54px;position:relative;z-index:1}
.prof-hero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:var(--tetc-s5);align-items:center}
.prof-hero__text h1{color:#fff;font:900 var(--tetc-hero) var(--tetc-font-display);text-transform:uppercase;line-height:.94;margin:8px 0 14px}
.prof-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.prof-tags span{font:600 11px var(--tetc-font-body);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;padding:6px 12px;border:1px solid rgba(255,255,255,.25);color:#C6D3E6}
.prof-hero__text p{color:#C6D3E6;max-width:52ch;margin:0}
.prof-photo{aspect-ratio:4/5;background:var(--tetc-navy-deep);overflow:hidden;position:relative;border:1px solid rgba(255,255,255,.14)}
.prof-photo img{width:100%;height:100%;object-fit:cover;object-position:center 15%}
.prof-photo .ph{position:absolute;inset:0;display:grid;place-content:center;gap:10px;justify-items:center}
.prof-photo .ph img{height:60px;opacity:.9}
.prof-photo .ph span{font:900 84px var(--tetc-font-display);color:#fff}
.prof-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));background:var(--tetc-navy);border-bottom:var(--tetc-rule) solid var(--tetc-gold);margin-top:-30px;position:relative;z-index:2}
.pstat{padding:24px 18px;text-align:center;border-right:1px solid rgba(255,255,255,.12)}
.pstat:last-child{border-right:0}
.pstat .k{font:600 11px var(--tetc-font-body);letter-spacing:.14em;text-transform:uppercase;color:#9BB0D4;margin-bottom:6px}
.pstat .v{font:900 clamp(30px,3.4vw,46px) var(--tetc-font-display);color:var(--tetc-gold);line-height:1}
.pstat .n{font:400 12px var(--tetc-font-body);color:#9BB0D4;margin-top:4px}

/* Section tint + navy athlete card */
.section--tint{background:var(--tetc-tint)}
.ath-card-navy{background:var(--tetc-navy);border-top:var(--tetc-rule) solid var(--tetc-gold);padding:var(--tetc-s4)}
.ath-card-navy .deflist--navy dt{color:#fff}
.ath-card-navy .deflist--navy dd{color:#C6D3E6}
.prof-honours{list-style:none;margin:0;padding:0}
.prof-honours li{padding:12px 0 12px 16px;border-left:var(--tetc-rule) solid var(--tetc-gold);border-bottom:var(--tetc-border);color:var(--tetc-body);font-size:15px}
.prof-honours li b{color:var(--tetc-navy);font-family:var(--tetc-font-display);font-weight:900;margin-right:10px}

/* CTA band */
.cta{background:var(--tetc-paper);border-top:var(--tetc-rule) solid var(--tetc-navy)}
.cta .wrap{padding:var(--tetc-s6) var(--tetc-gutter);text-align:center}
.cta h2{margin:0 0 10px}
.cta p{max-width:56ch;margin:0 auto var(--tetc-s3);color:var(--tetc-body)}

@media(max-width:900px){
  .ath-grid{grid-template-columns:repeat(2,1fr)}
  .week{grid-template-columns:repeat(2,1fr)}
  .split2,.dash{grid-template-columns:1fr}
  .prof-hero__grid{grid-template-columns:1fr}
  .prof-photo{max-width:300px}
  .prof-stats{margin-top:0}
}

/* Placeholder profiles — on the roster from the club's ranked list, full profile not built yet */
.ath-card .pill-build{font:700 11px var(--tetc-font-body);letter-spacing:.06em;text-transform:uppercase;color:var(--tetc-muted)}
.prof-inbuild{margin:14px 0 0;padding:12px 0 0;border-top:var(--tetc-border);font:400 13.5px var(--tetc-font-body);color:var(--tetc-muted)}

/* Meet-results layer */
.tetc-table .rmeta{display:block;font:400 11.5px var(--tetc-font-body);color:var(--tetc-muted);margin-top:2px}
.tetc-table td.rnote{font:400 12.5px var(--tetc-font-body);color:var(--tetc-muted);line-height:1.45}
.src-list{list-style:none;margin:14px 0 0;padding:0}
.src-list li{font:400 12.5px var(--tetc-font-body);color:var(--tetc-muted);padding:5px 0 5px 14px;border-left:2px solid var(--tetc-cloud)}
.src-list li b{color:var(--tetc-body)}
.rnote-inline{display:none}
@media(max-width:620px){
  /* the 5-column season table folds to 4 on a phone; the note moves under the meet */
  .rnote-inline{display:block;font:400 11.5px var(--tetc-font-body);color:var(--tetc-muted);margin-top:4px;line-height:1.4}
  .tetc-table td.rnote,.tetc-table th.rnote-h{display:none}
}

/* ---- Uniform athlete cards (v2.3) ----
   Every box is the same height: grid rows are forced equal, the card is a
   flex column, the identity block is height-capped, and the mark + CTA are
   pinned to the bottom. One discipline on the card keeps the meta to one line. */
.ath-grid{grid-auto-rows:1fr}
.ath-card{display:flex;flex-direction:column;min-height:200px}
.ath-card__top{align-items:center}
.ath-card__id{min-width:0;flex:1}
.ath-card__name{font-size:19px;line-height:1.06;margin-bottom:5px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ath-card .tetc-kicker.ath-card__meta{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-size:11px;letter-spacing:.16em;color:var(--tetc-muted)}
.ath-card__foot{margin-top:auto}                 /* pins the mark + CTA to the bottom */
.ath-card__mark{min-height:23px}
.ath-card--more{min-height:200px}
@media(max-width:620px){ .ath-card{min-height:0} .ath-grid{grid-auto-rows:auto} }

/* ---- Season results, grouped by meet ---- */
.meetblock{margin-bottom:var(--tetc-s4)}
.meetblock__head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;
  border-left:var(--tetc-rule) solid var(--tetc-navy);padding:2px 0 10px 14px;margin-bottom:10px}
.meetblock__head h3{font:900 20px var(--tetc-font-display);text-transform:uppercase;color:var(--tetc-navy);margin:0}
.meetblock__meta{display:block;font:400 12.5px var(--tetc-font-body);color:var(--tetc-muted);margin-top:2px}
.meetblock__note{font:400 12.5px var(--tetc-font-body);color:var(--tetc-muted);margin:8px 0 0}
.tag-prov{font:700 10px var(--tetc-font-body);letter-spacing:.12em;text-transform:uppercase;
  background:var(--tetc-gold);color:var(--tetc-navy);padding:5px 9px;flex:0 0 auto}

/* ---- Season bests ---- */
.sb{background:var(--tetc-paper);border:var(--tetc-border);border-top:var(--tetc-rule) solid var(--tetc-gold);
  padding:var(--tetc-s3);margin-bottom:var(--tetc-s4)}
.sb__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:14px;margin-top:10px}
.sb__item .k{font:600 10.5px var(--tetc-font-body);letter-spacing:.12em;text-transform:uppercase;color:var(--tetc-muted)}
.sb__item .v{font:900 26px var(--tetc-font-display);color:var(--tetc-navy);line-height:1.1}
.sb__note{font:400 12px var(--tetc-font-body);color:var(--tetc-muted);margin:12px 0 0}
.chip__n{opacity:.6;font-size:11px;margin-left:4px}

/* Card: this season's championship podium, under the headline credential */
.ath-card__season{min-height:17px;margin-top:5px;font:700 11.5px var(--tetc-font-body);
  color:var(--tetc-navy);overflow:hidden;text-overflow:ellipsis}
.ath-card__season span{font-weight:600;color:var(--tetc-muted)}
/* CTA row needed a real gap — "PROFILE" and "QUICK VIEW" were touching */
.ath-card__cta{gap:12px}
.ath-card .pill-live,.ath-card .pill-build,.ath-card .view{letter-spacing:.04em}
/* Row-level provisional flag: outlined, not filled, so a whole meet's worth reads as a note */
.tag-prov--sm{background:transparent;color:#8a6b00;border:1px solid var(--tetc-gold);
  font-size:9px;padding:2px 6px;letter-spacing:.1em}

/* ================================================================
   MOBILE ATHLETE GRID — cascade fix, 2026-08-04
   site.css already carried `@media(max-width:620px){.ath-grid{
   grid-template-columns:1fr}}`, but pages.css loads AFTER site.css and its
   own `@media(max-width:900px){.ath-grid{repeat(2,1fr)}}` has equal
   specificity, so at 390px the later sheet won and the grid stayed at two
   159px columns. 23 of 24 athlete names truncated ("LEM UE…", "SYD NE…").
   The intended rule is simply restated here, after the one overriding it.
   Verify by rendering athletes.html at 390px: one column, no clipped names.
   ================================================================ */
@media(max-width:620px){
  .ath-grid{grid-template-columns:1fr}
  .ath-card__name{font-size:22px;overflow-wrap:normal}
}

/* Achievement badge over an athlete photo (Roster `badge` column) --------- */
.prof-photo{position:relative}
/* A full-width band across the foot of the photo, not a corner chip.
   Sal, 19 Aug 2026, on Evynne's Coaches Award: "put a banner around the
   bottom or something like that." Only two athletes carry a badge today
   (Sydney's scholarship, Evynne's award) and the band suits both. */
.prof-badge{
  position:absolute; left:0; right:0; bottom:0; z-index:2;
  background:var(--tetc-gold); color:var(--tetc-navy);
  font:700 11.5px/1.25 var(--tetc-font-body); letter-spacing:.1em; text-transform:uppercase;
  padding:10px 14px; border-top:3px solid var(--tetc-navy);
  text-align:center; text-wrap:balance;
}
/* Card badge — a gold chip in the card body, NOT over the 62px avatar.
   It sat inside .avatar-c until 9 Aug and covered the photo entirely; that
   circle is display:grid;place-items:center, so the badge became a centred
   grid item and wrapped until it filled the frame. Keep it out of there. */
.card-badge{
  display:block; width:fit-content; max-width:100%; margin-top:7px;
  background:var(--tetc-gold); color:var(--tetc-navy);
  font:700 9px/1.3 var(--tetc-font-body); letter-spacing:.08em; text-transform:uppercase;
  padding:4px 8px; border-left:3px solid var(--tetc-navy); white-space:normal;
}
@media(max-width:520px){ .prof-badge{font-size:10px;padding:7px 10px} }

/* SELF-REPORTED MARK — a small star on the number, one quiet line underneath.
   Used for elementary / grade-8 meets that are not published anywhere we can
   reach. The star is deliberately understated: it should read as a footnote,
   not as a warning label on a child's best time. */
.selfrep{font-weight:400;color:#8894a8;vertical-align:super;margin-left:3px;line-height:1;font-size:.62em}
.pstat .v .selfrep{font-size:.42em;color:#9BB0D4}
.selfrep-note{margin:0 0 26px;font:400 11px var(--tetc-font-body);color:var(--tetc-muted,#8894a8)}
