/* ============================================
   LA TOUCHE K — PAGE NOS PROJETS (TEMPLATE)
   Fichier : ltk-pg-projets.css
   Niveau 1 : CORE
   ============================================ */

/* Filtres */
.ltk-pg-projets-filters {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  gap: var(--ltk-core-space-sm);
  margin-bottom: var(--ltk-core-space-lg);
}

/* Les wrappers générés par le Query Loop ne doivent pas casser le flex */
.ltk-pg-projets-filters > div {
  display: contents;
}

.ltk-pg-projets-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* desktop */
  gap: var(--ltk-core-space-lg);
}

/**
* RESPONSIVE
**/
@media (max-width: 1024px) {
  .ltk-pg-projets-grid {
    grid-template-columns: repeat(2, 1fr); /* tablette : entre-deux logique */
  }
}

@media (max-width: 768px) {
  .ltk-pg-projets-grid {
    grid-template-columns: 1fr; /* mobile : 1 colonne */
  }
  .ltk-pg-projets-filters {
    gap: var(--ltk-core-space-md);
  }
}