/* Spécificités uniques pour ivx-guides */
.guides h2 {
  margin-bottom: 30.57px;
}

/* Surcharge des couleurs h2::before via les variables CSS inline */
.dark-mode .guides h2.section-title[style*="--dark-accent-color"]::before {
  background-color: var(--dark-accent-color) !important;
}

.light-mode .guides h2.section-title[style*="--light-accent-color"]::before {
  background-color: var(--light-accent-color) !important;
}

/* Surcharge des couleurs du bouton more via les variables CSS inline */
.dark-mode .guides a.more[style*="--dark-bg-color"] {
  color: var(--dark-text-color) !important;
  background-color: var(--dark-bg-color) !important;
}

.dark-mode .guides a.more[style*="--dark-text-color"] span.arrow {
  color: var(--dark-text-color) !important;
}

.light-mode .guides a.more[style*="--light-bg-color"] {
  color: var(--light-text-color) !important;
  background-color: var(--light-bg-color) !important;
}

.light-mode .guides a.more[style*="--light-text-color"] span.arrow {
  color: var(--light-text-color) !important;
}

/* Styles hover pour le bouton more en mode sombre */
.dark-mode .guides a.more[style*="--dark-bg-color"]:hover {
  color: var(--dark-text-hover-color) !important;
  background-color: var(--dark-bg-hover-color) !important;
  transition: all 0.3s ease !important;
}

.dark-mode .guides a.more[style*="--dark-text-color"]:hover span.arrow {
  color: var(--dark-text-hover-color) !important;
}

/* Styles hover pour le bouton more en mode clair */
.light-mode .guides a.more[style*="--light-bg-color"]:hover {
  color: var(--light-text-hover-color) !important;
  background-color: var(--light-bg-hover-color) !important;
  transition: all 0.3s ease !important;
}

.light-mode .guides a.more[style*="--light-text-color"]:hover span.arrow {
  color: var(--light-text-hover-color) !important;
}



.guides .grid-7 {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: repeat(2, auto);
  grid-column-gap: 24px;
  grid-row-gap: 29.35px;
}

/* disposition */

.guides .grid-7 article:nth-child(1) {
  grid-area: 1 / 1 / 2 / 5;
}
.guides .grid-7 article:nth-child(2) {
  grid-area: 1 / 5 / 2 / 9;
}
.guides .grid-7 article:nth-child(3) {
  grid-area: 1 / 9 / 2 / 13;
}
.guides .grid-7 article:nth-child(4) {
  grid-area: 2 / 1 / 3 / 4;
}
.guides .grid-7 article:nth-child(5) {
  grid-area: 2 / 4 / 3 / 7;
}
.guides .grid-7 article:nth-child(6) {
  grid-area: 2 / 7 / 3 / 10;
}
.guides .grid-7 article:nth-child(7) {
  grid-area: 2 / 10 / 3 / 13;
}

/* images */

.guides .grid-7 article:nth-child(1) .post-thumbnail {
  height: 231px !important;
}

.guides .grid-7 article:nth-child(2) .post-thumbnail {
  height: 210px !important;
}

.guides .grid-7 article:nth-child(3) .post-thumbnail {
  height: 210px !important;
}

.guides .grid-7 article:nth-child(4) .post-thumbnail {
  height: 160px !important;
}

.guides .grid-7 article:nth-child(5) .post-thumbnail {
  height: 160px !important;
}

.guides .grid-7 article:nth-child(6) .post-thumbnail {
  height: 160px !important;
}

.guides .grid-7 article:nth-child(7) .post-thumbnail {
  height: 160px !important;
}

/* img */

.guides .grid-7 article:nth-child(1) .post-thumbnail img {
  height: 231px !important;
}

.guides .grid-7 article:nth-child(2) .post-thumbnail img {
  height: 210px !important;
}

.guides .grid-7 article:nth-child(3) .post-thumbnail img {
  height: 210px !important;
}

.guides .grid-7 article:nth-child(4) .post-thumbnail img {
  height: 160px !important;
}

.guides .grid-7 article:nth-child(5) .post-thumbnail img {
  height: 160px !important;
}

.guides .grid-7 article:nth-child(6) .post-thumbnail img {
  height: 160px !important;
}

.guides .grid-7 article:nth-child(7) .post-thumbnail img {
  height: 160px !important;
}

@media (max-width: 767px) {
  .home .guides .grid-7 {
    grid-template-columns: 1fr !important;
  }
}

/* disposition */

@media (max-width: 767px) {
  .guides .grid-7 article:nth-child(1) {
    grid-area: unset;
  }
  .guides .grid-7 article:nth-child(2) {
    grid-area: unset;
  }
  .guides .grid-7 article:nth-child(3) {
    grid-area: unset;
  }
  .guides .grid-7 article:nth-child(4) {
    grid-area: unset;
  }
  .guides .grid-7 article:nth-child(5) {
    grid-area: unset;
  }
  .guides .grid-7 article:nth-child(6) {
    grid-area: unset;
  }
  .guides .grid-7 article:nth-child(7) {
    grid-area: unset;
  }
}

/* images */
@media (max-width: 767px) {
  .guides .grid-7 article:nth-child(1) .post-thumbnail {
    height: auto !important;
  }

  .guides .grid-7 article:nth-child(2) .post-thumbnail {
    height: auto !important;
  }

  .guides .grid-7 article:nth-child(3) .post-thumbnail {
    height: auto !important;
  }

  .guides .grid-7 article:nth-child(4) .post-thumbnail {
    height: auto !important;
  }

  .guides .grid-7 article:nth-child(5) .post-thumbnail {
    height: auto !important;
  }

  .guides .grid-7 article:nth-child(6) .post-thumbnail {
    height: auto !important;
  }

  .guides .grid-7 article:nth-child(7) .post-thumbnail {
    height: auto !important;
  }
}
/* img */

@media (max-width: 767px) {
  .guides .grid-7 article:nth-child(1) .post-thumbnail img {
    height: auto !important;
  }

  .guides .grid-7 article:nth-child(2) .post-thumbnail img {
    height: auto !important;
  }

  .guides .grid-7 article:nth-child(3) .post-thumbnail img {
    height: auto !important;
  }

  .guides .grid-7 article:nth-child(4) .post-thumbnail img {
    height: auto !important;
  }

  .guides .grid-7 article:nth-child(5) .post-thumbnail img {
    height: auto !important;
  }

  .guides .grid-7 article:nth-child(6) .post-thumbnail img {
    height: auto !important;
  }

  .guides .grid-7 article:nth-child(7) .post-thumbnail img {
    height: auto !important;
  }
}