/* ------- Media Query - 1200px ------ */
.dashboard-feature {
    display: none;
}
.book-demo-inner {
    width: 600px;
    padding: 0px;
}
.book-form-box {
    width: 100%;
    padding: 0px;
}

/* ------- Media Query - 991px -------- */
@media (max-width:991px){

    /* ----- menu ----- */
    .menu-icon {
        display: inline-block;
        width: 45px;
        height: 45px;
        background: var(--primary-gradient);
        padding: 12px;
        border-radius: 50%;
    }
    .menu {
        position: relative;
        order: 3;
        flex: none;
        display: flex;
        align-items: center;
        padding-left: 20px;
    }
    .menu ul{
        display: none;
        position: absolute;
        top: 125%;
        right: 0;
        flex-direction: column;
        width: 320px;
        gap: 0px;
        z-index: 999999999;
    }
    .menu-icon:hover .menu ul{
        display: flex !important; 
    }
    .menu ul li{
        background-color: #fff;
        width: 100%;
    }
    .header-inner {
        overflow: visible;
    }
    .menu li a:before,.menu li a.active:before{
        display: none;
    }

    /* ---- Hero Section ---- */
    .main-logo {
        width: 50%;
        flex-direction: column;
        margin: 0 auto;
    }
    .svg-layer {
        transform: rotate(91deg);
    }
    .svg-layer.reverse {
        transform: rotate(270deg);
    }
    .wallmart-logo, .apa-logo,.octopus-logo {
        position: relative;
        z-index: 99;
    }
    .wallmart-logo,.apa-logo {
        width: 100%;
        height: 100px;
    }
    .svg-layer svg {
        width: 70px;
    }
    .main-content-inner {
        padding: 0px 20px;
    }

    /*  */
    .main-content-inner h1 ,.main-content-inner h1 .title-colored {
        font-size: 42px;
        line-height: 54px;
    }
    .demo-btn-inner {
        display: block;
        max-width: 160px;
    }
    .demo-btn-inner a{
        line-height:44px;
    }

    /* --- Footer --- */
    .footer-inner {
        flex-direction: column;
        gap: 30px;
        align-items: center;
    }
    .footer-logo, .footer-icon{
        width:100%;
        padding: 0px 15px;
    }
    .footer-logo img{
        display: block;
        max-width:320px;
        width: 100%;
        margin: 0 auto;
    }
    .footer-icon-list ul{
        justify-content:center;
    }
    .footer-menu ul li a{
        white-space:nowrap;
    }
    .footer-logo a {
        display: block;
    }
    .footer-menu {
        padding: 0px 15px;
    }
    .footer-menu ul, .footer-icon-list ul {
        flex-wrap: wrap;
        justify-content: center;
    }
}


/* ------- Media Query - 551px ------- */

@media (max-width:551px) {
    .main-content-inner h1, .main-content-inner h1 .title-colored {
        font-size: 32px;
        line-height: normal;
    }
}