/* ==========================================================================
   DOBRA DEPOIMENTOS — Cards em grid 3 colunas
   Estrutura: .view-hm2-lp-depoimentos > .view-content > .views-view-responsive-grid
              > __item > __item-inner > .views-field-*
   Layout do card: texto (topo, largura total) / foto (esq) + nome e cargo (dir)
   ========================================================================== */

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

/* 2. Grid de cards: 3 colunas, gap 28px */
body:not(.path-admin) .view-hm2-lp-depoimentos .views-view-responsive-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  grid-auto-rows: 1fr !important;
  gap: 28px !important;
  align-items: stretch !important;
}

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

/* 3. Item: ocupa toda a altura */
body:not(.path-admin) .view-hm2-lp-depoimentos .views-view-responsive-grid__item {
  display: flex !important;
}

/* 4. Card: CSS Grid interno — texto na linha superior (largura total),
        foto à esquerda + nome/cargo empilhados à direita na linha inferior */
body:not(.path-admin) .view-hm2-lp-depoimentos .views-view-responsive-grid__item-inner {
  background-color: var(--hm2-on-surface-card-bg, #ffffff) !important;
  border: 1px solid var(--hm2-on-surface-card-border, #e5e7eb) !important;
  padding: 36px 28px 28px !important;
  display: grid !important;
  grid-template-columns: 56px 1fr !important;
  grid-template-rows: 1fr auto auto !important;
  grid-template-areas: "texto texto" "foto  autor" "foto  cargo" !important;
  column-gap: 14px !important;
  width: 100% !important;
  min-height: 260px !important;
  border-radius: var(--hm2-border-radius-card, 0px) !important;
  overflow: hidden !important;
}

/* 5. Texto do Depoimento: linha superior, largura total, separador embaixo */
body:not(.path-admin) .view-hm2-lp-depoimentos .views-field-field-depoimento-texto {
  grid-area: texto !important;
  margin-bottom: 20px !important;
  padding-bottom: 18px !important;
  border-bottom: 1px solid var(--hm2-on-surface-divider, #e2e8f0) !important;
}

body:not(.path-admin) .view-hm2-lp-depoimentos .views-field-field-depoimento-texto .field-content {
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 1.05rem !important;
  font-style: italic !important;
  line-height: 1.7 !important;
  color: var(--hm2-on-surface, #374151) !important;
}

body:not(.path-admin) .view-hm2-lp-depoimentos .views-field-field-depoimento-texto .field-content::before {
  content: '\201C' !important;
  font-size: 2.5rem !important;
  line-height: 0 !important;
  vertical-align: -0.6rem !important;
  color: var(--hm2-on-surface-accent, #9d7b53) !important;
  margin-right: 3px !important;
  font-style: normal !important;
}

/* 6. Foto: coluna esquerda, span nas 2 linhas do rodapé, circular */
body:not(.path-admin) .view-hm2-lp-depoimentos .views-field-field-depoimento-foto {
  grid-area: foto !important;
  align-self: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

body:not(.path-admin) .view-hm2-lp-depoimentos .views-field-field-depoimento-foto img {
  width: 52px !important;
  height: 52px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  display: block !important;
}

/* 7. Nome do Autor: coluna direita, linha 2, alinhado à base */
body:not(.path-admin) .view-hm2-lp-depoimentos .views-field-field-depoimento-autor {
  grid-area: autor !important;
  align-self: end !important;
  padding-top: 0 !important;
  border-top: none !important;
  margin-top: 0 !important;
}

body:not(.path-admin) .view-hm2-lp-depoimentos .views-field-field-depoimento-autor .field-content {
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  font-style: normal !important;
  color: var(--hm2-on-surface, #111827) !important;
  line-height: 1.3 !important;
}

/* 8. Cargo / Empresa: coluna direita, linha 3, alinhado ao topo */
body:not(.path-admin) .view-hm2-lp-depoimentos .views-field-field-depoimento-cargo {
  grid-area: cargo !important;
  align-self: start !important;
  margin-top: 3px !important;
}

body:not(.path-admin) .view-hm2-lp-depoimentos .views-field-field-depoimento-cargo .field-content {
  font-size: 0.78rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.09em !important;
  color: var(--hm2-on-surface-cargo, #9d7b53) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
}

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