/* =========================================================
   LAYOUT — контейнер, секции, сетка
   ========================================================= */
.container {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-gutter);
}

.section {
  padding-block: var(--section-padding);
}

.section--no-top {
  padding-top: 0;
}

.section--no-bottom {
  padding-bottom: 0;
}

/* Простая адаптивная сетка: 1 колонка на мобильных, N колонок с 768px */
.grid {
  display: grid;
  gap: var(--space-lg);
  grid-template-columns: 1fr;
}

@media (min-width: 768px) {
  .grid--2 { grid-template-columns: repeat(2, 1fr); }
  .grid--3 { grid-template-columns: repeat(3, 1fr); }
}