@media screen and (max-width: 1949.9px) {
    html { font-size: 11px }
}

@media screen and (max-width: 1799.9px) {
    html { font-size: 9px }
}

@media screen and (max-width: 1499.9px) {
    html { font-size: 8.5px }
}

@media screen and (max-width: 1399.9px) {
    html { font-size: 6.6px }
}

@media screen and (max-width: 1199.9px) {
    html { font-size: 6.08px }
}

@media screen and (max-width: 767.9px) {
    html { font-size: 10px }
}

@media screen and (max-width: 373.9px) {
    html { font-size: 8px }
}

/* --- Header & Mobile Menu --- */
@media screen and (max-width: 767.9px) {
    .header { width: 100vw; padding: 0 }
    .header__wrap { overflow-y: auto }
    .header__wrap .header__nav { display: none }
    .header__logo img { width: 12rem }
    
    /* Styles for the open mobile menu */
    .header__nav { margin-bottom: auto; position: relative; z-index: 1 }
    .header__nav-list { display: block; margin-right: 0; margin-bottom: auto }
    
    /* Main menu items */
    /* Increased line-height and margins for better tap targets */
    .header__nav-item { font-size: 3rem; line-height: 4rem; font-weight: 700; }
    .header__nav-item:not(:last-child) { margin-right: 0; margin-bottom: 2.5rem }
    
    /* Submenu items */
    .header__nav-item ul {
        margin-top: 0.8rem;
        margin-left: 2rem; /* Left indent for nesting */
    }
    .header__nav-item ul li {
        margin-bottom: 0.6rem; /* Reduced spacing between submenu items */
    }
    .header__nav-item ul li a {
        display: inline-block; /* Allows the link to occupy vertical space */
        padding: 0.25rem 0;    /* Reduced tap padding for tighter submenu */
        font-size: 1.8rem;
        line-height: 2.4rem;
        font-weight: 400;
        color: #a7acbb;
    }
    
    /* Active submenu item in the mobile menu */
    .header__nav-item ul li.active > a {
        color: #4d9eff; /* FIX: Changed from #0d44ce to #4d9eff for AA Contrast */
        font-weight: 600;
    }

    .header__acc { margin-right: 2.5rem }
    .header__menu-contacts { padding: 3rem 0 }
    .header__github { display: none }
    .header__logo .logo-placeholder { width: 12rem }

    /* Faster mobile menu animation (mobile only) */
    .header__menu {
        transition: height .22s, opacity .12s;
    }

    .header__menu.active {
        transition: height .22s, opacity .12s;
    }

    .header__menu > * {
        transition: opacity .12s, transform .18s;
        transform: translateY(-1.2rem);
    }

    .header__menu.active > * {
        transition: opacity .12s, transform .18s;
        transform: translateY(0);
    }

}

@media screen and (max-width: 767.9px) {
    main { padding-top: 10.5rem }
}

/* --- Layout helpers --- */
@media screen and (max-width: 991.9px) {
    .--narrow { padding-left: 7rem; padding-right: 7rem }
}

@media screen and (max-width: 767.9px) {
    .--narrow { padding: 0 1.6rem }
}

/* --- Typography --- */
@media screen and (max-width: 767.9px) {
    .heading-primary { 
        font-size: 4.5rem; 
        line-height: 1.1; 
        word-wrap: break-word;
        word-break: break-word;
    }

    /* Section-level headings (often <h2 class="heading-secondary">) */
    .heading-secondary { 
        font-size: 3.0rem; 
        line-height: 1.2;
        word-wrap: break-word;
        overflow-wrap: break-word; 
        word-break: break-word; 
        hyphens: auto; 
        max-width: 100%;
    }

    /* Page-level H1 (often <h1 class="heading-secondary">) */
    h1.heading-secondary {
        font-size: 3.8rem;
        line-height: 1.15;
    }

    /* Keep a clear hierarchy on mobile: H1 > H2 > H3 > H4 > H5 > H6 */
    h2 {
        font-size: 3.0rem;
        line-height: 1.2;
        margin-bottom: 1.8rem;
    }

    h3 {
        font-size: 2.3rem;
        line-height: 1.25;
        margin-bottom: 1.2rem;
    }

    h4 {
        font-size: 1.95rem;
        line-height: 1.3;
        margin-bottom: 1rem;
    }

    h5 {
        font-size: 1.75rem;
        line-height: 1.35;
        margin-bottom: 0.9rem;
    }

    h6 {
        font-size: 1.6rem;
        line-height: 1.35;
        margin-bottom: 0.8rem;
    }

    /*
       Pricing/docs pages style H3/H4 via higher-specificity selectors:
       .client__content h3 / .client__block-item h3 (and same for h4).
       Override them on mobile so H2 and H3 do not look identical.
    */
    .client__content h3,
    .client__block-item h3 {
        font-size: 2.3rem;
        line-height: 3rem;
        margin-bottom: 1.2rem;
        margin-top: 2.4rem;
    }

    .client__content h4,
    .client__block-item h4 {
        font-size: 1.95rem;
        line-height: 2.6rem;
        margin-bottom: 0.9rem;
        margin-top: 1.8rem;
    }

    .client__content h5,
    .client__block-item h5 {
        font-size: 1.75rem;
        line-height: 2.3rem;
        margin-bottom: 0.8rem;
        margin-top: 1.5rem;
    }

    .client__content h6,
    .client__block-item h6 {
        font-size: 1.6rem;
        line-height: 2.1rem;
        margin-bottom: 0.8rem;
        margin-top: 1.3rem;
    }
}


/* --- Visibility --- */
@media screen and (min-width: 768px) {
    .hidden-mobile { display: block }
}

@media screen and (max-width: 767.9px) {
    .hidden-desktop { display: block }
}

/* --- Footer --- */
@media screen and (max-width: 767.9px) {
    .footer { padding: 4rem 0 3rem }
    .footer__top { grid-template-columns: 100%; grid-gap: 3rem }
    .footer__top:not(:last-child) { margin-bottom: 4rem }
    .footer__logo { grid-column: auto }
    .footer__sub { grid-column: auto; margin-bottom: 1rem }
    .footer__nav { grid-column: auto }
    .footer__contacts { grid-column: auto }
    .footer__contacts-item { display: flex; align-items: center }
    .footer__contacts-item:not(:last-child) { margin-bottom: 2rem }
    .footer__contacts-subtitle { margin-bottom: 0; margin-right: 1rem }
    .footer__bottom { padding-top: 4rem; grid-template-columns: repeat(2, .5fr); grid-gap: 4rem 1rem }
}

/* --- Main Start --- */
/* Tablet styles */
@media screen and (max-width: 991.9px) {
    /* Reset padding for tablet to avoid desktop alignment issues */
    .main-start__wrap { grid-template-columns: 56.6rem auto; grid-gap: 5rem; padding-left: 0; }
    /* Reset animation position for tablet */
    .main-start__anim { left: 12.2rem; }
    
    /* FIX: Restore flex-start for mobile/tablet slider so scrolling works from the beginning */
    .swiper-wrapper { justify-content: flex-start; }
}

/* Mobile styles */
@media screen and (max-width: 767.9px) {
    .main-start { padding: 3rem 0 5rem; overflow: hidden; }
    
    .main-start__anim { 
        width: 100%; 
        max-width: 33.6rem; 
        height: 17.6rem; 
        position: absolute; 
        top: 0; 
        left: 50%; 
        transform: translateX(-50%); 
        pointer-events: none; 
        z-index: 0; 
    }
    .main-start__anim img:first-child { width: 26.3rem; height: 15.3rem }
    .main-start__anim img:nth-child(2) { width: 18.9rem; height: 11.3rem }
    .main-start__anim img:nth-child(3) { width: 16.4rem; height: 9.6rem }
    .main-start__anim.active img:first-child { top: 2.3rem }
    .main-start__anim.active img:nth-child(3) { top: 6.4rem; right: 2rem; }
    
    .main-start__wrap { 
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0; 
        margin-bottom: 6rem; 
        position: relative;
        width: 100%;
        padding-left: 0; /* Ensure padding is reset for mobile */
    }
    
    .main-start__wrap .icon-bg { display: none; }
    
    .main-start__text {
        width: 100%; 
        max-width: 100%;
        padding-right: 0; 
        box-sizing: border-box;
        text-align: left; 
        position: relative;
        z-index: 2; 
        margin-top: 1rem;
        min-width: 0;
    }
    
    .main-start__text .heading-secondary { margin-bottom: 2rem }
    
    .main-start__descr { font-size: 1.67rem; line-height: 2.4rem }
    
    .main-start__img { 
        max-width: 45rem; 
        width: 100%; 
        height: auto;
        margin: 3rem auto 0;
        display: block;
        position: relative;
        z-index: 2;
    }
    
    .main-start__slider { margin-top: 2rem; }
    .main-start__slider-item { width: 28rem; padding: 2rem; border-radius: 20px }
    .main-start__slider-name { font-size: 1.6rem; line-height: 2.4rem }
}

/* --- Main Introduction --- */
/* Tablet styles */
@media screen and (max-width: 991.9px) {
    .main-introduction__tab:nth-child(2) -img { right: -59rem; bottom: -39rem }
    .main-introduction__tab { padding: 6rem 9rem }
    .main-introduction__tab-descr { font-size: 1.6rem; line-height: 2.4rem }
}

/* Mobile styles */
@media screen and (max-width: 767.9px) {
    .main-introduction { padding: 5rem 0 }
    .main-introduction__wrap .icon-bg { width: 100%; left: -1.6rem; top: -4rem }
    .main-introduction__wrap .sub-h2 { font-size: 2rem }
    .main-introduction__wrap { display: block; margin-bottom: 10rem }
    .main-introduction__wrap.--narrow { padding: 0 }
    .main-introduction__wrap .heading-secondary { margin-bottom: 2rem }
    .main-introduction__text { font-size: 1.6rem; line-height: 2.4rem }
    .main-introduction__info { padding-left: 0 }
    .main-introduction__info-btn { flex: 1; padding: 1rem; text-align: center; font-size: 3rem; line-height: 3.6rem; border-radius: 20px 20px 0 0 }
    
    /* Private Tunnel section */
    .main-introduction__tab:first-child { padding-bottom: 22rem }
    
    .main-introduction__tab:first-child .main-introduction__tab-descr { 
        max-width: 100% !important; 
        width: 100%;
    }
    
    .main-introduction__tab:first-child .heading-secondary {
        max-width: 100%;
        width: 100%;
    }

    .main-introduction__tab:first-child .main-introduction__tab-img { width: 43rem; right: -10rem; bottom: -9rem }
    .main-introduction__tab:nth-child(2) { padding-bottom: 8rem }
    .main-introduction__tab:nth-child(2) -img { width: 43.7rem; right: -22rem; bottom: -15rem }
    
    .main-introduction__tab { 
        min-height: auto; 
        padding: 4rem 2rem; 
        width: 100%; 
        box-sizing: border-box;
    }
    .main-introduction__tab-descr { font-size: 1.6rem; line-height: 2.4rem }
}

/* --- Main Info --- */
/* Tablet styles */
@media screen and (max-width: 991.9px) {
    .main-info.--other .main-info__item:nth-child(4) .icon-bg { right: 0 }
}

/* Mobile styles */
@media screen and (max-width: 767.9px) {
    .main-info { padding: 0 0 5rem }
    .main-info.--other { padding-bottom: 10rem }
    .main-info.--other .main-info__item:nth-child(2) .icon-bg { width: 100%; left: 0; top: 1rem }
    .main-info.--other .main-info__item:nth-child(4) .icon-bg { width: 100%; left: 0; bottom: -7rem }
    .main-info__item { display: block; padding-top: 5rem }
    .main-info__item:not(:last-child) { margin-bottom: 5rem }
    .main-info__item .icon-bg { width: 100%; left: 1.1rem; top: -3.8rem }
    .main-info__item .heading-secondary { max-width: none; margin-bottom: 2rem }
    .main-info__descr { font-size: 1.6rem; line-height: 2.4rem }
}

/* --- Main Messages --- */
/* Tablet styles */
@media screen and (max-width: 991.9px) {
    .main-messages__wrap .icon-bg { right: 5rem }
}

/* Mobile styles */
@media screen and (max-width: 767.9px) {
    .main-messages { padding: 5rem 0 }
    .main-messages .heading-secondary { margin-bottom: 2rem }
    .main-messages__wrap { display: block }
    .main-messages__wrap .icon-bg { width: 100%; left: 0; bottom: -4.8rem }
    .main-messages__descr { font-size: 1.6rem; line-height: 2.4rem }
    .main-messages__descr:first-child { margin-bottom: 2rem }
}

/* --- Main Inspecting --- */
/* Tablet styles */
@media screen and (max-width: 991.9px) {
    .main-inspecting__wrap { grid-template-columns: 40% auto; grid-gap: 5rem }
}

/* Mobile styles */
@media screen and (max-width: 767.9px) {
    .main-inspecting { padding: 5rem 0 }
    .main-inspecting__wrap { grid-template-columns: 100%; grid-gap: 3rem }
    .main-inspecting__text .heading-secondary { margin-bottom: 2rem }
    .main-inspecting__descr { font-size: 1.6rem; line-height: 2.4rem }
    .main-inspecting__list { grid-template-columns: 100%; grid-gap: 1.6rem }
    .main-inspecting__item { min-height: 34.5rem }
    .main-inspecting__name { font-size: 1.6rem; line-height: 2.4rem }
    .client__page__sidebar-left, .client__page__sidebar-right { display: none; }
    .client__page-bg { top: -6rem; }
    .container { padding: 0 1.6rem; }
    .client__wrap { flex-direction: column; }
    .client__page { max-width: 100%; }
}

/* --- Swiper logic --- */
@media (max-width: 768px) {
    .swiper-slide { width: 308px !important; margin-right: 10px; }
}

@media (min-width: 1920px) {
    .swiper-slide { width: 445px !important; }
}

@media (hover: none) and (pointer: coarse) {
    .main-start__slider { -webkit-overflow-scrolling: touch; }
}

/* --- Pricing Grid --- */
@media (max-width:980px) {
    .aethernet-wrapper .grid { grid-template-columns: 1fr; }
}