/* Layout CSS
 * Page structure, containers, and responsive grid.
 */

.container {
  max-width: var(--container-width, 1200px);
  margin: 0 auto;
  padding: 0 var(--space-md, 16px);
}

main { flex: 1; }

.nav { position: sticky; top: 0; z-index: var(--z-sticky, 1020); }

.posts-grid { display: grid; gap: var(--space-lg, 24px); }
@media (min-width: 640px) { .posts-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (min-width: 1024px) { .posts-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }