@font-face {
    font-family: "Vazirmatn";
    src: url("../fonts/vazirmatn/Vazirmatn-Variable.ttf") format("truetype-variations");
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("../fonts/inter/Inter-Variable.ttf") format("truetype-variations");
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
}

html {
    font-family: var(--font-persian);
    font-size: 100%;
}

body {
    font-family: var(--font-persian);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.8;
}

:lang(en),
[dir="ltr"] {
    font-family: var(--font-english);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--color-text);
    font-weight: 700;
    line-height: 1.35;
    text-wrap: balance;
}

h1 {
    font-size: clamp(2.125rem, 4vw, 2.75rem);
}

h2 {
    font-size: clamp(1.75rem, 3vw, 2.25rem);
}

h3 {
    font-size: clamp(1.5rem, 2.5vw, 1.75rem);
    font-weight: 600;
}

h4 {
    font-size: clamp(1.25rem, 2vw, 1.375rem);
    font-weight: 600;
}

p {
    text-wrap: pretty;
}