/*==================================================
        ABOUT HERO SECTION
==================================================*/

.about-hero{

    position:relative;
    overflow:hidden;

    padding:90px 0 90px;

    background:
    linear-gradient(135deg,#f7fbff 0%,#eef8ff 50%,#ffffff 100%);

}


/*==========================
Background Shapes
==========================*/

.about-hero::before{

    content:"";

    position:absolute;

    width:550px;
    height:550px;

    background:rgba(14,165,233,.08);

    border-radius:50%;

    top:-220px;
    left:-180px;

    filter:blur(40px);

}

.about-hero::after{

    content:"";

    position:absolute;

    width:500px;
    height:500px;

    background:rgba(0,180,216,.10);

    border-radius:50%;

    right:-180px;
    bottom:-220px;

    filter:blur(45px);

}


/*==========================
Container
==========================*/

.about-hero .container{

    position:relative;
    z-index:2;

}


/*==========================
Row
==========================*/

.about-hero .row{

    align-items:center;

    min-height:620px;

}


/*==========================
Breadcrumb
==========================*/

.about-breadcrumb{

    margin-bottom:25px;

    font-size:15px;

    color:#94a3b8;

}

.about-breadcrumb a{

    text-decoration:none;

    color:#00b4d8;

    font-weight:600;

}

.about-breadcrumb span{

    margin:0 8px;

}


/*==========================
Badge
==========================*/

.about-tag{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:12px 25px;

    border-radius:60px;

    background:#e7f9ff;

    border:1px solid rgba(0,180,216,.15);

    color:#0f4c81;

    font-weight:600;

    margin-bottom:28px;

    transition:.4s;

}

.about-tag:hover{

    transform:translateY(-3px);

    box-shadow:0 15px 35px rgba(15,76,129,.12);

}

.about-tag i{

    color:#00b4d8;

}


/*==========================
Heading
==========================*/

.about-hero h1{

    font-size:64px;

    font-weight:800;

    line-height:1.1;

    color:#1f2937;

    margin-bottom:30px;

}

.about-hero h1 span{

    color:#00b4d8;

}


/*==========================
Description
==========================*/

.about-hero p{

    font-size:18px;

    color:#64748b;

    line-height:1.9;

    margin-bottom:40px;

    max-width:620px;

}


/*==========================
Buttons
==========================*/

.hero-buttons{

    display:flex;

    align-items:center;

    gap:18px;

    flex-wrap:wrap;

}

.hero-buttons .btn{

    padding:15px 36px;

    border-radius:50px;

    font-weight:600;

    transition:.4s;

}

.hero-buttons .btn-primary{

    background:linear-gradient(90deg,#0f4c81,#00b4d8);

    border:none;

    box-shadow:0 15px 35px rgba(15,76,129,.18);

}

.hero-buttons .btn-primary:hover{

    transform:translateY(-4px);

    box-shadow:0 25px 45px rgba(15,76,129,.25);

}

.hero-buttons .btn-outline-primary{

    border:2px solid #00b4d8;

    color:#00b4d8;

    background:#fff;

}

.hero-buttons .btn-outline-primary:hover{

    background:#00b4d8;

    color:#fff;

}


/*==========================
Hero Image
==========================*/

.about-hero-image{

    display:flex;
    justify-content:center;
    align-items:flex-end;
    height:100%;

}

.about-hero-image img{

    width:100%;
    max-width:500px;
    max-height:800px;

    object-fit:contain;

    display:block;

    animation:doctorFloat 5s ease-in-out infinite;

    transition:.4s;

}


/*==========================
Image Animation
==========================*/

@keyframes doctorFloat{

    0%{

        transform:translateY(0px);

    }

    50%{

        transform:translateY(-18px);

    }

    100%{

        transform:translateY(0px);

    }

}


/*==========================
Hover Animation
==========================*/

.about-hero img:hover{

    transform:scale(1.02);

}


/*==========================
Decoration
==========================*/

.about-hero .container::before{

    content:"";

    position:absolute;

    width:140px;
    height:140px;

    border:2px dashed rgba(0,180,216,.15);

    border-radius:50%;

    top:120px;
    right:90px;

    animation:rotateCircle 20s linear infinite;

}

@keyframes rotateCircle{

    from{

        transform:rotate(0deg);

    }

    to{

        transform:rotate(360deg);

    }

}

/*==================================================
        OUR STORY SECTION
==================================================*/

.our-story{

    position:relative;

    padding:90px 0;

    background:#ffffff;

    overflow:hidden;

}

.our-story::before{

    content:"";

    position:absolute;

    width:450px;
    height:450px;

    background:rgba(0,180,216,.06);

    border-radius:50%;

    top:-150px;
    left:-150px;

    filter:blur(35px);

}

/*=========================================
Story Image
=========================================*/

.story-image{

    display:flex;
    justify-content:center;
    align-items:center;

    height:100%;

}

.story-image img{

    width:100%;

    max-width:560px;

    height:auto;

    display:block;

    border-radius:30px;

    object-fit:cover;

    box-shadow:0 25px 60px rgba(15,76,129,.15);

    transition:.4s ease;

}

.story-image img:hover{

    transform:translateY(-8px);

    box-shadow:0 35px 70px rgba(15,76,129,.22);

}

.story-tag{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:12px 25px;

    border-radius:50px;

    background:#e7f9ff;

    color:#0f4c81;

    font-weight:600;

    margin-bottom:25px;

}

.story-tag i{

    color:#00b4d8;

}

.our-story h2{

    font-size:52px;

    font-weight:800;

    line-height:1.2;

    color:#1f2937;

    margin-bottom:25px;

}

.our-story h2 span{

    color:#00b4d8;

}

.our-story p{

    font-size:18px;

    line-height:1.9;

    color:#64748b;

    margin-bottom:22px;

}

.story-features{

    margin-top:35px;

}

.feature-item{

    display:flex;

    align-items:center;

    gap:14px;

    margin-bottom:18px;

    font-size:17px;

    font-weight:600;

    color:#1f2937;

}

.feature-item i{

    color:#22c55e;

    font-size:20px;

}

.our-story .consultation-btn{

    margin-top:20px;

}

/*==================================================
        WHY CHOOSE US
==================================================*/

.why-choose{

    padding:90px 0;

    background:#f8fbff;

    position:relative;

    overflow:hidden;

}

/* Background Effects */

.why-choose::before{

    content:"";

    position:absolute;

    width:450px;
    height:450px;

    background:rgba(0,180,216,.08);

    border-radius:50%;

    top:-180px;
    left:-180px;

    filter:blur(40px);

}

.why-choose::after{

    content:"";

    position:absolute;

    width:400px;
    height:400px;

    background:rgba(15,76,129,.06);

    border-radius:50%;

    right:-150px;
    bottom:-150px;

    filter:blur(35px);

}

.why-choose .container{

    position:relative;

    z-index:2;

}

/* Heading */

.section-heading{

    max-width:760px;

    margin:auto;

    margin-bottom:70px;

}

.section-heading h2{

    font-size:52px;

    font-weight:800;

    color:#1f2937;

    line-height:1.2;

    margin:25px 0;

}

.section-heading h2 span{

    color:#00b4d8;

}

.section-heading p{

    font-size:18px;

    color:#64748b;

    line-height:1.9;

}

/* Cards */

.why-card{

    background:#fff;

    border-radius:25px;

    padding:40px 30px;

    height:100%;

    text-align:center;

    transition:.45s;

    border:1px solid #e5eef7;

    box-shadow:0 15px 40px rgba(15,76,129,.06);

    display:flex;

   flex-direction:column;

   justify-content:flex-start;

   min-height:340px;

}

.why-card:hover{

     transform:translateY(-15px);

    border-color:#00b4d8;

    box-shadow:0 35px 70px rgba(15,76,129,.15);

}

/* Icon */

.why-icon{

    width:90px;

    height:90px;

    margin:0 auto 30px;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    background:linear-gradient(135deg,#0f4c81,#00b4d8);

    color:#fff;

    font-size:36px;

    box-shadow:0 20px 40px rgba(15,76,129,.18);

    transition:.45s;

}

.why-card:hover .why-icon{

    transform:rotate(10deg) scale(1.1);

}

.why-card:hover .why-icon{

    transform:rotate(10deg) scale(1.08);

}

/* Title */

.why-card h4{

    font-size:25px;

    font-weight:700;

    color:#1f2937;

    margin-bottom:18px;

}

/* Text */

.why-card p{

    font-size:16px;

    color:#64748b;

    line-height:1.8;

    margin:0;

}

/*==================================================
        OUR PROCESS
==================================================*/

.our-process{

    position:relative;

    padding:90px 0;

    background:#ffffff;

    overflow:hidden;

}

/* Background */

.our-process::before{

    content:"";

    position:absolute;

    width:450px;
    height:450px;

    background:rgba(0,180,216,.06);

    border-radius:50%;

    top:-180px;
    right:-180px;

    filter:blur(40px);

}

.our-process .container{

    position:relative;

    z-index:2;

}

/* Timeline Wrapper */

.process-wrapper{

    position:relative;

    margin-top:70px;

}

/* Timeline Line */

.process-line{

    position:absolute;

    top:75px;

    left:12%;

    width:76%;

    height:4px;

    background:linear-gradient(90deg,#0f4c81,#00b4d8);

    border-radius:20px;

    z-index:0;

}

/* Card */

.process-card{

    position:relative;

    background:#fff;

    border-radius:25px;

    padding:40px 25px;

    text-align:center;

    border:1px solid #edf3fa;

    box-shadow:0 15px 45px rgba(15,76,129,.06);

    transition:.45s;

    height:100%;

    z-index:2;

}

.process-card:hover{

    transform:translateY(-12px);

    box-shadow:0 30px 60px rgba(15,76,129,.15);

}

/* Number */

.process-number{

    position:absolute;

    top:-22px;

    left:50%;

    transform:translateX(-50%);

    width:48px;

    height:48px;

    border-radius:50%;

    background:linear-gradient(135deg,#0f4c81,#00b4d8);

    color:#fff;

    display:flex;

    justify-content:center;

    align-items:center;

    font-weight:700;

    font-size:18px;

    box-shadow:0 10px 25px rgba(15,76,129,.18);

}

/* Icon */

.process-icon{

    width:90px;

    height:90px;

    margin:35px auto 25px;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    background:linear-gradient(135deg,#0f4c81,#00b4d8);

    color:#fff;

    font-size:34px;

    transition:.45s;

}

.process-card:hover .process-icon{

    transform:rotate(10deg) scale(1.08);

}

/* Heading */

.process-card h4{

    font-size:26px;

    font-weight:700;

    color:#1f2937;

    margin-bottom:15px;

}

/* Paragraph */

.process-card p{

    color:#64748b;

    font-size:16px;

    line-height:1.8;

    margin:0;

}

/*==================================================
        OUR IMPACT
==================================================*/

.our-impact{

    padding:90px 0;

    background:linear-gradient(180deg,#f8fbff 0%,#ffffff 100%);

    position:relative;

    overflow:hidden;

}

.our-impact::before{

    content:"";

    position:absolute;

    width:500px;
    height:500px;

    background:rgba(0,180,216,.06);

    border-radius:50%;

    left:-180px;
    bottom:-220px;

    filter:blur(40px);

}

.our-impact .container{

    position:relative;

    z-index:2;

}

/* Cards */

.impact-card{

    background:#fff;

    border-radius:25px;

    padding:45px 30px;

    text-align:center;

    height:100%;

    border-top:6px solid #00b4d8;

    border-left:1px solid #edf3fa;

    border-right:1px solid #edf3fa;

    border-bottom:1px solid #edf3fa;

    box-shadow:0 20px 45px rgba(15,76,129,.08);

    transition:.45s;

}

.impact-card:hover{

    transform:translateY(-12px);

    box-shadow:0 35px 70px rgba(15,76,129,.16);

}

/* Counter */

.impact-card h3{

    font-size:56px;

    font-weight:800;

    color:#0f4c81;

    margin-bottom:18px;

    line-height:1;

}

.impact-card h3 span{

    color:#00b4d8;

}

/* Title */

.impact-card h5{

    font-size:22px;

    font-weight:700;

    color:#1f2937;

    margin-bottom:15px;

}

/* Description */

.impact-card p{

    font-size:16px;

    line-height:1.8;

    color:#64748b;

    margin:0;

}

/*==================================================
        READY TO GROW
==================================================*/

.ready-grow{

    padding:90px 0;

    background:#ffffff;

    position:relative;

    overflow:hidden;

}

.ready-grow::before{

    content:"";

    position:absolute;

    width:600px;
    height:600px;

    background:rgba(0,180,216,.08);

    border-radius:50%;

    top:-250px;
    right:-250px;

    filter:blur(40px);

}

.ready-grow .container{

    position:relative;

    z-index:2;

}

.ready-grow-box{

    background:linear-gradient(135deg,#0f4c81,#00b4d8);

    border-radius:35px;

    padding:80px 70px;

    text-align:center;

    color:#fff;

    position:relative;

    overflow:hidden;

    box-shadow:0 35px 80px rgba(15,76,129,.20);

}

.ready-grow-box::before{

    content:"";

    position:absolute;

    width:280px;
    height:280px;

    background:rgba(255,255,255,.08);

    border-radius:50%;

    left:-80px;
    top:-80px;

}

.ready-grow-box::after{

    content:"";

    position:absolute;

    width:220px;
    height:220px;

    background:rgba(255,255,255,.08);

    border-radius:50%;

    right:-60px;
    bottom:-60px;

}

.ready-grow-box .about-tag{

    background:rgba(255,255,255,.15);

    color:#fff;

    border:1px solid rgba(255,255,255,.25);

    margin-bottom:30px;

}

.ready-grow-box .about-tag i{

    color:#fff;

}

.ready-grow-box h2{

    font-size:58px;

    font-weight:800;

    line-height:1.2;

    color:#fff;

    margin-bottom:25px;

}

.ready-grow-box h2 span{

    color:#dff8ff;

}

.ready-grow-box p{

    max-width:760px;

    margin:0 auto 40px;

    font-size:18px;

    line-height:1.9;

    color:rgba(255,255,255,.92);

}

.ready-grow-box .consultation-btn{

    background:#fff;

    color:#0f4c81;

    border:none;

    padding:16px 40px;

    border-radius:50px;

    font-weight:700;

    transition:.4s;

}

.ready-grow-box .consultation-btn:hover{

    transform:translateY(-5px);

    background:linear-gradient(135deg,#0f4c81,#00b4d8);

    color:#fff;

    box-shadow:0 25px 45px rgba(15,76,129,.30);

}

