/* Correctif Blog + Médiathèque — Wilfried Lajoie */

/* =========================
   Actualités dynamiques
   ========================= */
.wj-live {
  padding-top: clamp(4.5rem, 8vw, 7.2rem);
  padding-bottom: clamp(4.5rem, 8vw, 7.2rem);
  background:
    radial-gradient(circle at 88% 10%, rgba(217,170,77,.10), transparent 30%),
    #0f0c0a;
  border-top: 1px solid rgba(217,170,77,.14);
  border-bottom: 1px solid rgba(217,170,77,.14);
}

.wj-live__head {
  display: grid;
  grid-template-columns: minmax(270px,.8fr) minmax(380px,1.2fr);
  gap: 3rem;
  align-items: end;
  margin-bottom: 2rem;
}

.wj-live__head h2 {
  margin: .55rem 0 0;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.25rem,4.8vw,4.3rem);
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: -.026em;
}

.wj-live__intro {
  margin: 0;
  color: var(--wj-muted, #cbbbaa);
  font-size: 1.03rem;
  line-height: 1.8;
}

.wj-live__filters {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin: 0 0 2rem;
}

.wj-live__filter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: .62rem .95rem;
  border: 1px solid rgba(217,170,77,.34);
  border-radius: 999px;
  color: #f0e5d6;
  background: transparent;
  font-size: .88rem;
  font-weight: 800;
  text-decoration: none;
}

.wj-live__filter:hover,
.wj-live__filter:focus-visible,
.wj-live__filter.is-active {
  color: #17110e;
  background: var(--wj-gold, #d9aa4d);
  border-color: var(--wj-gold, #d9aa4d);
  outline: none;
}

.wj-live__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 1rem;
}

.wj-post-card {
  overflow: hidden;
  border: 1px solid rgba(217,170,77,.23);
  border-radius: 19px;
  background: linear-gradient(155deg,rgba(61,27,21,.72),rgba(20,14,12,.96));
  box-shadow: 0 20px 55px rgba(0,0,0,.25);
}

.wj-post-card__media {
  display: block;
  min-height: 220px;
  background:
    radial-gradient(circle at 50% 35%, rgba(217,170,77,.16), transparent 42%),
    #211713;
}

.wj-post-card__media img {
  width: 100%;
  height: 235px;
  display: block;
  object-fit: cover;
}

.wj-post-card__placeholder {
  min-height: 235px;
  display: grid;
  place-items: center;
  padding: 1.5rem;
  color: rgba(239,209,141,.72);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 3rem;
}

.wj-post-card__body {
  padding: 1.25rem;
}

.wj-post-card__meta {
  margin: 0 0 .55rem;
  color: var(--wj-gold, #d9aa4d);
  font-size: .73rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.wj-post-card h3 {
  margin: 0 0 .7rem;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.48rem;
  font-weight: 500;
  line-height: 1.15;
}

.wj-post-card h3 a {
  color: inherit;
  text-decoration: none;
}

.wj-post-card h3 a:hover,
.wj-post-card h3 a:focus-visible {
  color: var(--wj-gold-light, #efd18d);
  outline: none;
}

.wj-post-card__excerpt {
  margin: 0;
  color: #c8b8a8;
  line-height: 1.65;
}

.wj-post-card__more {
  display: inline-block;
  margin-top: 1rem;
  color: var(--wj-gold-light, #efd18d);
  font-weight: 800;
  text-decoration: none;
}

.wj-live__empty {
  padding: 1.5rem;
  border: 1px solid rgba(217,170,77,.24);
  border-radius: 18px;
  color: #d4c5b5;
  background: #211713;
  line-height: 1.75;
}

.wj-live__pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .5rem;
  margin-top: 2rem;
}

.wj-live__pagination a,
.wj-live__pagination span {
  min-width: 42px;
  min-height: 42px;
  display: inline-grid;
  place-items: center;
  padding: .55rem .75rem;
  border: 1px solid rgba(217,170,77,.3);
  border-radius: 999px;
  color: #f0e5d6;
  text-decoration: none;
}

.wj-live__pagination .is-current,
.wj-live__pagination a:hover,
.wj-live__pagination a:focus-visible {
  color: #17110e;
  background: var(--wj-gold, #d9aa4d);
  border-color: var(--wj-gold, #d9aa4d);
  outline: none;
}

/* =========================
   Médiathèque complète
   ========================= */
.wm-library,
.wm-press,
.wm-documented {
  padding-top: clamp(4.5rem, 8vw, 7.2rem);
  padding-bottom: clamp(4.5rem, 8vw, 7.2rem);
}

.wm-library {
  background:
    radial-gradient(circle at 86% 8%, rgba(39,95,174,.17), transparent 29%),
    #0f0c0a;
  border-top: 1px solid rgba(216,170,78,.13);
}

.wm-video-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 1rem;
}

.wm-video-card {
  overflow: hidden;
  border: 1px solid rgba(216,170,78,.24);
  border-radius: 21px;
  background: linear-gradient(155deg,rgba(61,27,21,.72),rgba(20,14,12,.96));
  box-shadow: 0 22px 60px rgba(0,0,0,.28);
}

.wm-video-card--main {
  grid-column: 1 / -1;
}

.wm-video-card__body {
  padding: 1.25rem;
}

.wm-video-card__meta {
  margin: 0 0 .45rem;
  color: var(--wm-gold, #d8aa4e);
  font-size: .73rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.wm-video-card h3 {
  margin: 0 0 .65rem;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.45rem,2.5vw,2rem);
  font-weight: 500;
  line-height: 1.15;
}

.wm-video-card__body p:last-child {
  margin: 0;
  color: #c8b8a8;
  line-height: 1.65;
}

.wm-press {
  background:
    linear-gradient(135deg,#2d130f,#120e0c 68%);
}

.wm-press-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 1rem;
}

.wm-press-card {
  min-height: 310px;
  display: flex;
  flex-direction: column;
  padding: 1.4rem;
  border: 1px solid rgba(216,170,78,.24);
  border-radius: 18px;
  background: linear-gradient(155deg,rgba(70,29,22,.72),rgba(20,14,12,.95));
}

.wm-press-card__source {
  color: var(--wm-gold, #d8aa4e);
  font-size: .73rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.wm-press-card h3 {
  margin: 2rem 0 .7rem;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.55rem;
  font-weight: 500;
  line-height: 1.15;
}

.wm-press-card p {
  margin: 0;
  color: #c8b7a7;
  line-height: 1.65;
}

.wm-press-card a {
  margin-top: auto;
  padding-top: 1.2rem;
  color: var(--wm-gold-light, #efd18e);
  font-weight: 800;
  text-decoration: none;
}

.wm-press-card a:hover,
.wm-press-card a:focus-visible {
  text-decoration: underline;
  outline: none;
}

.wm-documented {
  background: #15100e;
}

.wm-doc-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: .85rem;
}

.wm-doc-card {
  padding: 1.25rem;
  border: 1px solid rgba(216,170,78,.22);
  border-radius: 16px;
  background: #211713;
}

.wm-doc-card__type {
  display: block;
  color: var(--wm-gold, #d8aa4e);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.wm-doc-card h3 {
  margin: .8rem 0 .55rem;
  color: #fff;
  font-size: 1.18rem;
}

.wm-doc-card p {
  margin: 0;
  color: #c8b8a8;
  line-height: 1.65;
}

.wm-doc-card a {
  display: inline-block;
  margin-top: .9rem;
  color: var(--wm-gold-light, #efd18e);
  font-weight: 800;
}

@media (max-width: 920px) {
  .wj-live__head,
  .wm-video-grid,
  .wm-press-grid {
    grid-template-columns: 1fr;
  }

  .wm-video-card--main {
    grid-column: auto;
  }

  .wj-live__grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 640px) {
  .wj-live__grid,
  .wm-doc-grid {
    grid-template-columns: 1fr;
  }
}

/* BEGIN WILFRIED GEORGET CORINE INTERVIEW */

.wm-video-card--conversation {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(420px, 560px) minmax(0, 1fr);
  align-items: stretch;
}

.wm-twitch-interview {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 315px;
  overflow: hidden;
  background: #090706;
  border-right: 1px solid rgba(216,170,78,.18);
}

.wm-twitch-interview iframe,
.wm-twitch-player {
  display: block;
  width: 100%;
  min-width: 400px;
  height: 315px;
  border: 0;
}

.wm-twitch-player > div,
.wm-twitch-player iframe {
  width: 100% !important;
  height: 100% !important;
}

.wm-video-card__body--conversation {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(1.6rem, 4vw, 3rem);
}

.wm-twitch-interview__link {
  margin-top: 1rem !important;
}

.wm-twitch-interview__link a {
  color: var(--wm-gold-light, #efd18e);
  font-weight: 700;
  text-decoration: none;
}

.wm-twitch-interview__link a:hover,
.wm-twitch-interview__link a:focus-visible {
  text-decoration: underline;
  text-underline-offset: 4px;
}

@media (max-width: 900px) {
  .wm-video-card--conversation {
    grid-template-columns: 1fr;
  }

  .wm-twitch-interview {
    min-height: 300px;
    border-right: 0;
    border-bottom: 1px solid rgba(216,170,78,.18);
  }

  .wm-twitch-interview iframe,
  .wm-twitch-player {
    width: 100%;
    min-width: 0;
    height: auto;
    min-height: 300px;
    aspect-ratio: 16 / 9;
  }
}

/* END WILFRIED GEORGET CORINE INTERVIEW */

/* BEGIN WILFRIED MANAGED VIDEOS */

.wm-managed-video-card {
  min-width: 0;
}

.wm-managed-video-media {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #090706;
  border-bottom: 1px solid rgba(216,170,78,.16);
}

.wm-managed-video-media iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.wm-managed-youtube-button {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  background: #090706;
  cursor: pointer;
}

.wm-managed-youtube-button img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .3s ease;
}

.wm-managed-video-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      to top,
      rgba(5,4,3,.56),
      rgba(5,4,3,.04) 60%
    );
}

.wm-managed-video-play {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  width: 68px;
  height: 68px;
  padding-left: 4px;
  border: 2px solid rgba(255,255,255,.96);
  border-radius: 50%;
  color: #fff;
  background: rgba(0,0,0,.38);
  font-size: 1.4rem;
  transform: translate(-50%,-50%);
  box-shadow: 0 12px 34px rgba(0,0,0,.34);
}

.wm-managed-youtube-button:hover img,
.wm-managed-youtube-button:focus-visible img {
  transform: scale(1.02);
}

.wm-managed-youtube-button:focus-visible {
  outline: 2px solid #d8aa4e;
  outline-offset: -2px;
}

/* END WILFRIED MANAGED VIDEOS */

/* BEGIN WILFRIED MANAGED VIDEO GRID INTEGRATION */

/*
 * Les cartes gérées sont maintenant de simples enfants
 * de la grille .wm-video-grid existante.
 */
.wm-video-grid > .wm-managed-video-card {
  min-width: 0;
}

.wm-managed-video-overlay {
  position: absolute;
  right: 1.45rem;
  bottom: 1.35rem;
  left: 1.45rem;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: .28rem;
  color: #fff;
  text-align: left;
  pointer-events: none;
}

.wm-managed-video-overlay strong {
  display: block;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.55rem, 2.5vw, 2.25rem);
  font-weight: 700;
  line-height: 1.05;
  text-shadow: 0 2px 16px rgba(0,0,0,.72);
}

.wm-managed-video-overlay small {
  display: block;
  color: rgba(255,255,255,.9);
  font-size: .9rem;
  font-weight: 600;
  line-height: 1.35;
  text-shadow: 0 2px 12px rgba(0,0,0,.8);
}

.wm-managed-video-shade {
  background:
    linear-gradient(
      to top,
      rgba(8,5,4,.90) 0%,
      rgba(8,5,4,.44) 37%,
      rgba(8,5,4,.03) 70%
    );
}

/* END WILFRIED MANAGED VIDEO GRID INTEGRATION */