@media (max-width: 320px) {
  .block-category h1 {
    padding: 1em 0 0 !important;
  }

  .category-description {
    display: none;
  }
}
@media (min-width: 321px) and (max-width: 380px) {
  .block-category h1 {
    padding: 1em 0 0 !important;
  }
}

/*
  Mobile : la description est dynamique, on ne peut pas figer la hauteur du visuel.
  category.js applique --cat-bg-height = hauteur de #js-product-list-header + --cat-bg-extra.
  --cat-bg-min-height doit rester à 0 sinon le max() de category.css reprend la main.
  Borné à 767px : à 768px le bloc tablette ci-dessous s'applique aussi.
*/
@media (max-width: 767px) {
  #js-product-list-header {
    --cat-bg-extra      : 60px;
    --cat-bg-min-height : 0px;
    --cat-header-margin : 15px;
  }
}

@media (max-width: 768px) {
  .block-category h1 {
    font-size : 30px;
    margin-top: 50px;
  }

  body#category .accordion-header {
    font-size: 18px;
  }

  .before-footer-category-container {
    bottom: 0;
    top: unset;
    width: 100%;
    transform: unset;
    left: 0;
  }

  .part_inner .param {
    font-size: 15px;
  }

  body#category .accordion-header {
    border-top: 1px solid #fff;
  }

  .category-description {
    width: 95%;
  }

  body#category .wrapper__inner {
    margin-top: 15px;
  }
}

/*@media (min-width: 768px) and (max-width: 1023px) {*/
/*  .bg-single-line-category img {*/
/*    height: 415px !important;*/
/*  }*/
/*}*/

@media (max-width: 500px) {
  .subcategory__image img {
    height: 50px;
    width: 50px;
  }
}

@media (max-width: 1199px) {

}

@media (min-width: 768px) and (max-width: 1199px) {
  /*.bg-single-line-category img {*/
  /*  height: 455px;*/
  /*}*/
  #js-product-list-header {
    margin-top: 70px;
  }

  .block-subcategory {
    width: 90%;
  }
}