/* variables */
:root{
    /* базовые шрифты */
    --font-base: 'Nunito Sans', 'Open Sans', 'Trebuchet MS', Arial, sans-serif;
	--font-headings: 'Unbounded', 'Montserrat', 'Nunito Sans', 'Open Sans', 'Trebuchet MS', Arial, sans-serif;

    /* контейнер и его отступы */
    --cnt-max-width: 1520px;
    --cnt-vertical-padding: 20px;
    --cnt-horizontal-padding: 16px;

    /* цвета из фигмы */
    --white: #fff;
    --light-grey: #F2F2F2;
    --orange: #FF6114;
    --blue: #2F69DC;
    --dark: #212121;
    --dark-grey: #ADADAD;
    --srfc-surface: #F6F6F6;
    --red-1: #F94141; /* CF error */
    --error: #F96767;
    --error-field-bg: #fed2d2;

    --color-1-1: #262626;
    --color-1-2: #4D4D4D;
    --color-1-3: #737373;
    --color-1-4: #999999;
    --color-1-5: #BFBFBF;
    --color-1-6: #E6E6E6;
    --color-1-7: #F2F2F2;
    --color-1-8: #FFFFFF;
    --color-2-1: #E5CFFC;
    --color-2-2: #D9B6FB;
    --color-2-3: #CC9EFA;
    --color-5-1: #5CD6D6;

    /* цвет шрифтов */
    --base-color: var(--dark);
	--alternate-color: var(--white);
    --accent-txt-color: var(--blue);

    /* цвет ссылок */
    --a-color: var(--dark);
    --a-hover-color: var(--blue);
    --a-active-color: var(--blue);

    /* кнопки */
    --btn-bg: var(--color-2-1);
    --btn-border: var(--color-2-1);

    --btn-hover-bg: var(--color-2-2);
    --btn-hover-border: var(--btn-hover-bg);

    --btn-active-bg: var(--color-2-3);
    --btn-active-border: var(--btn-active-bg);

    --btn-color: var(--color-1-1);
    --btn-hover-color: var(--btn-color);
    --btn-active-color: var(--btn-hover-color);

    --btn-padding: 12px 20px;

    /* второй тип кнопок - синий */
    --btn2-bg: var(--color-1-1);
    --btn2-border: var(--btn2-bg);

    --btn2-hover-bg: var(--color-1-2);
    --btn2-hover-border: var(--btn2-hover-bg);

    --btn2-active-bg: var(--color-1-3);
    --btn2-active-border: var(--btn2-active-bg);
    
    --btn2-color: var(--color-1-8);

    /* фон */
    --base-bg: #fff;

    /* размеры шрифтов и отступы */
    --base-font-size: 16px;
    /*--base-line-height: 160%;*/
    --base-line-height: 1.4;
    --base-p-margin: 1em;
    --li-interval: 1em;

    /* формы */

    /* шапка */
    --base-header-height: 70px;
    --actual-header-height: var(--base-header-height);

    /* спрайт */
    --sprt: url(/wp-content/themes/hdden/assets/img/sprt.svg);
}
html[lang="kir"]{
    --font-headings: 'Montserrat', 'Nunito Sans', 'Open Sans', 'Trebuchet MS', Arial, sans-serif;
}

@media (min-width: 768px){
	:root{
		--cnt-horizontal-padding: 40px;
		--cnt-vertical-padding: 40px;
		--btn-padding: 13px 20px;
	}
}
@media (min-width: 968px){
	:root{
		--cnt-horizontal-padding: 60px;
		--cnt-vertical-padding: 40px;
		--btn-padding: 13px 20px;
	}
}
@media (min-width: 1100px){
	:root{
		--cnt-horizontal-padding: 80px;
		--cnt-vertical-padding: 60px;
		--btn-padding: 9px 16px;
	}
}
@media (min-width: 1200px){
	:root{
		--cnt-horizontal-padding: 100px;
		--cnt-vertical-padding: 80px;
	}
}
@media (min-width: 1360px){
	:root{
		--cnt-horizontal-padding: 120px;
		--cnt-vertical-padding: 80px;
	}
}
@media (min-width: 1440px){
	:root{
		--btn-padding: 13px 20px;
	}
}