.actusP {
  display: flex;
  flex-direction: column;
  gap: 5vw;
  padding-block: 9.5vw 19vw;
}
.actusP__container {
  display: flex;
  flex-direction: column;
  gap: 5vw;
}

@media (min-width: 991.98px) {
  .actusP {
    gap: 3.5vw;
    padding-block: 6vw 8vw;
  }
  .actusP__container {
    display: grid;
    gap: 1.5vw;
    grid-template-columns: 1fr 1fr 1fr;
  }
  .actusP__container > .vignette {
    width: 25.5vw;
  }
  .actusP > .title {
    font-size: var(--fsTitleH3);
    line-height: 1.875rem;
  }
}

@media (min-width: 1199.98px) {
  .actusP {
    gap: 2.5vw;
    padding-block: 5vw 7vw;
  }
}
@media (min-width: 1399.98px) {
  .actusP__container > .vignette {
    width: 22vw;
  }
  .actusP--archive .actusP__container > .vignette {
    width: 100%;
  }
  .actusP--archive .actusP__container {
    gap: 2.5vw 1vw;
  }
}

@media (min-width: 1599.98px) {
  .actusP--archive {
    padding-block: 3.5vw 5.5vw;
  }
}

@media (min-width: 1919.98px) {
  .actusP:not(.actusP--archive) {
    padding-bottom: 10vw;
  }
  .actusP__container > .vignette {
    width: 20.5vw;
  }
  .actusP--archive {
    gap: 2vw;
    padding-block: 2.5vw 5.5vw;
  }
  .actusP--archive .actusP__container {
    gap: 1.75vw 1vw;
  }
}
