/* self-hosted fonts (no Google-CDN footprint) */
@font-face{font-family:'Barlow Condensed';font-weight:600;font-display:swap;src:url(/fonts/barlowcondensed-600.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-weight:700;font-display:swap;src:url(/fonts/barlowcondensed-700.woff2) format('woff2')}
@font-face{font-family:'Mulish';font-weight:400;font-display:swap;src:url(/fonts/mulish-400.woff2) format('woff2')}
@font-face{font-family:'Mulish';font-weight:500;font-display:swap;src:url(/fonts/mulish-500.woff2) format('woff2')}
@font-face{font-family:'Mulish';font-weight:700;font-display:swap;src:url(/fonts/mulish-700.woff2) format('woff2')}

:root{
  --sage:#3f4d38;          /* primary */
  --sage-deep:#2b3526;     /* darker sage for masthead */
  --sage-soft:#e7eae0;     /* tint blocks */
  --score:#d64545;         /* scoreboard-red accent */
  --score-deep:#b23636;
  --paper:#f7f6f1;         /* warm off-white */
  --ink:#1c2118;
  --muted:#5d6655;
  --line:#d8d9cf;
  --maxw:1180px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:"Mulish",-apple-system,system-ui,sans-serif;color:var(--ink);background:var(--paper);line-height:1.65;-webkit-font-smoothing:antialiased}
h1,h2,h3,.cond{font-family:"Barlow Condensed",Impact,sans-serif;font-weight:600;line-height:1.04;letter-spacing:.01em;text-transform:uppercase}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 1.5rem}

/* ---- Masthead ---- */
.topbar{background:var(--sage-deep);color:#dfe4d6;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:34px}
.topbar .live{display:flex;align-items:center;gap:.45rem;color:#c9d0bd}
.topbar .dot{width:7px;height:7px;border-radius:50%;background:var(--score);box-shadow:0 0 0 0 rgba(214,69,69,.6);animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(214,69,69,.5)}70%{box-shadow:0 0 0 7px rgba(214,69,69,0)}100%{box-shadow:0 0 0 0 rgba(214,69,69,0)}}

header.site{background:var(--paper);border-bottom:3px solid var(--ink)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:1.1rem;padding-bottom:1.1rem;gap:1rem}
.brand{display:flex;align-items:center;gap:.6rem}
.brand svg{display:block}
.brand .name{font-family:"Barlow Condensed";font-weight:700;font-size:2.05rem;text-transform:uppercase;letter-spacing:.02em;line-height:1}
.brand .name b{color:var(--score)}
nav.main{display:flex;gap:1.6rem;align-items:center}
nav.main a{font-family:"Barlow Condensed";text-transform:uppercase;font-weight:600;font-size:1.12rem;letter-spacing:.03em;color:var(--sage);padding:.2rem 0;border-bottom:2px solid transparent;transition:.15s}
nav.main a:hover{color:var(--score);border-color:var(--score)}
.burger{display:none;background:none;border:0;cursor:pointer}
.burger span{display:block;width:26px;height:3px;background:var(--ink);margin:5px 0;border-radius:2px}
#navtoggle{display:none}

/* ---- Lead / featured ---- */
.lead{padding:2.6rem 0 2rem}
.lead-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:2rem;align-items:stretch}
.feature{position:relative;border:1px solid var(--line);background:#fff;overflow:hidden}
.feature .ph{aspect-ratio:16/8;background:linear-gradient(135deg,var(--sage) 0%,var(--sage-deep) 100%);position:relative;display:flex;align-items:flex-end}
.feature .ph .ribbon{position:absolute;top:1rem;left:0;background:var(--score);color:#fff;font-family:"Barlow Condensed";text-transform:uppercase;letter-spacing:.06em;font-size:.85rem;font-weight:600;padding:.3rem 1rem}
.feature .ph .field{position:absolute;inset:0;opacity:.18;background:
  repeating-linear-gradient(90deg,transparent 0 58px,#fff 58px 60px),
  radial-gradient(circle at 50% 120%,#fff 0 1px,transparent 2px)}
.feature .body{padding:1.4rem 1.5rem 1.7rem}
.kicker{font-family:"Barlow Condensed";text-transform:uppercase;letter-spacing:.12em;font-size:.82rem;color:var(--score);font-weight:600}
.feature h2{font-size:2.5rem;margin:.35rem 0 .5rem}
.feature p{color:var(--muted);font-size:1.02rem}
.feature .more{display:inline-block;margin-top:.9rem;font-family:"Barlow Condensed";text-transform:uppercase;letter-spacing:.05em;font-weight:600;color:var(--sage);border-bottom:2px solid var(--score)}

.sidelist{border:1px solid var(--line);background:#fff;display:flex;flex-direction:column}
.sidelist .hd{background:var(--ink);color:var(--paper);font-family:"Barlow Condensed";text-transform:uppercase;letter-spacing:.08em;padding:.6rem 1.1rem;font-size:1.1rem;font-weight:600}
.sidelist ol{list-style:none;counter-reset:r;flex:1}
.sidelist li{counter-increment:r;border-bottom:1px solid var(--line)}
.sidelist li:last-child{border-bottom:0}
.sidelist a{display:grid;grid-template-columns:auto 1fr;gap:.85rem;align-items:baseline;padding:.7rem 1.1rem;transition:.12s}
.sidelist a:hover{background:var(--sage-soft)}
.sidelist a::before{content:counter(r,decimal-leading-zero);font-family:"Barlow Condensed";font-weight:700;color:var(--score);font-size:1.15rem}
.sidelist a span{font-weight:600;font-size:.98rem;line-height:1.3}
.sidelist a small{display:block;color:var(--muted);font-weight:400;font-size:.82rem;text-transform:uppercase;letter-spacing:.05em}

/* ---- Almanac index ---- */
.section-hd{display:flex;align-items:center;gap:1rem;margin:2.6rem 0 1.3rem}
.section-hd h2{font-size:1.9rem;white-space:nowrap}
.section-hd .rule{flex:1;height:3px;background:var(--ink)}
.section-hd .tag{font-family:"Barlow Condensed";text-transform:uppercase;font-size:.8rem;letter-spacing:.1em;color:var(--muted)}

.almanac{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--line);background:#fff}
.sport{display:flex;gap:.85rem;align-items:center;padding:.95rem 1.1rem;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:.12s}
.almanac .sport:nth-child(3n){border-right:0}
.sport:hover{background:var(--sage-soft)}
.sport .ic{flex:0 0 38px;height:38px;border-radius:50%;background:var(--sage-soft);display:flex;align-items:center;justify-content:center;color:var(--sage)}
.sport .ic svg{width:21px;height:21px}
.sport .tx b{font-family:"Barlow Condensed";text-transform:uppercase;letter-spacing:.02em;font-size:1.18rem;font-weight:600;display:block;line-height:1}
.sport .tx small{color:var(--muted);font-size:.8rem}
/* ---- Sport Explorer (filterable, CSS-only) ---- */
.explorer input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.tabs{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:1.1rem}
.tabs label{font-family:"Barlow Condensed";text-transform:uppercase;letter-spacing:.04em;font-weight:600;font-size:1.02rem;padding:.42rem 1.05rem;border:2px solid var(--ink);background:var(--paper);color:var(--ink);cursor:pointer;transition:.15s;line-height:1;user-select:none}
.tabs label:hover{background:var(--sage-soft)}
.grid-ex{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem}
.grid-ex .sport{border:1px solid var(--line);background:#fff}
#sf-all:checked~.tabs label[for=sf-all],#sf-ball:checked~.tabs label[for=sf-ball],#sf-racket:checked~.tabs label[for=sf-racket],#sf-track:checked~.tabs label[for=sf-track],#sf-combat:checked~.tabs label[for=sf-combat],#sf-precision:checked~.tabs label[for=sf-precision]{background:var(--ink);color:var(--paper)}
#sf-ball:checked~.grid-ex .sport:not([data-cat~=ball]),#sf-racket:checked~.grid-ex .sport:not([data-cat~=racket]),#sf-track:checked~.grid-ex .sport:not([data-cat~=track]),#sf-combat:checked~.grid-ex .sport:not([data-cat~=combat]),#sf-precision:checked~.grid-ex .sport:not([data-cat~=precision]){display:none}
@media(max-width:860px){.grid-ex{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.grid-ex{grid-template-columns:1fr}}

/* ---- Athletes strip ---- */
.athletes{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;margin-bottom:1rem}
.ath{text-align:center}
.ath .av{aspect-ratio:1;border-radius:50%;border:3px solid var(--ink);margin:0 auto .6rem;max-width:120px;overflow:hidden;background:var(--sage-soft);box-shadow:0 5px 16px rgba(28,33,24,.2)}
.ath .av img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(.18) contrast(1.03);transition:.3s}
.ath:hover .av img{filter:none;transform:scale(1.05)}
.credit-note{text-align:center;color:var(--muted);font-size:.76rem;margin:.2rem 0 .4rem}
.credit-note a{border-bottom:1px solid var(--line)}
.ath b{font-family:"Barlow Condensed";text-transform:uppercase;font-size:1.12rem;display:block;line-height:1.05}
.ath small{color:var(--muted);font-size:.8rem}

/* ---- Stat band ---- */
.band{background:var(--sage-deep);color:var(--paper);margin-top:3rem}
.band .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding:2.2rem 1.5rem;text-align:center}
.band .n{font-family:"Barlow Condensed";font-weight:700;font-size:2.8rem;color:#fff;line-height:1}
.band .l{text-transform:uppercase;letter-spacing:.1em;font-size:.78rem;color:#c4cdb6;margin-top:.3rem}

/* ---- Footer ---- */
footer.site{background:var(--ink);color:#c3c8bc;font-size:.92rem;margin-top:0}
footer.site .wrap{padding:2.6rem 1.5rem 1.4rem;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem}
footer.site h4{font-family:"Barlow Condensed";text-transform:uppercase;color:#fff;letter-spacing:.06em;margin-bottom:.8rem;font-size:1.15rem;font-weight:600}
footer.site a{color:#c3c8bc;line-height:1.9}
footer.site a:hover{color:var(--score)}
footer.site .blurb{color:#9aa291;max-width:34ch}
.copy{border-top:1px solid #333a2d;color:#878f7c;text-align:center;padding:1rem;font-size:.82rem}

@media(max-width:860px){
  .lead-grid{grid-template-columns:1fr}
  .almanac{grid-template-columns:repeat(2,1fr)}
  .almanac .sport:nth-child(3n){border-right:1px solid var(--line)}
  .almanac .sport:nth-child(2n){border-right:0}
  .athletes{grid-template-columns:repeat(3,1fr)}
  .band .wrap{grid-template-columns:repeat(2,1fr)}
  footer.site .wrap{grid-template-columns:1fr}
  nav.main{position:fixed;inset:0 0 0 auto;width:74%;max-width:320px;background:var(--sage-deep);flex-direction:column;align-items:flex-start;padding:5rem 2rem;gap:1.1rem;transform:translateX(100%);transition:.25s;z-index:50}
  nav.main a{color:var(--paper);font-size:1.4rem}
  #navtoggle:checked ~ nav.main{transform:translateX(0)}
  .burger{display:block;z-index:60}
}
@media(max-width:480px){.almanac{grid-template-columns:1fr}.almanac .sport{border-right:0}.athletes{grid-template-columns:repeat(2,1fr)}.band .wrap{grid-template-columns:1fr}}

/* ===== Article / interior pages ===== */
.crumb{font-family:'Barlow Condensed';text-transform:uppercase;letter-spacing:.06em;font-size:.82rem;color:var(--muted);padding:1.4rem 0 0}
.crumb a{color:var(--sage)}.crumb a:hover{color:var(--score)}.crumb span{color:var(--line)}
.page-hero{background:var(--sage-deep);color:var(--paper);border-bottom:3px solid var(--ink);margin-bottom:2rem}
.page-hero .wrap{padding:1.4rem 1.5rem 2rem}
.page-hero .cat{display:inline-block;background:var(--score);color:#fff;font-family:'Barlow Condensed';text-transform:uppercase;letter-spacing:.06em;font-weight:600;font-size:.8rem;padding:.25rem .8rem;margin-bottom:.7rem}
.page-hero h1{font-size:clamp(2.1rem,5vw,3.2rem);color:#fff;max-width:20ch}
.byline{font-family:'Barlow Condensed';text-transform:uppercase;letter-spacing:.06em;font-size:.82rem;color:#c4cdb6;margin-top:.8rem}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:2.6rem;align-items:start;padding-bottom:3rem}
.prose{max-width:none;font-size:1.06rem}
.prose>p:first-of-type{font-size:1.18rem;line-height:1.6;color:var(--ink)}
.prose h2{font-size:1.75rem;margin:2.1rem 0 .8rem;padding-bottom:.3rem;border-bottom:2px solid var(--line)}
.prose h3{font-family:'Barlow Condensed';text-transform:uppercase;letter-spacing:.02em;font-size:1.3rem;margin:1.5rem 0 .5rem}
.prose p{margin:0 0 1.1rem}
.prose ul,.prose ol{margin:0 0 1.2rem 1.3rem}.prose li{margin:.35rem 0}
.prose a{color:var(--score);border-bottom:1px solid rgba(214,69,69,.35)}.prose a:hover{border-color:var(--score)}
.prose strong{color:var(--ink)}
.prose blockquote{border-left:4px solid var(--sage);background:var(--sage-soft);margin:1.4rem 0;padding:.9rem 1.2rem;font-style:italic}
.prose table{width:100%;border-collapse:collapse;margin:1.3rem 0;font-size:.96rem}
.prose th{background:var(--sage-deep);color:var(--paper);font-family:'Barlow Condensed';text-transform:uppercase;letter-spacing:.03em;text-align:left;padding:.55rem .7rem}
.prose td{border:1px solid var(--line);padding:.55rem .7rem}
.prose tbody tr:nth-child(even){background:#fff}
/* FAQ accordion — smooth open */
.faq{margin:2.4rem 0 0}
.faq>h2{font-size:1.75rem;margin-bottom:.4rem;padding-bottom:.3rem;border-bottom:2px solid var(--line)}
details.faq-item{border-bottom:1px solid var(--line)}
details.faq-item summary{cursor:pointer;list-style:none;padding:1rem 0;font-family:'Barlow Condensed';text-transform:uppercase;letter-spacing:.01em;font-weight:600;font-size:1.18rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}
details.faq-item summary::-webkit-details-marker{display:none}
details.faq-item summary::after{content:"+";color:var(--score);font-size:1.6rem;line-height:1;transition:transform .25s}
details.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s ease}
details.faq-item[open] .faq-a{grid-template-rows:1fr}
.faq-a>div{overflow:hidden}
.faq-a p{margin:0 0 1rem;color:var(--muted)}
/* sidebar */
.side{position:sticky;top:1rem}
.side .box{border:1px solid var(--line);background:#fff;margin-bottom:1.4rem}
.side .box h4{font-family:'Barlow Condensed';text-transform:uppercase;letter-spacing:.05em;background:var(--ink);color:var(--paper);padding:.55rem .9rem;font-size:1.05rem;font-weight:600}
.side .box ul{list-style:none}
.side .box li{border-bottom:1px solid var(--line)}.side .box li:last-child{border-bottom:0}
.side .box a{display:block;padding:.6rem .9rem;font-weight:600;font-size:.92rem;transition:.12s}
.side .box a:hover{background:var(--sage-soft);color:var(--score)}
.side .box a small{display:block;color:var(--muted);font-weight:400;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em}
/* simple/static pages */
.simple{max-width:760px;padding-bottom:3rem}
.simple h1{font-size:clamp(2rem,5vw,3rem);margin:1.4rem 0 1rem}
@media(max-width:860px){.layout{grid-template-columns:1fr}.side{position:static}}

/* ===== Hero medallion (interior pages) ===== */
.page-hero .wrap{display:flex;align-items:center;justify-content:space-between;gap:2rem}
.page-hero .htext{flex:1;min-width:0}
.medallion{flex:0 0 auto;width:150px;height:150px;border-radius:50%;border:4px solid var(--score);background:var(--sage);box-shadow:0 8px 24px rgba(0,0,0,.28);object-fit:cover}
@media(max-width:680px){.page-hero .wrap{flex-direction:column;align-items:flex-start;gap:1.2rem}.medallion{width:96px;height:96px}}

/* breathing room: keep athlete labels clear of the dark stat band */
#athletes{padding-bottom:2.4rem}
.ath b{margin-top:.15rem}
.ath small{color:var(--muted)}

/* ===== Homepage intro (H1) ===== */
.home-intro{padding:2.4rem 0 .4rem}
.home-intro h1{font-size:clamp(2.1rem,5vw,3.4rem);max-width:22ch;margin-bottom:.7rem}
.home-intro p{font-size:1.1rem;color:var(--muted);max-width:72ch}
.home-intro a{color:var(--score);border-bottom:1px solid rgba(214,69,69,.35)}
