/*==========================
    About Section
==========================*/

.about-section {
    background: #fff;
}

.about-section .container{
    max-width:1200px;
    margin:auto;
}

.about-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 70px;
    padding: 30px 40px;
    
    border-radius: 20px 20px 0 0;
}

/* Left */
.about-image{
    width:50%;
    position:relative;
}

/* Right */
.about-content{
    width:50%;
}

/* Counter Area */
section.section.section-padding.instrument-process {
    background: #0057b80d;
}
.counter-area{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    padding:40px 60px;
    background:#dfefff;
    border-radius:0 0 20px 20px;
}

/*==========================
    Left Image
==========================*/

.about-image{
    width:52%;
    position:relative;
    min-height:430px;
    display:flex;
    align-items:center;
    justify-content:center;
}

/* Blue Shape */

.blue-shape {
    position: absolute;
    left: 12px;
    top: 30px;
    width: 190px;
    height: 275px;
    background: rgb(0,87,184);
    border-radius: 29px 0 0 30px;
}

/* Image */

.about-image img{
    position:relative;
    width:88%;
    margin-left:80px;
    border-radius:15px;
    display:block;
    object-fit:cover;
    z-index:2;
    /* box-shadow:0 25px 60px rgba(0,0,0,.12); */
}

/*==========================
    Right Content
==========================*/

.about-content{
    width:48%;
}

.about-content .sub-title{
    display:inline-block;
    color:rgb(0,87,184);
    font-size:18px;
    font-weight:700;
    margin-bottom:20px;
}


/*==========================
    Counter Section
==========================*/
.services2-counter{
    padding-bottom: 100px;
}

.counter-area{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
    padding:45px 50px;
    background:#dcecff;
    border-radius:0 0 20px 20px;
}

.counter-box{
    text-align:center;
}

.counter-number{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:54px;
    height:40px;
    padding:0 18px;
    background:rgb(0,87,184);
    color:#fff;
    font-size:24px;
    font-weight:700;
    border-radius:12px;
    margin-bottom:18px;
}

.counter-box h4{
    font-size:34px;
    line-height:1.25;
    color:#111;
    font-weight:700;
    margin:0;
}

.about-wrapper{
    position:relative;
    overflow:hidden;
}

.about-wrapper::before{
    content:"";
    position:absolute;
    width:320px;
    height:320px;
    border:2px solid rgba(36,86,232,.08);
    border-radius:50%;
    top:-160px;
    right:-120px;
}

.about-wrapper::after{
    content:"";
    position:absolute;
    width:220px;
    height:220px;
    border:2px solid rgba(36,86,232,.08);
    border-radius:50%;
    bottom:-100px;
    left:-80px;
}

.blue-shape::before{

    content:"";

    position:absolute;

    right:-35px;

    top:40px;

    width:80px;

    height:80px;

    border-radius:50%;

    border:2px dashed rgba(255,255,255,.45);

}

/* .about-image img{

    box-shadow:
        0 30px 80px rgba(0,0,0,.12),
        0 10px 25px rgba(36,86,232,.15);

} */

.counter-box{

    transition:.35s;
}

.counter-box:hover{

    transform:translateY(-8px);
}

.counter-number{

    transition:.35s;
}

.counter-box:hover .counter-number{

    transform:scale(1.08);
}

.why-choose-us .features-content .features-list .feature-item {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 1rem;
    }

    .why-choose-us .features-content .features-list .feature-item .feature-icon {
        flex-shrink: 0;
        width: 60px;
        height: 60px;
        border-radius: 10px;
        background-color: color-mix(in srgb, rgb(0, 87, 184), transparent 90%);
        color: rgb(0, 87, 184);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.8rem;
        margin-right: 20px;
        transition: all 0.3s ease;
    }

    .bi::before,
    [class^="bi-"]::before,
    [class*=" bi-"]::before {
        display: inline-block;
        font-family: bootstrap-icons !important;
        font-style: normal;
        font-weight: normal !important;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        vertical-align: -.125em;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    .why-choose-us .features-content .features-list .feature-item .feature-icon:hover {
        background-color: rgb(0, 87, 184);
        color: white;
        transform: translateY(-5px);
    }

    .feature-text h4 {
        margin: 5px !important;

    }

    .feature-text p {
        margin: 5px !important;
    }
/* Tablet */

@media(max-width:991px){

.about-wrapper{
    flex-direction:column;
    padding:60px 40px;
}

.about-image,
.about-content{
    width:100%;
}

.about-content{
    text-align:left;
}

.about-content p{
    max-width:100%;
}

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

.about-content h2{
    font-size:42px;
}

}

/* Mobile */

@media(max-width:767px){

.about-wrapper{
    padding:40px 25px;
}

.about-content h2{
    font-size:34px;
}

.about-content p {
    font-size: 14px;
}

.counter-area{
    grid-template-columns:1fr;
    padding:35px 25px;
}

.counter-box h4{
    font-size:26px;
}

.about-image{
    min-height:300px;
}

.blue-shape{
    width:120px;
    height:220px;
}

.about-image img{
    margin-left:40px;
    height:260px;
}
.about-wrapper::after{
    display: none;
}
}



/* workflow */
.heading-para{
     max-width: 900px;
    margin: auto;
}
.instrument-process .timeline {
    position: relative ;
    margin: 60px 0 0 0;
    padding-left: 65px;
}
.instrument-process .timeline-line.active {
    height: 100%;
}
.instrument-process .timeline-line {
    position: absolute;
    left: 84px;
    top: 0;
    width: 2px;
    height: 0;
    /* background: linear-gradient(45deg, transparent, #000, transparent); */
    background: rgb(0,87,184);
    transition: height 1.5s ease;
}

.instrument-process .timeline-item.show {
    opacity: 1;
    transform: translateY(0);
}
.instrument-process .timeline-item {
    display: flex;
    align-items: flex-start;
    margin-bottom: 80px;
    opacity: 0;
    transform: translateY(60px);
    /* transition: all 0.8s ease; */
    align-items: center;
}
.instrument-process .timeline-item.service4{
    margin-bottom: 40px;
} 
.instrument-process .timeline-item::before{
    display: none;
}
.instrument-process .timeline-number {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 40px;
    z-index: 2;
}
.instrument-process .timeline-content {
    max-width: 620px;
}
.instrument-process .timeline-image {
    width: 100%;
    height: 100%;
    margin-left: 40px;
    border-radius: 8px;
    max-width: 190px;
    margin: 0 0 0 auto;
}
.timeline-content h3{
    font-size: 18px;
}
.timeline-image {
    position: relative;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.icon-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
}
.instrument-process .timeline-item:nth-child(1) .icon-wrapper,
.instrument-process .timeline-item:nth-child(3) .icon-wrapper,
.instrument-process .timeline-item:nth-child(5) .icon-wrapper,
.instrument-process .timeline-item:nth-child(7) .icon-wrapper {
    color: #0c58b4;
}

.instrument-process .timeline-item:nth-child(2) .icon-wrapper,
.instrument-process .timeline-item:nth-child(4) .icon-wrapper,
.instrument-process .timeline-item:nth-child(6) .icon-wrapper,
.instrument-process .timeline-item:nth-child(8) .icon-wrapper {
    color:#58595b;
}
.icon-main {
    position: relative;
    font-size: 36px;
    z-index: 2;
}
.icon-bg {
    position: absolute;
    font-size: 80px;
    color: currentColor;
    opacity: 0.08;
    top: 17%;
    left: 25%;
    transform: translate(-50%, -50%) scale(1.4);
}
.fa-screwdriver-wrench:before, .fa-tools:before {
    content: "\f7d9";
}
.timeline-image i {
    font-size: 66px;
}
.timeline-image.service4 i{
font-size: 40px;
}













.timeline-item{
    opacity:0;
    transform:translateY(80px);
    transition:all .8s ease;
    will-change:transform, opacity;
}

/* Active */
.timeline-item.show{
    opacity:1;
    transform:translateY(0);
}

/* Number Animation */
.timeline-number{
    transform:scale(.5);
    transition:.5s ease .2s;
}

.timeline-item.show .timeline-number{
    transform:scale(1);
}

/* Content Animation */
.timeline-content{
    opacity:0;
    transform:translateX(-40px);
    transition:all .7s ease .25s;
}

.timeline-item.show .timeline-content{
    opacity:1;
    transform:translateX(0);
}

/* Icon Animation */
.timeline-image{
    opacity:0;
    transform:translateX(50px) rotate(10deg);
    transition:all .8s ease .35s;
}

.timeline-item.show .timeline-image{
    opacity:1;
    transform:translateX(0) rotate(0);
}

/* Icon Pop */
.icon-main{
    transition:.5s ease .45s;
    transform:scale(.5);
}

.timeline-item.show .icon-main{
    transform:scale(1);
}

this is my css and my content show with animation i want it not take tim





/* partnership model */
.gradient-left {
    background: #dcecff;
    padding: 90px 0px;
    position: relative;
    overflow: hidden;
}
.sub_section_gapping {
    padding-top: 70px;
}
.main_ChooseUs span {
    color: #ffffff;
    background: rgb(0,87,184);
    padding: 10px 20px 10px 60px;
}
.section-tittle span, .main_Features .card-link h2 {
    font-size: 16px;
    font-weight: 700;
    color: #3d94ce;
    text-transform: uppercase;
    display: inline-block;
    position: relative;
    margin-top: 20px;
}
.main_ChooseUs span {
    color: #ffffff;
    background: rgb(0,87,184);
    padding: 10px 20px 10px 60px;
}
.main_ChooseUs span:before {
    content: '';
    /* clip-path: circle(89% at 89% 12%); */
    width: 50px;
    height: 48px;
    background: #fff;
    position: absolute;
    left: 0;
    top: 0;
}
.main_ChooseUs span:before {
    content: '';
    /* clip-path: circle(89% at 89% 12%); */
    width: 50px;
    height: 50px;
    background: #fff;
    position: absolute;
    left: 0;
    top: 0;
}
.main_ChooseUs .ChooseUs_wrapper div span{
    position:relative;
}

.main_ChooseUs .ChooseUs_wrapper div span::after{
    content:"\f1c0"; /* Database icon */
    font-family:"Font Awesome 6 Free";
    font-weight:900;
    position:absolute;
    left:12px;
    top:50%;
    transform:translateY(-50%);
    color:#0057b8;
    font-size:24px;
    width:auto;
    height:auto;
    background:none;
}
/* 1. Joint Development */
.main_ChooseUs .ChooseUs_wrapper > div:nth-child(1) span::after{
    content:"\f2b5"; /* Handshake */
}

/* 2. Risk-Sharing Partnership */
.main_ChooseUs .ChooseUs_wrapper > div:nth-child(2) span::after{
    content:"\e06c"; /* Shield */
}

/* 3. Technology Partnership */
.main_ChooseUs .ChooseUs_wrapper > div:nth-child(3) span::after{
    content:"\f085"; /* Gears */
}

/* 4. Accelerated Go-to-Market */
.main_ChooseUs .ChooseUs_wrapper > div:nth-child(4) span::after{
    content:"\f135"; /* Rocket */
}
/* .main_ChooseUs .ChooseUs_wrapper div span::after {
    content: "";
    background-image: url(../img/images/Comprehensive_Database.png);
    width: 32px;
    height: 32px;
    position: absolute;
    left: 11px;
    background-size: cover;
    background-repeat: no-repeat;
} */
.ChooseUs_wrapper div p:last-child {
    padding-left: 60px;
}
.main_ChooseUs .dept_thumb {
    text-align: center;
}
.chooseus-image img {
    max-width: 80%;
    width: 100%;
    animation: float 6s ease-in-out infinite,
        glowPulse 3s ease-in-out infinite alternate,
        shineMove 8s ease-in-out infinite;
}