/*==================================================
            CASE STUDY BREADCRUMB
==================================================*/

.breadcrumb-section{

    position:relative;

    overflow:hidden;

    padding:110px 0 90px;

    background:linear-gradient(
        135deg,
        #081C3A 0%,
        #103A75 55%,
        #2563EB 100%
    );

}

.breadcrumb-section::before{

    content:"";

    position:absolute;

    top:-180px;

    left:-180px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:rgba(255,255,255,.05);

}

.breadcrumb-section::after{

    content:"";

    position:absolute;

    right:-180px;

    bottom:-180px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:rgba(255,255,255,.04);

}

/*=========================================
        WRAPPER
=========================================*/

.breadcrumb-wrapper{

    position:relative;

    z-index:2;


    align-items:center;

    gap:70px;

}

/*=========================================
        CONTENT
=========================================*/

.breadcrumb-content{

    color:#ffffff;

}

.breadcrumb-badge{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:10px 22px;

    border-radius:50px;

    margin-bottom:25px;

    background:rgba(255,255,255,.12);

    backdrop-filter:blur(10px);

    color:#FFD54A;

    font-size:14px;

    font-weight:700;

}

.breadcrumb-badge i{

    color:#FFD54A;

}

/*=========================================
        NAV
=========================================*/

.breadcrumb-nav{

    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:12px;

    margin:0 0 25px;

    padding:0;

    list-style:none;

}

.breadcrumb-nav li{

    color:rgba(255,255,255,.85);

    font-size:14px;

}

.breadcrumb-nav a{

    color:#ffffff;

    text-decoration:none;

    transition:.3s;

}

.breadcrumb-nav a:hover{

    color:#FFD54A;

}

.breadcrumb-nav i{

    font-size:12px;

}

/*=========================================
        TITLE
=========================================*/

.breadcrumb-content h1{

    font-size:56px;

    line-height:1.2;

    font-weight:800;

    color:#ffffff;

    margin-bottom:22px;

}

.breadcrumb-content p{

    font-size:17px;

    line-height:1.9;

    color:rgba(255,255,255,.88);

    margin-bottom:40px;

}

/*=========================================
        PROJECT INFO
=========================================*/

.project-info{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:18px;

    margin-bottom:45px;

}

.project-item{

    display:flex;

    align-items:center;

    gap:16px;

    padding:18px;

    border-radius:18px;

    background:rgba(255,255,255,.08);

    backdrop-filter:blur(14px);

    transition:.35s;

}

.project-item:hover{

    transform:translateY(-5px);

    background:rgba(255,255,255,.14);

}

.project-item i{

    width:55px;

    height:55px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:15px;

    background:#ffffff;

    color:#2563EB;

    font-size:22px;

}

.project-item strong{

    display:block;

    color:#ffffff;

    font-size:15px;

    margin-bottom:4px;

}

.project-item span{

    color:rgba(255,255,255,.82);

    font-size:14px;

}

/*=========================================
        BUTTONS
=========================================*/

.breadcrumb-buttons{

    display:flex;

    flex-wrap:wrap;

    gap:18px;

}

.breadcrumb-buttons .theme-btn{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:15px 30px;

    border-radius:60px;

    background:#ffffff;

    color:#2563EB;

    font-weight:700;

    text-decoration:none;

    transition:.35s;

    box-shadow:

        0 20px 45px rgba(0,0,0,.18);

}

.breadcrumb-buttons .theme-btn:hover{

    transform:translateY(-5px);

    background:#FFD54A;

    color:#081C3A;

}

.secondary-btn{

    background:transparent !important;

    color:#ffffff !important;

    border:2px solid rgba(255,255,255,.25);

}

.secondary-btn:hover{

    background:#ffffff !important;

    color:#2563EB !important;

}

/*=========================================
        IMAGE
=========================================*/

.breadcrumb-image{

    position:relative;

}

.breadcrumb-image img{

    width:100%;

    border-radius:30px;

    display:block;

    box-shadow:

        0 40px 80px rgba(0,0,0,.28);

    transition:.45s;
    margin-bottom:30px;

}

.breadcrumb-image:hover img{

    transform:scale(1.03);

}

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

@media(max-width:1199px){

.breadcrumb-content h1{

font-size:46px;

}

}

@media(max-width:991px){

.breadcrumb-section{

padding:90px 0;

}

.breadcrumb-wrapper{

grid-template-columns:1fr;

gap:50px;

}

.breadcrumb-content{

text-align:center;

}

.project-info{

grid-template-columns:repeat(2,1fr);

}

.breadcrumb-buttons{

justify-content:center;

}

}

@media(max-width:767px){

.breadcrumb-section{

padding:70px 0;

}

.breadcrumb-content h1{

font-size:34px;

}

.breadcrumb-content p{

font-size:15px;

}

.project-info{

grid-template-columns:1fr;

}

.project-item{

padding:16px;

}

.breadcrumb-buttons{

flex-direction:column;

}

.breadcrumb-buttons .theme-btn{

width:100%;

justify-content:center;

}

.breadcrumb-image{

margin-top:15px;

}

}/*==================================================
            CLIENT OVERVIEW
==================================================*/

.client-overview-section{

    position:relative;

    overflow:hidden;

    padding:100px 0;

    background:#ffffff;

}

.client-overview-section::before{

    content:"";

    position:absolute;

    top:-180px;

    right:-180px;

    width:380px;

    height:380px;

    border-radius:50%;

    background:radial-gradient(rgba(37,99,235,.05),transparent 70%);

}

.client-overview-section::after{

    content:"";

    position:absolute;

    bottom:-180px;

    left:-180px;

    width:380px;

    height:380px;

    border-radius:50%;

    background:radial-gradient(rgba(255,122,26,.05),transparent 70%);

}

/*=========================================
        WRAPPER
=========================================*/

.client-overview-wrapper{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:45px;

    align-items:start;

}

/*=========================================
        DETAILS
=========================================*/

.client-details{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:22px;

}

/*=========================================
        CARD
=========================================*/

.overview-card{

    display:flex;

    align-items:center;

    gap:18px;

    padding:28px;

    background:#ffffff;

    border-radius:22px;

    border:1px solid #EEF2F7;

    transition:.35s;

    box-shadow:

        0 18px 45px rgba(15,23,42,.05);

}

.overview-card:hover{

    transform:translateY(-8px);

    border-color:#2563EB;

    box-shadow:

        0 30px 70px rgba(37,99,235,.10);

}

/*=========================================
        ICON
=========================================*/

.overview-icon{

    width:70px;

    height:70px;

    flex-shrink:0;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:20px;

    background:linear-gradient(

        135deg,

        #2563EB,

        #3B82F6

    );

    color:#ffffff;

    font-size:26px;

    box-shadow:

        0 18px 35px rgba(37,99,235,.25);

}

.overview-card span{

    display:block;

    color:#64748B;

    font-size:13px;

    font-weight:600;

    text-transform:uppercase;

    letter-spacing:.5px;

    margin-bottom:8px;

}

.overview-card h4{

    margin:0;

    font-size:20px;

    font-weight:700;

    color:#081C3A;

    line-height:1.4;

}

/*=========================================
        SUMMARY
=========================================*/

.summary-card{

    position:sticky;

    top:120px;

    padding:45px;

    border-radius:28px;

    background:linear-gradient(

        135deg,

        #081C3A,

        #103A75

    );

    color:#ffffff;

    overflow:hidden;

    box-shadow:

        0 35px 80px rgba(15,23,42,.20);

}

.summary-card::before{

    content:"";

    position:absolute;

    right:-120px;

    top:-120px;

    width:260px;

    height:260px;

    border-radius:50%;

    background:rgba(255,255,255,.05);

}

.summary-label{

    display:inline-block;

    padding:8px 18px;

    border-radius:50px;

    margin-bottom:20px;

    background:rgba(255,255,255,.12);

    color:#FFD54A;

    font-size:13px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:.6px;

}

.summary-card h3{

    font-size:34px;

    font-weight:800;

    line-height:1.3;

    margin-bottom:22px;

    color:#ffffff;

}

.summary-card p{

    font-size:16px;

    line-height:1.9;

    color:rgba(255,255,255,.85);

    margin-bottom:35px;

}

.summary-card .theme-btn{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:16px 30px;

    border-radius:60px;

    background:#ffffff;

    color:#2563EB;

    font-weight:700;

    text-decoration:none;

    transition:.35s;

}

.summary-card .theme-btn:hover{

    transform:translateY(-4px);

    background:#FFD54A;

    color:#081C3A;

}

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

@media(max-width:1199px){

.summary-card h3{

font-size:30px;

}

.overview-card{

padding:22px;

}

}

@media(max-width:991px){

.client-overview-wrapper{

grid-template-columns:1fr;

}

.summary-card{

position:relative;

top:0;

}

}

@media(max-width:767px){

.client-overview-section{

padding:70px 0;

}

.client-details{

grid-template-columns:1fr;

}

.overview-card{

padding:20px;

}

.overview-icon{

width:60px;

height:60px;

font-size:22px;

}

.overview-card h4{

font-size:18px;

}

.summary-card{

padding:30px;

}

.summary-card h3{

font-size:26px;

}

.summary-card p{

font-size:15px;

}

.summary-card .theme-btn{

width:100%;

justify-content:center;

}

}/*==================================================
            PREMIUM SECTION TITLE
==================================================*/

.section-title{

    position:relative;

    max-width:900px;

    margin:0 auto 70px;

    text-align:center;

    z-index:2;

}

/*=========================================
        BADGE
=========================================*/

.section-badge{

    position:relative;

    display:inline-flex;

    align-items:center;

    gap:12px;

    padding:10px 22px 10px 12px;

    margin-bottom:25px;

    border-radius:60px;

    background:#ffffff;

    border:1px solid rgba(37,99,235,.12);

    box-shadow:

        0 12px 35px rgba(15,23,42,.06);

    font-size:14px;

    font-weight:700;

    color:#2563EB;

    letter-spacing:.4px;

    text-transform:uppercase;

    overflow:hidden;

}

.section-badge::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(

        135deg,

        rgba(37,99,235,.05),

        rgba(59,130,246,.08)

    );

    opacity:0;

    transition:.35s;

}

.section-badge:hover::before{

    opacity:1;

}

.section-badge i{

    position:relative;

    width:36px;

    height:36px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:linear-gradient(

        135deg,

        #2563EB,

        #3B82F6

    );

    color:#ffffff;

    font-size:15px;

    box-shadow:

        0 10px 25px rgba(37,99,235,.25);

}

/*=========================================
        HEADING
=========================================*/

.section-title h2{

    position:relative;

    margin:0;

    font-size:52px;

    font-weight:800;

    line-height:1.18;

    color:#081C3A;

    letter-spacing:-1.2px;

}

.section-title h2::after{

    content:"";

    display:block;

    width:90px;

    height:5px;

    margin:30px auto 0;

    border-radius:20px;

    background:linear-gradient(

        90deg,

        #2563EB,

        #3B82F6,

        #FF7A1A

    );

}

/*=========================================
        DESCRIPTION
=========================================*/

.section-title p{

    max-width:760px;

    margin:28px auto 0;

    color:#64748B;

    font-size:18px;

    line-height:1.9;

}

/*=========================================
        DECORATION
=========================================*/

.section-divider{

    position:relative;

    width:150px;

    height:40px;

    margin:30px auto 0;

}

.section-divider::before{

    content:"";

    position:absolute;

    left:50%;

    top:18px;

    transform:translateX(-50%);

    width:100px;

    height:2px;

    background:#D7E4F8;

}

.section-divider::after{

    content:"";

    position:absolute;

    left:50%;

    top:8px;

    transform:translateX(-50%);

    width:22px;

    height:22px;

    border-radius:50%;

    background:#2563EB;

    border:6px solid #ffffff;

    box-shadow:

        0 0 0 1px #D7E4F8,

        0 12px 30px rgba(37,99,235,.25);

}

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

@media(max-width:1199px){

.section-title h2{

font-size:46px;

}

}

@media(max-width:991px){

.section-title{

margin-bottom:60px;

}

.section-title h2{

font-size:40px;

}

.section-title p{

font-size:17px;

}

}

@media(max-width:767px){

.section-title{

margin-bottom:45px;

}

.section-badge{

font-size:12px;

padding:8px 18px 8px 10px;

}

.section-badge i{

width:30px;

height:30px;

font-size:13px;

}

.section-title h2{

font-size:30px;

line-height:1.35;

letter-spacing:-.5px;

}

.section-title p{

font-size:15px;

line-height:1.8;

margin-top:20px;

}

.section-divider{

margin-top:25px;

}

}

    /*==================================================
            PROJECT CHALLENGE
==================================================*/

.challenge-section{

    position:relative;

    overflow:hidden;

    padding:110px 0;

    background:#F8FBFF;

}

.challenge-section::before{

    content:"";

    position:absolute;

    top:-220px;

    left:-220px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(
        rgba(37,99,235,.06),
        transparent 72%
    );

}

.challenge-section::after{

    content:"";

    position:absolute;

    bottom:-220px;

    right:-220px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(
        rgba(255,122,26,.05),
        transparent 72%
    );

}

/*=========================================
        WRAPPER
=========================================*/

.challenge-wrapper{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:1.25fr .75fr;

    gap:60px;

    align-items:start;

}

/*=========================================
        CONTENT
=========================================*/

.challenge-content h2{

    margin:22px 0;

    font-size:46px;

    font-weight:800;

    line-height:1.2;

    color:#081C3A;

}

.challenge-content>p{

    margin-bottom:35px;

    font-size:17px;

    line-height:1.9;

    color:#64748B;

}

/*=========================================
        DESCRIPTION
=========================================*/

.challenge-description{

    position:relative;

    padding:40px;

    background:#ffffff;

    border-radius:26px;

    border-left:6px solid #2563EB;

    box-shadow:

        0 20px 60px rgba(15,23,42,.06);

}

.challenge-description p{

    margin-bottom:22px;

    color:#475569;

    line-height:2;

    font-size:16px;

}

.challenge-description p:last-child{

    margin-bottom:0;

}

/*=========================================
        SIDEBAR
=========================================*/

.challenge-sidebar{

    display:flex;

    flex-direction:column;

    gap:25px;

}

/*=========================================
        CARD
=========================================*/

.challenge-card{

    position:relative;

    overflow:hidden;

    padding:35px;

    border-radius:24px;

    background:#ffffff;

    transition:.35s;

    border:1px solid #EEF2F7;

    box-shadow:

        0 18px 50px rgba(15,23,42,.06);

}

.challenge-card:hover{

    transform:translateY(-8px);

    border-color:#2563EB;

    box-shadow:

        0 30px 70px rgba(37,99,235,.12);

}

.challenge-card::before{

    content:"";

    position:absolute;

    right:-40px;

    top:-40px;

    width:120px;

    height:120px;

    border-radius:50%;

    background:rgba(37,99,235,.04);

}

/*=========================================
        ICON
=========================================*/

.challenge-icon{

    width:70px;

    height:70px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:18px;

    margin-bottom:22px;

    background:linear-gradient(

        135deg,

        #2563EB,

        #3B82F6

    );

    color:#ffffff;

    font-size:28px;

    box-shadow:

        0 20px 45px rgba(37,99,235,.22);

}

.challenge-card h4{

    margin-bottom:15px;

    font-size:22px;

    font-weight:700;

    color:#081C3A;

}

.challenge-card p{

    margin:0;

    color:#64748B;

    line-height:1.9;

    font-size:15px;

}

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

.challenge-card:hover .challenge-icon{

    transform:rotate(-10deg) scale(1.08);

    transition:.35s;

}

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

@media(max-width:1199px){

.challenge-content h2{

font-size:40px;

}

}

@media(max-width:991px){

.challenge-wrapper{

grid-template-columns:1fr;

gap:50px;

}

.challenge-sidebar{

display:grid;

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:767px){

.challenge-section{

padding:70px 0;

}

.challenge-content h2{

font-size:32px;

}

.challenge-content>p{

font-size:15px;

}

.challenge-description{

padding:25px;

}

.challenge-description p{

font-size:15px;

}

.challenge-sidebar{

grid-template-columns:1fr;

}

.challenge-card{

padding:25px;

}

.challenge-card h4{

font-size:20px;

}

.challenge-icon{

width:60px;

height:60px;

font-size:24px;

}

}
/*==================================================
            OUR SOLUTION
==================================================*/

.solution-section{

    position:relative;

    overflow:hidden;

    padding:110px 0;

    background:#ffffff;

}

.solution-section::before{

    content:"";

    position:absolute;

    top:-220px;

    right:-220px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(rgba(37,99,235,.05),transparent 70%);

}

.solution-section::after{

    content:"";

    position:absolute;

    bottom:-220px;

    left:-220px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(rgba(255,122,26,.05),transparent 70%);

}

/*=========================================
        WRAPPER
=========================================*/

.solution-wrapper{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:1.2fr .8fr;

    gap:60px;

    align-items:start;

}

/*=========================================
        CONTENT
=========================================*/

.solution-content{

    padding:45px;

    background:#ffffff;

    border-radius:30px;

    border-left:6px solid #2563EB;

    box-shadow:

        0 20px 60px rgba(15,23,42,.06);

}

.solution-content p{

    margin-bottom:22px;

    color:#475569;

    font-size:16px;

    line-height:2;

}

.solution-content p:last-child{

    margin-bottom:0;

}

.solution-content h3,

.solution-content h4{

    margin:35px 0 18px;

    color:#081C3A;

    font-weight:700;

}

.solution-content ul{

    margin:25px 0;

    padding-left:20px;

}

.solution-content li{

    margin-bottom:12px;

    color:#475569;

    line-height:1.9;

}

/*=========================================
        PROCESS
=========================================*/

.solution-process{

    position:relative;

    display:flex;

    flex-direction:column;

    gap:30px;

}

/* Timeline */

.solution-process::before{

    content:"";

    position:absolute;

    left:35px;

    top:0;

    bottom:0;

    width:3px;

    background:linear-gradient(

        #2563EB,

        #3B82F6,

        #FF7A1A

    );

}

/*=========================================
        PROCESS CARD
=========================================*/

.process-card{

    position:relative;

    display:flex;

    gap:25px;

    padding:30px;

    margin-left:25px;

    background:#ffffff;

    border-radius:24px;

    transition:.35s;

    border:1px solid #EEF2F7;

    box-shadow:

        0 18px 45px rgba(15,23,42,.06);
        
    width: 100% !important;

}

.process-card:hover{

    transform:translateY(-8px);

    border-color:#2563EB;

    box-shadow:

        0 35px 80px rgba(37,99,235,.12);

}

/*=========================================
        NUMBER
=========================================*/

.process-number{

    position:absolute;

    left:-55px;

    top:30px;

    width:70px;

    height:70px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:linear-gradient(

        135deg,

        #2563EB,

        #3B82F6

    );

    color:#ffffff;

    font-size:22px;

    font-weight:800;

    box-shadow:

        0 20px 45px rgba(37,99,235,.25);

    z-index:2;

}

/*=========================================
        CONTENT
=========================================*/

.process-content{

    padding-left:35px;

}

.process-content h4{

    margin-bottom:15px;

    font-size:22px;

    font-weight:700;

    color:#081C3A;

}

.process-content p{

    margin:0;

    color:#64748B;

    line-height:1.9;

    font-size:15px;

}

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

.process-card:hover .process-number{

    transform:rotate(-12deg) scale(1.08);

    transition:.35s;

}

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

@media(max-width:1199px){

.solution-wrapper{

gap:45px;

}

}

@media(max-width:991px){

.solution-wrapper{

grid-template-columns:1fr;

}

.solution-process{

margin-top:10px;

}

}

@media(max-width:767px){

.solution-section{

padding:70px 0;

}

.solution-content{

padding:30px;

}

.solution-content p{

font-size:15px;

}

.solution-process::before{

left:28px;

}

.process-card{

margin-left:15px;

padding:25px;

}

.process-number{

width:55px;

height:55px;

left:-42px;

font-size:18px;

}

.process-content{

padding-left:20px;

}

.process-content h4{

font-size:20px;

}

.process-content p{

font-size:14px;

}

}
/*==================================================
            RESULTS & IMPACT
==================================================*/

.results-section{

    position:relative;

    overflow:hidden;

    padding:110px 0;

    background:linear-gradient(
        180deg,
        #F8FBFF 0%,
        #FFFFFF 100%
    );

}

.results-section::before{

    content:"";

    position:absolute;

    top:-220px;

    right:-220px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(
        rgba(37,99,235,.05),
        transparent 70%
    );

}

.results-section::after{

    content:"";

    position:absolute;

    bottom:-220px;

    left:-220px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(
        rgba(255,122,26,.05),
        transparent 70%
    );

}

/*=========================================
        WRAPPER
=========================================*/

.results-wrapper{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:1.15fr .85fr;

    gap:60px;

    align-items:start;

}

/*=========================================
        LEFT CONTENT
=========================================*/

.results-content{

    background:#ffffff;

    padding:45px;

    border-radius:30px;

    border-left:6px solid #10B981;

    box-shadow:

        0 20px 60px rgba(15,23,42,.06);

}

.results-content p{

    margin-bottom:22px;

    font-size:16px;

    line-height:2;

    color:#475569;

}

.results-content h3,

.results-content h4{

    margin:35px 0 18px;

    font-size:28px;

    color:#081C3A;

    font-weight:700;

}

.results-content ul{

    padding-left:22px;

    margin:25px 0;

}

.results-content li{

    margin-bottom:12px;

    color:#475569;

    line-height:1.9;

}

/*=========================================
        HIGHLIGHTS
=========================================*/

.results-highlights{

    display:grid;

    gap:25px;

}

/*=========================================
        IMPACT CARD
=========================================*/

.impact-card{

    position:relative;

    overflow:hidden;

    padding:35px;

    background:#ffffff;

    border-radius:24px;

    border:1px solid #EEF2F7;

    transition:.35s;

    box-shadow:

        0 18px 45px rgba(15,23,42,.06);

}

.impact-card:hover{

    transform:translateY(-8px);

    border-color:#10B981;

    box-shadow:

        0 30px 70px rgba(16,185,129,.14);

}

.impact-card::before{

    content:"";

    position:absolute;

    top:-40px;

    right:-40px;

    width:120px;

    height:120px;

    border-radius:50%;

    background:rgba(16,185,129,.05);

}

/*=========================================
        ICON
=========================================*/

.impact-icon{

    width:70px;

    height:70px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:22px;

    border-radius:18px;

    background:linear-gradient(

        135deg,

        #10B981,

        #22C55E

    );

    color:#ffffff;

    font-size:28px;

    box-shadow:

        0 18px 40px rgba(16,185,129,.25);

}

.impact-card:hover .impact-icon{

    transform:rotate(-12deg) scale(1.08);

    transition:.35s;

}

/*=========================================
        TEXT
=========================================*/

.impact-card h4{

    margin-bottom:14px;

    font-size:22px;

    font-weight:700;

    color:#081C3A;

}

.impact-card p{

    margin:0;

    color:#64748B;

    line-height:1.9;

    font-size:15px;

}

/*=========================================
        HIGHLIGHT STRIP
=========================================*/

.impact-card::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:100%;

    height:4px;

    background:linear-gradient(

        90deg,

        #10B981,

        #22C55E

    );

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.impact-card:hover::after{

    transform:scaleX(1);

}

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

@media(max-width:1199px){

.results-wrapper{

gap:45px;

}

.results-content{

padding:35px;

}

}

@media(max-width:991px){

.results-wrapper{

grid-template-columns:1fr;

}

.results-highlights{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:767px){

.results-section{

padding:70px 0;

}

.results-content{

padding:28px;

}

.results-content h3,

.results-content h4{

font-size:24px;

}

.results-content p{

font-size:15px;

}

.results-highlights{

grid-template-columns:1fr;

}

.impact-card{

padding:25px;

}

.impact-icon{

width:60px;

height:60px;

font-size:24px;

}

.impact-card h4{

font-size:20px;

}

.impact-card p{

font-size:14px;

}

}
/*==================================================
            TECHNOLOGY STACK
==================================================*/

.technology-section{

    position:relative;

    overflow:hidden;

    padding:110px 0;

    background:#F8FBFF;

}

.technology-section::before{

    content:"";

    position:absolute;

    top:-220px;

    left:-220px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(
        rgba(37,99,235,.06),
        transparent 72%
    );

}

.technology-section::after{

    content:"";

    position:absolute;

    bottom:-220px;

    right:-220px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(
        rgba(255,122,26,.05),
        transparent 72%
    );

}

/*=========================================
        WRAPPER
=========================================*/

.technology-wrapper{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:60px;

    align-items:center;

}

/*=========================================
        CONTENT
=========================================*/

.technology-content{

    background:#ffffff;

    padding:45px;

    border-radius:30px;

    box-shadow:

        0 25px 60px rgba(15,23,42,.06);

    border-left:6px solid #2563EB;

}

.technology-content h3{

    font-size:36px;

    font-weight:800;

    color:#081C3A;

    margin-bottom:22px;

    line-height:1.3;

}

.technology-content p{

    color:#64748B;

    font-size:16px;

    line-height:1.9;

    margin-bottom:35px;

}

/*=========================================
        BENEFITS
=========================================*/

.technology-benefits{

    margin:0;

    padding:0;

    list-style:none;

    display:grid;

    gap:18px;

}

.technology-benefits li{

    display:flex;

    align-items:center;

    gap:14px;

    color:#334155;

    font-weight:600;

    font-size:16px;

}

.technology-benefits i{

    width:38px;

    height:38px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#EFF6FF;

    color:#2563EB;

    font-size:16px;

}

/*=========================================
        GRID
=========================================*/

.technology-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:22px;

}

/*=========================================
        CARD
=========================================*/

.technology-card{

    position:relative;

    overflow:hidden;

    background:#ffffff;

    padding:30px 20px;

    text-align:center;

    border-radius:24px;

    transition:.35s;

    border:1px solid #EEF2F7;

    box-shadow:

        0 20px 50px rgba(15,23,42,.05);

}

.technology-card:hover{

    transform:translateY(-8px);

    border-color:#2563EB;

    box-shadow:

        0 35px 80px rgba(37,99,235,.12);

}

.technology-card::before{

    content:"";

    position:absolute;

    top:-55px;

    right:-55px;

    width:120px;

    height:120px;

    border-radius:50%;

    background:rgba(37,99,235,.04);

    transition:.35s;

}

.technology-card:hover::before{

    transform:scale(1.4);

}

/*=========================================
        ICON
=========================================*/

.technology-icon{

    width:75px;

    height:75px;

    margin:0 auto 22px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:22px;

    background:linear-gradient(

        135deg,

        #2563EB,

        #3B82F6

    );

    color:#ffffff;

    font-size:32px;

    transition:.35s;

    box-shadow:

        0 20px 45px rgba(37,99,235,.22);

}

.technology-card:hover .technology-icon{

    transform:rotate(-12deg) scale(1.1);

}

/*=========================================
        TITLE
=========================================*/

.technology-card h4{

    margin:0;

    font-size:18px;

    font-weight:700;

    color:#081C3A;

    word-break:break-word;

}

/*=========================================
        BADGE
=========================================*/

.technology-card::after{

    content:"Technology";

    position:absolute;

    top:18px;

    right:18px;

    padding:4px 10px;

    border-radius:30px;

    background:#EFF6FF;

    color:#2563EB;

    font-size:11px;

    font-weight:700;

    letter-spacing:.5px;

    text-transform:uppercase;

}

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

@media(max-width:1199px){

.technology-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:991px){

.technology-wrapper{

grid-template-columns:1fr;

gap:50px;

}

}

@media(max-width:767px){

.technology-section{

padding:70px 0;

}

.technology-content{

padding:30px;

}

.technology-content h3{

font-size:28px;

}

.technology-content p{

font-size:15px;

}

.technology-benefits li{

font-size:15px;

}

.technology-grid{

grid-template-columns:repeat(2,1fr);

gap:18px;

}

.technology-card{

padding:25px 15px;

}

.technology-icon{

width:60px;

height:60px;

font-size:24px;

margin-bottom:18px;

}

.technology-card h4{

font-size:16px;

}

}

@media(max-width:480px){

.technology-grid{

grid-template-columns:1fr;

}

}
/*=========================================
        CARD
=========================================*/

.technology-card{

    position:relative;

    overflow:hidden;

    display:flex;

    align-items:center;

    gap:18px;

    padding:22px 24px;

    border-radius:22px;

    background:#ffffff;

    border:1px solid #EEF2F7;

    transition:.35s;

    box-shadow:

        0 15px 40px rgba(15,23,42,.05);

}

.technology-card:hover{

    transform:translateY(-6px);

    border-color:#2563EB;

    box-shadow:

        0 25px 60px rgba(37,99,235,.12);

}

/* Left Accent */

.technology-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:5px;

    height:100%;

    background:linear-gradient(

        180deg,

        #2563EB,

        #3B82F6,

        #FF7A1A

    );

}

/*=========================================
        ICON
=========================================*/

.technology-icon{

    width:60px;

    height:60px;

    flex-shrink:0;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:18px;

    background:#F8FAFF;

    transition:.35s;

}

.technology-icon i{

    font-size:30px;

    color:#2563EB;

    transition:.35s;

}

.technology-card:hover .technology-icon{

    background:#2563EB;

}

.technology-card:hover .technology-icon i{

    color:#ffffff;

    transform:scale(1.15);

}

/*=========================================
        TITLE
=========================================*/

.technology-card h4{

    margin:0;

    font-size:20px;

    font-weight:700;

    color:#081C3A;

    line-height:1.4;

}/*==================================================
        RELATED CASE STUDIES
==================================================*/

.related-case-study-section{

    position:relative;

    overflow:hidden;

    padding:110px 0;

    background:#ffffff;

}

.related-case-study-section::before{

    content:"";

    position:absolute;

    left:-220px;

    top:-220px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(rgba(37,99,235,.05),transparent 72%);

}

.related-case-study-section::after{

    content:"";

    position:absolute;

    right:-220px;

    bottom:-220px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(rgba(255,122,26,.05),transparent 72%);

}

/*=========================================
        GRID
=========================================*/

.related-case-grid{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:35px;

}

/*=========================================
        CARD
=========================================*/

.related-case-card{

    position:relative;

    overflow:hidden;

    border-radius:26px;

    background:#ffffff;

    border:1px solid #EDF2F7;

    transition:.35s;

    box-shadow:

        0 18px 45px rgba(15,23,42,.06);

}

.related-case-card:hover{

    transform:translateY(-12px);

    border-color:#2563EB;

    box-shadow:

        0 35px 80px rgba(37,99,235,.12);

}

/*=========================================
        LINK
=========================================*/

.case-card-link{

    display:block;

    color:inherit;

    text-decoration:none;

}

/*=========================================
        IMAGE
=========================================*/

.case-image{

    position:relative;

    overflow:hidden;

    height:260px;

}

.case-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.6s;

}

.related-case-card:hover .case-image img{

    transform:scale(1.08);

}

/*=========================================
        OVERLAY
=========================================*/

.case-overlay{

    position:absolute;

    inset:0;

    display:flex;

    align-items:center;

    justify-content:center;

    background:linear-gradient(

        180deg,

        rgba(8,28,58,.15),

        rgba(37,99,235,.85)

    );

    opacity:0;

    transition:.35s;

}

.related-case-card:hover .case-overlay{

    opacity:1;

}

.case-overlay span{

    padding:12px 26px;

    border-radius:50px;

    background:#ffffff;

    color:#2563EB;

    font-size:14px;

    font-weight:700;

}

/*=========================================
        CONTENT
=========================================*/

.case-content{

    padding:30px;

}

/*=========================================
        META
=========================================*/

.case-meta{

    display:flex;

    flex-wrap:wrap;

    gap:10px;

    margin-bottom:18px;

}

.case-meta span{

    display:inline-flex;

    align-items:center;

    gap:8px;

    padding:8px 14px;

    border-radius:50px;

    background:#F8FAFF;

    color:#2563EB;

    font-size:13px;

    font-weight:600;

}

.case-meta i{

    font-size:12px;

}

/*=========================================
        TITLE
=========================================*/

.case-content h3{

    margin-bottom:15px;

    color:#081C3A;

    font-size:24px;

    font-weight:700;

    line-height:1.4;

    transition:.3s;

}

.related-case-card:hover h3{

    color:#2563EB;

}

.case-content p{

    color:#64748B;

    line-height:1.9;

    font-size:15px;

    margin-bottom:25px;

}

/*=========================================
        FOOTER
=========================================*/

.case-footer{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding-top:20px;

    border-top:1px solid #EEF2F7;

    font-weight:700;

    color:#2563EB;

}

.case-footer i{

    transition:.3s;

}

.related-case-card:hover .case-footer i{

    transform:translateX(6px);

}

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

@media(max-width:1199px){

.related-case-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:767px){

.related-case-study-section{

padding:70px 0;

}

.related-case-grid{

grid-template-columns:1fr;

gap:25px;

}

.case-image{

height:220px;

}

.case-content{

padding:22px;

}

.case-content h3{

font-size:20px;

}

.case-content p{

font-size:14px;

}

.case-footer{

font-size:14px;

}

}
.case-top-info{

    position:absolute;

    top:18px;

    left:18px;

    right:18px;

    display:flex;

    justify-content:space-between;

    z-index:2;

}

.case-top-info span{

    padding:8px 14px;

    border-radius:50px;

    background:rgba(255,255,255,.95);

    backdrop-filter:blur(10px);

    color:#081C3A;

    font-size:13px;

    font-weight:600;

}
/*==================================================
            CASE STUDY CTA
==================================================*/

.case-study-cta-section{

    position:relative;

    overflow:hidden;

    padding:110px 0;

    background:linear-gradient(
        135deg,
        #081C3A 0%,
        #103A75 45%,
        #2563EB 100%
    );

}

.case-study-cta-section::before{

    content:"";

    position:absolute;

    top:-220px;

    left:-220px;

    width:450px;

    height:450px;

    border-radius:50%;

    background:rgba(255,255,255,.04);

}

.case-study-cta-section::after{

    content:"";

    position:absolute;

    right:-180px;

    bottom:-180px;

    width:380px;

    height:380px;

    border-radius:50%;

    background:rgba(255,255,255,.03);

}

/*=========================================
        CTA BOX
=========================================*/

.case-study-cta{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:1.4fr .6fr;

    gap:60px;

    align-items:center;

    padding:70px;

    border-radius:35px;

    background:rgba(255,255,255,.06);

    backdrop-filter:blur(16px);

    border:1px solid rgba(255,255,255,.12);

    box-shadow:

        0 35px 80px rgba(0,0,0,.20);

}

/*=========================================
        CONTENT
=========================================*/

.cta-content{

    color:#ffffff;

}

.cta-content .section-badge{

    background:rgba(255,255,255,.10);

    border:1px solid rgba(255,255,255,.12);

    color:#FFD54A;

}

.cta-content .section-badge i{

    background:#FFD54A;

    color:#081C3A;

}

.cta-content h2{

    margin:25px 0;

    font-size:50px;

    line-height:1.2;

    font-weight:800;

    color:#ffffff;

}

.cta-content p{

    font-size:17px;

    line-height:1.9;

    color:rgba(255,255,255,.85);

    margin-bottom:35px;

}

/*=========================================
        FEATURES
=========================================*/

.cta-features{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:18px;

    margin-bottom:40px;

}

.cta-feature{

    display:flex;

    align-items:center;

    gap:12px;

    padding:14px 18px;

    border-radius:16px;

    background:rgba(255,255,255,.08);

}

.cta-feature i{

    color:#4ADE80;

    font-size:18px;

}

.cta-feature span{

    color:#ffffff;

    font-weight:600;

    font-size:15px;

}

/*=========================================
        BUTTONS
=========================================*/

.cta-buttons{

    display:flex;

    flex-wrap:wrap;

    gap:18px;

}

.cta-buttons .theme-btn{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:16px 34px;

    border-radius:60px;

    background:#ffffff;

    color:#2563EB;

    font-weight:700;

    text-decoration:none;

    transition:.35s;

}

.cta-buttons .theme-btn:hover{

    transform:translateY(-5px);

    background:#FFD54A;

    color:#081C3A;

}

.cta-buttons .secondary-btn{

    background:transparent;

    border:2px solid rgba(255,255,255,.25);

    color:#ffffff;

}

.cta-buttons .secondary-btn:hover{

    background:#ffffff;

    color:#2563EB;

}

/*=========================================
        STATS
=========================================*/

.cta-stats{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:22px;

}

.cta-stat-card{

    text-align:center;

    padding:35px 20px;

    border-radius:24px;

    background:rgba(255,255,255,.08);

    transition:.35s;

}

.cta-stat-card:hover{

    transform:translateY(-8px);

    background:rgba(255,255,255,.15);

}

.cta-stat-card h3{

    margin-bottom:12px;

    font-size:42px;

    font-weight:800;

    color:#FFD54A;

    line-height:1;

}

.cta-stat-card span{

    display:block;

    color:#ffffff;

    font-size:15px;

    line-height:1.6;

}

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

@media(max-width:1199px){

.case-study-cta{

padding:55px;

}

.cta-content h2{

font-size:42px;

}

}

@media(max-width:991px){

.case-study-cta{

grid-template-columns:1fr;

gap:50px;

}

.cta-content{

text-align:center;

}

.cta-features{

grid-template-columns:repeat(2,1fr);

}

.cta-buttons{

justify-content:center;

}

}

@media(max-width:767px){

.case-study-cta-section{

padding:70px 0;

}

.case-study-cta{

padding:35px 25px;

}

.cta-content h2{

font-size:30px;

}

.cta-content p{

font-size:15px;

}

.cta-features{

grid-template-columns:1fr;

}

.cta-buttons{

flex-direction:column;

}

.cta-buttons .theme-btn{

width:100%;

justify-content:center;

}

.cta-stats{

grid-template-columns:1fr 1fr;

gap:15px;

}

.cta-stat-card{

padding:25px 15px;

}

.cta-stat-card h3{

font-size:32px;

}

.cta-stat-card span{

font-size:13px;

}

}

@media(max-width:480px){

.cta-stats{

grid-template-columns:1fr;

}

}