/* ========================================================================
   World records. Loaded after mockup-guide.css, which supplies the hero,
   stat grid and CTA styles shared with the other explainer pages.
   ======================================================================== */

.rec-verify{
  margin-top:26px;padding:16px 20px;
  border-left:3px solid var(--gold);
  background:rgba(212,175,55,0.06);
  color:var(--ivory-dim);font-size:14.5px;line-height:1.65;max-width:80ch;
}

.rec-stats{padding:56px 40px;background:var(--ink-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.rec-stats .gd-stat-grid{margin-top:0}

/* ---- champions ---- */
.rec-champs{padding:80px 40px;background:var(--ink)}
.rec-champ-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--line);border:1px solid var(--line);margin-top:40px}
.rec-champ{background:var(--ink);padding:28px 26px}
.rec-champ-title{
  font-family:'JetBrains Mono',monospace;font-size:11px;
  text-transform:uppercase;letter-spacing:1.4px;color:var(--muted);margin-bottom:10px;
}
.rec-champ-holder{
  font-family:'Fraunces',serif;font-size:24px;font-weight:700;
  color:var(--gold);margin-bottom:10px;letter-spacing:-0.01em;
}
.rec-champ p{color:var(--ivory-dim);font-size:15px;line-height:1.6}
.rec-runner{
  margin-top:14px;padding-top:12px;border-top:1px solid var(--line);
  font-size:13px;color:var(--muted);
}

/* ---- the club table ---- */
.rec-club{padding:80px 40px;background:var(--ink-2);border-top:1px solid var(--line)}
.rec-tools{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:34px 0 26px}
.rec-tools input{
  flex:1;min-width:260px;max-width:440px;
  background:var(--ink-3);border:1px solid var(--line);border-radius:4px;
  padding:14px 16px;color:var(--ivory);font-family:inherit;font-size:15px;
}
.rec-tools input::placeholder{color:var(--muted)}
.rec-tools input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(212,175,55,0.15)}
.rec-count{
  font-family:'JetBrains Mono',monospace;font-size:12px;
  text-transform:uppercase;letter-spacing:1.3px;color:var(--muted);
}

.rec-band{margin-bottom:34px}
.rec-band[hidden]{display:none}
.rec-band-head{
  display:flex;align-items:baseline;gap:12px;
  font-family:'JetBrains Mono',monospace;font-size:12px;
  text-transform:uppercase;letter-spacing:1.6px;color:var(--gold);
  padding-bottom:12px;margin-bottom:2px;border-bottom:1px solid var(--line);
}
.rec-band-head span{color:var(--muted);font-size:11px}
.rec-rows{display:flex;flex-direction:column}
.rec-row{
  display:grid;grid-template-columns:78px 1fr 150px 190px;
  gap:16px;align-items:baseline;
  padding:11px 4px;border-bottom:1px solid rgba(212,175,55,0.08);
}
.rec-row[hidden]{display:none}
.rec-row:hover{background:rgba(212,175,55,0.04)}
.rec-n{
  font-family:'Fraunces',serif;font-size:21px;font-weight:700;
  color:var(--gold);line-height:1;
}
.rec-who strong{display:block;color:var(--ivory);font-size:15px;font-weight:500}
.rec-who em{display:block;margin-top:4px;color:var(--muted);font-size:12.5px;font-style:normal;line-height:1.5}
/* Only a handful of rows have the story behind them written up; the link sits
   under the name rather than in its own column so the table stays scannable. */
.rec-links{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:6px}
.rec-links a{
  font-family:'JetBrains Mono',monospace;font-size:10.5px;
  text-transform:uppercase;letter-spacing:1.1px;
  color:var(--gold);text-decoration:none;
  border-bottom:1px solid rgba(212,175,55,0.3);padding-bottom:1px;
}
.rec-links a:hover{color:var(--gold-bright);border-bottom-color:var(--gold)}
.rec-champ-link{
  display:inline-block;margin-top:14px;
  font-family:'JetBrains Mono',monospace;font-size:11px;
  text-transform:uppercase;letter-spacing:1.3px;
  color:var(--gold);text-decoration:none;
}
.rec-champ-link:hover{color:var(--gold-bright)}
.rec-when,.rec-where{color:var(--ivory-dim);font-size:13.5px}
.rec-where{color:var(--muted)}
.rec-empty{margin-top:20px;color:var(--muted);font-size:15px}

@media (max-width:1024px){
  .rec-stats,.rec-champs,.rec-club{padding-left:24px;padding-right:24px}
  .rec-champ-grid{grid-template-columns:1fr}
  .rec-row{grid-template-columns:60px 1fr;gap:8px 14px}
  .rec-when,.rec-where{grid-column:2;font-size:12.5px}
  .rec-when{margin-top:-4px}
}