/* --- 4. МОБИЛЬНАЯ ВЕРСИЯ (<= 1140px) --- */
@media (max-width: 1140px) {
	.site-header { height: 100px; }

	.container {
		padding: 0 15px;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.header-top {
		padding: 0;
		width: 100%;
		height: 100%;
	}

	.header-top-inner {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 100%;
		width: 100%;
	}

	/* Лого мобайл */
	.logo-link img {
		height: auto;
		width: 85%;
	}

	/* Центральные иконки (Заказать звонок + Трубка) */
	.header-center-icons {
		display: flex;
		align-items: center;
		gap: 10px;
		margin-left: auto; /* Прижать вправо от лого */
		margin-right: 20px; /* Отступ до бургера */
	}

	.icon-btn {
		background: #B486E8;
		width: 45px;
		height: 45px;
		display: flex;
		border-radius: 50%;
		filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
		align-items: center;
		text-align: center;
	}
	.icon-btn svg {
		display: block;
		margin: 0 auto;
	}
	.icon-btn.call {
		background: linear-gradient(92.04deg, rgba(162, 119, 230, 0.9) 0%, rgba(182, 123, 229, 0.9) 20%, rgba(200, 128, 229, 0.9) 45.01%, rgba(211, 131, 229, 0.9) 71.01%, rgba(215, 132, 229, 0.9) 100.01%);
	}
	/* Бургер */
	.burger-btn {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		width: 35px;
		height: 31px; /* 3*3 + 2*11 */
		cursor: pointer;
		z-index: 1002;
		flex-shrink: 0;
	}

	.burger-line {
		width: 35px;
		height: 3px;
		background-color: var(--c-blue-dark);
		border-radius: 2px;
		transition: 0.3s;
		display: block;
	}

	/* Анимация бургера */
	.burger-btn.active .burger-line:nth-child(1) { transform: translateY(14px) rotate(45deg); }
	.burger-btn.active .burger-line:nth-child(2) { opacity: 0; }
	.burger-btn.active .burger-line:nth-child(3) { transform: translateY(-14px) rotate(-45deg); }

	/* Скрываем элементы ПК на мобильных */
	.header-center, .header-right, .header-bottom, .header-divider-wrapper, .status-block, .messengers-block, .btn-callback {
		display: none !important;
	}
	
	 .hero-section {
        min-height: auto; /* Высота по контенту */
        padding-bottom: 40px;
    }

    /* Убираем нижний декор */
    .hero-bg-bottom-left {
        display: none;
    }

    /* Оставляем верхний, но уменьшаем его, чтобы не перекрывал текст на узких экранах */
    .hero-bg-top-right {
        width: 80%; /* Пропорционально уменьшаем */
        height: auto;
        opacity: 0.6; /* Чуть прозрачнее, чтобы не мешать */
    }

    .hero-container {
        padding-top: 30px;
    }

    /* Пропорциональное уменьшение шрифтов */
    .hero-title {
        font-size: 64px; /* ~50% от 128 */
    }

    .hero-subtitle {
        font-size: 24px; /* ~50% от 48 */
        margin-top: 15px;
    }

    .hero-btn {
        width: 90%; /* Резиновая ширина */
        max-width: 400px; /* Максимум чтобы не была огромной */
        height: 70px; /* Пропорционально высоте */
        font-size: 20px; /* Пропорционально тексту */
        margin-top: 20px;
    }

    .hero-image-wrapper {
        margin-top: 20px;
    }
    
    .hero-main-img {
        max-width: 100%;
        height: auto;
    }
	.about-section {
        padding: 40px 0 100px 0;
    }


    /* Показываем и позиционируем маленькие круги */
    .about-bg-circle.mobile-circle-1 {
        display: block;
        top: 10%;
        left: 5%;
    }
    .about-bg-circle.mobile-circle-2 {
        display: block;
        bottom: 20%;
        right: 5%;
    }

    .about-content-wrapper {
        flex-direction: column;
        gap: 40px;
    }

    .about-left-block {
        width: 100%;
        align-items: center; /* Центрируем контент на мобильном */
        text-align: center;
    }

    .about-title {
        font-size: 32px; /* Уменьшаем заголовок */
        text-align: center;
    }

    .about-text {
        text-align: left; /* Текст лучше оставить слева для читаемости */
        font-size: 14px;
    }

    .about-features-grid {
        grid-template-columns: 1fr; /* Одна колонка */
        width: 100%;
        margin-top: 30px;
    }

    .feature-card {
        width: 100%;
        max-width: 300px; /* Ограничение из ТЗ */
        margin: 0 auto; /* Центрирование карточек */
        box-sizing: border-box;
    }

    .about-btn {
        width: 100%;
        max-width: 300px;
        height: 60px;
        font-size: 20px;
        margin: 30px auto 0 auto;
    }

    /* Правый блок: скрываем статичные картинки, включаем слайдер */
    .about-right-block {
        width: 100%;
        gap: 0;
    }

    .about-right-block .gallery-img:not(.gallery-slider-container .gallery-img) {
        display: none;
    }

    .gallery-slider-container {
        display: flex; /* Включаем слайдер */
        gap: 10px; /* Отступ от стрелок до фото */
    }

    .gallery-arrow {
        width: 45px;
        height: 45px;
    }
    
	
	
	
	.gallery-img-static, .container.header-container.menu-pc {
        display: none !important;
    }

    /* Показываем слайдер */
    .gallery-slider-container {
        display: flex !important;
    }
	.hero-clouds-overlay{
		bottom: 0;
	}
	.why-section {
        padding-top: 10px; /* Корректировка отступа на мобильных */
    }
    
    /* Если облака слишком большие на мобильных, можно ограничить их высоту */
    .about-cloud-transition img,
    .why-cloud-bottom img {
        max-height: 150px; /* Пример ограничения */
        object-fit: cover;
    }
	.why-cards-grid {
        /* Меняем сетку с 2 колонок на 1 */
        grid-template-columns: 1fr; 
        
        /* Уменьшаем огромный отступ 140px до комфортного для телефона (например, 30-40px) */
        gap: 40px; 
    }
	.why-card {
		position: relative;
		background: #FFFFFF;
		box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25);
		border-radius: 20px;
		padding: 20px 10px;
		z-index: 1;
		overflow: hidden;
		display: flex;
		flex-direction: column;
	}
    /* Опционально: можно немного уменьшить размер цифры на фоне, 
       чтобы она не занимала весь экран на узком телефоне */
    .card-number {
        font-size: 200px; /* Было 350px */
        left: -30px;      /* Чуть сдвигаем, чтобы центрировать визуально */
    }
	.container.why-container{
		display:block;
	}
	.about-cloud-transition {
		bottom: 0px;
	}
	.why-title{
		margin: 0 0 40px 0;
	}
	.card-icon {
		width: 35px;
		height: 35px;
	}
	.card-title {
		font-size: 18px;
		padding-left: 10px;
	}
	.card-text {
		font-size: 12px;
		padding-left: 45px;
	}
	.services-section {
        min-height: auto; /* Высота по контенту */
        padding:0 0 40px 0;
		overflow: hidden;
    }

    /* Убираем нижний декор на мобильных */
    .services-bg-bottom-left {
        display: none;
    }

    /* Оставляем верхний, но уменьшаем и делаем прозрачнее */
    .services-bg-top-right {
        width: 80%;
        height: auto;
        opacity: 0.9;
    }

    .services-container {
        padding-top: 30px;
		padding-bottom: 50px;
    }
	.services-title {
        margin-top: 100px; /* Уменьшаем отступ на мобильных */
        font-size: 32px;
    }

    .services-description {
        margin-top: 30px;
        font-size: 14px;
        line-height: 22px;
        padding: 0 10px;
    }

     /* Скрываем сетку ПК */
    .services-grid-pc {
        display: none !important;
    }

    /* --- СЛАЙДЕР УСЛУГ (КОПИЯ ОТЗЫВОВ) --- */
    
    /* Контейнер слайдера */
    .services-slider-container {
        display: flex !important;
        position: relative;
        width: 100%;
        align-items: center;
        justify-content: center;
        margin-top: 50px;
        padding: 0 10px; /* Небольшой отступ по краям экрана */
        overflow: visible; /* Разрешаем стрелкам вылезать, если нужно, но они будут absolute */
    }

    /* Обертка трека (для корректного отображения теней) */
    .services-track-wrapper {
        width: 100%;
        overflow: hidden;
        border-radius: 30px;
        
        /* МАГИЯ ТЕНЕЙ: padding + отрицательный margin */
        padding: 20px 10px; 
        margin: -20px -10px;
        box-sizing: border-box;
        position: relative;
        z-index: 1;
    }

    /* Сам трек */
    .services-track {
        display: flex;
        transition: transform 0.4s ease;
        gap: 20px;
        width: 100%;
        padding: 20px 10px;
        margin: -20px -10px;
        box-sizing: border-box;
        position: relative;
        z-index: 1;
    }

    /* Карточка услуги в слайде */
    .service-card-slide {
		width: 100%;
        max-width: 425px;
        margin: 0 auto; /* Центрирование, если экран широкий */
        flex-shrink: 0;
        
        background: #FFFFFF;
        box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
        border-radius: 30px;
        padding: 45px 20px 40px 20px;
        
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        box-sizing: border-box;
    }

    /* Адаптация контента внутри карточки */
    .service-card-slide .service-icon {
        width: 120px;
        height: 120px;
        margin-bottom: 25px;
    }

    .service-card-slide .service-title {
        font-size: 28px;
        margin-bottom: 10px;
        min-height: auto;
    }

    .service-card-slide .service-price-old {
        font-size: 24px;
    }

    .service-card-slide .service-price-new {
        font-size: 36px;
    }

    .service-card-slide .service-btn {
        font-size: 16px;
        height: 50px;
        width: 100%;
        max-width: 100%;
    }

    /* СТРЕЛКИ (ПОВЕРХ КАРТОЧКИ) */
    .services-arrow {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 45px;
        height: 45px;
        border-radius: 50%;
        background-color: #BBA4ED;
        border: none;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        z-index: 20; /* Поверх карточки */
        transition: background 0.3s;
        margin: 0;
        padding: 0;
    }

    .services-arrow svg {
        width: 14px;
        height: 24px;
        stroke: white;
        stroke-width: 3;
    }

    .services-arrow:hover {
        background-color: #A277E6;
    }

    /* Позиционирование стрелок по краям */
    .services-slider-container .prev-arrow {
        left: 0;
    }
    
    .services-slider-container .next-arrow {
        right: 0;
    }

	/* Скрываем сетку ПК */
    .specialists-grid-pc {
        display: none !important;
    }

    /* --- СЛАЙДЕР СПЕЦИАЛИСТОВ (КОПИЯ ОТЗЫВОВ И УСЛУГ) --- */

    /* Контейнер слайдера */
    .specialists-slider-container {
        display: flex !important;
        position: relative;
        width: 100%;
        align-items: center;
        justify-content: center;
        margin-top: 40px;
        padding: 0 10px;
        overflow: visible;
    }

    /* Обертка трека (для теней) */
    .spec-track-wrapper {
        width: 100%;
        overflow: hidden;
        border-radius: 30px;
        
        /* МАГИЯ ТЕНЕЙ: padding + отрицательный margin */
        padding: 20px 10px; 
        margin: -20px -10px;
        box-sizing: border-box;
        position: relative;
        z-index: 1;
    }

    /* Сам трек */
    .spec-track {
        display: flex;
        transition: transform 0.4s ease;
        gap: 20px;
        width: 100%;
        padding: 20px 10px;
        margin: -20px -10px;
        box-sizing: border-box;
        position: relative;
        z-index: 1;
    }

    /* Карточка специалиста в слайде */
    .spec-card-slide {
        width: 100%;
        max-width: 425px;
        margin: 0 auto; /* Центрирование */
        flex-shrink: 0;
        
        /* Градиентная рамка (как в ПК версии) */
        border-radius: 30px;
        padding: 3px; 
        background: linear-gradient(180deg, #F6528D 0%, #38BEF3 100%);
        box-sizing: border-box;
    }

    /* Внутренняя часть карточки */
    .spec-card-inner {
        background: linear-gradient(90deg, #EADBF3 0%, #ADE2FF 100%);
        border-radius: 27px; /* Чуть меньше внешнего */
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 30px 20px;
        box-sizing: border-box;
        text-align: center;
    }

    /* Адаптация контента */
    .spec-card-slide .spec-photo-wrapper {
        width: 150px;
        height: 150px;
        padding: 8px;
        margin-bottom: 20px;
    }

    .spec-card-slide .spec-name {
        font-size: 24px;
        margin-bottom: 5px;
    }

    .spec-card-slide .spec-position {
        font-size: 18px;
        margin-bottom: 15px;
    }

    .spec-card-slide .spec-check {
        width: 35px;
        height: 35px;
        margin-right: 10px;
    }

    .spec-card-slide .spec-list li span {
        font-size: 14px;
    }

    .spec-card-slide .spec-btn {
        font-size: 16px;
        height: 50px;
        width: 100%;
        max-width: 100%;
        margin-top: auto;
    }

    /* СТРЕЛКИ (ПОВЕРХ КАРТОЧКИ) */
    .spec-arrow {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 45px;
        height: 45px;
        border-radius: 50%;
        background-color: #BBA4ED;
        border: none;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        z-index: 20; /* Поверх карточки */
        transition: background 0.3s;
        margin: 0;
        padding: 0;
    }

    .spec-arrow svg {
        width: 14px;
        height: 24px;
        stroke: white;
        stroke-width: 3;
    }

    .spec-arrow:hover {
        background-color: #A277E6;
    }

    /* Позиционирование стрелок по краям */
    .specialists-slider-container .prev-arrow {
        left: 0;
    }
    
    .specialists-slider-container .next-arrow {
        right: 0;
    }
    
	 /* Скрываем ПК версию */
    .timeline-wrapper {
        display: none;
    }

    /* Показываем мобильную версию */
    .timeline-mobile-wrapper {
        display: block;
        position: relative;
        padding-right: 20px;
		width: 100%;
		max-width: 420px;
    }

    /* Вертикальная линия (справа от контента, но визуально слева блока) */
    .timeline-mobile-line {
        position: absolute;
        left: 100%;
        top: 145px;
        bottom: 0;
        width: 10px;
        background-color: #F6528D;
        z-index: 1;
		height: 80%;
    }

    .mobile-step {
        position: relative;
        z-index: 2;
    }

    .mobile-step-content {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    .mobile-step .step-title {
        font-weight: 700;
        font-size: 24px;
        color: #fff;
        background: #F6528D;
        padding: 15px 30px;
        border-radius: 10px;
        width: calc(100% + 30px);
        position: relative;
        top: 110px;
        z-index: 3;
    }

    .step-icon-mobile {
         height: 90px;
        width: auto;
        margin-bottom: 10px;
        align-self: flex-start;
        position: absolute;
        top: 325px;
        z-index: 4;
    }

    /* Уменьшенный круг для мобильных */
    .mobile-circle {
		width:100%;
        max-width: 370px;
		height:auto;
		aspect-ratio: 1 / 1;
        border-radius: 50%;
        background: linear-gradient(180deg, #F6528D 0%, #38BEF3 100%);
        box-sizing: border-box;
		margin: 0 auto;
    }

    .mobile-circle .circle-content {
        border-radius: 17px;
        padding: 20px;
        text-align: left;
		width: 100%;
		height: 100%;
		background: #FFFFFF;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
		text-align: center;
    }

    .mobile-circle .circle-content p {
        font-size: 16px;
        line-height: 1.5;
    }
	
	.how-work-section::after {
        height: 100px; /* Уменьшаем высоту градиента на мобильных */
        margin-top: 40px; /* Уменьшаем отступ */
    }
	.reviews-section {
        padding: 20px 0;
    }
	
	 /* --- Контейнер секции --- */
    .reviews-container {
        display: block !important;
        width: 100%;
        padding: 0 15px; /* Базовые отступы по краям экрана */
        box-sizing: border-box;
        position: relative;
    }

    /* --- Обертка слайдера --- */
    .reviews-slider-wrapper {
        position: relative;
        width: 100%;
        margin: 40px 0;
        padding: 0;
        /* Убираем overflow: hidden отсюда, чтобы тени не резались глобально */
        overflow: visible; 
    }

    /* --- Трек (обрезает только то, что за пределами видимости слайда, но пускает тени) --- */
    .reviews-track-wrapper {
        width: 100%;
        overflow: hidden; /* Обязательно здесь, чтобы скрывать соседние слайды */
        padding: 20px 10px; /* ЗАПАС для теней: 20px сверху/снизу, 10px по бокам */
        margin: -20px -10px; /* КОМПЕНСАЦИЯ: визуально убираем добавленный padding, чтобы не ломать ширину */
        box-sizing: border-box;
        position: relative;
        z-index: 1;
    }

    .reviews-track {
        display: flex;
        gap: 20px; /* Отступ между слайдами при листании */
        transition: transform 0.5s ease;
        padding: 0 5px; /* Доп запас внутри трека */
    }

    /* --- КАРТОЧКА ОТЗЫВА (ИСПРАВЛЕНИЕ) --- */
    .review-card {
        /* ГЛАВНОЕ ПРАВИЛО: 100% ширины, но не больше 525px */
        width: 100%;
        max-width: 525px;
        
        /* Центрирование карточки внутри слайда */
        margin: 0 auto; 
        
        flex-shrink: 0; /* Не сжимать */
        
        background: #FFFFFF;
        box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25);
        border-radius: 40px; /* Или 20px для мобилок, если нужно компактнее */
        padding: 30px 20px;
        
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        box-sizing: border-box;
    }

    /* --- СТРЕЛКИ (ПОВЕРХ КАРТОЧКИ) --- */
    .reviews-arrow {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 45px;
        height: 45px;
        border-radius: 50%;
        background-color: rgba(187, 164, 237, 0.9); /* Чуть прозрачный фон */
        border: none;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 20; /* Поверх карточки и трека */
        padding: 0;
        margin: 0;
    }

    .reviews-arrow svg {
        width: 14px;
        height: 24px;
        stroke: white;
        stroke-width: 3;
    }

    /* Позиционируем стрелки по краям КОНТЕЙНЕРА (или экрана) */
    /* Вариант А: Прижать к краям экрана (поверх всего) */
    .prev-arrow { left: 0; }
     .next-arrow { right: 0; left: calc(100% - 50px);}
    .star-medium, .star-large{
		display:none;
	}
	.star-small {
		top: 10%;
		left: -15%;
		width: 250px;
		height: 250px;
		opacity: 0.2;
	}

    .review-photo-wrapper {
        width: 150px;
        height: 150px;
        margin-bottom: 20px;
    }

    .review-name {
        font-size: 24px;
        margin-bottom: 10px;
    }

    .review-stars img {
        width: 25px;
        height: 25px;
    }

    .review-stars {
        margin-bottom: 30px;
        gap: 5px;
    }

    .review-text {
        font-size: 16px;
        line-height: 1.5;
        margin-bottom: 10px;
    }

    .review-signature {
        font-size: 14px;
        font-weight: 700;
    }

    /* --- Пагинация --- */
    .reviews-pagination {
        display: flex;
        justify-content: center;
        gap: 10px;
        margin-top: 30px;
        width: 100%;
    }

    .pag-dot {
        width: 20px;
        height: 20px;
        border-radius: 50%;
        background-color: #D9D9D9;
        cursor: pointer;
        transition: background 0.3s;
    }

    .pag-dot.active {
        background-color: #BBA4ED;
    }
	.contacts-section {
        position: relative;
        height: auto; /* Высота по контенту */
        background-color: #F2F6F9;
        overflow: visible;
		padding-top:100px;
    }

    /* Градиент сверху (Белый -> F2F6F9) */
    .contacts-mobile-gradient {
        display: block;
        width: 100%;
        height: 100px;
        background: linear-gradient(180deg, #FFFFFF 0%, #F2F6F9 100%);
        position: absolute;
        top: 0;
        left: 0;
        z-index: 0;
    }

    /* Контейнер сбрасываем в статический поток */
    .contacts-container {
        position: relative;
        top: auto;
        left: auto;
        transform: none;
        width: 100%;
        max-width: 100%;
        height: auto;
        padding: 0 15px; /* Отступы по краям экрана */
        box-sizing: border-box;
        z-index: 2;
        pointer-events: none; /* Снова пропускаем клики, кроме блока */
        margin-top: 20px; /* Небольшой отступ от верха (после градиента) */
    }

    /* Белая карточка на мобильном */
    .contacts-info-block {
        width: 100%;
		max-width: 550px;
        height: auto;
        padding: 25px 20px;
        margin: 0 auto;
        pointer-events: auto;
        text-align: center; /* Центрируем контент на мобильном */
        align-items: center;
    }

    .contacts-title {
        font-size: 28px;
        text-align: center;
        margin-bottom: 20px;
    }

    .contact-row {
        justify-content: center; /* Центрируем строки */
        font-size: 18px; /* Уменьшаем шрифт */
        margin-bottom: 12px;
        flex-wrap: wrap;
    }

    .contact-row:last-of-type {
        margin-bottom: 25px;
    }

    .contact-icon {
        width: 24px;
        margin-right: 10px;
    }

    .contacts-messengers {
        gap: 20px;
    }

    .contacts-messengers img {
        width: 30px;
        height: 30px;
    }

    /* Блок карты на мобильном */
    .contacts-map {
        position: relative;
        width: 100%;
        height: 300px; /* Высота 300px по ТЗ */
        margin-top: 30px; /* Отступ от белого блока */
        z-index: 1;
    }
	.site-footer {
        height: auto; /* Высота по контенту */
        padding: 40px 0; /* Добавляем воздух сверху и снизу */
    }

    .footer-container {
        flex-direction: column; /* Блоки друг под другом */
        gap: 30px; /* Отступ между блоками */
        text-align: center;
    }

    .footer-block {
        justify-content: center !important; /* Все блоки по центру */
        width: 100%;
    }

    /* Лого по центру */
    .footer-left {
        margin-bottom: 10px;
    }

    .footer-logo {
        height: 60px; /* Чуть уменьшим лого для мобилок, если нужно */
        margin: 0 auto;
    }

    /* Текст по центру (уже есть в общих стилях, но усилим) */
    .footer-copyright {
        font-size: 18px; /* Уменьшим шрифт для читаемости на маленьком экране */
        line-height: 1.5;
    }

    /* Соцсети по центру */
    .footer-socials {
        justify-content: center;
        gap: 20px;
    }
	.back-to-top {
        bottom: 20px;
        right: 20px;
        width: 50px;
        height: 50px;
    }

    .back-to-top svg {
        width: 20px;
        height: 20px;
    }
	.decor-heart {
		width: 43%;
		height: auto;
		left: 5%;
		top: 0%;
	}
	.decor-vector-1 {
		left: 70%;
		top: 13%;
		width: 120px;
		height: auto;
		opacity: .3;
	}
	.decor-vector-2 {
		left: 3.42%;
		top: 24.28%;
		width: 200px;
		height: auto;
		opacity: 0.3;
	}
	.decor-vector-3 {
		display:none;
	}
	.about-bg-circle.top-left {
		width: 120px;
		height: 120px;
		background-color: #AF85E8;
		opacity: 0.1;
		top: 340px;
		left: 150px;
	}
	.about-bg-circle.bottom-right {
		width: 200px;
		height: 200px;
		background-color: #F9518C;
		opacity: 0.15;
		bottom: 100px;
		left: -100px;
	}
	
	.mascot{
		width:120px;
		height:120px;
	}
	.mascot.mascot-01{
		top:-70px;
		left:0px;
	}
	.mascot.mascot-02{
		bottom: -20px;
		right: 5%;
	}
	.mascot.mascot-03{
		top: 10px;
        left: 10px;
	}
	.mascot.mascot-04{
		bottom: -20px;
		right: 5%;
	}
	.mascot.mascot-05{
		top: -100px;
        left: 10px;
	}
	.mascot.mascot-06{
		bottom: -20px;
		right: 5%;
	}
	.mascot.mascot-07{
		left: 20px;
	}
	.btn-submit{
		font-size:18px;
	}
}


/* --- 5. МОБИЛЬНОЕ МЕНЮ (Выезжает СПРАВА) --- */
.mobile-menu-overlay {
	position: fixed;
	top: 0; left: 0; width: 100%; height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1001;
	opacity: 0; visibility: hidden;
	transition: 0.3s;
}
.mobile-menu-overlay.active { opacity: 1; visibility: visible; }

.mobile-menu-block {
	position: fixed;
	top: 0;
	right: 0; /* Выезжает справа */
	left: auto;
	width: 274px;
	max-width: 80%;
	height: 100%;
	background: var(--c-white);
	box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
	padding: 20px;
	transform: translateX(100%); /* Сдвинуто за правый край */
	transition: 0.3s;
	z-index: 1002;
	display: flex;
	flex-direction: column;
}
.mobile-menu-overlay.active .mobile-menu-block { transform: translateX(0); }

.menu-close {
	width: 25px; height: 25px;
	position: relative;
	cursor: pointer;
	align-self: flex-start;
	margin-bottom: 20px;
}
.menu-close::before, .menu-close::after {
	content: ''; position: absolute; top: 50%; left: 0;
	width: 100%; height: 3px;
	background: var(--c-blue-active);
	border-radius: 2px;
}
.menu-close::before { transform: translateY(-50%) rotate(45deg); }
.menu-close::after { transform: translateY(-50%) rotate(-45deg); }

.mobile-logo {
	align-self: center;
	width: 150px; height: 150px;
	margin-bottom: 30px;
	object-fit: contain;
}

.mobile-nav ul {
	display: flex;
	flex-direction: column;
	gap: 20px;
	margin-bottom: 20px;
	text-align: left;
}
.mobile-nav a { font-size: 20px; color: var(--c-text-main); font-weight: 400; }

.mobile-divider {
	width: 100%; height: 1px;
	background: var(--c-line);
	border-radius: 1px;
	margin: 20px 0;
}

.mobile-contact {
	display: flex; align-items: center; margin-bottom: 25px;
}
.mobile-contact img { width: 25px; height: 25px; margin-right: 10px; }
.mobile-contact span { font-size: 18px; font-weight: 700; color: var(--c-text-main); }

.mobile-messengers {
	display: flex; justify-content: center; gap: 15px; margin-top: auto;
}
.mobile-messengers img { width: 40px; height: 40px; }



@media (max-width: 1140px) {
	.modal-window {
		width: 100%; height: 100%; max-height: 100vh;
		border-radius: 30px; padding: 20px;
	}
	.modal-title { font-size: 32px; margin-top: 40px; }
	.modal-bg-img { display: none; }
	.form-input, .btn-submit { width: 100%; }
}

@media (max-width: 381px) {
	.mobile-circle .circle-content {
		padding-top: 60px;
	}
	.mobile-step .step-title {
		font-size: 20px;
	}
	.spec-card-slide .spec-btn, .service-card-slide .service-btn{
		font-size: 14px;
        height: auto;
		padding: 5px;
	}
	.burger-btn {
        width: 25px;
        height: 25px;
	}
	.burger-line {
		width: 25px;
		height: 2px;
	}
	.container {
		padding: 0 10px;
	}
	.icon-btn {
		width: 30px;
		height: 30px;
	}
	.icon-btn svg {
		width: 20px;
		height: 20px;
	}
	.header-center-icons {
        gap: 5px;
	}
	.logo-link img {
		width: 90%;
	}
	.site-header {
        height: 80px;
    }
}
@media (max-width: 346px) {
	.mobile-circle .circle-content p {
		font-size: 14px;
    }
	.mobile-circle .circle-content {
		padding-top: 90px;
    }
}
@media (max-width: 400px) {
    .hero-title {
        font-size: 48px;
    }
    .hero-subtitle {
        font-size: 18px;
    }
    .hero-btn {
        height: 60px;
        font-size: 16px;
        padding: 0 10px;
    }
	.gallery-arrow {
		width: 35px;
		height: 35px;
	}
	.gallery-arrow svg {
		width: 14px;
		height: 24px;
	}
}