/*
  Apex Global Xolutions
  MOBILE + TABLET RESPONSIVE OVERRIDE
  Keep this file loaded AFTER realestate.css.
  Desktop (1200px+) is intentionally untouched.
*/

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

    *,
    *::before,
    *::after {
        box-sizing: border-box
    }

    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden
    }

    body {
        margin: 0
    }

    img,
    svg,
    video,
    canvas {
        max-width: 100%;
        height: auto
    }

    input,
    select,
    textarea,
    button {
        max-width: 100%;
        font: inherit
    }

    a {
        max-width: 100%;
        overflow-wrap: anywhere
    }

    /* ---------- HEADER ---------- */
    .real-estate-consulting-prope-inner {
        max-width: 100% !important
    }

    .real-estate-consulting-prope>.real-estate-consulting-prope-inner:first-child {
        padding: 0 20px !important
    }

    .frame-parent {
        width: 100% !important;
        max-width: 100% !important;
        gap: 0 !important
    }

    .frame-parent>.real-estate-consulting-prope-inner {
        padding: 0 !important
    }

    .container {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-wrap: wrap !important;
        gap: 0 !important;
        padding: 12px 0 !important;
    }

    .container2 {
        width: auto !important;
        max-width: 180px !important;
        min-width: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 auto !important;
    }

    .container3 {
        max-width: 100% !important;
        min-width: 0 !important
    }

    .link-logo {
        display: block !important;
        width: auto !important;
        max-width: 180px !important;
        height: auto !important;
        object-fit: contain !important
    }

    .container4 {
        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 1 1 auto !important;
    }

    .container5 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .list {
        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-wrap: wrap !important;
        gap: 12px 30px !important;
        padding: 0 !important;
    }

    .item-link,
    .item-link2,
    .item-link3,
    .item-link4 {
        width: auto !important;
        max-width: 100% !important;
        padding: 0 !important;
        line-height: 26px !important;
        white-space: nowrap !important
    }

    .agx-service-dropdown {
        position: relative !important;
        display: flex !important;
        align-items: center !important
    }

    .agx-service-button {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        color: inherit !important;
        white-space: nowrap !important
    }

    .agx-dropdown-icon {
        width: 9px !important;
        height: 6px !important;
        object-fit: contain !important
    }

    .agx-service-menu {
        z-index: 1000 !important;
        left: 50% !important;
        right: auto !important;
        transform: translateX(-50%) !important;
        width: 220px !important;
        max-width: calc(100vw - 28px) !important
    }

    .container6 {
        width: auto !important;
        max-width: 100% !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 auto !important
    }

    .container7 {
        width: auto !important;
        max-width: 100% !important;
        height: auto !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 10px !important
    }

    .symbol-wrapper,
    .container-container {
        display: none !important
    }

    .container7>.link {
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        white-space: nowrap !important;
        padding: 11px 18px !important;
        border-radius: 10px !important
    }

    /* ---------- HERO ---------- */
    .container-frame {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        padding: 70px 34px !important;
        border-radius: 20px !important;
        overflow: hidden !important;
        background-position: center !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .container11 {
        width: min(700px, 100%) !important;
        max-width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 18px !important;
        text-align: center !important;
    }

    .heading-1 {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        text-align: center !important
    }

    .heading-4 {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        align-items: center !important;
        justify-content: center !important
    }

    .real-estate-consulting {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        font-size: clamp(20px, 4vw, 30px) !important;
        line-height: 1.05 !important;
        overflow-wrap: normal !important
    }

    .make-better-informed-property {
        width: 100% !important;
        max-width: 100% !important;
        font-size: clamp(28px, 5vw, 42px) !important;
        line-height: 1.08 !important;
        text-align: center !important;
        overflow-wrap: break-word !important
    }

    .container12 {
        width: 100% !important;
        max-width: 680px !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 0 !important;
        display: block !important;
        text-align: center !important
    }

    .real-estate-decisions {
        width: 100% !important;
        max-width: 100% !important;
        display: block !important;
        line-height: 1.65 !important;
        overflow-wrap: break-word !important
    }

    .link-parent {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 12px !important;
        flex-wrap: wrap !important
    }

    .link-parent .link2,
    .link-parent .link3 {
        width: auto !important;
        min-width: 190px !important;
        max-width: 100% !important;
        justify-content: center !important;
        white-space: normal !important;
        text-align: center !important;
        padding: 14px 20px !important;
        border-radius: 12px !important
    }

    /* ---------- RESET LEGACY SECTION GEOMETRY ---------- */
    .section-parent,
    .real-estate-consulting-prope-child,
    .section-parent3,
    .section-frame,
    .section11,
    .section-parent4,
    .section-wrapper2 {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        margin: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: visible !important;
    }

    .section-parent>.section,
    .section-parent>.section2,
    .section-wrapper>.section3,
    .section-container>.section4,
    .real-estate-consulting-prope-child>.section-group>.section5,
    .section-parent2>.section6,
    .section-parent2>.section7,
    .section-parent3>.section8,
    .section-parent3>.section9,
    .section-frame>.section4,
    .section11,
    .section12,
    .section13 {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        margin: 0 !important;
        transform: none !important;
        overflow: visible !important;
    }

    .section,
    .section2,
    .section3,
    .section4,
    .section5,
    .section6,
    .section7,
    .section8,
    .section9,
    .section11,
    .section12,
    .section13 {
        padding: 64px 7% !important;
        display: block !important;
        border-radius: 20px !important;
    }

    /* ---------- REAL ESTATE SERVICES / HOME BUYER ---------- */
    .container15,
    .container27,
    .container50,
    .container101,
    .container141,
    .container165,
    .container199,
    .container229,
    .container253 {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 34px !important;
    }

    .container16,
    .container18,
    .container28,
    .container50,
    .container101,
    .container141,
    .container142,
    .container144,
    .container165,
    .container199,
    .container200,
    .container202,
    .container233,
    .container253,
    .container287 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        margin: 0 !important;
        transform: none !important;
    }

    .container16,
    .container28,
    .container62,
    .container101,
    .container141,
    .container142,
    .container144,
    .container165,
    .container200,
    .container202,
    .container233,
    .container287 {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        gap: 28px !important
    }

    .container17,
    .container51,
    .container62,
    .container143,
    .container166,
    .container169,
    .container173,
    .container177,
    .container200,
    .container203,
    .container219,
    .container224,
    .container234,
    .container255,
    .container288,
    .container290 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        transform: none !important;
    }

    .container17,
    .container62,
    .container143,
    .container166,
    .container177,
    .container200,
    .container203,
    .container219,
    .container224,
    .container234,
    .container255,
    .container288,
    .container290 {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important
    }

    /* Every legacy image holder becomes an ordinary full-width visual. */
    .testi-thumbpng,
    .testi-thumbpng2,
    .testi-thumbpng3,
    .testi-thumbpng4,
    .testi-thumbpng5,
    .testi-thumbpng6,
    .testi-thumbpng7,
    .container-icon {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 220px !important;
        max-height: none !important;
        margin: 0 !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        background-size: cover !important;
        background-position: center !important;
        border-radius: 16px !important;
    }

    .container-icon {
        min-height: 0 !important;
        object-fit: contain !important;
        background: none !important
    }

    .container46,
    .container57,
    .container62 {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        overflow: hidden !important
    }

    .container47,
    .container58,
    .container63 {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important
    }

    /* Text columns must never inherit the desktop 500-900px widths. */
    .container19,
    .container20,
    .container21,
    .container22,
    .container23,
    .container24,
    .container25,
    .container26,
    .container29,
    .container30,
    .container32,
    .container33,
    .container34,
    .container35,
    .container36,
    .container37,
    .container38,
    .container39,
    .container40,
    .container41,
    .container42,
    .container43,
    .container44,
    .container45,
    .container52,
    .container53,
    .container55,
    .container66,
    .container67,
    .container68,
    .container84,
    .container86,
    .container101,
    .container122,
    .container138,
    .container142,
    .container144,
    .container166,
    .container169,
    .container173,
    .container218,
    .container224,
    .container233,
    .container234,
    .container239,
    .container255 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
    }

    .container19,
    .container20,
    .container30,
    .container52,
    .container53,
    .container55,
    .container66,
    .container67,
    .container68,
    .container84,
    .container86,
    .container122,
    .container142,
    .container144,
    .container166,
    .container169,
    .container173,
    .container218,
    .container224,
    .container233,
    .container234,
    .container239,
    .container255 {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 16px !important
    }

    .real-estate-services,
    .practical-support-for,
    .seller-preparation,
    .rental-and-relocation,
    .homebuyer-support,
    .buyer-readiness-and,
    .before-beginning-a,
    .apex-does-not,
    .vendor-coordination,
    .information-about-any,
    .apex-provides-consulting,
    .lets-get-started,
    .schedule-an-appointment {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        display: block !important;
        line-height: 1.25 !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
    }

    .real-estate-services,
    .practical-support-for {
        font-size: clamp(28px, 5vw, 42px) !important
    }

    .seller-preparation,
    .rental-and-relocation {
        font-size: clamp(28px, 5vw, 40px) !important
    }

    .homebuyer-support {
        font-size: clamp(25px, 4.5vw, 34px) !important
    }

    .container21,
    .container22 {
        font-size: inherit !important
    }

    .support-may-include,
    .whether-you-are,
    .apex-does-not,
    .information-about-any {
        width: 100% !important;
        max-width: 100% !important;
        line-height: 1.65 !important;
        overflow-wrap: break-word !important
    }

    /* Lists become real responsive lists instead of fixed desktop rows. */
    .list2,
    .frame-group,
    .item-parent,
    .item-group,
    .list-item-parent,
    .list-item-container,
    .item-list-parent,
    .list-item-parent2,
    .list-item-parent3,
    .list-item-parent4,
    .list-item-parent5,
    .list-item-parent6 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        margin: 0 !important;
    }

    .list2 .frame-group {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px 20px !important
    }

    .item,
    .item6,
    .list-item,
    .list-item2,
    .list-item3,
    .list-item4,
    .list-item5,
    .list-item6,
    .list-item7,
    .list-item8,
    .list-item9,
    .list-item10,
    .list-item12,
    .list-item15,
    .list-item16,
    .list-item27,
    .list-item28,
    .list-item31,
    .list-item33,
    .list-item36,
    .list-item39,
    .list-item41,
    .list-item44,
    .list-item49,
    .list-item55 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 26px !important;
        display: flex !important;
        align-items: flex-start !important;
        gap: 10px !important;
        margin: 0 !important;
    }

    .preferred-locations,
    .contractors,
    .home {
        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-wrap: break-word !important
    }

    .symbol3 {
        flex: 0 0 auto !important
    }

    /* ---------- PROCESS ---------- */
    .container141 {
        gap: 28px !important
    }

    .container144 {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 18px !important
    }

    .container145,
    .container151,
    .container157,
    .container163 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 0 !important;
        height: auto !important
    }

    .feature-item,
    .feature-item2,
    .feature-item3,
    .feature-item4,
    .feature-item5,
    .feature-item6,
    .feature-item7,
    .feature-item8 {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 260px !important;
        padding: 26px !important;
        border-radius: 14px !important;
    }

    .container147,
    .container152,
    .container157,
    .container162,
    .container205 {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important
    }

    /* ---------- STATS / WHY CHOOSE ---------- */
    .container170,
    .container173,
    .container218,
    .why-choose-grid,
    .why-choose-rows {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important
    }

    .container170 {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 0 !important
    }

    .container173 {
        padding: 28px !important
    }

    .why-choose-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 18px !important
    }

    .container202 {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 18px !important
    }

    .container203,
    .container219 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 0 !important;
        height: auto !important
    }

    .why-choose-rows {
        flex-wrap: wrap !important;
        justify-content: flex-start !important
    }

    /* ---------- FAQ ---------- */
    .container229 {
        height: auto !important;
        gap: 32px !important
    }

    .container232 {
        width: 100% !important;
        height: auto !important
    }

    .container233 {
        display: flex !important;
        flex-direction: column !important;
        gap: 20px !important
    }

    .container234,
    .start-accordion-list {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        min-width: 0 !important
    }

    .faq-list {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important
    }

    /* ---------- CONTACT ---------- */
    .contact-wrapper-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 0 !important;
        display: block !important
    }

    .contact-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 32px !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 24px !important;
        border-radius: 20px !important
    }

    .background-shape {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        background: none !important
    }

    .form-container,
    .form-wrapper,
    .header-box,
    .fields-wrapper,
    .name-fields-parent,
    .field-box-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important
    }

    .lets-get-started,
    .schedule-an-appointment {
        width: 100% !important;
        max-width: 100% !important;
        text-align: center !important;
        overflow-wrap: break-word !important
    }

    .name-fields,
    .name-fields3,
    .message-wrapper,
    .submit-your-message-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important
    }

    .message-wrapper {
        min-height: 150px !important
    }

    .submit-your-message-wrapper {
        justify-content: center !important;
        border-radius: 10px !important
    }

    input,
    select,
    textarea {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important
    }

    /* ---------- FOOTER ---------- */
    .section13 {
        padding: 50px 7% !important
    }

    .container253 {
        gap: 35px !important
    }

    .container255,
    .container288,
    .container290,
    .list3,
    .list5 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 0 !important;
        text-align: center !important
    }

    .link-logopng {
        margin: 0 auto !important;
        max-width: 100% !important
    }

    .list5 {
        display: flex !important;
        justify-content: center !important;
        flex-wrap: wrap !important;
        gap: 10px 18px !important
    }

    /* ---------- MOBILE-ONLY DECORATIVE ART ---------- */
    .background2,
    .symbol12,
    .container47 .container48,
    .container58 .container59,
    .container63 .container64,
    .container138,
    .container139,
    .container179,
    .heading-42,
    .heading-49,
    .brand-strategy,
    .brand-strategy7 {
        display: none !important;
        visibility: hidden !important;
        width: 0 !important;
        height: 0 !important;
        min-width: 0 !important;
        min-height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        background: none !important;
    }
}

@media screen and (min-width:768px) and (max-width:1199px) {

    /* TABLET: retain comfortable two-column layouts where there is room. */
    .real-estate-consulting-prope>.real-estate-consulting-prope-inner:first-child {
        padding: 0 36px !important
    }

    .container-frame {
        padding: 80px 8% !important
    }

    .section,
    .section2,
    .section3,
    .section4,
    .section5,
    .section6,
    .section7,
    .section8,
    .section9,
    .section11,
    .section12,
    .section13 {
        padding: 80px 8% !important
    }

    .container15,
    .container27,
    .container50,
    .container101 {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 42px !important;
        align-items: center !important
    }

    .container15>.container16,
    .container15>.container18,
    .container27>.container28,
    .container27>.container46,
    .container50>.container51,
    .container50>.container57,
    .container50>.container62,
    .container50>.container66,
    .container101>.container177,
    .container101>.container66 {
        width: 100% !important;
        min-width: 0 !important
    }

    .container144,
    .container202 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important
    }

    .contact-wrapper {
        padding: 40px !important
    }
}

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

    /* ---------- PHONE HEADER ---------- */
    .real-estate-consulting-prope>.real-estate-consulting-prope-inner:first-child {
        padding: 0 14px !important
    }

    .container {
        flex-direction: column !important;
        gap: 10px !important;
        padding: 12px 0 14px !important
    }

    .container2 {
        width: 100% !important;
        max-width: 100% !important
    }

    .link-logo {
        max-width: 160px !important
    }

    .container4 {
        width: 100% !important;
        flex: none !important
    }

    .container5 {
        width: 100% !important;
        flex-direction: column !important;
        gap: 12px !important
    }

    .list {
        width: 100% !important;
        gap: 7px 17px !important
    }

    .item-link,
    .item-link2,
    .item-link3,
    .item-link4 {
        font-size: 14px !important;
        line-height: 22px !important
    }

    .container6 {
        width: 100% !important
    }

    .container7 {
        width: 100% !important
    }

    .container7>.link {
        min-height: 42px !important;
        padding: 10px 18px !important
    }

    /* ---------- PHONE HERO ---------- */
    .container-frame {
        padding: 48px 20px !important;
        border-radius: 18px !important
    }

    .container11 {
        gap: 16px !important
    }

    .real-estate-consulting {
        font-size: 20px !important;
        line-height: 1.02 !important
    }

    .make-better-informed-property {
        font-size: 27px !important;
        line-height: 1.08 !important
    }

    .real-estate-decisions {
        font-size: 15px !important;
        line-height: 1.55 !important
    }

    .link-parent {
        flex-direction: column !important;
        gap: 10px !important
    }

    .link-parent .link2,
    .link-parent .link3 {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 280px !important;
        padding: 13px 16px !important;
        font-size: 14px !important;
        border-radius: 12px !important
    }

    /* ---------- PHONE SECTIONS ---------- */
    .section,
    .section2,
    .section3,
    .section4,
    .section5,
    .section6,
    .section7,
    .section8,
    .section9,
    .section11,
    .section12,
    .section13 {
        padding: 48px 18px !important;
        border-radius: 18px !important
    }

    .container15,
    .container27,
    .container50,
    .container101,
    .container141,
    .container165,
    .container199,
    .container229,
    .container253 {
        display: flex !important;
        flex-direction: column !important;
        gap: 28px !important
    }

    .container15>*,
    .container27>*,
    .container50>*,
    .container101>*,
    .container141>*,
    .container165>*,
    .container199>*,
    .container229>*,
    .container253>* {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important
    }

    .container16,
    .container18,
    .container28,
    .container46,
    .container51,
    .container57,
    .container62,
    .container66,
    .container101,
    .container141,
    .container142,
    .container144,
    .container165,
    .container199,
    .container200,
    .container202,
    .container233,
    .container253,
    .container287 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 22px !important
    }

    .testi-thumbpng,
    .testi-thumbpng2,
    .testi-thumbpng3,
    .testi-thumbpng4,
    .testi-thumbpng5,
    .testi-thumbpng6,
    .testi-thumbpng7 {
        width: 100% !important;
        height: 240px !important;
        min-height: 240px !important;
        border-radius: 16px !important;
        background-position: center !important
    }

    .container-icon {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        object-fit: contain !important;
        border-radius: 0 !important
    }

    .real-estate-services,
    .practical-support-for,
    .seller-preparation,
    .rental-and-relocation {
        font-size: 27px !important;
        line-height: 1.15 !important
    }

    .homebuyer-support {
        font-size: 25px !important;
        line-height: 1.15 !important
    }

    .support-may-include,
    .whether-you-are,
    .apex-does-not,
    .information-about-any {
        font-size: 15px !important;
        line-height: 1.6 !important
    }

    .list2 .frame-group {
        grid-template-columns: 1fr !important;
        gap: 9px !important
    }

    .why-choose-grid,
    .container202,
    .container144 {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 14px !important
    }

    .feature-item,
    .feature-item2,
    .feature-item3,
    .feature-item4,
    .feature-item5,
    .feature-item6,
    .feature-item7,
    .feature-item8 {
        min-height: 0 !important;
        padding: 24px !important
    }

    .contact-wrapper {
        padding: 24px 18px !important;
        border-radius: 18px !important
    }

    .lets-get-started {
        font-size: 36px !important;
        line-height: 1.05 !important
    }

    .schedule-an-appointment {
        font-size: 16px !important;
        line-height: 1.5 !important
    }

    .name-fields,
    .name-fields3 {
        padding: 16px !important
    }

    .message-wrapper {
        min-height: 135px !important;
        padding: 16px !important
    }

    .section13 {
        padding: 42px 18px !important
    }
}

@media screen and (max-width:390px) {
    .real-estate-consulting-prope>.real-estate-consulting-prope-inner:first-child {
        padding: 0 12px !important
    }

    .container-frame {
        padding: 42px 14px !important
    }

    .real-estate-consulting {
        font-size: 19px !important
    }

    .make-better-informed-property {
        font-size: 25px !important
    }

    .real-estate-decisions {
        font-size: 14px !important
    }

    .link-parent .link2,
    .link-parent .link3 {
        max-width: 270px !important;
        font-size: 13px !important
    }

    .section,
    .section2,
    .section3,
    .section4,
    .section5,
    .section6,
    .section7,
    .section8,
    .section9,
    .section11,
    .section12,
    .section13 {
        padding: 42px 14px !important
    }

    .testi-thumbpng,
    .testi-thumbpng2,
    .testi-thumbpng3,
    .testi-thumbpng4,
    .testi-thumbpng5,
    .testi-thumbpng6,
    .testi-thumbpng7 {
        height: 215px !important;
        min-height: 215px !important
    }
}

/* ================================================================
   FINAL MOBILE LEGACY-LAYOUT RESET
   Fixes old fixed-height/fixed-width content groups that can split
   text away from their icons when the desktop layout collapses.
   ================================================================ */
@media screen and (max-width: 767px) {

    /* Any old content wrapper that had a desktop pixel height must grow
     naturally on a phone. */
    .container-parent,
    .container-parent2,
    .container-parent3,
    .container-parent4,
    .container-group,
    .item-list-parent,
    .frame-container,
    .list-item-parent,
    .list-item-parent2,
    .list-item-parent3,
    .list-item-parent4,
    .list-item-parent5,
    .list-item-parent6,
    .list-item-container {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        box-sizing: border-box !important;
    }

    /* The Property Journey list is three desktop columns. On phones it is
     one normal vertical list, so nothing can jump to the far right. */
    .frame-container {
        display: grid !important;
        grid-template-columns: 1fr !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        gap: 8px !important;
        padding: 0 !important;
    }

    .frame-container .list-item-parent,
    .frame-container .list-item-container {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 7px !important;
        padding: 0 !important;
    }

    /* Every individual checklist row becomes a simple icon + text row. */
    .frame-container .list-item,
    .frame-container .list-item4,
    .frame-container .list-item5,
    .frame-container .list-item6,
    .frame-container .list-item7,
    .frame-container .list-item9,
    .frame-container .list-item10 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 32px !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 10px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .frame-container .container8,
    .frame-container .container36,
    .frame-container .container38 {
        width: 16px !important;
        min-width: 16px !important;
        max-width: 16px !important;
        height: 20px !important;
        flex: 0 0 16px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 !important;
    }

    .frame-container .icon {
        width: 16px !important;
        height: 16px !important;
        max-width: 16px !important;
        object-fit: contain !important;
        flex: 0 0 16px !important;
    }

    .frame-container .home,
    .frame-container .contractors,
    .frame-container .preferred-locations,
    .frame-container .expense-category-organization,
    .frame-container .vendor-coordination {
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        flex: 1 1 auto !important;
        display: block !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        line-height: 1.45 !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
    }

    /* Same protection for the other service-stage checklists throughout the
     page. Their desktop CSS uses hard-coded 245–446px heights and widths. */
    .list-item-parent2,
    .list-item-parent3,
    .list-item-parent4,
    .list-item-parent5,
    .list-item-parent6,
    .item-list-parent {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 7px !important;
        padding: 0 !important;
    }

    .list-item-parent2>[class^="list-item"],
    .list-item-parent3>[class^="list-item"],
    .list-item-parent4>[class^="list-item"],
    .list-item-parent5>[class^="list-item"],
    .list-item-parent6>[class^="list-item"],
    .item-list-parent>[class^="list-item"] {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 32px !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 10px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .list-item-parent2>[class^="list-item"]>div:last-child,
    .list-item-parent3>[class^="list-item"]>div:last-child,
    .list-item-parent4>[class^="list-item"]>div:last-child,
    .list-item-parent5>[class^="list-item"]>div:last-child,
    .list-item-parent6>[class^="list-item"]>div:last-child,
    .item-list-parent>[class^="list-item"]>div:last-child {
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        flex: 1 1 auto !important;
        display: block !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        line-height: 1.45 !important;
        overflow-wrap: anywhere !important;
    }

    /* Prevent a desktop image column from reserving an invisible giant area. */
    .container29,
    .container46,
    .container57,
    .container62,
    .container84,
    .container86,
    .container122,
    .container137,
    .container138,
    .section-parent2 {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
    }

    /* Remove stray desktop <br> spacing from responsive body copy where it
     creates artificial gaps. */
    .container32 br,
    .container55 br,
    .container-parent2 br,
    .container-parent3 br,
    .container-parent4 br {
        line-height: 1 !important;
    }
}

/* =====================================================================
   FINAL MOBILE TICK-LIST FIX
   Every row containing tickicon.png becomes one predictable icon + text
   row. This overrides the old desktop widths/heights/positioning.
   ===================================================================== */
@media screen and (max-width: 767px) {

    /* All checklist rows across every service section. */
    div[class^="list-item"]:has(> div > img.icon) {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 30px !important;
        max-height: none !important;
        display: grid !important;
        grid-template-columns: 18px minmax(0, 1fr) !important;
        align-items: start !important;
        column-gap: 10px !important;
        row-gap: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    /* The icon holder must never inherit a desktop width/padding/offset. */
    div[class^="list-item"]:has(> div > img.icon)>div:first-child {
        width: 18px !important;
        min-width: 18px !important;
        max-width: 18px !important;
        height: 20px !important;
        min-height: 20px !important;
        max-height: 20px !important;
        padding: 0 !important;
        margin: 0 !important;
        display: flex !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        box-sizing: border-box !important;
    }

    div[class^="list-item"]:has(> div > img.icon)>div:first-child img.icon {
        width: 16px !important;
        height: 14px !important;
        min-width: 16px !important;
        max-width: 16px !important;
        min-height: 14px !important;
        max-height: 14px !important;
        margin: 2px 0 0 !important;
        padding: 0 !important;
        object-fit: contain !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
    }

    /* The text is always the second grid cell, regardless of its old class. */
    div[class^="list-item"]:has(> div > img.icon)>div:last-child {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 0 !important;
        margin: 0 !important;
        display: block !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        flex: none !important;
        line-height: 1.5 !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
        white-space: normal !important;
        box-sizing: border-box !important;
    }

    /* Keep the list groups themselves simple and full width. */
    .frame-container .list-item-parent,
    .frame-container .list-item-container,
    .item-list-parent,
    .list-item-parent2,
    .list-item-parent3,
    .list-item-parent4,
    .list-item-parent5,
    .list-item-parent6,
    .consultation-items-parent {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
        padding: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
    }

    /* Kill the one especially nasty desktop spacer/padding row. */
    .list-item16,
    .list-item26,
    .list-item27,
    .list-item31,
    .list-item39,
    .list-item47,
    .list-item55 {
        padding: 0 !important;
    }

    /* FAQ is intentionally hidden on phones only. */
    .section-parent4 {
        display: none !important;
        visibility: hidden !important;
        width: 0 !important;
        height: 0 !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }
}

/* ================================================================
   FINAL CLEANUP — RENTAL CHECKLIST + FOOTER
   Mobile only. Desktop is intentionally untouched.
   ================================================================ */
@media screen and (max-width: 767px) {

    /* Rental & Relocation: turn the two old desktop columns into one
     normal mobile list. */
    .container66 .item-list-parent,
    .container66 .list-item-container {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
        padding: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    .container66 .list-item12,
    .container66 .list-item15,
    .container66 .list-item16 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 30px !important;
        display: grid !important;
        grid-template-columns: 18px minmax(0, 1fr) !important;
        align-items: start !important;
        column-gap: 10px !important;
        margin: 0 !important;
        padding: 0 !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        box-sizing: border-box !important;
    }

    .container66 .list-item12>.container8,
    .container66 .list-item15>.container36,
    .container66 .list-item16>.container8 {
        width: 18px !important;
        min-width: 18px !important;
        max-width: 18px !important;
        height: 20px !important;
        min-height: 20px !important;
        padding: 0 !important;
        margin: 0 !important;
        display: flex !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
    }

    .container66 .list-item12>.container8 .icon,
    .container66 .list-item15>.container36 .icon,
    .container66 .list-item16>.container8 .icon {
        width: 16px !important;
        height: 14px !important;
        min-width: 16px !important;
        max-width: 16px !important;
        min-height: 14px !important;
        max-height: 14px !important;
        object-fit: contain !important;
        margin: 2px 0 0 !important;
        padding: 0 !important;
        position: static !important;
    }

    .container66 .list-item12>.home,
    .container66 .list-item15>.home,
    .container66 .list-item16>.home {
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        display: block !important;
        position: static !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.5 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
    }

    /* Apply the same stable icon/text treatment to every tick-list on
     mobile, including variants with different list-item class names. */
    .list-item-container>.list-item12,
    .list-item-container>.list-item15,
    .list-item-container>.list-item16 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    /* ---------- MOBILE FOOTER ---------- */
    .section13 {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 38px 22px !important;
        overflow: hidden !important;
    }

    .section13 .container253 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 30px !important;
        margin: 0 !important;
    }

    .section13 .container27,
    .section13 .container259,
    .section13 .container274 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        align-self: stretch !important;
    }

    .section13 .container255,
    .section13 .container260,
    .section13 .container275 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        align-items: flex-start !important;
        text-align: left !important;
    }

    .section13 .container260,
    .section13 .container275 {
        display: flex !important;
        flex-direction: column !important;
        gap: 14px !important;
    }

    .section13 .quick-links {
        width: 100% !important;
        text-align: left !important;
        margin: 0 0 2px !important;
    }

    .section13 .list3 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: left !important;
    }

    .section13 .item11 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        display: block !important;
    }

    .section13 .link20 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        gap: 9px !important;
        padding: 0 !important;
        margin: 0 !important;
        text-align: left !important;
    }

    .section13 .link20 .container261 {
        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
        flex: 0 0 0 !important;
    }

    .section13 .link20 .home,
    .section13 .link20 .travel-documentation,
    .section13 .link20 .ink-sprink-publishing,
    .section13 .link20 .business-setup,
    .section13 .link20 .office-workspace {
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        flex: 1 1 auto !important;
        display: block !important;
        position: static !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.5 !important;
        text-align: left !important;
        overflow-wrap: anywhere !important;
    }

    /* Contact column: icon and information stay on the same clean row. */
    .section13 .footer-widget-address,
    .section13 .footer-widget-address2,
    .section13 .footer-widget-address3 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 25px !important;
        padding: 0 !important;
        margin: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        gap: 11px !important;
        box-sizing: border-box !important;
        text-align: left !important;
    }

    .section13 .footer-widget-address {
        min-height: 50px !important;
    }

    .section13 .container278,
    .section13 .container280 {
        width: 25px !important;
        min-width: 25px !important;
        max-width: 25px !important;
        height: 25px !important;
        min-height: 25px !important;
        margin: 0 !important;
        padding: 0 !important;
        flex: 0 0 25px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: static !important;
        overflow: visible !important;
    }

    .section13 .background10,
    .section13 .background11,
    .section13 .background-icon {
        width: 25px !important;
        height: 25px !important;
        min-width: 25px !important;
        max-width: 25px !important;
        min-height: 25px !important;
        max-height: 25px !important;
        margin: 0 !important;
        position: static !important;
        object-fit: contain !important;
    }

    .section13 .container276,
    .section13 .container281,
    .section13 .container283 {
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        flex: 1 1 auto !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        position: static !important;
        overflow: visible !important;
        text-align: left !important;
    }

    .section13 .our-address,
    .section13 .avg-clients-ratings {
        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.5 !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
        text-align: left !important;
    }

    .section13 .footer-widget-address .container278 {
        order: 0 !important;
    }

    .section13 .footer-widget-address .container276 {
        order: 1 !important;
    }

    .section13 .footer-widget-address2 .container281,
    .section13 .footer-widget-address3 .container283 {
        margin-left: 0 !important;
    }
}

/* FINAL RENTAL TICK ALIGNMENT — mobile only */
@media screen and (max-width: 767px) {

    .container66 .item-list-parent .list-item-container>div.list-item12,
    .container66 .item-list-parent .list-item-container>div.list-item15,
    .container66 .item-list-parent .list-item-container>div.list-item16 {
        display: grid !important;
        grid-template-columns: 18px minmax(0, 1fr) !important;
        align-items: start !important;
        justify-content: initial !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 10px !important;
        column-gap: 10px !important;
        row-gap: 0 !important;
        position: static !important;
        inset: auto !important;
        transform: none !important;
        box-sizing: border-box !important;
    }

    .container66 .item-list-parent .list-item-container>div.list-item12>.container8,
    .container66 .item-list-parent .list-item-container>div.list-item15>.container36,
    .container66 .item-list-parent .list-item-container>div.list-item16>.container8 {
        width: 18px !important;
        min-width: 18px !important;
        max-width: 18px !important;
        height: 20px !important;
        min-height: 20px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        position: static !important;
        box-sizing: border-box !important;
    }

    .container66 .item-list-parent .list-item-container>div.list-item12>.container8 .icon,
    .container66 .item-list-parent .list-item-container>div.list-item15>.container36 .icon,
    .container66 .item-list-parent .list-item-container>div.list-item16>.container8 .icon {
        display: block !important;
        width: 16px !important;
        height: 14px !important;
        min-width: 16px !important;
        max-width: 16px !important;
        margin: 4px 0 0 !important;
        padding: 0 !important;
        position: static !important;
        align-self: flex-start !important;
        object-fit: contain !important;
    }

    .container66 .item-list-parent .list-item-container>div.list-item12>.home,
    .container66 .item-list-parent .list-item-container>div.list-item15>.home,
    .container66 .item-list-parent .list-item-container>div.list-item16>.home {
        display: block !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        position: static !important;
        inset: auto !important;
        transform: none !important;
        align-self: start !important;
        line-height: 1.5 !important;
        white-space: normal !important;
        overflow: visible !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
        text-align: left !important;
    }
}