/* Подключение шрифта Rounded Mplus 1c Bold */

@font-face {
    src: url("../fonts/RoundedMplus1c/MPLUSRounded1c-Bold.ttf") format("truetype");
    font-family: 'Rounded Mplus 1c Bold';
    font-weight: bold;
}

/* Общие стили */
body {
    margin: 0;
    font-family: "Montserrat", sans-serif;
}

h2 {
    font-family: "Rounded Mplus 1c Bold";
}

/* Стили для блока "mobile header" */
.hamburger,
.nav-menu,
.bar {
    display: none;
    cursor: pointer;
}

/* Стили для блока "Header" */
header {
    display: flex;
    flex-wrap: wrap;
    /*min 25px max60px*/
    gap: clamp(1.563rem, 0rem + 4.167vw, 3.75rem);
    margin: 30px;
    /*padding-top 50px, padding-left-right 20px, padding bottom 20px */
    padding: 50px 20px 20px;
    justify-content: center;
    align-items: center;
}

.header__item {
    /*min 13px max 16px */
    font-size: clamp(0.813rem, 0.679rem + 0.357vw, 1rem);

    color: black;
    text-decoration: none;
}

.header__button {

    /*min 14px max 18px */
    font-size: clamp(0.875rem, 0.696rem + 0.476vw, 1.125rem);
    text-decoration: none;
    text-align: center;
    font-weight: 600;
    color: white;
    background-color: #A64AC9;
    border: 1px solid #A64AC9;
    border-radius: 50px;
    cursor: pointer;
    padding: 15px 10px;
    /*min 150px max 200px*/
    width: clamp(9.375rem, 7.143rem + 5.952vw, 12.5rem);
    transition: transform 0.3s;
}

.header__button:hover {
    transform: scale(1.1);
}

/* Стили для блока "Header" */

/* Стили для блока "about specialist" */

.about-specialist__container {
    display: flex;
    justify-content: space-around;
    align-items: center;

    border: 2px solid #9b59b6;
    border-radius: 50px;
    margin: 20px 90px 20px;
    /*min30px max50px*/
    padding: clamp(1.875rem, 0.982rem + 2.381vw, 3.125rem);

    box-shadow: 2px 4px 8px 2px rgba(34, 60, 80, 0.2);
}

.about-specialist__text,
.about-specialist__button {
    /*min 14px max 18px */
    font-size: clamp(0.875rem, 0.696rem + 0.476vw, 1.125rem);
}

.about-specialist__h1,
.about-specialist__list {
    font-family: "Rounded Mplus 1c Bold";
}

.about-specialist__h1 {
    /*min 28px max 48px */
    font-size: clamp(1.75rem, 0.857rem + 2.381vw, 3rem);
    text-transform: uppercase;
    color: #A64AC9;
}

.about-specialist__list {
    display: flex;
    flex-direction: column;
    /*min 22px max 32px */
    font-size: clamp(0.875rem, 0.071rem + 2.143vw, 2rem);
    text-transform: uppercase;
    color: #393D3E;
    list-style-image: url("../images/star-marker.png");
}

.about-specialist__button {
    font-weight: 600;
    text-decoration: none;
    text-align: center;
    color: white;
    background-color: #A64AC9;
    border: 1px solid #A64AC9;
    border-radius: 50px;
    cursor: pointer;
    padding: 15px 10px;
    /*min 160px max 350px*/
    width: clamp(10rem, 1.518rem + 22.619vw, 21.875rem);
    transition: transform 0.3s;
}

.about-specialist__button:hover {
    transform: scale(1.1);
}

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

.about-specialist__item img {
    /*min 180px max 420px*/
    width: clamp(11.25rem, 0.536rem + 28.571vw, 26.25rem);
}

/* Стили для блока "about specialist" */

/* Стили для блока "Запросы" */

.requests-container {
    display: flex;
    justify-content: center;
    /* top - right - bottom - left */
    /*min 50px 130px*/
    margin: clamp(3.125rem, -5.511rem + 15.152vw, 8.125rem) 20px clamp(0.625rem, 0.222rem + 3.226vw, 3.125rem) 20px;
    /*margin-btm min10px max50px*/
}

.requests h2,
.requests--mobile h2 {
    /*min 28px max 32px */
    font-size: clamp(1.75rem, 1.571rem + 0.476vw, 2rem);
    color: #A64AC9;
    text-align: center;
}

.request-item {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-color: #A64AC9;
    border: 2px solid #A64AC9;
    border-radius: 50px;
    /* Увеличено значение для более округленных краев */

    box-shadow: 2px 4px 8px 2px rgba(34, 60, 80, 0.2);

    /*1min 10px 1max 20px*/
    /*2min 20px 2max 40px*/
    padding: clamp(0.625rem, 0.179rem + 1.19vw, 1.25rem) clamp(1.25rem, 0.357rem + 2.381vw, 2.5rem);
    /* Увеличены отступы */
    /*min 13px max 16px */
    font-size: clamp(0.813rem, 0.679rem + 0.357vw, 1rem);
    /* Увеличен размер шрифта */

    color: white;
    white-space: normal;
    transition: transform 0.3s;

    width: auto;
    /*min-width: 210px;*/
    max-height: 15px;
}

.request-item:hover {
    transform: scale(1.1);
}

.request-items-1,
.request-items-2,
.request-items-3,
.request-items-4,
.request-items-5,
.request-items-6,
.request-items-7 {
    display: flex;
    justify-content: center;
    align-items: center;
}

.request-items-6 {
    /*min 15px max 500px*/
    gap: 350px;
    /*min10px max50px*/
    padding-top: 10px;
    padding-right: 35px;
    /* padding-top: 10px; */
}

.request-items-7 {
    /*min 15px max 500px*/
    gap: 250px;
    /*min10px max50px*/
    padding-top: 25px;
    padding-right: 100px;
    /* padding-top: 10px; */
}

.request-items-2 {
    /*min 15px max 500px*/
    gap: 600px;
    /*min10px max50px*/
    padding-top: 25px;
    /* padding-top: 10px; */
}

.request-items-3 {
    /*min10px max130px*/
    gap: clamp(0.625rem, -0.585rem + 9.677vw, 8.125rem);
    /*min10px max50px*/
    padding-top: 10px;
    /* padding-bottom: clamp(0.625rem, 0.222rem + 3.226vw, 3.125rem); */
}

.request-items-4 {
    /*min 15px max 500px*/
    gap: 600px;
    padding-top: 10px;
}

.request-items-5 {
    padding-top: 20px;
}

.item11 {
    margin-right: 100px;
}

/* Стили для блока "about-me" */
.about-me__container {
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 20px 90px clamp(0.313rem, 0.066rem + 1.316vw, 1.25rem);
    /*min30px max50px*/
    padding: clamp(1.875rem, 0.982rem + 2.381vw, 3.125rem);
    text-align: center;
    /*min 40px max60px*/
    gap: clamp(2.5rem, 1.607rem + 2.381vw, 3.75rem);
}

.about-me__item {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.about-me__item img {
    /*min 180px max 420px*/
    width: clamp(11.25rem, 0.536rem + 28.571vw, 26.25rem);
}

.about-me__h2 {
    color: #FCCD04;
    /*min 28px max 32px */
    font-size: clamp(1.75rem, 1.571rem + 0.476vw, 2rem);
}

.about-me__text {
    /*min 14px max 18px */
    font-size: clamp(0.875rem, 0.696rem + 0.476vw, 1.125rem);
    color: black;
    max-width: 600px;
}

.about-me__button {
    /*min 14px max 18px */
    font-size: clamp(0.875rem, 0.696rem + 0.476vw, 1.125rem);
    text-decoration: none;
    text-align: center;
    font-weight: 600;
    color: white;
    background-color: #FCCD04;
    border: 1px solid #FCCD04;
    border-radius: 50px;
    cursor: pointer;
    padding: 15px 10px;
    /*min 160px max 350px*/
    width: clamp(10rem, 1.518rem + 22.619vw, 21.875rem);
    transition: transform 0.3s;
}

.about-me__button:hover {
    transform: scale(1.1);
}

/* Стили для блока "about-me" */

/* Стили для блока "prices" */
.prices__container {
    /*margin-top & margin-btm min5px max20px*/
    margin: clamp(0.313rem, 0.066rem + 1.316vw, 1.25rem) 90px clamp(0.313rem, 0.066rem + 1.316vw, 1.25rem);
    /*min30px max50px*/
    padding: clamp(1.875rem, 0.982rem + 2.381vw, 3.125rem);
}

.prices__h2 {
    color: #A64AC9;
    /*min 28px max 32px */
    font-size: clamp(1.75rem, 1.571rem + 0.476vw, 2rem);
    text-transform: uppercase;
    text-align: center;
}

.prices__items {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;

    /*min 40px max60px*/
    /*gap: clamp(2.5rem, 1.607rem + 2.381vw, 3.75rem);*/
}

.prices__item {
    display: flex;
    flex-direction: column;
    color: white;
    background-color: #A64AC9;
    border: 1px solid #A64AC9;
    border-radius: 50px;

    /*min 410px max512px*/
    min-height: 200px;
    /*min220px max600px*/
    min-width: clamp(13.75rem, -3.214rem + 45.238vw, 37.5rem);
    /*min20px max45px*/
    padding: clamp(1.25rem, 0.134rem + 2.976vw, 2.813rem);
    /*min 10px max40px*/
    gap: clamp(0.625rem, -0.714rem + 3.571vw, 2.5rem);
    justify-items: center;
    align-items: center;
}

#prices__item-unique {
    color: #A64AC9;
    background-color: white;
    border: 1px solid #A64AC9;
}

.prices__h3 {
    /*min 14px max20px*/
    font-size: clamp(0.875rem, 0.607rem + 0.714vw, 1.25rem);
    font-weight: normal;
    text-align: center;
    text-transform: uppercase;
    line-height: 30px;
}

.prices__list,
.prices__button {
    /*min 14px max 18px */
    font-size: clamp(0.875rem, 0.696rem + 0.476vw, 1.125rem);
}

.prices__list {
    list-style-image: url("../images/prices-star-1.png");
    text-align: start;
}

.prices__button {
    font-weight: 600;
    text-decoration: none;
    color: white;
    background-color: #FCCD04;
    border: 1px solid #FCCD04;
    border-radius: 50px;
    cursor: pointer;
    padding: 15px 10px;
    /*min 160px max 400px*/
    width: clamp(10rem, -0.714rem + 28.571vw, 25rem);
    transition: 0.3s;
    text-align: center;
}

.prices__button:hover {
    transform: scale(1.1);
}

.bolder {
    font-weight: bold;
}

/* Стили для блока "prices" */

/* Стили для блока "Часто задаваемые вопросы" */
.faq {
    /*min30px max70px*/
    margin: 10px clamp(1.875rem, 0.089rem + 4.762vw, 4.375rem) 10px;
    /*min30px max50px*/
    padding: clamp(1.875rem, 0.982rem + 2.381vw, 3.125rem);
    justify-content: center;
    max-width: 100%;
    /*margin: auto;
    padding: 20px;*/
    box-sizing: border-box;
}

.faq-title {
    /*min 28px max 32px */
    font-size: clamp(1.75rem, 1.571rem + 0.476vw, 2rem);
    text-align: center;
    color: #9b59b6;
    margin-bottom: 20px;
}

.faq-toggle {
    background: none;
    border: none;
    /*min32px max48px*/
    font-size: clamp(2rem, 1.286rem + 1.905vw, 3rem);
    font-weight: normal;
    color: #9b59b6;
    cursor: pointer;
    outline: none;
}

.faq-item {
    border-top: 1px solid #9b59b6;
    padding: 20px 0;
}

.faq-item:first-of-type {
    border-top: none;
}

.faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    font-family: "Montserrat", sans-serif;
    /*min 14px max20px*/
    font-size: clamp(0.875rem, 0.607rem + 0.714vw, 1.25rem);
    font-weight: 500;
    color: black;
}

.faq-answer {
    /*min 14px max 18px */
    font-size: clamp(0.875rem, 0.696rem + 0.476vw, 1.125rem);
    font-family: "Montserrat", sans-serif;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out, padding-top 0.3s ease-out;
    padding-top: 0;
}

.answer-a {
    color: #FCCD04;
    text-decoration: none;
}

.answer-a:visited {
    color: #A64AC9;
}

.toggle-icon {
    font-size: 24px;
    color: #9b59b6;
}

.faq-item:not(:last-child) {
    border-bottom: 1px solid #9b59b6;
    /* Тонкая фиолетовая линия снизу */
}

.faq-item:last-child {
    border-bottom: none;
}

/* Стили для блока "дипломы и сертификаты" */

.diplomas__container {
    /*min15px max70px*/
    margin: clamp(0.938rem, -1.518rem + 6.548vw, 4.375rem) auto;
    /*min30px max50px*/
    padding-left: clamp(1.875rem, 0.982rem + 2.381vw, 3.125rem);
    padding-right: clamp(1.875rem, 0.982rem + 2.381vw, 3.125rem);
}

.diplomas__h2 {
    color: #A64AC9;
    /*min 28px max 32px */
    font-size: clamp(1.75rem, 1.571rem + 0.476vw, 2rem);
    text-transform: uppercase;
    text-align: center;
}

.gallery {
    width: 1350px;
    display: flex;
    align-items: center;
    overflow-x: scroll;
}

.gallery div {
    width: auto;
    display: grid;
    grid-template-columns: auto auto auto;
    /*min10px max20px*/
    grid-gap: clamp(0.625rem, 0.179rem + 1.19vw, 1.25rem);
    padding: 10px;
    flex: none;
}

.gallery div img {
    width: auto;
    /*min220px max420px*/
    max-height: clamp(13.75rem, -4.107rem + 47.619vw, 38.75rem);
    transition: transform 0.5s;
}

.gallery::-webkit-scrollbar {
    display: none;
}

.gallery-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 20px auto;
}

#backBtn,
#nextBtn {
    /*min50px max70px*/
    width: clamp(3.125rem, 2.232rem + 2.381vw, 4.375rem);
    cursor: pointer;
    /*min10px max40px*/
    margin: clamp(0.625rem, -0.714rem + 3.571vw, 2.5rem);
}

.gallery div img:hover {
    cursor: pointer;
    transform: scale(1.03);
}

/* Стили для блока "дипломы и сертификаты" */

/* Стили для футера */
.footer-container {
    /*min30px max70px*/
    margin: 10px clamp(1.875rem, 0.089rem + 4.762vw, 4.375rem) 10px;
    /*min30px max50px*/
    padding: clamp(1.875rem, 0.982rem + 2.381vw, 3.125rem);
    /*min200px max600px*/
    min-width: clamp(12.5rem, -5.357rem + 47.619vw, 37.5rem);
    display: flex;
    justify-content: center;
    align-items: center;
    /*padding: 40px 20px;*/
    background-color: #A64AC9;
    border-radius: 30px;
    box-shadow: 2px 4px 8px 2px rgba(34, 60, 80, 0.2);
}

.footer-content {
    max-width: 800px;
    width: 100%;
    background-color: #A64AC9;
    color: white;
    /*padding: 40px;*/
    border-radius: 20px;
    box-sizing: border-box;
    text-align: center;
}

.footer-title {
    display: flex;
    align-items: center;
    text-align: start;
    /*min 26px max 32px */
    font-size: clamp(1.625rem, 1.357rem + 0.714vw, 2rem);
    font-family: "Rounded Mplus 1c Bold";
    font-weight: 500;
    /*margin-bottom: 30px;*/
}

.contact-section {
    display: flex;
    justify-content: center;
    align-items: center;
    /*min10px max70px*/
    gap: clamp(0.625rem, 0.02rem + 4.839vw, 4.375rem);
}

.contact-info {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-content: center;
    padding-left: 20px;
    padding-right: 20px;
    /*min10px max30px*/
    gap: clamp(0.625rem, 0.423rem + 1.613vw, 1.875rem);
    margin-bottom: 30px;
    margin-top: 20px;
}

.contact-items-1,
.contact-items-2 {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.contact-item a {
    display: flex;
    justify-content: space-between;
    text-align: start;
    flex-wrap: nowrap;
    align-items: center;
    /*min10px max30px*/
    gap: clamp(0.625rem, -0.268rem + 2.381vw, 1.875rem);
    color: white;
    /*min 13px max 16px */
    font-size: clamp(0.813rem, 0.679rem + 0.357vw, 1rem);
    text-decoration: none;
}

.contact-item img {
    /*min30px max50px*/
    height: clamp(1.875rem, 0.982rem + 2.381vw, 3.125rem);
    /*width: auto;
    width: 24px;
    height: 24px;*/
}

.note-social {
    /*min 13px max 16px */
    font-size: clamp(0.813rem, 0.679rem + 0.357vw, 1rem);
}

/* Стили для навигации */
.navigation-container {
    display: flex;
    justify-content: center;
    background-color: #f3f3f3;
    padding: 10px 20px;
    border-top: 1px solid #ccc;
    text-align: center;
    background-color: transparent;
    font-weight: 400;
    font-optical-sizing: auto;
    font-style: normal;
}

.navigation-container ul {
    flex-wrap: wrap;
    list-style-type: none;
    padding: 0;
    margin: 10px;
    display: flex;
    justify-content: space-evenly;
    /*min10px max20px*/
    gap: clamp(0.625rem, 0.179rem + 1.19vw, 1.25rem);
}

.navigation-container li {
    display: inline;
}

.navigation-container a {
    text-decoration: none;
    color: white;
    /*min 13px max 16px */
    font-size: clamp(0.813rem, 0.679rem + 0.357vw, 1rem);
}

/* Медиазапросы */

@media screen and (max-width: 1024px) {
    .contact-info {
        justify-content: flex-start;
        align-content: center;
        flex-direction: row;
    }

    .contact-items-1,
    .contact-items-2 {
        justify-content: flex-start;
    }

    .contact-item a {
        justify-content: flex-start;
    }

    .contact-item p {
        order: 1;
    }
}

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

    .hamburger {
        display: block;
        position: fixed;
        right: 10px;
        top: 10px;
    }

    .hamburger.active .bar:nth-child(2) {
        opacity: 0;
    }

    .hamburger.active .bar:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }

    .hamburger.active .bar:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
    }

    .bar {
        display: block;
        width: 25px;
        height: 3px;
        margin: 5px;
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        background-color: #A64AC9;
    }

    .nav-menu {
        display: flex;
        position: fixed;

        left: -100%;
        top: 0;
        gap: 10px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background-color: white;
        width: 100%;
        height: 100%;
        text-align: center;
        transition: 0.3s;
    }

    .nav-menu.active {
        left: -10px;
        padding: 20px;

    }

    /*остальной код btn в header?*/
    .mobile-header__button {
        background-color: #A64AC9;
        border: 2px solid #A64AC9;
        box-shadow: 2px 4px 8px 2px rgba(34, 60, 80, 0.2);

        /*min 20px max 28px */
        font-size: clamp(1.25rem, 1.11rem + 1.124vw, 1.75rem);
        text-decoration: none;
        text-align: center;
        font-weight: 600;
        color: white;
        border-radius: 50px;
        cursor: pointer;
        padding: 20px 15px;
        /*min 170px max 300px*/
        width: clamp(10.625rem, 8.343rem + 18.258vw, 18.75rem);
        transition: transform 0.3s;
    }

    .mobile-header__button:hover {
        transform: scale(1.1);
    }

    .mobile-header__item {
        text-decoration: none;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        background-color: white;
        border: 2px solid #A64AC9;
        border-radius: 50px;
        box-shadow: 2px 4px 8px 2px rgba(34, 60, 80, 0.2);

        /*min 20px max 28px */
        font-size: clamp(1.25rem, 1.11rem + 1.124vw, 1.75rem);
        /* Увеличен размер шрифта */

        color: #A64AC9;
        white-space: normal;
        transition: transform 0.3s;

        /*min15px max35px*/
        max-height: clamp(0.938rem, 0.586rem + 2.809vw, 2.188rem);
        padding: 20px 15px;
        /*min 170px max 300px*/
        width: clamp(10.625rem, 8.343rem + 18.258vw, 18.75rem);
        transition: transform 0.3s;
    }

    .mobile-header__item:hover {
        transform: scale(1.1);
    }
}

@media screen and (max-width: 830px) {
    .about-specialist__container {
        flex-direction: column;
        flex-wrap: wrap;
        /*justify-content: center;*/
        justify-items: center;
        align-content: center;
        gap: 40px;
        margin: 20px 50px 20px;
    }

    .about-specialist__item {
        display: flex;
        flex-direction: column;
        justify-items: center;
        align-items: center;
    }

    .about-specialist__text,
    .about-specialist__h1 {
        text-align: center;
    }

    .about-specialist__list {
        text-align: start;
    }

    .about-specialist__button {
        margin-top: 15px;
    }

    .about-me__container {
        flex-direction: column;
    }

    .contact-section {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 5px;
    }

    .contact-items-1,
    .contact-items-2 {
        align-items: flex-start;
    }

    .contact-item a {
        justify-content: center;
    }

    .navigation-container {
        flex-direction: column;
        align-items: center;
    }
}

@media screen and (max-width: 425px) {
    .contact-info {
        flex-direction: column;
        gap: 10px;
    }

    .contact-items-1,
    .contact-items-2 {
        gap: 10px;
    }

    .contact-items-1 p,
    .contact-items-2 p {
        margin: 0;
    }

    .footer-title {
        text-align: center;
    }
}

/*медиазапросы REQUESTS ONLY*/

@media (min-width: 1280px) {
    .requests-container--mobile {
        display: none;
    }
}

@media (max-width: 1279px) {

    .requests-container {
        display: none;
    }

    .requests--mobile {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .request-items--mobile {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 10px;
    }

    .request-item {
        word-wrap: normal;
        /*w100px h170px*/

        /*min70px max170px*/
        max-height: clamp(4.375rem, 2.858rem + 12.136vw, 10.625rem);
        /*min170px max300px*/
        width: clamp(10.625rem, 8.653rem + 15.777vw, 18.75rem);
        /*min 12px max32px*/
        padding: clamp(0.75rem, 0.447rem + 2.427vw, 2rem);
    }

    .item11 {
        margin-right: 0;
    }
}

@media screen and (max-width: 912px) {
    .requests-container--mobile {
        /*min10px max45px*/
        margin-top: clamp(0.625rem, 0.011rem + 4.916vw, 2.813rem);
    }
}