/* RESPONSIVE RESPONSIVE RESPONSIVE */
/* Мобильные устройства (маленькие) */
@media (min-width: 240px) and (max-width: 480px) {

    .floating-text:nth-of-type(6) {
        position: absolute;
        top: 40%;
        left: 82%;
    }

    .floating-text:nth-of-type(1) {
        position: absolute;
        top: 23% !important;
        left: 25% !important;
    }

    .floating-text:nth-of-type(2) {
        position: absolute;
        top: 10% !important;
        left: 40% !important;
    }

    .floating-text:nth-of-type(3) {
        /* display: none; */
        position: absolute;
        top: 15% !important;
        left: 70% !important;
    }

    .floating-text:nth-of-type(4) {
        /* display: none; */
        position: absolute;
        top: 80% !important;
        left: 10% !important;
    }

    .floating-text:nth-of-type(5) {
        display: none;
        position: absolute;
        top: 45%;
        left: 78%;
    }

    .floating-text:nth-of-type(6) {
        /* display: none; */
        position: absolute;
        top: 50%;
        left: 82%;
    }

    .floating-text:nth-of-type(7) {
        position: absolute;
        top: 80% !important;
        left: 55% !important;
    }

    .floating-text:nth-of-type(8) {
        display: none;
        position: absolute;
        top: 85%;
        left: 70%;
    }

    .floating-text:nth-of-type(9) {
        display: none;
        position: absolute;
        top: 77%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .floating-text:nth-of-type(10) {
        position: absolute;
        top: 89% !important;
        left: 23% !important;
    }

    .floating-text:nth-of-type(11) {
        display: none;
        position: absolute;
        top: 70% ;
        left: 30% ;
    }

    .floating-text:nth-of-type(12) {
        position: absolute;
        top: 73% !important;
        left: 25% !important;
    }

    .floating-text:nth-of-type(13) {
        display: none;
        position: absolute;
        top: 60%;
        left: 5%;
    }

    .floating-text:nth-of-type(14) {
        display: none;
        position: absolute;
        top: 45%;
        left: 10%;
    }

    .floating-text:nth-of-type(15) {
        display: none;
        position: absolute;
        top: 25%;
        left: 5%;
    }

    .floating-text:nth-of-type(16) {
        position: absolute;
        top: 15% !important;
        left: 5% !important;
    }

    .floating-text:nth-of-type(17) {
        display: none;
        position: absolute;
        top: 12%;
        left: 30%;
    }


    .hero-section {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .hero-title {
        text-align: center;
    }

    .customer-info-footer {
        display: flex !important;
        flex-direction: column;
        align-items: flex-start;
    }

    .legal-container {
        align-items: flex-start !important;
    }
}

@media (max-width: 480px) {




    .agents {
        padding: 0;
    }

    .hero-title::before {
        content: "";
        position: absolute;
        width: 60px;
        height: 60px;
        background-image: url('images/Union.svg');
        background-size: cover;
        background-repeat: no-repeat;
        top: -60px;
        left: 0px;
        z-index: 100;
    }

    .hero-title::after {
        content: "";
        position: absolute;
        width: 70px;
        height: 70px;
        background-image: url('images/Union.svg');
        background-size: cover;
        background-repeat: no-repeat;
        right: 0px;
        top: 40px;
        z-index: 100;
    }

    .development-container {
        flex-direction: column;
    }


    nav {
        padding: 15px;
    }

    .nav-list {
        display: none;
    }

    .logo {
        margin-right: 0;
    }

    .moriak-section {
        padding: 0 15px 30px 15px;
    }
}

/* Мобильные устройства (обычные) */
@media (max-width: 768px) {

    .container {
        height: 900px;
    }

    .development-container {
        flex-direction: column;
    }

   

    .floating-text:nth-of-type(6) {
        display: none ;
        position: absolute;
        top: 40%;
        left: 82%;
    }

    .floating-text:nth-of-type(13) {
        display: none ;
        position: absolute;
        top: 60%;
        left: 5%;
    }

    .hero-title {
        text-align: center;
    }


    .hero-title::before {
        content: "";
        position: absolute;
        width: 80px;
        height: 80px;
        background-image: url('images/Union.svg');
        background-size: cover;
        background-repeat: no-repeat;
        top: -30px;
        left: 0px;
        z-index: 100;
    }

    .hero-title::after {
        content: "";
        position: absolute;
        width: 70px;
        height: 70px;
        background-image: url('images/Union.svg');
        background-size: cover;
        background-repeat: no-repeat;
        right: 0px;
        top: 40px;
        z-index: 100;
    }

    nav {
        padding: 15px;
    }

    .nav-list {
        display: none;
    }

    .logo {
        margin-right: 0;
    }

    .moriak-section {
        padding: 0 15px 30px 15px;
    }

    footer {
        padding: 30px 20px;
        background-color: #E7E8ED;
    }

    footer::before {
        background: #E7E8ED;
    }

    .customer-info-footer {
        display: grid;
        grid-template-areas:
            "logo logo"
            "contact legal";
        grid-template-columns: 1fr 1fr;
        gap: 50px;
    }

    .footer-container {
        /* grid-area: logo; */
    }

    .footer-logo {
        font-size: 2.5rem;
        margin-bottom: 0;
    }

    .telephone-container {
        grid-area: contact;
        display: flex;
        flex-direction: column;
        gap: 15px;
        align-items: flex-start;
    }

    .legal-container {
        grid-area: legal;
        display: flex;
        flex-direction: column;
        gap: 15px;
        align-items: flex-end;
        justify-content: flex-start;
    }

    .telephone-container p,
    .legal-container p {
        font-size: 1.6rem;
        margin: 0;
    }

    .social-medias {
        display: flex;
        gap: 15px;
        margin-top: 5px;
    }

    .social-medias button {
        font-size: 1.6rem;
        width: 40px;
        height: 40px;
        border: 1px solid var(--base-blue-color);
        border-radius: 5px;
        background: transparent;
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--base-blue-color);
    }


    .comparison-container {
        display: flex;
        flex-direction: column;
    }

    .comparison-header {
        display: none;
    }

    .category.cloud{
     border-bottom: 1px solid rgba(39, 24, 169, 0.1); 
     padding: 0 0 30px 20px;
    }

    .pro_768{
        display: flex;
        justify-content: center;
    }

    .comparison-row {
        display: flex;
        flex-direction: column;
    }

    .comparison-header h2 {
        margin-bottom: 10px;
    }

    .category {
        margin-bottom: 10px;
        text-align: center;
        /* border-bottom: none; */
    }

    .pro-list,
    .contra-list {
        margin-bottom: 20px;
    }

}

/* Планшеты */
@media (max-width: 1024px) {
    .hero-title::after {
        content: "";
        position: absolute;
        width: 70px;
        height: 70px;
        background-image: url('images/Union.svg');
        background-size: cover;
        background-repeat: no-repeat;
        right: 0px;
        top: 40px;
        z-index: 100;
    }

    .development-container {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .floating-text {}

    .floating-text:nth-of-type(1) {
        position: absolute;
        top: 25%;
        left: 40%;
        transform: translate(-50%, -50%);
    }

    .floating-text:nth-of-type(2) {
        position: absolute;
        top: 12%;
        left: 60%;
    }

    .floating-text:nth-of-type(3) {
        position: absolute;
        top: 20%;
        left: 75%;
    }

    .floating-text:nth-of-type(4) {
        position: absolute;
        top: 30%;
        left: 85%;
    }

    .floating-text:nth-of-type(5) {
        display: none;
        position: absolute;
        top: 45%;
        left: 78%;
    }

    .floating-text:nth-of-type(6) {
        position: absolute;
        top: 50%;
        left: 82%;
    }

    .floating-text:nth-of-type(7) {
        position: absolute;
        top: 75%;
        left: 75%;
    }

    .floating-text:nth-of-type(8) {
        position: absolute;
        top: 85%;
        left: 70%;
    }

    .floating-text:nth-of-type(9) {
        display: none;
        position: absolute;
        top: 77%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .floating-text:nth-of-type(10) {
        position: absolute;
        top: 85%;
        left: 40%;
        transform: translate(-50%, -50%);
    }

    .floating-text:nth-of-type(11) {
        display: none;
        position: absolute;
        top: 70%;
        left: 30%;
    }

    .floating-text:nth-of-type(12) {
        position: absolute;
        top: 75%;
        left: 10%;
    }

    .floating-text:nth-of-type(13) {
        position: absolute;
        top: 60%;
        left: 5%;
    }

    .floating-text:nth-of-type(14) {
        display: none;
        position: absolute;
        top: 45%;
        left: 10%;
    }

    .floating-text:nth-of-type(15) {
        position: absolute;
        top: 25%;
        left: 5%;
    }

    .floating-text:nth-of-type(16) {
        position: absolute;
        top: 12%;
        left: 15%;
    }

    .floating-text:nth-of-type(17) {
        display: none;
        position: absolute;
        top: 12%;
        left: 30%;
    }



}

/* Малые десктопы */
@media (max-width: 1280px) {}

/* Стандартные и большие десктопы */
@media (max-width: 1536px) {}

/* Очень большие экраны (2K и выше) */
@media (min-width: 1536px) {}