/* ========== PT Serif Font Family ==========  */

@font-face {
    font-family: "PT Serif";
    src: url("../../fonts/pt-serif-latin-400-normal.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "PT Serif";
    src: url("../../fonts/pt-serif-latin-400-italic.woff2") format("woff2");
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: "PT Serif";
    src: url("../../fonts/pt-serif-latin-700-normal.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: "PT Serif";
    src: url("../../fonts/pt-serif-latin-700-italic.woff2") format("woff2");
    font-weight: 700;
    font-style: italic;
}


/* Extended Latin */

@font-face {
    font-family: "PT Serif";
    src: url("../../fonts/pt-serif-latin-ext-400-normal.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    unicode-range: U+0100-024F;
}

@font-face {
    font-family: "PT Serif";
    src: url("../../fonts/pt-serif-latin-ext-700-italic.woff2") format("woff2");
    font-weight: 700;
    font-style: italic;
    unicode-range: U+0100-024F;
}

@font-face {
    font-family: "PT Serif";
    src: url("../../fonts/pt-serif-latin-ext-700-normal.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    unicode-range: U+0100-024F;
}


/* ===== Allura Font Family  */

@font-face {
    font-family: "Allura";
    src: url("../../fonts/allura_regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}

:root {
    --font-family: "PT Serif", serif;
    --font-family_allura: "Allura";
    --background_color: #020202;
    --background_color_6: #0202020F;
    --primary_color: #9a8462;
    --primary_color_for_button: #C4B99D;
    --heading_color: #9a8462;
    --body_paragraph_color: #EFECE0;
    --link_color: #9a8462;
    --accent_color: #e2e2e2;
    --gradient_color: linear-gradient(90deg, #634a22 40%, #ffffff 60%);
    --black_color: #000000;
    --black_color_80: #020202CC;
    --white_color: #ffffff;
    --white_color_50: #FFFFFF80;
    --white_color_70: #FFFFFFB2;
    --about_card_background: #212121;
    --button_background_color: #f9f9f9;
    --green_bg_color: #153828;
    --border_primary_color: #A2845E;
    --letter_spacing: -0.015em;
    --letter_spacing_paragraph: 0.015em;
    --font-size: 16px;
    --line-height: 1.9;
    --h1_font_size: 32px;
    --small_card_title: 30px;
    --h2_font_size: 24px;
    --font_size_22: 22px;
    --main_manu_size: 24px;
    --accordion_heading_size: 18px;
    --h3_font_size: 20px;
    --h4_font_size: 16px;
    --social_button_size: 14px;
    --heading_line_height: 1.2;
    --font_size_45 : 45px;
    --font_size_54 : 54px;
    --font_size_60 : 60px;
}

h1 {
    font-size: var(--h1_font_size);
    font-family: var(--font-family);
    font-weight: 700;
    line-height: var(--heading_line_height);
    letter-spacing: var(--letter_spacing);
    color: var(--body_paragraph_color);
}

h2 {
    font-size: var(--h2_font_size);
    font-family: var(--font-family);
    font-weight: 700;
    line-height: var(--heading_line_height);
    letter-spacing: var(--letter_spacing);
    color: var(--body_paragraph_color);
}

h3 {
    font-size: var(--h3_font_size);
    font-family: var(--font-family);
    font-weight: 700;
    line-height: var(--heading_line_height);
    letter-spacing: var(--letter_spacing);
    color: var(--body_paragraph_color);
}

h4 {
    font-size: var(--h4_font_size);
    font-family: var(--font-family);
    font-weight: 700;
    line-height: var(--heading_line_height);
    letter-spacing: var(--letter_spacing);
    color: var(--body_paragraph_color);
}

p {
    font-size: var(--font-size);
    font-family: var(--font-family);
    font-weight: 400;
    line-height: var(--line-height);
    letter-spacing: var(--letter_spacing_paragraph);
    color: var(--body_paragraph_color);
}

p.style_text {
    font-size: var(--h2_font_size);
    font-family: var(--font-family_allura);
    font-weight: 400;
    line-height: 29px;
    letter-spacing: 0%;
}

a {
    font-size: var(--font-size);
    font-family: var(--font-family);
    font-weight: 400;
    line-height: var(--line-height);
    color: var(--white_color);
    text-decoration: none;
    transition: all 0.3s ease-in-out;
}

a:hover {
    color: var(--link_color);
}

body {
    background-color: var(--background_color);
    font-family: var(--font-family);
}