:root {
    /*
     * Core spacing scale
     *
     * The campaign site deliberately uses generous spacing.
     * These values are shared by components, sections, forms,
     * cards, navigation, and responsive layouts.
     */

    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 2.75rem;
    --space-8: 3.5rem;
    --space-9: 5rem;
    --space-10: 6.5rem;
}


/*
 * Mobile spacing
 *
 * Preserve the hierarchy while reducing the largest section
 * intervals enough for smaller screens.
 */

@media (max-width: 48rem) {
    :root {
        --space-7: 2.5rem;
        --space-8: 3rem;
        --space-9: 4rem;
        --space-10: 5rem;
    }
}