/* Start:/local/templates/main/assets/css/pages/index.css?178539911910081*/
@import "/local/templates/main/assets/css/pages/tailwind.css";


:root {
    --green: #004746;
    --orange: #f04923;
    --gray: #414042;
    --light-gray: #E6E6E6;
    --border: #bdbfc6;
    --background: #F2F2F2;
    --text-black: #1E1E1E;
    --text-gray: #5D5E60;
    --text-light-gray: #959698;
}

html, body {
    overflow-x: hidden;
}

body {
    margin: 0;

    font-family: Geologica;
    font-weight: 300;
    line-height: 24px;
    letter-spacing: 0%;

    display: flex;
    flex-direction: column;

    background: var(--background);
    width: fit-content;

    /* max-width: 1920px; */
}

header {
    padding-top: 2%;
    padding-left: 6.5%;
    width: 100vw;
}

header img {
    height: 53px;
}

/* основной блок */
.main-block {
    background-image: var(--bg);
    background-position-x: center;
    background-size: cover;

    width: 100vw;
}

.main-block header a {
    display: block;

    width: fit-content;
}

.background-main {
    position: relative;

    display: flex;
    justify-content: center;
    
    width: 100%;
    /* height: 977px; */
    
    /* margin-top: 17%; */
    
    overflow: hidden;
}


.background-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.background-main svg {
    /* aspect-ratio: 1920 / 977; */
}

.title {
    position: relative;
    z-index: 1;

    gap: 66px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    justify-self: center;

    padding: 6% 18% 0% 18%;
}


.title-text {
    font-weight: 400;
    font-size: 66px;
    line-height: 70px;
    text-align: center;
}

.title-button {
    padding: 27px 32px;
    background: var(--orange);
    border-radius: 16px;
    border: none;

    display: flex;
    flex-direction: row;
    gap: 12px;

    align-items: center;
    justify-content: center;

    font-family: Geologica;
    font-weight: 300;
    font-size: 20px;
    line-height: 26px;
    letter-spacing: 0%;
    text-align: center;
    color: white;

    outline: none;
    transition: all 0.3;

    cursor: pointer;
}

.title-button img {
    width: 26px;
}

.title-button:hover {
    opacity: 0.9;
}

.blur {
    position: absolute;
    bottom: 0;

    z-index: 10;

    height: 141px;
    width: 100vw;
    
    margin-top: 36.5%;
    
    background: linear-gradient(180deg, rgba(242, 242, 242, 0) 0%, var(--background) 100%);
}

/* блок с карточками*/

.cards-block {
    display: flex;
    flex-wrap: wrap;
    column-gap: 24px;
    align-self: center;
    justify-content: center;

    margin-top: 100px;

    padding: 0 50px;
}

/* блок с материалами*/

.materials-block {
    clip-path: polygon(96.72% 1.283%, 96.72% 1.283%, 96.648% 1.047%, 96.57% 0.834%, 96.489% 0.643%, 96.403% 0.476%, 96.315% 0.333%,
            96.223% 0.215%, 96.129% 0.122%, 96.033% 0.055%, 95.935% 0.014%, 95.836% 0%, 0% 0%, 0% 100%, 100% 100%, 100% 14.588%, 100% 14.588%,
            99.996% 14.241%, 99.984% 13.899%, 99.965% 13.562%, 99.939% 13.232%, 99.905% 12.912%, 99.864% 12.601%, 99.816% 12.303%, 99.762% 12.017%,
            99.701% 11.746%, 99.634% 11.491%, 96.72% 1.283%);

    background: var(--gray);
    padding: 5% 14%;
    display: flex;
    flex-direction: column;
    align-items: center;

    width: 100vw;

    margin-top: 100px;

    gap: 66px;
}

.materials-info {
    text-align: center;
    color: white;
    display: flex;
    flex-direction: column;
    gap: 36px;

    align-items: center;




}

.materials-title {
    font-weight: 400;
    font-size: 66px;
    line-height: 66px;

}

.materials-text {
    font-size: 20px;
    line-height: 26px;

    font-weight: 200;

    width: 35vw;
}

.materials-cards-block {
    display: flex;
    flex-direction: row;
    gap: 24px;
}

.materials-card {
    clip-path: polygon(95.758% 6.39%, 95.758% 6.39%, 95.554% 5.217%, 95.336% 4.155%, 95.107% 3.206%,
            94.867% 2.373%, 94.618% 1.661%, 94.361% 1.071%, 94.097% 0.607%, 93.827% 0.272%, 93.552% 0.068%,
            93.274% 0%, 2.343% 0%, 2.343% 0%, 1.963% 0.19%, 1.602% 0.742%, 1.266% 1.624%, 0.959% 2.806%,
            0.686% 4.26%, 0.452% 5.955%, 0.261% 7.861%, 0.119% 9.948%, 0.031% 12.186%, 0% 14.545%, 0% 85.455%,
            0% 85.455%, 0.031% 87.814%, 0.119% 90.052%, 0.261% 92.139%, 0.452% 94.045%, 0.686% 95.74%, 0.959% 97.194%,
            1.266% 98.377%, 1.602% 99.259%, 1.963% 99.81%, 2.343% 100%, 97.657% 100%, 97.657% 100%, 98.037% 99.81%,
            98.398% 99.259%, 98.734% 98.377%, 99.041% 97.194%, 99.314% 95.74%, 99.548% 94.045%, 99.739% 92.139%,
            99.881% 90.052%, 99.969% 87.814%, 100% 85.455%, 100% 41.765%, 100% 41.765%, 99.989% 40.037%, 99.956% 38.331%,
            99.902% 36.654%, 99.827% 35.013%, 99.733% 33.415%, 99.618% 31.869%, 99.484% 30.38%, 99.331% 28.957%,
            99.16% 27.607%, 98.971% 26.337%, 95.758% 6.39%);

    background: rgba(255, 255, 255, 0.2);

    padding: 30px 46px;
    width: 35.8vw;

    display: flex;
    flex-direction: row;
    align-items: center;

    justify-content: space-between;
    font-size: 36px;
    line-height: 40px;
    color: white;


}


.materials-card-light {
    background: var(--background);

}

.materials-arrow {
    background: transparent;
    border: none;
    transition: all 0.3s;

    width: 50px;


}

.materials-card:hover .materials-arrow {
    opacity: 0.6;
}

.flex-column {
    display: flex;
    flex-direction: column;
}

.flex-row {
    display: flex;
    flex-direction: row;
}

.orange-text {
    color: var(--orange);
}

.white-text {
    color: white;
}

.dark-gray-text {
    color: var(--text-black);
}

@media screen and (max-width: 1800px) {
    .cards-block {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 1440px) {

    .materials-card {
        width: 43.6vw;
    }

    .materials-text {
        width: 40vw;
    }

    .title {
        padding: 6% 8% 0% 8%;

    }

    .blur {
        margin-top: 46%;

    }

    .main-block {
        height: 1300px;
    }

    .background-main {
        /* margin-top: 20%; */
        width: 100%;
    }

    /* .cards-block div:nth-child(1) {
        order: 0;
    }

    .cards-block div:nth-child(2) {
        order: 0;
    }

    .cards-block div:nth-child(3) {
        order: 2;
    }

    .cards-block div:nth-child(4) {
        order: 0;
    }

    .cards-block div:nth-child(5) {
        order: 0;
    }

    .cards-block div:nth-child(6) {
        order: 1;
    }

    .cards-block div:nth-child(7) {
        order: 0;
    }

    .cards-block div:nth-child(8) {
        order: 0;
    }

    .cards-block div:nth-child(9) {
        order: 2;
    } */
}


@media (max-width: 744px) {
    header {
        padding-left: 24px;
        padding-top: 16px;
    }


    header img {
        height: 32px;
    }

    .materials-info {
        gap: 16px;
    }

    .materials-title {
        font-weight: 400;
        font-size: 36px;
        line-height: 40px;

    }

    .materials-text {
        font-size: 16px;
        line-height: 24px;

        width: 50vw;
    }

    .materials-cards-block {
        flex-direction: column;
        gap: 16px;

        width: 100%;
    }

    .title-text {
        font-size: 40px;
        line-height: 50px;
    }

    .background-main {
        /* margin-top: 32%; */
        width: 100%;

    }

    .blur {
        margin-top: 89%;
    }

    .main-block {
        height: 1250px;
    }

    .materials-block {
        gap: 26px;
    }

    .materials-card {
        clip-path: polygon(94.367% 5.868%, 94.367% 5.868%, 94.119% 4.789%, 93.856% 3.813%, 93.579% 2.941%, 93.29% 2.177%,
                92.99% 1.523%, 92.68% 0.982%, 92.363% 0.556%, 92.038% 0.249%, 91.708% 0.063%, 91.374% 0%, 3.058% 0%, 3.058% 0%,
                2.562% 0.192%, 2.092% 0.75%, 1.653% 1.641%, 1.252% 2.837%, 0.896% 4.307%, 0.59% 6.021%, 0.341% 7.948%, 0.156% 10.058%,
                0.04% 12.321%, 0% 14.706%, 0% 85.294%, 0% 85.294%, 0.04% 87.679%, 0.156% 89.942%, 0.341% 92.052%, 0.59% 93.979%,
                0.896% 95.693%, 1.252% 97.163%, 1.653% 98.359%, 2.092% 99.25%, 2.562% 99.808%, 3.058% 100%, 96.942% 100%, 96.942% 100%,
                97.438% 99.808%, 97.909% 99.25%, 98.347% 98.359%, 98.748% 97.163%, 99.104% 95.693%, 99.41% 93.979%, 99.659% 92.052%,
                99.844% 89.942%, 99.96% 87.679%, 100% 85.294%, 100% 41.017%, 100% 41.017%, 99.986% 39.363%, 99.945% 37.73%, 99.877% 36.126%,
                99.784% 34.557%, 99.665% 33.031%, 99.521% 31.555%, 99.353% 30.137%, 99.162% 28.782%, 98.948% 27.5%, 98.712% 26.296%, 94.367% 5.868%);

        padding: 19px 26px;

        align-items: center;

        width: 100%;
    }

    .materials-card-text {
        font-size: 26px;
        line-height: 30px;
    }

    .materials-arrow {
        display: block;

        flex-shrink: 0;

        width: 36px;
        height: 36px;
    }
}

@media (max-width: 375px) {
    .title {
        padding: 66px 24px 0px 24px;
    }

    .title-text {
        font-size: 36px;
        line-height: 40px;
    }

    .title-button {
        padding: 18px 26px;
        font-family: Geologica;
        font-size: 18px;
        line-height: 24px;
    }

    .title-button img {
        width: 20px;
    }

    .background-main {
        display: none;
    }

    .main-block {
        height: 88vh;
    }

    .blur {
        margin-top: 7vh;
        height: 69px;
    }



    .materials-block {
        clip-path: polygon(91.208% 1.458%, 91.208% 1.458%, 90.835% 1.191%, 90.439% 0.948%, 90.022% 0.732%, 89.585% 0.542%, 89.132% 0.379%,
                88.663% 0.244%, 88.182% 0.139%, 87.69% 0.062%, 87.189% 0.016%, 86.682% 0%, 0% 0%, 0% 100%, 100% 100%, 100% 10.361%, 100% 10.361%,
                99.98% 9.967%, 99.92% 9.578%, 99.822% 9.195%, 99.686% 8.82%, 99.513% 8.456%, 99.304% 8.103%, 99.06% 7.763%, 98.781% 7.438%, 98.47% 7.13%,
                98.126% 6.84%, 91.208% 1.458%);
        padding: 46px 25px;
    }

    .materials-text {
        width: 90vw;
    }



    .materials-card {
        width: 85vw;
    }



    .materials-card-light {
        gap: 110px
    }

}
/* End */


/* Start:/local/templates/main/assets/css/components/main-page-card.css?17853991194011*/
.card-green {
    clip-path: polygon(9.052% 1.287%, 9.052% 1.287%, 9.31% 1.051%, 9.585% 0.837%, 9.874% 0.646%, 10.177% 0.478%, 10.491% 0.335%,
            10.816% 0.216%, 11.15% 0.122%, 11.491% 0.055%, 11.837% 0.014%, 12.189% 0%, 95.564% 0%, 95.564% 0%, 96.283% 0.058%,
            96.966% 0.224%, 97.602% 0.491%, 98.184% 0.848%, 98.701% 1.287%, 99.144% 1.8%, 99.505% 2.376%, 99.774% 3.006%, 99.942% 3.683%,
            100% 4.396%, 100% 95.604%, 100% 95.604%, 99.942% 96.317%, 99.774% 96.994%, 99.505% 97.624%, 99.144% 98.2%, 98.701% 98.713%,
            98.184% 99.152%, 97.602% 99.509%, 96.966% 99.776%, 96.283% 99.942%, 95.564% 100%, 4.436% 100%, 4.436% 100%, 3.717% 99.942%,
            3.034% 99.776%, 2.398% 99.509%, 1.816% 99.152%, 1.299% 98.713%, 0.856% 98.2%, 0.495% 97.624%, 0.226% 96.994%, 0.058% 96.317%,
            0% 95.604%, 0% 12.077%, 0% 12.077%, 0.014% 11.729%, 0.055% 11.385%, 0.123% 11.047%, 0.218% 10.717%, 0.338% 10.395%, 0.483% 10.083%,
            0.652% 9.784%, 0.845% 9.497%, 1.061% 9.225%, 1.299% 8.969%, 9.052% 1.287%);


    height: 546px;
    width: 541px;

    background: var(--green);
    background-image: url("/local/templates/main/assets/css/components/../../assets/img/cards_backgrounds/vector_green_card.svg");
    background-size: cover;

    position: relative;

    color: white;

    transition: all 0.3s;
}

.card-gray:hover {
    cursor: pointer;
}

.card-green:hover {
    cursor: pointer;
}


.card-gray {
    clip-path: polygon(9.052% 0.942%, 9.052% 0.942%, 9.31% 0.769%, 9.585% 0.613%, 9.874% 0.473%, 10.177% 0.35%,
            10.491% 0.245%, 10.816% 0.158%, 11.15% 0.09%, 11.491% 0.04%, 11.837% 0.01%, 12.189% 0%, 95.564% 0%, 95.564% 0%,
            96.283% 0.042%, 96.966% 0.164%, 97.602% 0.359%, 98.184% 0.621%, 98.701% 0.942%, 99.144% 1.317%, 99.505% 1.739%,
            99.774% 2.2%, 99.942% 2.695%, 100% 3.217%, 100% 96.783%, 100% 96.783%, 99.942% 97.305%, 99.774% 97.8%, 99.505% 98.261%,
            99.144% 98.683%, 98.701% 99.058%, 98.184% 99.379%, 97.602% 99.641%, 96.966% 99.836%, 96.283% 99.958%, 95.564% 100%, 4.436% 100%, 4.436% 100%,
            3.717% 99.958%, 3.034% 99.836%, 2.398% 99.641%, 1.816% 99.379%, 1.299% 99.058%, 0.856% 98.683%, 0.495% 98.261%, 0.226% 97.8%, 0.058% 97.305%,
            0% 96.783%, 0% 8.839%, 0% 8.839%, 0.014% 8.585%, 0.055% 8.333%, 0.123% 8.086%, 0.218% 7.844%, 0.338% 7.608%, 0.483% 7.38%, 0.652% 7.161%, 0.845% 6.951%,
            1.061% 6.752%, 1.299% 6.564%, 9.052% 0.942%);

    height: 746px;
    width: 541px;

    position: relative;

    color: var(--text-gray);

    background: var(--light-gray);
    background-image: url("/local/templates/main/assets/css/components/../../assets/img/cards_backgrounds/vector_gray_card.svg");
    background-size: cover;
    margin-bottom: 20px;
    transition: all 0.3s;
}


.card-info-block {
    display: flex;
    flex-direction: column;
    justify-content: end;

    padding-left: 46px;
    padding-bottom: 46px;
    padding-right: 66px;

    height: 100%;
    position: relative;
    z-index: 10;
}

.card-info-block-green {
    height: 100%;
}

.card-title {
    font-weight: 400;
    font-size: 34px;
    line-height: 40px;


    padding-bottom: 16px;
}

.card-text {
    font-weight: 300;
    font-size: 20px;

}

@media (max-width: 1439px) {
    .cards-block {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .card-gray, .card-green {
        margin-top: 0;
    }

    .card-gray {
        width: 100%;
        height: 450px;
    }

    .card-green {
        width: 100%;
        height: 330px;
    }

    .card-title {
        font-size: 26px;
        line-height: 30px;

        padding-bottom: 10px;
    }

    .card-text {
        font-size: 18px;
        line-height: 24px;
    }

    .card-info-block {
        padding: 26px;
        overflow-wrap: break-word;
    }
}

@media screen and (max-width: 743px ) {
    .cards-block {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 16px;

        padding: 0;
    }

    .card {
        width: calc(100% - 24px);
    }
}
/* End */


/* Start:/local/templates/main/assets/css/components/popup.css?17853991194897*/
.popup {
    position: fixed;
    z-index: 10;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    padding: 40px 40px 0 40px;
    background: rgba(0, 0, 0, 0.6);

    display: none;
}

html:has( .popup_opened), body:has( .popup_opened) {
    overflow-y: hidden;
}

.popup_opened {
    display: block;
}

.popup > * {
    margin: 0 auto;
}

.popup-header {
    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 114.35%), url("/local/templates/main/assets/css/components/../../assets/img/popups/safety_expertise_popup.png");
    border-top-right-radius: 24px;
    border-top-left-radius: 24px;
    background-size: cover;
    background-repeat: no-repeat;
    /* background-position: center, center -255px; */

    rotate: -180 deg;

    height: 448px;

    padding: 66px 140px;
}


.close-btn {
    background-color: transparent;
    border: none;

    top: 60px;
    right: 60px;
    position: absolute;

    transition: all 0.3s;

    width: 66px;
    height: 66px;
}

.close-btn :hover {
    border: none;
    cursor: pointer;

    opacity: 0.7;
}

.popup-header-text-block {
    font-size: 20px;
    font-weight: 200;
    line-height: 26px;
    color: white;

    margin-top: auto;
}

.popup-title {
    font-weight: 400;
    font-size: 66px;
    line-height: 70px;

    padding-bottom: 16px;
}

.popup-info-block {
    padding: 66px 140px;

    overflow-y: scroll;
    scrollbar-width: thin;
    scrollbar-color: var(--orange) white;

    background: white;

    height: 50%;
    gap: 10vw;
}

.popup-info-block::-webkit-scrollbar-thumb {
    border-radius: 10px;
}

.popup-info-block-title {
    font-weight: 400;
    font-size: 36px;
    line-height: 40px;

    color: var(--text-black);

    padding-bottom: 36px;
}

.popup-content-block {
    position: relative;

    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.list {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;

    /* height: 33vw; */
    width: 100%;

    column-gap: 8.5vw;
    row-gap: 16px;

    list-style: url("/local/templates/main/assets/css/components/../../assets/icons/list_marker.svg");
    padding-left: 15px;
}

.list-item {
    height: fit-content;

    padding-right: 4.5vw;

    font-weight: 300;
    font-size: 16px;
    line-height: 24px;
}

.popup-contact-card {
    position: sticky;
    top: 0;

    clip-path: polygon(4.906% 2.254%, 4.906% 2.254%, 5.079% 1.841%, 5.263% 1.466%,
            5.457% 1.131%, 5.66% 0.838%, 5.871% 0.586%, 6.09% 0.378%, 6.314% 0.214%, 6.544% 0.096%,
            6.777% 0.024%, 7.014% 0%, 97.043% 0%, 97.043% 0%, 97.522% 0.099%, 97.977% 0.385%,
            98.402% 0.842%, 98.789% 1.456%, 99.134% 2.211%, 99.429% 3.09%, 99.67% 4.079%,
            99.849% 5.162%, 99.961% 6.323%, 100% 7.547%, 100% 92.453%, 100% 92.453%, 99.961% 93.677%,
            99.849% 94.838%, 99.67% 95.921%, 99.429% 96.91%, 99.134% 97.79%, 98.789% 98.544%, 98.402% 99.158%,
            97.977% 99.615%, 97.522% 99.901%, 97.043% 100%, 2.957% 100%, 2.957% 100%, 2.478% 99.901%, 2.023% 99.615%,
            1.598% 99.158%, 1.211% 98.544%, 0.866% 97.79%, 0.571% 96.91%, 0.33% 95.921%, 0.151% 94.838%, 0.039% 93.677%,
            0% 92.453%, 0% 18.068%, 0% 18.068%, 0.009% 17.477%, 0.036% 16.893%, 0.081% 16.319%, 0.142% 15.756%,
            0.221% 15.209%, 0.315% 14.678%, 0.426% 14.167%, 0.552% 13.678%, 0.693% 13.213%, 0.849% 12.775%, 4.906% 2.254%);

    background-color: var(--green);

    /* width: 28.5vw; */
    max-width: 470px;
    height: fit-content;

    padding: 24px;

    font-weight: 200;
    color: white;
}

.popup-contact-card-title {
    font-size: 26px;
    line-height: 30px;
    font-weight: 300;
}

.popup-contact-block {
    display: flex;
    flex-direction: row;

    font-size: 16px;
    line-height: 24px;

    gap: 10px;
}

.popup-contact-text {
    font-weight: 300;
    font-size: 18px;
    line-height: 24px;
    text-decoration: none;

    padding-top: 8px;
}

.phones-block {
    display: flex;
    flex-direction: column;

    gap: 9px
}


@media (max-width: 1440px) {
    .popup-contact-text {
        font-size: 14px;
        line-height: 20px;
    }

    .popup-header {
        padding: 44px;
    }

    .popup-info-block {
        padding: 44px;
    }
}

@media (max-width: 744px) {
    .close-btn {
        width: 44px;
        height: 44px;
    }

    .popup-content-block {
        grid-template-columns: 1fr;
    }

    .popup-info-block {
        height: 60%;
    }

    .popup-header {
        height: 40%;

        background-position: center center;
        background-repeat: no-repeat;
    }
    
    .popup-title {
        font-size: 36px;
        line-height: 40px;

        padding-bottom: 10px;
    }
}

@media screen and (max-width: 400px) {
    .popup {
        padding-left: 0;
        padding-right: 0;
    }

    .close-btn {
        right: 22px;
    }

    .popup-header {
        padding: 16px;
    }

    .popup-info-block {
        padding: 16px;
    }
}
/* End */
/* /local/templates/main/assets/css/pages/index.css?178539911910081 */
/* /local/templates/main/assets/css/components/main-page-card.css?17853991194011 */
/* /local/templates/main/assets/css/components/popup.css?17853991194897 */