:root {
    /*general*/
	--app-height: 100%;
    --footer-size: 820px;
    --header-size: 76px;
    /*colors*/
    --brand-blue-primary: #0F2D69;
    --brand-blue-primary-8: #0F2D6914;
    --brand-blue-primary-20: #0F2D6933;
    --brand-blue-primary-32: #0F2D6952;
    --brand-blue-primary-44: #0F2D6970;
    --brand-blue-primary-64: #0F2D69a3;
    --brand-orange-primary: #FA6626;
    --brand-orange-primary-64: #FA6626a3;
    --brand-dark-blue-primary: #06132D;
    --brand-red-primary: #FA2626;
    --brand-red-primary-64: #FA2626a3;
    --brand-white-primary: #FFFFFF;
    --brand-white-primary-8: #FFFFFF14;
    --brand-white-primary-20: #FFFFFF33;
    --brand-white-primary-32: #FFFFFF52;
    --brand-white-primary-44: #FFFFFF70;
    --brand-white-primary-64: #FFFFFFa3;
    --gray: #F3F4F5;
    --bg-primary: var(--brand-white-primary);
    --bg-secondary: #D9D9D9;
    --bg-third: #F3F4F5;
    --bg-four: #06132D;
    --bg: linear-gradient(180deg, #06132D 0%, #164198 100%);

    /*font-sizes*/
    --font-size-paragraph: 1.25rem ; /*20px*/
    --line-height-paragraph: 1.5rem; /*24px*/
    --font-size-paragraph-big: 1.75rem ; /*28px*/
    --line-height-paragraph-big: 2rem; /*32px*/
    --letter-spacing-paragraph-big: -0.0525rem; /*-0.84px*/
    --font-size-paragraph-small: 1rem ; /*16px*/
    --line-height-paragraph-small: 1.25rem; /*20px*/

    --font-size-tags: 0.875rem; /*14px*/
    --line-height-tags: 1.125rem ; /*18px*/

    --font-size-sub-title: 1rem; /*16px*/
    --line-height-sub-title: 1.25rem ; /*20px*/
    --letter-spacing-sub-title: 0.01rem ; /*0.16px*/

    --font-size-link: 1rem; /*16px*/
    --line-height-link: 1.25rem; /*20px*/
    --letter-spacing-link: 0.01rem ; /*0.16px*/

    --font-size-button: 1rem; /*16px*/
    --line-height-button: 1.25rem; /*20px*/
    --letter-spacing-button: 0.01rem ; /*0.16px*/

    --font-size-h1: 4.5rem; /*72px*/
    --line-height-h1: 4.75rem; /*76px*/
    --letter-spacing-h1: -0.045rem; /*-0.72px*/

    --font-size-h2: 3.75rem; /*60px*/
    --line-height-h2: 4rem; /*64px*/
    --letter-spacing-h2: -0.1125rem; /*-1.8px*/

    --font-size-h3: 3rem; /*48px*/
    --line-height-h3: 3.25rem; /*52px*/
    --letter-spacing-h3: -0.09rem; /*-1.44px*/

    --font-size-h4: 2.5rem; /*40px*/
    --line-height-h4: 2.75rem; /*44px*/
    --letter-spacing-h4: -0.075rem ; /*-1.2px*/

    --font-size-h5: 1rem; /*16px*/
    --line-height-h5: 1.5rem; /*24px*/

    --font-size-h6: 0.875rem; /*14px*/
    --line-height-h6: 1.125rem; /*18px*/

    --font-size-number: 6.25rem; /*100px*/
    --line-height-number: 6.5rem; /*104px*/
}

@media only screen and (max-width: 1839px) {
    /*font-sizes*/
    :root {
        --footer-size: 738px;
        /*font-sizes*/
        --font-size-paragraph: 0.875rem ; /*14px*/
        --line-height-paragraph: 1.125rem; /*18px*/
        --font-size-paragraph-big: 1.125rem ; /*18px*/
        --line-height-paragraph-big: 1.375rem; /*22px*/
        --letter-spacing-paragraph-big: -0.03375rem; /*-0.54px*/
        --font-size-paragraph-small: 0.75rem; /*12px*/
        --line-height-paragraph-small: 1rem ; /*16px*/

        --font-size-tags: 0.625rem; /*10px*/
        --line-height-tags: 1rem ; /*14px*/

        --font-size-sub-title: 0.75rem; /*12px*/
        --line-height-sub-title: 0.875rem ; /*16px*/

        --font-size-link: 0.75rem; /*12px*/
        --line-height-link: 1rem; /*16px*/
        --letter-spacing-link: 0.01rem ; /*0.16px*/

        --font-size-button: 0.75rem; /*12px*/
        --line-height-button: 1rem ; /*16px*/
        --letter-spacing-button: 0.00875rem ; /*0.14px*/

        --font-size-h1: 3.25rem; /*52px*/
        --line-height-h1: 3.5rem; /*56px*/
        --letter-spacing-h1: -0.03rem; /*-0.48px*/

        --font-size-h2: 2.5rem; /*40px*/
        --line-height-h2: 2.75rem; /*44px*/
        --letter-spacing-h2: -0.075rem; /*-1.2px*/

        --font-size-h3: 2rem; /*32px*/
        --line-height-h3: 2.25rem; /*36px*/
        --letter-spacing-h3: -0.0525rem; /*-0.84px*/
        
        --font-size-h4: 1.75rem; /*28px*/
        --line-height-h4: 2rem; /*32px*/
        --letter-spacing-h4: -0.0525rem ; /*-0.84px*/

        --font-size-h5: 1rem; /*16px*/
        --line-height-h5: 1.5rem; /*24px*/

        --font-size-h6: 0.875rem; /*14px*/
        --line-height-h6: 1.125rem; /*18px*/

        --font-size-number: 4.5rem; /*72px*/
        --line-height-number: 4.75rem; /*76px*/
    }
}

@media only screen and (max-width: 1440px) {
    :root {
        --footer-size: 660px;
    }
}


@media only screen and (max-width: 1279px) {
    :root {

        --footer-size: 870px;
        --header-size: 65px;
        /*font-sizes*/
        --font-size-paragraph: 1rem ; /*16px*/
        --line-height-paragraph: 1.25rem; /*20px*/
        --font-size-paragraph-big: 1.5rem ; /*24px*/
        --line-height-paragraph-big: 1.5rem; /*24px*/
        --letter-spacing-paragraph-big: -0.045rem; /*-0.72px*/
        --font-size-paragraph-small: 0.875rem; /*14px*/
        --line-height-paragraph-small: 1.125rem ; /*18px*/

        --font-size-tags: 0.75rem; /*12px*/
        --line-height-tags: 1rem ; /*16px*/

        --font-size-sub-title: 0.875rem; /*14px*/
        --line-height-sub-title: 1.125rem ; /*18px*/

        --font-size-link: 1rem; /*16px*/
        --line-height-link: 1.25rem; /*20px*/
        --letter-spacing-link: 0.01rem ; /*0.16px*/

        --font-size-button: 0.875rem; /*14px*/
        --line-height-button: 1.125rem ; /*18px*/
        --letter-spacing-button: 0.00875rem ; /*0.14px*/

        --font-size-h1: 2.5rem; /*48px*/
        --line-height-h1: 3.25rem; /*52px*/
        --letter-spacing-h1: -0.03rem; /*-0.48px*/

        --font-size-h2: 2.5rem; /*40px*/
        --line-height-h2: 2.75rem; /*44px*/
        --letter-spacing-h2: -0.075rem; /*-1.2px*/

        --font-size-h3: 1.75rem; /*28px*/
        --line-height-h3: 2rem; /*32px*/
        --letter-spacing-h3: -0.0525rem; /*-0.84px*/

        --font-size-h4: 1.5rem; /*24px*/
        --line-height-h4: 1.75rem; /*28px*/
        --letter-spacing-h4: -0.045rem ; /*-0.72px*/

        --font-size-h5: 1rem; /*16px*/
        --line-height-h5: 1.5rem; /*24px*/

        --font-size-h6: 0.875rem; /*14px*/
        --line-height-h6: 1.125rem; /*18px*/

        --font-size-number: 3.75rem; /*60px*/
        --line-height-number: 4rem; /*64px*/

    }
}
@media only screen and (max-width: 766px) {
    :root {

        --footer-size: auto;
        --header-size: 60px;


        /*font-sizes*/
        --font-size-paragraph: 1rem ; /*16px*/
        --line-height-paragraph: 1.25rem; /*20px*/
        --font-size-paragraph-big: 1.25rem ; /*20px*/
        --line-height-paragraph-big: 1.5rem; /*24px*/
        --letter-spacing-paragraph-big: -0.0375rem; /*-0.6px*/
        --font-size-paragraph-small: 0.875rem; /*14px*/
        --line-height-paragraph-small: 1.125rem ; /*18px*/

        --font-size-tags: 0.75rem; /*12px*/
        --line-height-tags: 1rem ; /*16px*/

        --font-size-sub-title: 0.875rem; /*14px*/
        --line-height-sub-title: 1.125rem ; /*18px*/

        --font-size-link: 0.875rem; /*14px*/
        --line-height-link: 1.125rem ; /*18px*/

        --font-size-button: 0.875rem; /*14px*/
        --line-height-button: 1.125rem ; /*18px*/
        --letter-spacing-button: 0.00875rem ; /*0.14px*/

        --font-size-h1: 1.75rem; /*28px*/
        --line-height-h1: 2rem; /*32px*/
        --letter-spacing-h1: -0.0175rem; /*-0.28px*/

        --font-size-h2: 2rem; /*32px*/
        --line-height-h2: 2.25rem; /*36px*/
        --letter-spacing-h2: -0.06rem; /*-0.96px*/

        --font-size-h3: 1.5rem; /*24px*/
        --line-height-h3: 1.75rem; /*28px*/
        --letter-spacing-h3: -0.045rem; /*-0.72px*/

        --font-size-h4: 1.25rem; /*20px*/
        --line-height-h4: 1.5rem; /*24px*/
        --letter-spacing-h4: -0.0375rem; /*-0.6px*/

        --font-size-h5: 1rem; /*16px*/
        --line-height-h5: 1.5rem; /*24px*/

        --font-size-h6: 0.875rem; /*14px*/
        --line-height-h6: 1.125rem; /*18px*/

        --font-size-number: 3.75rem; /*60px*/
        --line-height-number: 4rem; /*64px*/
    }
}





html.lang-ar,
html.lang-prs {
    /* H1–H4 */
    --font-size-h1: 4.75rem;  /* 76px */
    --line-height-h1: 5rem;   /* 80px */

    --font-size-h2: 4rem;     /* 64px */
    --line-height-h2: 4.25rem;/* 68px */

    --font-size-h3: 3.25rem;  /* 52px */
    --line-height-h3: 3.5rem; /* 56px */

    --font-size-h4: 2.75rem;  /* 44px */
    --line-height-h4: 3rem;   /* 48px */

    /* Текстовые */
    --font-size-paragraph-big: 2rem;   /* 32px */
    --line-height-paragraph-big: 2.5rem; /* 40px */

    --font-size-paragraph: 1.5rem;     /* 24px */
    --line-height-paragraph: 1.75rem;  /* 28px */

    --font-size-sub-title: 1.375rem;   /* 22px */
    --line-height-sub-title: 1.5rem;   /* 24px */

    --font-size-button: 1.375rem;      /* 22px */
    --line-height-button: 1.5rem;      /* 24px */

    /* Ссылки и теги */
    --font-size-link: 1.375rem;        /* 22px */
    --line-height-link: 1.5rem;        /* 24px */

    --font-size-tags: 1.25rem;         /* 20px */
    --line-height-tags: 1.375rem;      /* 22px */

    /* (если у вас есть “link-big” — введите свои переменные)
    --font-size-link-big: 1.375rem;
    --line-height-link-big: 1.5rem;
    */

    /* Обычно для арабского не используют отрицательные letter-spacing */
    --letter-spacing-h1: 0;
    --letter-spacing-h2: 0;
    --letter-spacing-h3: 0;
    --letter-spacing-h4: 0;
    --letter-spacing-paragraph-big: 0;
    --letter-spacing-link: 0;
    --letter-spacing-button: 0;
}

/* ===== “Планшет” (по вашей сетке) ===== */
@media (max-width: 1839px) {
    html.lang-ar,
    html.lang-prs {
        /* из таблицы “Планшет” */
        --font-size-h1: 3.25rem;  /* 52 */
        --line-height-h1: 3.5rem; /* 56 */

        --font-size-h2: 2.75rem;  /* 44 */
        --line-height-h2: 3rem;   /* 48 */

        --font-size-h3: 2rem;     /* 32 */
        --line-height-h3: 2.25rem;/* 36 */

        --font-size-h4: 1.75rem;  /* 28 */
        --line-height-h4: 2rem;   /* 32 */

        --font-size-paragraph-big: 1.5rem;   /* 24 */
        --line-height-paragraph-big: 1.75rem;/* 28 */

        --font-size-paragraph: 1.25rem;      /* 20 */
        --line-height-paragraph: 1.5rem;     /* 24 */

        --font-size-sub-title: 1.25rem;      /* 20 */
        --line-height-sub-title: 1.375rem;   /* 22 */

        --font-size-button: 1.25rem;         /* 20 */
        --line-height-button: 1.25rem;       /* 20 */

        --font-size-link: 1.25rem;           /* 20 */
        --line-height-link: 1.5rem;          /* 24 */

        --font-size-tags: 1.125rem;          /* 18 */
        --line-height-tags: 1.25rem;         /* 20 */
    }
}

/* ===== Мобилка ===== */
@media (max-width: 766px) {
    html.lang-ar,
    html.lang-prs {
        --font-size-h1: 2rem;     /* 32 */
        --line-height-h1: 2.25rem;/* 36 */

        --font-size-h2: 2.25rem;  /* 36 */
        --line-height-h2: 2.5rem; /* 40 */

        --font-size-h3: 1.5rem;   /* 24 */
        --line-height-h3: 1.75rem;/* 28 */

        --font-size-h4: 1.5rem;   /* 24 — таблица даёт 24/28 */
        --line-height-h4: 1.75rem;/* 28 */

        --font-size-paragraph-big: 1.5rem;   /* 24 */
        --line-height-paragraph-big: 1.75rem;/* 28 */

        --font-size-paragraph: 1.25rem;      /* 20 */
        --line-height-paragraph: 1.5rem;     /* 24 */

        --font-size-sub-title: 1.25rem;      /* 20 */
        --line-height-sub-title: 1.25rem;    /* 20–22, выберите под макет */

        --font-size-button: 1.25rem;         /* 20 */
        --line-height-button: 1.25rem;       /* 20 */

        --font-size-link: 1.25rem;           /* 20 */
        --line-height-link: 1.375rem;        /* 22–24 */

        --font-size-tags: 1.125rem;          /* 18 */
        --line-height-tags: 1.25rem;         /* 20 */
    }
}