.space-xs { margin-top: var(--space-xs, .5rem) !important; margin-bottom: var(--space-xs, .5rem) !important; }
    .space-sm { margin-top: var(--space-sm, .1rem) !important; margin-bottom: var(--space-sm, .1rem) !important; }
    .space-md { margin-top: var(--space-md, 2rem) !important; margin-bottom: var(--space-md, 2rem) !important; }
    .space-lg { margin-top: var(--space-lg, 3rem) !important; margin-bottom: var(--space-lg, 3rem) !important; }
    .space-xl { margin-top: var(--space-xl, 6rem) !important; margin-bottom: var(--space-xl, 6rem) !important; }
    .space-xxl { margin-top: var(--space-xxl, 7.5rem) !important; margin-bottom: var(--space-xxl, 7.5rem) !important; }

    .space-above-xs { margin-top: var(--space-xs, .5rem) !important; }
    .space-above-sm { margin-top: var(--space-sm, .1rem) !important; }
    .space-above-md { margin-top: var(--space-md, 2rem) !important; }
    .space-above-lg { margin-top: var(--space-lg, 3rem) !important; }
    .space-above-xl { margin-top: var(--space-xl, 6rem) !important; }
    .space-above-xxl { margin-top: var(--space-xxl, 7.5rem) !important; }

    .space-below-xs { margin-bottom: var(--space-xs, .5rem) !important; }
    .space-below-sm { margin-bottom: var(--space-sm, .1rem) !important; }
    .space-below-md { margin-bottom: var(--space-md, 2rem) !important; }
    .space-below-lg { margin-bottom: var(--space-lg, 3rem) !important; }
    .space-below-xl { margin-bottom: var(--space-xl, 6rem) !important; }
    .space-below-xxl { margin-bottom: var(--space-xxl, 7.5rem) !important; }

    .pad-xs { padding-top: var(--space-xs, .5rem) !important; padding-bottom: var(--space-xs, .5rem) !important; }
    .pad-sm { padding-top: var(--space-sm, .1rem) !important; padding-bottom: var(--space-sm, .1rem) !important; }
    .pad-md { padding-top: var(--space-md, 2rem) !important; padding-bottom: var(--space-md, 2rem) !important; }
    .pad-lg { padding-top: var(--space-lg, 3rem) !important; padding-bottom: var(--space-lg, 3rem) !important; }
    .pad-xl { padding-top: var(--space-xl, 6rem) !important; padding-bottom: var(--space-xl, 6rem) !important; }
    .pad-xxl { padding-top: var(--space-xxl, 7.5rem) !important; padding-bottom: var(--space-xxl, 7.5rem) !important; }

    .pad-above-xs { padding-top: var(--space-xs, .5rem) !important; }
    .pad-above-sm { padding-top: var(--space-sm, .1rem) !important; }
    .pad-above-md { padding-top: var(--space-md, 2rem) !important; }
    .pad-above-lg { padding-top: var(--space-lg, 3rem) !important; }
    .pad-above-xl { padding-top: var(--space-xl, 6rem) !important; }
    .pad-above-xxl { padding-top: var(--space-xxl, 7.5rem) !important; }

    .pad-below-xs { padding-bottom: var(--space-xs, .5rem) !important; }
    .pad-below-sm { padding-bottom: var(--space-sm, .1rem) !important; }
    .pad-below-md { padding-bottom: var(--space-md, 2rem) !important; }
    .pad-below-lg { padding-bottom: var(--space-lg, 3rem) !important; }
    .pad-below-xl { padding-bottom: var(--space-xl, 6rem) !important; }
    .pad-below-xxl { padding-bottom: var(--space-xxl, 7.5rem) !important; }

    .gap-xs { gap: var(--space-xs, .5rem) !important; }
    .gap-sm { gap: var(--space-sm, .1rem) !important; }
    .gap-md { gap: var(--space-md, 2rem) !important; }
    .gap-lg { gap: var(--space-lg, 3rem) !important; }
    .gap-xl { gap: var(--space-xl, 6rem) !important; }

    @media (width <= 850px) {
        .space-xs { margin-top: var(--space-xs, .4rem) !important; margin-bottom: var(--space-xs, .4rem) !important; }
        .space-sm { margin-top: var(--space-sm, .7rem) !important; margin-bottom: var(--space-sm, .7rem) !important; }
        .space-md { margin-top: var(--space-md, 2rem) !important; margin-bottom: var(--space-md, 2rem) !important; }
        .space-lg { margin-top: var(--space-lg, 3rem) !important; margin-bottom: var(--space-lg, 3rem) !important; }
        .space-xl { margin-top: var(--space-xl, 4.5rem) !important; margin-bottom: var(--space-xl, 4.5rem) !important; }
        .space-xxl { margin-top: var(--space-xxl, 6.5rem) !important; margin-bottom: var(--space-xxl, 6.5rem) !important; }

        .space-above-xs { margin-top: var(--space-xs, .4rem) !important; }
        .space-above-sm { margin-top: var(--space-sm, .7rem) !important; }
        .space-above-md { margin-top: var(--space-md, 2rem) !important; }
        .space-above-lg { margin-top: var(--space-lg, 3rem) !important; }
        .space-above-xl { margin-top: var(--space-xl, 4.5rem) !important; }
        .space-above-xxl { margin-top: var(--space-xxl, 6.5rem) !important; }

        .space-below-xs { margin-bottom: var(--space-xs, .4rem) !important; }
        .space-below-sm { margin-bottom: var(--space-sm, .7rem) !important; }
        .space-below-md { margin-bottom: var(--space-md, 2rem) !important; }
        .space-below-lg { margin-bottom: var(--space-lg, 3rem) !important; }
        .space-below-xl { margin-bottom: var(--space-xl, 4.5rem) !important; }
        .space-below-xxl { margin-bottom: var(--space-xxl, 6.5rem) !important; }

        .pad-xs { padding-top: var(--space-xs, .4rem) !important; padding-bottom: var(--space-xs, .4rem) !important; }
        .pad-sm { padding-top: var(--space-sm, .7rem) !important; padding-bottom: var(--space-sm, .7rem) !important; }
        .pad-md { padding-top: var(--space-md, 2rem) !important; padding-bottom: var(--space-md, 2rem) !important; }
        .pad-lg { padding-top: var(--space-lg, 3rem) !important; padding-bottom: var(--space-lg, 3rem) !important; }
        .pad-xl { padding-top: var(--space-xl, 4.5rem) !important; padding-bottom: var(--space-xl, 4.5rem) !important; }
        .pad-xxl { padding-top: var(--space-xxl, 6.5rem) !important; padding-bottom: var(--space-xxl, 6.5rem) !important; }

        .pad-above-xs { padding-top: var(--space-xs, .4rem) !important; }
        .pad-above-sm { padding-top: var(--space-sm, .7rem) !important; }
        .pad-above-md { padding-top: var(--space-md, 2rem) !important; }
        .pad-above-lg { padding-top: var(--space-lg, 3rem) !important; }
        .pad-above-xl { padding-top: var(--space-xl, 4.5rem) !important; }
        .pad-above-xxl { padding-top: var(--space-xxl, 6.5rem) !important; }

        .pad-below-xs { padding-bottom: var(--space-xs, .4rem) !important; }
        .pad-below-sm { padding-bottom: var(--space-sm, .7rem) !important; }
        .pad-below-md { padding-bottom: var(--space-md, 2rem) !important; }
        .pad-below-lg { padding-bottom: var(--space-lg, 3rem) !important; }
        .pad-below-xl { padding-bottom: var(--space-xl, 4.5rem) !important; }
        .pad-below-xxl { padding-bottom: var(--space-xxl, 6.5rem) !important; }

        .gap-xs { gap: var(--space-xs, .5rem) !important; }
        .gap-sm { gap: var(--space-sm, .7rem) !important; }
        .gap-md { gap: var(--space-md, 2rem) !important; }
        .gap-lg { gap: var(--space-lg, 3rem) !important; }
        .gap-xl { gap: var(--space-xl, 6rem) !important; }

    }