:root {

    --shadow-3: 0px 0px 2px 0px rgba(0,0,0,.12), 0px 4px 8px 0px rgba(0,0,0,.14);

    --color-grey-30:    rgba(77,77,77,1);
    --color-grey-52:    rgba(133,133,133,1);
    --color-grey-74:    rgba(189,189,189,1);
    --color-grey-82:    rgba(209,209,209,1);
    --color-grey-90:    rgba(230,230,230,1);
    --color-grey-94:    rgba(240,240,240,1);
    --color-grey-96:    rgba(245,245,245,1);
    --color-grey-white: rgba(255,255,255,1);
    --color-text-black: rgba(33,33,33,1);
    --color-white-transparent-85:     rgba(255,255,255,.85);
    --color-grey-90-transparent-85:   rgba(230,230,230,.85);
    --color-grey-80-transparent-85:   rgba(204,204,204,.85);

    --color-blue-80:  rgba(10,109,174,1);

    --color-info-bg:       #E9F3FC;

    --main-font:            'Nunito Sans', sans-serif;
    --font-weight-regular:   400;
    --font-weight-semibold:  600;
    --font-weight-bold:      700;

    --background-color:         #FFF;

    --radius-3: 3px;

    --color-grey-40: rgba(102,102,102,1);
    --color-grey-20: rgba(51,51,51,1);
    --color-blue-120: rgba(155,214,252,1);

    --color-status-stable-bg: rgba(114,162,121,.12);
    --color-status-stable-text: #30713a;
    --color-status-beta-bg: #fae2cc;
    --color-status-beta-text: #bd5f0c;
    --color-status-legacy-bg: #f0f0f0;

    --color-slate: #475569;

    --color-grey-96-transparent-80: rgba(245,245,245,.8);

    --color-card-border: var(--color-grey-90);

    --shadow-header: 0px 3px 15px 0px rgba(0,0,0,.02);

    --font-logo: 'Open Sans', sans-serif;

    --font-unbounded: 'Unbounded', sans-serif;
    --font-golos: 'Golos Text', sans-serif;

    --container-max: 1520px;
    --container-margin-mobile: 16px;
    --header-height: 64px;

    --container-gutter: clamp(var(--container-margin-mobile), 5vw, var(--space-40));

    --container-margin-tablet: var(--space-24);
    --container-margin-laptop: var(--space-48);

    --space-section-gap: 140px;

    --space-4: 4px;
    --space-8: 8px;
    --space-12: 12px;
    --space-16: 16px;
    --space-20: 20px;
    --space-24: 24px;
    --space-32: 32px;
    --space-40: 40px;
    --space-48: 48px;
    --space-120: 120px;

    --text-h1-desktop: var(--font-weight-bold) 40px/52px var(--main-font);
    --text-h2-desktop: var(--font-weight-bold) 32px/40px var(--main-font);
    --text-h5-desktop: var(--font-weight-bold) 20px/28px var(--main-font);
    --text-h6-desktop: var(--font-weight-bold) 16px/22px var(--main-font);
    --text-large-desktop: var(--font-weight-regular) 16px/22px var(--main-font);
    --text-medium-desktop: var(--font-weight-regular) 14px/20px var(--main-font);
    --text-medium-semibold-desktop: var(--font-weight-semibold) 14px/20px var(--main-font);
    --text-small-desktop: var(--font-weight-regular) 12px/16px var(--main-font);

    --text-h1-mobile: var(--font-weight-bold) 28px/36px var(--main-font);
    --text-h2-mobile: var(--font-weight-bold) 24px/32px var(--main-font);
    --text-h4-mobile: var(--font-weight-bold) 20px/26px var(--main-font);
    --text-h5-mobile: var(--font-weight-bold) 18px/24px var(--main-font);
    --text-h6-mobile: var(--font-weight-semibold) 16px/22px var(--main-font);
    --text-large-mobile: var(--font-weight-regular) 16px/24px var(--main-font);
    --text-medium-mobile: var(--font-weight-regular) 14px/20px var(--main-font);
    --text-medium-semibold-mobile: var(--font-weight-semibold) 14px/20px var(--main-font);
    --text-medium-bold-mobile: var(--font-weight-bold) 14px/20px var(--main-font);
    --text-small-mobile: var(--font-weight-regular) 12px/16px var(--main-font);
}
