/*==================================================
        SERVICES HERO SECTION
==================================================*/

.services-hero{

    position:relative;
    overflow:hidden;

    padding:90px 0;

    background:linear-gradient(135deg,#f7fbff 0%,#eef8ff 50%,#ffffff 100%);

}

/*==================================
Breadcrumb
==================================*/

.services-breadcrumb{

    display:flex;

    align-items:center;

    gap:12px;

    margin-bottom:22px;

    font-size:16px;

    color:#64748B;

}

.services-breadcrumb a{

    color:#00B4D8;

    text-decoration:none;

    font-weight:600;

}

.services-breadcrumb span{

    color:#94A3B8;

    font-weight:500;

}

/*==================================
Services Tag
==================================*/

.services-tag{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:12px 24px;

    border-radius:50px;

    background:#E8F8FF;

    border:1px solid rgba(0,180,216,.20);

    color:#0F4C81;

    font-size:16px;

    font-weight:600;

    margin-bottom:30px;

    transition:.35s;

}

.services-tag i{

    color:#00B4D8;

    font-size:16px;

}

.services-tag:hover{

    transform:translateY(-3px);

    box-shadow:0 15px 35px rgba(15,76,129,.12);

}


/*==========================
Background Shapes
==========================*/

.services-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);

}

.services-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
==========================*/

.services-hero .container{

    position:relative;
    z-index:2;

}

.services-hero .row{

    min-height:650px;

    align-items:center;

}


/*==========================
Heading
==========================*/

.services-hero h1{

    font-size:62px;

    font-weight:800;

    line-height:1.1;

    color:#1F2937;

    margin-bottom:28px;

}

.services-hero h1 span{

    display:block;

    color:#00B4D8;

}


/*==========================
Description
==========================*/

.services-hero p{

    max-width:600px;

    font-size:18px;

    line-height:1.9;

    color:#64748B;

    margin-bottom:35px;

}


/*==========================
Buttons
==========================*/

.hero-buttons{

    display:flex;

    gap:18px;

    flex-wrap:wrap;

    margin-bottom:45px;

}

.hero-buttons .btn{

    padding:15px 34px;

    border-radius:50px;

    font-weight:600;

    transition:.35s;

}

.hero-buttons .btn-primary{

    background:linear-gradient(90deg,#0F4C81,#00B4D8);

    border:none;

    color:#fff;

    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;

}


/*==========================
Stats
==========================*/

.hero-stats{

    display:flex;

    gap:55px;

    flex-wrap:wrap;

}

.hero-stat h3{

    font-size:46px;

    font-weight:800;

    color:#0F4C81;

    margin-bottom:8px;

    line-height:1;

}

.hero-stat span{

    font-size:16px;

    color:#64748B;

}


/*==========================
Image
==========================*/

.services-hero-image{

    display:flex;

    justify-content:center;

    align-items:center;

}

.services-hero-image img{

    width:100%;

    max-width:560px;

    animation:heroFloat 5s ease-in-out infinite;

    transition:.4s;

    filter:drop-shadow(0 25px 45px rgba(15,76,129,.15));

}

.services-hero-image img:hover{

    transform:translateY(-8px) scale(1.02);

}


/*==========================
Floating Animation
==========================*/

@keyframes heroFloat{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-15px);

    }

    100%{

        transform:translateY(0);

    }

}


/*==========================
Decoration
==========================*/

.services-hero .container::before{

    content:"";

    position:absolute;

    width:140px;
    height:140px;

    border:2px dashed rgba(0,180,216,.15);

    border-radius:50%;

    top:100px;
    right:80px;

    animation:rotateCircle 20s linear infinite;

}

@keyframes rotateCircle{

    from{

        transform:rotate(0deg);

    }

    to{

        transform:rotate(360deg);

    }

}

/*==================================================
        OUR SERVICES SECTION
==================================================*/

.cdm-services-section{

    position:relative;

    padding:90px 0;

    background:#f8fbff;

    overflow:hidden;

}

.cdm-services-section::before{

    content:"";

    position:absolute;

    width:500px;
    height:500px;

    top:-220px;
    left:-180px;

    border-radius:50%;

    background:rgba(0,180,216,.08);

    filter:blur(50px);

}

.cdm-services-section::after{

    content:"";

    position:absolute;

    width:500px;
    height:500px;

    right:-180px;
    bottom:-220px;

    border-radius:50%;

    background:rgba(15,76,129,.08);

    filter:blur(50px);

}

.cdm-services-section .container{

    position:relative;

    z-index:2;

}

/*=========================================
Section Heading
=========================================*/

.cdm-services-header{

    max-width:760px;

    margin:0 auto 70px;

}

.cdm-services-tag{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:12px 24px;

    border-radius:50px;

    background:#eaf9ff;

    border:1px solid rgba(0,180,216,.20);

    color:#0F4C81;

    font-weight:600;

    margin-bottom:25px;

}

.cdm-services-tag i{

    color:#00B4D8;

}

.cdm-services-title{

    font-size:56px;

    font-weight:800;

    line-height:1.15;

    color:#1F2937;

    margin-bottom:25px;

}

.cdm-services-title span{

    color:#00B4D8;

}

.cdm-services-description{

    font-size:18px;

    line-height:1.9;

    color:#64748B;

}

/*=========================================
Service Card
=========================================*/

.cdm-service-card{

    height:100%;

    background:#fff;

    border-radius:28px;

    padding:40px;

    border:1px solid #e8eef6;

    transition:.40s ease;

    position:relative;

    overflow:hidden;

    box-shadow:0 15px 45px rgba(15,76,129,.06);

    display:flex;

    flex-direction:column;

    justify-content:space-between;

}

.cdm-service-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:5px;

    background:linear-gradient(90deg,#0F4C81,#00B4D8,#22C55E);

    transform:scaleX(0);

    transform-origin:left;

    transition:transform .45s ease;

}

.cdm-service-card:hover{

    transform:translateY(-12px);

    border-color:#00B4D8;

    box-shadow:0 35px 70px rgba(15,76,129,.18);

}

.cdm-service-card:hover::before{

    transform:scaleX(1);

}

/*=========================================
Service Icon
=========================================*/

.cdm-service-icon{

    width:78px;
    height:78px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:22px;

    background:linear-gradient(135deg,#0F4C81,#00B4D8);

    color:#fff;

    font-size:34px;

    margin-bottom:30px;

    transition:.4s;

    transition:all .4s ease;

    box-shadow:0 15px 35px rgba(15,76,129,.18);

}

.cdm-service-card:hover .cdm-service-icon{

    transform:rotate(-10deg) scale(1.12);

    box-shadow:0 20px 45px rgba(0,180,216,.35);

}


/*=========================================
Title
=========================================*/

.cdm-service-title{

    font-size:28px;

    font-weight:700;

    color:#1F2937;

    margin-bottom:18px;

}


/*=========================================
Description
=========================================*/

.cdm-service-text{

    font-size:16px;

    line-height:1.9;

    color:#64748B;

    margin-bottom:28px;

}


/*=========================================
Feature List
=========================================*/

.cdm-service-list{

    list-style:none;

    padding:0;

    margin:0 0 35px;

}

.cdm-service-list li{

    position:relative;

    padding-left:28px;

    margin-bottom:14px;

    color:#475569;

    font-size:15px;

}

.cdm-service-list li::before{

    content:"✓";

    position:absolute;

    left:0;

    top:0;

    color:#00B4D8;

    font-weight:700;

}


/*=========================================
Learn More
=========================================*/

.cdm-service-link{

    display:inline-flex;

    align-items:center;

    gap:10px;

    color:#0F4C81;

    font-weight:700;

    text-decoration:none;

    transition:.35s;

    margin-top:auto;

}

.cdm-service-link i{

    transition:.35s;

}

.cdm-service-card:hover .cdm-service-link{

    color:#00B4D8;

}

.cdm-service-card:hover .cdm-service-link i{

    transform:translateX(8px);

}

/*==================================================
            OUR PROCESS SECTION
==================================================*/

.cdm-process-section{

    position:relative;

    overflow:hidden;

    padding:90px 0;

    background:#ffffff;

}

.cdm-process-section::before{

    content:"";

    position:absolute;

    width:520px;
    height:520px;

    top:-220px;
    right:-220px;

    border-radius:50%;

    background:rgba(0,180,216,.07);

    filter:blur(55px);

}

.cdm-process-section .container{

    position:relative;

    z-index:2;

}


/*==========================================
Section Heading
==========================================*/

.cdm-process-header{

    max-width:760px;

    margin:0 auto 70px;

}

.cdm-process-tag{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:12px 24px;

    border-radius:50px;

    background:#EAF9FF;

    border:1px solid rgba(0,180,216,.18);

    color:#0F4C81;

    font-weight:600;

    margin-bottom:25px;

}

.cdm-process-tag i{

    color:#00B4D8;

}

.cdm-process-title{

    font-size:56px;

    font-weight:800;

    color:#1F2937;

    line-height:1.15;

    margin-bottom:22px;

}

.cdm-process-title span{

    color:#00B4D8;

}

.cdm-process-description{

    font-size:18px;

    color:#64748B;

    line-height:1.9;

}

/*==========================================
Process Cards
==========================================*/

.cdm-process-card{

    position:relative;

    height:100%;

    padding:45px 35px;

    background:#fff;

    border:1px solid #E5E7EB;

    border-radius:28px;

    text-align:center;

    overflow:visible;

    transition:.4s ease;

    box-shadow:0 15px 40px rgba(15,76,129,.06);

}

.cdm-process-card:hover{

    transform:translateY(-14px);

    border-color:#00B4D8;

    background:#ffffff;

    box-shadow:0 35px 70px rgba(15,76,129,.18);

}


/*==========================================
Step Number
==========================================*/

.cdm-process-number{

    position:absolute;

    top:22px;

    right:25px;

    font-size:48px;

    font-weight:800;

    color:rgba(15,76,129,.08);

    line-height:1;

}


/*==========================================
Process Icon
==========================================*/

.cdm-process-icon{

    width:85px;

    height:85px;

    margin:0 auto 30px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:22px;

    background:linear-gradient(135deg,#0F4C81,#00B4D8);

    color:#fff;

    font-size:34px;

    transition:.4s;

    box-shadow:0 18px 35px rgba(15,76,129,.18);

}

.cdm-process-card:hover .cdm-process-icon{

    transform:rotate(-10deg) scale(1.08);

}


/*==========================================
Title
==========================================*/

.cdm-process-card h3{

    font-size:28px;

    font-weight:700;

    color:#1F2937;

    margin-bottom:18px;

}


/*==========================================
Description
==========================================*/

.cdm-process-card p{

    font-size:16px;

    line-height:1.9;

    color:#64748B;

    margin:0;

}


.cdm-process-card:hover .cdm-process-icon{

    transform:rotate(-10deg) scale(1.1);

    box-shadow:0 20px 45px rgba(0,180,216,.35);

}

.cdm-process-card:hover h3{

    color:#00B4D8;

}

/*==================================================
        WHY CHOOSE US SECTION
==================================================*/

.cdm-choose-section{

    padding:90px 0;

    background:#ffffff;

    overflow:hidden;

}

.cdm-choose-content{

    max-width:600px;

}

.cdm-choose-tag{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:12px 24px;

    border-radius:50px;

    background:#EAF8FF;

    border:1px solid rgba(0,180,216,.20);

    color:#0F4C81;

    font-size:15px;

    font-weight:600;

    margin-bottom:28px;

}

.cdm-choose-tag i{

    color:#00B4D8;

}

.cdm-choose-title{

    font-size:52px;

    font-weight:800;

    line-height:1.15;

    color:#1F2937;

    margin-bottom:25px;

}

.cdm-choose-title span{

    color:#00B4D8;

}

.cdm-choose-description{

    font-size:18px;

    line-height:1.9;

    color:#64748B;

    margin-bottom:35px;

}

.cdm-choose-grid{

    display:grid;

    grid-template-columns:1fr;

    gap:18px;

}

.cdm-choose-item{

    display:flex;

    align-items:center;

    gap:15px;

    font-size:19px;

    font-weight:600;

    color:#1F2937;

    transition:.35s;

}

.cdm-choose-item i{

    color:#00B4D8;

    font-size:22px;

}

.cdm-choose-item:hover{

    transform:translateX(8px);

}

.cdm-choose-image{

    display:flex;

    justify-content:center;

    align-items:center;

}

.cdm-choose-image img{

    width:100%;

    max-width:700px;

    transform:scale(1.15);

    animation:chooseFloat 5s ease-in-out infinite;

    filter:drop-shadow(0 30px 60px rgba(15,76,129,.15));

}

@keyframes chooseFloat{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-15px);

    }

    100%{

        transform:translateY(0);

    }

}

/*==================================================
                SERVICES FAQ SECTION
==================================================*/

.cdm-services-faq-section{

    position:relative;

    padding:120px 0;

    overflow:hidden;

    background:linear-gradient(
        180deg,
        #F8FBFF 0%,
        #FFFFFF 100%
    );

}

.cdm-services-faq-section::before{

    content:"";

    position:absolute;

    width:600px;

    height:600px;

    top:-250px;

    left:-220px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(0,180,216,.08),
    transparent 72%);

}

.cdm-services-faq-section::after{

    content:"";

    position:absolute;

    width:480px;

    height:480px;

    right:-180px;

    bottom:-180px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(15,76,129,.08),
    transparent 72%);

}

.cdm-services-faq-section .container{

    position:relative;

    z-index:2;

}

/*==================================================
                SECTION HEADING
==================================================*/

.cdm-services-faq-heading{

    max-width:760px;

    margin:0 auto 70px;

}

.cdm-services-faq-heading h2{

    font-size:56px;

    font-weight:800;

    line-height:1.2;

    color:#1E293B;

    margin-bottom:18px;

}

.cdm-services-faq-heading h2 span{

    color:#00B4D8;

}

.cdm-services-faq-description,

.cdm-services-faq-heading p{

    margin-top:18px;

    font-size:18px;

    line-height:1.9;

    color:#6B7280;

}

/*==================================================
                ACCORDION
==================================================*/

.cdm-services-faq-accordion{

    display:flex;

    flex-direction:column;

    gap:22px;

}

.cdm-services-faq-accordion .accordion-item{

    border:none;

    overflow:hidden;

    border-radius:24px;

    background:#ffffff;

    box-shadow:
    0 18px 45px rgba(15,76,129,.08);

    border:1px solid rgba(15,76,129,.08);

    transition:.4s ease;

}

.cdm-services-faq-accordion .accordion-item:hover{

    transform:translateY(-6px);

    border-color:#00B4D8;

    box-shadow:
    0 28px 65px rgba(15,76,129,.15);

}

/*==================================================
                HEADER
==================================================*/

.cdm-services-faq-accordion .accordion-header{

    margin:0;

}

.cdm-services-faq-accordion .accordion-button{

    position:relative;

    padding:28px 75px 28px 32px;

    background:#ffffff;

    color:#1E293B;

    font-size:21px;

    font-weight:700;

    line-height:1.5;

    border:none;

    box-shadow:none;

}/*==================================================
            ACCORDION OPEN STATE
==================================================*/

.cdm-services-faq-accordion .accordion-button:not(.collapsed){

    background:#ffffff;

    color:#0F4C81;

    box-shadow:none;

}

.cdm-services-faq-accordion .accordion-button:focus{

    box-shadow:none;

    border:none;

}

/*==================================================
            CUSTOM ICON
==================================================*/

.cdm-services-faq-accordion .accordion-button::after{

    width:48px;

    height:48px;

    border-radius:50%;

    background:none;

    content:"+";

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:28px;

    font-weight:700;

    color:#0F4C81;

    background:#EAF8FF;

    transition:.4s ease;

}

.cdm-services-faq-accordion .accordion-button:not(.collapsed)::after{

    content:"−";

    color:#ffffff;

    background:linear-gradient(
        135deg,
        #0F4C81,
        #00B4D8
    );

    transform:rotate(180deg);

}

/*==================================================
            ACCORDION BODY
==================================================*/

.cdm-services-faq-accordion .accordion-body{

    padding:0 32px 30px;

    font-size:16px;

    line-height:1.9;

    color:#6B7280;

    border-top:1px solid rgba(15,76,129,.06);

    background:linear-gradient(
        180deg,
        #ffffff,
        #FCFEFF
    );

}

.cdm-services-faq-accordion .accordion-body p{

    margin:0;

}

/*==================================================
            OPEN ITEM
==================================================*/

.cdm-services-faq-accordion .accordion-item:has(.accordion-button:not(.collapsed)){

    border-color:#00B4D8;

    transform:translateY(-4px);

    box-shadow:
    0 30px 70px rgba(15,76,129,.14);

}

/*==================================================
            TRANSITIONS
==================================================*/

.cdm-services-faq-accordion .accordion-item,

.cdm-services-faq-accordion .accordion-button,

.cdm-services-faq-accordion .accordion-body,

.cdm-services-faq-accordion .accordion-button::after{

    transition:.35s ease;

}

/*==================================================
            PREMIUM HOVER EFFECT
==================================================*/

.cdm-services-faq-accordion .accordion-item{

    position:relative;

}

.cdm-services-faq-accordion .accordion-item::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:4px;

    background:linear-gradient(
        90deg,
        #0F4C81,
        #00B4D8
    );

    transform:scaleX(0);

    transform-origin:left;

    transition:.45s ease;

}

.cdm-services-faq-accordion .accordion-item:hover::before{

    transform:scaleX(1);

}

.cdm-services-faq-accordion .accordion-button:hover{

    color:#0F4C81;

    padding-left:40px;

}

.cdm-services-faq-accordion .accordion-item:hover .accordion-button::after{

    transform:scale(1.12);

}

.cdm-services-faq-accordion .accordion-button:not(.collapsed)::after{

    box-shadow:
    0 12px 25px rgba(15,76,129,.22);

}

/*==================================================
            SHINE EFFECT
==================================================*/

.cdm-services-faq-accordion .accordion-item::after{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:70%;

    height:100%;

    background:linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,.45),
        transparent
    );

    transition:1s;

    pointer-events:none;

}

.cdm-services-faq-accordion .accordion-item:hover::after{

    left:150%;

}

/*==================================================
            PREMIUM SHADOW
==================================================*/

.cdm-services-faq-accordion .accordion-item:hover{

    box-shadow:
    0 30px 75px rgba(15,76,129,.16),
    0 0 0 1px rgba(0,180,216,.10);

}

/*==================================================
            GPU FIX
==================================================*/

.cdm-services-faq-accordion .accordion-item,

.cdm-services-faq-accordion .accordion-button,

.cdm-services-faq-accordion .accordion-button::after{

    transform:translateZ(0);

    backface-visibility:hidden;

}

