.carousel-cell {

  width: 100%;

  display: flex;

}



.carousel-cell .banner-item img {

  max-width: 100%;

}





#banners-bottom-container {

  position: relative;

}

.banners-bottom {

  position: fixed;

  bottom: 0;

  left: 50%;

  transform: translateX(-50%);

  max-width: 1400px;

  width: 100%;

  z-index: 9999;

  background: transparent; 

  padding: 0; 

}



.banners-bottom-grid {

  display: grid;

  grid-template-columns: repeat(2, 1fr); 

}



.banners-bottom-grid a img {

  width: 100%;

  height: auto;

}





@media (max-width: 768px) {

  .banners-bottom-grid {

    grid-template-columns: 1fr; 

  }

}



#open-banner-bottom {

  position: fixed;

  bottom: 20px;

  left: 10px;

  background: red;

  color: white;

  border: none;

  align-items: center;

  justify-content: center;

  font-size: 14px;

  line-height: 1;

  cursor: pointer;

  padding: 5px;

}



#close-banner-bottom {

  position: absolute;

  top: -24px;

  left: 0;

  background: red;

  color: white;

  border: none;

  display: flex;

  align-items: center; 

  justify-content: center; 

  font-size: 14px; 

  line-height: 1; 

  cursor: pointer;

  padding: 5px;

}



a.btn {

  display: inline-block; 

  padding: 12px 24px; 

  font-size: 16px; 

  font-weight: bold; 

  color: white; 

  text-decoration: none; 

  text-align: center; 

  background: #c9aa71; 

  border: none; 

  border-radius: 8px; 

  transition: all 0.3s ease;

  cursor: pointer; 

}



a.btn:hover {

  background: #af9463; 

  transform: translateY(-2px); 

  box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.3);

}



a.btn:active {

  transform: translateY(2px); 

  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); 

}