.wrapper-cs {
    position: relative;

    width: 1248px;
    margin: 0 auto;
}

@media only screen and (max-width: 1310px) {
    .wrapper-cs {
        width: 100%;
        padding: 0 30px;
    }
}

@media only screen and (max-width: 1300px) {
    .wrapper-cs {
        width: calc(100% - 48px);
    }
}

@media only screen and (max-width: 1024px) {
    .wrapper-cs {
        width: 100%;
    }
}

.wrapper-cs-big {
    position: relative;

    width: 1440px;
    margin: 0 auto;
}

@media only screen and (max-width: 1440px) {
    .wrapper-cs-big {
        width: 100%;
    }
}

@media only screen and (max-width: 1310px) {
    .wrapper-cs-big {
        width: calc(100%);
    }
}

@media only screen and (max-width: 1300px) {
    .wrapper-cs-big {
        width: calc(100% - 48px);
    }
}

@media only screen and (max-width: 1024px) {
    .wrapper-cs-big {
        width: 100%;
    }
}

.wrapper-cs-big > .wrapper-cs {
    position: relative;

    width: 1248px;
    margin: 0 auto;
}

@media only screen and (max-width: 1440px) {
    .wrapper-cs-big > .wrapper-cs {
        position: initial;

        width: 1248px;
    }
}

@media only screen and (max-width: 1310px) {
    .wrapper-cs-big > .wrapper-cs {
        width: 100%;
    }
}

@media only screen and (max-width: 1300px) {
    .wrapper-cs-big > .wrapper-cs {
        width: 100%;
    }
}

@media only screen and (max-width: 1024px) {
    .wrapper-cs-big > .wrapper-cs {
        width: 100%;
    }
}


/* ----- typography ----- */
.cs_decor_1 {
    letter-spacing: var(--cs_letter-spacing_xxxl);

    font-size: var(--cs_decor_1_font_size);
    font-weight: var(--cs-font_weight--black);
    line-height: var(--cs_line-height_s);
}

@media only screen and (max-width: 460px) {
    .cs_decor_1 {
        font-size: var(--cs_decor_1_mobile_font_size);
    }
}

@media only screen and (max-width: 425px) {
    .cs_decor_1 {
        font-size: var(--cs_decor_1_mobile-small_font_size);
    }
}

.cs_decor_2 {
    letter-spacing: var(--cs_letter-spacing_xxl);

    font-size: var(--cs_decor_2_font_size);
    font-weight: var(--cs-font_weight--black);
    line-height: var(--cs_line-height_s);
}

@media only screen and (max-width: 460px) {
    .cs_decor_2 {
        font-size: var(--cs_decor_2_mobile_font_size);
    }
}

.cs_decor_3 {
    letter-spacing: var(--cs_letter-spacing_xxl);

    font-size: var(--cs_decor_3_font_size);
    font-weight: var(--cs-font_weight--black);
    line-height: var(--cs_line-height_s);
}

@media only screen and (max-width: 460px) {
    .cs_decor_3 {
        font-size: var(--cs_decor_3_mobile_font_size);
    }
}

@media only screen and (max-width: 400px) {
    .cs_decor_3 {
        font-size: var(--cs_decor_3_small_mobile_font_size);
    }
}

.cs_decor_4 {
    letter-spacing: var(--cs_letter-spacing_s);

    font-family: var(--cs_font_family_quote);
    font-size: var(--cs_decor_4_font_size);
    font-weight: var(--cs-font_weight--regular);
    line-height: var(--cs_line-height_xl);
}

@media only screen and (max-width: 460px) {
    .cs_decor_4 {
        font-size: var(--cs_decor_4_mobile_font_size);
    }
}

.cs_heading_1 {
    letter-spacing: var(--cs_letter-spacing_xl);

    font-size: var(--cs_heading_1_font_size);
    font-weight: var(--cs-font_weight--bold);
    line-height: var(--cs_line-height_m);
}

@media only screen and (max-width: 460px) {
    .cs_heading_1 {
        font-size: var(--cs_heading_1_mobile_font_size);
    }
}

.cs_heading_2 {
    letter-spacing: var(--cs_letter-spacing_l);

    font-size: var(--cs_heading_2_font_size);
    font-weight: var(--cs-font_weight--bold);
    line-height: var(--cs_line-height_l);
}

@media only screen and (max-width: 460px) {
    .cs_heading_2 {
        font-size: var(--cs_heading_2_mobile_font_size);
    }
}

.cs_heading_3 {
    letter-spacing: var(--cs_letter-spacing_m);

    font-size: var(--cs_heading_3_font_size);
    font-weight: var(--cs-font_weight--bold);
    line-height: var(--cs_line-height_l);
}

@media only screen and (max-width: 460px) {
    .cs_heading_3 {
        font-size: var(--cs_heading_3_mobile_font_size);
    }
}

.cs_heading_4 {
    letter-spacing: var(--cs_letter-spacing_xs);

    font-size: var(--cs_heading_4_font_size);
    font-weight: var(--cs-font_weight--bold);
    line-height: var(--cs_line-height_s);
}

@media only screen and (max-width: 460px) {
    .cs_heading_4 {
        font-size: var(--cs_heading_4_mobile_font_size);
    }
}

.cs_heading_5 {
    letter-spacing: var(--cs_letter-spacing_xs);

    font-size: var(--cs_heading_5_font_size);
    font-weight: var(--cs-font_weight--bold);
    line-height: var(--cs_line-height_s);
}

@media only screen and (max-width: 460px) {
    .cs_heading_5 {
        font-size: var(--cs_heading_5_mobile_font_size);
    }
}

.cs_body {
    font-size: var(--cs_body_font_size);
    font-weight: var(--cs-font_weight--light);
    line-height: var(--cs_line-height_xxl);
}

@media only screen and (max-width: 460px) {
    .cs_body {
        font-size: var(--cs_body_mobile_font_size);
    }
}

.cs_body_small {
    font-size: var(--cs_body_small_font_size);
    font-weight: var(--cs-font_weight--light);
    line-height: var(--cs_line-height_xl);
}

@media only screen and (max-width: 460px) {
    .cs_body_small {
        font-size: var(--cs_body_small_mobile_font_size);
    }
}
