/* ================================
   list-page.css (geral)
   objetivo: dar respiro vertical entre a grid de cards e o footer
   funciona para: locais, servicos, blog, categorias, setores
   ================================ */

:root {
  /* ajuste fino global (padrão elegante e consistente) */
  --list-page-pad-y: clamp(28px, 4vw, 56px);
  --list-page-gap: clamp(14px, 2vw, 22px);

  /* >>> principal: espaço antes do footer <<< */
  --list-page-footer-gap: clamp(36px, 6vw, 84px);

  /* opcional: largura "confortável" para header/pagination */
  --list-page-max: 1180px;
}

/* container geral da página de listagem */
.list-page {
  position: relative;
  padding: var(--list-page-pad-y) 0;
}

/* head da listagem (h1/sub) */
.list-head {
  max-width: var(--list-page-max);
  margin: 0 auto clamp(18px, 3vw, 28px);
  padding: 0 16px;
}

.list-head__title {
  margin: 0;
}

/* grid de cards (atua com qualquer classe que tu esteja usando) */
.u-cards-grid,
.u-cards__grid,
.cards-grid,
.blog-grid {
  max-width: var(--list-page-max);
  margin: 0 auto;
  padding: 0 16px;

  display: grid;
  gap: var(--list-page-gap);
}

/* espaçamento entre cards e o que vem depois (pagination, extras, footer) */
.u-cards-grid,
.u-cards__grid,
.cards-grid,
.blog-grid {
  margin-bottom: var(--list-page-footer-gap);
}

/* responsivo: colunas automáticas */
.u-cards-grid,
.u-cards__grid,
.cards-grid,
.blog-grid {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

@media (min-width: 640px) {
  .u-cards-grid,
  .u-cards__grid,
  .cards-grid,
  .blog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 980px) {
  .u-cards-grid,
  .u-cards__grid,
  .cards-grid,
  .blog-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1240px) {
  /* se quiser 4 colunas em telas grandes */
  .list-page--cities .u-cards__grid,
  .list-page--services .u-cards__grid,
  .list-page--categories .u-cards__grid,
  .list-page--sectors .u-cards__grid,
  .list-page .u-cards-grid,
  .list-page .cards-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* pagination alinhada e com respiro extra antes do footer */
.pager,
.blog-pagination,
.container-slim {
  max-width: var(--list-page-max);
  margin: -20px auto var(--list-page-footer-gap);
  padding: 0 16px;
}

/* quando não tiver cards e aparecer .empty */
.list-page .empty {
  max-width: var(--list-page-max);
  margin: 0 auto var(--list-page-footer-gap);
  padding: 0 16px;
  opacity: 0.8;
}

/* fallback: se teu footer encostar por qualquer markup fora do padrão */
.site-footer {
  margin-top: 0; /* deixa o espaçamento controlado pela listagem */
}

/* opcional: se existir seção extra full-bleed após os cards,
   reduza o "duplo espaçamento" */
.full-bleed.blog-extra {
  margin-top: calc(var(--list-page-footer-gap) * -0.65);
  padding-top: clamp(20px, 4vw, 44px);
}

/* Quando não houver imagem, o card fica mais compacto e equilibrado */
.u-card--noimg .u-card__body {
  padding-top: clamp(14px, 2vw, 18px);
}

/* Opcional: uma “barra” de identidade visual sem carregar imagens */
.u-card--noimg .u-card__link::before {
  content: "";
  display: block;
  height: 8px;
  border-radius: 999px;
  background: var(--g-brand, linear-gradient(90deg, #2f6bff, #ff6a8a));
  opacity: 0.9;
  margin: 14px 16px 0;
}