/*
 * Utilities - Hygienize Child
 *
 * Um conjunto minimo de classes utilitarias (nao um clone do
 * Tailwind): apenas o necessario para montar as futuras secoes da
 * Home e das paginas internas sem repetir CSS. Todas prefixadas
 * "hyg-" para nao colidir com as classes "ct-" do Blocksy.
 */

/* Container */
.hyg-container {
  width: 100%;
  max-width: var(--hyg-container-max-width);
  margin-inline: auto;
  padding-inline: var(--hyg-container-padding);
}

/* Grid (mobile first: 1 coluna por padrao) */
.hyg-grid {
  display: grid;
  gap: var(--hyg-space-5);
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .hyg-grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
  .hyg-grid--cols-3 { grid-template-columns: repeat(2, 1fr); }
  .hyg-grid--cols-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 992px) {
  .hyg-grid--cols-3 { grid-template-columns: repeat(3, 1fr); }
  .hyg-grid--cols-4 { grid-template-columns: repeat(4, 1fr); }
}

/* Flex */
.hyg-flex { display: flex; }
.hyg-flex--column { flex-direction: column; }
.hyg-flex--wrap { flex-wrap: wrap; }
.hyg-items-center { align-items: center; }
.hyg-items-start { align-items: flex-start; }
.hyg-justify-center { justify-content: center; }
.hyg-justify-between { justify-content: space-between; }

/* Gap */
.hyg-gap-1 { gap: var(--hyg-space-1); }
.hyg-gap-2 { gap: var(--hyg-space-2); }
.hyg-gap-3 { gap: var(--hyg-space-3); }
.hyg-gap-4 { gap: var(--hyg-space-4); }
.hyg-gap-5 { gap: var(--hyg-space-5); }
.hyg-gap-6 { gap: var(--hyg-space-6); }

/* Margin / Padding (escala igual ao gap) */
.hyg-mt-0 { margin-top: 0; }
.hyg-mt-1 { margin-top: var(--hyg-space-1); }
.hyg-mt-2 { margin-top: var(--hyg-space-2); }
.hyg-mt-3 { margin-top: var(--hyg-space-3); }
.hyg-mt-4 { margin-top: var(--hyg-space-4); }
.hyg-mt-5 { margin-top: var(--hyg-space-5); }
.hyg-mt-6 { margin-top: var(--hyg-space-6); }

.hyg-mb-0 { margin-bottom: 0; }
.hyg-mb-1 { margin-bottom: var(--hyg-space-1); }
.hyg-mb-2 { margin-bottom: var(--hyg-space-2); }
.hyg-mb-3 { margin-bottom: var(--hyg-space-3); }
.hyg-mb-4 { margin-bottom: var(--hyg-space-4); }
.hyg-mb-5 { margin-bottom: var(--hyg-space-5); }
.hyg-mb-6 { margin-bottom: var(--hyg-space-6); }

.hyg-mx-auto { margin-inline: auto; }

.hyg-p-0 { padding: 0; }
.hyg-p-1 { padding: var(--hyg-space-1); }
.hyg-p-2 { padding: var(--hyg-space-2); }
.hyg-p-3 { padding: var(--hyg-space-3); }
.hyg-p-4 { padding: var(--hyg-space-4); }
.hyg-p-5 { padding: var(--hyg-space-5); }
.hyg-p-6 { padding: var(--hyg-space-6); }

/* Text align */
.hyg-text-left { text-align: left; }
.hyg-text-center { text-align: center; }
.hyg-text-right { text-align: right; }

/* Display (mobile first) */
.hyg-d-none { display: none; }
.hyg-d-block { display: block; }
.hyg-d-inline-block { display: inline-block; }
.hyg-d-flex { display: flex; }
.hyg-d-grid { display: grid; }

@media (min-width: 768px) {
  .hyg-d-md-none { display: none; }
  .hyg-d-md-block { display: block; }
  .hyg-d-md-flex { display: flex; }
}
@media (min-width: 992px) {
  .hyg-d-lg-none { display: none; }
  .hyg-d-lg-block { display: block; }
  .hyg-d-lg-flex { display: flex; }
}
