.football-hero {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);
  align-items:center;
  gap:clamp(18px,3vw,42px);
  margin-top:22px;
  padding:clamp(24px,4vw,58px);
  padding-inline-end:clamp(16px,2vw,30px);
  border:1px solid #7762a4;
  border-radius:20px;
  background:radial-gradient(ellipse at 91% 20%,#453181,transparent 59%),linear-gradient(118deg,#211637,#2d214c);
}
.football-hero h1 { font-size:clamp(38px,5.5vw,66px); word-break:keep-all; }
.football-hero .lead { margin:14px 0 18px; }
.football-example {
  display:inline-flex;
  padding:5px 10px;
  border:1px solid #c3b3e780;
  border-radius:6px;
  background:#1b142d;
  color:#efe5ff;
  font-size:13px;
  font-weight:700;
}
.football-hero-image {
  display:block;
  width:100%;
  height:auto;
  border:1px solid #9b81d2a0;
  border-radius:13px;
  background:#211638;
  box-shadow:0 12px 28px #150e3380;
}
.football-section { margin-top:25px; }
.football-section-heading {
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  align-items:baseline;
  gap:8px 18px;
  margin-bottom:16px;
}
.football-section-heading h2,.football-guide h2 { font-size:clamp(27px,3.3vw,40px); }
.football-section-heading p,.football-source { margin:0; color:var(--muted); font-size:14px; }
.football-board { overflow:hidden; border:1px solid #4d406a; border-radius:13px; background:#1b152b; }
.football-board [hidden] { display:none; }
.football-controls {
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  padding:14px clamp(12px,2vw,20px);
  background:#241b39;
}
.football-periods { display:flex; flex-wrap:wrap; gap:6px; }
.football-periods button {
  min-height:44px;
  min-width:64px;
  padding:6px 12px;
  border:1px solid transparent;
  border-radius:7px;
  background:#31264b;
  color:#efe6ff;
  font:inherit;
  font-size:15px;
  font-weight:750;
  cursor:pointer;
}
.football-periods button:hover { border-color:#a98add; }
.football-periods button[aria-pressed="true"] { background:#c7f78a; color:#1c2814; }
.football-select {
  display:flex;
  align-items:center;
  gap:9px;
  color:var(--muted);
  font-size:14px;
  white-space:nowrap;
}
.football-select select { min-height:44px; width:auto; max-width:100%; padding:6px 10px; border:1px solid #72638f; border-radius:7px; background:#171123; }
.football-count { margin:0; padding:9px clamp(12px,2vw,20px); background:#201830; color:var(--muted); font-size:13px; }
.football-fixtures { margin:0; padding:0; list-style:none; }
.football-fixture {
  display:grid;
  grid-template-columns:minmax(135px,.8fr) minmax(0,2.8fr) 48px;
  align-items:center;
  gap:clamp(8px,1.7vw,20px);
  padding:14px clamp(12px,2vw,20px);
  border-top:1px solid var(--line);
}
.football-fixture-meta { display:grid; gap:1px; line-height:1.4; }
.football-competition { color:#eadfff; font-size:14px; font-weight:750; }
.football-fixture-meta time { color:var(--muted); font-size:13px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.football-matchup {
  display:grid;
  grid-template-columns:minmax(0,1fr) 54px minmax(0,1fr);
  align-items:center;
  gap:clamp(5px,1vw,12px);
  text-align:center;
}
.football-team { display:grid; gap:1px; min-width:0; }
.football-team strong { font-size:15px; line-height:1.33; word-break:keep-all; overflow-wrap:anywhere; }
.football-team-role { color:var(--muted); font-size:11px; line-height:1.2; }
.football-score {
  padding:4px 2px;
  border:1px solid #61517c;
  border-radius:6px;
  background:#271e3c;
  color:#f6edff;
  font:750 15px/1.3 ui-monospace,monospace;
  white-space:nowrap;
}
.football-score-pending { color:var(--muted); font-size:12px; }
.football-status {
  justify-self:end;
  padding:2px 6px;
  border:1px solid #9c83ca75;
  border-radius:5px;
  color:#e7d8ff;
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
}
.football-status[data-status="finished"] { border-color:#83b68090; color:#b6e5ad; }
.football-empty { margin:0; padding:24px clamp(12px,2vw,20px); border-top:1px solid var(--line); color:var(--muted); }
.football-source { margin:10px 0 0; }
.football-guide-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:20px; }
.football-guide-grid article { padding:17px; border:1px solid var(--line); border-radius:10px; background:#211735; }
.football-guide-grid h3 { font-size:20px; margin-bottom:9px; }
.football-guide-grid p { color:var(--muted); font-size:15px; margin:0; }
@media (max-width:700px) {
  .football-hero { grid-template-columns:1fr; padding-inline:12px; }
  .football-hero-copy { padding-inline:12px; }
  .football-fixture { grid-template-columns:minmax(0,1fr) 48px; }
  .football-fixture-meta { grid-column:1; grid-row:1; display:flex; flex-wrap:wrap; align-items:center; gap:4px 10px; }
  .football-status { grid-column:2; grid-row:1; }
  .football-matchup { grid-column:1/-1; grid-row:2; }
  .football-guide-grid { grid-template-columns:1fr; gap:10px; }
}