.montserrat-thin-20 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 100;
    /* Соответствует "Thin" */
    font-size: 20px;
}

/* --- Стили для Заголовков (Playfair Display) --- */

/* 1. Playfair Display, bold, 36 */
.style-h1 {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    /* bold */
    font-size: 36px;
}

/* 2. Playfair Display, bold, 30 */
.style-h2 {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    /* bold */
    font-size: 30px;
}

/* --- Стили для Текста и Кнопок (Montserrat) --- */

/* 3. Montserrat, regular, 18 */
.style-text-lg {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    /* regular */
    font-size: 18px;
}

/* 4. Montserrat, regular, 16 */
.style-text-md {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    /* regular */
    font-size: 16px;
}

/* 5. Montserrat, bold, 20 (Например, большая кнопка) */
.style-button-lg {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    /* bold */
    font-size: 20px;
}

/* 6. Montserrat, bold, 16 (Например, ссылки или маленькая кнопка) */
.style-button-md {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    /* bold */
    font-size: 16px;
}

/* 7. Montserrat, bold, 14 (Мелкий текст) */
.style-caption {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    /* bold */
    font-size: 14px;
}

body {
    background-color: #F4F4F4;
}

.headerLogoContainer {
    flex-direction: column;
    margin-top: 50px;
    display: flex;
    align-items: center;
    justify-content: center;

}

.logoHead {
    margin-bottom: 10px;
}

.textHeadLogo {
    text-align: center;
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    /* regular */
    font-size: 18px;
    margin-top: 5px;
    margin-bottom: 5px;
}

.headerMainContainer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

}

.imgMainPage {
    margin-top: 50px;
    width: 100%;

}

.underImg {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    /* bold */
    font-size: 36px;
    text-align: center;
}

.conteinerMainFoto {
    background-color: #F4F4F4;
    width: 46%;
    display: flex;
    flex-direction: column;
    margin: 0 auto;
    position: relative;
    align-items: center;
    margin-bottom: 0px;
    height: auto;
}


.conteinerFotoOne {
    display: flex;
    justify-content: end;
    max-width: 350px;
    max-height: 400px;
    background-color: #FFFFFF;
    flex-direction: column;
    border-radius: 10px;
    transition: all 0.3s ease;
    cursor: pointer;
}


.textCardHeder {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-align: center;
    text-transform: uppercase;
    color: #888888;
    margin-bottom: 5px;

}

.textCardMidle {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    font-size: 30px;
    text-align: center;
    margin-top: 10px;
    margin-bottom: 10px;
}

.textCardUnderMidle {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 16px;
    text-align: center;
    margin-top: 0px;
    margin-bottom: 5px;
}

.textCardUnder {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 16px;
    text-align: center;
    margin-top: 0px;
}

.sectionRowOne {
    justify-content: center;
    align-items: center;
    display: flex;
    margin-top: 30px;

}

.conteinerFotoTwo {
    margin-bottom: 0px;
    padding: 0px;

}

.fototwo {
    max-width: 350px;
    max-height: 400px;
}

.fotoThree {
    border-radius: 10px;
 max-width: 500px;
    max-height: 500px;
}

.conteinerFotoThree {
    background-color: #FFFFFF;
    border-radius: 10px;
    margin-left: 15px;

}

.foto4 {
    border-radius: 10px;
    max-width: 350px;
    max-height: 400px;
}


.foto5 {
    border-radius: 10px;
 max-width: 500px;
    max-height: 500px;
}

.conteinerFoto5 {
    background-color: #FFFFFF;
    border-radius: 10px;

    margin-right: 15px;
}

.foto6 {
    border-radius: 10px;
 max-width: 500px;
    max-height: 500px;
}

.conteinerFoto6 {
    margin-top: 30px;
    border-radius: 10px;
    background-color: #FFFFFF;
    display: flex;

    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-left: 10px;
    max-width: 350px;
    max-height: 400px;
}

.foto7 {
    border-radius: 10px;
    max-width: 350px;
    max-height: 400px;
}

.conteinerFoto7 {
    border-radius: 10px;
    align-self: flex-start;
}

.foto8 {
    border-radius: 10px;
 max-width: 500px;
    max-height: 500px;
}

.conteinerFoto8 {
    border-radius: 10px;
    background-color: #FFFFFF;
    flex-direction: column;
    border-radius: 10px;
    margin-left: 15px;
}

.conteinerFoto9 {
    align-self: flex-start;
    margin-right: 15px;
    border-radius: 10px;
    background-color: #FFFFFF;
    padding-bottom: 112px;
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
}

.foto9 {
    border-radius: 10px;
 max-width: 500px;
    max-height: 500px;
}

.natashaFoto {
    border-radius: 50px;
    width: 100px;
    height: 100px;
    margin: 0 auto;

}

.reviewTop {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 20px;
    margin-bottom: 9px;

}

.textReviewMidle {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 14px;
    margin-top: 0px;
}

.conteinerOneRiview {
    background-color: rgb(255, 255, 255);
      min-width: 300px;
    min-height: 400px;
    justify-content: center;
    display: flex;
    text-align: center;
    border-radius: 10px;
    align-self: flex-end;
}

.leftArrow {

    width: 23px;
    height: 23px;
    display: flex;
    margin-top: 332px;
    margin-left: 20px;
    align-items: center;
    justify-content: center;

}

.rightArrow {

    width: 23px;
    height: 23px;
    display: flex;
    margin-top: 332px;
    margin-right: 20px;
    align-items: center;
    justify-content: center;

}

.contaiterTwoReview {
    background-color: #ffffff;
    height: 548px;
    align-items: center;
    margin: 0 auto;
    display: flex;
}

.textReviewMidleUnder {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 14px;
    margin-top: 3px;
    margin-bottom: 3px;
}

.conteinerFoto10 {
    justify-content: center;
    align-items: center;
    text-align: center;
    display: flex;
    background-color: #FFFFFF;
    flex-direction: column;

}


.foto12 {
    border-radius: 10px;
 max-width: 500px;
    max-height: 500px;
}

.conteinerFoto12 {
    background-color: rgb(255, 255, 255);
    justify-content: center;
    display: flex;
    flex-direction: column;
    text-align: center;
    border-radius: 10px;
    align-self: flex-start;
    margin-left: 15px;
  
}
.conteinerFotoOne,
.conteinerFotoThree,
.conteinerFoto5,
.conteinerFoto6,
.conteinerFoto8,
.conteinerFoto9,
.conteinerFoto12,
.conteinerOneRiview {
    transition: all 0.3s ease;
    cursor: pointer;
    overflow: hidden;
}

.conteinerFotoOne:hover,
.conteinerFotoThree:hover,
.conteinerFoto5:hover,
.conteinerFoto6:hover,
.conteinerFoto8:hover,
.conteinerFoto9:hover,
.conteinerFoto12:hover,
.conteinerOneRiview:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
}

.conteinerFotoOne img,
.conteinerFotoThree img,
.conteinerFoto5 img,
.conteinerFoto6 img,
.conteinerFoto8 img,
.conteinerFoto9 img,
.conteinerFoto12 img {
    transition: all 0.3s ease;
}

.conteinerFotoOne:hover img,
.conteinerFotoThree:hover img,
.conteinerFoto5:hover img,
.conteinerFoto6:hover img,
.conteinerFoto8:hover img,
.conteinerFoto9:hover img,
.conteinerFoto12:hover img {
    transform: scale(1.05);
    filter: brightness(0.9);
}

.textCardMidle {
    transition: all 0.3s ease;
}

.conteinerFotoOne:hover .textCardMidle,
.conteinerFotoThree:hover .textCardMidle,
.conteinerFoto5:hover .textCardMidle,
.conteinerFoto6:hover .textCardMidle,
.conteinerFoto8:hover .textCardMidle,
.conteinerFoto9:hover .textCardMidle,
.conteinerFoto12:hover .textCardMidle {
    transform: scale(1.05);
} 
.galereuContainer {
    margin-top: 0px;
 
    background-color: #F4F4F4;
    display: flex;
    margin: 0 auto;
    margin-top: 100px;
    text-align: center;
    flex-direction: column;
}

.M {
    width: 90px;
    height: 90px;
    border-radius: 50px;
    background-color: black;
    color: #171717;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    margin-bottom: 0px;

}

.vector {
    width: 53px;
    height: 36px;
    margin-top: 25px;
    justify-content: center;
    align-items: center;
    margin-bottom: 0px;
}

.contact {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    /* bold */
    font-size: 36px;
    margin-top: 7px;
    margin-bottom: 15px;
}

.textCardUnderMidleGalerey {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 16px;
    text-align: center;
    margin-bottom: 0px;
    margin-top: 8px;
}
.galereuFotoImg{
  
max-width: 900px;
}
.conteinerFoto13 {
    margin-top: 0px;
    background-color: #F4F4F4;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.containerServis {
    background-color: black;
    color: white;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    padding-bottom: 50px;
    margin-bottom: 60px;
    
}
.fotoServis{
    max-width: 900px;
}
.textServisHerader {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    /* bold */
    font-size: 36px;
    margin-top: 50px;
    margin-bottom: 15px;
}

.textCardUnderMidleServis {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 18px;
    text-align: center;
    margin-bottom: 0px;
    margin-top: 8px;
}

.textCardUnderUnderServis {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 18px;
    text-align: center;
    margin-bottom: 50px;
    margin-top: 8px;
}

.clients {
    background-color: #F4F4F4;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.textClients {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    /* bold */
    font-size: 36px;
    margin-top: 7px;
    margin-bottom: 0px;
}

.clientsFoto {
    margin-top: 40px;
}

.textButtonClients {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    /* bold */
    font-size: 16px;
    margin-top: 70px;
    margin-bottom: 9px;
}

.buttonClients {
    margin-top: 0px;
    width: 16px;
    height: 10px;
    background-color: rgb(0, 0, 0);
}

.sectionRowImg {
    margin-top: 50px;
    width: 100%;
}

.textUnderConteiner {
    align-items: center;
    justify-content: center;
    display: flex;
    flex-direction: column;
    margin-top: 30px;
}

.mainFooterTextTall {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    /* bold */
    font-size: 36px;
    margin-top: 50px;
    margin-bottom: 13px;
}

.mainFooterText {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    /* regular */
    font-size: 20px;
    margin-top: 0px;
    margin-bottom: 5px;
}

.footerButton {
    width: 135px;
    height: 46px;
    margin-top: 20px;
    margin-bottom: 70px;

}
.contactTime{
  display: flex;
  justify-content: flex-end;
}
.emailContainer {
    align-items: center;
    justify-content: center;
    align-self: center;
    display: flex;
    background-color: black;
    height: 197px;
}

.footerTextUnder {
    margin-right: 50px;

}

.emailText {
    color: white;
}

.footerTextMain {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    /* bold */
    font-size: 36px;
    margin-bottom: 0px;
}

.footerTextUnder {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    /* regular */
    font-size: 18px;
    margin-top: 5px;
}

.inputEmail {
    color: white;
    border: 0px;
    border-bottom: #D8D8D8 solid 1px;
    background-color: rgba(255, 255, 255, 0);
    margin-right: 25px;
    margin-top: 15px;
    width: 503px;
    height: 52px;
}

.buttonEmail {
    width: 114px;
    height: 56px;
    background-color: rgb(0, 0, 0);
    border: #D8D8D8 solid 1px;
    color: white;
}

.timeOneTall {
    margin: 0 auto;
    width: 1200px;
    height: 300px;
    margin-top: 50px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.logoFooter {
    display: flex;
    align-self: flex-start;
    align-items: flex-start;
    justify-content: center;
}

.footerTextTime {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    /* bold */
    font-size: 20px;
    margin-bottom: 5px;
    margin-top: 0px;
}

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

.clockFoto {
    width: 64px;
    height: 64px;
    margin-top: 20px;
}

.footerTextTimeTallMain {
    font-family: 'Montserrat', sans-serif;
    font-weight: 100;
    /* Соответствует "Thin" */
    font-size: 20px;
    margin-bottom: 5px;
    margin-top: 0px;
}

.footerTextTimeMain {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    /* regular */
    font-size: 14px;
    margin-bottom: 5px;
    margin-top: 0px;
}

.footerTextTimeUnder {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    /* regular */
    font-size: 14px;
    margin-bottom: 20px;
    margin-top: 0px;
}

.containerTimeOneTall {
    display: flex;
    justify-content: left;
    align-items: start;
    width: 600px;
    height: 244px;
    margin-left: 360px;
}

.footerTextTimeMainTwo {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    /* regular */
    font-size: 13px;
    margin-bottom: 5px;
    margin-top: 0px;
}

.clockFotoTwo {
    width: 64px;
    height: 64px;
    margin-top: 40px;
    margin-right: 10px;
}

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

.contact {
    display: flex;
    flex-direction: column;
    margin-left: 60px;
}

.textContactTall {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    /* bold */
    font-size: 20px;
    margin-bottom: 0px;
}

.textContact {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    /* regular */
    font-size: 14px;
    margin-bottom: 20px;
}

.footerText {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    /* regular */
    font-size: 12px;
    margin-bottom: 20px;
}

footer {
    display: flex;
    background-color: black;
    height: 46px;
    justify-content: center;
    text-align: center;
    color: white;
}





@media (max-width: 768px) {

    .headerMainContainer {
        height: 130px;
        width: 100%;
        margin: 0 auto;
        display: flex;
    }

    .logoHead {
        width: 90%;
        max-width: 90%;
        margin: 0px;
    }
.galereuFotoImg{
    display: none;
}
    .imgMainPage {

        display: none;
    }
.containerServis{
    margin-top: 40px;
}
    .underImg {
        margin: 100px;
    }

    .conteinerMainFoto {
        width: 90%;
        align-items: center;
        justify-content: center;
        margin: 0 auto;
    }

    .conteinerFotoOne {
        padding: 0;
    }

    .fotoOne {
        display: block;
        width: 100%;
        max-width: 100%;
        margin: 0;
    }

    .conteinerFotoOne,
    .conteinerFotoTwo,
    .conteinerFotoThree,
    .conteinerFoto4,
    .conteinerFoto5,
    .conteinerFoto6,
    .conteinerFoto7,
    .conteinerFoto8,
    .conteinerFoto9,
    .conteinerFoto10,
    .conteinerFoto11,
    .conteinerFoto12 {
        width: 90%;
        max-width: 90%;
        margin: 0px;
    }

    .conteinerOneRiview {
        width: 90%;
        max-width: 90%;
        align-self: center;
        justify-content: center;
    }

    .sectionRowOne {
        flex-direction: column;
        gap: 20px;
    }

    .buttonEmail {
        margin-top: 20px;
    }

    .sectionRowOne>div {
        margin: 0;
        width: 100%;
        align-self: center;
    }

    .galereuContainer,
    .timeOneTall {
        width: 100%;
        height: auto;
    }

    .emailContainer {
        flex-direction: column;
        height: auto;
        padding: 20px;
        gap: 20px;
    }

    .inputEmail {
        width: 100%;
        margin-right: 0px;
    }

    .contactTime {
        flex-direction: column;
        align-items: flex-end;
        justify-content: center;
        display: flex;
        align-self: center;

    }

    .containerTimeOneTall {
        width: 100%;
        flex-direction: column;
        display: flex;
        justify-content: left;
        align-items: start;
    }

    .imgMainPage {
        width: 100%;
        height: auto;

    }

    .logoFooter {
        display: none;
    }

    img {
        max-width: 100%;
        align-items: center;
        align-self: center;
        height: auto;
        margin: 0px;
    }


    .containerTimeOneTall {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        width: 100%;
        margin-left: 0;
    }

    .fotoClock {
        display: flex;
        flex-direction: column;
        margin-right: 15px;
    }

    .clockFoto,
    .clockFotoTwo {
        display: none;
    }

    .textFooterTall {
        display: flex;
        flex-direction: column;
        text-align: left;
    }

    .clockFoto {
        margin-top: 5px;
    }

    .clockFotoTwo {
        margin-top: 55px;
    }

    .contactTime {
        padding-bottom: 80px;
    }

    footer {
        position: relative;
        width: 100%;
    }
}