/* =====================================================
   PAGE MATCHS (À domicile) — FC Luy de Béarn
   Règles extraites de single-archive.css + corps en 2 colonnes.
   · ≥ 901px : hero pleine largeur, puis 2 colonnes
               (2/3 contenu · 1/3 partenaires en défilement vertical)
   · ≤ 900px : inchangé (blocs empilés, carrousel partenaires horizontal)
   ===================================================== */

.page-matchs {
  /* Marge latérale et fond des blocs du corps (widget + affiche).
     Mobile : pleine largeur avec gouttière, comme avant.
     Desktop : gérés par .matchs-body (voir plus bas). */
  --matchs-px: var(--fclb-gutter, clamp(20px, 5vw, 80px));
  --matchs-bg: #F5F8F2;
}
@media (min-width: 901px) {
  .page-matchs {
    --matchs-px: 0px;
    --matchs-bg: transparent;
  }
}

/* ── Hero ── */
.page-matchs .matchs-hero {
  background: #2A5C1E !important;
  padding: clamp(48px, 6vw, 72px) var(--fclb-gutter, clamp(20px, 5vw, 80px)) !important;
}
.page-matchs .matchs-hero__inner {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 40px !important;
  flex-wrap: wrap !important;
}
.page-matchs .matchs-hero__left { flex: 1 !important; min-width: 280px !important; }
.page-matchs .matchs-hero__title {
  font-size: clamp(32px, 4vw + 14px, 52px) !important;
  font-family: var(--font-heading) !important;
  font-weight: 700 !important;
  color: #fff !important;
  letter-spacing: -0.02em !important;
  margin: 16px 0 14px !important;
  line-height: 1.1 !important;
}
.page-matchs .matchs-hero__sub {
  font-size: clamp(17px, 1vw + 14px, 19px) !important;
  color: rgba(255,255,255,0.7) !important;
  line-height: 1.6 !important;
  max-width: 480px !important;
  margin-bottom: 24px !important;
}
.page-matchs .matchs-hero__stades { display: flex !important; gap: 10px !important; flex-wrap: wrap !important; }
.page-matchs .matchs-stade-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: clamp(17px, 0.8vw + 14px, 18px) !important;
  color: rgba(255,255,255,0.8) !important;
  background: rgba(255,255,255,0.1) !important;
  border: 0.5px solid rgba(255,255,255,0.2) !important;
  padding: 7px 14px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  transition: background 0.15s !important;
}
.page-matchs .matchs-stade-btn:hover { background: rgba(255,255,255,0.18) !important; color: #fff !important; }
.page-matchs .matchs-hero__right {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 16px !important;
  flex-shrink: 0 !important;
}
.page-matchs .matchs-hero__stat { text-align: right !important; }
.page-matchs .matchs-hero__stat-val {
  display: block !important;
  font-size: clamp(40px, 5vw + 14px, 64px) !important;
  font-family: var(--font-heading) !important;
  font-weight: 700 !important;
  color: #9FDF6A !important;
  line-height: 1 !important;
}
.page-matchs .matchs-hero__stat-lbl {
  font-size: clamp(17px, 0.9vw + 14px, 18px) !important;
  color: rgba(255,255,255,0.55) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
}
.page-matchs .matchs-fff-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: clamp(17px, 0.8vw + 14px, 18px) !important;
  font-weight: 600 !important;
  color: #1B2618 !important;
  background: #9FDF6A !important;
  padding: 9px 18px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  transition: opacity 0.15s !important;
}
.page-matchs .matchs-fff-btn:hover { opacity: 0.85 !important; }
.page-matchs .matchs-content {
  padding: clamp(40px, 5vw, 64px) var(--fclb-gutter, clamp(20px, 5vw, 80px)) !important;
}
.page-matchs .matchs-weekend { margin-bottom: 40px !important; }
.page-matchs .matchs-weekend__label {
  font-size: clamp(17px, 1vw + 14px, 19px) !important;
  font-family: var(--font-heading) !important;
  font-weight: 600 !important;
  color: #2A5C1E !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  margin-bottom: 12px !important;
  padding-bottom: 10px !important;
  border-bottom: 2px solid #EAF3DE !important;
}
.page-matchs .matchs-weekend__list { display: flex !important; flex-direction: column !important; gap: 10px !important; }
.page-matchs .matchs-vide {
  text-align: center !important;
  padding: 48px 0 !important;
  color: #666 !important;
  font-size: clamp(17px, 1vw + 14px, 18px) !important;
}

/* ── Widget Score'n'co ── */
.page-matchs .matchs-widget-section {
  padding: clamp(40px, 5vw, 60px) var(--matchs-px) clamp(32px, 4vw, 48px) !important;
  background: var(--matchs-bg) !important;
  display: block !important;
}
.page-matchs .matchs-widget-header { margin-bottom: 24px !important; padding: 0 !important; }
.page-matchs .matchs-widget-eyebrow {
  font-size: clamp(17px, 0.8vw + 14px, 18px) !important;
  font-family: var(--font-heading) !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #2A5C1E !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  display: block !important;
}
.page-matchs .matchs-widget-section h2 {
  font-size: clamp(22px, 2vw + 14px, 28px) !important;
  font-family: var(--font-heading) !important;
  font-weight: 700 !important;
  color: #111 !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
}
.page-matchs .matchs-widget-desc { font-size: clamp(17px, 0.9vw + 14px, 18px) !important; color: #666 !important; margin: 0 !important; padding: 0 !important; }
.page-matchs .matchs-widget-embed { border-radius: 10px !important; overflow: hidden !important; border: 0.5px solid #DDE8D5 !important; }
.page-matchs .matchs-widget-embed iframe { display: block !important; width: 100% !important; height: 500px !important; border: none !important; }
@media (max-width: 640px) {
  .page-matchs .matchs-widget-embed iframe { height: 600px !important; }
}

/* ── Affiche calendrier de la saison ── */
.page-matchs .matchs-calendrier-saison {
  padding: 0 var(--matchs-px) clamp(40px, 5vw, 60px) !important;
  background: var(--matchs-bg) !important;
}
.page-matchs .matchs-calendrier-saison__header {
  margin-bottom: 20px !important;
}
.page-matchs .matchs-calendrier-saison__header h2 {
  font-size: clamp(22px, 2vw + 14px, 28px) !important;
  font-family: var(--font-heading) !important;
  font-weight: 700 !important;
  color: #111 !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
}
.page-matchs .matchs-calendrier-saison img {
  display: block !important;
  width: 100% !important;
  max-width: 480px !important;
  height: auto !important;
  margin: 0 auto !important;
  border-radius: 10px !important;
  border: 0.5px solid #DDE8D5 !important;
}
.page-matchs .matchs-calendrier-saison__lien {
  margin: 12px 0 0 !important;
  text-align: center !important;
}
.page-matchs .matchs-calendrier-saison__lien a {
  font-size: clamp(15px, 0.7vw + 13px, 16px) !important;
  color: #2A5C1E !important;
  text-decoration: none !important;
  border-bottom: 1px solid #C0DD97 !important;
}

/* ── Partenaires — éléments communs mobile + desktop ── */
.page-matchs .matchs-partenaires__titre {
  font-size: clamp(17px, 0.9vw + 14px, 18px) !important;
  font-family: var(--font-heading) !important;
  font-weight: 600 !important;
  color: #2A5C1E !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
}
.page-matchs .matchs-partenaires__lien {
  font-size: clamp(17px, 0.9vw + 14px, 18px) !important;
  color: #2A5C1E !important;
  text-decoration: none !important;
  border-bottom: 1px solid #C0DD97 !important;
  padding-bottom: 2px !important;
}
.page-matchs .matchs-partenaires__item {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #fff !important;
  border: 0.5px solid #DDE8D5 !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  transition: border-color 0.15s, box-shadow 0.15s !important;
}
.page-matchs .matchs-partenaires__item:hover { border-color: #2A5C1E !important; box-shadow: 0 2px 12px rgba(42,92,30,0.1) !important; }
.page-matchs .matchs-partenaires__item img {
  max-height: 52px !important;
  max-width: 120px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
  filter: grayscale(20%) !important;
  transition: filter 0.15s !important;
}
.page-matchs .matchs-partenaires__item:hover img { filter: grayscale(0%) !important; }
.page-matchs .matchs-partenaires__placeholder {
  font-size: clamp(17px, 0.8vw + 14px, 18px) !important;
  font-weight: 500 !important;
  color: #999 !important;
  text-align: center !important;
}

/* ── Partenaires — MOBILE / TABLETTE (≤ 900px) : carrousel horizontal, inchangé ── */
@media (max-width: 900px) {
  .page-matchs .matchs-partenaires {
    background: #F5F8F2 !important;
    border-top: 1px solid #DDE8D5 !important;
    padding: clamp(28px, 3vw, 40px) 0 !important;
  }
  .page-matchs .matchs-partenaires__header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 var(--fclb-gutter, clamp(20px, 5vw, 80px)) !important;
    margin-bottom: 20px !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
  }
  .page-matchs .matchs-partenaires__track-wrap { overflow: hidden !important; width: 100% !important; position: relative !important; }
  .page-matchs .matchs-partenaires__track {
    display: flex !important;
    align-items: center !important;
    gap: 40px !important;
    width: max-content !important;
    animation: fclb-scroll 30s linear infinite !important;
  }
  .page-matchs .matchs-partenaires__track:hover { animation-play-state: paused !important; }
  .page-matchs .matchs-partenaires__item {
    flex-shrink: 0 !important;
    padding: 12px 20px !important;
    min-width: 140px !important;
    height: 80px !important;
  }
}
@keyframes fclb-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ── CORPS DESKTOP (≥ 901px) : 2 colonnes, 2/3 contenu · 1/3 partenaires ── */
@media (min-width: 901px) {
  .page-matchs .matchs-body {
    display: grid !important;
    grid-template-columns: 2fr 1fr !important;
    gap: clamp(24px, 3vw, 48px) !important;
    align-items: start !important;
    padding: 0 var(--fclb-gutter, clamp(20px, 5vw, 80px)) !important;
    background: #F5F8F2 !important;
  }
  .page-matchs .matchs-body__main { min-width: 0 !important; }

  /* Colonne droite : carte qui reste visible pendant le scroll */
  .page-matchs .matchs-body__aside {
    position: sticky !important;
    top: calc(var(--fclb-topbar-h, 36px) + var(--fclb-nav-h, 64px) + 24px) !important;
    min-width: 0 !important;
    margin: clamp(40px, 5vw, 60px) 0 clamp(32px, 4vw, 48px) !important;
  }
  .page-matchs .matchs-partenaires {
    background: #fff !important;
    border: 1px solid #DDE8D5 !important;
    border-radius: 14px !important;
    padding: 22px 20px !important;
    overflow: hidden !important;
  }
  .page-matchs .matchs-partenaires__header {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
    margin-bottom: 16px !important;
  }

  /* Fenêtre de défilement vertical, fondu haut/bas */
  .page-matchs .matchs-partenaires__track-wrap {
    position: relative !important;
    width: 100% !important;
    height: clamp(360px, 62vh, 560px) !important;
    overflow: hidden !important;
    -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 8%, #000 92%, transparent 100%) !important;
            mask-image: linear-gradient(to bottom, transparent 0, #000 8%, #000 92%, transparent 100%) !important;
  }
  /* Piste verticale : margin-bottom (et non gap) sur les items pour que la
     boucle à -50 % retombe pile sur le début de la 2ᵉ série, sans à-coup. */
  .page-matchs .matchs-partenaires__track {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: 100% !important;
    animation: matchs-partenaires-vertical 60s linear infinite !important;
  }
  .page-matchs .matchs-partenaires__track-wrap:hover .matchs-partenaires__track,
  .page-matchs .matchs-partenaires__track-wrap:focus-within .matchs-partenaires__track {
    animation-play-state: paused !important;
  }
  .page-matchs .matchs-partenaires__item {
    flex: 0 0 auto !important;
    width: 100% !important;
    height: 92px !important;
    margin: 0 0 12px !important;
    padding: 12px 16px !important;
    box-sizing: border-box !important;
  }
  .page-matchs .matchs-partenaires__item img {
    max-width: 100% !important;
    max-height: 100% !important;
  }

  /* Accessibilité : sans animation, liste simple défilable à la main,
     sans la série dupliquée. */
  @media (prefers-reduced-motion: reduce) {
    .page-matchs .matchs-partenaires__track { animation: none !important; }
    .page-matchs .matchs-partenaires__track-wrap {
      overflow-y: auto !important;
      -webkit-mask-image: none !important;
              mask-image: none !important;
    }
    .page-matchs .matchs-partenaires__item[aria-hidden="true"] { display: none !important; }
  }
}
@keyframes matchs-partenaires-vertical {
  from { transform: translateY(0); }
  to   { transform: translateY(-50%); }
}