.logo-img{
    height:70px !important;
}

.about-wrapper .about-content p {    
    margin-bottom: 0px !important;
}


.section-title .titlespan {
    font-family: "Circular Std", sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    text-transform: uppercase;
    margin-bottom: 20px;
    padding-right: 5px;
    color: #ee3137;
    position: relative;
    left: 0%;
    transform: translateX(0%);
    opacity: 1;
    z-index: -1;
    top: 0px;
    margin: 0px auto;
}

.funfact-content-grid {   
    grid-template-columns: 1fr 1fr 1fr;
}

.page-banner-wrap {   
    padding-bottom: 60px;
    padding-top: 80px;
}

.single-client img {
    width: 150px;
    margin: auto;
    height: 120px !important;
    text-align: center;
}

.about-wrapper {
    position: relative;
    /*padding-bottom: 120px;*/
    padding-top: 50px;
}

.section-padding {
    padding: 50px 0px;
}

.titlespan {
    font-family: "Circular Std", sans-serif;
    color: #ee3137;
}
 @media (min-width: 992px) {

    a.service-card-link {
        height: 320px !important;
    }

    .single-service-vcard {
        height: 500px;
    }
    .inventory-offer {
        height: 300px !important;
    }
    
    .single-card {
        height: 380px;
    }

    .single-card1 {
        height: 430px;
    }

    .single-cardHR {
        height: 400px;
    }
    .single-vcard-aat {
        height: 315px;
    }

    .single-card-CRM {
        height: 470px;
    }

    .single-service {
        height: 320px;
    }

    .single-security-card {
        height: 340px;
    }

    .single-service-vcard1 {
        height: 440px;
    }

    .single-service-vcard2 {
        height: 440px;
    }

    .single-service-inventory {
        height: 270px !important;
    }

    .single-vcard {
        height: 300px;
    }

    .single-vcard1 {
        height: 260px;
    }

    .single-vcard2 {
        height: 440px;
    }

    .single-vcard3 {
        height: 250px;
    }

    .vcard {
        height: 430px;
    }

    .single-card-icon {
        height: 560px;
    }

    .single-service-vcard5 {
        height: 620px;
    }

    .single-service-vcard6 {
        height: 670px;
    }

    .single-card-security {
        height: 314px;
    }
}

.security-img {
    height: 340px;
    margin-top: 30px !important;
}

.erp-img {
    height: 300px;
    margin-top:30px !important;
}

.hr-img {
    height: 315px;
    margin-top: 30px !important;
}

/* Hero banner image + heading crossfade slider */
.hero-6 .banner-img-slider {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
}

    .hero-6 .banner-img-slider .banner-slide-img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: contain;
        opacity: 0;
        visibility: hidden;
        transition: opacity 3s ease-in-out;
    }

        .hero-6 .banner-img-slider .banner-slide-img.active {
            opacity: 1;
            visibility: visible;
            position: relative;
            z-index: 1;
        }

.hero-6 .banner-content h2.banner-heading-slider {
    position: relative;
    display: block;
    min-height: 3.6em;
}

    .hero-6 .banner-content h2.banner-heading-slider .banner-heading-slide {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        opacity: 0;
        visibility: hidden;
        transition: opacity 5s ease-in-out;
    }

        .hero-6 .banner-content h2.banner-heading-slider .banner-heading-slide.active {
            opacity: 1;
            visibility: visible;
            position: relative;
            z-index: 1;
        }

.hero-6 .banner-content h2 span {
    text-align: left;
    font-family: "Nunito", sans-serif;
    font-style: normal;
    font-weight: 800;
    font-size: 55px;
    line-height: 80px;
    color: #211e3b;
}

@media (max-width: 500px) {
    .hero-6 .banner-content h2 span {
        text-align: center !important;
        font-size: 30px;
        line-height: 35px;
    }
}

@media (min-width: 992px) {
    .img-right {
        text-align: right;
    }
}

@media (max-width: 1200px) {
    .img-right {
        text-align: center;
    }

    .img-left {
        text-align: center;
    }
}

.project__items {
    border: 1px solid #016ab4;
    padding:10px !important;
}

.bg-white1 {
    background-color: #eef4fc !important;
}

.single-service-vcard1 {
    padding: 10px;
   margin-top:10px !important;
}

.single-service-vcard2 {
    padding: 10px;
    margin-top: 10px !important;
    background-color: #eef4fc !important;
}

.erp-card {
    border: 1px solid #e5e5e5;
    border-radius: 12px;  
    margin-bottom: 20px;
    overflow: hidden;
    transition: .3s;
    background-color: #fff !important;
}

.erp-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    padding: 12px;
}

.erp-icon {
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: #EEF4FF;
    margin-right: 20px;
}

    .erp-icon i {
        font-size: 26px;
        color: #0D6EFD;
    }

.erp-title {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .erp-title h4 {
        margin-bottom: 8px;
        font-size: 16px;
    }

    .erp-title4 {
        margin: 0;
        font-size: 16px;
        line-height: 22px;
        min-height: 44px; /* Equal height for all titles */
        display: flex;
        align-items: center;
    }

    .erp-title p {
        margin: 0;
        color: #777;
    }

.erp-card-body {
    display: none;
    padding: 5px;
    border-top: 1px solid #fff;
}

    .erp-card-body ul {
        margin: 0;
        padding-left: 20px;
    }

    .erp-card-body li {
        font-size:15px !important;
    }

.erp-toggle {
    font-size: 22px;
}

.erp-grid {
    display: grid;
    grid-template-columns: repeat(5,1fr);
    gap: 20px;
    align-items: start;
}

@media(max-width:1200px) {
    .erp-grid {
        grid-template-columns: repeat(3,1fr);
    }  
}

@media(max-width:768px) {
    .erp-grid {
        grid-template-columns: repeat(2,1fr);
    }
}

@media(max-width:576px) {
    .erp-grid {
        grid-template-columns: 1fr;
    }  
}

.web-design-padg {
    padding: unset !important;
}

.what-design-Dev {
    height: 500px;
}

.what-we-offer {
    height: 480px;
}

.what-we-offer-webapp {
    height: 480px;
}

.what-we-offer-mobileapp {
    height: 480px;
}

.what-we-offer-posapp {
    height: 480px;
}

.what-we-offer-hireDed {
    height: 480px;
}

.workflow-circle {
    position: relative;
    width: min(90vw, 750px);
    aspect-ratio: 1;
    margin: 60px auto;
}
.center-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: clamp(120px, 28%, 220px);
    aspect-ratio: 1;
    border-radius: 50%;
    background: #0d6efd;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    box-shadow: 0 10px 30px rgba(0,0,0,.15);
    z-index: 2;
}

.workflow-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.center-circle h3 {
    font-size: clamp(16px,2vw,24px);
    color: #fff;
    margin: 0;
}

.center-circle p {
    font-size: clamp(11px,1.2vw,15px);
    margin-top: 8px;
}

.step {
    position: absolute;
    width: clamp(80px,18%,130px);
    text-align: center;
    z-index: 2;
}

.workflow-circle .icon {
    position: relative;
    width: clamp(50px,9vw,70px);
    height: clamp(50px,9vw,70px);
    border-radius: 50%;
    background: #0d6efd;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    color: #fff;
    font-size: clamp(18px,2vw,28px);
    transition: .35s;
    box-shadow: 0 6px 18px rgba(0,0,0,.15);
}

    .workflow-circle .icon:hover {
        transform: scale(1.1);
        background: #083d8c;
    }

.step-number {
    position: absolute;
    top: -6px;
    right: -6px;
    width: clamp(18px,3vw,24px);
    height: clamp(18px,3vw,24px);
    border-radius: 50%;
    background: #1b2452;
    color: #fff;
    border: 2px solid #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: clamp(9px,1vw,11px);
    font-weight: 700;
}

.step span {
    display: block;
    margin-top: 10px;
    font-size: clamp(10px,1.3vw,14px);
    font-weight: 600;
    line-height: 1.4;
}

/* Positioning */
.step1 {
    top: -3%;
    left: 40%;
    transform: translateX(-50%);
}

.step2 {
    top: 8%;
    right: 12%;
}

.step3 {
    top: 24%;
    right: -3%;
}

.step4 {
    top: 43%;
    right: -5%;
}

.step5 {
    bottom: 24%;
    right: -3%;
}

.step6 {
    bottom: 8%;
    right: 12%;
}

.step7 {
    bottom: -3%;
    left: 40%;
    transform: translateX(-50%);
}

.step8 {
    bottom: 8%;
    left: 12%;
}

.step9 {
    bottom: 24%;
    left: -3%;
}

.step10 {
    top: 43%;
    left: -5%;
}

.step11 {
    top: 24%;
    left: -3%;
}

.step12 {
    top: 8%;
    left: 12%;
}

@media(max-width:1200px) {

    .workflow-circle {
        width: 650px;
    }
}

/* iPad Landscape */

@media(max-width:992px) {

    .workflow-circle {
        width: 560px;
    }
}

/* iPad Portrait */

@media(max-width:768px) {

    .workflow-circle {
        width: 430px;
    }
}

/* Mobile */

@media(max-width:576px) {

    .workflow-circle {
        width: 330px;
    }
}

.erp-card1 {
    border: 1px solid #e5e5e5;
    border-radius: 12px;
    margin-bottom: 20px;
    overflow: hidden;
    transition: .3s;
    background-color: #fff !important;
}

.erp-card-header1 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    padding: 12px;
}

.erp-icon1 {
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: #EEF4FF;
    margin-right: 20px;
}

    .erp-icon1 i {
        font-size: 26px;
        color: #0D6EFD;
    }

.erp-title1 {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

    .erp-title1 h4 {
        margin-bottom: 8px;
        font-size: 16px;
    }

    .erp-title1 p {
        flex: 0 0 100%;
        margin-top: 8px;
    }

.erp-card-body1 {
    display: none;
    padding: 5px;
    border-top: 1px solid #fff;
}

    .erp-card-body1 ul {
        margin: 0;
        padding-left: 20px;
    }

    .erp-card-body1 li {
        font-size: 15px !important;
    }

.erp-toggle1 {
    font-size: 22px;
}

.erp-grid1 {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 20px;
    align-items: start;
}

@media (max-width: 768px) {
    .erp-grid1 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .erp-grid1 {
        grid-template-columns: 1fr;
    }
}

.schedule-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(300px,1fr));
    gap: 25px;
}

.schedule-card {
    position: relative;
    height: 260px;
    border-radius: 15px;
    overflow: hidden;
    cursor: pointer;
    perspective: 1000px;
}

.schedule-front,
.schedule-back {
    position: absolute;
    width: 100%;
    height: 100%;
    padding: 25px;
    border-radius: 15px;
    transition: .6s;
    backface-visibility: hidden;
}

.schedule-front {
    background: #eef4fc;
    border: 1px solid #eef4fc;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

    .schedule-front h4 {
        margin: 15px 0;
        color: rgb(0, 108, 181);
        font-weight: 700;
    }

    .schedule-front p {
        margin: 4px 0;
        color: #555;
    }

.schedule-icon {
    font-size: 40px;
}

.schedule-back {
    background: #eef4fc;
    color: #006cb5;
    transform: rotateY(180deg);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

    .schedule-back h5 {
        margin-bottom: 15px;
        font-size: 20px;
        font-weight: 700;
    }

    .schedule-back ul {
        margin: 0;
        padding-left: 20px;
    }

    .schedule-back li {
        margin-bottom: 8px;
    }

@media (hover: hover) {
    .schedule-card:hover .schedule-front {
        transform: rotateY(180deg);
    }

    .schedule-card:hover .schedule-back {
        transform: rotateY(360deg);
    }
}
.schedule-card.active .schedule-front {
    transform: rotateY(180deg);
}

.schedule-card.active .schedule-back {
    transform: rotateY(360deg);
}

.workflow-section {
    position: relative;
    width: 650px;
    height: 650px;
    margin: 60px auto;
}

.workflow-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: #fff;
    color: #006cb5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    box-shadow: 0 10px 25px rgba(0,0,0,.2);
}

    .workflow-center i {
        font-size: 42px;
        margin-bottom: 10px;
    }

    .workflow-center h4 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #006cb5;
    }

.workflow-step {
    position: absolute;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #006cb5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 10px;
    transition: .3s;
    box-shadow: 0 5px 15px rgba(0,0,0,.08);
}

    .workflow-step i {
        font-size: 28px;
        color: #006cb5;
        margin-bottom: 8px;
    }

    .workflow-step span {
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
    }

    .workflow-step:hover {
        background: #006cb5;
        color: #fff;
        transform: scale(1.08);
    }

        .workflow-step:hover i {
            color: #fff;
        }

@media(max-width:768px) {

    .workflow-section {
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }

    .workflow-center {
        position: relative;
        transform: none;
        left: auto;
        top: auto;
        margin-bottom: 20px;
    }

    .workflow-step {
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
        transform: none !important;
    }
}

.erp-facility-card {
    background-color: #eef4fc !important;
    border-radius: 0px !important;
}

.erp-grid-facility {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    gap: 2px;
    align-items: start;
}

.erp-feature-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .erp-feature-list li {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 10px;
        font-size: 16px !important;         
    }

        .erp-feature-list li i {
            color: #0d6efd;
            width: 22px;
            text-align: center;
            font-size: 18px;
        }

.erp-card-body1 i {
    color: #0d6efd;
    width: 22px;
    text-align: center;
    font-size: 18px;
}

.erp-facility-body {
    padding: 15px !important;
}

.erp-facility-body h5 {
    color: #ee3137;
}

.workflow-scroll {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 20px 0;
    scroll-behavior: smooth;
}

    /* Professional scrollbar */
    .workflow-scroll::-webkit-scrollbar {
        height: 8px;
    }

    .workflow-scroll::-webkit-scrollbar-track {
        background: #ececec;
        border-radius: 20px;
    }

    .workflow-scroll::-webkit-scrollbar-thumb {
        background: #0d6efd;
        border-radius: 20px;
    }

        .workflow-scroll::-webkit-scrollbar-thumb:hover {
            background: #0b5ed7;
        }

.workflow-container {
    display: flex;
    align-items: center;
    width: max-content;
    padding: 20px;
}

.workflow-item {
    width: 165px;
    text-align: center;
    flex-shrink: 0;
}

    .workflow-circle1:hover {
        transform: translateY(-8px);
        background: #082c5c;
    }

.circle-workflow:hover {
    background: none !important;
}

.workflow-item h6 {
    margin-top: 15px;
    font-size: 15px;
    line-height: 22px;
    font-weight: 600;
}

.workflow-circle1 i {
    font-size: 25px !important;
    color: #0d6efd !important;
}

.workflow-line {
    width: 80px;
    height: 4px;
    background: #d8d8d8;
    position: relative;
    top: -30px;
    flex-shrink: 0;
}

    .workflow-line:after {
        content: "";
        position: absolute;
        right: -6px;
        top: 50%;
        transform: translateY(-50%);
        border-left: 10px solid #0d6efd;
        border-top: 6px solid transparent;
        border-bottom: 6px solid transparent;
    }

/* ===========================
   ERP Workflow Circle
=========================== */

.workflow-section1 {
    position: relative;
    width: clamp(360px, 80vw, 650px);
    height: clamp(360px, 80vw, 650px);
    margin: 60px auto;
}

.workflow-center1 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: clamp(120px, 22vw, 180px);
    height: clamp(120px, 22vw, 180px);
    border-radius: 50%;
    background: #fff;
    color: #006cb5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-shadow: 0 10px 25px rgba(0,0,0,.15);
    text-align: center;
    z-index: 10;
}

    .workflow-center1 i {
        font-size: clamp(24px, 4vw, 42px);
        margin-bottom: 10px;
    }

    .workflow-center1 h4 {
        margin: 0;
        color: #006cb5;
        font-weight: 700;
        font-size: clamp(16px, 2vw, 22px);
    }


/* ===========================
   Workflow Steps
=========================== */

.workflow-step1 {
    position: absolute;
    width: clamp(75px, 15vw, 120px);
    height: clamp(75px, 15vw, 120px);
    border-radius: 50%;
    background: #fff;
    border: 2px solid #006cb5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 10px;
    transition: .3s;
    box-shadow: 0 5px 15px rgba(0,0,0,.08);
    cursor: pointer;
}

    .workflow-step1 i {
        color: #006cb5;
        font-size: clamp(18px,3vw,28px);
        margin-bottom: 8px;
    }

    .workflow-step1 span {
        font-size: clamp(10px,1.3vw,14px);
        font-weight: 600;
        line-height: 1.3;
    }

    .workflow-step1:hover {
        background: #006cb5;
        color: #fff;
        transform: scale(1.08);
    }

        .workflow-step1:hover i {
            color: #fff;
        }

/* ===========================
   Step Number
=========================== */

.step-number {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 24px;
    height: 24px;
    border-radius: 50%;    
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 12px;
    font-weight: bold;
}

/* ===========================
   Step Positions
=========================== */

.facilitystep1 {
    top: 0%;
    left: 50%;
    transform: translateX(-50%);
}

.facilitystep2 {
    top: 12%;
    right: 4%;
}

.facilitystep3 {
    top: 40%;
    right: -2%;
}

.facilitystep4 {
    top: 72%;
    right: 4%;
}

.facilitystep5 {
    bottom: 0%;
    left: 50%;
    transform: translateX(-50%);
}

.facilitystep6 {
    bottom: 12%;
    left: 4%;
}

.facilitystep7 {
    top: 40%;
    left: -2%;
}

.facilitystep8 {
    top: 12%;
    left: 4%;
}


/* ===========================
   Laptop
=========================== */

@media(max-width:1200px) {

    .workflow-section1 {
        width: 580px;
        height: 580px;
    }
}


/* ===========================
   iPad Landscape
=========================== */

@media(max-width:992px) {

    .workflow-section1 {
        width: 520px;
        height: 520px;
    }
}


/* ===========================
   iPad Portrait
=========================== */

@media(max-width:768px) {

    .workflow-section1 {
        width: 420px;
        height: 420px;
    }

    .workflow-step1 {
        width: 90px;
        height: 90px;
    }

        .workflow-step1 span {
            font-size: 11px;
        }
}


/* ===========================
   Mobile
=========================== */

@media(max-width:576px) {

    .workflow-section1 {
        width: 330px;
        height: 330px;
    }

    .workflow-center1 {
        width: 100px;
        height: 100px;
    }

        .workflow-center1 h4 {
            font-size: 14px;
        }

        .workflow-center1 i {
            font-size: 24px;
        }

    .workflow-step1 {
        width: 65px;
        height: 65px;
        padding: 5px;
    }

        .workflow-step1 i {
            font-size: 16px;
            margin-bottom: 4px;
        }

        .workflow-step1 span {
            font-size: 8px;
            line-height: 1.1;
        }

    .step-number {
        width: 18px;
        height: 18px;
        font-size: 10px;
    }
}

.retail-workflow-item {
    text-align: center;
    margin-bottom: 20px;
}

.retail-workflow-icon {
    position: relative;
    width: 70px;
    height: 70px;
    margin: 0 auto;
    background: #0d6efd;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 30px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.18);
    transition: all .3s ease;
}

    .retail-workflow-icon:hover {
        transform: translateY(-5px);
        background: #084298;
    }

.retail-step-badge {
    position: absolute;
    top: -6px;
    right: -6px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #1b2452;
    color: #fff;
    border: 2px solid #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
}

.retail-workflow-item h6 {
    margin-top: 12px;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    color: #222;
}

/* Responsive */

@media (max-width: 768px) {

    .retail-workflow-icon {
        width: 60px;
        height: 60px;
        font-size: 24px;
    }

    .retail-step-badge {
        width: 22px;
        height: 22px;
        font-size: 10px;
    }

    .retail-workflow-item h6 {
        font-size: 13px;
        line-height: 18px;
    }
}

@media (max-width: 480px) {

    .retail-workflow-icon {
        width: 55px;
        height: 55px;
        font-size: 22px;
    }

    .retail-step-badge {
        width: 20px;
        height: 20px;
        font-size: 9px;
    }

    .retail-workflow-item h6 {
        font-size: 12px;
    }
}

.assetMana {
    height: 300px !important;
}

.assetMana_weServe {
    height: 370px !important;
}

.page-banner-wrap h1 {
    font-size: 60px !important;
    line-height: 65px
}

.accountPad {
    height: 300px !important;
}

.accountPad_WEwork {
    height: 370px !important;
}


.RFI {
    position: relative;
    width: 750px;
    height: 750px;
    margin: auto;
}

    .RFI::before {
        content: '';
        position: absolute;
        width: 520px;
        height: 520px;
        border: 3px dashed #0d6efd;
        border-radius: 50%;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    /* Center Circle */

    .RFI .center-box {
        position: absolute;
        width: 180px;
        height: 180px;
        background: #0d6efd;
        border-radius: 50%;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
        font-size: 26px;
        font-weight: bold;
        text-align: center;
        box-shadow: 0 10px 25px rgba(0,0,0,.2);
    }

    /* Workflow Steps */

    .RFI .step {
        position: absolute;
        width: 140px;
        height: 140px;
        background: #fff;
        border-radius: 50%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
        border: 2px solid #0d6efd;
        box-shadow: 0 5px 15px rgba(0,0,0,.08);
        transition: .3s;
        padding: 10px;
    }

        .RFI .step:hover {
            background: #0d6efd;
            color: #fff;
            transform: scale(1.08);
        }

        .RFI .step i {
            font-size: 30px;
            margin-bottom: 8px;
        }

        .RFI .step span {
            font-size: 14px;
            font-weight: 600;
            line-height: 20px;
        }

    /* Positions */

    .RFI .s1 {
        top: 10px;
        left: 305px;
    }

    .RFI .s2 {
        top: 95px;
        right: 40px;
    }

    .RFI .s3 {
        top: 305px;
        right: 0;
    }

    .RFI .s4 {
        bottom: 95px;
        right: 40px;
    }

    .RFI .s5 {
        bottom: 10px;
        left: 305px;
    }

    .RFI .s6 {
        bottom: 95px;
        left: 40px;
    }

    .RFI .s7 {
        top: 305px;
        left: 0;
    }

    .RFI .s8 {
        top: 95px;
        left: 40px;
    }

/* Responsive */

@media(max-width:768px) {

    .RFI {
        width: 380px;
        height: 380px;
    }

        .RFI::before {
            width: 260px;
            height: 260px;
        }

        .RFI .center-box {
            width: 110px;
            height: 110px;
            font-size: 16px;
        }

        .RFI .step {
            width: 80px;
            height: 80px;
        }

            .RFI .step i {
                font-size: 18px;
            }

            .RFI .step span {
                font-size: 9px;
                line-height: 12px;
            }

        .RFI .s1 {
            top: 0;
            left: 150px;
        }

        .RFI .s2 {
            top: 45px;
            right: 0;
        }

        .RFI .s3 {
            top: 150px;
            right: 0;
        }

        .RFI .s4 {
            bottom: 45px;
            right: 0;
        }

        .RFI .s5 {
            bottom: 0;
            left: 150px;
        }

        .RFI .s6 {
            bottom: 45px;
            left: 0;
        }

        .RFI .s7 {
            top: 150px;
            left: 0;
        }

        .RFI .s8 {
            top: 45px;
            left: 0;
        }
}

.IT-process {
    position: relative;
    padding-top: 60px; /* Space for number and connector */
}

    .IT-process .step-number {
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 42px;
        height: 42px;
        border: 2px solid #0b4dbd;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #0b4dbd;
        font-weight: 700;
        background: #fff;
    }

        .IT-process .step-number::after {
            content: "";
            position: absolute;
            width: 3px;
            height: 45px;
            background: #0b4dbd;
            top: 42px;
            left: 50%;
            transform: translateX(-50%);
        }

        .IT-process .step-number::before {
            content: "";
            position: absolute;
            width: 12px;
            height: 12px;
            background: #0b4dbd;
            border-radius: 50%;
            top: 84px;
            left: 50%;
            transform: translateX(-50%);
        }

    .IT-process h4 {
        margin-top: 0;
        text-align: center;
        font-size: 16px !important;
    }

    .IT-process span {
        border: 1px solid #006cb5;
        border-radius: 50%;
        padding: 0px 10px !important;
    }

/* ===========================================================
   TASK WORKFLOW
=========================================================== */

.workflowIT-section {
    padding: 60px 0;
    background: #fff;
    overflow: hidden;
}

    .workflowIT-section .container {
        max-width: 1700px;
        margin: auto;
    }

    .workflowIT-section .section-title h6 {
        color: #0b4dbd;
        font-size: 18px;
        font-weight: 700;
        margin-bottom: 10px;
    }

    .workflowIT-section .section-title h2 {
        font-size: 42px;
        font-weight: 700;
        color: #081b4b;
        margin-bottom: 15px;
    }

    .workflowIT-section .section-title p {
        max-width: 800px;
        margin: auto;
        color: #666;
        margin-bottom: 70px;
    }


    /*==========================================================
WORKFLOW
==========================================================*/

    .workflowIT-section .workflow {
        position: relative;
        width: 1700px;
        height: 550px;
        margin: auto;
    }


    /*==========================================================
SVG LINE
==========================================================*/

    .workflowIT-section .snake-line {
        position: absolute;
        top: 70px;
        left: 0;
        width: 1700px;
        height: 420px;
        z-index: 1;
    }


    /*==========================================================
STEP
==========================================================*/

    .workflowIT-section .workflow-step {
        position: absolute;
        border: 0px !important;
        width: 170px;
        text-align: center;
        z-index: 5;
    }

    /*==========================================================
ICON CIRCLE
==========================================================*/
    .workflowIT-section .circle {
        width: 70px;
        height: 70px;
        border-radius: 50%;
        background: #fff;
        border: 0px solid #0b4dbd;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: auto;
        box-shadow: 0 10px 30px rgba(0,0,0,.08);
        transition: .35s;
    }

        .workflowIT-section .circle:hover {
            transform: translateY(-8px);
            box-shadow: 0 20px 40px rgba(0,0,0,.18);
        }

        .workflowIT-section .circle i {
            font-size: 34px;
            color: #0b4dbd;
        }

    /*==========================================================
NUMBER
==========================================================*/
    .workflowIT-section .number {
        width: 34px;
        height: 34px;
        border-radius: 50%;
        background: #0b4dbd;
        color: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 15px auto;
        font-weight: 700;
        font-size: 15px;
    }

    /*==========================================================
TITLE
==========================================================*/
    .workflowIT-section .workflow-step h4 {
        font-size: 17px;
        line-height: 1.5;
        font-weight: 600;
        color: #222;
    }

    /*==========================================================
TOP & BOTTOM
==========================================================*/

    .workflowIT-section .top {
        top: 0;
    }

    .workflowIT-section .bottom {
        top: 250px;
    }


    /*==========================================================
STEP POSITIONS
==========================================================*/

    .workflowIT-section .step1 {
        left: 0px;
    }

    .workflowIT-section .step2 {
        left: 130px;
    }

    .workflowIT-section .step3 {
        left: 270px;
    }

    .workflowIT-section .step4 {
        left: 410px;
    }

    .workflowIT-section .step5 {
        left: 550px;
    }

    .workflowIT-section .step6 {
        left: 690px;
    }

    .workflowIT-section .step7 {
        left: 885px;
    }

    .workflowIT-section .step8 {
        left: 970px;
    }

    .workflowIT-section .step9 {
        left: 1110px;
    }

    .workflowIT-section .step10 {
        left: 1250px;
    }

    .workflowIT-section .step11 {
        left: 1390px;
    }

    .workflowIT-section .step12 {
        left: 1530px;
    }

    .workflowIT-section .step13 {
        left: 1670px;
    }

    /*==========================================================
HOVER
==========================================================*/

    .workflowIT-section .workflow-step:hover .circle {
        background: #fff;
    }

        .workflowIT-section .workflow-step:hover .circle i {
            color: #0b4dbd;
        }

    .workflowIT-section .workflow-step:hover .number {
        transform: scale(1.15);
    }

    .workflowIT-section .workflow-step:hover {
        background: none;
        transform: scale(1.08);
    }

/*==========================================================
RESPONSIVE
==========================================================*/

@media(max-width:1700px) {
    .workflowIT-section {
        overflow-x: auto;
    }

        .workflowIT-section .workflow {
            width: 1850px;
        }
}

@media(max-width:992px) {
    .workflowIT-section .workflow {
        width: 100%;
        height: auto;
    }

    .workflowIT-section .snake-line {
        display: none;
    }

    .workflowIT-section .workflow-step {
        position: relative;
        left: 0 !important;
        top: 0 !important;
        margin: 40px auto;
    }

    .workflowIT-section .bottom,
    .workflowIT-section .top {
        top: 0;
    }
}

/*==============================
Project Management Workflow
===============================*/

.Management-section {
    padding: 90px 0;
    background: #fff;
}

.Management-workflow {
    position: relative;
    width: 1000px;
    height: 520px;
    margin: auto;
}

.Management-snake-line {
    position: absolute;
    top: 70px;
    left: 0;
    width: 1000px;
    height: 350px;
    z-index: 1;
}

.Management-step {
    position: absolute;
    width: 160px;
    text-align: center;
    z-index: 5;
}

.Management-circle {
    width: 90px;
    height: 90px;
    margin: auto;
    border: 4px solid #0b4dbd;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    box-shadow: 0 10px 25px rgba(0,0,0,.08);
    transition: .35s;
}

    .Management-circle i {
        font-size: 34px;
        color: #0b4dbd;
    }

.Management-number {
    width: 34px;
    height: 34px;
    background: #0b4dbd;
    color: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 15px auto;
    font-weight: 700;
}

.Management-step h4 {
    font-size: 17px;
    font-weight: 600;
    line-height: 1.5;
    color: #222;
}

.Management-top {
    top: 0;
}

.Management-bottom {
    top: 240px;
}

.Management-step1 {
    left: 0;
    top: -16px;
}

.Management-step2 {
    left: 170px;
}

.Management-step3 {
    left: 340px;
}

.Management-step4 {
    left: 510px;
}

.Management-step5 {
    left: 680px;
}

.Management-step6 {
    left: 850px;
}

.Management-step:hover .Management-circle {
    background: #0b4dbd;
    transform: translateY(-8px);
}

    .Management-step:hover .Management-circle i {
        color: #fff;
    }

.Management-step:hover .Management-number {
    transform: scale(1.15);
}

@media(max-width:1100px) {

    .Management-workflow {
        width: 100%;
        height: auto;
    }

    .Management-snake-line {
        display: none;
    }

    .Management-step {
        position: relative;
        left: 0 !important;
        top: 0 !important;
        margin: 40px auto;
    }
}

.inventory-benefits {
    background: #f8fbff;
}

.inventory-image {
    text-align: center;
}

    .inventory-image img {
        max-width: 100%;
        animation: floatImage 5s ease-in-out infinite;
    }

.benefits-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 20px;
}

.benefit-card {
    background: #fff;
    padding: 28px 20px;
    border-radius: 18px;
    text-align: center;
    border: 1px solid #eef2f7;
    box-shadow: 0 10px 30px rgba(0,0,0,.05);
    transition: .35s;
    position: relative;
    overflow: hidden;
}

    .benefit-card::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 4px;
        background: #2563eb;
        transform: scaleX(0);
        transition: .35s;
    }

    .benefit-card:hover {
        transform: translateY(-10px);
        box-shadow: 0 20px 40px rgba(0,0,0,.12);
    }

        .benefit-card:hover::before {
            transform: scaleX(1);
        }

    .benefit-card i {
        width: 70px;
        height: 70px;
        line-height: 70px;
        border-radius: 50%;
        background: #eef5ff;
        color: #2563eb;
        font-size: 30px;
        margin-bottom: 18px;
        transition: .35s;
    }

    .benefit-card:hover i {
        background: #2563eb;
        color: #fff;
        transform: rotateY(180deg);
    }

    .benefit-card h5 {
        font-size: 18px;
        font-weight: 700;
        margin-bottom: 12px;
    }

    .benefit-card p {
        margin: 0;
        font-size: 14px;
        color: #6c757d;
        line-height: 1.7;
    }

@keyframes floatImage {
    0%,100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-15px);
    }
}

@media(max - width:991px) {
    .inventory-image {
        margin-bottom: 50px;
    }

    .benefits-grid {
        grid-template-columns: repeat(2,1fr);
    }
}

@media(max - width:576px) {
    .benefits-grid {
        grid-template-columns: 1fr;
    }
}

.process-card {
    position: relative;
    overflow: visible;
    height: 360px;
}

.process-step {
    position: absolute;
    top: -14px;
    right: 18px;
    font-size: 28px;
    font-weight: 700;
    color: rgba(0,0,0,0.08);
    line-height: 1;
}

.case-thumb-md{
    display:block !important;
    padding:20px !important;
}

.case-thumb-md h3{
    color:#fff;
}

    .case-thumb-md p {
        color: #fff;
        font-size:20px !important;
    }

.case-stat-item h3 {
    color: #fff;
}

.case-stat-item {
    flex: 1 1 400px !important;
    text-align:left !important
}

        .case-stat-item ul li {
            color: #fff !important;
        }

        .case-stat-item ul li::before {
            color: #fff !important;
        }

.case-stats-strip {
    margin: 10px 0 10px !important;
}

.case-stat-item-stats {
    flex: 1 1 300px !important;
    text-align: left !important
}

.case-item-stats-1 {
    height: 150px !important;
}

.case-thumb-icon {  
    height: 300px !important;
}

.single-contact-card {
    height: 270px;
    background-color: #eef4fc !important;
}

    .single-contact-card:hover {
        background-color: #202426 !important;
    }

.single-card-inv {
    height: 405px !important;
}

.single-vcard-Auv1 {
    height: 385px !important;
}

.single-card-ayu1 {
    height: 345px !important;
}

.single-card-ads1 {
    height: 310px !important;
}

.giftora-icon {
    font-size: 40px;
    color: #086ad7;
}

.giftora-vcard {
    height: 370px;
}

.erp-img-Giftora {
    height: 370px;
    margin-top: 30px !important;
}

.instant {
    height: 395px;
}

.erp-img-Instant {
    height: 395px;
    margin-top: 30px !important;
}

.page-banner-wrap::before{
    background:none !important;
}

.page-banner-wrap {
    background-position:0px !important;
}

.footer-4 {
    background-color: #eef4fc !important
}

    .footer-4 a, .footer-4 p, .footer-4 span {
        color: #000 !important;
    }

    .footer-4 h1, .footer-4 h2, .footer-4 h3, .footer-4 h4 {
        color: #000 !important;
    }


.footer-wrap .single-footer-wid ul li.address::before {
    position: absolute;
    content: "";
    left: 0;
    font-family: "Font Awesome 5 Pro";
}