/* Full HD 1920x1080 */
@media (min-width: 1472px) {
  .item-gift .img {
    position: relative;
    right: 8%;
  }
  .step-order {
    gap: 150px;
  }
}

@media (max-width: 1439px) {
  .herobanner .logo-brand {
    height: calc(32px + 16px);
  }
}

@media (max-width: 1279px) {
  .herobanner .grid-product {
    grid-template-columns: 1fr;
  }
  .herobanner-highlight {
    min-height: 360px;
  }
  .herobanner .product img {
    max-width: 72px;
  }
  .herobanner .product .txt {
    margin-top: 4px;
  }
  .herobanner .logo-brand {
    padding: 4px 8px;
  }
  .herobanner-highlight .txt h1 {
    font-size: 32px;
  }
  .herobanner-highlight .txt h2 {
    font-size: 14px;
  }
  .herobanner-highlight .txt {
    padding-left: 32px;
  }
  .herobanner .logo-brand {
    height: calc(24px + 16px);
  }


  .item-gift {
    grid-template-columns: 1fr minmax(100px, 320px);
  }

  .step-order { 
    padding: 0 2%;
  }
  
.swiper-popular {
  overflow: visible;
}

.find-tag {margin-top: 24px;}
.find-item .txt {
  font-size: 14px;
}
.grid-find {
  gap: 16px;
}
}

@media (max-width: 1199px) {
  .item-gift h2 {
    font-size: 20px;
  }
  .item-gift h3 {
    font-size: 14px;
  }
  .item-gift {
    grid-template-columns: 1fr minmax(100px, 60%);
  }

  .item-gift .txt {
    align-self: center;
  }

  .step-order {
    gap: 30px;
  }
  .step-order .step:not(:nth-last-child(1)):before {
    width: 150%;
  }

  .products-popular .img {
    max-width: 128px;
  }
  .products-popular img {
    max-width: 65%;
  }
  .products-popular .txt h2 {
    font-size: 12px;
  }

  .send-gift {
    grid-template-columns: auto 100px;
  }

  .img-banner-product .txt {
    padding: 24px;
  }
  .img-banner-product .txt h2 {
    font-size: 26px;
  }
}

@media (max-width: 1023px) {
  .herobanner-inner {
    grid-template-columns: 1fr;
  }
  .category-lists ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }

  .category-lists ul li:nth-child(odd) {
    border-right: 1px solid #ececec;
  }

  .item-gift .txt {
    padding: 0 8px 0 32px;
}

  .shortcut {
    padding: 24px 0;
  }
  .item-gift h2 {
    font-size: 24px;
  }
  .item-gift h3 {
    font-size: 16px;
  }

  .grid-find {
    grid-template-columns: 1fr;
  }

.find-item .img {
  aspect-ratio: 1/1.25;
}
.find-item {
  border-radius: 14px;
}

.img-banner-product {
  aspect-ratio: 1/0.48;
}

}

@media (max-width: 991px) {
  .step-order {
    flex-direction: column;
    gap:0;
    max-width: 640px;
    margin: 0 auto;
  }
  .step-order .step:not(:nth-last-child(1)):before {
    width: 2px;
    height: 100%;
    left:50px;
    top:24px;
  }
  .step-order .step {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap:32px;
    padding: 24px 0;
  }
  .step-order .step .icon {
    flex:0 0 100px;
    align-self: flex-start;
  }

  .item-popular {
    padding: 20px;
  }
  .item-popular .banner .txt {
    bottom:16px;
    left:16px;
  }
  .products-popular .img {
    max-width: 100px;
  }
}

@media (max-width: 767px) {

}

@media (max-width: 639px) {
  .herobanner-inner {
    margin: 0 -16px;
    border-radius: 0;
  }

  .herobanner-highlight {
    border-radius: 0;
    aspect-ratio: 16/10;
    min-height: 280px;
  }

  .herobanner .product {
    padding: 8px 4px 12px;
  }

  .herobanner .product .txt {
    font-size: 10px;
  }

  .herobanner .product img {
    max-width: 64px;
  }

  .category-lists ul {
    grid-template-columns: repeat(1, 1fr);
  }
  .category-lists ul li:nth-child(odd) {
    border-right: none;
  }

  .category-side {
    padding: 0 20px;
    margin-top: 32px;
    border-radius: 20px;
    height: fit-content;
  }

  .category-head {
    padding: 20px 0;
    gap: 12px;
  }

  .category-lists ul li a {
    padding: 12px 0;
    gap: 12px;
  }

  .category-more {
    padding: 24px 0;
  }
  .category-lists ul li a:hover {
    background-color: #fff;
  }

  .shortcut .swiper-button-next,
  .shortcut .swiper-button-prev {
    width: 65px;
  }

  .shortcut .swiper-slide {
    width: fit-content;
  }

  .shortcut a {
    border-radius: 8px;
    width: 142px;
    height: 38px;
  }
  .shortcut {
    padding: 20px 0;
  }

  .shortcut .swiper-button-next {
    background: linear-gradient(
      90deg,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 1) 100%
    );
  }
  .shortcut .swiper-button-prev {
    background: linear-gradient(
      270deg,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 1) 100%
    );
  }

  .herobanner-highlight .txt h1 {
    font-size: 22px;
  }
  .herobanner-highlight .txt {
    padding-left: 24px;
  }
  .herobanner-highlight .txt h2 {
    max-width: 165px;
  }

  .btn-type1 {
    padding: 6px 32px 8px 20px;
    background-size: 6px;
  }

  .shortcut a:before {
    opacity: 0.65;
  }

  .herobanner {
    padding-bottom: 45px;
  }


  .item-seller .txt h2 {
    font-size: 12px;
  }

  .label-seller {
    font-size: 10px;
    padding: 2px 8px;
    border-radius: 8px 8px 0 0;
  }

  .item-seller .txt .price {
    padding: 4px 8px;
  }

  .accordion-faq .item .heading {
    padding-left: 16px;
    background-size: 16px;
    font-size: 16px;
  }
  .accordion-faq .item.open .heading {
    background-size: 16px;
  }
  .accordion-faq .item .content {
    padding: 0 16px 16px;
  }

  .accordion-faq .item {border-radius: 12px;}
  .accordion-faq .item .content {
    font-size: 12px;
  }

  .img-idea {
    border-width: 4px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 0px 8px rgba(0 0 0 / 10%);
  } 

  .step-order .step .icon {
    flex: 0 0 80px;
    width: auto;
  }
  .step-order .step .icon img {
    width: 40px;
  }
  .step-order .step:not(:nth-last-child(1)):before {
    left:40px;
  }

  .find-tag li a {
    font-size: 14px;
    padding: 8px 12px;
  }
  .find-tag {
    margin-top: 12px;
    gap: 8px;
  }

  .article-details .item {
    grid-template-columns: 125px auto;
  }
  .article-details .item .txt h2 {
    font-size: 14px;
  }
  .testimonial-item p {
    font-size: 14px;
  }
  .send-gift {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr auto;
}
.wrap-input {
  margin-top: 20px;
}
.send-gift .img {
  margin-bottom: -20%;
  max-width: 40%;
  margin-left: auto;
  margin-top: 2%;
  margin-right: -5%;
}
.send-gift .img img {
  max-width: 100%;
  position: static;
}

.btn-shopbybrand .btn-type1 {
  font-size: 16px;
  height: 48px;
  display: flex;
  align-items: center;
}

.btn-step .btn-type1 {
  font-size: 16px;
  height: 48px;
  display: flex;
  align-items: center;
}

.btn-idea .btn-type1 {
  font-size: 16px;
  height: 48px;
  display: flex;
  align-items: center;
}

.img-banner-product {
  aspect-ratio: auto;
}

.img-banner-product .txt h2 {
  font-size: 24px;
}
.img-banner-product .txt p {
  font-size: 14px;
}
}







@media(max-width:575px){
  .item-gift .txt {
    padding: 0 4px 0 16px;
}
.item-gift h2 {
  font-size: 16px;
}
.item-gift h3 {
  font-size: 12px;
  margin-top: 8px;
}
/* .item-gift {
  grid-template-columns: 1fr minmax(100px, 50%);
} */

.item-gift {
  padding: 12px 0;
}

.step-order {
  padding: 0;
}

.step-order .step {
  gap: 16px;
}

.step-order .detail p {
  text-wrap: balance;
}

.step-order .step {
  padding: 16px 0;
}
.step-order .step:not(:nth-last-child(1)):before {
  top:16px;
}

.products-popular {
  margin-top: 20px;
}

.item-popular {
  border-radius: 16px;
}

.shortcut {
  padding: 16px 0;
}

}




@media(max-width:413px){
  .item-seller .txt {
    padding: 12px;
  }
}



@media (max-width: 374px) {
  .herobanner .product img {
    max-width: 56px;
  }
  .shortcut a {
    font-size: 12px;
  }
  .shortcut .swiper-button-next,
  .shortcut .swiper-button-prev {
    width: 45px;
  }

  .article-details .item {
    gap: 12px;
  }

  .testimonial-item {
    padding: 32px 20px;
  }
  .send-gift {
    padding: 20px;
  }

  .control-testimonial {
    gap: 6px;
  }
  .control-testimonial > div {
    width: 36px;
    height: 36px;
  }
}
