:root {
    --colorwhite: #fff;
    --color-black: #000;
    --color-gray-100: #f8f9fa;
    --color-gray-200: #e9ecef;
    --color-gray-300: #dee2e6;
    --color-gray-400: #ced4da;
    --color-gray-500: #adb5bd;
    --color-gray-600: #6c757d;
    --color-gray-700: #54565b;
    --color-gray-800: #343a40;
    --color-gray-900: #212529;
    --color-beige: #edebe7;
    --color-military: #929a92;
    --color-salmon: #eee1d2;
    --color-gold: #ab9974;
    --color-warmbeige: #eee1d0;
    --color-anthracite: #54565b;
    --color-sand: #fbfaf6;
    --color-accent: var(--color-salmon);
    --color-primary: var(--color-military);
    --color-secondary: var(--color-gray-700);
    --color-success: var(--color-green);
    --color-info: var(--color-cyan);
    --color-warning: var(--color-yellow);
    --color-danger: var(--color-red);
    --color-light: var(--color-gray-100);
    --color-dark: var(--color-gray-800);
    --color-primary-100: #f4f5f3;
    --color-primary-200: #e1e4df;
    --color-primary-300: #cdd4ca;
    --color-primary-400: #bac4b6;
    --color-primary-500: #929a92;
    --color-primary-600: #767e76;
    --color-primary-700: #5a625b;
    --color-primary-800: #3d453f;
    --color-primary-900: #212923;
    --color-accent-100: #faf5ed;
    --color-accent-200: #f5eadb;
    --color-accent-300: #f1deca;
    --color-accent-400: #ecd3b8;
    --color-accent-500: #eee1d2;
    --color-accent-600: #eccb99;
    --color-accent-700: #e9b65f;
    --color-accent-800: #e7a027;
    --color-accent-900: #c7821e;
    --spacer-xxl: clamp(120px, calc(var(--navigation-height, 80px) * 1.05), 4.25em);
    --spacer-xl: clamp(100px, calc(var(--navigation-height, 80px) * 0.9), 4em);
    --spacer-lg: clamp(80px, calc(var(--navigation-height, 80px) * 0.75), 3em);
    --spacer-md: clamp(60px, calc(var(--navigation-height, 80px) * 0.5), 2.5em);
    --spacer-sm: clamp(40px, calc(var(--navigation-height, 80px) * 0.25), 2em);
    --spacer-xs: clamp(20px, calc(var(--navigation-height, 80px) * 0.15), 1.5em);
    --spacer-xxs: clamp(16px, calc(var(--navigation-height, 80px) * 0.05), 1em);
    --spacer-navigation: var(--navigation-height, 80px);
    --spacer-section: 1.6rem;
}

body .has-small-font-size{
    font-size: 14px !important;
}

@media (min-width: 768px) {
    body .has-small-font-size{
        font-size: clamp(14px, 3vw, 16px) !important;
    }
}

body .has-medium-font-size{
    font-size: 16px !important;
}

@media (min-width: 768px) {
    body .has-medium-font-size{
        font-size: clamp(18px, 5vw, 24px) !important;
    }
}

body .has-large-font-size{
    font-size: 24px !important;
}

@media (min-width: 768px) {
    body .has-large-font-size{
        font-size: clamp(24px, 10vw, 32px) !important;
    }
}

body .has-x-large-font-size{
    font-size: 32px !important;
}

@media (min-width: 768px) {
    body .has-x-large-font-size{
        font-size: clamp(32px, 15vw, 48px) !important;
    }
}