:root {
    --ds-breakpoint-xs: 0;
    --ds-breakpoint-sm: 576px;
    --ds-breakpoint-md: 768px;
    --ds-breakpoint-lg: 992px;
    --ds-breakpoint-xl: 1200px;
    --ds-breakpoint-xxl: 1400px;

    --ds-gutter-x: 2.5rem;
    --ds-gutter-y: 0;

    --ds-header-height: var(--header-height);

    --ds-font-headings: 'Lora', serif;
    --ds-font-content: 'Roboto', sans-serif;

    --ds-section-gutters: 3.125rem;
    --ds-section-head-gap: 1.5rem;
}

@media (min-width:1200px) {
    :root {
        --ds-section-gutters: 5rem;
        --ds-section-head-gap: 5rem;
    }
}