:root {
    --context: 14.4;}
/* Desktop */

h1, .h1 {
    font-size: 56px !important;
    line-height: 1.2 !important;
}

h2, .h2 {
    font-size: 48px !important;
    line-height: 1.25 !important;
}

h3, .h3 {
    font-size: 36px !important;
    line-height: 1.3 !important;
}

h4, .h4 {
    font-size: 28px !important;
    line-height: 1.35 !important;
}

h5, .h5 {
    font-size: 22px !important;
    line-height: 1.4 !important;
}

h6, .h6 {
    font-size: 18px !important;
    line-height: 1.4 !important;
}

p {
    font-size: 16px !important;
    line-height: 1.6 !important;
}

/* Mobile */

@media (max-width: 767px) {

    h1, .h1 {
        font-size: 40px !important;
    }

    h2, .h2 {
        font-size: 32px !important;
    }

    h3, .h3 {
        font-size: 24px !important;
    }

    h4, .h4 {
        font-size: 20px !important;
    }

    h5, .h5 {
        font-size: 18px !important;
    }

    h6, .h6 {
        font-size: 16px !important;
    }

    p {
        font-size: 16px !important;
    }
}


.container {
    max-width: 1440px;
    width: 100%;
    margin: 0 auto;
    /* padding: 0 calc(165vw / var(--context)) */
    padding: 0 15px;
}

@media (max-width: 1200px) {
    .container {
        /* padding:0 calc(90vw / var(--context)) */
    }
}

@media (max-width: 992px) {
    .container {
        /* padding:0 calc(40vw / var(--context)) */
    }
}

@media (max-width: 600px) {
    .container {
        padding:0 35px
    }
}

@media (max-width: 420px) {
    .container {
        padding:0 25px
    }
}
