@media (max-width: 1200px) and (min-width: 1101px) {
    .services-grid {
        margin-left: 26px;
        margin-right: 26px;
    }
}

@media (max-width: 1100px) {
    .hero--info {
        width: 395px;
    }
}

@media (max-width: 1100px) and (min-width: 988px) {

    
    /* Прячем основной header */
    header:not(.header--sticky) {
        display: none !important;
    }

    .technologies {
        padding-left: 85px;
    }

    
    .services-grid {
        display: flex;
        flex-direction: column; /* включаем вертикальную структуру */
        gap: 24px;              /* отступ между блоками */

        
        justify-content:center;
        
        justify-items: center; /* центрирует содержимое по горизонтали */
        align-items: center;   /* центрирует по вертикали (если есть высота) */
        text-align: center; 

    }

    .services-grid-right {
        order: 1;   /* ПЕРВЫМ наверху */
        flex: 1 1 0px;
        gap: 20px;

        margin-top: -20px;
        
        display:grid;
        justify-content:center;
        
        justify-items: center; /* центрирует содержимое по горизонтали */
        align-items: center;   /* центрирует по вертикали (если есть высота) */
        text-align: center; 
    }

    .services-grid-left {
        order: 2;   /* ВТОРЫМ снизу */
        max-width: 500px;

        flex: 0 0 0px;
    }

    /* Чуть страхуемся, чтобы фон не вылезал */
    .hero-bg {
        position: absolute;
        inset: 0;
        overflow: hidden;
    }

    .gradient-box {
        position: absolute;
        right: 16%;
        top: -21%;
        transform: translateY(-50%) rotate(65.85deg);
        width: 65vw;
        height: 165vh;
        background: linear-gradient(
            23.85deg,
            rgba(8, 77, 239, 1) 0%,
            rgba(8, 188, 239, 1) 94%
        );
        z-index: 1;
    }

    .gradient-box-secondary-one {
        position: absolute;
        left: -7vw;
        top: 65%;
        transform: translateY(-50%) rotate(65.85deg);
        width: 16vw;
        height: 165vh;
        background: linear-gradient(23.85deg, #084def 0%, #08bcef 100%);
        filter: blur(50px);
        opacity: 0.2;
        z-index: 1;
    }

    .gradient-box-secondary-two {
        position: absolute;
        left: 20vw;
        top: 46%;
        width: 15vw;
        height: 85vh;
        transform: rotate(65.85deg);
        background: linear-gradient(
            63.85deg,
            #084def 0%,
            #08bdef4f 50%,
            #08bdef1f 60%,
            #efcc0800 70%
        );
        opacity: 0.4;
        z-index: 1;
        pointer-events: none;
    }

    .gradient-box-secondary-three {
        position: absolute;
        right: 65vw;
        top: -29vh;
        width: 20vw;
        height: 80vh;
        transform: rotate(65.85deg);
        background: linear-gradient(
            63.85deg,
            rgba(8, 77, 239, 0.192) 0%,
            rgba(8, 77, 239, 0) 15%,
            rgba(8, 173, 239, 0.664) 40%,
            #ffffff 100%
        );
        opacity: 0.2;
        pointer-events: none;
        z-index: 1;
    }

    .hero-main {
        display: flex;
        justify-content: center;
    }

    .hero--info {
        max-width: 480px;
        margin-right: 6vw;
        margin-top: 36vh;
    }

    .hero--info h1 {
        color: #084DEF;
        font-size: 64px;
        font-weight: bold;
    }

    .hero--info h2 {
        color: #000000;
        font-size: 36px;
        font-weight: bold;
    }

    .hero--info p {
        color: #000000;
        font-size: 16px;
        font-weight: 600;
        margin-top: 6px;
    }


    .tech-layout {
        left:85px;
    }

    
    .request-quote__inner {
        display: flex;          /* на всякий случай, если где-то переопределялось */
        flex-direction: column; /* вместо ряда – колонка */
        gap: 24px;              /* отступ между формой и картой, по вкусу */
    }

    .request-quote__form-card,
    .request-quote__map-card {
        width: 500px;
        height: 500px;
    }

    .request-quote__map-card iframe#rq-map {
        width: 500px;
        height: 500px;
    }

        /*
    .gradient-box {
        position: absolute;
        right: -23vw;
        top: 50%;
        transform: translateY(-50%) rotate(23.85deg);
        width: 62vw;
        height: 165vh;
        background: linear-gradient(23.85deg, rgba(8, 77, 239, 1) 0%, rgba(8, 188, 239, 1) 94%);
        z-index: 1;
    }*/


    /* левый размазанный */
    .gradient-box-secondary-one {
        position: absolute;
        left: -7vw;
        top: 65%;
        transform: translateY(-50%) rotate(65.85deg);

        width: 16vw;   /* ~293/1920 */
        height: 165vh; /* ~1793/1080 */

        background: linear-gradient(23.85deg, rgba(8, 77, 239, 1) 0%, rgba(8, 188, 239, 1) 100%);
        filter: blur(50px);
        opacity: 0.2;
        z-index: 1;
    }

    /* внутренняя полоса под дроном */
    .gradient-box-secondary-two {
        position: absolute;
        left: 20vw;
        top: 46%;

        width: 15vw;
        height: 85vh;

        transform: rotate(65.85deg);

        background: linear-gradient(
            63.85deg,
            #084def 0%,
            #08bdef4f 50%,
            #08bdef1f 60%,
            #efcc0800 70%
        );

        opacity: 0.4;
        z-index: 1;
        pointer-events: none;
    }

    /* верхний правый блик */
    .gradient-box-secondary-three {
        position: absolute;
        right: 65vw;
        top: -29vh;

        width: 20vw;
        height: 80vh;

        transform: rotate(65.85deg);

        background: linear-gradient(
            63.85deg,
            rgba(8, 77, 239, 0.192) 0%,
            rgba(8, 77, 239, 0) 15%,
            rgba(8, 173, 239, 0.664) 40%,
            #ffffff 100%
        );

        opacity: 0.2;
        pointer-events: none;
        z-index: 1;
    }

    .hero-main {
        display: flex;
        justify-content: center; /* прижимаем всё вправо */
    }

    .hero--info {
        max-width: 480px;
        margin-right: 6vw;  /* сдвигаем чуть вправо, 14vw - rus */
        margin-top: 36vh;
    }


    .hero--info h1 {
        color:#084DEF;
        font-size: 64px;
        font-weight: bold;
    }

    .hero--info h2 {
        color:#000000;
        font-size: 36px;
        font-weight: bold;
    }

    .hero--info p {
        color: #000000;
        font-size: 16px;
        font-weight: 600;
        margin-top: 6px;
    }

    /* главный дрон */
    .drone-img {
        position: absolute;
        left: 1.5vw; /* вровень с drone-bg-img по оси X */
        top: 18vh;    /* смещён чуть ниже центра круга */
        z-index: 3;
        
        visibility: hidden;

        transform-origin: center;

        /* только горизонтальное отражение + твой масштаб */
        transform: scaleX(-1) scale(1.025);
    }


   
        /* голубой круг за дроном */
    .drone-bg-img {
        position: absolute;

        left: 1.5vw;   /* как было */
        top: 17.3vh;

        visibility: hidden;

        transform-origin: center;

        /* только горизонтальное отражение + твой масштаб */
        transform: scaleX(-1) scale(1.025);

        z-index: 2;
    }


    /* тень под дроном */
    .drone-shadow-img {
        position: absolute;

        visibility: hidden;

        left: -6.6vw;  /* 775px ≈ 40.4vw */
        top: 8.1vh;    /* 87px ≈ 8.1vh */

        z-index: 1;
    }


    .white-dots-1 {
        position: absolute;
        left: 19vw;
        top: 21vh;

        width: 43px;
        height: 41.17px;
        z-index: 2;
    }

    .white-dots-2 {

        visibility: hidden;

        position: absolute;
        left: 38vw;
        top: 55vh;

        width: 43px;
        height: 41.17px;
        z-index: 2;
    }

    .black-dots {
        position: absolute;
        left: 69vw;
        top: 74vh;

        width: 43px;
        height: 41.17px;
        z-index: 2;
    }

    .gradient-box-new-one {
        
        visibility: visible;

        position: absolute;
        right: 16%;
        top: 131%;
        transform: translateY(-50%) rotate(65.85deg);
        width: 65vw;
        height: 165vh;
        background: linear-gradient(23.85deg, rgba(8, 77, 239, 1) 0%, rgba(8, 188, 239, 1) 94%);
        z-index: 1;
    }

    .services-grid {
        margin-left: 26px;
        margin-right: 26px;
    }

    .tech-solutions__title {
        margin-right: 16px;
    }

    .about-dots-right {
    right: clamp(20px, 5vw, 180px);
    top: clamp(10px, 5vw, 35px);
    }
    
    .about-dots-left {
        left: clamp(20px, 5vw, 180px);
        bottom: clamp(10px, 5vw, 35px);
    }

    .footer-top-inner {
        column-gap: 20px;
    }

}

/* hero-1100.css */
/* Специальные правки только для экранов уже 1100px */

@media (max-width: 987px) {

    
    /* Прячем основной header */
    header:not(.header--sticky) {
        display: none !important;
    }


    /* Чуть страхуемся, чтобы фон не вылезал */
    .hero-bg {
        position: absolute;
        inset: 0;
        overflow: hidden;
    }

    .gradient-box {
        position: absolute;
        right: 25%;
        top: -21%;
        transform: translateY(-50%) rotate(65.85deg);
        width: 65vw;
        height: 165vh;
        background: linear-gradient(23.85deg, rgba(8, 77, 239, 1) 0%, rgba(8, 188, 239, 1) 94%);
        z-index: 1;
    }

    .tech-layout {
        left:0px;
        right: 0px;
    }

    .white-dots-2 {
        visibility: hidden;
    }

    
    /* Включаем видео и светлую подложку */
    .technologies-video {
        opacity: 1;
    }

    .technologies-video-overlay {
        opacity: 1;
    }

    /* Прячем старый фон и дроны */
    .technologies-bg,
    .tech-drone-wrapper {
        display: none;
    }

    .technologies {
        padding: 0;
    }

    /* Заголовок по центру поверх видео */
    .tech--info {
        position: relative;
        z-index: 1;
        text-align: center;

        max-width: 987px;
    }

    .tech--info h1 {
        font-size: 36px;
        margin-bottom: 8px;
        color: #084DEF;
    }

    .tech--info h2 {
        font-size: 24px;
        margin: 0;
        color: #000000;
    }

    /* Контейнер с основным текстом */
    .tech-layout {
        position: relative;
        z-index: 1;
        max-width: 987px;
        margin: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .tech-solutions {
        text-align: center;
        margin: 0;
        width: 100%;
    }

    /* Убираем UNIQUE SOLUTIONS на мобильных */
    .tech-solutions__title {
        display: none;
    }

    /* Делаем весь текст "вертикальным" и читаемым */
    .tech-solutions__list {
        list-style: none;
        padding: 0;
        margin: 16px 0 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
        align-items: center;
    }

    .tech-solutions__item,
    .tech-solutions__item2 {
        max-width: 100%;
        font-size: 14px;
        line-height: 1.5;
    }

    .tech-solutions p[data-i18n="tech_intro"] {
        margin-top: 8px;
        margin-bottom: 12px;
        font-size: 14px;
    }

    .technologies {
        min-height: 580px;
        height: 580px;
    }

    .tech-solutions {
        margin-top: -180px;
    }
    
    .services-grid {
        display: flex;
        flex-direction: column; /* включаем вертикальную структуру */
        gap: 24px;              /* отступ между блоками */

        
        justify-content:center;
        
        justify-items: center; /* центрирует содержимое по горизонтали */
        align-items: center;   /* центрирует по вертикали (если есть высота) */
        text-align: center; 

    }

    .services-grid-right {
        order: 1;   /* ПЕРВЫМ наверху */
        flex: 1 1 0px;
        gap: 20px;

        margin-top: -20px;
        margin-right: 40px;
        margin-left: 40px;
        
        display:grid;
        justify-content:center;
        
        justify-items: center; /* центрирует содержимое по горизонтали */
        align-items: center;   /* центрирует по вертикали (если есть высота) */
        text-align: center; 
    }

    .services-grid-left {
        order: 2;   /* ВТОРЫМ снизу */
        max-width: 500px;

        flex: 0 0 0px;
    }

    /* левый размазанный */
    .gradient-box-secondary-one {
        position: absolute;
        left: -7vw;
        top: 65%;
        transform: translateY(-50%) rotate(65.85deg);

        width: 16vw;   /* ~293/1920 */
        height: 165vh; /* ~1793/1080 */

        background: linear-gradient(23.85deg, rgba(8, 77, 239, 1) 0%, rgba(8, 188, 239, 1) 100%);
        filter: blur(50px);
        opacity: 0.2;
        z-index: 1;
    }

    /* внутренняя полоса под дроном */
    .gradient-box-secondary-two {
        position: absolute;
        left: 20vw;
        top: 46%;

        width: 15vw;
        height: 85vh;

        transform: rotate(65.85deg);

        background: linear-gradient(
            63.85deg,
            #084def 0%,
            #08bdef4f 50%,
            #08bdef1f 60%,
            #efcc0800 70%
        );

        opacity: 0.4;
        z-index: 1;
        pointer-events: none;
    }

    /* верхний правый блик */
    .gradient-box-secondary-three {
        position: absolute;
        right: 65vw;
        top: -29vh;

        width: 20vw;
        height: 80vh;

        transform: rotate(65.85deg);

        background: linear-gradient(
            63.85deg,
            rgba(8, 77, 239, 0.192) 0%,
            rgba(8, 77, 239, 0) 15%,
            rgba(8, 173, 239, 0.664) 40%,
            #ffffff 100%
        );

        opacity: 0.2;
        pointer-events: none;
        z-index: 1;
    }

    .hero-main {
        display: flex;
        justify-content: center; /* прижимаем всё вправо */
    }

    .hero--info {
        max-width: 480px;
        margin-right: 6vw;  /* сдвигаем чуть вправо, 14vw - rus */
        margin-top: 36vh;
    }


    .hero--info h1 {
        color:#084DEF;
        font-size: 64px;
        font-weight: bold;
    }

    .hero--info h2 {
        color:#000000;
        font-size: 36px;
        font-weight: bold;
    }

    .hero--info p {
        color: #000000;
        font-size: 16px;
        font-weight: 600;
        margin-top: 6px;
    }

    /* главный дрон */
    .drone-img {
        position: absolute;
        left: 1.5vw; /* вровень с drone-bg-img по оси X */
        top: 18vh;    /* смещён чуть ниже центра круга */
        z-index: 3;
        
        visibility: hidden;

        transform-origin: center;

        /* только горизонтальное отражение + твой масштаб */
        transform: scaleX(-1) scale(1.025);
    }


   
        /* голубой круг за дроном */
    .drone-bg-img {
        position: absolute;

        left: 1.5vw;   /* как было */
        top: 17.3vh;

        visibility: hidden;

        transform-origin: center;

        /* только горизонтальное отражение + твой масштаб */
        transform: scaleX(-1) scale(1.025);

        z-index: 2;
    }


    /* тень под дроном */
    .drone-shadow-img {
        position: absolute;

        visibility: hidden;

        left: -6.6vw;  /* 775px ≈ 40.4vw */
        top: 8.1vh;    /* 87px ≈ 8.1vh */

        z-index: 1;
    }


    .white-dots-1 {
        visibility: hidden;
    }

    .black-dots {
        visibility: hidden;
    }

    .gradient-box-new-one {
        
        visibility: visible;

        position: absolute;
        right: 9%;
        top: 131%;
        transform: translateY(-50%) rotate(65.85deg);
        width: 65vw;
        height: 165vh;
        background: linear-gradient(23.85deg, rgba(8, 77, 239, 1) 0%, rgba(8, 188, 239, 1) 94%);
        z-index: 1;
    }

    .tech-solutions__title {
        margin-right: 16px;
    }

    .about-dots-right {
    right: clamp(20px, 5vw, 180px);
    top: clamp(10px, 5vw, 35px);
    }
    
    .about-dots-left {
        left: clamp(20px, 5vw, 180px);
        bottom: clamp(10px, 5vw, 35px);
    }

    
    .footer-top-inner {
        column-gap: 20px;
    }
    
    .request-quote__inner {
        display: flex;          /* на всякий случай, если где-то переопределялось */
        flex-direction: column; /* вместо ряда – колонка */
        gap: 24px;              /* отступ между формой и картой, по вкусу */
    }

    .request-quote__form-card,
    .request-quote__map-card {
        width: 500px;
        height: 500px;
    }

    .request-quote__map-card iframe#rq-map {
        width: 500px;
        height: 500px;
    }

    
    .footer-top-inner {
        grid-template-columns: 1fr;
        row-gap: 24px;
        column-gap: 0;
        padding: 0 24px;
    }

    .footer-left {
        display: flex;
        justify-content: center;
    }

    .footer-contact {
        margin-top: 30px;

        display:grid;
        justify-content:center;
        
        justify-items: center; /* центрирует содержимое по горизонтали */
        align-items: center;   /* центрирует по вертикали (если есть высота) */
        text-align: center; 
    }

    .footer-right {
        
        margin-top: 30px;
        display: flex;
        justify-content: center;

        margin-bottom: 30px;
    }
    

    .footer-social__icons {
        justify-content: flex-start;
    }

    .footer-brand__text {
        font-size: 24px;
    }

    .footer-bottom__line {
        width: 80%;
        max-width: 100%;
    }

    .footer-bottom__text {
        padding: 0 16px;
    }
}

@media (max-width: 905px) {
    .services-dot-left {
        visibility: hidden;
    }
    .services-dot-right {
        visibility: hidden;
    }
    .about-dots-left {
        visibility: hidden;
    }
    .about-dots-right {
        visibility: hidden;
    }
}

@media (max-width: 600px) {
    .gradient-box {
        right: 56%;
        top: 8%;
    }

    .gradient-box-new-one {

        right: 16%;
        top: 113%;
    }

    .gradient-box-secondary-three {
        right: 45vw;
        top: -29vh;
    }

    .gradient-box-secondary-two {
        left: 20vw;
        top: 39%;
    }
}

@media (max-width: 579px) {
    .request-quote__form-card,
    .request-quote__map-card {
        width: 350px;
        height: 350px;
    }

    .request-quote__map-card iframe#rq-map {
        width: 430px;
        height: 430px;
    }

    .request-quote__map-card {
        
        width: 430px;
        height: 430px;
    }
}

@media (max-width: 579px) {
    .checkbox-text-main {
        font-size: 14px;
    }

    .checkbox-text-sub {
        font-size: 14px;
    }

    .tech-solutions {
        width: 500px;
    }

}

/* OUR SERVICES и выше */

@media (max-width: 535px) {
    .tech-solutions p {
        position: relative;
        padding-left: 10%;
        padding-right: 10%;
    }
    
    .tech-solutions ul {
        position: relative;
        padding-left: 10%;
        padding-right: 10%;
    }

    .tech--info {
        padding-top: 20px;
    }

    .tech--info h1 {
        font-size: 28px;
        margin-bottom: 0px;
    }
    
    .tech--info h2 {
        font-size: 22px;
    }
    
    .tech-solutions {
        margin-bottom: -80px;
    }

    .about-title {
        margin-top: -10px;
    }

    .about-subtitle {
        font-size: 16px;
        margin-bottom: 16px;
    }

    .about-container {
        margin-bottom: -15px;
    }

    .about-container p {
        font-size: 14px;
    }

    .about-text {
        margin-bottom: 10px;
    }

    .request-quote {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .request-quote h2 {
        margin-bottom: 25px;
        font-size: 20px;
    }

    .footer-top,
    .footer-top-inner {
        padding: 0px;
    }

    .footer-top-inner div {
        margin: 0px;
    }

    .footer-left {
        padding-top: 10px;
    }

    .footer-right {
        padding-bottom: 20px;
    }

    .services-heading-one,
    .services-heading-two {
        font-size: 28px;
    }

    .services-heading-three,
    .services-heading-four {
        font-size: 24px;
    }

    .services-heading--secondary {
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .services-grid {
        margin-top: -5px;
    }

    .services-grid-right {
        margin-top: 0px;
        
        gap: 10px;
    }

    .services-grid-right p {
        font-size: 14px;
    }

    .services-grid-left h4 {
        font-size: 18px;
    }

    .services-heading {
        margin-bottom: 20px;
    }
    
    .services {
        padding-top: 26px;
        padding-bottom: 26px;
    }
}

@media (max-width: 501px) {
    .hero--info p {
        font-size: 14px;
    }

    .hero--info h1 {
        font-size: 48px;
    }

    .hero--info h2 {
        font-size: 24px;
    }

    .btn--primary,
    .btn--secondary {
        font-size: 18px;
    }

    .hero__actions {
        gap: 20px;
        margin-top: 18px;
    }
}

/* ПОМЕНЯТЬ РАЗМЕР ШРИФТА ОКОЛО ГАЛОЧКИ В ФОРМЕ + РАЗМЕР ШРИФТА НА ГЛАВНОЙ СТРАНИЦЕ + ИЗМЕНЕНИЕ КНОПОК НА ГЛАВНОЙ СТРАНИЦЕ */
@media (max-width: 451px) {
    .request-quote__form-card {
        max-width: 350px;
        width: 250px;
    }


    .request-quote__map-card iframe#rq-map {
        width: 330px;
        height: 330px;
    }

    .request-quote__map-card {
        width: 330px;
        height: 330px;
    }

    .checkbox-text-main {
        font-size: 11px;
    }

    .checkbox-text-sub {
        font-size: 11px;
    }

    .hero__actions a {
        font-size: 16px;
    }

    .services-cards {
        width: 100%;
        height: fit-content; 
    }

    .services-cards h3 {
        margin-top: 10px;
    }
}

@media (max-width: 437px) {

    .services-cards h3 {
        margin-top: 10px;
    }

    
    .tech-solutions ul {
        position: relative;
        padding-left: 14%;
        padding-right: 14%;
    }

}


@media (max-width: 428px) {
    .hero__actions a {
        font-size: 15px;
        padding-left: 24px;
        padding-right: 24px;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    
    .tech-solutions ul {
        position: relative;
        padding-left: 14%;
        padding-right: 14%;
    }
}

@media (max-width: 406px) {
    
    
    .tech-solutions ul {
        position: relative;
        padding-left: 19%;
        padding-right: 19%;
    }

    .hero-main {
        width: 300px;
    }


    .hero__actions {
        gap: 24px;
    }

    .hero__actions a {
        font-size: 13px;
        padding: 8px 20px;
    }

    .tech-solutions {
        padding-bottom: 30px;
    }

    .technologies {
        height: 610px;
    }
}

@media (max-width: 390px) {
    
    .tech-solutions ul {
        position: relative;
        padding-left: 24%;
        padding-right: 24%;
    }

    .tech-solutions p {
        margin: 0px 30px;
    }

    .tech-solutions span, li, p {
        font-size: 13px;
    }

    .hero {
        padding: 0 15%;
    }
}

@media (max-width: 375px) {
    
    .hero {
        padding: 0 14%;
    }
}


@media (max-width: 360px) {
    
    .hero {
        padding: 0 13%;
    }

    .services-heading--secondary span {
        font-size: 20px;
    }

    .services-cards h3 {
        font-size: 18px;
    }

    
    .services-cards {
        width: 250px;
        height: 300px;
    }

    .service-card-image {
        width: 250px;
        height: 180px;
    }
}



@media (max-width: 345px) {
    
    .hero {
        padding: 0 11%;
    }
}

@media (max-width: 320px) {
    
    .hero {
        padding: 0 8%;
    }
}