@media (min-width: 769px) and (max-width: 991px) {
	
}
@media (max-width: 991px) {
	.hero-banner {
    flex-direction: column;
    padding: 40px 20px;
    text-align: center;
  }
  .yellow-swirl {
    display: none;
  }
  .discount-badge {
    position: relative;
    right: auto;
    top: auto;
    transform: rotate(0deg);
    margin-top: 20px;
  }
	

	  .site-gallery-box {
	    padding: 24px 18px;
	  }

	  .site-gallery-title h2 {
	    font-size: 38px;
	    text-align: center;
	  }

	  .gallery-item {
	    width: 180px;
	    height: 130px;
	  }

	  .gallery-list {
	    gap: 20px;
	    padding-right: 20px;
	  }
}