/* ── Site main (offset for fixed header) ── */
.site-main {
    padding-top: var(--header-h);
}

/* ── Container ── */
.container {
    width: 100%;
    max-width: var(--max-w);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--s-24);
    padding-right: var(--s-24);
}

/* ── Section spacing ── */
.section {
    padding: var(--s-80) 0;
}

.section--sm {
    padding: var(--s-48) 0;
}

/* ── Grid helpers ── */
.grid {
    display: grid;
    gap: var(--s-24);
}

.grid--2 {
    grid-template-columns: 1fr 1fr;
}

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

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

.grid--55-45 {
    grid-template-columns: 55fr 45fr;
    gap: var(--s-48);
    align-items: start;
}

.grid--60-40 {
    grid-template-columns: 60fr 40fr;
    gap: var(--s-48);
    align-items: start;
}

/* ── Editorial prose ── */
.editorial-prose {
    max-width: 780px;
    margin-left: auto;
    margin-right: auto;
}

/* ── Centred section ── */
.section-header {
    text-align: center;
    margin-bottom: var(--s-48);
}

.section-header h2 {
    margin-bottom: var(--s-16);
}

.section-header p {
    color: var(--c-text-dim);
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
}

/* ── Two-CTA row ── */
.cta-row {
    display: flex;
    gap: var(--s-16);
    flex-wrap: wrap;
    margin-top: var(--s-32);
}

.cta-row--center {
    justify-content: center;
}