@media (max-width: 280px) {
    main .slide-image-card {
        block-size: 100px;
      }
    .category .list-view {
      justify-content: center;
      display: block;
      gap: 1rem;
      grid-template-columns: repeat(2, minmax(100px, 1fr));
  .item{
    inline-size: 100%;
  }
    }
  }

/* Extra small devices (phones, less than 576px) */
@media (max-width: 575.98px) {
  
  .category .list-view {
    justify-content: center;
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));

    .item {
      /* align-self: start; */
    }
  }
  .category .list-view .item{
    width: 100%;
    
  }
  
  .lineup{
    .flex{
      
      .item{
        width: 80%;
        /* height: 285px; */
        overflow: hidden;
        text-align: center;
        img{
          max-height: 100%;
          height: 130px;
          width: unset;
          border-radius: 10px;
        }
        
        
      }
    }
  }
}

/* Small devices (phones, 576px and up) */
@media (min-width: 576px) {
  main .slide-image-card {
    block-size: 300px;
  }

  .category .list-view {
    display: grid;
    gap: clamp(1rem, 2vw, 3rem);
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));

  }
  
  
}




/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    
  .category .list-view {
    display: grid;
    gap: clamp(1rem, 2vw, 3rem);
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));

  }
  
  section.video{
    .box{
      display: flex;
      gap: clamp(1rem, 2vw, 3rem);
      
      video{
        inline-size: 50%;
      }
      .content{
        margin: auto;
        width: fit-content;
        height: fit-content;
      }
    }
    .box.orange, .box.gray{
      flex-flow: row-reverse;
    }
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  .category .list-view {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));


    .item {
      /* align-self: start; */
      inline-size: 200px;
      block-size: 160px;
    }
  }
  main .slide-image-card {
    block-size: 70vh;
  }

  section.deals{
    .list-view{
        .item{
            max-inline-size: unset;
            inline-size: 290px;
        }
    }
  }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-inline-size: 1200px) {
    main .slide-image-card {
        block-size: 70vh;
      }
}

/* Extra extra large devices (very large screens, 1400px and up) */
@media (min-inline-size: 1400px) {
  /* Your styles here */
}