:root {
    --primary-color: #BE1E2E;
    --primary-color-hover: #C63E4C;

    --white: #FFFFFF;
    --gray-25: #FDFDFD;
    --gray-50: #FAFAFA;
    --gray-100: #F5F5F5;
    --gray-200: #E9EAEB;
    --gray-300: #D5D7DA;
    --gray-400: #A4A7AE;
    --gray-500: #717680;
    --gray-600: #535862;
    --gray-700: #414651;
    --gray-800: #252B37;
    --gray-900: #181D27;
    --gray-950: #0A0D12;
    --black: #000000;
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
}
html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
}
body {
    color: #181D27;
    background-color: var(--gray-100);
}
a {
    color: inherit;
}
i {
    display: inline-flex;
}

/* DEFINICJE FONTÓW - POPPINS */
@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins/Poppins-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins/Poppins-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins/Poppins-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins/Poppins-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins/Poppins-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins/Poppins-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* DEFINICJE FONTÓW - CHAKRA PETCH */
@font-face {
    font-family: 'Chakra Petch';
    src: url('../fonts/Chakra_Petch/ChakraPetch-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Chakra Petch';
    src: url('../fonts/Chakra_Petch/ChakraPetch-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Chakra Petch';
    src: url('../fonts/Chakra_Petch/ChakraPetch-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
.heading-h1 {
    font-family: 'Chakra Petch', sans-serif;
    font-size: 70px;
    font-weight: 600;
}
.heading-h2 {
    font-family: 'Chakra Petch', sans-serif;
    font-size: 50px;
    font-weight: 600;
}
.heading-h3 {
    font-family: 'Chakra Petch', sans-serif;
    font-size: 42px;
    font-weight: 600;
}
.heading-h4 {
    font-family: 'Chakra Petch', sans-serif;
    font-size: 34px;
    font-weight: 600;
}
.heading-h5 {
    font-family: 'Chakra Petch', sans-serif;
    font-size: 26px;
    font-weight: 600;
}
.heading-h6 {
    font-family: 'Chakra Petch', sans-serif;
    font-size: 22px;
    font-weight: 600;
}
.heading-lg {
    font-family: 'Chakra Petch', sans-serif;
    font-size: 18px;
    font-weight: 600;
}
@media screen and (max-width: 991px) {
    .heading-h1 {
        font-size: 56px;
    }
    .heading-h2 {
        font-size: 40px;
    }
    .heading-h3 {
        font-size: 34px;
    }
    .heading-h4 {
        font-size: 24px;
    }
    .heading-h5 {
        font-size: 20px;
    }
    .heading-h6 {
        font-size: 18px;
    }
}
@media screen and (max-width: 479px) {
    .heading-h1 {
        font-size: 40px;
    }
    .heading-h2 {
        font-size: 28px;
    }
    .heading-h3 {
        font-size: 24px;
    }
    .heading-h4 {
        font-size: 22px;
    }
    .heading-h5 {
        font-size: 20px;
    }
    .heading-h6 {
        font-size: 18px;
    }
}