/* 🟦 Tablet: 2 columnas */
@media (max-width: 1024px) and (min-width: 768px) {
  .gallery-grid {
    grid-template-columns: repeat(2, 1fr); /* 2 columnas */
    gap: 16px;
    padding: 30px 16px;
  }

  .top-bar{
    display: none;
  }

  .banner-container {
    width: 100%;
  }

  .wrapper
  {
  width: 100%;
  }
}

/* 🟩 Mobile: 1 columna */
@media (max-width: 767px) {
  .gallery-grid {
    grid-template-columns: 1fr; /* 1 columna */
    gap: 12px;
    padding: 20px 12px;
  }
  .top-bar{
    display: none;
  }
  .banner-container {
    width: 100%;
  }
  .wrapper
  {
  width: 100%;
  }

}