@font-face {
    font-family: 'MontserratMedium';
    src: url('Montserrat-Medium.otf') format('opentype');
    font-weight: normal; /* Or specify 'bold', 'light', etc. if applicable */
    font-style: normal;  /* Or specify 'italic' if applicable */
    font-display: swap; /* Recommended for better performance */
}

@font-face {
    font-family: 'MontserratSemiBold';
    src: url('Montserrat-SemiBold.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'MontserratBold';
    src: url('Montserrat-Bold.otf') format('opentype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

* { margin: 0; padding: 0; }

html { height: 100%; }

body { background-image: url("desktop_01.jpg"); background-size: cover; background-position: center center; background-repeat: no-repeat; height: 100%; }
.page-wrapper { max-width: 1280px; margin: 0 auto; }
.content-wrapper { margin: 0 20px; }
.content-block { max-width: 700px; margin-top: 150px; }

    .logo-item {}
        .logo-item img { width: 180px; }

    .title-item { margin-top: 40px; }
        .title-item__text { font-family: "MontserratBold"; font-size: 36px; text-transform: uppercase; }

    .text-item { margin-top: 30px; }
        .text-item__text { font-family: "MontserratBold"; font-size: 19px; line-height: 26px; }

    .list-item { margin-top: 40px; }
        .list-item__list { font-family: "MontserratMedium"; font-size: 16px;  }
            .list-item__list li { display: inline-table; line-height: 25px; width: 47%; }

    .buttons-item { margin-top: 60px; }
        .buttons-item__element { display: inline; margin-right: 25px; }
            .buttons-item__element .buttons-item__link {
                background-color: rgba(255, 56, 51, 1);
                border-radius: 10px;
                color: #ffffff;
                font-family: "MontserratMedium";
                font-size: 16px;
                padding: 14px 20px;
                text-decoration: none;
            }
            .buttons-item__element .buttons-item__link:hover {}

@media all and (max-width: 1200px) { 
    body { background-image: url("tablet_01.jpg"); }
}

@media all and (max-width: 900px) { 
    .content-block { width: 75%; }
}

@media all and (max-width: 850px) { 
    .content-block { margin-top: 50px; }
    .list-item__list li { width: 100%; }
}

@media all and (max-width: 750px) { 
    html { height: unset; }
    body { background-image: url("mobile_01.jpg"); background-position: bottom center; height: unset; }
    .content-block { width: 100%; margin-top: 20px; }
    .logo-item { text-align: center; }
    .title-item { margin-top: 30px; }
    .title-item__text { font-size: 28px; text-align: center; }
    .text-item__text { font-family: "MontserratSemiBold"; font-size: 16px; line-height: 22px; }
    .list-item { margin-top: 30px; }
    .buttons-item { text-align: center; }
    .buttons-item__element { display: block; margin-bottom: 50px; }
}