@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');



body {

    font-family: 'Jost', sans-serif;

    font-size  : 13pt;

    font-weight: 400;

}



body * {

    box-sizing: border-box;

}



.container {

    display  : block;

    width    : 1400px;

    max-width: 100%;

    margin   : 0px auto;

}



.block-menu {

    display        : flex;

    width          : 100%;

    padding        : 15px 5px;

    justify-content: space-between;

    align-items    : center;

}



.block-menu .logo {

    display: block;

    width  : 290px;
    max-width: 42vw;
    height: auto;

}



.block-menu .menu {

    display: flex;

}



.block-menu .menu li {

    margin: 5px 10px;

}



.block-menu .menu li a {

    color: rgb(255, 255, 255);

}



.block-menu .menu li a:hover {

    color: #E26F38;

}



.head-block {

    display            : block;

    background-image   : url(../images/bg-head.jpg);

    background-size    : cover;

    background-position: left -350px center;

}



.head-block .fon {

    width           : 100%;

    height          : 100%;

    padding         : 10px 20px 10px 20px;

    background-color: #0000007d;

    color           : #fff;

    min-height      : 700px;

    display         : flex;

    flex-wrap       : wrap;

    align-content   : space-between;

}



.head-block .fon h1 {

    margin: 30px auto;

}



.link_top {

    width          : 400px;

    max-width      : 100%;

    margin         : 30px auto;

    border         : none;

    background     : #b32d2e;

    border-radius  : 10px;

    font-weight    : 700;

    font-size      : 27px;

    line-height    : 40px;

    display        : flex;

    align-items    : center;

    text-align     : center;

    color          : #FFFFFF;

    padding        : 10px 20px;

    text-align     : center;

    justify-content: center;

    cursor         : pointer;

}



.link_top:hover {

    background: #c02b2b;

    color     : #FFFFFF;

}



.text-top {

    width     : 700px;

    max-width : 100%;

    margin    : 20px auto;

    text-align: center;

}



h1 {

    font-size  : 220%;

    font-weight: 600;

}



h4 {

    font-size  : 120%;

    font-weight: 400;

}



.content {

    padding: 40px 20px

}



.block-two {

    display        : flex;

    align-items    : stretch;

    justify-content: space-around;

}



.block-two .cont:nth-child(1) {

    width        : 55%;

    padding      : 80px 30px;

    padding-right: 60px;

}



.block-two .cont:nth-child(2) {

    width              : 45%;

    background-image   : url(../images/unsplash-tkcn-kfxu-1-au.jpg);

    background-size    : cover;

    background-position: center center;

}



.block-two .cont-img-right {

    width: 100%;

}



h3 {

    display    : block;

    font-weight: 700;

    font-size  : 140%;

    margin     : 15px auto;

}



.services-block {

    background-color: #d3652e21;

}



.services-block.services-block-two {

    background-color: #fff;

}



.services-block .flex-block {

    display: flex;

}



.services-block .flex-block .ittem {

    padding   : 15px;

    text-align: center;

}



.services-block .flex-block .ittem h3 {

    font-size: 112%;

}



.services-block .flex-block .ittem .img-bg-block {

    width              : 100%;

    height             : 60px;

    background-size    : 45px;

    background-position: center center;

    background-repeat  : no-repeat;

}



.services-block .flex-block .ittem:nth-child(1) .img-bg-block {

    background-image: url(../images/icon-cont-1.svg);

}



.services-block .flex-block .ittem:nth-child(2) .img-bg-block {

    background-image: url(../images/icon-cont-2.svg);

}



.services-block .flex-block .ittem:nth-child(3) .img-bg-block {

    background-image: url(../images/icon-cont-3.svg);

}



.services-block .flex-block .ittem:nth-child(4) .img-bg-block {

    background-image: url(../images/ittem-4.jpg);

}



.block-types-of-debt {

    display        : flex;

    align-items    : stretch;

    justify-content: space-around;

}



.block-types-of-debt .cont:nth-child(1) {

    width        : 65%;

    padding-right: 40px;

}



.block-types-of-debt .cont:nth-child(2) {

    width              : 35%;

    background-image   : url(../images/types-of-debt-img.jpg);

    background-size    : cover;

    background-position: center center;

}



.flex-block-doc {

    display  : flex;

    flex-wrap: wrap;

}



.flex-block-doc .ittem {

    background-size    : 60px;

    background-repeat  : no-repeat;

    background-position: left 5px center;

    padding-left       : 70px;

    width              : 50%;

    padding-right      : 15px;

    margin             : 25px auto

}



.flex-block-doc .ittem:nth-child(1) {

    background-image: url(../images/types-of-debt-1.svg);

}



.flex-block-doc .ittem:nth-child(2) {

    background-image: url(../images/types-of-debt-2.svg);

}



.flex-block-doc .ittem:nth-child(3) {

    background-image: url(../images/types-of-debt-3.svg);

}



.flex-block-doc .ittem:nth-child(4) {

    background-image: url(../images/types-of-debt-4.svg);

}



.flex-block-doc h4 {

    font-weight: 500;

}





.block-about-us {

    display         : flex;

    align-items     : stretch;

    justify-content : space-around;

    background-color: #d3652e21;

    flex-direction  : column;

}



.block-about-us .cont:nth-child(1) {

    /* display               : flex;

    flex-wrap             : wrap;

    width                 : 50%;

    padding               : 40px 30px;

    justify-content       : flex-start;

    align-content         : center; */

    /* background-image   : url(../images/about-us-img.jpg);

    background-size       : cover;

    background-position   : center center; */



}



.block-about-us .cont:nth-child(1) h3 {

    text-align : left;

    margin-left: 0px;

}



/* .block-about-us .cont:nth-child(2) {

    display     : flex;

    flex-wrap   : wrap;

    width       : 50%;

    padding     : 40px 30px;

    padding-left: 40px;

} */



.block-about-us .cont:nth-child(2) p {

    /* display            : flex;

    margin             : 10px auto;

    padding-left       : 35px;

    background-image   : url(../images/check.svg);

    background-position: left 5px center;

    background-size    : 25px;

    background-repeat  : no-repeat;

    align-items        : center; */

}





.contact {

    display: flex;

}



.contact .cont {

    width  : 50%;

    padding: 30px

}



.contact .cont {

    width  : 50%;

    padding: 30px

}



a:hover {

    color: #E26F38;

}



.footer-block {

    display         : block;

    min-height      : 50px;

    margin          : 40px auto auto auto;

    width           : 100%;

    background-color: #333a44;

}



.contact .cont a {

    color: #E26F38;



}



.contact .cont h4 {

    margin: 10px auto;

}



.phone-link {

    display            : block;

    padding-left       : 30px;

    background-image   : url(../images/phone.svg);

    background-position: left -4px center;

    background-size    : 30px;

    background-repeat  : no-repeat;

}



.email-link {

    display            : block;

    padding-left       : 35px;

    background-image   : url(../images/email.svg);

    background-position: left center;

    background-size    : 20px;

    background-repeat  : no-repeat;

}



.footer-block a {

    color  : #fff;

    display: table;

    margin : 10px auto;

}



.footer-block a:hover {

    color: #E26F38;

}



.footer-block {

    color  : #fff;

    display: table;

}



.privacy p {

    margin : 20px auto;

    display: block;

}



.privacy h4 {

    margin     : 20px auto;

    display    : block;

    font-weight: 700;

}



.privacy ul {

    margin : 20px auto;

    display: block;

}



.privacy ul li {

    margin      : 10px auto;

    display     : block;

    padding-left: 20px;

}





.h3-form {

    width         : 100%;

    display       : block;

    font-weight   : 700;

    font-size     : 140%;

    margin        : 15px auto;

    text-transform: uppercase;

    text-align    : center;

}



.little-text {

    display   : block;

    font-size : 80%;

    text-align: center;

    margin-top: 100px;

}



.container-form {

    display  : block;

    width    : 500px;

    margin   : 40px auto;

    max-width: 100%;

}



.container-form form .form-row {

    display: flex;

    margin : 15px 0;

}



.container-form form .form-row.half .input-data {

    width : calc(50% - 10px);

    margin: 0;

}



.container-form form .form-row.half {

    justify-content: space-between;

}



.container-form form .form-row.full {

    flex-wrap: wrap;

}



.container-form form .form-row.full .input-data:nth-child(1) {

    margin-bottom: 15px;

}



.container-form form .form-row .input-data {

    width   : 100%;

    height  : 40px;

    margin  : 0 auto;

    position: relative;

}



.container-form form .form-row .textarea {

    height: 70px;

}



.container-form .input-data input,

.container-form .textarea textarea {

    display      : block;

    width        : 100%;

    height       : 100%;

    border       : none;

    font-size    : 17px;

    border-bottom: 1px solid rgba(0, 0, 0, 0.12);

}



.container-form .input-data input:focus-visible {

    border       : none;

    outline-width: 0;

}



.container-form .input-data input:focus~label,

.container-form .textarea textarea:focus~label,

.container-form .input-data input:valid~label,

.container-form .textarea textarea:valid~label {

    transform: translateY(-20px);

    font-size: 14px;

    color    : #3498db;

}



.container-form .textarea textarea {

    resize     : none;

    padding-top: 10px;

}



.container-form .input-data label {

    position      : absolute;

    pointer-events: none;

    bottom        : 10px;

    font-size     : 16px;

    transition    : all 0.3s ease;

}



.container-form .textarea label {

    width     : 100%;

    bottom    : 40px;

    background: #fff;

}



.container-form .input-data .underline {

    position: absolute;

    bottom  : 0;

    height  : 1px;

    width   : 100%;

}



.container-form .input-data .underline:before {

    position        : absolute;

    content         : "";

    height          : 1px;

    width           : 100%;

    background      : #3498db;

    transform       : scaleX(0);

    transform-origin: center;

    transition      : transform 0.3s ease;

}



.container-form .input-data input:focus~.underline:before,

.container-form .input-data input:valid~.underline:before,

.container-form .textarea textarea:focus~.underline:before,

.container-form .textarea textarea:valid~.underline:before {

    transform        : scale(1);

    -webkit-transform: scale(1);

    -moz-transform   : scale(1);

    -ms-transform    : scale(1);

    -o-transform     : scale(1);

}



.container-form .submit-btn .input-data {

    overflow: hidden;

    height  : 45px !important;

    width   : 25% !important;

}



.container-form .submit-btn .input-data .inner {

    height    : 100%;

    width     : 300%;

    position  : absolute;

    left      : -100%;

    background: -webkit-linear-gradient(right, #56d8e4, #9f01ea, #56d8e4, #9f01ea);

    transition: all 0.4s;

}



.container-form .submit-btn .input-data:hover .inner {

    left: 0;

}



.container-form .submit-btn .input-data input {

    background    : none;

    border        : none;

    color         : #fff;

    font-size     : 17px;

    font-weight   : 500;

    text-transform: uppercase;

    letter-spacing: 1px;

    cursor        : pointer;

    position      : relative;

    z-index       : 2;

}



@media (max-width: 700px) {

    .container-form .text {

        font-size: 30px;

    }



    .container-form form {

        padding: 10px 0 0 0;

    }



    .container-form form .form-row {

        display: block;

    }



    .container-form form .form-row .input-data {

        margin: 35px 0 !important;

        width : 100%;

    }



    .container-form form .form-row.half .input-data {

        width: 100%;

    }



    .container-form .submit-btn .input-data {

        width: 40% !important;

    }

}



.input-botton {

    width          : 100%;

    margin         : 30px auto;

    border         : none;

    background     : #E26F38;

    border-radius  : 10px;

    font-weight    : 700;

    font-size      : 27px;

    line-height    : 40px;

    display        : flex;

    align-items    : center;

    text-align     : center;

    color          : #FFFFFF;

    padding        : 10px 20px;

    text-align     : center;

    justify-content: center;

    cursor         : pointer;



}



.input-botton.tel-button {

    width          : 450px;

    max-width      : 100%;

    text-decoration: none;

}



.input-botton:hover {

    background: #a84b1f;

}



.input-botton:active {

    background: #f17c46;

}



.contact.form {

    display  : flex;

    flex-wrap: wrap;

}



.block-about-us .cont:nth-child(2) h3 {

    width: 100%;

}



/* .block-about-us .cont:nth-child(2) p {

    width: 50%;

} */



.link_cont {

    width          : 400px;

    max-width      : 100%;

    margin-top     : 30px;

    border         : none;

    background     : #b32d2e;

    border-radius  : 10px;

    font-weight    : 500;

    font-size      : 27px;

    line-height    : 40px;

    display        : flex;

    align-items    : center;

    text-align     : center;

    color          : #FFFFFF;

    padding        : 10px 20px;

    text-align     : center;

    justify-content: center;

    cursor         : pointer;

}



.link_cont:hover {

    color: #FFFFFF;

}



.contru_link {

    background-image   : url(../images/cobtry.svg);

    background-repeat  : no-repeat;

    background-position: left;

    padding-left       : 30px;

}



.ratings {

    font-size: 35px;

    color    : #ffcc00;

}



.features {

    display        : flex;

    flex-wrap      : wrap;

    width          : 100%;

    justify-content: space-around;

    margin-bottom  : 20px;

    gap            : 10px;



}



.features .span_f {

    display            : flex;

    width              : 230px;

    padding-left       : 50px;

    background-repeat  : no-repeat;

    background-position: left center;

    background-size    : 40px;

    align-items        : center;

}



.features .span_f:nth-child(1) {

    background-image: url(../images/ic-twotone-plumbing.svg);

}



.features .span_f:nth-child(2) {

    background-image: url(../images/top-icon-2.svg);

}



.features .span_f:nth-child(3) {

    background-image: url(../images/material-symbols-e-911-emergency.svg);

}



.features .span_f:nth-child(4) {

    background-image: url(../images/top-icon-4.svg);

}



.features .span_f:nth-child(5) {

    background-image: url(../images/top-icon-5.svg);

}





.comment-slider {

    width           : 820px;

    max-width       : 100%;

    margin          : auto;

    background-color: #b32d2e;

    padding         : 40px;

    border-radius   : 10px;

    text-align      : center;

    position        : relative;

    overflow        : hidden;

    /* Скрывает элементы, которые выходят за границы контейнера */

}



.comment-slider h2 {

    color        : white;

    font-weight  : bold;

    margin-bottom: 30px;

}



.comments {

    display   : flex;

    transition: transform 0.5s ease-in-out;



}



.comment {

    min-width      : 100%;

    /* Устанавливаем ширину каждого комментария равной ширине контейнера */

    box-sizing     : border-box;

    /* Учитываем padding и border в ширине и высоте */

    color          : white;

    opacity        : 0;

    /* Делаем комментарии невидимыми по умолчанию */

    transition     : opacity 0.5s ease-in-out;

    /* Плавный переход для видимости */

    display        : flex;

    flex-direction : column;

    align-items    : center;

    justify-content: center;

}



.stars {

    font-size    : 24px;

    color        : #ffcc00;

    /* Жёлтый цвет для звёзд */

    margin-bottom: 15px;

}



.comment p {

    font-size    : 18px;

    line-height  : 1.5;

    margin-bottom: 20px;

}



.comment footer {

    font-weight: bold;

    color      : #ffcc00;

    /* Жёлтый цвет для имени */

    font-size  : 16px;

}



.comment-slider button {

    position        : absolute;

    top             : 35px;

    transform       : translateY(-50%);

    background-color: #ffcc00;

    color           : white;

    border          : none;

    padding         : 5px 10px;

    cursor          : pointer;

    border-radius   : 5px;

    z-index         : 1000;

    text-transform  : uppercase;

}



.prev {

    left: 10px;

}



.next {

    right: 10px;

}



.comment-slider button:hover {

    background-color: #ff9900;

}



.disclaimer {

    font-size : 80%;

    margin    : 20px auto;

    text-align: center;

    padding   : 10px;

}



.disclaimer a {

    display: inline-block;

}



.hero-section {

    background-color: #333a44;

    width           : 100%;

    max-width       : 100%;

    padding         : 60px 20px;

    text-align      : center;

    position        : relative;

    color           : white;

}



.hero-content {

    position: relative;

    z-index : 2;

}



.highlight-text {

    color      : white;

    display    : inline-block;

    padding    : 10px 20px;

    font-size  : 30px;

    font-weight: bold;

}



.hero-content h1 {

    font-size: 30px;

    margin   : 20px 0;

    color    : #d0d0d0;

}



.hero-content .cta-button {

    background-color: #b32d2e;

    /* Синий фон для кнопки */

    color           : white;

    padding         : 10px 20px;

    text-decoration : none;

    font-weight     : bold;

    border-radius   : 5px;

    display         : inline-block;

    transition      : background-color 0.3s ease;

    margin-top      : 20px;

    width           : 400px;

    max-width       : 100%;

}



.hero-content .cta-button:hover {

    background-color: #c63131;

    /* Темнее синий для эффекта наведения */

}



.footer-container {

    display         : flex;

    justify-content : space-between;

    align-items     : flex-start;

    padding         : 110px 20px 20px 20px;

    background-color: white;

}



.footer-logo {

    flex: 1;

}



.logo-placeholder {

    width           : 150px;

    height          : 100px;

    background-color: #d3d3d3;

    display         : flex;

    justify-content : center;

    align-items     : center;

    color           : black;

    font-size       : 20px;

}



.footer-links {

    display        : flex;

    flex           : 2;

    justify-content: flex-start;

    gap            : 140px;

}



.footer-column {

    text-align: left;

}



.footer-column h3 {

    margin-top   : 0;

    margin-bottom: 10px;

    font-size    : 18px;

    color        : #333;

    font-weight  : bold;

}



.footer-column ul {

    list-style-type: none;

    padding        : 0;

}



.footer-column li {

    margin-bottom: 5px;

}



.footer-column a {

    text-decoration: none;

    color          : #777777;

}



.footer-column a:hover {

    text-decoration: underline;

}



.logo-footer {

    width: 300px;
    max-width: 80vw;
    height: auto;

}



/**

* Modal v1.0

*/

.modal {

    display         : none;

    position        : fixed;

    z-index         : 999999;

    padding-top     : 30px;

    left            : 0;

    top             : 0;

    width           : 100%;

    height          : 100%;

    overflow        : auto;

    background-color: rgb(0, 0, 0);

    background-color: rgba(0, 0, 0, 0.4);

}





.modal-content {

    background-color: #fefefe;

    margin          : auto;

    padding         : 20px;

    border          : 1px solid #888;

    width           : 80%;

}



.modal-content p {

    margin: 10px auto;

}



.modal-content h2 {

    font-size  : 120%;

    font-weight: 500;

}



.modal-content ul {

    margin         : 15px auto;

    list-style-type: disc;

}



.modal-content ul li {

    margin         : 5px auto;

    list-style-type: disc;

    margin-left    : 30px;

}





.close {

    color      : #aaaaaa;

    float      : right;

    font-size  : 28px;

    font-weight: bold;

    padding    : 0 14px;

}



.close:hover,

.close:focus {

    color          : #000;

    text-decoration: none;

    cursor         : pointer;

}



.modal .cta-button {

    background-color: #b32d2e;

    color           : white;

    padding         : 10px 20px;

    text-decoration : none;

    font-weight     : bold;

    border-radius   : 5px;

    display         : inline-block;

    transition      : background-color 0.3s ease;

    margin-top      : 20px;

    max-width       : 100%;

}



.cont_we-pro {

    display  : flex;

    flex-wrap: wrap;

}



.cont_we-pro .cont {

    display        : flex;

    flex-wrap      : wrap;

    width          : 33%;

    padding        : 40px 30px;

    justify-content: flex-start;

    align-content  : center;

    flex-direction : column;

}



.block-about-us .cont p {

    display               : flex;

    margin                : 10px auto;

    /* padding-left       : 35px;

    background-image      : url(../images/check.svg);

    background-position   : left 5px center; */

    background-size       : 25px;

    background-repeat     : no-repeat;

    align-items           : center;

    width                 : 100%;

}



.cont_we-pro .cont h4 {

    width           : 100%;

    font-size       : 120%;

    font-weight     : 500;

    background-color: wheat;

}



.ogr-width {

    width    : 650px;

    max-width: 100%;

}



.ogr-width.cont p {

    background-image: none;

}



.ogr-width.cont h3 {

    padding-left: 35px;

}



.img-bg-block {

    width              : 100%;

    height             : 230px;

    background-size    : cover;

    background-position: center center;

    background-repeat  : no-repeat;

    margin-bottom      : 15px;

}



.ogr-width.cont p {

    padding-left: 35px;

}



@media screen and (max-width: 830px) {

    .block-about-us .cont {

        padding: 10px;

    }

}