.section--blog {
    margin: 90px 0;
}

.section--blog::after{
    content:'';
    width: 50vw;
    height: 100%;
    background:var(--color-primary);
    position: absolute;
    top:0;
    left:0;
    z-index: -1;
}
.section--blog .container {
    background:var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 0 20px 20px 0;
}
.section--blog .section__column {
    width: calc(50% - 35px);
}
.section--blog .section__column:nth-child(1){
}
.section--blog .section__column:nth-child(2){
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 55px calc(55px - clamp(14px, 5%, 25px)) 55px 0;
}

.section--blog .section__image {
    min-height: 400px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    overflow: hidden;
}
.section--blog .section__image img{
    position: absolute;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.section--blog  .section__header .section__title {
    margin: 0 0 45px 0;
    text-transform: uppercase;

}
.section--blog .section__text {
    color:var(--color-white);
}
.section--blog  .button--secondary {
}




@media all and (max-width: 1340px){
    .section--blog .container {
        border-radius: 0;
    }
}

@media all and (max-width: 1000px){
    .section--blog {
        margin: 50px 0 0 0;
    }
    .section--blog .container {
        flex-direction: column-reverse;
    }
    .section--blog .section__column{
        width: 100%;
    }
    .section--blog .section__column:nth-child(2){
        padding:clamp(14px, 5%, 25px) 0 55px 0
    }
    .section--blog .section__column:nth-child(1){
        padding:0 0 clamp(14px, 5%, 25px) 0;
    }
    .section--blog .section__header .section__title{
        width: 100%;
        text-align: center;
        margin: 0 0 clamp(14px, 5%, 25px)  0;
    }
    .section--blog .section__text{
        width: 100%;
        text-align: center;
    }
    .section--blog .section__controls{
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .section--blog .section__controls .button {
        margin: clamp(14px, 5%, 25px)  0 0 0;
    }
}
















.blog-section .section__header {
    margin: 58px 0 0 0;
}
.blog-section .section__title {
    width: 100%;
    text-align: center;
    margin: 0 0 45px 0;
}
.blog-section .section__introduction {
    width: 100%;
    text-align: center;
    margin: 0 0 86px 0;
}



/* Styles minimalistes — adapte à ta charte */
.blog-grid {
    display: flex;
    justify-content: flex-start;
    gap: 60px 90px;
    flex-wrap: wrap;
}

.blog-card {
    width: calc(50% - 45px);
}

.blog-card:hover {

}

.blog-card__figure {
    aspect-ratio: 16/9;
    overflow: hidden;
    margin: 0 0 35px 0;
    border-radius: 20px;
}

.blog-card__thumb {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.blog-card__content {
    padding: 14px 16px;
}

.blog-card__title {
    margin: 0 0 36px 0;
    text-transform: uppercase;
    font-size:30px;
    color: var(--color-primary);
    font-family: 'Heavitas', sans-serif;
}

.blog-card__excerpt {
    margin: 0;
    color: #5b6673;
}

.blog-card__more {
    display: inline-block;
    margin-top: 10px;
    font-size: .95rem;
    color: #252e38;
    text-decoration: underline;

}

.section__footer {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 90px 0 0 0;
}

.button--primary[disabled] {
    opacity: .5;
    cursor: not-allowed;
}

.button--primary.hide{
    display: none;
}
@media all and (max-width: 1300px){
    .blog-grid {
        gap: 50px 70px;
    }
}

@media all and (max-width: 1000px){
    .blog-grid {
        gap: 40px 50px;
        flex-direction: column;
    }
    .blog-card {
        width: 100%;
    }
}

.section--others {
    margin: 85px 0 0 0;
    padding: 90px 0;
    background:#EDEDED;
}

.section--others  .section__title {
    width: 100%;
    text-align: center;
    margin: 0 0 76px 0;
}

.section--others .categories {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap:40px 0;
}
.section--others .category {
    width: calc(25% - 20px ) ;
    aspect-ratio:  1 / 1 ;
    overflow: hidden;
    border-radius: 25px;
}
.section--others .category .category__image{
    width: 100%;
    height: 100%;
}
.section--others .category .category__image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.section--others .category  span{
    position: absolute;
    bottom:40px;
    left:40px;
    color:var(--color-white);
    text-transform: uppercase;
    font-size:clamp(20px, 3vw, 25px);
    z-index: 15;
    font-family: 'Heavitas', sans-serif;
}
.section--others .category  span::before{
    content:'';
    display: block;
    width: 0;
    height: 26px;
    position: absolute;
    bottom:-8px;
    left:-10px;
    background: var(--color-primary);
    z-index: -1;
    border-radius: 5px;
}

.section--others  .category.active span::before { animation: spanOpen  0.5s ease forwards; }

@keyframes spanOpen {
    from {
        width: 0;
    }
    to {
        width: calc(100% + 20px);
    }
}


@media all and (max-width: 1000px){
    .section--others .category {
        width: calc(50% - 20px ) ;
    }
}

@media all and (max-width: 750px){
    .section--others .category {
        width: 100%;
        height: 300px;
    }
}