:root {
    /*  основные цвета  */
    --yellow: #FFC600;
    --yellow-h: #FFD040;
    --orange: #FF681F;
    --orange-h: #FF7F31;
    --orange-light: #FF7F32;
    --violet: #AA95DB;
    --blue: #84A7E3;
    --white: #FFFFFF;
    --light-gray: #F7F7F7;
    --gray: #F0F0F0;
    --black: #1A1B1C;
    --green: #AEC542;
    --dark-gray: #616569;
    --footer-bg: #F5F3F1;

    /*  цвет линии продукта  */
    --light-blue: #A5C5ED;
    --red: #C13D33;
    --light-yellow: #FFE58B;

    --h1-size: clamp(24px, 4vw, 56px);
    --h2-size: 48px;
    --h3-size: clamp(24px, 3.5vw, 40px);
    --h4-size: clamp(24px, 2.5vw, 32px);
    --h5-size: 24px;

    --h1-lh: clamp(124%, 3.5vw, 64px);
    --h2-lh: 56px;
    --h3-lh: clamp(32px, 3.5vw, 48px);
    --h4-lh: clamp(32px, 2.5vw, 40px);
    --h5-lh: 32px;

    --p-large: 24px;
    --p-medium: clamp(14px, 2.5vw, 20px);
    --p-medium-bigger: clamp(16px, 2.5vw, 20px);
    --p-small: clamp(14px, 3vw, 18px);
    --p-ultra-small: clamp(14px, 2vw, 16px);
    --p-ultra-small-2: clamp(12px, 2vw, 14px);
    --caption: 12px;

    --p-lh-medium: clamp(20px, 2.5vw, 28px);
    --p-lh-small: clamp(20px, 3vw, 24px);
    --p-lh-ultra-small: clamp(20px, 2vw, 24px);
    --p-lh-ultra-small-2: 20px;
    --caption-lh: 16px;

    --fw-400: 400;
    --fw-500: 500;
    --fw-700: 700;

    --bt-l: clamp(14px, 2vw, 16px);
    --bt-m: clamp(12px, 2vw, 14px);
    --bt-s: 12px;

    --bt-lh-l: clamp(20px, 2vw, 24px);
    --bt-lh-m: clamp(14px, 1vw, 20px);
    --bt-lh-s: 16px;

    --swiper-pagination-color: #FFC600;

    --gap-container: clamp(72px, 10vw, 112px);

	--gap-h: clamp(8px, 1.5vw, 24px);
	--gap-v: clamp(12px, 1.5vw, 24px);

    --transition: 0.3s ease-in-out;

	--container: 1440px;

	--container-not-padding: calc(var(--container) - var(--padding) * 2);

	--padding: clamp(12px, 10vw, 96px);

	--padding-v: clamp(32px, 5vw, 72px);

	@media screen and (max-width: 1439px) {
		--padding: clamp(12px, 5vw, 96px);
	}

	@media screen and (max-width: 600px) {
		--padding: clamp(12px, 2vw, 96px);
	}
}

.home h1 {
    font-size: var(--h1-size);
    line-height: 124%;
    user-select: none;
}

.home h2 {
    font-size: var(--h2-size);
    line-height: var(--h2-lh);
    user-select: none;
}

.home h3 {
    font-size: var(--h3-size);
    font-weight: var(--fw-500);
    line-height: var(--h3-lh);
    user-select: none;
}

.home h4 {
    font-size: var(--h4-size);
    line-height: var(--h4-lh);
    user-select: none;
}

.home h5 {
    font-size: var(--h5-size);
    line-height: var(--h5-lh);
    user-select: none;
}