.container {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding);
}
.page {
    padding-top: 80px;
}
.section {
    padding: var(--spacing-4xl) 0;
}

.section--sm {
    padding: var(--spacing-3xl) 0;
}

.section--lg {
    padding: var(--spacing-5xl) 0;
}
.grid {
    display: grid;
    gap: var(--spacing-xl);
}

.grid--2 {
    grid-template-columns: repeat(2, 1fr);
}

.grid--3 {
    grid-template-columns: repeat(3, 1fr);
}

.grid--4 {
    grid-template-columns: repeat(4, 1fr);
}

.grid--auto {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.flex {
    display: flex;
}

.flex--center {
    justify-content: center;
    align-items: center;
}

.flex--between {
    justify-content: space-between;
    align-items: center;
}

.flex--column {
    flex-direction: column;
}

.flex--wrap {
    flex-wrap: wrap;
}
.gap-1 { gap: var(--spacing-md); }
.gap-2 { gap: var(--spacing-xl); }
.gap-3 { gap: var(--spacing-2xl); }