.container { width: min(calc(100% - 2rem), var(--container)); margin-inline: auto; }
.section { padding-block: var(--section-space); }
.section--alt { background: var(--color-background-alt); }
.section__head { max-width: 47rem; margin-bottom: clamp(2rem, 5vw, 4rem); }
.section__eyebrow { display: inline-flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-4); color: var(--color-accent-700); font-size: var(--font-size-sm); font-weight: 800; letter-spacing: var(--tracking-label); text-transform: uppercase; }
.section__eyebrow::before { width: 2rem; height: 2px; background: currentColor; content: ""; }
.section__title { margin-bottom: var(--space-5); }
.section__intro { max-width: 43rem; color: var(--color-muted); font-size: var(--font-size-md); }
.grid { display: grid; gap: var(--space-6); }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 900px) { .grid--2,.grid--3 { grid-template-columns: 1fr; } }
@media (min-width: 768px) { .container { width: min(calc(100% - 4rem), var(--container)); } }