/*******************/
/* Posts categories */
/*******************/

.row-posts-categories ul{
    display: grid;
    grid-gap: var(--gap); /* Espacement entre les éléments */
    grid-template-columns: repeat(auto-fill, minmax(calc(25% - var(--gap)), 1fr));
    padding: 0;
    margin: 0;
}
.row-posts-categories ul[data-terms-count="2"]{
    grid-template-columns: repeat(auto-fill, minmax(calc(50% - var(--gap)), 1fr));
}
.row-posts-categories ul[data-terms-count="5"]{
    grid-template-columns: repeat(auto-fill, minmax(calc(20% - var(--gap)), 1fr));
}
.row-posts-categories ul[data-terms-count="3"],
.row-posts-categories ul[data-terms-count="6"]
.row-posts-categories ul[data-terms-count="9"]{
    grid-template-columns: repeat(auto-fill, minmax(calc(33.3333% - var(--gap)), 1fr));
}
/* IDEALLEMENT FAIRE UN FICHIER CSS + TEMPLATE PART POUR CA AUSSI DU STYLE "card-term" */
.row-posts-categories ul li{
    position: relative;
    border-radius: var(--card-radius);
    box-shadow: 0px 24px 34px -20px rgba(0, 0, 0, 0.10), 0px 30px 30px -30px rgba(101, 109, 142, 0.50);
    overflow: hidden;
    list-style-type: none;
    aspect-ratio: 4/3;
    -webkit-transition: box-shadow 300ms ease-in-out;
    transition: box-shadow 300ms ease-in-out;
}
.row-posts-categories ul[data-terms-count="5"] li {
    border-radius: calc(var(--radius) * 2);
}
.row-posts-categories ul li > a{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    width: 100%;
    text-decoration: none;
    padding: calc(var(--gap) * 2);
}
.row-posts-categories ul li img {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: transform 300ms ease-in-out;
    transition: transform 300ms ease-in-out;
}
.row-posts-categories ul li .headline-post-cat{
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.row-posts-categories ul li h3{
    position: relative;
    color: var(--white);
    font-size: var(--large-font);
    font-style: normal;
    font-weight: 500;
    line-height: 130%;
}
.row-posts-categories ul[data-terms-count="5"] li h3{
    font-size: var(--medium-font)!important;
}
/* Hover */
.row-posts-categories ul li:hover{
    box-shadow: 0px 24px 34px -20px rgba(0, 0, 0, 0.10), 0px 40px 60px -25px rgba(101, 109, 142, 0.50);
}
.row-posts-categories ul li:hover img{
    transform: scale(1.05);
}



/*******************/
/* ON SINGLE PAGE */
/*******************/
@media (min-width: 1025px) {
    .single .row-posts-categories ul[data-terms-count="5"] {
        grid-template-columns: repeat(auto-fill, minmax(calc(30% - var(--gap)), 1fr));
    }
    .single .row-posts-categories ul[data-terms-count="4"] {
        grid-template-columns: repeat(auto-fill, minmax(calc(50% - var(--gap)), 1fr));
    }
    .single .row-posts-categories ul[data-terms-count="6"] {
        grid-template-columns: repeat(auto-fill, minmax(calc(33.3333% - var(--gap)), 1fr));
    }
    .single .row-posts-categories ul {
        grid-template-columns: repeat(auto-fill, minmax(calc(50% - var(--gap)), 1fr));
    }
}
/*******************/
  /* RESPONSIVE */
/*******************/
.row-posts-categories ul[data-terms-count="2"]{
    grid-template-columns: repeat(auto-fill, minmax(calc(50% - var(--gap)), 1fr));
}
.row-posts-categories ul[data-terms-count="5"]{
    grid-template-columns: repeat(auto-fill, minmax(calc(20% - var(--gap)), 1fr));
}
.row-posts-categories ul[data-terms-count="3"],
.row-posts-categories ul[data-terms-count="6"],
.row-posts-categories ul[data-terms-count="9"]{
    grid-template-columns: repeat(auto-fill, minmax(calc(33.3333% - var(--gap)), 1fr));
}

@media (max-width: 1440px) {
}
@media (max-width: 1280px) {
    .row-posts-categories ul li > a{
        padding: calc(var(--gap) * 1.3);
    }
}
@media (max-width: 1200px) {
    .row-posts-categories ul{
        grid-template-columns: repeat(auto-fill, minmax(calc(25% - var(--gap)), 1fr));
    }
    .row-posts-categories ul,
    .row-posts-categories ul[data-terms-count="5"]{
        grid-template-columns: repeat(auto-fill, minmax(calc(33.33333% - var(--gap)), 1fr));
    }
    .row-posts-categories ul li{
        aspect-ratio: 4/2.5;
    }

    
}
@media (max-width: 992px) {

 
}
@media (max-width: 768px) {
    .row-posts-categories ul,
    .row-posts-categories ul[data-terms-count="3"],
    .row-posts-categories ul[data-terms-count="5"],
    .row-posts-categories ul[data-terms-count="6"],
    .row-posts-categories ul[data-terms-count="9"]{
        grid-template-columns: repeat(auto-fill, minmax(calc(50% - var(--gap)), 1fr));
    }

}
@media (max-width: 575px) {
    .row-posts-categories ul[data-terms-count="5"] li,
    .row-posts-categories ul li {
        border-radius: calc(var(--radius) * 1);
    }
    .row-posts-categories ul li > a {
        padding: calc(var(--gap) * 1);
    }
}