/* ==========================================================================
   DOBRA GALERIA — Grid de fotos 3 colunas (grid_responsive)
   Estrutura: .view-hm2-lp-galeria > .view-content > .views-view-responsive-grid
              > .views-view-responsive-grid__item > .views-view-responsive-grid__item-inner
   Campos: views-field-field-foto-imagem, views-field-field-foto-legenda
   ========================================================================== */

/* 1. Remove fundo/sombra do bloco de views */
body:not(.path-admin) .view-hm2-lp-galeria {
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
  padding: 0 !important;
}

/* 2. Grid de 3 colunas — sobrepõe inline-style do plugin */
body:not(.path-admin) .view-hm2-lp-galeria .views-view-responsive-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 12px !important;
}

@media (max-width: 767px) {
  body:not(.path-admin) .view-hm2-lp-galeria .views-view-responsive-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
}

/* 3. Item: overflow hidden para conter o zoom */
body:not(.path-admin) .view-hm2-lp-galeria .views-view-responsive-grid__item {
  overflow: hidden !important;
}

/* 4. Inner: remove padding herdado do plugin */
body:not(.path-admin) .view-hm2-lp-galeria .views-view-responsive-grid__item-inner {
  background-color: #f3f4f6 !important;
  position: relative !important;
  padding: 0 !important;
}

/* 5. Imagem: proporção quadrada, cover, hover zoom */
body:not(.path-admin) .view-hm2-lp-galeria .views-field-field-foto-imagem img {
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.35s ease !important;
}

body:not(.path-admin) .view-hm2-lp-galeria .views-view-responsive-grid__item:hover img {
  transform: scale(1.06) !important;
}

/* 6. Legenda discreta abaixo da foto */
body:not(.path-admin) .view-hm2-lp-galeria .views-field-field-foto-legenda {
  padding: 8px 6px 4px !important;
  font-size: 0.78rem !important;
  color: #6b7280 !important;
  line-height: 1.3 !important;
  text-align: center !important;
}

/* 7. Paginação centralizada */
body:not(.path-admin) .view-hm2-lp-galeria .pager {
  margin-top: 28px !important;
  display: flex !important;
  justify-content: center !important;
}
