@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
   /* :root {
      --gold: #c9a84c;
      --gold-light: #f0d080;
      --gold-dim: #7a6030;
      --bg-deep: #050810;
      --bg-card: #0d1220;
      --bg-card2: #111827;
      --border: rgba(201,168,76,0.18);
      --text-main: #e8e8e8;
      --text-muted: #7a8499;
      --green-group: #00c853;
    } */
 
    /* artic white */
    /* :root {
      --gold: #1a73e8;
      --gold-light: #4a9eff;
      --gold-dim: #a0b4cc;
      --bg-deep: #f4f6f9;
      --bg-card: #ffffff;
      --bg-card2: #eef1f5;
      --border: rgba(26,115,232,0.15);
      --text-main: #0d1117;
      --text-muted: #6b7280;
    } */
    /* Pitch Black (Deep Carbon) */
    /* :root {
      --gold: #00c853;
      --gold-light: #69f0ae;
      --gold-dim: #1b5e20;
      --bg-deep: #0a0a0a;
      --bg-card: #141414;
      --bg-card2: #1c1c1c;
      --border: rgba(0,200,83,0.15);
      --text-main: #f1f1f1;
      --text-muted: #666666;
    } */
     /* charchol */
    /* :root {
      --gold: #e63946;
      --gold-light: #ff6b6b;
      --gold-dim: #7f1d1d;
      --bg-deep: #0f0f0f;
      --bg-card: #181818;
      --bg-card2: #212121;
      --border: rgba(230,57,70,0.18);
      --text-main: #f0f0f0;
      --text-muted: #737373;
    } */

    /* cream */
    /* :root {
      --gold: #b8860b;
      --gold-light: #daa520;
      --gold-dim: #8b6914;
      --bg-deep: #faf7f2;
      --bg-card: #ffffff;
      --bg-card2: #f5f0e8;
      --border: rgba(184,134,11,0.18);
      --text-main: #1a1208;
      --text-muted: #8a7a60;
    } */

    /* desert */
    :root {
    --gold: #c9a84c;
    --gold-light: #f0d080;
    --gold-dim: #7a6030;
    --bg-deep: #fdf6ed;
    --bg-card: #fffaf4;
    --bg-card2: #f5ede0;
    --border: rgba(194,65,12,0.15);
    --text-main: #1c0a00;
    --text-muted: #92714f;
  }
    * { box-sizing: border-box; margin: 0; padding: 0; }
 
    body {
      background: var(--bg-deep);
      color: var(--text-main);
      font-family: "Inter", sans-serif;
      overflow-x: hidden;
    }
 figure{margin: 0 !important;}
.banner-wrapper {
    position: sticky;
    top: 0;
    z-index:0;
    width: 100%;
    height: 100vh;
    min-height: 100vh;
    min-height: 100dvh;
    overflow: hidden;
}

.banner-wrapper figure {
    width: 100%;
    height: 100%;
    margin: 0;
}

.banner-wrapper figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    object-position: 76%;
}

.banner-wrapper::after {
    content: "";
    position: absolute;
    inset: 0; 
    background: linear-gradient(
        to top,
        #000 0%,
        rgba(0, 0, 0, 0.8) 35%,
        rgba(0, 0, 0, 0.35) 65%,
        transparent 100%
    );
    pointer-events: none;
}
.banner-content{
    position: absolute;
    left: 192px;
    bottom:64px;
    padding: 2rem;
    color: white;
    z-index: 1;
}
.banner-content p{
    max-width:600px;
    margin-top: 10px;
}
.banner-content h1{
  font-size: 54px;
  font-weight: 600;
  letter-spacing: 2px;
  margin-bottom: 10px;
  line-height: 46px;
  color: var(--gold);
}
.banner-content span,
.banner-content .banner-tagline{
    font-size: 24px;
    font-weight: 500;
}
@keyframes sweep {
  0%   { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}


    /* ── SECTION SHARED ── */
    .section-wrap {
      padding: 100px 0 80px;
      position: relative;
    }
    .section-wrap::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 1px;
      background: linear-gradient(to right, transparent, var(--gold), transparent);
    }
    .schedule-header{
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
    .schedule-header .nav-link{
      color: rgb(0, 0, 0);
    }
    .schedule-header .nav-pills .nav-link.active{
      background-color: var(--gold);
      color: white;
      border-radius: 16px;
    }
    @media screen and (max-width: 993px) {
      .schedule-header{
        flex-direction: column;
        gap: 20px;
        align-items: flex-start;
      }
    }

    .schedule-header--full {
      display: block;
    }

    .schedule-all-list {
      margin-top: 8px;
    }

    .schedule-all-day {
      margin-bottom: 8px;
    }

    .schedule-all-day:last-child {
      margin-bottom: 0;
    }

    .schedule-today-divider {
      display: flex;
      align-items: center;
      gap: 10px;
      margin: 0.5rem 0 1.5rem;
    }

    .schedule-today-divider::before,
    .schedule-today-divider::after {
      content: "";
      flex: 1;
      height: 1px;
      background: var(--gold);
      opacity: 0.45;
    }

    .schedule-today-divider span {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.12em;
      color: var(--gold);
    }

    #scheduleLatestResult {
      scroll-margin-top: 100px;
    }
    .section-eyebrow {
      
      font-size: 12px;
      letter-spacing: 5px;
      color: var(--gold);
      text-transform: uppercase;
      margin-bottom: 8px;
    }
    .section-title {
      font-size: clamp(38px, 7vw, 60px);
      letter-spacing: 3px;
      line-height: 1;
      color: #000000;
      margin-bottom: 4px;
    }
    .section-title span { color: var(--gold); }
    .section-subtitle {
      font-size: 15px;
      color: var(--text-muted);
      font-weight: 300;
      margin-bottom: 48px;
    }
 
    /* ── POINTS TABLE ── */
    #points { background: var(--bg-deep); }
 
    .groups-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
      gap: 20px;
    }

    .groups-grid--standings-page {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
 
    .group-card {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 10px;
      overflow: hidden;
      transition: transform 0.3s, border-color 0.3s;
    }
    .group-card:hover {
      transform: translateY(-3px);
      border-color: rgba(201,168,76,0.4);
    }
 
    .group-header {
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 14px 18px;
      border-bottom: 1px solid var(--border);
    }
    .group-letter {
      
      font-size: 32px;
      color: var(--gold);
      line-height: 1;
      width: 32px;
      flex-shrink: 0;
    }
    .group-name {
      
      font-size: 13px;
      letter-spacing: 3px;
      color: var(--text-muted);
      text-transform: uppercase;
    }
 
    .group-table { width: 100%; border-collapse: collapse; }
    .group-table thead tr {
      border-bottom: 1px solid var(--border);
    }
    .group-table thead th {
      
      font-size: 11px;
      letter-spacing: 2px;
      color: var(--text-muted);
      text-transform: uppercase;
      padding: 8px 10px;
      font-weight: 600;
      text-align: center;
    }
    .group-table thead th:first-child { text-align: left; padding-left: 18px; }
    .group-table tbody tr {
      border-bottom: 1px solid rgba(255,255,255,0.04);
      transition: background 0.2s;
    }
    .group-table tbody tr:last-child { border-bottom: none; }
    .group-table tbody tr:hover { background: rgba(201,168,76,0.05); }
    .group-table td {
      padding: 10px 7px;
      font-size: 13px;
      text-align: center;
      color: var(--text-muted);
    }
  .group-table td:first-child {
  text-align: left;
  padding-left: 18px;
  color: var(--text-main);
  font-weight: 500;
  white-space: nowrap;
   display: table-cell;
  vertical-align: middle;
}
    .group-table td.pts {
      color: var(--gold);
      font-weight: 700;
      
      font-size: 15px;
    }
    .flag-icon { font-size: 16px; margin-right: 8px; }
    .dash { color: #2a3040; }
 
    /* ── GOLDEN BOOT ── */
    #golden-boot {
      background: var(--bg-deep);
    }
 
    .boot-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
      gap: 24px;
    }
 
    .boot-card {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 12px;
      overflow: hidden;
      position: relative;
      transition: transform 0.3s;
    }
    @media screen and (min-width:992px) {
      .boot-card {
        height:290px;
        overflow: scroll;
      }
    }
    .boot-card:hover { transform: translateY(-4px); }
    .boot-card.leader {border: 1px solid var(--gold); }
    .boot-card.leader::before {
      content: 'LEADER';
      position: absolute;
      top: 14px; left: 14px;
      
      font-size: 10px; letter-spacing: 3px;
      background: var(--gold);
      color: #000;
      padding: 3px 8px;
      border-radius: 3px;
      font-weight: 700;
    }
 
   .boot-avatar {
      width: 100%;
      height: 220px;
      background: linear-gradient(180deg, #0d1220 0%, #1a2035 100%);
      border-bottom: 1px solid var(--border);
      overflow: hidden;
      position: relative;
    }
    .boot-avatar::after {
      content: '';
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 60px;
      background: linear-gradient(to top, #454545, transparent);
    }
 
    .boot-body { padding: 20px; }
    .boot-country {
      display: flex;
      align-items: center;
      flex-direction: column;
      justify-content: space-between;
      column-gap: 10px;
      font-size: 11px;
      letter-spacing: 3px;
      color: var(--gold);
      text-transform: uppercase;
      margin-bottom: 4px;
    }
     .boot-country span{
        display: block;
        font-size: 18px;
     }
    .boot-avatar img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: top center;
      display: block;
      transition: transform 0.4s;
    }
    .boot-card:hover .boot-avatar img {
      transform: scale(1.04);
    }
    
    .boot-name p{
      font-size: 14px;
      color:#000;
      line-height: 1;
      margin-bottom: 4px;
    }
    
    .boot-name span{
      font-size: 10px;
      color:var(--gold);
      line-height: 1;
    }
    .country-info{
      display: flex;
      align-items: start;
      gap: 10px;
      margin: 20px 0;
    }
     .boot-country figure{
        width: 80px;
        height:80px;
        box-shadow: 0px 0px 3px rgba(0, 0, 0, .6);
        border-radius: 50%;
        overflow: hidden;
        display: flex;
        align-items: end;
        justify-content: center;
    }
    .boot-country figure img{
        width: 90%;
        height: 90%;
        object-fit: cover;
        object-position: bottom center;
    }
    .boot-country  .country-flag{
      width: 25px;
      height: 25px;
      box-shadow: none;
      border-radius: 0;
    }
     .boot-country  .country-flag img{
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
   
    
    .boot-stats {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 10px;
    }
    .boot-stat {
      background: var(--bg-card2);
      border: 1px solid var(--border);
      border-radius: 8px;
      padding: 10px 8px;
      text-align: center;
    }
    .boot-stat-val {
      
      font-size: 26px;
      color: var(--gold);
      line-height: 1;
    }
    .boot-stat-label {
      font-size: 10px;
      letter-spacing: 1.5px;
      color: var(--text-muted);
      text-transform: uppercase;
      margin-top: 3px;
    }
    .boot-stat-val.na { color: #2a3040; font-size: 20px; }
    /* ── SCORER LIST ROWS (positions 4–10) ── */
.scorer-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 20px;
  border-bottom: 1px solid var(--border);
  transition: background 0.2s;
}
.scorer-row:hover {
  background: rgba(201,168,76,0.05);
}
.scorer-rank {
  font-size: 13px;
  font-weight: 700;
  color: var(--gold-dim);
  width: 18px;
  flex-shrink: 0;
  text-align: center;
}
.scorer-flag {
  font-size: 20px;
  flex-shrink: 0;
}
.scorer-name {
  flex: 1;
  font-size: 14px;
  font-weight: 500;
  color: var(--text-main);
  line-height: 1.2;
}
.scorer-country {
  display: block;
  font-size: 11px;
  font-weight: 400;
  color: var(--text-muted);
  letter-spacing: 0.5px;
}
.scorer-goals {
  font-size: 18px;
  font-weight: 700;
  color: var(--gold);
  flex-shrink: 0;
  text-align: right;
  min-width: 36px;
  font-family: inherit;
}
.scorer-goals-label {
  display: block;
  font-size: 10px;
  font-weight: 400;
  color: var(--text-muted);
  letter-spacing: 1px;
  text-transform: uppercase;
  text-align: right;
}
    /* ── HISTORY ── */
    #history { background: var(--bg-deep); }
 
    .timeline {
      position: relative;
      padding-left: 40px;
    }
    .timeline::before {
      content: '';
      position: absolute;
      left: 10px; top: 0; bottom: 0;
      width: 1px;
      background: linear-gradient(to bottom, var(--gold), transparent);
    }
 
    .timeline-item {
      position: relative;
      margin-bottom: 32px;
      opacity: 0;
      transform: translateX(-20px);
      animation: fadeSlide 0.5s forwards;
    }
    .timeline-item:nth-child(1)  { animation-delay: 0.05s; }
    .timeline-item:nth-child(2)  { animation-delay: 0.10s; }
    .timeline-item:nth-child(3)  { animation-delay: 0.15s; }
    .timeline-item:nth-child(4)  { animation-delay: 0.20s; }
    .timeline-item:nth-child(5)  { animation-delay: 0.25s; }
    .timeline-item:nth-child(6)  { animation-delay: 0.30s; }
    .timeline-item:nth-child(7)  { animation-delay: 0.35s; }
    .timeline-item:nth-child(8)  { animation-delay: 0.40s; }
    .timeline-item:nth-child(9)  { animation-delay: 0.45s; }
    .timeline-item:nth-child(10) { animation-delay: 0.50s; }
    .timeline-item:nth-child(11) { animation-delay: 0.55s; }
    .timeline-item:nth-child(12) { animation-delay: 0.60s; }
    .timeline-item:nth-child(13) { animation-delay: 0.65s; }
    .timeline-item:nth-child(14) { animation-delay: 0.70s; }
    .timeline-item:nth-child(15) { animation-delay: 0.75s; }
    .timeline-item:nth-child(16) { animation-delay: 0.80s; }
    .timeline-item:nth-child(17) { animation-delay: 0.85s; }
    .timeline-item:nth-child(18) { animation-delay: 0.90s; }
    .timeline-item:nth-child(19) { animation-delay: 0.95s; }
    .timeline-item:nth-child(20) { animation-delay: 1.00s; }
    .timeline-item:nth-child(21) { animation-delay: 1.05s; }
    .timeline-item:nth-child(22) { animation-delay: 1.10s; }
 
    @keyframes fadeSlide {
      to { opacity: 1; transform: translateX(0); }
    }
 
    .timeline-dot {
      position: absolute;
      left: -35px;
      top: 40px;
      width: 10px; height: 10px;
      border-radius: 50%;
      background: var(--gold-dim);
      border: 2px solid var(--gold);
      transition: background 0.3s;
    }
    .timeline-item:hover .timeline-dot { background: var(--gold); }
    .timeline-item.champion .timeline-dot {
      background: var(--gold);
      box-shadow: 0 0 10px var(--gold);
    }
 
    .timeline-card {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 18px 22px;
      display: grid;
      grid-template-columns: 80px 1fr auto;
      align-items: center;
      gap: 20px;
      transition: border-color 0.2s, transform 0.2s;
      cursor: default;
    }
    .timeline-card:hover {
      border-color: rgba(201,168,76,0.4);
      transform: translateX(4px);
    }
 
    .tl-year {
      font-size: 32px;
      color: var(--gold);
      line-height: 1;
    }
    .tl-host {
      font-size: 11px;
      letter-spacing: 2px;
      color: var(--text-muted);
      text-transform: uppercase;
    }
 
    .tl-info { }
    .tl-champion {
      font-size: 20px;
      font-weight: 500;
      color: #000000;
      letter-spacing: 1px;
    }
    .tl-final {
      font-size: 13px;
      color: var(--text-muted);
      margin-top: 2px;
    }
    .tl-final strong { color: var(--text-main); }
 
    .tl-trophy {
      font-size: 28px;
      opacity: 0.7;
    }
 
    /* ── SCROLL DIVIDER ── */
    .gold-divider {
      width: 60px; height: 2px;
      background: linear-gradient(to right, var(--gold), transparent);
      margin: 12px 0 48px;
    }

/* ── NEWS ── */
#news { background:var(--bg-deep); }

.news-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

/* Featured */
.news-featured {
  display: flex;
  flex-direction: column;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--border);
  background: var(--bg-card);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.3s, transform 0.3s;
}
.news-featured:hover {
  border-color: rgba(201,168,76,0.4);
  transform: translateY(-3px);
}
.news-featured-img {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  overflow: hidden;
}
.news-featured-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s;
}
.news-featured:hover .news-featured-img img { transform: scale(1.04); }
.news-featured-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, transparent 60%);
}
.news-featured-badge {
  position: absolute;
  top: 14px;
  left: 14px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 4px 10px;
  
  font-size: 11px;
  letter-spacing: 2px;
  color: var(--gold);
  text-transform: uppercase;
}
.news-featured-body {
  padding: 20px 22px;
}
.news-featured-body h3 {
  
  font-size: 22px;
  font-weight: 700;
  color: var(--text-main);
  line-height: 1.3;
  margin-bottom: 12px;
  letter-spacing: 0.5px;
}

.news-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.news-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 0;
border-bottom: 1px solid #ddd;
  text-decoration: none;
  color: inherit;
  transition: background 0.2s;
}
.news-item:first-child { padding-top: 0; }
.news-item:hover h4 { color: var(--gold); }

.news-item-body { flex: 1; }
.news-item-body h4 {
  font-size: 18px;
  font-weight: 400;
  color: var(--text-main);
  line-height: 1.45;
  margin-bottom: 8px;
  transition: color 0.2s;
}

.news-item-img {
  width: 140px;
  height: auto;
  border-radius: 6px;
  overflow: hidden;
  flex-shrink: 0;
  border: 1px solid var(--border);
}
.news-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s;
}
.news-item:hover .news-item-img img { transform: scale(1.06); }

.news-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--text-muted);
  
  letter-spacing: 0.5px;
}
.news-source {
  color: var(--gold);
  font-weight: 600;
  font-size: 12px;
}
.news-dot { color: var(--text-muted); }

.news-see-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 16px;
  
  font-size: 13px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--gold);
  text-decoration: none;
  transition: gap 0.2s;
}
.news-see-more:hover { gap: 10px; }
.news-see-more span { font-size: 16px; }

.news-more-section {
  margin-top: 48px;
  padding-top: 40px;
  border-top: 1px solid var(--border);
}

.news-more-heading {
  font-size: clamp(28px, 4vw, 36px);
  font-weight: 400;
  letter-spacing: 1.5px;
  color: var(--text-main);
  margin: 0 0 28px;
}

.news-more-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.news-item--more:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

/* ── SCHEDULE ── */
#schedule { background: var(--bg-deep); }

/* Date nav */
.schedule-nav {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px 14px;
  margin-bottom: 20px;
  overflow: hidden;
}
.schedule-nav-arrow {
  background: rgba(201,168,76,0.08);
  border: 1px solid var(--border);
  color: var(--gold);
  width: 34px; height: 34px;
  border-radius: 50%;
  font-size: 20px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  transition: background 0.2s;
  line-height: 1;
}
.schedule-nav-arrow:hover { background: rgba(201,168,76,0.2); }

.schedule-date-tabs {
  display: flex;
  gap: 6px;
  flex: 1;
  overflow-x: auto;
  scrollbar-width: none;
}
.schedule-date-tabs::-webkit-scrollbar { display: none; }

.date-tab {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8px 14px;
  border-radius: 8px;
  border: 1px solid transparent;
  cursor: pointer;
  background: none;
  color: var(--text-muted);
  
  white-space: nowrap;
  transition: all 0.2s;
  flex-shrink: 0;
}
.date-tab:hover { background: rgba(201,168,76,0.06); color: var(--text-main); }
.date-tab.active {
  background: rgba(201,168,76,0.12);
  border-color: var(--gold);
  color: var(--gold);
}
.date-tab-day { font-size: 11px; letter-spacing: 2px; text-transform: uppercase; }
.date-tab-num { font-size: 20px; font-weight: 700; line-height: 1.2; }
.date-tab-month { font-size: 10px; letter-spacing: 1px; text-transform: uppercase; opacity: 0.7; }
/* ── SCHEDULE DAY LABEL ── */
.schedule-day-label {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.schedule-day-date {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-main);
  letter-spacing: 1px;
}
.schedule-day-tag {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  background: rgba(255,255,255,0.06);
  color: var(--text-muted);
  padding: 3px 10px;
  border-radius: 20px;
}
.schedule-day-tag.today {
  background: rgba(201,168,76,0.12);
  color: var(--gold);
  border: 1px solid rgba(201,168,76,0.3);
}

/* ── MATCH VS ── */
.match-vs {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-muted);
}

/* Filter pills */
.schedule-filters {
  display: flex;
  gap: 10px;
  margin-bottom: 28px;
  flex-wrap: wrap;
}
.filter-pill {
  background: var(--bg-card);
  border: 1px solid var(--border);
  color: var(--text-muted);
  padding: 7px 18px;
  border-radius: 30px;
  
  font-size: 13px;
  letter-spacing: 2px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.2s;
}
.filter-pill:hover { border-color: rgba(201,168,76,0.4); color: var(--text-main); }
.filter-pill.active {
  background: rgba(201,168,76,0.12);
  border-color: var(--gold);
  color: var(--gold);
}

/* League/Group block */
.match-group { margin-bottom: 16px; border-radius: 10px; overflow: hidden; border: 1px solid var(--border); }

.match-group-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 18px;
  background: var(--bg-card2);
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  user-select: none;
}
.match-group-header-left {
  display: flex;
  align-items: center;
  gap: 10px;
  
  font-size: 14px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--text-main);
  font-weight: 600;
}
.match-group-flag { font-size: 20px; }
.match-group-toggle { color: var(--text-muted); font-size: 13px; transition: transform 0.3s; }
.match-group.collapsed .match-group-toggle { transform: rotate(180deg); }

.match-row-wrap {
  border-bottom: 1px solid rgba(255,255,255,0.04);
  background: var(--bg-card);
  transition: background 0.2s;
}
.match-row-wrap:last-child { border-bottom: none; }
.match-row-wrap:hover,
.match-row-wrap--link:hover { background: rgba(201,168,76,0.04); }

.match-row {
  display: flex;
  align-items: center;
  padding: 14px 18px;
  gap: 10px;
}

a.match-row,
a.fixtures-row {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

a.match-row:focus-visible,
a.fixtures-row:focus-visible {
  outline: 2px solid rgba(201, 168, 76, 0.55);
  outline-offset: -2px;
}

.match-row-chevron {
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  margin-left: auto;
  border-right: 2px solid var(--text-muted);
  border-bottom: 2px solid var(--text-muted);
  transform: rotate(45deg);
  transition: transform 0.2s ease, border-color 0.2s;
}

.match-row-wrap.is-open .match-row-chevron,
.fixtures-row-wrap.is-open .match-row-chevron {
  transform: rotate(-135deg);
  border-color: var(--gold);
}

.match-details-panel,
.fixtures-details-panel {
  padding: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  animation: matchPanelIn 0.2s ease;
}

@keyframes matchPanelIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.match-scorers-board {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 10px 14px;
  align-items: start;
  padding-top: 4px;
}

.match-scorers-board--hero {
  max-width: 520px;
  margin: 0 auto;
}

.match-scorers-col--home {
  text-align: left;
}

.match-scorers-col--away {
  text-align: right;
}

.match-scorers-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding-top: 2px;
  min-width: 28px;
}

.match-scorers-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  font-size: 16px;
  line-height: 1;
}

.match-scorer-line {
  margin: 0;
  padding: 3px 0;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
  color: var(--text-main);
}

.match-scorers-board--hero .match-scorer-line {
  font-size: 14px;
}

.match-scorers-empty {
  margin: 0;
  padding: 3px 0;
  font-size: 13px;
  color: var(--text-muted);
}

.match-details-panel .match-scorers-board,
.fixtures-details-panel .match-scorers-board {
  padding: 4px 0 8px;
}

.ma-hero-scorers .match-scorers-board {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding-top: 12px;
}

.match-goals-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 20px;
}

.match-goals-team {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--gold);
}

.match-goals-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.match-goal-item {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
  padding: 5px 0;
  font-size: 13px;
  color: var(--text-main);
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.match-goal-item:last-child {
  border-bottom: none;
}

.goal-minute {
  flex-shrink: 0;
  min-width: 2.2em;
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--gold);
}

.goal-scorer {
  font-weight: 500;
}

.goal-meta {
  font-size: 11px;
  color: var(--text-muted);
}

.match-goals-empty,
.match-details-empty {
  margin: 0;
  font-size: 12px;
  color: var(--text-muted);
}

.match-status {
  font-size: 11px;
  letter-spacing: 0.5px;
  text-align: center;
  padding: 4px 8px;
  border-radius: 5px;
  font-weight: 600;
  flex-shrink: 0;
  min-width: 42px;
}
.match-status.ft {
  background: rgba(255,255,255,0.06);
  color: var(--text-muted);
}
.match-status.live {
  background: rgba(220,38,38,0.15);
  color: #f87171;
  animation: livePulse 1.5s ease-in-out infinite;
}
.match-status.upcoming,
.fixtures-status.upcoming {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(201,168,76,0.08);
  color: var(--gold);
  min-width: 44px;
  padding: 5px 6px;
  line-height: 1;
}
.kickoff-time {
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  line-height: 1;
}
@keyframes livePulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* Team side */
.match-team {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  color: var(--text-main);
  flex: 1;
  min-width: 0;
}

.match-team-flag { font-size: 20px; flex-shrink: 0; }
.match-team-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Score / VS center */
.match-center {
  text-align: center;
  flex-shrink: 0;
  width: 80px;
}
.match-score {
  font-size: 22px;
  font-weight: 700;
  color: var(--text-main);
  line-height: 1;
  letter-spacing: 1px;
}
.match-score .score-sep {
  color: var(--text-muted);
  margin: 0 3px;
}
.match-vs {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-muted);
}

/* Mobile */
@media (max-width: 600px) {
  .match-row {
    padding: 12px 12px 4px;
    gap: 6px;
  }
  .match-details-panel,
  .fixtures-details-panel {
    padding: 0 12px 12px 52px;
  }
  .match-goals-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .match-team { font-size: 12px; gap: 6px; }
  .match-team-flag { font-size: 16px; }
  .match-score { font-size: 17px; }
  .match-center { width: 60px; }
  .match-status { min-width: 36px; font-size: 10px; padding: 3px 5px; }
  .match-status.upcoming,
  .fixtures-status.upcoming { min-width: 40px; padding: 4px 5px; }
  .kickoff-time { font-size: 11px; }
  .match-group-header { padding: 10px 12px; }
  .match-group-header-left { font-size: 12px; letter-spacing: 1px; }
}

@media (max-width: 380px) {
  .match-team-name { max-width: 70px; }
  .match-center { width: 50px; }
  .match-score { font-size: 15px; }
}
/* Team side */
.match-team {
  display: flex;
  align-items: center;
  gap: 10px;
  
  font-size: 14px;
  font-weight: 500;
  color: var(--text-main);
}
.match-team.right {
  justify-content: flex-end;
  
}
.match-team-flag { font-size: 22px; flex-shrink: 0; }
.match-team-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Score / time center */
.match-center {
  text-align: center;
  
  letter-spacing: 2px;
}
.match-score {
  font-size: 22px;
  color: var(--text-main);
  font-weight: 500;
  line-height: 1;
}
.match-score .score-sep { color: var(--text-muted); margin: 0 4px; }
.match-time {
  font-size: 15px;
  color: var(--gold);
  line-height: 1;
}
.match-time-plus {
  display: block;
  
  font-size: 10px;
  letter-spacing: 1px;
  color: var(--text-muted);
  margin-bottom: 1px;
}

/* Empty state */
.schedule-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted);
  
  font-size: 15px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

/* Mobile */
@media (max-width: 600px) {
  .match-row {
    grid-template-columns: 44px 1fr 76px 1fr;
    padding: 12px 12px;
    gap: 4px;
  }
  .match-team { gap: 6px; font-size: 12px; }
  .match-team-flag { font-size: 18px; }
  .match-score { font-size: 20px; }
  .match-time { font-size: 13px; }
  .match-group-header { padding: 10px 12px; }
  .date-tab { padding: 6px 10px; }
  .date-tab-num { font-size: 17px; }
  .schedule-nav { padding: 8px 10px; gap: 6px; }
}
@media (max-width: 768px) {
  .news-grid { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {

  /* Banner */
  .banner-content {
    left: 0;
    bottom: 40px;
    padding: 1.25rem;
  }
  .banner-content h1 {
    font-size: 36px;
    line-height: 1.1;
  }
  .banner-content span,
  .banner-content .banner-tagline { font-size: 18px; }
  .banner-content p { font-size: 14px; }

  .section-wrap { padding: 60px 0 50px; }
  main:has(.site-breadcrumb) .content-wrap > .section-wrap {
    padding-top: 28px;
  }
  .site-breadcrumb {
    padding: 18px 0 12px;
  }
  .section-title { font-size: 42px; }
  .container { padding: 0 16px; }

  .groups-grid { grid-template-columns: 1fr; }

  .boot-grid { grid-template-columns: 1fr; }

  .timeline-card {
    grid-template-columns: 64px 1fr auto;
    gap: 12px;
    padding: 14px 14px;
  }
  .tl-year { font-size: 26px; }
  .tl-champion { font-size: 16px; }
  .tl-final { font-size: 12px; }
  .tl-trophy { font-size: 20px; }

  .news-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .news-featured-body h3 {
    font-size: 18px;
  }
  .news-featured-body {
    padding: 16px;
  }

  .news-item {
    gap: 12px;
    padding: 16px 0;
  }
  .news-item-body h4 {
    font-size: 13px;
  }
  .news-item-img {
    width: 80px;
    height: 58px;
  }

  .boot-card.leader::before {
    font-size: 9px;
    padding: 2px 6px;
  }
}

@media (max-width: 480px) {

  /* Banner */
  .banner-content h1 { font-size: 28px; }
  .banner-content span,
  .banner-content .banner-tagline { font-size: 15px; }
  .banner-content p { font-size: 13px; }

  .section-title { font-size: 34px; }

  .tl-trophy { display: none; }
  .timeline-card {
    grid-template-columns: 56px 1fr;
    gap: 10px;
  }
  .timeline { padding-left: 28px; }
  .timeline-dot { left: -26px; }

  .group-table thead th,
  .group-table td { padding: 8px 6px; font-size: 12px; }
  .group-table td:first-child { padding-left: 12px; }
  .group-letter { font-size: 26px; }

  .news-featured-badge { font-size: 10px; padding: 3px 8px; }

  .news-item-img {
    width: 68px;
    height: 52px;
  }
  .news-item-body h4 { font-size: 12px; }
}
.groups-swiper-wrap {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
}

.groupsSwiper {
  width: 100%;
  overflow: hidden;
}

.groupsSwiper .swiper-slide {
  height: auto;
}

.groupsSwiper .group-card {
  height: 100%;
}

.swiper-btn {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(201,168,76,0.08);
  border: 1px solid var(--border);
  color: var(--gold);
  font-size: 22px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
  line-height: 1;
  padding: 0;
}
.swiper-btn:hover { background: rgba(201,168,76,0.2); }
.swiper-btn.swiper-button-disabled {
  opacity: 0.3;
  cursor: default;
}

@media (max-width: 768px) {
  .swiper-btn { display: none; }
}


.section-wrap::before {
  background: linear-gradient(to right, transparent, var(--gold), transparent);

}

.timeline::before {
  background: linear-gradient(to bottom, var(--gold), transparent);
}

.group-table tbody tr:hover {
  background: rgba(0,0,0,0.03);
}

.match-row:hover {
  background: rgba(0,0,0,0.03);
}
@media screen and (min-width:992px){
  .second-column{
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: end;
  }
  .second-column span{
    color: var(--gold);
  }
  .second-column svg{
    color: var(--gold);
    fill: var(--gold);
  }
}

.fixtures-offcanvas {
  width: min(400px, 100vw) !important;
}
.offcanvas-header {
  border-bottom: 1px solid #e8e2d7;
  padding: 1rem 1.25rem;
}
.offcanvas-title-wrap {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.offcanvas-eyebrow {
  font-size: clamp(0.6rem, 1.8vw, 0.7rem);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #b08d57;
}
.offcanvas-title {
  font-size: clamp(1rem, 3.5vw, 1.2rem);
  font-weight: 700;
  color: #1a1a1a;
  margin: 0;
}
 
/* ── Scroll body ── */
.fixtures-body {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0 0 2rem;
  scroll-behavior: smooth;
}
 
/* ── Day block ── */
.fixtures-day-block {
  padding: 0 1rem;
}
 
/* ── Today divider ── */
.fixtures-today-divider {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0.5rem 0 1rem;
}
.fixtures-today-divider::before,
.fixtures-today-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: #c9a84c;
  opacity: 0.45;
}
.fixtures-today-divider span {
  font-size: clamp(0.6rem, 1.8vw, 0.68rem);
  font-weight: 700;
  letter-spacing: 0.12em;
  color: #c9a84c;
}
 
/* ── Day label ── */
.fixtures-day-label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 1.25rem 0 0.75rem;
}
.fixtures-day-date {
  font-size: clamp(0.75rem, 2.5vw, 0.875rem);
  font-weight: 600;
  color: #3a3228;
}
.fixtures-day-tag {
  font-size: clamp(0.6rem, 1.8vw, 0.7rem);
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 2px 8px;
  border-radius: 20px;
}
.fixtures-day-tag.past {
  background: #f0ebe0;
  color: #8a7a60;
}
.fixtures-day-tag.today {
  background: #c9a84c;
  color: #fff;
}
.fixtures-day-tag.upcoming-tag {
  background: #e8f0fe;
  color: #3060c0;
}
 
/* ── Match group card ── */
.fixtures-group {
  background: #fff;
  border-radius: 12px;
  border: 1px solid #ede8df;
  overflow: hidden;
  margin-bottom: 10px;
}
.fixtures-group-header {
  background: #f7f3ec;
  padding: clamp(7px, 2vw, 9px) clamp(10px, 3vw, 14px);
  font-size: clamp(0.68rem, 2.2vw, 0.78rem);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #5a4e3a;
  border-bottom: 1px solid #ede8df;
}
 
/* ── Match row ── */
.fixtures-group-body {
  padding: 0 clamp(8px, 2.5vw, 12px);
}
.fixtures-row-wrap {
  border-bottom: 1px solid #f0ebe0;
}
.fixtures-row-wrap:last-child {
  border-bottom: none;
}

.fixtures-row {
  display: grid;
  grid-template-columns: clamp(44px, 13vw, 58px) 1fr clamp(36px, 9vw, 48px) 1fr;
  align-items: center;
  padding: clamp(9px, 2.5vw, 12px) 0;
  gap: 16px;
}
.fixtures-details-panel {
  grid-column: 1 / -1;
  padding-left: clamp(44px, 13vw, 58px);
  border-top-color: #f0ebe0;
}
 
/* ── Status badge ── */
.fixtures-status {
  font-size: clamp(0.58rem, 1.8vw, 0.68rem);
  font-weight: 700;
  border-radius: 6px;
  padding: 3px 5px;
  text-align: center;
  white-space: nowrap;
}
.fixtures-status.ft {
  background: #f0ebe0;
  color: #7a6a50;
}
.fixtures-status.live {
  background: #dc3545;
  color: #fff;
  animation: pulse-live 1.4s ease-in-out infinite;
}
.fixtures-status.upcoming {
  background: #fdf3dc;
  color: #b08d30;
  min-width: 40px;
}
.fixtures-status .kickoff-time {
  font-size: clamp(0.65rem, 2vw, 0.75rem);
}
@keyframes pulse-live {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.65; }
}
 
/* ── Team ── */
.fixtures-team {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
}
.fixtures-team.right {
  justify-content: flex-end;
  text-align: right;
  /* flex-direction: row-reverse; */
}
.fixtures-flag {
  font-size: clamp(0.9rem, 2.8vw, 1.1rem);
  flex-shrink: 0;
}
.fixtures-name {
  font-size: clamp(0.7rem, 2.2vw, 0.82rem);
  font-weight: 600;
  color: #2a2018;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
 
/* ── Score / VS center ── */
.fixtures-center {
  display: flex;
  justify-content: center;
  align-items: center;
}
.fixtures-score {
  font-size: clamp(0.85rem, 2.6vw, 1rem);
  font-weight: 800;
  color: #2a2018;
  letter-spacing: 0.02em;
  text-align: center;
}
.score-sep {
  color: #c0b090;
  padding: 0 2px;
}
.fixtures-vs {
  font-size: clamp(0.6rem, 1.8vw, 0.7rem);
  font-weight: 700;
  letter-spacing: 0.1em;
  color: #b0a080;
}

.site-footer {
  padding: 48px 0 32px;
  border-top: 1px solid rgba(201, 168, 76, 0.15);
  margin-top: 24px;
}

.footer-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px 24px;
  margin-bottom: 16px;
}

.footer-nav a {
  color: var(--text-muted);
  font-size: 13px;
  letter-spacing: 0.06em;
  text-decoration: none;
  text-transform: uppercase;
  
}

.footer-nav a:hover {
  color: var(--gold);
}

.footer-copy {
  text-align: center;
  font-size: 12px;
  color: var(--text-muted);
  margin: 0;
  letter-spacing: 0.04em;
}

/* ── SEO CONTENT (Tournament Guide) ── */
#world-cup-2026-guide,
#world-cup-standings-guide,
#world-cup-history-guide {
  background: var(--bg-deep);
}

.seo-content .section-title {
  
}

.seo-header {
  margin-bottom: 8px;
}

.seo-article {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.seo-lead {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-left: 4px solid var(--gold);
  border-radius: 12px;
  padding: 28px 32px;
  box-shadow: 0 4px 24px rgba(28, 10, 0, 0.04);
}

.seo-lead p {
  margin: 0;
  font-size: 17px;
  line-height: 1.75;
  color: var(--text-main);
  max-width: 920px;
}

.seo-lead strong {
  color: var(--text-main);
  font-weight: 600;
}

.seo-content a {
  color: var(--gold-dim);
  font-weight: 500;
  text-decoration: none;
  border-bottom: 1px solid rgba(201, 168, 76, 0.45);
  transition: color 0.2s, border-color 0.2s;
}

.seo-content a:hover {
  color: var(--gold);
  border-bottom-color: var(--gold);
}

.seo-stats {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 12px;
}

.seo-stat {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 18px 12px;
  text-align: center;
  box-shadow: 0 2px 12px rgba(28, 10, 0, 0.04);
}

.seo-stat-value {
  display: block;
  
  font-size: clamp(22px, 3vw, 28px);
  letter-spacing: 1px;
  color: var(--text-main);
  line-height: 1.1;
}

.seo-stat-label {
  display: block;
  margin-top: 6px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.seo-stat--hosts .seo-stat-value {
  font-size: clamp(14px, 2vw, 18px);
  letter-spacing: 0.5px;
}

.seo-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.seo-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 28px 30px;
  box-shadow: 0 4px 20px rgba(28, 10, 0, 0.05);
}

.seo-card--faq {
  grid-column: 1 / -1;
}

.seo-card-title {
  
  font-size: clamp(22px, 3.5vw, 28px);
  font-weight: 400;
  letter-spacing: 1.5px;
  color: var(--text-main);
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
  line-height: 1.15;
  text-transform: uppercase;
}

.seo-card-subtitle {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold-dim);
  margin: 18px 0 8px;
}

.seo-card-text {
  font-size: 14px;
  line-height: 1.65;
  color: var(--text-muted);
  margin: 0 0 4px;
}

.seo-card p {
  font-size: 15px;
  line-height: 1.7;
  color: var(--text-muted);
  margin: 0 0 14px;
}

.seo-card-footer {
  margin: 16px 0 0 !important;
  padding-top: 14px;
  border-top: 1px solid var(--border);
  font-size: 14px !important;
}

.seo-list {
  margin: 0;
  padding-left: 1.2rem;
  font-size: 15px;
  line-height: 1.65;
  color: var(--text-muted);
}

.seo-list li {
  margin-bottom: 8px;
}

.seo-list li:last-child {
  margin-bottom: 0;
}

.seo-list li strong {
  color: var(--text-main);
  font-weight: 600;
}

.seo-list--compact {
  padding-left: 1.1rem;
  font-size: 14px;
}

.seo-list--numbered {
  padding-left: 1.35rem;
}

.seo-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
}

.seo-timeline li {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 12px 16px;
  padding: 12px 0;
  border-bottom: 1px solid var(--border);
  align-items: baseline;
}

.seo-timeline li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.seo-timeline-date {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--gold-dim);
  white-space: nowrap;
}

.seo-timeline-text {
  font-size: 14px;
  line-height: 1.55;
  color: var(--text-muted);
}

.seo-links {
  list-style: none;
  margin: 0;
  padding: 0;
}

.seo-links li {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 14px 0;
  border-bottom: 1px solid var(--border);
}

.seo-links li:first-child {
  padding-top: 0;
}

.seo-links li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.seo-links a {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-main);
  border-bottom: none;
}

.seo-links a:hover {
  color: var(--gold-dim);
}

.seo-links span {
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.4;
}

.seo-faq {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.seo-faq-item {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-card2);
  overflow: hidden;
}

.seo-faq-item summary {
  padding: 16px 18px;
  font-size: 15px;
  font-weight: 600;
  color: var(--text-main);
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  transition: background 0.2s;
}

.seo-faq-item summary::-webkit-details-marker {
  display: none;
}

.seo-faq-item summary::after {
  content: '+';
  font-size: 18px;
  font-weight: 400;
  color: var(--gold);
  flex-shrink: 0;
}

.seo-faq-item[open] summary::after {
  content: '−';
}

.seo-faq-item summary:hover {
  background: rgba(201, 168, 76, 0.06);
}

.seo-faq-item p {
  margin: 0;
  padding: 0 18px 16px;
  font-size: 14px;
  line-height: 1.65;
  color: var(--text-muted);
}

.seo-faq-item p strong {
  color: var(--text-main);
}

@media (max-width: 1100px) {
  .seo-stats {
    grid-template-columns: repeat(4, 1fr);
  }

  .seo-stat--hosts {
    grid-column: span 2;
  }
}

@media (max-width: 992px) {
  .seo-grid {
    grid-template-columns: 1fr;
  }

  .seo-card--faq {
    grid-column: auto;
  }
}

@media (max-width: 640px) {
  .seo-lead {
    padding: 20px;
  }

  .seo-stats {
    grid-template-columns: repeat(2, 1fr);
  }

  .seo-stat--hosts {
    grid-column: span 2;
  }

  .seo-card {
    padding: 22px 20px;
  }

  .seo-timeline li {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

/* ── SLIDE MENU (no top header — hero stays full) ── */
.menu-fab {
  position: fixed;
  top: 20px;
  left: 20px;
  z-index: 1040;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 12px;
  background: rgba(12, 10, 8, 0.45);
  backdrop-filter: blur(8px);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s, transform 0.2s, border-color 0.2s;
}

.menu-fab:hover {
  background: rgba(12, 10, 8, 0.65);
  border-color: rgba(201, 168, 76, 0.6);
  transform: scale(1.04);
}

.menu-fab-icon {
  display: block;
  width: 20px;
  height: 14px;
  background:
    linear-gradient(var(--gold-light) 0 0) top / 100% 2px no-repeat,
    linear-gradient(var(--gold-light) 0 0) center / 100% 2px no-repeat,
    linear-gradient(var(--gold-light) 0 0) bottom / 100% 2px no-repeat;
}

.menu-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1045;
  background: rgba(12, 10, 8, 0.55);
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}

.menu-backdrop.is-visible {
  opacity: 1;
  pointer-events: auto;
}

.side-menu {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1050;
  width: min(300px, 88vw);
  height: 100%;
  height: 100dvh;
  background: var(--bg-card);
  border-right: 1px solid var(--border);
  box-shadow: 8px 0 40px rgba(12, 10, 8, 0.2);
  transform: translateX(-100%);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}

.side-menu.is-open {
  transform: translateX(0);
}

.side-menu-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 24px 20px 20px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, var(--bg-card2), var(--bg-card));
}

.side-menu-logo {
  text-decoration: none;
  display: flex;
  flex-direction: column;
  line-height: 1.15;
}

.side-menu-logo-title {
  font-size: 20px;
  letter-spacing: 2px;
  color: var(--text-main);
  margin-bottom: 10px;
}

.side-menu-logo-tag {
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-dim);
  margin-top: 4px;
}

.side-menu-close {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-card);
  color: var(--text-main);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s, border-color 0.2s;
}

.side-menu-close:hover {
  background: rgba(201, 168, 76, 0.1);
  border-color: rgba(201, 168, 76, 0.4);
}

.side-menu-nav {
  flex: 1;
  padding: 12px 0 24px;
}

.side-menu-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.side-menu-link {
  display: block;
  padding: 14px 24px;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--text-muted);
  border-left: 3px solid transparent;
  transition: color 0.2s, background 0.2s, border-color 0.2s;
}

.side-menu-link:hover {
  color: var(--text-main);
  background: rgba(201, 168, 76, 0.08);
}

.side-menu-link.is-active {
  color: var(--gold-dim);
  font-weight: 600;
  background: rgba(201, 168, 76, 0.12);
  border-left-color: var(--gold);
}

body.menu-open {
  overflow: hidden;
}

.page-header {
  padding: 48px 0 0;
  background: var(--bg-deep);
}

.page-intro {
  background: var(--bg-deep);
  border-bottom: 1px solid var(--border);
}

.site-breadcrumb {
  padding: 24px 0 16px;
}

.site-breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 13px;
  line-height: 1.4;
}

.site-breadcrumb__item {
  display: inline-flex;
  align-items: center;
  color: var(--text-muted);
}

.site-breadcrumb__item::before {
  content: none !important;
}

.site-breadcrumb__item:not(:last-child)::after {
  content: '›';
  margin: 0 10px;
  color: var(--gold-dim);
  font-size: 15px;
  line-height: 1;
  pointer-events: none;
}

.site-breadcrumb__item a {
  color: var(--text-muted);
  text-decoration: none;
  transition: color 0.2s;
}

.site-breadcrumb__item a:hover {
  color: var(--gold);
}

.site-breadcrumb__item span[aria-current='page'] {
  color: var(--text-main);
  font-weight: 600;
}

main:has(.site-breadcrumb) .content-wrap > .section-wrap {
  padding-top: 40px;
}

main:has(.site-breadcrumb) .content-wrap > .section-wrap::before {
  display: none;
}

main:has(.site-breadcrumb) .page-header {
  padding-top: 0;
}

.page-header .section-subtitle {
  margin-bottom: 32px;
}

.seo-card--faq-page {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 24px;
  background: var(--bg-card);
  box-shadow: 0 4px 20px rgba(28, 10, 0, 0.05);
}

.page-hub {
  background: var(--bg-deep);
}

.page-hub-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.page-hub-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 28px 24px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  text-decoration: none;
  color: inherit;
  transition: transform 0.25s, border-color 0.25s, box-shadow 0.25s;
  box-shadow: 0 2px 12px rgba(28, 10, 0, 0.04);
}

.page-hub-card:hover {
  transform: translateY(-4px);
  border-color: rgba(201, 168, 76, 0.4);
  box-shadow: 0 8px 28px rgba(28, 10, 0, 0.08);
}

.page-hub-icon {
  font-size: 28px;
  line-height: 1;
}

.page-hub-card h3 {
  
  font-size: 22px;
  letter-spacing: 1.5px;
  color: var(--text-main);
  margin: 0;
}

.page-hub-card p {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--text-muted);
}

@media (max-width: 992px) {
  .page-hub-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .page-hub-grid {
    grid-template-columns: 1fr;
  }

  .menu-fab {
    top: 14px;
    left: 14px;
    width: 44px;
    height: 44px;
  }
}

/* ── Match analysis page ── */
.match-analysis-page {
  padding-top: 8px;
  padding-bottom: 48px;
}

.ma-back {
  margin: 0 0 20px;
  font-size: 14px;
}

.ma-back a {
  color: var(--gold);
  font-weight: 600;
  text-decoration: none;
}

.ma-back a:hover {
  text-decoration: underline;
}

.ma-hero {
  text-align: center;
  padding: 28px 20px 24px;
  margin-bottom: 28px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
}

.ma-competition {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
}

.ma-teams {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px 24px;
  flex-wrap: wrap;
}

.ma-team-side {
  flex: 1;
  min-width: 120px;
  max-width: 200px;
}

.ma-team-flag img {
  display: block;
  margin: 0 auto 8px;
  border-radius: 4px;
  object-fit: cover;
}

.ma-team-name {
  font-size: 15px;
  font-weight: 600;
  color: var(--text-main);
  line-height: 1.3;
}

.ma-score-block {
  flex-shrink: 0;
}

.ma-score {
  font-family: "Bebas Neue", "Barlow Condensed", sans-serif;
  font-size: clamp(2.5rem, 8vw, 3.5rem);
  font-weight: 700;
  line-height: 1;
  color: var(--text-main);
  letter-spacing: 0.04em;
}

.ma-score--vs {
  font-size: 2rem;
  color: var(--text-muted);
}

.ma-score-sep {
  color: var(--text-muted);
  font-weight: 400;
}

.ma-status {
  margin-top: 6px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-muted);
}

.ma-venue,
.ma-kickoff {
  display: block;
  margin-top: 14px;
  font-size: 13px;
  color: var(--text-muted);
}

.ma-container {
  max-width: 960px;
  margin: 0 auto;
}

.ma-hero-scorers {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--border);
  text-align: left;
}

.ma-hero-scorers-title {
  margin: 0 0 12px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold);
}

.ma-goals-grid--hero {
  border: none;
  padding: 0;
  background: transparent;
}

.ma-tabs-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(28, 10, 0, 0.04);
}

.ma-tabs-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-bottom: 1px solid var(--border);
  background: var(--bg-card2);
}

.ma-tabs-scroll::-webkit-scrollbar {
  height: 4px;
}

.ma-tabs-scroll::-webkit-scrollbar-thumb {
  background: rgba(201, 168, 76, 0.35);
  border-radius: 4px;
}

.ma-tab-nav {
  display: flex;
  flex-wrap: nowrap;
  gap: 4px;
  padding: 10px 12px;
  margin: 0;
  min-width: min-content;
  border: none;
}

.ma-tab-nav .nav-item {
  flex-shrink: 0;
}

.ma-tab-btn {
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-muted);
  background: transparent;
  border: 1px solid transparent;
  border-radius: 8px;
  white-space: nowrap;
  transition: color 0.2s, background 0.2s, border-color 0.2s;
}

.ma-tab-btn:hover {
  color: var(--text-main);
  background: rgba(201, 168, 76, 0.08);
}

.ma-tab-btn.active {
  color: var(--text-main);
  background: var(--bg-card);
  border-color: var(--border);
  box-shadow: 0 1px 4px rgba(28, 10, 0, 0.06);
}

.ma-tab-panels {
  padding: 24px 20px 28px;
  background: var(--bg-card);
}

.ma-tab-pane {
  animation: matchPanelIn 0.25s ease;
}

.ma-tab-panels .ma-stat-card {
  background: var(--bg-card2);
}

.ma-tab-panels .ma-bar-row {
  background: var(--bg-card2);
}

.ma-tab-panels .ma-card {
  background: var(--bg-card2);
}

.ma-tab-panels .ma-chart-wrap {
  border: none;
  padding: 0;
  background: transparent;
}

.ma-tab-panels .ma-commentary-list {
  border: none;
  border-radius: 0;
  background: transparent;
}

.ma-tab-panels .ma-lineup-card {
  background: var(--bg-card2);
}

.ma-tab-panels .ma-team-stats-card {
  margin: -4px 0 0;
}

.ma-team-stats-card {
  background: #fff;
  color: #1c1917;
  border: 1px solid #e7e5e4;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.ma-team-stats-header {
  display: grid;
  grid-template-columns: 40px 1fr 40px;
  align-items: center;
  gap: 8px;
  padding: 16px 18px 12px;
  border-bottom: 1px solid #f0eeec;
}

.ma-team-stats-flag {
  display: flex;
  align-items: center;
  justify-content: center;
}

.ma-team-stats-flag--away {
  justify-content: flex-end;
}

.ma-team-stats-flag--home {
  justify-content: flex-start;
}

.ma-team-stats-flag img {
  display: block;
  border-radius: 4px;
  object-fit: cover;
}

.ma-team-stats-title {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-align: center;
  color: #78716c;
}

.ma-team-stats-body {
  padding: 6px 0 10px;
}

.ma-team-stats-row {
  display: grid;
  grid-template-columns: minmax(72px, 1fr) minmax(100px, 1.4fr) minmax(72px, 1fr);
  align-items: center;
  gap: 8px 12px;
  padding: 14px 20px;
  border-bottom: 1px solid #f5f5f4;
}

.ma-team-stats-row:last-child {
  border-bottom: none;
}

.ma-team-stats-val {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
}

.ma-team-stats-val--home {
  justify-content: center;
}

.ma-team-stats-val--away {
  justify-content: center;
}

.ma-team-stats-label {
  text-align: center;
  font-size: 13px;
  font-weight: 500;
  color: #57534e;
  line-height: 1.3;
}

.ma-stat-plain {
  font-size: 15px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: #1c1917;
}

.ma-stat-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #fff;
  line-height: 1;
}

.ma-stat-pill--wide {
  min-width: 52px;
  padding: 0 12px;
}

.ma-stat-pill--team1 {
  background: #dc2626;
  box-shadow: 0 2px 8px rgba(220, 38, 38, 0.28);
}

.ma-stat-pill--team2 {
  background: #1d4ed8;
  box-shadow: 0 2px 8px rgba(29, 78, 216, 0.28);
}

.ma-commentary-timeline {
  list-style: none;
  margin: 0;
  padding: 4px 0 8px;
}

.ma-commentary-timeline-item {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 14px;
  padding: 0 0 20px;
}

.ma-commentary-timeline-item:last-child {
  padding-bottom: 0;
}

.ma-commentary-timeline-rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 28px;
  min-height: 100%;
}

.ma-commentary-timeline-dot {
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  margin-top: 4px;
  border-radius: 50%;
  background: var(--gold);
  border: 2px solid var(--bg-card);
  box-shadow: 0 0 0 2px rgba(201, 168, 76, 0.35);
  z-index: 1;
}

.ma-commentary-timeline-line {
  flex: 1;
  width: 2px;
  min-height: 24px;
  margin-top: 4px;
  background: linear-gradient(180deg, rgba(201, 168, 76, 0.45) 0%, rgba(201, 168, 76, 0.08) 100%);
  border-radius: 2px;
}

.ma-commentary-timeline-body {
  min-width: 0;
  padding-top: 1px;
}

.ma-commentary-timeline-minute {
  display: block;
  margin-bottom: 4px;
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  color: var(--gold);
}

.ma-commentary-timeline-text {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  color: var(--text-main);
}

.ma-events-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.ma-event {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.ma-event:last-child {
  border-bottom: none;
}

.ma-event-rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding-top: 2px;
}

.ma-event-minute {
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--gold);
}

.ma-event-icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  background: var(--bg-card2);
  border: 1px solid var(--border);
}

.ma-event--goal .ma-event-icon,
.ma-event--penalty_goal .ma-event-icon,
.ma-event--own_goal .ma-event-icon {
  background: rgba(201, 168, 76, 0.15);
  border-color: rgba(201, 168, 76, 0.35);
}

.ma-event--goal .ma-event-icon::before,
.ma-event--penalty_goal .ma-event-icon::before,
.ma-event--own_goal .ma-event-icon::before {
  content: '⚽';
}

.ma-event--yellow .ma-event-icon {
  background: rgba(234, 179, 8, 0.2);
  border-color: rgba(234, 179, 8, 0.45);
}

.ma-event--yellow .ma-event-icon::before {
  content: '';
  width: 12px;
  height: 16px;
  border-radius: 2px;
  background: #eab308;
  display: block;
}

.ma-event--red .ma-event-icon,
.ma-event--second_yellow .ma-event-icon {
  background: rgba(220, 38, 38, 0.12);
  border-color: rgba(220, 38, 38, 0.35);
}

.ma-event--red .ma-event-icon::before,
.ma-event--second_yellow .ma-event-icon::before {
  content: '';
  width: 12px;
  height: 16px;
  border-radius: 2px;
  background: #dc2626;
  display: block;
}

.ma-event--substitution .ma-event-icon {
  background: rgba(59, 130, 246, 0.12);
  border-color: rgba(59, 130, 246, 0.3);
}

.ma-event--substitution .ma-event-icon::before {
  content: '↔';
  font-size: 16px;
  color: #3b82f6;
}

.ma-event--var .ma-event-icon {
  background: rgba(99, 102, 241, 0.12);
  border-color: rgba(99, 102, 241, 0.35);
}

.ma-event--var .ma-event-icon::before {
  content: 'VAR';
  font-size: 9px;
  letter-spacing: 0.02em;
  color: #6366f1;
}

.ma-event--penalty .ma-event-icon::before {
  content: 'PK';
  font-size: 11px;
  font-weight: 800;
  color: var(--gold-dim);
}

.ma-event--other .ma-event-icon::before {
  content: '•';
}

.ma-event-body {
  min-width: 0;
}

.ma-event-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 4px;
}

.ma-event-type {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.ma-event-summary {
  margin: 0;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.45;
  color: var(--text-main);
}

.ma-event--team1 .ma-event-body {
  border-left: 3px solid #92714f;
  padding-left: 12px;
}

.ma-event--team2 .ma-event-body {
  border-left: 3px solid var(--gold);
  padding-left: 12px;
}

.ma-section.ma-notes {
  margin-top: 24px;
  margin-bottom: 0;
}

.ma-section {
  margin-bottom: 32px;
}

.ma-section-title {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
}

.ma-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.ma-stat-card {
  padding: 16px 14px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  text-align: center;
}

.ma-stat-val {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--text-main);
  line-height: 1.1;
}

.ma-stat-lbl {
  margin-top: 6px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
}

.ma-stat-sub {
  margin-top: 4px;
  font-size: 11px;
  color: var(--text-muted);
}

.ma-bar-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.ma-bar-row {
  padding: 14px 16px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
}

.ma-bar-labels {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 8px;
  margin-bottom: 6px;
  font-size: 11px;
  color: var(--text-muted);
}

.ma-bar-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ma-bar-label.por {
  text-align: right;
}

.ma-bar-values {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 700;
  color: var(--text-main);
}

.ma-bar-track {
  display: flex;
  height: 8px;
  border-radius: 4px;
  overflow: hidden;
  background: var(--bg-card2);
}

.ma-bar-fill1 {
  background: #92714f;
  transition: width 0.3s ease;
}

.ma-bar-fill2 {
  background: var(--gold);
  transition: width 0.3s ease;
}

.ma-two-col {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

.ma-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}

.ma-card-head {
  padding: 12px 14px;
  background: var(--bg-card2);
  border-bottom: 1px solid var(--border);
}

.ma-card-head-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.ma-card-head-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-main);
}

.ma-badge-wrap {
  display: flex;
  gap: 6px;
}

.ma-team-badge {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 4px;
}

.ma-badge-t1 {
  background: rgba(146, 113, 79, 0.2);
  color: #92714f;
}

.ma-badge-t2 {
  background: rgba(201, 168, 76, 0.2);
  color: var(--gold-dim);
}

.ma-card-body {
  padding: 4px 0;
}

.ma-mini-stat {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  font-size: 13px;
}

.ma-mini-stat:last-child {
  border-bottom: none;
}

.ma-mini-label {
  color: var(--text-muted);
}

.ma-mini-pair {
  display: flex;
  gap: 16px;
  font-weight: 600;
  color: var(--text-main);
}

.ma-mini-v1 {
  color: #92714f;
  min-width: 2.5em;
  text-align: right;
}

.ma-mini-v2 {
  color: var(--gold-dim);
  min-width: 2.5em;
  text-align: right;
}

.ma-chart-wrap {
  padding: 20px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
}

.ma-chart-inner {
  height: 280px;
  position: relative;
}

.ma-chart-legend {
  display: flex;
  justify-content: center;
  gap: 24px;
  margin-top: 16px;
  font-size: 13px;
  color: var(--text-muted);
}

.ma-legend-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 2px;
  margin-right: 6px;
  vertical-align: middle;
}

.ma-legend-dot--t1 {
  background: #92714f;
}

.ma-legend-dot--t2 {
  background: var(--gold);
}

.ma-goals-grid {
  padding: 16px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
}

.ma-lineups-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

.ma-lineup-card {
  padding: 16px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
}

.ma-lineup-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}

.ma-lineup-team {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-main);
}

.ma-lineup-group-label {
  margin: 10px 0 6px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.ma-lineup-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ma-lineup-player {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  font-size: 13px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}

.ma-lineup-list--subs .ma-lineup-player {
  color: var(--text-muted);
}

.ma-lineup-num {
  flex-shrink: 0;
  width: 1.6em;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--gold);
}

.ma-lineup-name {
  flex: 1;
  font-weight: 500;
  color: var(--text-main);
}

.ma-lineup-pos {
  font-size: 11px;
  color: var(--text-muted);
}

.ma-commentary-list {
  list-style: none;
  margin: 0;
  padding: 0;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}

.ma-commentary-item {
  display: flex;
  gap: 12px;
  padding: 12px 16px;
  font-size: 14px;
  line-height: 1.5;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.ma-commentary-item:last-child {
  border-bottom: none;
}

.ma-commentary-minute {
  flex-shrink: 0;
  min-width: 2.5em;
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--gold);
}

.ma-commentary-text {
  color: var(--text-main);
}

.ma-verdict {
  padding: 18px 20px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: 10px;
}

.ma-verdict-text {
  font-size: 15px;
  line-height: 1.65;
  color: var(--text-main);
}

.match-details-full-link {
  display: inline-block;
  margin-top: 10px;
  font-size: 12px;
  font-weight: 600;
  color: var(--gold);
  text-decoration: none;
}

.match-details-full-link:hover {
  text-decoration: underline;
}

.match-details-panel .match-details-full-link,
.fixtures-details-panel .match-details-full-link {
  margin-top: 12px;
}

.match-row-footer {
  padding: 0 18px 12px 70px;
  text-align: left;
}

@media (max-width: 768px) {
  .ma-stat-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .ma-two-col {
    grid-template-columns: 1fr;
  }

  .ma-lineups-grid {
    grid-template-columns: 1fr;
  }

  .ma-bar-labels {
    font-size: 10px;
  }

  .ma-tab-panels {
    padding: 18px 14px 22px;
  }

  .ma-tab-btn {
    padding: 8px 12px;
    font-size: 12px;
  }

  .ma-team-stats-row {
    grid-template-columns: minmax(56px, 1fr) minmax(80px, 1.2fr) minmax(56px, 1fr);
    gap: 6px 8px;
    padding: 12px 14px;
  }

  .ma-team-stats-header {
    padding: 14px 14px 10px;
  }

  .ma-team-stats-label {
    font-size: 12px;
  }

  .ma-stat-pill {
    min-width: 32px;
    height: 32px;
    font-size: 13px;
  }

  .ma-commentary-timeline-item {
    gap: 10px;
  }

  .ma-event {
    grid-template-columns: 56px 1fr;
    gap: 10px;
  }

  .match-row-footer {
    padding-left: 52px;
  }
}

@media (max-width: 480px) {
  .ma-teams {
    flex-direction: column;
  }

  .ma-team-side {
    max-width: none;
  }
}

@media screen and (min-width:768px) {
 .fixtures-offcanvas {
    width: min(600px, 100vw) !important;
}
}
.match-hero{
      background:linear-gradient(160deg,#0d0805 0%,#1c120a 60%,#251808 100%);
      padding:40px 20px 0;
      position:relative;
    }
    .match-page-heading{
      margin:0 0 20px;
      font-family:var(--font-display, 'Bebas Neue', sans-serif);
      font-size:clamp(22px, 4vw, 32px);
      font-weight:400;
      line-height:1.15;
      letter-spacing:.5px;
      color:var(--text-main);
    }
    .match-page-heading span{
      color:var(--gold);
    }
    .match-meta{
      display:flex;align-items:center;justify-content:center;gap:20px;
      font-size:12px;color:#7a6040;letter-spacing:.5px;margin-bottom:16px;
    }
    .match-meta span{display:flex;align-items:center;gap:5px;}
    .match-meta svg{opacity:.6;}
 
    .match-scoreline{
          max-width: 960px;
    margin: 0 auto;
      display:flex;align-items:start;justify-content:space-between;gap:0;
      padding:10px 0 30px;
    }
    .match-team-block{
      display:flex;flex-direction:column; align-items:center;gap:14px;
    }
    .team-result-wrapper{
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
      justify-content: center;
    }
    .match-team-block.right{}
    .team-crest{
      width:52px;height:52px;border-radius:50%;
      background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.12);
      display:flex;align-items:center;justify-content:center;font-size:26px;
      flex-shrink:0;
    }
    .team-name-score{display:flex;flex-direction:column;gap:2px;}
    .match-team-block.right .team-name-score{align-items:flex-end;}
    .team-label{font-size:18px;font-weight:600;color:#f0e8d8;letter-spacing:.5px;}
    .score-center{
      text-align:center;padding:0 28px;flex-shrink:0;
    }
    .score-big{font-size:56px;font-weight:800;color:#fff;letter-spacing:2px;line-height:1;}
    .score-big--vs{font-size:40px;letter-spacing:4px;color:var(--gold);}
    .score-status{font-size:11px;letter-spacing:3px;color:var(--gold);text-transform:uppercase;margin-top:6px;}
    .score-scorer{font-size:11px;color:#b4b4b4;margin-top:8px;display:flex;align-items:center;justify-content:center;gap:4px;}
 
    /* ── TABS ── */
    .match-tabs-wrap{
      max-width: 960px;
      margin: 0 auto;
      margin-top:8px;
    }
    .nav-match-tabs{
      display:flex;overflow-x:auto;scrollbar-width:none;
      border-bottom:none!important;
      padding:0 4px;
    }
    .nav-match-tabs::-webkit-scrollbar{display:none;}
    .nav-match-tabs .nav-link{
      color:rgba(255,255,255,0.45);
      font-size:13px;font-weight:500;letter-spacing:.5px;
      padding:14px 18px;border:none!important;border-radius:0!important;
      background:none!important;white-space:nowrap;
      border-bottom:2px solid transparent!important;
      transition:color .2s,border-color .2s;
      text-decoration:none;display:block;
    }
    .nav-match-tabs .nav-link:hover{color:rgba(255,255,255,.75);}
    .nav-match-tabs .nav-link.active{
      color:#fff!important;
      border-bottom-color:var(--gold)!important;
    }
 
    /* ── TAB CONTENT WRAPPER ── */
    .tab-content-wrap{
      max-width:960px;margin:0 auto;padding:24px 16px 60px;
    }

    .site-breadcrumb--match {
      padding: 0 0 18px;
      margin-bottom: 4px;
    }

    .match-seo-content {
      background: var(--bg-deep);
      border-top: 1px solid var(--border);
      padding: 48px 16px 64px;
    }

    .match-seo-content__inner {
      max-width: 960px;
      margin: 0 auto;
    }

    .match-seo-article {
      display: flex;
      flex-direction: column;
      gap: 36px;
    }

    .match-seo-block {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 28px 32px;
      box-shadow: 0 4px 24px rgba(28, 10, 0, 0.04);
    }

    .match-seo-heading {
      margin: 0 0 16px;
      font-family: var(--font-display, 'Bebas Neue', sans-serif);
      font-size: clamp(24px, 4vw, 32px);
      font-weight: 400;
      line-height: 1.15;
      letter-spacing: 0.5px;
      color: var(--text-main);
    }

    .match-seo-text {
      margin: 0 0 14px;
      font-size: 15px;
      line-height: 1.75;
      color: var(--text-muted);
    }

    .match-seo-text:last-child {
      margin-bottom: 0;
    }

    .match-seo-text strong {
      color: var(--text-main);
      font-weight: 600;
    }

    .match-seo-content a {
      color: var(--gold);
      text-decoration: none;
      font-weight: 600;
    }

    .match-seo-content a:hover {
      text-decoration: underline;
    }
 
    /* ── SECTION LABEL ── */
    .sec-label{
      margin-top: 20px;
      font-size:10px;letter-spacing:4px;text-transform:uppercase;
      color:var(--gold);margin-bottom:14px;display:flex;align-items:center;gap:10px;
    }
    .sec-label::after{content:'';flex:1;height:1px;background:linear-gradient(to right,var(--gold),transparent);opacity:.3;}
 
    /* ── FACTS TAB ── */
    .facts-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
    .fact-card{
      background:var(--bg-card);border:1px solid var(--border);border-radius:12px;
      padding:18px 20px;
    }
    .fact-card--wide{grid-column:1 / -1;}
    .fact-card-title{
      font-size:10px;letter-spacing:3px;text-transform:uppercase;
      color:var(--gold);margin-bottom:14px;
    }
    .fact-row{
      display:flex;justify-content:space-between;align-items:flex-start;gap:16px;
      padding:9px 0;border-bottom:1px solid var(--border);font-size:13px;
    }
    .fact-row:last-child{border-bottom:none;padding-bottom:0;}
    .fact-label{color:var(--text-muted);flex-shrink:0;}
    .fact-val{font-weight: 500;
    color: var(--text-main);
    text-align: left;
    line-height: 20px;}
    .fact-val.gold{color:var(--gold);}

    .timeline-events{display:flex;flex-direction:column;gap:0;}
    .t-event{
      display:flex;align-items:center;gap:12px;
      padding:10px 16px;border-bottom:1px solid var(--border);
      background:var(--bg-card);
    }
    .t-event:first-child{border-radius:12px 12px 0 0;}
    .t-event:last-child{border-radius:0 0 12px 12px;border-bottom:none;}
    .t-event:only-child{border-radius:12px;}
    .t-min{font-size:12px;font-weight:700;color:var(--gold);min-width:32px;}
    .t-icon{font-size:18px;flex-shrink:0;}
    .t-detail{flex:1;font-size:13px;color:var(--text-main);font-weight:500;}
    .t-team{font-size:11px;color:var(--text-muted);}
 
    /* ── STATS TAB ── */
    .stats-layout{display:grid;grid-template-columns:1fr 360px;gap:20px;}
 
    /* Shot map */
    .shotmap-card{
      background:var(--bg-card);border:1px solid var(--border);border-radius:12px;overflow:hidden;
    }
    .shotmap-header{
      padding:14px 18px;border-bottom:1px solid var(--border);background:var(--bg-card2);
      font-size:13px;font-weight:600;color:var(--text-main);
    }
    .shotmap-player{
      display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--border);
    }
    .player-avatar{
      width:40px;height:40px;border-radius:50%;background:var(--bg-card2);
      border:1px solid var(--border);display:flex;align-items:center;justify-content:center;
      font-size:18px;flex-shrink:0;
    }
    .player-name{font-size:15px;font-weight:600;color:var(--text-main);}
    .shot-nav{display:flex;align-items:center;gap:10px;margin-left:auto;}
    .shot-nav-btn{
      width:28px;height:28px;border-radius:50%;border:1px solid var(--border);
      background:var(--bg-card2);color:var(--text-muted);cursor:pointer;
      display:flex;align-items:center;justify-content:center;font-size:14px;
      transition:background .2s;
    }
    .shot-nav-btn:hover{background:rgba(201,168,76,.15);color:var(--gold);}
    .shot-minute{font-size:15px;font-weight:700;color:var(--text-main);}
 
    .shotmap-details{display:grid;grid-template-columns:1fr 1fr;gap:0;}
    .shot-detail-left{padding:14px 18px;border-right:1px solid var(--border);}
    .shot-detail-right{padding:14px 18px;display:flex;flex-direction:column;align-items:center;justify-content:center;}
    .sd-row{display:flex;gap:10px;margin-bottom:8px;font-size:13px;}
    .sd-label{color:var(--text-muted);min-width:70px;}
    .sd-val{color:var(--text-main);font-weight:500;}
    .mini-goal{
      width:80px;height:50px;border:2px solid var(--text-muted);border-bottom:none;
      border-radius:4px 4px 0 0;position:relative;background:rgba(201,168,76,.05);
    }
    .goal-marker{
      position:absolute;width:8px;height:8px;background:var(--gold);border-radius:50%;
      top:30%;left:60%;transform:translate(-50%,-50%);
    }
    .xg-pair{display:flex;gap:24px;margin-top:8px;}
    .xg-block{text-align:center;}
    .xg-val{font-size:18px;font-weight:700;color:var(--text-main);}
    .xg-label{font-size:10px;letter-spacing:2px;color:var(--text-muted);text-transform:uppercase;}
 
    /* Pitch SVG */
    .shotmap-pitch{padding:14px 18px;background:var(--bg-card2);border-top:1px solid var(--border);}
    .pitch-svg{width:100%;border-radius:8px;}
 
    /* Top stats right panel */
    .topstats-card{
      background:var(--bg-card);border:1px solid var(--border);border-radius:12px;overflow:hidden;margin-bottom: 20px;
    }
    .topstats-header{
      padding:14px 18px;border-bottom:1px solid var(--border);background:var(--bg-card2);
      font-size:13px;font-weight:600;color:var(--text-main);
    }
    .topstat-row{
      display:flex;align-items:center;padding:10px 16px;border-bottom:1px solid var(--border);
      gap:10px;
    }
    .topstat-row:last-child{border-bottom:none;}
    .ts-v1,.ts-v2{font-size:13px;font-weight:600;min-width:54px;}
    .ts-v1{text-align:left;color:var(--text-main);}
    .ts-v2{text-align:right;color:var(--text-main);}
    .ts-badge{
      display:inline-block;min-width:34px;padding:3px 8px;border-radius:30px;
      font-size:12px;font-weight:700;text-align:center;
    }
    .ts-badge.t1{background:#2a6496;color:#fff;}
    .ts-badge.t2{background:#c0392b;color:#fff;}
    .ts-label{flex:1;text-align:center;font-size:12px;color:var(--text-muted);}
    .ts-bar-wrap{
      position:relative;height:4px;background:var(--bg-card2);border-radius:2px;margin:2px 0;
      overflow:visible;
    }
    .ts-bar-t1{position:absolute;right:50%;top:0;height:100%;background:#2a6496;border-radius:2px 0 0 2px;}
    .ts-bar-t2{position:absolute;left:50%;top:0;height:100%;background:#c0392b;border-radius:0 2px 2px 0;}
 
    /* full stat bar rows */
    .stat-bar-list{display:flex;flex-direction:column;gap:10px;margin-top:14px;}
    .stat-bar-item{background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:12px 16px;}
    .sbi-top{display:flex;justify-content:space-between;margin-bottom:6px;}
    .sbi-v{font-size:14px;font-weight:600;}
    .sbi-v.t1c{color:var(--t1-color);}
    .sbi-v.t2c{color:var(--t2-color);}
    .sbi-label{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--text-muted);}
    .sbi-track{height:5px;background:var(--bg-card2);border-radius:3px;display:flex;overflow:hidden;}
    .sbi-f1{background:var(--t1-color);border-radius:3px 0 0 3px;height:100%;}
    .sbi-f2{background:var(--t2-color);border-radius:0 3px 3px 0;height:100%;}
 
    /* ── HALF FILTER PILLS ── */
    .half-pills{display:flex;gap:8px;margin-bottom:20px;}
    .half-pill{
      padding:6px 18px;border-radius:30px;border:1px solid var(--border);
      background:var(--bg-card);font-size:12px;font-weight:600;color:var(--text-muted);
      cursor:pointer;transition:all .2s;letter-spacing:.5px;
    }
    .half-pill.active{background:var(--gold);border-color:var(--gold);color:#fff;}
 
    /* ── LINEUP TAB ── */
    .pitch-lineup-header{
      display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px;
    }
    .pitch-team-meta{
      display:flex;align-items:center;gap:10px;padding:12px 14px;
      background:var(--bg-card);border:1px solid var(--border);border-radius:12px;
    }
    .pitch-team-meta--t2{flex-direction:row-reverse;text-align:right;}
    .pitch-team-meta--t2 .pitch-team-copy{align-items:flex-end;}
    .pitch-team-flag{border-radius:3px;flex-shrink:0;}
    .pitch-team-copy{display:flex;flex-direction:column;gap:2px;min-width:0;}
    .pitch-team-name{font-size:14px;font-weight:700;color:var(--text-main);line-height:1.2;}
    .pitch-team-formation{font-size:12px;font-weight:600;color:var(--gold);letter-spacing:.5px;}
    .lineup-wrap{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
    .lineup-team-card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;overflow:hidden;}
    .lineup-team-head{
      padding:12px 16px;background:var(--bg-card2);border-bottom:1px solid var(--border);
      display:flex;align-items:center;justify-content:space-between;gap:12px;
    }
    .lineup-team-brand{display:flex;align-items:center;gap:10px;min-width:0;}
    .lineup-team-flag{border-radius:3px;flex-shrink:0;}
    .lineup-team-name{font-size:14px;font-weight:700;color:var(--text-main);line-height:1.2;}
    .lineup-formation{
      font-size:12px;font-weight:700;color:var(--gold);letter-spacing:.5px;white-space:nowrap;
    }
    .lineup-section-lbl{
      padding:8px 16px;font-size:10px;letter-spacing:3px;text-transform:uppercase;
      color:var(--text-muted);background:var(--bg-card2);border-bottom:1px solid var(--border);
    }
    .lineup-player{
      display:flex;align-items:center;gap:10px;padding:9px 16px;
      border-bottom:1px solid var(--border);font-size:13px;
    }
    .lineup-player:last-child{border-bottom:none;}
    .lp-num{width:22px;font-size:12px;font-weight:700;color:var(--gold);text-align:center;flex-shrink:0;}
    .lp-name{flex:1;color:var(--text-main);font-weight:500;}
    .lp-pos{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--text-muted);}
    .lp-event{font-size:14px;margin-left:4px;}
 
    /* pitch visual */
    .pitch-lineup{
      background:linear-gradient(to bottom,#1a4a1a,#2d6e2d);
      border-radius:12px;padding:20px;margin-bottom:16px;
      position:relative;min-height:380px;aspect-ratio:16/9;overflow:hidden;
    }
    .pitch-lines{
      position:absolute;inset:20px;border:2px solid rgba(255,255,255,.25);border-radius:4px;
    }
    .pitch-center-circle{
      position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
      width:80px;height:80px;border:2px solid rgba(255,255,255,.2);border-radius:50%;
    }
    .pitch-halfway{
      position:absolute;top:20px;bottom:20px;left:50%;
      border-left:2px solid rgba(255,255,255,.2);
    }
    .pitch-box{
      position:absolute;top:50%;transform:translateY(-50%);
      width:15%;height:58%;border:2px solid rgba(255,255,255,.18);
      z-index:0;
    }
    .pitch-box-left{left:20px;border-left:none;}
    .pitch-box-right{right:20px;border-right:none;}
    .pitch-goal{
      position:absolute;top:50%;transform:translateY(-50%);
      width:8px;height:56px;border:2px solid rgba(255,255,255,.55);
      background:rgba(255,255,255,.08);z-index:1;
    }
    .pitch-goal-left{left:20px;border-right:none;border-radius:2px 0 0 2px;}
    .pitch-goal-right{right:20px;border-left:none;border-radius:0 2px 2px 0;}
    .pitch-players{
      position:absolute;inset:20px;z-index:2;
    }
    .pp-player{
      position:absolute;display:flex;flex-direction:column;align-items:center;gap:3px;
      transform:translate(-50%,-14px);min-width:44px;
    }
    .pp-player-empty{
      left:50%;top:50%;
    }
    .pp-dot{
      width:28px;height:28px;border-radius:50%;border:2px solid rgba(255,255,255,.6);
      display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:#fff;
    }
    .pp-dot.t1{background:#2a6496;}
    .pp-dot.t2{background:#c0392b;}
    .pp-name{
      font-size:9px;color:rgba(255,255,255,.92);text-align:center;max-width:72px;line-height:1.2;
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    }
 
    /* ── HEAD TO HEAD ── */
    .h2h-summary{
      background:var(--bg-card);border:1px solid var(--border);border-radius:12px;
      padding:24px;margin-bottom:20px;
      margin-top: 20px;
    }
    .h2h-wins{display:flex;align-items:center;justify-content:center;gap:32px;margin-bottom:24px;}
    .h2h-win-block{display:flex;flex-direction:column;align-items:center;gap:8px;}
    .h2h-win-logo{width:48px;height:48px;border-radius:50%;background:var(--bg-card2);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:24px;}
    .h2h-win-num{
      min-width:52px;padding:8px 12px;border-radius:30px;
      font-size:22px;font-weight:800;text-align:center;
    }
    .h2h-win-num.t1{background:#2a6496;color:#fff;}
    .h2h-win-num.draw{background:var(--bg-card2);color:var(--text-muted);border:1px solid var(--border);}
    .h2h-win-num.t2{background:#c0392b;color:#fff;}
    .h2h-win-label{font-size:12px;color:var(--text-muted);letter-spacing:.5px;}
 
    .h2h-filter{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap;}
    .h2h-pill{
      display:flex;align-items:center;gap:6px;padding:6px 14px;border-radius:30px;
      border:1px solid var(--border);background:var(--bg-card);font-size:12px;
      font-weight:500;color:var(--text-muted);cursor:pointer;transition:all .2s;
    }
    .h2h-pill.active{background:var(--bg-card2);border-color:var(--gold);color:var(--text-main);}
    .h2h-pill-icon{font-size:14px;}
 
    .h2h-match-list{display:flex;flex-direction:column;}
    .h2h-match{
      display:flex;align-items:center;padding:14px 0;
      border-bottom:1px solid var(--border);
    }
    .h2h-match:last-child{border-bottom:none;}
    .h2h-date{font-size:12px;color:var(--text-muted);min-width:110px;}
    .h2h-fixture{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;font-size:13px;}
    .h2h-tname{font-weight:500;color:var(--text-main);}
    .h2h-tname.right{text-align:right;}
    .h2h-score{
      font-size:14px;font-weight:700;padding:4px 12px;background:var(--bg-card2);
      border-radius:6px;border:1px solid var(--border);color:var(--text-main);white-space:nowrap;
    }
    .h2h-competition{font-size:11px;color:var(--text-muted);text-align:right;min-width:80px;}
 
    /* ── TABLE TAB ── */
    .standings-table-wrap{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;overflow:hidden;}
    .st-head{
      display:grid;grid-template-columns:32px 1fr 36px 36px 36px 36px 48px 52px;
      padding:10px 16px;background:var(--bg-card2);border-bottom:1px solid var(--border);
      font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--text-muted);
    }
    .st-row{
      display:grid;grid-template-columns:32px 1fr 36px 36px 36px 36px 48px 52px;
      padding:10px 16px;border-bottom:1px solid var(--border);font-size:13px;
      align-items:center;transition:background .2s;
    }
    .st-row:last-child{border-bottom:none;}
    .st-row:hover{background:rgba(201,168,76,.04);}
    .st-row.highlight{background:rgba(201,168,76,.08);border-left:3px solid var(--gold);}
    .st-pos{color:var(--text-muted);font-weight:600;text-align:center;}
    .st-team{display:flex;align-items:center;gap:8px;font-weight:500;}
    .st-flag{font-size:16px;}
    .st-num{text-align:center;color:var(--text-muted);}
    .st-pts{text-align:center;font-weight:700;color:var(--gold);}
 
    /* ── COMMENTARY ── */
    .commentary-list{display:flex;flex-direction:column;gap:0;}
    .comm-item{
      display:flex;gap:14px;padding:14px 0;
      border-bottom:1px solid var(--border);
    }
    .comm-item:last-child{border-bottom:none;}
    .comm-min{
      font-size:13px;font-weight:700;color:var(--gold);
      min-width:36px;flex-shrink:0;padding-top:1px;
    }
    .comm-content{flex:1;}
    .comm-title{font-size:13px;font-weight:600;color:var(--text-main);margin-bottom:3px;}
    .comm-text{font-size:13px;color:var(--text-muted);line-height:1.55;}
    .comm-event-badge{
      display:inline-flex;align-items:center;gap:4px;
      font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;
      padding:2px 8px;border-radius:4px;margin-bottom:5px;
    }
    .comm-event-badge.goal{background:rgba(201,168,76,.15);color:var(--gold);}
    .comm-event-badge.yellow{background:rgba(234,179,8,.15);color:#ca8a04;}
    .comm-event-badge.red{background:rgba(220,38,38,.1);color:#dc2626;}
    .comm-event-badge.sub{background:rgba(59,130,246,.1);color:#3b82f6;}
 
    /* ── RESPONSIVE ── */
    @media(max-width:768px){
      .stats-layout{grid-template-columns:1fr;}
      .pitch-lineup-header{grid-template-columns:1fr;}
      .pitch-team-meta--t2{flex-direction:row;text-align:left;}
      .pitch-team-meta--t2 .pitch-team-copy{align-items:flex-start;}
      .lineup-wrap{grid-template-columns:1fr;}
      .facts-grid{grid-template-columns:1fr;}
      .match-team-block .team-label{font-size:14px;}
      .score-big{font-size:42px;}
      .team-crest{width:40px;height:40px;font-size:20px;}
      .st-head,.st-row{grid-template-columns:28px 1fr 28px 28px 28px 28px 36px 44px;font-size:11px;padding:8px 10px;}
      .h2h-date{min-width:80px;font-size:11px;}
    }
    @media(max-width:480px){
      .nav-match-tabs .nav-link{font-size:12px;padding:12px 12px;}
      .score-big{font-size:36px;}
      .score-center{padding:0 14px;}
    }