*{
    box-sizing:border-box;
}

body{
    margin:0;
    font-family:'Inter',sans-serif;
    background:#06111d;
}
.cm-simple-header,
.cm-simple-header *{
    box-sizing:border-box;
}

.cm-simple-header{
    width:100%;
    position:relative;
    z-index:999;

    font-family:'Inter',sans-serif;

    background:
        radial-gradient(
            circle at 70% 50%,
            rgba(0,121,255,.08),
            transparent 35%
        ),
        linear-gradient(
            180deg,
            #061526 0%,
            #04101d 100%
        );

    border-top:
        1px solid rgba(0,151,255,.25);

    border-bottom:
        1px solid rgba(0,151,255,.45);

    box-shadow:
        0 8px 28px rgba(0,0,0,.20);
}

.cm-simple-header-inner{
    width:100%;
    max-width:1500px;

    min-height:78px;

    margin:0 auto;

    padding:11px 38px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:30px;
}


/* =========================
   LOGO
========================= */

.cm-simple-logo{
    display:flex;
    align-items:center;

    text-decoration:none;
}

.cm-simple-logo img{
    display:block;

    width:auto;
    height:52px;

    max-width:230px;

    object-fit:contain;
}


/* =========================
   RIGHT ACTIONS
========================= */

.cm-simple-actions{
    display:flex;
    align-items:center;

    gap:12px;
}

.cm-simple-btn{
    min-height:46px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    gap:9px;

    padding:0 20px;

    border-radius:50px;

    color:#fff;

    text-decoration:none;

    font-size:13px;
    font-weight:700;

    white-space:nowrap;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}


/* CONSULTATION */

.cm-simple-consult{
    border:
        1px solid
        rgba(0,168,255,.9);

    background:
        linear-gradient(
            135deg,
            #0ab7ff,
            #1265ff
        );

    box-shadow:
        0 8px 22px
        rgba(0,113,255,.24);
}

.cm-simple-consult:hover{
    transform:translateY(-2px);

    box-shadow:
        0 12px 28px
        rgba(0,130,255,.34);
}


/* WHATSAPP */

.cm-simple-whatsapp{
    border:
        1px solid
        rgba(40,225,116,.75);

    background:
        linear-gradient(
            135deg,
            rgba(10,61,41,.75),
            rgba(4,30,24,.95)
        );

    box-shadow:
        0 8px 20px
        rgba(0,180,90,.10);
}

.cm-simple-whatsapp:hover{
    transform:translateY(-2px);

    border-color:#2ee27c;

    box-shadow:
        0 10px 25px
        rgba(0,190,95,.16);
}


/* ICON */

.cm-simple-icon{
    width:22px;
    height:22px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:6px;

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

    font-size:10px;
}

.cm-simple-wa{
    width:22px;
    height:22px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    color:#38ee84;

    border:
        1px solid
        #38ee84;

    font-size:9px;
}

.cm-simple-arrow{
    font-size:17px;

    transition:
        transform .3s ease;
}

.cm-simple-consult:hover
.cm-simple-arrow{
    transform:translateX(3px);
}


/* =========================
   TABLET
========================= */

@media(max-width:850px){

    .cm-simple-header-inner{
        min-height:70px;

        padding:9px 24px;
    }

    .cm-simple-logo img{
        height:46px;

        max-width:190px;
    }

    .cm-simple-btn{
        min-height:42px;

        padding:0 15px;

        font-size:11px;
    }

}


/* =========================
   MOBILE
========================= */

@media(max-width:600px){

    .cm-simple-header-inner{
        min-height:64px;

        padding:8px 14px;

        gap:10px;
    }

    .cm-simple-logo img{
        height:38px;

        max-width:110px;
    }

    .cm-simple-actions{
        gap:6px;
    }

    .cm-simple-btn{
        min-height:36px;

        padding:0 9px;

        border-radius:30px;

        font-size:9px;

        gap:5px;
    }

    .cm-simple-icon,
    .cm-simple-wa{
        display:none;
    }

    .cm-simple-arrow{
        font-size:13px;
    }

}


/* =========================
   SMALL MOBILE
========================= */

@media(max-width:420px){

    .cm-simple-header-inner{
        padding:7px 10px;
    }

    .cm-simple-logo img{
        height:34px;

        max-width:90px;
    }

    .cm-simple-btn{
        min-height:34px;

        padding:0 8px;

        font-size:8px;
    }

    .cm-simple-arrow{
        display:none;
    }

}
/* HERO SECTION */

.chauhan-hero,
.chauhan-hero *{
    box-sizing:border-box;
}

.chauhan-hero{
    position:relative;

    width:100%;
    overflow:hidden;

    font-family:'Inter',sans-serif;

    color:#fff;

    background-image:
        url("image/hero-banner.png");

    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}


/* OVERLAY */

.chauhan-hero-overlay{
    position:absolute;

    inset:0;

    z-index:1;

    background:
        linear-gradient(
            90deg,
            rgba(3,15,26,.93) 0%,
            rgba(3,15,26,.82) 40%,
            rgba(3,15,26,.60) 65%,
            rgba(3,15,26,.68) 100%
        );
}


/* MAIN CONTAINER */

.chauhan-hero-container{
    position:relative;
    z-index:2;

    width:100%;
    max-width:1500px;

    min-height:520px;

    margin:0 auto;

    padding:45px 50px;

    display:grid;

    grid-template-columns:
        minmax(0,1.05fr)
        minmax(430px,.95fr);

    align-items:center;

    gap:60px;
}


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

.chauhan-hero-left{
    width:100%;
    max-width:670px;
}


.chauhan-small-title{
    margin-bottom:13px;

    color:#0bc4ff;

    font-size:12px;
    line-height:1.3;

    font-weight:800;

    letter-spacing:1.3px;

    text-transform:uppercase;
}


.chauhan-main-title{
    margin:0;

    color:#fff;

    font-size:42px;
    line-height:1.06;

    font-weight:800;

    letter-spacing:-1.5px;
}


.chauhan-main-title span{
    color:#0aafff;
}


.chauhan-subtitle{
    max-width:610px;

    margin-top:17px;

    color:#fff;

    font-size:16px;
    line-height:1.45;

    font-weight:700;
}


.chauhan-description{
    max-width:610px;

    margin:14px 0 0;

    color:#aebdca;

    font-size:15px;
    line-height:1.65;
}


/* BUTTONS */

.chauhan-buttons{
    display:flex;
    align-items:center;

    gap:12px;

    margin-top:23px;
}


.chauhan-btn{
    min-height:46px;

    padding:0 21px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    gap:9px;

    border-radius:50px;

    color:#fff;

    text-decoration:none;

    font-size:12px;
    font-weight:700;

    transition:.3s ease;
}


.chauhan-btn-primary{
    background:
        linear-gradient(
            135deg,
            #08aeff,
            #0766ff
        );

    box-shadow:
        0 10px 25px
        rgba(0,106,255,.25);
}


.chauhan-btn-whatsapp{
    border:
        1px solid
        rgba(255,255,255,.52);

    background:
        rgba(3,13,23,.55);
}


.chauhan-btn:hover{
    transform:translateY(-2px);
}


/* BENEFITS */

.chauhan-benefits{
    display:flex;
    align-items:center;

    gap:24px;

    margin-top:25px;
}


.chauhan-benefit{
    display:flex;
    align-items:center;

    gap:8px;

    color:#d2dde6;

    font-size:12px;

    white-space:nowrap;
}


.chauhan-benefit-icon{
    width:27px;
    height:27px;

    flex:0 0 27px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    color:#10bcff;

    border:
        1px solid
        rgba(0,166,255,.42);

    background:
        rgba(0,125,255,.08);
}


/* =====================================
   RIGHT SIDE
===================================== */

.chauhan-hero-right{
    width:100%;

    display:flex;
    align-items:center;
    justify-content:center;
}


/* =====================================
   FORM
===================================== */

.hero-contact-form{
    width:100%;
    max-width:500px;

    padding:22px;

    border:
        1px solid
        rgba(0,164,255,.75);

    border-radius:16px;

    background:
        linear-gradient(
            145deg,
            rgba(5,27,45,.97),
            rgba(2,15,27,.98)
        );

    box-shadow:
        0 20px 45px rgba(0,0,0,.35),
        0 0 25px rgba(0,126,255,.07),
        inset 0 1px 0 rgba(255,255,255,.045);

    backdrop-filter:blur(12px);
}


/* FORM HEAD */

.hero-form-head{
    margin-bottom:14px;
}


.hero-form-head h3{
    margin:0;

    color:#fff;

    font-size:20px;
    line-height:1.2;

    font-weight:800;
}


.hero-form-head p{
    margin:4px 0 0;

    color:#91a6b7;

    font-size:10px;
    line-height:1.4;
}


/* ROW */

.hero-form-row{
    display:grid;

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

    gap:10px;
}


/* FIELD */

.hero-field{
    margin-bottom:10px;
}


.hero-field label{
    display:block;

    margin-bottom:5px;

    color:#fff;

    font-size:9px;
    line-height:1.2;

    font-weight:700;
}


.hero-field input,
.hero-field select,
.hero-field textarea{
    display:block;

    width:100%;

    margin:0;

    border:
        1px solid
        rgba(91,147,185,.55);

    border-radius:6px;

    outline:none;

    color:#e9f1f7;

    background:#0b293d;

    font-family:'Inter',sans-serif;

    font-size:10px;

    transition:.25s ease;
}


.hero-field input{
    height:37px;

    padding:0 11px;
}


.hero-field select{
    height:37px;

    padding:0 11px;

    cursor:pointer;
}


.hero-field textarea{
    height:75px;

    padding:10px 11px;

    resize:none;
}


.hero-field input::placeholder,
.hero-field textarea::placeholder{
    color:#6a8294;
}


.hero-field input:focus,
.hero-field select:focus,
.hero-field textarea:focus{
    border-color:#0abaff;

    background:#0b2e45;

    box-shadow:
        0 0 0 2px
        rgba(0,174,255,.07);
}


/* SUBMIT */

.hero-form-btn{
    min-height:38px;

    padding:0 17px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    gap:8px;

    border:0;

    border-radius:50px;

    color:#fff;

    background:
        linear-gradient(
            135deg,
            #08b7ff,
            #1769ff
        );

    font-family:'Inter',sans-serif;

    font-size:10px;
    font-weight:700;

    cursor:pointer;

    box-shadow:
        0 8px 20px
        rgba(0,105,255,.25);

    transition:.3s ease;
}


.hero-form-btn:hover{
    transform:translateY(-2px);
}


.hero-form-note{
    margin-top:8px;

    color:#718699;

    font-size:7px;
}


/* =====================================
   1200px
===================================== */

@media(max-width:1200px){

    .chauhan-hero-container{
        padding:40px;

        grid-template-columns:
            minmax(0,1fr)
            minmax(400px,.9fr);

        gap:35px;
    }


    .chauhan-main-title{
        font-size:38px;
    }

}


/* =====================================
   TABLET
===================================== */

@media(max-width:900px){

    .chauhan-hero-overlay{
        background:
            rgba(3,14,25,.83);
    }


    .chauhan-hero-container{
        min-height:auto;

        padding:40px 35px;

        grid-template-columns:1fr;

        gap:35px;
    }


    .chauhan-hero-left{
        max-width:700px;

        margin:0 auto;

        text-align:center;
    }


    .chauhan-subtitle,
    .chauhan-description{
        margin-left:auto;
        margin-right:auto;
    }


    .chauhan-buttons,
    .chauhan-benefits{
        justify-content:center;
    }


    .hero-contact-form{
        max-width:650px;

        margin:0 auto;
    }

}


/* =====================================
   MOBILE
===================================== */

@media(max-width:600px){

    .chauhan-hero-container{
        padding:32px 20px;

        gap:28px;
    }


    .chauhan-main-title{
        font-size:30px;

        line-height:1.12;
    }


    .chauhan-subtitle{
        font-size:15px;
    }


    .chauhan-description{
        font-size:14px;
    }


    .chauhan-buttons{
        flex-direction:column;
    }


    .chauhan-btn{
        width:100%;
    }


    .chauhan-benefits{
        display:grid;

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

        gap:12px;
    }


    .chauhan-benefit{
        white-space:normal;
    }


    .hero-contact-form{
        max-width:100%;

        padding:18px 15px;
    }


    .hero-form-row{
        grid-template-columns:1fr;
    }


    .hero-form-head h3{
        font-size:19px;
    }


    .hero-field input,
    .hero-field select{
        height:40px;

        font-size:11px;
    }


    .hero-field textarea{
        height:85px;

        font-size:11px;
    }


    .hero-form-btn{
        width:100%;

        min-height:42px;

        font-size:11px;
    }

}

/* ...................... */

 .cms-challenge-section{
    width:100%;
    position:relative;
    overflow:hidden;
    font-family:'Inter',sans-serif;
    color:#fff;

    background:
        linear-gradient(
            rgba(3,16,28,.86),
            rgba(3,16,28,.92)
        ),
        url("image/sc_banner.png");

    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

.cms-challenge-inner{
    max-width:1600px;

    margin:0 auto;

    padding:50px;
}

.cms-heading{
    max-width:760px;

    margin:0 auto;

    text-align:center;
}


.cms-tag{
    margin-bottom:10px;

    color:#18bdff;

    font-size:14px;

    line-height:1.3;

    font-weight:700;

    letter-spacing:1.4px;

    text-transform:uppercase;
}


.cms-heading h2{
    margin:0;

    font-size:46px;

    line-height:1.08;

    font-weight:800;

    letter-spacing:-1.5px;

    color:#fff;
}


.cms-heading h2 span{
    display:block;

    color:#14baff;
}


.cms-heading p{
    max-width:720px;

    margin:15px auto 0;

    font-size:17px;

    line-height:1.65;

    color:#aebcca;
}

.cms-flow-grid{
    max-width:1200px;

    margin:32px auto 0;

    display:grid;

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

    gap:8px;

    perspective:1200px;
}

.cms-flow-item{
    position:relative;

    display:flex;

    flex-direction:column;

    align-items:center;
}

.cms-card{
    position:relative;

    width:100%;

    min-height:125px;

    padding:9px 7px 10px;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    gap:5px;

    text-align:center;

    border-radius:7px;

    background:
        linear-gradient(
            145deg,
            #10283c 0%,
            #081a29 55%,
            #05121d 100%
        );

    border:
        1px solid
        rgba(52,118,168,.38);

    transform:
        perspective(800px)
        rotateX(3deg);

    transform-style:
        preserve-3d;

    box-shadow:
        0 5px 0 #030d16,
        0 11px 20px rgba(0,0,0,.32),
        inset 0 1px 0 rgba(255,255,255,.08),
        inset 0 -15px 20px rgba(0,0,0,.08);

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease;
}


.cms-card::before{
    content:"";

    position:absolute;

    left:2px;
    right:2px;
    top:1px;

    height:45%;

    border-radius:
        6px 6px 18px 18px;

    background:
        linear-gradient(
            180deg,
            rgba(79,180,255,.09),
            transparent
        );

    pointer-events:none;
}


.cms-card:hover{
    transform:
        perspective(800px)
        rotateX(-5deg)
        translateY(-5px);

    border-color:
        rgba(11,172,255,.7);

    box-shadow:
        0 6px 0 #030d16,
        0 18px 30px rgba(0,110,255,.18),
        inset 0 1px 0 rgba(255,255,255,.1);
}

.cms-icon-wrap{
    width:44px;

    height:44px;

    position:relative;

    display:flex;

    align-items:center;

    justify-content:center;

    transform:
        translateZ(18px);
}


.cms-3d-icon{
    display:block;

    width:44px;

    height:44px;

    object-fit:contain;

    object-position:center;

    filter:
        drop-shadow(
            0 8px 9px
            rgba(0,0,0,.25)
        );

    transition:
        transform .35s ease;
}


.cms-card:hover
.cms-3d-icon{
    transform:
        translateY(-3px)
        scale(1.07);
}



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

.cms-card-title{
    position:relative;

    z-index:2;

    color:#f3f7fb;

    font-size:16px;

    line-height:1.24;

    font-weight:600;

    transform:
        translateZ(10px);
}

.cms-connector{
    width:100%;

    height:32px;

    position:relative;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:flex-end;
}


.cms-connector span{
    display:block;

    width:1px;

    height:20px;

    background:
        linear-gradient(
            180deg,
            rgba(0,132,255,.15),
            rgba(0,177,255,.95)
        );

    box-shadow:
        0 0 7px
        rgba(0,169,255,.5);
}


.cms-up-arrow{
    margin-top:-3px;

    color:#18bfff;

    font-size:11px;

    line-height:10px;

    text-shadow:
        0 0 8px
        rgba(0,169,255,.75);

    animation:
        cmsUpArrow
        1.6s
        ease-in-out
        infinite;
}



/* stagger animation */

.cms-flow-item:nth-child(2)
.cms-up-arrow{
    animation-delay:.15s;
}

.cms-flow-item:nth-child(3)
.cms-up-arrow{
    animation-delay:.30s;
}

.cms-flow-item:nth-child(4)
.cms-up-arrow{
    animation-delay:.45s;
}

.cms-flow-item:nth-child(5)
.cms-up-arrow{
    animation-delay:.60s;
}

.cms-flow-item:nth-child(6)
.cms-up-arrow{
    animation-delay:.75s;
}



/* ========================================
   RESULT
======================================== */

.cms-result{
    max-width:660px;

    margin:0 auto;

    perspective:900px;
}


.cms-result-bar{
    position:relative;

    min-height:38px;

    padding:
        0 45px
        0 18px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:30px;

    overflow:hidden;

    background:
        linear-gradient(
            180deg,
            rgba(5,89,166,.8),
            rgba(3,47,88,.95)
        );

    border:
        1px solid
        rgba(0,167,255,.9);

    transform:
        perspective(800px)
        rotateX(-2deg);

    box-shadow:
        0 4px 0 #03182b,
        0 8px 22px rgba(0,104,255,.17),
        inset 0 1px 0 rgba(255,255,255,.12),
        inset 0 -8px 16px rgba(0,0,0,.13);
}


.cms-result-bar::before{
    content:"";

    position:absolute;

    left:-180px;
    top:0;

    width:150px;

    height:100%;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(103,210,255,.13),
            transparent
        );

    transform:
        skewX(-22deg);

    animation:
        cmsBarShine
        5s
        linear
        infinite;
}


.cms-result-bar span{
    position:relative;

    z-index:2;

    color:#f2f8fd;

    font-size:15px;

    line-height:1.3;

    font-weight:600;

    text-align:center;
}



/* circle arrow */

.cms-result-arrow{
    position:absolute;

    z-index:3;

    right:4px;

    top:50%;

    transform:
        translateY(-50%);

    width:30px;

    height:30px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    color:white;

    font-size:17px;

    background:
        linear-gradient(
            145deg,
            #16baff,
            #0871ff
        );

    box-shadow:
        0 3px 7px rgba(0,0,0,.3),
        0 0 13px rgba(0,150,255,.35);

    animation:
        cmsResultArrow
        1.8s
        ease-in-out
        infinite;
}



/* ========================================
   ANIMATIONS
======================================== */

@keyframes cmsUpArrow{

    0%,
    100%{
        transform:
            translateY(2px);

        opacity:.65;
    }

    50%{
        transform:
            translateY(-3px);

        opacity:1;
    }

}


@keyframes cmsResultArrow{

    0%,
    100%{
        margin-right:0;
    }

    50%{
        margin-right:-3px;
    }

}


@keyframes cmsBarShine{

    from{
        left:-180px;
    }

    to{
        left:110%;
    }

}



/* ========================================
   1200 PX
======================================== */

@media(max-width:1200px){

    .cms-challenge-inner{
        padding:50px;
    }


    .cms-heading h2{
        font-size:40px;
    }


    .cms-heading p{
        font-size:17px;
    }


    .cms-flow-grid{
        max-width:1000px;
    }

}



/* ========================================
   TABLET
======================================== */

@media(max-width:900px){

    .cms-challenge-inner{
        padding:35px;
    }


    .cms-heading h2{
        font-size:38px;
    }


    .cms-flow-grid{
        max-width:700px;

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

        gap:
            12px 10px;
    }


    .cms-result{
        max-width:560px;
    }

}



/* ========================================
   MOBILE
======================================== */

@media(max-width:600px){

    .cms-challenge-inner{
        padding:
            35px 20px;
    }


    .cms-tag{
        font-size:13px;
    }


    .cms-heading h2{
        font-size:30px;

        line-height:1.12;
    }


    .cms-heading p{
        font-size:16px;

        line-height:1.6;
    }


    .cms-flow-grid{
        max-width:100%;

        margin-top:27px;

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

        gap:10px;
    }


    .cms-card{
        min-height:150px;
    }


    .cms-icon-wrap{
        width:48px;

        height:48px;
    }


    .cms-3d-icon{
        width:48px;

        height:48px;
    }


    .cms-card-title{
        font-size:15px;
    }


    .cms-connector{
        height:29px;
    }


    .cms-connector span{
        height:17px;
    }


    .cms-result{
        max-width:100%;
    }


    .cms-result-bar{
        min-height:42px;

        padding:
            7px 44px
            7px 14px;
    }


    .cms-result-bar span{
        font-size:14px;
    }

}



/* ========================================
   SMALL MOBILE
======================================== */

@media(max-width:400px){

    .cms-heading h2{
        font-size:27px;
    }


    .cms-card-title{
        font-size:15px;
    }


    .cms-result-bar span{
        font-size:14px;
    }

}
/* ========================================
   SECTION
======================================== */

.mis-core-services{
    width:100%;
    overflow:hidden;

    font-family:'Inter',sans-serif;

    color:#fff;

    background:
        radial-gradient(
            circle at 12% 20%,
            rgba(0,126,255,.08),
            transparent 30%
        ),
        radial-gradient(
            circle at 88% 75%,
            rgba(0,126,255,.05),
            transparent 32%
        ),
        linear-gradient(
            180deg,
            #071521 0%,
            #06111d 100%
        );
}


.mis-core-inner{
    max-width:1600px;
    margin:0 auto;

    padding:50px;
}


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

.mis-core-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;

    gap:30px;

    margin-bottom:22px;
}


.mis-core-tag{
    display:flex;
    align-items:center;

    gap:6px;

    margin-bottom:7px;

    color:#19bdff;

    font-size:14px;
    font-weight:700;

    letter-spacing:1.1px;

    text-transform:uppercase;
}


.mis-core-tag span{
    width:27px;
    height:27px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    border:1px solid #19bdff;

    font-size:11px;
}


.mis-core-head h2{
    margin:0;

    color:#fff;

    font-size:34px;
    line-height:1.15;

    font-weight:800;

    letter-spacing:-1px;
}


.mis-core-head-text{
    margin:0 0 5px;

    color:#aebbc8;

    font-size:14px;
    line-height:1.45;
}


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

.mis-core-grid{
    display:grid;

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

    gap:20px;

    align-items:stretch;

    perspective:1400px;
}


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

.mis-core-card{
    min-width:0;

    display:flex;
    flex-direction:column;

    padding:
        14px 18px
        14px;

    border-radius:22px;

    overflow:hidden;

    transform-style:preserve-3d;

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease;
}


/* ========================================
   BLUE
======================================== */

.card-blue{
    border:
        1px solid
        rgba(37,145,255,.62);

    background:
        radial-gradient(
            ellipse at 50% 0%,
            rgba(36,134,255,.42),
            transparent 48%
        ),
        linear-gradient(
            155deg,
            #153657 0%,
            #0b2137 55%,
            #071521 100%
        );

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.08),
        0 14px 28px rgba(0,0,0,.22);
}


/* ========================================
   PURPLE
======================================== */

.card-purple{
    border:
        1px solid
        rgba(126,83,255,.66);

    background:
        radial-gradient(
            ellipse at 50% 0%,
            rgba(116,73,255,.45),
            transparent 48%
        ),
        linear-gradient(
            155deg,
            #29205a 0%,
            #181731 55%,
            #091522 100%
        );

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.08),
        0 14px 28px rgba(0,0,0,.22);
}


/* ========================================
   ORANGE
======================================== */

.card-orange{
    border:
        1px solid
        rgba(255,147,56,.67);

    background:
        radial-gradient(
            ellipse at 50% 0%,
            rgba(255,137,40,.42),
            transparent 48%
        ),
        linear-gradient(
            155deg,
            #472f1e 0%,
            #281e18 55%,
            #0d161d 100%
        );

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.08),
        0 14px 28px rgba(0,0,0,.22);
}


/* ========================================
   GREEN
======================================== */

.card-green{
    border:
        1px solid
        rgba(35,210,150,.64);

    background:
        radial-gradient(
            ellipse at 50% 0%,
            rgba(21,200,140,.40),
            transparent 48%
        ),
        linear-gradient(
            155deg,
            #174139 0%,
            #112b26 55%,
            #081720 100%
        );

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.08),
        0 14px 28px rgba(0,0,0,.22);
}

.mis-core-image-box{
    width:100%;

    height:115px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:
        0 5px 4px;

    margin-bottom:4px;

    overflow:hidden;
}
.mis-core-image{
    display:block;

    width:100%;

    max-width:250px;

    height:250px;

    object-fit:contain;

    object-position:center;

    filter:
        drop-shadow(
            0 12px 14px
            rgba(0,0,0,.35)
        );

    animation:
        misCoreFloat
        4s
        ease-in-out
        infinite;
}


.mis-core-card:nth-child(2)
.mis-core-image{
    animation-delay:.4s;
}


.mis-core-card:nth-child(3)
.mis-core-image{
    animation-delay:.8s;
}


.mis-core-card:nth-child(4)
.mis-core-image{
    animation-delay:1.2s;
}


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

.mis-core-content{
    flex:0 0 auto;

    padding:
        0 2px;
}


.mis-core-content h3{
    margin:
        0 0 6px;

    color:#fff;

    font-size:18px;

    line-height:1.15;

    font-weight:800;

    letter-spacing:-.25px;
}


.mis-core-content p{
    margin:0;

    color:#c3cdd6;

    font-size:13px;

    line-height:1.42;
}


/* ========================================
   BOTTOM
======================================== */

.mis-core-bottom{
    margin-top:14px;

    display:flex;

    align-items:flex-end;

    justify-content:space-between;

    gap:12px;
}


.mis-core-bottom a{
    display:inline-flex;

    align-items:center;

    gap:7px;

    text-decoration:none;

    font-size:13px;

    line-height:1;

    font-weight:700;

    transition:gap .3s ease;
}


.mis-core-bottom a:hover{
    gap:11px;
}


.card-blue .mis-core-bottom a{
    color:#20c4ff;
}


.card-purple .mis-core-bottom a{
    color:#aa8cff;
}


.card-orange .mis-core-bottom a{
    color:#ffad55;
}


.card-green .mis-core-bottom a{
    color:#4ee5b2;
}


/* NUMBER */

.mis-core-number{
    flex:0 0 auto;

    font-size:22px;

    line-height:.9;

    font-weight:700;

    opacity:.8;
}


.card-blue .mis-core-number{
    color:#5aaaff;
}


.card-purple .mis-core-number{
    color:#9c7dff;
}


.card-orange .mis-core-number{
    color:#ffa44c;
}


.card-green .mis-core-number{
    color:#41daa6;
}


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

.mis-core-card:hover{
    transform:
        perspective(1100px)
        rotateX(-3deg)
        translateY(-6px);
}


.card-blue:hover{
    box-shadow:
        0 22px 36px
        rgba(0,110,255,.16);
}


.card-purple:hover{
    box-shadow:
        0 22px 36px
        rgba(112,67,255,.16);
}


.card-orange:hover{
    box-shadow:
        0 22px 36px
        rgba(255,125,28,.15);
}


.card-green:hover{
    box-shadow:
        0 22px 36px
        rgba(19,200,140,.15);
}


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

@keyframes misCoreFloat{

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

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


@media(max-width:1200px){

    .mis-core-inner{
        padding:45px 35px;
    }


    .mis-core-head h2{
        font-size:32px;
    }


    .mis-core-grid{
        gap:15px;
    }


    .mis-core-card{
        padding:
            13px 15px
            13px;
    }


    .mis-core-image-box{
        height:110px;
    }


    .mis-core-image{
        max-width:250px;

        height:250px;
    }


    .mis-core-content h3{
        font-size:17px;
    }

}

@media(max-width:900px){

    .mis-core-inner{
        padding:35px;
    }


    .mis-core-head{
        flex-direction:column;

        align-items:flex-start;

        gap:7px;
    }


    .mis-core-head h2{
        font-size:30px;
    }


    .mis-core-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:16px;
    }


    .mis-core-image-box{
        height:125px;
    }


    .mis-core-image{
        max-width:250px;

        height:250px;
    }

}

@media(max-width:600px){

    .mis-core-inner{
        padding:
            35px 20px;
    }


    .mis-core-tag{
        font-size:13px;
    }


    .mis-core-head h2{
        font-size:30px;

        line-height:1.18;
    }


    .mis-core-head-text{
        font-size:14px;
    }


    .mis-core-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:10px;
    }


    .mis-core-card{
        padding:
            10px 11px
            11px;

        border-radius:15px;
    }


    .mis-core-image-box{
        height:92px;

        margin-bottom:3px;
    }


    .mis-core-image{
        width:100%;

        max-width:200px;

        height:200px;
    }


    .mis-core-content h3{
        font-size:15px;

        line-height:1.18;
    }


    .mis-core-content p{
        font-size:12px;

        line-height:1.4;
    }


    .mis-core-bottom{
        margin-top:11px;

        gap:6px;
    }


    .mis-core-bottom a{
        font-size:12px;
    }


    .mis-core-number{
        font-size:18px;
    }

}

@media(max-width:400px){

    .mis-core-grid{
        grid-template-columns:1fr;
    }


    .mis-core-image-box{
        height:120px;
    }


    .mis-core-image{
        max-width:225px;

        height:225px;
    }

}
.mis-faq-section{
    width:100%;
    overflow:hidden;

    font-family:'Inter',sans-serif;
    color:#fff;

    background:
        radial-gradient(
            circle at 12% 25%,
            rgba(0,130,255,.08),
            transparent 30%
        ),
        radial-gradient(
            circle at 90% 60%,
            rgba(0,115,255,.05),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #071521 0%,
            #06111d 100%
        );
}


.mis-faq-inner{
    max-width:1600px;
    margin:0 auto;

    padding:50px;

    display:grid;
    grid-template-columns:34% 66%;

    gap:50px;

    align-items:start;
}


.mis-faq-left{
    padding-top:3px;
}


.mis-faq-tag{
    margin-bottom:10px;

    color:#18bdff;

    font-size:14px;
    font-weight:700;

    letter-spacing:1.2px;

    text-transform:uppercase;
}


.mis-faq-left h2{
    margin:0;

    color:#fff;

    font-size:46px;
    line-height:1.05;

    font-weight:800;

    letter-spacing:-1.7px;
}


.mis-faq-left p{
    max-width:390px;

    margin:16px 0 0;

    color:#aebbc8;

    font-size:17px;
    line-height:1.6;
}


.mis-faq-btn{
    margin-top:24px;

    min-height:48px;

    padding:0 22px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    gap:10px;

    border-radius:50px;

    color:#fff;

    background:
        linear-gradient(
            135deg,
            #0aa1ff,
            #0666ff
        );

    text-decoration:none;

    font-size:14px;
    font-weight:700;

    box-shadow:
        0 10px 26px
        rgba(0,111,255,.28);

    transition:.3s ease;
}


.mis-faq-btn:hover{
    transform:translateY(-3px);

    box-shadow:
        0 15px 34px
        rgba(0,120,255,.38);
}


.mis-faq-accordion{
    display:flex;
    flex-direction:column;

    gap:9px;
}


/* ITEM */

.mis-faq-item{
    overflow:hidden;

    border-radius:10px;

    border:
        1px solid
        rgba(47,106,151,.28);

    background:
        linear-gradient(
            145deg,
            rgba(12,31,47,.96),
            rgba(6,18,29,.98)
        );

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.03);

    transition:
        border-color .3s ease,
        box-shadow .3s ease;
}


.mis-faq-item.active{
    border-color:
        rgba(0,156,255,.48);

    box-shadow:
        0 10px 28px
        rgba(0,97,180,.08),
        inset 0 1px 0
        rgba(255,255,255,.04);
}


/* QUESTION */

.mis-faq-question{
    width:100%;

    min-height:52px;

    padding:
        0 15px 0 18px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:20px;

    border:0;
    outline:0;

    background:transparent;

    color:#eef5fb;

    font-family:'Inter',sans-serif;

    font-size:14px;
    line-height:1.4;

    font-weight:600;

    text-align:left;

    cursor:pointer;
}


.mis-faq-question > span:first-child{
    flex:1;
}


/* PLUS / MINUS */

.mis-faq-icon{
    width:26px;
    height:26px;

    flex:0 0 26px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    color:#20bfff;

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

    border:
        1px solid
        rgba(0,159,255,.25);

    font-size:16px;
    font-weight:500;

    line-height:1;

    transition:
        transform .3s ease,
        background .3s ease;
}


.mis-faq-item.active
.mis-faq-icon{
    background:
        rgba(0,151,255,.13);

    transform:rotate(180deg);
}


/* =========================================
   ANSWER
========================================= */

.mis-faq-answer{
    display:grid;

    grid-template-rows:0fr;

    transition:
        grid-template-rows .38s ease;
}


.mis-faq-item.active
.mis-faq-answer{
    grid-template-rows:1fr;
}


.mis-faq-answer-inner{
    overflow:hidden;

    padding:
        0 52px 0 18px;

    color:#aebbc8;

    font-size:13px;
    line-height:1.6;

    opacity:0;

    transform:translateY(-5px);

    transition:
        opacity .3s ease,
        transform .3s ease,
        padding .3s ease;
}


.mis-faq-item.active
.mis-faq-answer-inner{
    padding:
        0 52px 16px 18px;

    opacity:1;

    transform:translateY(0);
}

@media(max-width:1200px){

    .mis-faq-inner{
        padding:50px;

        grid-template-columns:35% 65%;

        gap:35px;
    }


    .mis-faq-left h2{
        font-size:40px;
    }

}

@media(max-width:900px){

    .mis-faq-inner{
        padding:35px;

        grid-template-columns:1fr;

        gap:30px;
    }


    .mis-faq-left{
        text-align:center;
    }


    .mis-faq-left h2{
        font-size:38px;
    }


    .mis-faq-left p{
        margin-left:auto;
        margin-right:auto;
    }


    .mis-faq-accordion{
        max-width:760px;

        width:100%;

        margin:0 auto;
    }

}

@media(max-width:600px){

    .mis-faq-inner{
        padding:
            35px 20px;
    }


    .mis-faq-tag{
        font-size:13px;
    }


    .mis-faq-left h2{
        font-size:30px;

        line-height:1.1;
    }


    .mis-faq-left p{
        font-size:16px;

        line-height:1.55;
    }


    .mis-faq-btn{
        min-height:46px;

        font-size:13px;
    }


    .mis-faq-question{
        min-height:54px;

        padding:
            10px 12px 10px 14px;

        gap:12px;

        font-size:14px;
    }


    .mis-faq-icon{
        width:25px;
        height:25px;

        flex:0 0 25px;
    }


    .mis-faq-answer-inner{
        font-size:13px;
    }


    .mis-faq-item.active
    .mis-faq-answer-inner{
        padding:
            0 42px 14px 14px;
    }

}

@media(max-width:400px){

    .mis-faq-left h2{
        font-size:27px;
    }

}


/* form section  */

  .cm-contact,
.cm-contact *{
  box-sizing:border-box;
}

.cm-contact{
  width:100%;
  overflow:hidden;
  font-family:'Inter',sans-serif;
  color:#fff;

  background:
    radial-gradient(
      circle at 15% 20%,
      rgba(0,137,255,.10),
      transparent 32%
    ),
    radial-gradient(
      circle at 90% 35%,
      rgba(0,119,255,.08),
      transparent 32%
    ),
    #06131f;
}

.cm-contact-inner{
  width:100%;
  max-width:1600px;
  margin:auto;
  padding:55px 50px;
}

.cm-contact-heading{
  text-align:center;
  margin-bottom:42px;
}

.cm-contact-label{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:14px;

  margin-bottom:8px;

  color:#d7eaff;
  font-size:13px;
  font-weight:700;
  letter-spacing:2px;
}

.cm-contact-label span{
  width:55px;
  height:1px;
  background:#11baff;
}

.cm-contact-heading h2{
  margin:0;

  font-size:46px;
  line-height:1.1;
  font-weight:800;
  letter-spacing:-1.5px;
}

.cm-contact-heading h2 span{
  color:#079dff;
}

.cm-contact-heading p{
  margin:13px 0 0;

  color:#aebed0;
  font-size:17px;
}

.cm-contact-grid{
  display:grid;
  grid-template-columns:42% 58%;
  gap:28px;
}

.cm-contact-left{
  display:flex;
  flex-direction:column;
  gap:11px;
}

.cm-contact-card{
  min-height:92px;

  display:flex;
  align-items:center;

  padding:15px 20px;

  border:1px solid rgba(23,135,205,.38);
  border-radius:17px;

  color:#fff;
  text-decoration:none;

  background:
    linear-gradient(
      135deg,
      rgba(10,35,54,.94),
      rgba(5,22,35,.94)
    );

  transition:.3s ease;
}

.cm-contact-card:hover{
  transform:translateY(-3px);
  border-color:#078fff;

  box-shadow:
    0 12px 30px
    rgba(0,119,255,.10);
}


/* ICON */

.cm-contact-icon{
  width:58px;
  height:58px;
  flex:0 0 58px;

  display:flex;
  align-items:center;
  justify-content:center;

  margin-right:20px;

  border-radius:15px;

  color:#fff;
  font-size:25px;
  font-weight:700;

  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.25),
    0 10px 20px rgba(0,0,0,.18);
}

.cm-phone{
  background:
    linear-gradient(145deg,#15b6ff,#0864ff);
}

.cm-whatsapp{
  background:
    linear-gradient(145deg,#10dc91,#00a85e);
}

.cm-email{
  background:
    linear-gradient(145deg,#9d56ff,#5a20ec);
}

.cm-location{
  background:
    linear-gradient(145deg,#ffbf2f,#ff8b00);
}


/* DETAILS */

.cm-contact-details{
  flex:1;
}

.cm-contact-details small{
  display:block;

  margin-bottom:5px;

  color:#afbed0;

  font-size:14px;
}

.cm-contact-details strong{
  display:block;

  color:#fff;

  font-size:17px;
  line-height:1.3;
  font-weight:700;
}

.cm-contact-arrow{
  width:42px;
  height:42px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:50%;

  color:#08b9ff;

  background:#07305a;

  font-size:22px;

  transition:.3s ease;
}

.cm-contact-card:hover
.cm-contact-arrow{
  transform:translateX(4px);
}

.cm-contact-cta{
  position:relative;
  overflow:hidden;

  margin-top:5px;

  padding:25px;

  min-height:230px;

  border:1px solid #078cff;
  border-radius:18px;

  background:
    radial-gradient(
      circle at 85% 50%,
      rgba(0,108,255,.24),
      transparent 35%
    ),
    linear-gradient(
      135deg,
      #082138,
      #06121e
    );
}

.cm-cta-content{
  position:relative;
  z-index:2;
}

.cm-contact-cta h3{
  margin:0;

  font-size:25px;
  line-height:1.12;
  font-weight:800;
}

.cm-contact-cta h3 span{
  color:#10a9ff;
}

.cm-contact-cta p{
  max-width:390px;

  margin:12px 0 18px;

  color:#afbed0;

  font-size:14px;
  line-height:1.5;
}


/* GLOBE EFFECT */

.cm-globe{
  position:absolute;

  width:200px;
  height:200px;

  right:-35px;
  bottom:-65px;

  border-radius:50%;

  border:1px solid rgba(0,151,255,.25);

  background:
    radial-gradient(
      circle,
      rgba(0,116,255,.18),
      transparent 67%
    );

  box-shadow:
    0 0 60px rgba(0,125,255,.18);
}


/* CTA BUTTONS */

.cm-cta-buttons{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.cm-book-btn,
.cm-wa-btn{
  min-height:46px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  gap:9px;

  padding:0 17px;

  border-radius:11px;

  color:#fff;
  text-decoration:none;

  font-size:13px;
  font-weight:700;
}

.cm-book-btn{
  background:
    linear-gradient(
      135deg,
      #0eb7ff,
      #0868ff
    );
}

.cm-wa-btn{
  border:1px solid #04c5ff;
  background:rgba(4,19,31,.65);
}

.cm-wa-btn span{
  color:#08e88a;
}

.cm-cta-features{
  display:flex;
  flex-wrap:wrap;

  gap:18px;

  margin-top:17px;

  color:#afbed0;

  font-size:12px;
}

.cm-cta-features span::first-letter{
  color:#00c8ff;
}

.cm-form-card{
  position:relative;
  overflow:hidden;

  padding:28px;

  border:1px solid rgba(0,140,255,.65);
  border-radius:20px;

  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(0,100,255,.17),
      transparent 32%
    ),
    linear-gradient(
      145deg,
      rgba(8,30,48,.98),
      rgba(4,18,30,.98)
    );

  box-shadow:
    0 20px 50px
    rgba(0,0,0,.18);
}

.cm-form-glow{
  position:absolute;

  width:170px;
  height:170px;

  right:-80px;
  top:-80px;

  border-radius:50%;

  background:#008cff;

  filter:blur(55px);

  opacity:.35;

  pointer-events:none;
}

.cm-form-heading{
  position:relative;
  z-index:2;

  margin-bottom:25px;
}

.cm-form-heading h3{
  margin:0;

  font-size:27px;
  line-height:1.2;
  font-weight:800;
}

.cm-form-heading p{
  margin:8px 0 0;

  color:#aebed0;

  font-size:14px;
}

.cm-form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:17px;
}

.cm-field{
  margin-bottom:17px;
}

.cm-field label{
  display:block;

  margin-bottom:7px;

  color:#e6edf6;

  font-size:13px;
  font-weight:500;
}

.cm-field label span{
  color:#ff6e73;
}

.cm-input-wrap,
.cm-textarea-wrap{
  position:relative;
}

.cm-input-wrap input,
.cm-input-wrap select,
.cm-textarea-wrap textarea{
  width:100%;

  border:1px solid rgba(104,154,193,.48);
  outline:none;

  border-radius:10px;

  color:#fff;

  font-family:'Inter',sans-serif;
  font-size:14px;

  background:
    rgba(13,42,64,.68);

  transition:.25s ease;
}

.cm-input-wrap input,
.cm-input-wrap select{
  height:52px;

  padding:
    0 42px 0 45px;
}

.cm-textarea-wrap textarea{
  height:130px;

  padding:
    16px 16px 16px 45px;

  resize:none;
}

.cm-input-wrap input::placeholder,
.cm-textarea-wrap textarea::placeholder{
  color:#91a5bb;
}

.cm-input-wrap select{
  color:#a9bbce;
  appearance:auto;
}

.cm-input-wrap select option{
  background:#0a1e30;
  color:#fff;
}

.cm-input-wrap input:focus,
.cm-input-wrap select:focus,
.cm-textarea-wrap textarea:focus{
  border-color:#0aaeff;

  box-shadow:
    0 0 0 3px
    rgba(0,156,255,.08);
}

.cm-field-icon{
  position:absolute;

  left:15px;
  top:50%;

  transform:translateY(-50%);

  z-index:2;

  color:#a8c9ec;

  font-size:18px;
}

.cm-textarea-wrap
.cm-field-icon{
  top:17px;

  transform:none;
}
.cm-submit-btn{
  min-width:210px;
  min-height:52px;

  border:0;
  outline:0;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  gap:12px;

  padding:0 22px;

  border-radius:50px;

  cursor:pointer;

  color:#fff;

  font-family:'Inter',sans-serif;

  font-size:14px;
  font-weight:700;

  background:
    linear-gradient(
      135deg,
      #0bb6ff,
      #0857ff
    );

  box-shadow:
    0 12px 28px
    rgba(0,106,255,.25);

  transition:.3s ease;
}

.cm-submit-btn:hover{
  transform:translateY(-2px);
}

.cm-submit-btn:disabled{
  opacity:.65;
  cursor:not-allowed;
}

.cm-form-safe{
  margin-top:15px;

  color:#8398ad;

  font-size:12px;
}

.cm-form-status{
  margin-top:13px;

  font-size:13px;
  font-weight:600;
}

.cm-form-status.success{
  color:#23df9a;
}

.cm-form-status.error{
  color:#ff7777;
}


/* spam */
.cm-honeypot{
  position:absolute !important;
  left:-99999px !important;
}

@media(max-width:1000px){

  .cm-contact-grid{
    grid-template-columns:1fr;
  }

  .cm-contact-left{
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  .cm-contact-cta{
    grid-column:1/-1;
  }

}


@media(max-width:700px){

  .cm-contact-inner{
    padding:40px 20px;
  }

  .cm-contact-heading{
    margin-bottom:30px;
  }

  .cm-contact-heading h2{
    font-size:35px;
  }

  .cm-contact-heading p{
    font-size:15px;
  }

  .cm-contact-left{
    display:flex;
  }

  .cm-contact-card{
    min-height:82px;

    padding:12px 14px;
  }

  .cm-contact-icon{
    width:50px;
    height:50px;

    flex-basis:50px;

    margin-right:13px;
  }

  .cm-contact-details strong{
    font-size:14px;
  }

  .cm-contact-arrow{
    width:35px;
    height:35px;

    font-size:18px;
  }

  .cm-contact-cta{
    padding:20px;
  }

  .cm-contact-cta h3{
    font-size:22px;
  }

  .cm-cta-buttons{
    flex-direction:column;
  }

  .cm-book-btn,
  .cm-wa-btn{
    width:100%;
  }

  .cm-cta-features{
    flex-direction:column;
    gap:8px;
  }

  .cm-form-card{
    padding:20px 15px;
  }

  .cm-form-heading h3{
    font-size:24px;
  }

  .cm-form-row{
    grid-template-columns:1fr;
    gap:0;
  }

  .cm-submit-btn{
    width:100%;
  }

}

/* industies  */
.mis-industries,
.mis-industries *{
    box-sizing:border-box;
}


.mis-industries{
    width:100%;

    overflow:hidden;

    font-family:'Inter',sans-serif;

    color:#fff;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(0,132,255,.08),
            transparent 36%
        ),

        radial-gradient(
            circle at 8% 70%,
            rgba(0,132,255,.07),
            transparent 25%
        ),

        linear-gradient(
            180deg,
            #071521 0%,
            #05111c 100%
        );
}

.mis-industries-inner{
    width:100%;

    max-width:1600px;

    margin:0 auto;

    padding:45px 50px 55px;
}


/* ==============================
   TOP ROW
============================== */

.mis-industries-top{
    position:relative;

    min-height:32px;

    display:flex;

    align-items:center;
    justify-content:center;
}


/* LEFT LABEL */

.mis-industries-label{
    position:absolute;

    left:0;
    top:0;

    display:flex;
    align-items:center;

    gap:9px;

    color:#13baff;

    font-size:12px;

    font-weight:700;

    letter-spacing:.7px;
}


.mis-industries-num{
    width:31px;
    height:31px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    border:
        1px solid
        rgba(0,175,255,.9);

    color:#18c1ff;

    font-size:12px;

    box-shadow:
        0 0 15px
        rgba(0,155,255,.18);
}


.mis-industries-line{
    width:17px;
    height:1px;

    background:#12baff;
}


/* CENTER PILL */

.mis-industries-pill{
    min-height:28px;

    display:inline-flex;

    align-items:center;
    justify-content:center;

    padding:
        0 22px;

    border-radius:30px;

    border:
        1px solid
        rgba(107,158,194,.5);

    background:
        rgba(6,24,38,.6);

    color:#9fb6c9;

    font-size:10px;

    font-weight:600;

    letter-spacing:1.4px;
}


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

.mis-industries-heading{
    max-width:900px;

    margin:
        15px auto 0;

    text-align:center;
}


.mis-industries-heading h2{
    margin:0;

    font-size:38px;

    line-height:1.12;

    font-weight:800;

    letter-spacing:-1.2px;
}


.mis-industries-heading p{
    max-width:800px;

    margin:
        9px auto 0;

    color:#a3b4c4;

    font-size:14px;

    line-height:1.55;
}


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

.mis-industries-grid{
    display:grid;

    grid-template-columns:
        repeat(8, minmax(0,1fr));

    gap:22px;

    margin-top:35px;

    padding:
        0 10px;

    align-items:center;

    perspective:1200px;
}


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

.mis-industry-card{
    position:relative;

    height:175px;

    min-width:0;

    overflow:hidden;

    padding:
        16px 10px 15px;

    display:flex;

    flex-direction:column;

    align-items:center;
    justify-content:center;

    border-radius:16px;

    border:
        1px solid
        rgba(45,116,171,.58);

    background:

        radial-gradient(
            circle at 50% 22%,
            rgba(27,106,169,.15),
            transparent 42%
        ),

        linear-gradient(
            145deg,
            rgba(14,38,57,.98),
            rgba(6,20,32,.99)
        );

    box-shadow:

        0 16px 30px
        rgba(0,0,0,.28),

        inset 0 1px 0
        rgba(255,255,255,.06),

        inset 0 -20px 35px
        rgba(0,63,116,.07);

    transform-style:preserve-3d;

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}


/* TOP LIGHT */

.mis-industry-card::before{
    content:"";

    position:absolute;

    width:75%;
    height:1px;

    top:0;
    left:12.5%;

    background:

        linear-gradient(
            90deg,
            transparent,
            rgba(66,170,255,.7),
            transparent
        );

    opacity:.55;
}


/* BOTTOM BLUE GLOW */

.mis-industry-card::after{
    content:"";

    position:absolute;

    width:90px;
    height:50px;

    bottom:-37px;

    left:50%;

    transform:
        translateX(-50%);

    border-radius:50%;

    background:
        rgba(0,128,255,.55);

    filter:
        blur(28px);

    opacity:.45;

    pointer-events:none;
}


/* ==============================
   DEFAULT 3D TILTS
============================== */

.mis-industry-card.tilt-left{
    transform:
        rotateZ(6deg)
        rotateY(-5deg);
}


.mis-industry-card.tilt-right{
    transform:
        rotateZ(-5deg)
        rotateY(5deg);
}


.mis-industry-card.tilt-left-small{
    transform:
        rotateZ(4deg)
        rotateY(-4deg);
}


.mis-industry-card.tilt-right-small{
    transform:
        rotateZ(-4deg)
        rotateY(4deg);
}


/* ==============================
   3D IMAGE
============================== */

.mis-industry-icon{
    width:100%;

    height:95px;

    display:flex;

    align-items:center;
    justify-content:center;

    position:relative;

    z-index:2;

    transform:
        translateZ(28px);
}


.mis-industry-icon img{
    width:100px;
    height:100px;

    max-width:100%;

    object-fit:contain;

    display:block;

    filter:
        drop-shadow(
            0 12px 10px
            rgba(0,0,0,.45)
        );

    transition:
        transform .35s ease,
        filter .35s ease;
}


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

.mis-industry-card h3{
    position:relative;

    z-index:2;

    margin:
        8px 0 0;

    color:#fff;

    font-size:14px;

    line-height:1.25;

    font-weight:650;

    text-align:center;

    transform:
        translateZ(20px);

    text-shadow:
        0 3px 8px
        rgba(0,0,0,.45);
}


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

.mis-industry-card:hover{
    transform:
        translateY(-9px)
        rotateZ(0deg)
        rotateX(2deg)
        rotateY(0deg)
        scale(1.04);

    border-color:
        rgba(0,173,255,.9);

    box-shadow:

        0 25px 45px
        rgba(0,0,0,.34),

        0 0 28px
        rgba(0,133,255,.12),

        inset 0 1px 0
        rgba(255,255,255,.08);
}


.mis-industry-card:hover
.mis-industry-icon img{
    transform:
        translateY(-4px)
        scale(1.08);

    filter:
        drop-shadow(
            0 16px 15px
            rgba(0,0,0,.48)
        );
}


/* ==============================
   1200PX
============================== */

@media(max-width:1200px){

    .mis-industries-inner{
        padding:
            45px 50px;
    }


    .mis-industries-grid{
        grid-template-columns:
            repeat(4,1fr);

        max-width:900px;

        margin:
            35px auto 0;

        gap:22px;
    }


    .mis-industry-card{
        height:180px;
    }


    .mis-industry-icon img{
        width:105px;
        height:105px;
    }


    .mis-industries-heading h2{
        font-size:36px;
    }

}


/* ==============================
   TABLET
============================== */

@media(max-width:900px){

    .mis-industries-inner{
        padding:
            40px 35px;
    }


    .mis-industries-top{
        flex-direction:column;

        gap:15px;
    }


    .mis-industries-label{
        position:static;
    }


    .mis-industries-heading{
        margin-top:20px;
    }


    .mis-industries-heading h2{
        font-size:34px;
    }


    .mis-industries-grid{
        grid-template-columns:
            repeat(4,1fr);

        gap:17px;

        padding:0;
    }


    .mis-industry-card{
        height:165px;
    }


    .mis-industry-icon{
        height:85px;
    }


    .mis-industry-icon img{
        width:90px;
        height:90px;
    }

}


/* ==============================
   MOBILE
============================== */

@media(max-width:600px){

    .mis-industries-inner{
        padding:
            35px 20px;
    }


    .mis-industries-heading h2{
        font-size:30px;

        line-height:1.15;
    }


    .mis-industries-heading p{
        font-size:14px;
    }


    .mis-industries-grid{
        grid-template-columns:
            repeat(2,1fr);

        gap:15px;

        margin-top:30px;
    }


    .mis-industry-card{
        height:155px;

        padding:
            13px 8px;

        border-radius:15px;
    }


    .mis-industry-icon{
        height:82px;
    }


    .mis-industry-icon img{
        width:82px;
        height:82px;
    }


    .mis-industry-card h3{
        font-size:13px;
    }


    .mis-industry-card.tilt-left,
    .mis-industry-card.tilt-left-small{
        transform:
            rotateZ(2deg);
    }


    .mis-industry-card.tilt-right,
    .mis-industry-card.tilt-right-small{
        transform:
            rotateZ(-2deg);
    }

}


/* ==============================
   SMALL MOBILE
============================== */

@media(max-width:400px){

    .mis-industries-heading h2{
        font-size:28px;
    }


    .mis-industries-grid{
        gap:12px;
    }


    .mis-industry-card{
        height:150px;
    }


    .mis-industry-icon img{
        width:78px;
        height:78px;
    }

}


/* why choess  */
   .cm-why,
.cm-why *{
    box-sizing:border-box;
}

.cm-why{
    width:100%;
    overflow:hidden;

    font-family:'Inter',sans-serif;

    color:#fff;

    background:
        radial-gradient(
            circle at 50% 20%,
            rgba(0,145,255,.09),
            transparent 34%
        ),
        radial-gradient(
            circle at 0% 100%,
            rgba(0,99,255,.08),
            transparent 26%
        ),
        linear-gradient(
            180deg,
            #061521 0%,
            #040e17 100%
        );
}

.cm-why-inner{
    width:100%;
    max-width:1600px;

    margin:0 auto;

    padding:55px 50px 65px;
}


/* ===============================
   HEADER
================================ */

.cm-why-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;

    gap:40px;

    margin-bottom:35px;
}

.cm-why-left{
    max-width:650px;
}

.cm-why-tag{
    display:flex;
    align-items:center;

    gap:9px;

    margin-bottom:14px;

    color:#12baff;

    font-size:12px;
    font-weight:700;

    letter-spacing:.8px;
}

.cm-why-tag-num{
    width:31px;
    height:31px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid #0bb4ff;
    border-radius:50%;

    color:#11c0ff;

    box-shadow:
        0 0 15px rgba(0,166,255,.17);
}

.cm-why-tag-line{
    width:18px;
    height:1px;

    background:#0bb7ff;
}

.cm-why-head h2{
    margin:0;

    font-size:46px;
    line-height:1.05;

    font-weight:800;

    letter-spacing:-1.6px;
}

.cm-why-head h2 span{
    color:#0aaeff;
}

.cm-why-intro{
    max-width:470px;

    margin:0 0 3px;

    color:#94aabd;

    font-size:15px;
    line-height:1.6;
}


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

.cm-why-grid{
    display:grid;

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

    gap:18px;

    perspective:1200px;
}


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

.cm-why-card{
    position:relative;

    min-height:200px;

    padding:24px;

    overflow:hidden;

    border-radius:21px;

    border:
        1px solid
        rgba(55,129,181,.38);

    background:
        radial-gradient(
            circle at 18% 15%,
            rgba(0,150,255,.14),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            rgba(13,36,53,.96),
            rgba(5,18,29,.98)
        );

    box-shadow:
        0 17px 35px rgba(0,0,0,.25),
        inset 0 1px 0 rgba(255,255,255,.055);

    transform-style:preserve-3d;

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}


/* TOP SHINE */

.cm-why-card::before{
    content:"";

    position:absolute;

    top:0;
    left:15%;

    width:70%;
    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(53,174,255,.7),
            transparent
        );
}


/* GLOW */

.cm-why-card::after{
    content:"";

    position:absolute;

    width:110px;
    height:110px;

    left:-30px;
    top:-35px;

    border-radius:50%;

    background:
        rgba(0,146,255,.16);

    filter:blur(35px);

    pointer-events:none;
}


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

.cm-why-icon{
    position:relative;
    z-index:2;

    width:45px;
    height:45px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:18px;

    border-radius:17px;

    border:
        1px solid
        rgba(80,186,255,.38);

    background:
        linear-gradient(
            145deg,
            rgba(15,107,178,.30),
            rgba(4,37,65,.78)
        );

    box-shadow:
        0 13px 25px rgba(0,0,0,.25),
        0 0 22px rgba(0,139,255,.10),
        inset 0 1px 0 rgba(255,255,255,.08);

    transform:
        translateZ(30px)
        rotate(-3deg);
}

.cm-why-icon svg{
    width:31px;
    height:31px;

    fill:none;

    stroke:#26c1ff;

    stroke-width:1.8;

    stroke-linecap:round;
    stroke-linejoin:round;

    filter:
        drop-shadow(
            0 0 5px
            rgba(0,185,255,.5)
        );
}


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

.cm-why-number{
    position:absolute;

    right:20px;
    top:23px;

    color:rgba(130,173,203,.25);

    font-size:26px;
    line-height:1;

    font-weight:800;

    letter-spacing:-1px;
}


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

.cm-why-card h3{
    position:relative;
    z-index:2;

    margin:0;

    color:#f5f9fc;

    font-size:18px;
    line-height:1.3;

    font-weight:700;

    transform:translateZ(18px);
}

.cm-why-card p{
    position:relative;
    z-index:2;

    margin:10px 0 0;

    max-width:280px;

    color:#93a8bb;

    font-size:14px;
    line-height:1.55;

    transform:translateZ(12px);
}


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

.cm-why-card:hover{
    transform:
        translateY(-8px)
        rotateX(2deg)
        rotateY(-2deg);

    border-color:
        rgba(0,169,255,.75);

    box-shadow:
        0 25px 45px rgba(0,0,0,.32),
        0 0 28px rgba(0,128,255,.10),
        inset 0 1px 0 rgba(255,255,255,.08);
}

.cm-why-card:hover .cm-why-icon{
    transform:
        translateZ(40px)
        rotate(0deg)
        translateY(-3px);

    border-color:
        rgba(0,190,255,.65);
}


/* ===============================
   DIFFERENT CARD DEPTH
================================ */

.cm-why-card:nth-child(2),
.cm-why-card:nth-child(6){
    background:
        radial-gradient(
            circle at 18% 15%,
            rgba(95,76,255,.13),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            rgba(19,31,55,.97),
            rgba(5,18,29,.98)
        );
}

.cm-why-card:nth-child(4),
.cm-why-card:nth-child(8){
    background:
        radial-gradient(
            circle at 18% 15%,
            rgba(0,195,255,.11),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            rgba(12,36,52,.97),
            rgba(5,18,29,.98)
        );
}


/* ===============================
   TABLET
================================ */

@media(max-width:1100px){

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

    .cm-why-head h2{
        font-size:40px;
    }

}


/* ===============================
   900
================================ */

@media(max-width:900px){

    .cm-why-inner{
        padding:45px 35px;
    }

    .cm-why-head{
        align-items:flex-start;

        flex-direction:column;

        gap:15px;
    }

    .cm-why-intro{
        max-width:650px;
    }

}


/* ===============================
   MOBILE
================================ */

@media(max-width:600px){

    .cm-why-inner{
        padding:35px 20px;
    }

    .cm-why-head{
        margin-bottom:27px;
    }

    .cm-why-head h2{
        font-size:30px;
    }

    .cm-why-intro{
        font-size:14px;
    }

    .cm-why-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:12px;
    }

    .cm-why-card{
        min-height:205px;

        padding:16px 13px;

        border-radius:16px;
    }

    .cm-why-icon{
        width:49px;
        height:49px;

        margin-bottom:18px;

        border-radius:13px;
    }

    .cm-why-icon svg{
        width:25px;
        height:25px;
    }

    .cm-why-number{
        right:12px;
        top:15px;

        font-size:20px;
    }

    .cm-why-card h3{
        font-size:14px;
    }

    .cm-why-card p{
        font-size:12px;

        line-height:1.5;
    }

}


/* ===============================
   SMALL MOBILE
================================ */

@media(max-width:380px){

    .cm-why-grid{
        grid-template-columns:1fr;
    }

    .cm-why-card{
        min-height:auto;
    }

}

/* About  */
  .cm-about-final,
.cm-about-final *{
  box-sizing:border-box;
}

.cm-about-final{
  width:100%;
  overflow:hidden;
  font-family:'Inter',sans-serif;
  color:#fff;

  background:
    radial-gradient(circle at 85% 5%, rgba(0,120,255,.08), transparent 26%),
    radial-gradient(circle at 15% 90%, rgba(0,95,255,.05), transparent 28%),
    linear-gradient(180deg,#06131f 0%,#040d16 100%);
}

.cm-about-final-inner{
  width:100%;
  max-width:1600px;
  margin:0 auto;

  padding:48px 50px 42px;

  display:grid;
  grid-template-columns:1.06fr .94fr;
  gap:70px;

  align-items:center;
}


/* LEFT */

.cm-about-final-left{
  min-width:0;
}

.cm-about-final-tag{
  display:flex;
  align-items:center;
  gap:11px;

  margin-bottom:14px;

  color:#15c4db;
  font-size:11px;
  font-weight:700;
  letter-spacing:1.8px;
}

.cm-about-final-tag span{
  width:25px;
  height:1px;
  background:#159cff;
  box-shadow:0 0 8px rgba(0,162,255,.35);
}

.cm-about-final-left h2{
  margin:0;

  font-size:42px;
  line-height:1.06;

  font-weight:800;
  letter-spacing:-1.5px;
}

.cm-about-final-left h2 span{
  background:linear-gradient(90deg,#159eff,#2871ff);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

.cm-about-final-left > p{
  max-width:720px;
  margin:15px 0 0;

  color:#a8bacb;
  font-size:14px;
  line-height:1.6;
}


/* STATS */

.cm-about-final-stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);

  gap:0;

  margin-top:27px;
}

.cm-about-final-stat{
  position:relative;

  min-width:0;

  padding:0 18px 0 0;
}

.cm-about-final-stat:not(:first-child){
  padding-left:20px;

  border-left:
    1px solid rgba(73,122,158,.18);
}

.cm-stat-line{
  display:block;

  width:21px;
  height:3px;

  margin-bottom:8px;

  border-radius:20px;

  background:#0bb7ff;

  box-shadow:
    0 0 8px rgba(0,177,255,.55);
}

.cm-about-final-stat strong{
  display:block;

  color:#10cbff;

  font-size:28px;
  line-height:1;

  font-weight:800;
}

.cm-about-final-stat small{
  display:block;

  margin-top:6px;

  color:#94a6b8;

  font-size:10px;
  line-height:1.35;
}


/* STORY STRIP */

.cm-about-story-strip{
  display:flex;
  align-items:center;

  gap:13px;

  margin-top:30px;
}

.cm-about-story-btn{
  width:34px;
  height:34px;

  flex:0 0 34px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:50%;

  border:
    1px solid rgba(0,162,255,.58);

  color:#d8f3ff;
  text-decoration:none;

  background:
    rgba(4,33,53,.55);

  box-shadow:
    0 0 15px rgba(0,130,255,.08);

  transition:.3s ease;
}

.cm-about-story-btn:hover{
  transform:translateX(3px);
  border-color:#12baff;
}

.cm-about-story-text{
  color:#159eff;

  font-size:9px;
  font-weight:700;

  letter-spacing:2.2px;
}

.cm-about-story-line{
  width:42px;
  height:1px;

  background:
    linear-gradient(
      90deg,
      #1c8bd6,
      rgba(28,139,214,.2)
    );
}

.cm-about-story-formula{
  color:#6f879c;

  font-size:8px;
  font-weight:600;

  letter-spacing:2px;
}


/* RIGHT */

.cm-about-final-right{
  position:relative;

  display:flex;
  flex-direction:column;

  gap:13px;

  padding-bottom:35px;

  perspective:1200px;
}


/* CARD */

.cm-about-final-card{
  position:relative;

  min-height:112px;

  display:flex;
  align-items:center;

  gap:18px;

  padding:15px 18px;

  overflow:hidden;

  border:
    1px solid rgba(54,122,174,.45);

  border-radius:16px;

  background:
    radial-gradient(
      circle at 8% 20%,
      rgba(0,126,255,.09),
      transparent 35%
    ),
    linear-gradient(
      145deg,
      rgba(9,34,54,.98),
      rgba(5,20,33,.98)
    );

  box-shadow:
    0 13px 28px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.035);

  transform-style:preserve-3d;

  transition:
    transform .35s ease,
    border-color .35s ease,
    box-shadow .35s ease;
}

.cm-about-final-card::before{
  content:"";

  position:absolute;

  left:8%;
  right:8%;
  top:0;

  height:1px;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(0,160,255,.38),
      transparent
    );
}

.cm-about-final-card:hover{
  transform:
    translateY(-4px)
    rotateX(1deg)
    rotateY(-1deg);

  border-color:
    rgba(0,160,255,.65);

  box-shadow:
    0 18px 34px rgba(0,0,0,.3),
    0 0 22px rgba(0,110,255,.08);
}


/* ICON */

.cm-about-final-icon{
  width:62px;
  height:62px;

  flex:0 0 62px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:13px;

  transform:translateZ(24px);
}

.cm-about-final-icon svg{
  width:29px;
  height:29px;

  fill:none;
  stroke:#fff;
  stroke-width:1.8;

  stroke-linecap:round;
  stroke-linejoin:round;
}

.icon-blue{
  background:
    linear-gradient(
      145deg,
      #0a8cff,
      #1746e8
    );

  box-shadow:
    0 10px 25px rgba(0,114,255,.3),
    inset 0 1px 0 rgba(255,255,255,.2);
}

.icon-purple{
  background:
    linear-gradient(
      145deg,
      #6e55ff,
      #4726dd
    );

  box-shadow:
    0 10px 25px rgba(90,55,255,.28),
    inset 0 1px 0 rgba(255,255,255,.18);
}

.icon-cyan{
  background:
    linear-gradient(
      145deg,
      #07a8c8,
      #026c99
    );

  box-shadow:
    0 10px 25px rgba(0,178,216,.24),
    inset 0 1px 0 rgba(255,255,255,.18);
}


/* CONTENT */

.cm-about-final-card-content{
  flex:1;

  position:relative;
  z-index:2;
}

.cm-about-final-card-content h3{
  margin:0;

  color:#fff;

  font-size:15px;
  line-height:1.2;

  font-weight:700;
}

.cm-about-final-card-content p{
  margin:6px 0 0;

  max-width:500px;

  color:#9db0c1;

  font-size:11px;
  line-height:1.55;
}


/* CARD ARROW */

.cm-about-final-arrow{
  width:30px;
  height:30px;

  flex:0 0 30px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:50%;

  border:
    1px solid rgba(0,149,255,.55);

  color:#d8f3ff;

  background:
    rgba(3,35,58,.72);

  font-size:15px;

  transition:.3s ease;
}

.cm-about-final-card:hover
.cm-about-final-arrow{
  transform:translateX(3px);

  color:#16c5ff;

  border-color:#0bb9ff;
}


/* NOTE */

.cm-about-final-note{
  position:absolute;

  right:8px;
  bottom:-3px;

  color:#16a9ff;

  font-family:
    "Segoe Print",
    "Comic Sans MS",
    cursive;

  font-size:14px;
  line-height:1.12;

  transform:rotate(-8deg);

  text-shadow:
    0 0 8px rgba(0,141,255,.22);
}

.cm-about-final-note span{
  display:block;

  margin-left:28px;

  font-size:22px;
}


/* BOTTOM GLOBE */

.cm-about-final-globe{
  position:absolute;

  width:290px;
  height:105px;

  right:60px;
  bottom:-85px;

  border-radius:50% 50% 0 0;

  border-top:
    1px solid rgba(0,128,255,.38);

  background:
    radial-gradient(
      ellipse at top,
      rgba(0,111,255,.13),
      transparent 67%
    );

  box-shadow:
    0 -8px 30px rgba(0,94,255,.07);

  pointer-events:none;
}


/* 1100 */

@media(max-width:1100px){

  .cm-about-final-inner{
    gap:40px;
  }

  .cm-about-final-left h2{
    font-size:36px;
  }

  .cm-about-final-left > p{
    font-size:13px;
  }

  .cm-about-final-stat strong{
    font-size:24px;
  }

}


/* TABLET */

@media(max-width:900px){

  .cm-about-final-inner{
    grid-template-columns:1fr;

    padding:42px 35px;

    gap:32px;
  }

  .cm-about-final-left h2{
    font-size:36px;
  }

  .cm-about-final-left > p{
    max-width:100%;
  }

  .cm-about-final-right{
    padding-bottom:0;
  }

  .cm-about-final-note,
  .cm-about-final-globe{
    display:none;
  }

}


/* MOBILE */

@media(max-width:600px){

  .cm-about-final-inner{
    padding:35px 20px;
  }

  .cm-about-final-left h2{
    font-size:30px;
  }

  .cm-about-final-left > p{
    font-size:13px;
    line-height:1.55;
  }

  .cm-about-final-stats{
    grid-template-columns:
      repeat(2,1fr);

    gap:18px 0;
  }

  .cm-about-final-stat:nth-child(3){
    border-left:0;
    padding-left:0;
  }

  .cm-about-story-strip{
    flex-wrap:wrap;
  }

  .cm-about-story-formula{
    width:100%;

    padding-left:47px;
  }

  .cm-about-final-card{
    min-height:auto;

    gap:13px;

    padding:14px;
  }

  .cm-about-final-icon{
    width:50px;
    height:50px;

    flex-basis:50px;
  }

  .cm-about-final-icon svg{
    width:24px;
    height:24px;
  }

  .cm-about-final-card-content h3{
    font-size:14px;
  }

  .cm-about-final-card-content p{
    font-size:10px;
  }

  .cm-about-final-arrow{
    width:27px;
    height:27px;

    flex-basis:27px;
  }

}


/* conter  */
  .mis-stats-strip,
.mis-stats-strip *{
  box-sizing:border-box;
}

.mis-stats-strip{
  width:100%;
  padding:12px 30px;

  font-family:'Inter',sans-serif;

  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(0,130,255,.06),
      transparent 45%
    ),
    #05111c;
}

.mis-stats-inner{
  width:100%;
  max-width:1500px;

  margin:0 auto;

  min-height:100px;

  padding:14px 30px;

  display:grid;

  grid-template-columns:
    1fr 1px 1fr 1px 1fr 1px 1fr;

  align-items:center;

  border:
    1px solid
    rgba(0,166,255,.72);

  border-radius:16px;

  background:
    radial-gradient(
      circle at 20% 50%,
      rgba(0,127,255,.10),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      rgba(9,34,55,.97),
      rgba(5,20,34,.98)
    );

  box-shadow:
    0 12px 30px rgba(0,0,0,.22),
    0 0 25px rgba(0,128,255,.06),
    inset 0 1px 0 rgba(255,255,255,.05);
}


/* ITEM */

.mis-stat-item{
  display:flex;
  align-items:center;

  justify-content:center;

  gap:18px;

  min-width:0;

  padding:0 18px;
}


/* ICON */

.mis-stat-icon{
  width:54px;
  height:54px;

  flex:0 0 54px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:12px;

  border:
    1px solid
    rgba(0,179,255,.75);

  background:
    linear-gradient(
      145deg,
      rgba(6,98,162,.65),
      rgba(4,45,79,.92)
    );

  box-shadow:
    0 8px 20px rgba(0,0,0,.22),
    0 0 18px rgba(0,172,255,.14),
    inset 0 1px 0 rgba(255,255,255,.09);
}

.mis-stat-icon svg{
  width:27px;
  height:27px;

  fill:none;

  stroke:#14c7ff;

  stroke-width:1.8;

  stroke-linecap:round;
  stroke-linejoin:round;

  filter:
    drop-shadow(
      0 0 5px
      rgba(0,190,255,.5)
    );
}


/* CONTENT */

.mis-stat-content{
  min-width:0;
}

.mis-stat-content strong{
  display:block;

  color:#fff;

  font-size:31px;
  line-height:1;

  font-weight:800;

  letter-spacing:-.8px;
}

.mis-stat-content small{
  display:block;

  margin-top:7px;

  color:#91a5b9;

  font-size:13px;
  line-height:1.3;

  white-space:nowrap;
}


/* DIVIDER */

.mis-stat-divider{
  width:1px;
  height:55px;

  background:
    linear-gradient(
      180deg,
      transparent,
      #079eff,
      transparent
    );

  box-shadow:
    0 0 10px
    rgba(0,153,255,.55);
}


/* HOVER */

.mis-stat-item{
  transition:transform .3s ease;
}

.mis-stat-item:hover{
  transform:translateY(-3px);
}

.mis-stat-item:hover
.mis-stat-icon{
  box-shadow:
    0 10px 24px rgba(0,0,0,.28),
    0 0 24px rgba(0,172,255,.22);
}


/* TABLET */

@media(max-width:1000px){

  .mis-stats-inner{
    grid-template-columns:
      1fr 1fr;

    gap:20px;

    padding:22px;
  }

  .mis-stat-divider{
    display:none;
  }

  .mis-stat-item{
    justify-content:flex-start;

    padding:10px 15px;
  }

}


/* MOBILE */

@media(max-width:600px){

  .mis-stats-strip{
    padding:12px 20px;
  }

  .mis-stats-inner{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:12px;

    padding:14px;

    border-radius:14px;
  }

  .mis-stat-item{
    gap:10px;

    padding:10px 6px;

    justify-content:flex-start;
  }

  .mis-stat-icon{
    width:43px;
    height:43px;

    flex-basis:43px;

    border-radius:10px;
  }

  .mis-stat-icon svg{
    width:22px;
    height:22px;
  }

  .mis-stat-content strong{
    font-size:23px;
  }

  .mis-stat-content small{
    margin-top:5px;

    font-size:10px;

    white-space:normal;
  }

}


/* SMALL MOBILE */

@media(max-width:380px){

  .mis-stat-icon{
    width:39px;
    height:39px;

    flex-basis:39px;
  }

  .mis-stat-content strong{
    font-size:20px;
  }

}

/* lead  */

.cm-flow-section,
.cm-flow-section *{
    box-sizing:border-box;
}

.cm-flow-section{
    width:100%;
    overflow:hidden;

    font-family:'Inter',sans-serif;
    color:#fff;

    background:
        radial-gradient(
            circle at 62% 25%,
            rgba(0,121,255,.06),
            transparent 32%
        ),
        radial-gradient(
            circle at 96% 15%,
            rgba(0,116,255,.07),
            transparent 28%
        ),
        linear-gradient(
            180deg,
            #061522 0%,
            #04111c 100%
        );
}


/* ==========================================
   INNER
========================================== */

.cm-flow-inner{
    width:100%;
    max-width:1600px;

    margin:0 auto;

    padding:42px 50px 48px;
}


/* ==========================================
   HEADER
========================================== */

.cm-flow-header{
    position:relative;

    display:flex;
    align-items:flex-start;
    justify-content:space-between;

    min-height:94px;
}


.cm-flow-heading{
    max-width:900px;
}


/* EYEBROW */

.cm-flow-eyebrow{
    display:flex;
    align-items:center;

    gap:10px;

    margin-bottom:10px;

    color:#10b9ff;

    font-size:13px;
    line-height:1;

    font-weight:700;

    letter-spacing:.6px;
}


.cm-flow-number{
    width:32px;
    height:32px;

    flex:0 0 32px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid #0baeff;

    border-radius:50%;

    font-size:11px;

    box-shadow:
        0 0 15px
        rgba(0,174,255,.13);
}


.cm-flow-small-line{
    width:20px;
    height:1px;

    background:#0bb6ff;
}


/* HEADING */

.cm-flow-heading h2{
    margin:0;

    color:#fff;

    font-size:36px;
    line-height:1.08;

    font-weight:800;

    letter-spacing:-1.2px;
}


.cm-flow-heading p{
    margin:9px 0 0;

    color:#9db0c1;

    font-size:15px;
    line-height:1.5;
}


/* ==========================================
   HANDWRITTEN NOTE
========================================== */

.cm-flow-hand-note{
    display:flex;
    align-items:flex-end;

    gap:0;

    margin-right:20px;

    color:#a9d5ff;

    font-family:
        "Segoe Print",
        "Comic Sans MS",
        cursive;

    font-size:18px;
    line-height:1.12;

    transform:rotate(-7deg);

    text-shadow:
        0 0 8px
        rgba(0,140,255,.18);
}


.cm-flow-hand-note svg{
    width:55px;
    height:55px;

    margin-left:-4px;
    margin-bottom:-16px;

    overflow:visible;
}


.cm-flow-hand-note svg path{
    fill:none;

    stroke:#98d2ff;

    stroke-width:2;

    stroke-linecap:round;
    stroke-linejoin:round;
}


/* ==========================================
   FLOW TRACK
========================================== */

.cm-flow-track{
    display:grid;

    grid-template-columns:
        minmax(115px,1fr) 30px
        minmax(115px,1fr) 30px
        minmax(115px,1fr) 30px
        minmax(115px,1fr) 30px
        minmax(115px,1fr) 30px
        minmax(115px,1fr) 30px
        minmax(115px,1fr) 30px
        minmax(115px,1fr);

    align-items:center;

    gap:8px;

    margin-top:15px;

    perspective:1300px;
}


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

.cm-flow-card{
    position:relative;

    height:150px;

    display:flex;
    flex-direction:column;

    align-items:center;
    justify-content:center;

    padding:16px 10px 14px;

    overflow:hidden;

    border-radius:22px;

    border:
        1px solid
        rgba(47,118,170,.52);

    background:
        radial-gradient(
            circle at 50% 18%,
            rgba(0,137,255,.12),
            transparent 42%
        ),
        linear-gradient(
            145deg,
            rgba(13,38,57,.98),
            rgba(5,20,32,.99)
        );

    box-shadow:
        0 18px 30px
        rgba(0,0,0,.26),

        inset 0 1px 0
        rgba(255,255,255,.055),

        inset 0 -18px 30px
        rgba(0,69,120,.06);

    transform-style:preserve-3d;

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}


/* TOP SHINE */

.cm-flow-card::before{
    content:"";

    position:absolute;

    top:0;
    left:15%;

    width:70%;
    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(55,175,255,.65),
            transparent
        );

    opacity:.55;
}


/* BOTTOM GLOW */

.cm-flow-card::after{
    content:"";

    position:absolute;

    width:75px;
    height:35px;

    left:50%;
    bottom:-28px;

    transform:translateX(-50%);

    border-radius:50%;

    background:
        rgba(0,130,255,.42);

    filter:blur(22px);

    opacity:.5;
}


/* ==========================================
   3D IMAGE AREA
========================================== */

.cm-flow-image-wrap{
    width:100%;
    height:88px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:6px;

    position:relative;
    z-index:2;

    transform:
        translateZ(28px);
}


.cm-flow-image{
    width:82px;
    height:82px;

    display:block;

    object-fit:contain;

    filter:
        drop-shadow(
            0 12px 12px
            rgba(0,0,0,.42)
        );

    transition:
        transform .35s ease,
        filter .35s ease;
}


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

.cm-flow-card h3{
    position:relative;
    z-index:2;

    margin:0;

    color:#f4f8fc;

    font-size:14px;
    line-height:1.22;

    font-weight:700;

    text-align:center;

    transform:
        translateZ(18px);

    text-shadow:
        0 3px 7px
        rgba(0,0,0,.35);
}


/* ==========================================
   ARROWS
========================================== */

.cm-flow-arrow{
    display:flex;
    align-items:center;
    justify-content:center;

    margin-top:-5px;

    color:#04d5ff;

    font-size:27px;
    line-height:1;

    font-weight:300;

    letter-spacing:-10px;

    padding-right:8px;

    text-shadow:
        0 0 7px rgba(0,212,255,.65);

    animation:
        cmFlowArrow
        1.7s
        ease-in-out
        infinite;
}


.cm-flow-arrow span{
    display:block;
}


@keyframes cmFlowArrow{

    0%,
    100%{
        opacity:.55;
        transform:translateX(-1px);
    }

    50%{
        opacity:1;
        transform:translateX(3px);
    }

}


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

.cm-flow-card:hover{
    transform:
        translateY(-7px)
        rotateX(3deg)
        rotateY(-2deg)
        scale(1.025);

    border-color:
        rgba(0,174,255,.82);

    box-shadow:
        0 24px 38px
        rgba(0,0,0,.32),

        0 0 28px
        rgba(0,133,255,.10),

        inset 0 1px 0
        rgba(255,255,255,.08);
}


.cm-flow-card:hover
.cm-flow-image{
    transform:
        translateY(-4px)
        scale(1.08);

    filter:
        drop-shadow(
            0 15px 13px
            rgba(0,0,0,.48)
        );
}


/* ==========================================
   1300
========================================== */

@media(max-width:1300px){

    .cm-flow-inner{
        padding:
            42px 35px;
    }


    .cm-flow-track{
        gap:5px;

        grid-template-columns:
            minmax(105px,1fr) 22px
            minmax(105px,1fr) 22px
            minmax(105px,1fr) 22px
            minmax(105px,1fr) 22px
            minmax(105px,1fr) 22px
            minmax(105px,1fr) 22px
            minmax(105px,1fr) 22px
            minmax(105px,1fr);
    }


    .cm-flow-card{
        height:145px;
    }


    .cm-flow-heading h2{
        font-size:34px;
    }

}


/* ==========================================
   TABLET
========================================== */

@media(max-width:1000px){

    .cm-flow-header{
        min-height:auto;
    }


    .cm-flow-hand-note{
        display:none;
    }


    .cm-flow-track{
        grid-template-columns:
            repeat(4,1fr);

        gap:18px;

        margin-top:28px;
    }


    .cm-flow-arrow{
        display:none;
    }


    .cm-flow-card{
        height:155px;
    }


    .cm-flow-image{
        width:88px;
        height:88px;
    }

}


/* ==========================================
   MOBILE
========================================== */

@media(max-width:600px){

    .cm-flow-inner{
        padding:
            35px 20px;
    }


    .cm-flow-eyebrow{
        font-size:12px;
    }


    .cm-flow-heading h2{
        font-size:30px;

        line-height:1.12;
    }


    .cm-flow-heading p{
        font-size:14px;

        line-height:1.5;
    }


    .cm-flow-track{
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:14px;

        margin-top:25px;
    }


    .cm-flow-card{
        height:150px;

        padding:
            14px 8px;

        border-radius:18px;
    }


    .cm-flow-image-wrap{
        height:86px;
    }


    .cm-flow-image{
        width:82px;
        height:82px;
    }


    .cm-flow-card h3{
        font-size:13px;
    }

}


/* ==========================================
   SMALL MOBILE
========================================== */

@media(max-width:400px){

    .cm-flow-heading h2{
        font-size:27px;
    }


    .cm-flow-card{
        height:145px;
    }


    .cm-flow-image{
        width:76px;
        height:76px;
    }

}

/* TECHNOLOGY  */
.cm-tech-section,
.cm-tech-section *{
    box-sizing:border-box;
}

.cm-tech-section{
    position:relative;

    width:100%;
    overflow:hidden;

    font-family:'Inter',sans-serif;

    color:#fff;

    background:
        radial-gradient(
            circle at 50% 20%,
            rgba(0,118,255,.08),
            transparent 33%
        ),
        linear-gradient(
            180deg,
            #05101f 0%,
            #020812 100%
        );
}


/* OVERLAY */

.cm-tech-overlay{
    position:absolute;

    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 5% 60%,
            rgba(0,124,255,.05),
            transparent 25%
        ),
        radial-gradient(
            circle at 95% 60%,
            rgba(0,124,255,.05),
            transparent 25%
        );
}


/* INNER */

.cm-tech-inner{
    position:relative;
    z-index:2;

    width:100%;
    max-width:1600px;

    margin:0 auto;

    padding:30px 45px 32px;
}


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

.cm-tech-head{
    max-width:750px;

    margin:0 auto 20px;

    text-align:center;
}

.cm-tech-eyebrow{
    display:flex;
    align-items:center;
    justify-content:center;

    gap:10px;

    color:#13b8ff;

    font-size:10px;
    font-weight:700;

    letter-spacing:1.6px;
}

.cm-tech-eyebrow span{
    width:35px;
    height:1px;

    background:#13b8ff;
}

.cm-tech-head h2{
    margin:7px 0 0;

    font-size:36px;
    line-height:1;

    font-weight:800;

    letter-spacing:-1px;
}

.cm-tech-head p{
    margin:7px 0 0;

    color:#92a7ba;

    font-size:12px;
    line-height:1.4;
}


/* =============================
   SLIDER
============================= */

.cm-tech-slider{
    position:relative;

    display:flex;
    align-items:center;

    gap:12px;
}

.cm-tech-viewport{
    width:100%;

    overflow:hidden;

    padding:6px 0 10px;
}

.cm-tech-track{
    display:flex;

    gap:14px;

    transition:
        transform .65s
        cubic-bezier(.22,.61,.36,1);

    will-change:transform;
}


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

.cm-tech-card{
    flex:
        0 0
        calc((100% - 56px) / 5);

    min-width:0;

    height:155px;

    display:flex;
    flex-direction:column;

    align-items:center;
    justify-content:center;

    padding:15px 10px;

    border:
        1px solid
        rgba(0,145,230,.55);

    border-radius:14px;

    background:
        radial-gradient(
            circle at 50% 10%,
            rgba(0,127,255,.10),
            transparent 40%
        ),
        linear-gradient(
            145deg,
            rgba(8,28,47,.98),
            rgba(3,13,25,.99)
        );

    box-shadow:
        0 14px 25px
        rgba(0,0,0,.25),

        inset 0 1px 0
        rgba(255,255,255,.04);

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease;
}

.cm-tech-card:hover{
    transform:
        translateY(-4px);

    border-color:#0bbcff;

    box-shadow:
        0 18px 32px
        rgba(0,0,0,.30),

        0 0 20px
        rgba(0,137,255,.08);
}


/* LOGO */

.cm-tech-logo{
    width:100%;
    height:74px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:5px;
}

.cm-tech-logo img{
    width:62px;
    height:62px;

    display:block;

    object-fit:contain;

    filter:
        drop-shadow(
            0 8px 9px
            rgba(0,0,0,.35)
        );

    transition:
        transform .3s ease;
}

.cm-tech-card:hover
.cm-tech-logo img{
    transform:
        translateY(-3px)
        scale(1.05);
}


/* TITLE */

.cm-tech-card h3{
    margin:0;

    color:#fff;

    font-size:13px;
    line-height:1.2;

    font-weight:700;

    text-align:center;
}


/* ACCENT */

.cm-tech-accent{
    width:32px;
    height:3px;

    display:block;

    margin-top:9px;

    border-radius:20px;

    box-shadow:
        0 0 8px currentColor;
}

.accent-green{
    color:#29dd6e;
    background:#29dd6e;
}

.accent-yellow{
    color:#ffd000;
    background:#ffd000;
}

.accent-blue{
    color:#168cff;
    background:#168cff;
}

.accent-cyan{
    color:#00e6ff;
    background:#00e6ff;
}

.accent-purple{
    color:#ae4dff;
    background:#ae4dff;
}


/* =============================
   ARROWS
============================= */

.cm-tech-nav{
    width:40px;
    height:40px;

    flex:0 0 40px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:
        1px solid
        rgba(0,161,255,.65);

    border-radius:50%;

    color:#fff;

    background:
        rgba(4,27,46,.92);

    font-size:29px;
    line-height:1;

    cursor:pointer;

    box-shadow:
        0 0 15px
        rgba(0,143,255,.12);

    transition:.3s ease;
}

.cm-tech-nav:hover{
    transform:
        scale(1.07);

    border-color:#0ac7ff;

    box-shadow:
        0 0 20px
        rgba(0,168,255,.20);
}


/* =============================
   DOTS
============================= */

.cm-tech-dots{
    min-height:10px;

    margin-top:4px;

    display:flex;
    align-items:center;
    justify-content:center;

    gap:6px;
}

.cm-tech-dot{
    width:7px;
    height:7px;

    padding:0;

    border:0;
    border-radius:50%;

    background:#23405d;

    cursor:pointer;

    transition:.3s ease;
}

.cm-tech-dot.active{
    width:18px;

    border-radius:20px;

    background:#08c5ff;

    box-shadow:
        0 0 9px
        rgba(0,190,255,.6);
}


/* =============================
   TRUST STRIP
============================= */

.cm-tech-trust{
    max-width:1300px;

    min-height:48px;

    margin:18px auto 0;

    padding:8px 22px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:15px;

    border:
        1px solid
        rgba(33,112,172,.38);

    border-radius:12px;

    background:
        linear-gradient(
            145deg,
            rgba(5,21,39,.90),
            rgba(2,10,22,.95)
        );
}

.cm-tech-trust-item{
    display:flex;
    align-items:center;

    gap:8px;

    color:#d0dbe4;

    font-size:11px;

    white-space:nowrap;
}

.cm-trust-icon{
    color:#0ebcff;

    font-size:17px;
}

.cm-tech-divider{
    width:1px;
    height:22px;

    background:
        rgba(111,147,177,.25);
}


/* =============================
   TABLET
============================= */

@media(max-width:1000px){

    .cm-tech-card{
        flex:
            0 0
            calc((100% - 28px) / 3);
    }

}


/* =============================
   MOBILE
============================= */

@media(max-width:600px){

    .cm-tech-inner{
        padding:
            26px 18px 28px;
    }

    .cm-tech-head{
        margin-bottom:17px;
    }

    .cm-tech-head h2{
        font-size:30px;
    }

    .cm-tech-head p{
        font-size:11px;
    }

    .cm-tech-slider{
        gap:6px;
    }

    .cm-tech-card{
        flex:
            0 0
            calc((100% - 10px) / 2);

        height:140px;
    }

    .cm-tech-logo{
        height:65px;
    }

    .cm-tech-logo img{
        width:55px;
        height:55px;
    }

    .cm-tech-card h3{
        font-size:12px;
    }

    .cm-tech-nav{
        width:32px;
        height:32px;

        flex-basis:32px;

        font-size:23px;
    }

    .cm-tech-trust{
        min-height:auto;

        flex-wrap:wrap;

        justify-content:center;

        gap:10px 18px;

        margin-top:15px;

        padding:10px 12px;
    }

    .cm-tech-divider{
        display:none;
    }

    .cm-tech-trust-item{
        font-size:10px;
    }

}

/* work  */
.cm-work-section,
.cm-work-section *{
  box-sizing:border-box;
}

.cm-work-section{
  width:100%;
  overflow:hidden;

  font-family:'Inter',sans-serif;

  color:#fff;

  background:
    radial-gradient(circle at 50% 20%,rgba(0,92,255,.08),transparent 30%),
    linear-gradient(180deg,#050b18 0%,#020711 100%);
}

.cm-work-inner{
  max-width:1600px;
  margin:0 auto;

  padding:42px 50px 48px;
}


/* HEADING */

.cm-work-head{
  text-align:center;

  max-width:700px;

  margin:0 auto 28px;
}

.cm-work-tag{
  display:flex;
  align-items:center;
  justify-content:center;

  gap:11px;

  color:#0aaeff;

  font-size:11px;
  font-weight:700;

  letter-spacing:1.7px;
}

.cm-work-tag span{
  width:35px;
  height:1px;

  background:#0aaeff;
}

.cm-work-head h2{
  margin:8px 0 0;

  font-size:42px;
  line-height:1;

  font-weight:800;

  letter-spacing:-1.3px;
}

.cm-work-head p{
  margin:8px 0 0;

  color:#9daabd;

  font-size:14px;
  line-height:1.45;
}


/* PROCESS */

.cm-work-process{
  display:grid;

  grid-template-columns:
    1fr 25px
    1fr 25px
    1fr 25px
    1fr 25px
    1fr 25px
    1fr;

  gap:5px;

  align-items:start;

  margin-top:25px;
}


/* STEP */

.cm-work-step{
  text-align:center;

  --step:#148cff;
}

.cyan-step{
  --step:#00d9df;
}

.green-step{
  --step:#15d647;
}

.yellow-step{
  --step:#ffad00;
}

.purple-step{
  --step:#8d3fff;
}


/* ICON */

.cm-work-icon-circle{
  width:94px;
  height:94px;

  margin:0 auto 9px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:50%;

  border:2px solid var(--step);

  background:
    radial-gradient(
      circle,
      color-mix(in srgb,var(--step) 18%,#07111f),
      #06101c 70%
    );

  box-shadow:
    0 0 18px
    color-mix(in srgb,var(--step) 36%,transparent),

    inset 0 0 18px
    rgba(255,255,255,.03);
}

.cm-work-icon-circle::before{
  content:"";

  position:absolute;
}

.cm-work-icon-circle svg{
  width:43px;
  height:43px;

  fill:none;

  stroke:#eaf5ff;

  stroke-width:1.7;

  stroke-linecap:round;
  stroke-linejoin:round;

  filter:
    drop-shadow(
      0 0 7px
      color-mix(in srgb,var(--step) 70%,transparent)
    );
}


/* NUMBER BAR */

.cm-work-number{
  min-height:35px;

  display:flex;
  align-items:center;
  justify-content:center;

  gap:7px;

  margin-bottom:10px;

  clip-path:
    polygon(
      8% 0,
      92% 0,
      100% 50%,
      92% 100%,
      8% 100%,
      0 50%
    );

  background:
    linear-gradient(
      90deg,
      color-mix(in srgb,var(--step) 72%,#092044),
      var(--step)
    );

  box-shadow:
    0 0 16px
    color-mix(in srgb,var(--step) 25%,transparent);
}

.cm-work-number strong{
  font-size:14px;
}

.cm-work-number span{
  font-size:13px;
  font-weight:700;
}


/* STEP TEXT */

.cm-work-step p{
  max-width:155px;

  min-height:72px;

  margin:0 auto;

  color:#b0bdca;

  font-size:11px;
  line-height:1.5;
}

.cm-work-bottom-line{
  display:block;

  width:50px;
  height:2px;

  margin:10px auto 0;

  background:var(--step);

  box-shadow:
    0 0 8px var(--step);
}


/* ARROWS */

.cm-work-arrow{
  display:flex;
  align-items:center;
  justify-content:center;

  height:94px;

  color:#06caff;

  font-size:28px;

  text-shadow:
    0 0 8px rgba(0,211,255,.7);

  animation:
    cmArrowMove 1.6s ease-in-out infinite;
}

@keyframes cmArrowMove{

  0%,100%{
    transform:translateX(-2px);
    opacity:.5;
  }

  50%{
    transform:translateX(3px);
    opacity:1;
  }

}


/* CTA */

.cm-work-cta{
  margin-top:30px;

  min-height:105px;

  padding:16px 20px;

  display:grid;

  grid-template-columns:
    70px 1fr auto;

  align-items:center;

  gap:18px;

  border:
    1px solid rgba(0,143,255,.55);

  border-radius:16px;

  background:
    radial-gradient(
      circle at 10% 50%,
      rgba(0,122,255,.12),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      rgba(7,28,49,.98),
      rgba(3,13,25,.98)
    );

  box-shadow:
    0 15px 32px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.04);
}

.cm-work-cta-icon{
  width:58px;
  height:58px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:14px;

  border:
    1px solid rgba(0,151,255,.6);

  background:
    linear-gradient(
      145deg,
      rgba(11,103,185,.75),
      rgba(8,49,89,.95)
    );

  box-shadow:
    0 0 18px rgba(0,145,255,.18);
}

.cm-work-cta-icon svg{
  width:32px;
  height:32px;

  fill:none;

  stroke:#d9f3ff;

  stroke-width:1.8;

  stroke-linecap:round;
  stroke-linejoin:round;
}

.cm-work-cta-content h3{
  margin:0;

  font-size:21px;
  font-weight:750;
}

.cm-work-cta-content p{
  margin:5px 0 0;

  color:#99aabc;

  font-size:12px;
  line-height:1.45;
}

.cm-work-cta-buttons{
  display:flex;

  gap:10px;
}

.cm-work-btn{
  min-height:43px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  gap:10px;

  padding:0 16px;

  border-radius:9px;

  text-decoration:none;

  color:#fff;

  font-size:12px;
  font-weight:700;

  transition:.3s ease;
}

.cm-work-btn.primary{
  border:
    1px solid #119aff;

  background:
    linear-gradient(
      135deg,
      #0baeff,
      #1356e8
    );
}

.cm-work-btn.whatsapp{
  border:
    1px solid #19d36c;

  color:#dcffe8;

  background:
    rgba(5,41,29,.42);
}

.cm-work-btn:hover{
  transform:translateY(-2px);
}


/* RESPONSIVE */

@media(max-width:1100px){

  .cm-work-process{
    grid-template-columns:
      repeat(3,1fr);

    gap:22px;
  }

  .cm-work-arrow{
    display:none;
  }

}


@media(max-width:800px){

  .cm-work-inner{
    padding:40px 30px;
  }

  .cm-work-head h2{
    font-size:36px;
  }

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

  .cm-work-cta{
    grid-template-columns:
      58px 1fr;
  }

  .cm-work-cta-buttons{
    grid-column:1/-1;

    justify-content:flex-start;

    padding-left:76px;
  }

}


@media(max-width:600px){

  .cm-work-inner{
    padding:35px 20px;
  }

  .cm-work-head h2{
    font-size:30px;
  }

  .cm-work-process{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:17px 12px;
  }

  .cm-work-icon-circle{
    width:80px;
    height:80px;
  }

  .cm-work-icon-circle svg{
    width:35px;
    height:35px;
  }

  .cm-work-step p{
    font-size:10px;
  }

  .cm-work-cta{
    display:flex;

    flex-direction:column;

    align-items:flex-start;

    padding:18px;
  }

  .cm-work-cta-buttons{
    width:100%;

    padding-left:0;

    flex-direction:column;
  }

  .cm-work-btn{
    width:100%;
  }

}

 /* ================================
   FIXED FOOTER CTA
================================ */

.cm-fixed-footer,
.cm-fixed-footer *{
    box-sizing:border-box;
}

.cm-fixed-footer{
    position:fixed;

    left:0;
    right:0;
    bottom:0;

    z-index:99999;

    width:100%;

    padding:10px 20px;

    font-family:'Inter',sans-serif;

    background:
        linear-gradient(
            180deg,
            rgba(3,13,23,.93),
            rgba(3,10,18,.98)
        );

    border-top:
        1px solid
        rgba(0,158,255,.45);

    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);

    box-shadow:
        0 -15px 40px
        rgba(0,0,0,.42),

        0 -2px 20px
        rgba(0,119,255,.05);
}


.cm-fixed-footer::before{
    content:"";

    position:absolute;

    left:50%;
    top:0;

    transform:translateX(-50%);

    width:500px;
    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #00b7ff,
            transparent
        );

    box-shadow:
        0 0 14px
        rgba(0,180,255,.7);
}


.cm-fixed-footer-inner{
    width:100%;
    max-width:1500px;

    margin:0 auto;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:25px;
}


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

.cm-fixed-footer-text{
    min-width:0;

    display:flex;
    flex-direction:column;

    gap:3px;
}


.cm-fixed-footer-text span{
    color:#8099ae;

    font-size:11px;
    line-height:1.3;

    text-transform:uppercase;

    letter-spacing:1.3px;
}


.cm-fixed-footer-text strong{
    color:#fff;

    font-size:16px;
    line-height:1.25;

    font-weight:700;
}


/* ================================
   BUTTON AREA
================================ */

.cm-fixed-footer-buttons{
    display:flex;
    align-items:center;

    gap:10px;

    flex-shrink:0;
}


.cm-fixed-btn{
    min-height:45px;

    padding:0 17px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    gap:9px;

    border-radius:10px;

    color:#fff;

    text-decoration:none;

    font-size:13px;
    font-weight:700;

    white-space:nowrap;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}


/* CONTACT BUTTON */

.cm-contact-btn{
    border:
        1px solid
        rgba(0,166,255,.8);

    background:
        linear-gradient(
            135deg,
            #0ab7ff,
            #0759e8
        );

    box-shadow:
        0 8px 20px
        rgba(0,100,255,.20);
}


/* WHATSAPP */

.cm-whatsapp-btn{
    border:
        1px solid
        rgba(32,220,116,.65);

    background:
        linear-gradient(
            135deg,
            rgba(10,76,51,.85),
            rgba(5,38,29,.95)
        );

    box-shadow:
        0 8px 20px
        rgba(0,190,90,.10);
}


/* ICON */

.cm-btn-icon{
    width:26px;
    height:26px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:7px;

    background:
        rgba(255,255,255,.09);
}


.cm-btn-icon svg{
    width:16px;
    height:16px;

    fill:none;

    stroke:#fff;

    stroke-width:1.8;

    stroke-linecap:round;
    stroke-linejoin:round;
}


.cm-whatsapp-btn
.cm-btn-icon svg{
    stroke:#2cff89;
}


.cm-btn-arrow{
    font-size:17px;

    transition:
        transform .3s ease;
}


/* HOVER */

.cm-fixed-btn:hover{
    transform:translateY(-2px);
}


.cm-contact-btn:hover{
    box-shadow:
        0 10px 25px
        rgba(0,119,255,.32);
}


.cm-whatsapp-btn:hover{
    border-color:#20e378;

    box-shadow:
        0 10px 25px
        rgba(0,198,92,.15);
}


.cm-fixed-btn:hover
.cm-btn-arrow{
    transform:translateX(3px);
}


/* ================================
   IMPORTANT
   Footer content ko cover na kare
================================ */

body{
    padding-bottom:75px;
}


/* ================================
   TABLET
================================ */

@media(max-width:800px){

    .cm-fixed-footer{
        padding:9px 15px;
    }


    .cm-fixed-footer-text{
        display:none;
    }


    .cm-fixed-footer-buttons{
        width:100%;
    }


    .cm-fixed-btn{
        width:50%;

        min-height:46px;
    }

}


/* ================================
   MOBILE
================================ */

@media(max-width:520px){

    body{
        padding-bottom:68px;
    }


    .cm-fixed-footer{
        padding:
            8px 10px;
    }


    .cm-fixed-footer-buttons{
        gap:7px;
    }


    .cm-fixed-btn{
        min-height:48px;

        padding:
            0 9px;

        border-radius:9px;

        gap:6px;

        font-size:11px;
    }


    .cm-btn-icon{
        width:24px;
        height:24px;
    }


    .cm-btn-icon svg{
        width:15px;
        height:15px;
    }


    .cm-btn-arrow{
        display:none;
    }

}

/* testimonial  */
 .cm-testimonials-section,
.cm-testimonials-section *{
  box-sizing:border-box;
}

.cm-testimonials-section{
  width:100%;
  overflow:hidden;

  font-family:'Inter',sans-serif;
  color:#fff;

  background:
    radial-gradient(circle at 50% 30%,rgba(0,123,255,.08),transparent 34%),
    linear-gradient(180deg,#040914 0%,#02060d 100%);
}

.cm-testimonials-inner{
  max-width:1600px;
  margin:0 auto;

  padding:48px 50px 55px;
}


/* HEADING */

.cm-testimonials-head{
  max-width:720px;
  margin:0 auto 30px;

  text-align:center;
}

.cm-testimonials-tag{
  display:flex;
  align-items:center;
  justify-content:center;

  gap:11px;

  color:#08b5ff;

  font-size:12px;
  font-weight:700;

  letter-spacing:1.6px;
}

.cm-testimonials-tag span{
  width:34px;
  height:1px;

  background:#0aaeff;
}

.cm-testimonials-head h2{
  margin:8px 0 0;

  font-size:42px;
  line-height:1.08;

  font-weight:800;
  letter-spacing:-1.3px;
}

.cm-testimonials-head h2 span{
  color:#08a8ff;
}

.cm-testimonials-head p{
  margin:8px 0 0;

  color:#9daabd;

  font-size:14px;
  line-height:1.45;
}


/* SLIDER AREA */

.cm-testimonials-slider{
  position:relative;

  display:flex;
  align-items:center;

  gap:14px;
}

.cm-testimonials-viewport{
  width:100%;
  overflow:hidden;

  padding:10px 0 14px;
}

.cm-testimonials-track{
  display:flex;

  gap:18px;

  transition:
    transform .65s
    cubic-bezier(.22,.61,.36,1);

  will-change:transform;
}


/* CARD */

.cm-testimonial-card{
  flex:0 0 calc((100% - 36px) / 3);

  min-height:310px;

  padding:22px 20px;

  border-radius:18px;

  border:
    1px solid
    rgba(0,142,255,.58);

  background:
    radial-gradient(circle at 50% 0%,rgba(0,104,255,.10),transparent 30%),
    linear-gradient(145deg,#07162a,#020815);

  box-shadow:
    0 18px 36px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.04);

  transition:
    transform .35s ease,
    border-color .35s ease,
    box-shadow .35s ease;
}

.cm-testimonial-card:hover{
  transform:translateY(-5px);

  border-color:#0ab8ff;

  box-shadow:
    0 24px 44px rgba(0,0,0,.36),
    0 0 22px rgba(0,125,255,.10);
}

.cm-quote{
  color:#00b8ff;

  font-size:58px;
  line-height:.7;

  font-weight:800;

  text-shadow:
    0 0 12px rgba(0,178,255,.40);
}

.cm-testimonial-text{
  min-height:125px;

  margin:18px 0 0;

  color:#f3f6f9;

  font-size:15px;
  line-height:1.62;
}


/* STARS */

.cm-stars{
  margin-top:15px;

  padding-top:13px;

  border-top:
    1px solid
    rgba(0,145,255,.20);

  color:#ffc400;

  font-size:18px;
  letter-spacing:2px;
}


/* CLIENT */

.cm-client-info{
  display:flex;
  align-items:center;

  gap:13px;

  margin-top:15px;
}

.cm-client-logo{
  width:50px;
  height:50px;

  flex:0 0 50px;

  overflow:hidden;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:50%;

  border:
    1px solid
    rgba(0,156,255,.55);

  background:#071526;
}

.cm-client-logo img{
  width:100%;
  height:100%;

  object-fit:cover;
}

.cm-client-info h3{
  margin:0;

  font-size:15px;
  font-weight:700;
}

.cm-client-info span{
  display:block;

  margin-top:3px;

  color:#0aaeff;

  font-size:12px;
}

.cm-client-info small{
  display:block;

  margin-top:3px;

  color:#899bad;

  font-size:11px;
}


/* NAV ARROWS */

.cm-testimonial-nav{
  width:42px;
  height:42px;

  flex:0 0 42px;

  border-radius:50%;

  border:
    1px solid
    rgba(0,145,255,.58);

  background:
    rgba(5,24,42,.92);

  color:#dff5ff;

  font-size:32px;
  line-height:1;

  cursor:pointer;

  box-shadow:
    0 0 16px rgba(0,131,255,.10);

  transition:
    transform .3s ease,
    border-color .3s ease;
}

.cm-testimonial-nav:hover{
  transform:scale(1.08);

  border-color:#0ab8ff;
}


/* DOTS */

.cm-testimonial-dots{
  margin-top:6px;

  display:flex;
  justify-content:center;

  gap:7px;
}

.cm-testimonial-dot{
  width:7px;
  height:7px;

  border:0;

  border-radius:50%;

  padding:0;

  background:#29405e;

  cursor:pointer;

  transition:.3s ease;
}

.cm-testimonial-dot.active{
  width:22px;

  border-radius:20px;

  background:#00b8ff;

  box-shadow:
    0 0 9px rgba(0,184,255,.65);
}


/* TABLET */

@media(max-width:1000px){

  .cm-testimonial-card{
    flex:0 0 calc((100% - 18px) / 2);
  }

}


/* MOBILE */

@media(max-width:650px){

  .cm-testimonials-inner{
    padding:38px 20px 45px;
  }

  .cm-testimonials-head h2{
    font-size:30px;
  }

  .cm-testimonials-head p{
    font-size:13px;
  }

  .cm-testimonials-slider{
    gap:7px;
  }

  .cm-testimonial-card{
    flex:0 0 100%;

    min-height:300px;

    padding:20px 17px;
  }

  .cm-testimonial-text{
    font-size:14px;
  }

  .cm-testimonial-nav{
    width:34px;
    height:34px;

    flex-basis:34px;

    font-size:25px;
  }

}
/* project  */

 .cm-projects-section,
.cm-projects-section *{
  box-sizing:border-box;
}

.cm-projects-section{
  width:100%;
  overflow:hidden;

  font-family:'Inter',sans-serif;
  color:#fff;

  background:
    radial-gradient(
      circle at 50% 15%,
      rgba(0,111,255,.08),
      transparent 35%
    ),
    linear-gradient(
      180deg,
      #030914 0%,
      #02060d 100%
    );
}

.cm-projects-inner{
  width:100%;
  max-width:1600px;

  margin:0 auto;

  padding:52px 50px 60px;
}


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

.cm-projects-head{
  max-width:850px;
  margin:0 auto 28px;

  text-align:center;
}

.cm-projects-tag{
  display:flex;
  align-items:center;
  justify-content:center;

  gap:12px;

  color:#0ab5ff;

  font-size:12px;
  font-weight:700;

  letter-spacing:1.8px;
}

.cm-projects-tag span{
  width:40px;
  height:1px;

  background:#0baeff;
}

.cm-projects-head h2{
  margin:9px 0 0;

  font-size:44px;
  line-height:1.08;

  font-weight:800;

  letter-spacing:-1.4px;
}

.cm-projects-head h2 span{
  color:#08a7ff;
}

.cm-projects-head p{
  margin:10px auto 0;

  color:#99aabd;

  font-size:15px;
  line-height:1.5;
}


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

.cm-project-tabs{
  display:flex;
  justify-content:center;

  gap:10px;

  margin-bottom:22px;
}

.cm-project-tab{
  min-width:220px;
  min-height:48px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  gap:10px;

  border:
    1px solid
    rgba(74,117,163,.30);

  border-radius:10px;

  background:
    rgba(7,20,38,.85);

  color:#d7e2ed;

  font-family:'Inter',sans-serif;

  font-size:14px;
  font-weight:600;

  cursor:pointer;

  transition:.3s ease;
}

.cm-project-tab-icon{
  width:26px;
  height:26px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:7px;

  color:#7da4c3;

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

.cm-project-tab.active{
  color:#fff;

  border-color:#0ab2ff;

  background:
    linear-gradient(
      135deg,
      rgba(5,92,165,.52),
      rgba(5,39,79,.82)
    );

  box-shadow:
    0 0 18px
    rgba(0,146,255,.10);
}

.cm-project-tab.active
.cm-project-tab-icon{
  color:#1ec4ff;
}


/* ===============================
   PANELS
================================ */

.cm-project-panel{
  display:none;

  animation:
    cmProjectFade .45s ease;
}

.cm-project-panel.active{
  display:block;
}

@keyframes cmProjectFade{

  from{
    opacity:0;
    transform:translateY(7px);
  }

  to{
    opacity:1;
    transform:none;
  }

}


/* ===============================
   PANEL BOX
================================ */

.cm-project-panel{
  padding:20px 22px;

  border:
    1px solid
    rgba(39,97,147,.28);

  border-radius:16px;

  background:
    linear-gradient(
      145deg,
      rgba(4,16,30,.78),
      rgba(2,9,19,.88)
    );
}

.cm-project-panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:25px;

  margin-bottom:17px;
}

.cm-project-panel-head h3{
  margin:0;

  font-size:20px;
  line-height:1.2;

  font-weight:750;
}

.cm-project-panel-head p{
  margin:5px 0 0;

  color:#899cad;

  font-size:13px;
}

.cm-project-panel-link{
  color:#0db8ff;

  font-size:12px;

  white-space:nowrap;
}


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

.cm-software-grid{
  display:grid;

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

  gap:20px;
}


/* SOFTWARE CARD */

.cm-software-card{
  position:relative;

  overflow:hidden;

  border:
    1px solid
    rgba(0,139,255,.45);

  border-radius:15px;

  background:
    linear-gradient(
      145deg,
      #061528,
      #020915
    );

  box-shadow:
    0 16px 30px
    rgba(0,0,0,.27);

  transition:
    transform .35s ease,
    border-color .35s ease,
    box-shadow .35s ease;
}

.cm-software-card:hover{
  transform:
    translateY(-5px);

  border-color:#0ab2ff;

  box-shadow:
    0 22px 40px
    rgba(0,0,0,.34),

    0 0 24px
    rgba(0,126,255,.08);
}


/* VIDEO */

.cm-video-box{
  position:relative;

  aspect-ratio:16/9;

  overflow:hidden;

  background:#07121e;
}

.cm-project-poster{
  width:100%;
  height:100%;

  display:block;

  object-fit:cover;

  transition:
    transform .4s ease;
}

.cm-software-card:hover
.cm-project-poster{
  transform:scale(1.025);
}


/* NUMBER */

.cm-project-number{
  position:absolute;

  left:12px;
  top:12px;

  z-index:3;

  min-width:33px;
  height:27px;

  display:flex;
  align-items:center;
  justify-content:center;

  padding:0 7px;

  border:
    1px solid
    rgba(0,167,255,.8);

  border-radius:6px;

  color:#25c6ff;

  background:
    rgba(2,20,38,.90);

  font-size:11px;
  font-weight:700;
}


/* PLAY BUTTON */

.cm-video-play{
  position:absolute;

  left:50%;
  top:50%;

  z-index:3;

  transform:
    translate(-50%,-50%);

  width:56px;
  height:56px;

  display:flex;
  align-items:center;
  justify-content:center;

  padding-left:4px;

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

  border-radius:50%;

  color:#fff;

  background:
    rgba(0,8,18,.68);

  backdrop-filter:blur(5px);

  cursor:pointer;

  font-size:20px;

  transition:.3s ease;
}

.cm-video-play:hover{
  transform:
    translate(-50%,-50%)
    scale(1.08);

  background:
    rgba(0,118,255,.75);

  border-color:#15c4ff;
}


/* TIME */

.cm-video-duration{
  position:absolute;

  right:9px;
  bottom:8px;

  z-index:3;

  padding:4px 7px;

  border-radius:5px;

  color:#fff;

  background:
    rgba(0,0,0,.78);

  font-size:10px;
}


/* CONTENT */

.cm-software-content{
  padding:16px;
}

.cm-software-content h4{
  margin:0;

  font-size:17px;
  line-height:1.25;

  font-weight:700;
}

.cm-software-content p{
  min-height:63px;

  margin:8px 0 0;

  color:#98aabc;

  font-size:12px;
  line-height:1.55;
}


/* WATCH BUTTON */

.cm-watch-video{
  display:inline-flex;
  align-items:center;

  gap:8px;

  margin-top:11px;

  padding:0 0 5px;

  border:0;
  border-bottom:
    1px solid
    rgba(0,174,255,.8);

  color:#0dbaff;

  background:none;

  font-family:'Inter',sans-serif;

  font-size:12px;
  font-weight:650;

  cursor:pointer;
}

.cm-watch-video span{
  width:19px;
  height:19px;

  display:flex;
  align-items:center;
  justify-content:center;

  border:
    1px solid
    #0dbaff;

  border-radius:50%;

  font-size:8px;
}


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

.cm-web-grid{
  display:grid;

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

  gap:18px;
}

.cm-web-card{
  overflow:hidden;

  border:
    1px solid
    rgba(0,129,220,.35);

  border-radius:14px;

  background:
    linear-gradient(
      145deg,
      #061528,
      #020915
    );

  transition:
    transform .35s ease,
    border-color .35s ease,
    box-shadow .35s ease;
}

.cm-web-card:hover{
  transform:
    translateY(-5px);

  border-color:
    rgba(0,177,255,.75);

  box-shadow:
    0 20px 35px
    rgba(0,0,0,.30);
}


/* WEBSITE PREVIEW */

.cm-web-preview{
  aspect-ratio:16/10;

  overflow:hidden;

  padding:12px 12px 0;
}

.cm-web-preview img{
  width:100%;
  height:100%;

  display:block;

  object-fit:cover;

  object-position:top;

  border-radius:8px;

  transition:
    transform .5s ease;
}

.cm-web-card:hover
.cm-web-preview img{
  transform:
    scale(1.025);
}


/* WEB CONTENT */

.cm-web-content{
  padding:14px 15px 16px;
}

.cm-web-content h4{
  margin:0;

  font-size:15px;
  line-height:1.3;

  font-weight:700;
}

.cm-web-content p{
  margin:5px 0 0;

  color:#879aab;

  font-size:11px;
  line-height:1.4;
}

.cm-web-content a{
  display:inline-flex;
  align-items:center;

  gap:7px;

  margin-top:11px;

  padding-bottom:4px;

  border-bottom:
    1px solid
    rgba(0,173,255,.65);

  color:#0bb8ff;

  text-decoration:none;

  font-size:12px;
  font-weight:650;
}

.cm-web-content a span{
  font-size:15px;

  transition:
    transform .3s ease;
}

.cm-web-content a:hover span{
  transform:
    translate(2px,-2px);
}


/* ===============================
   VIDEO MODAL
================================ */

.cm-video-modal{
  position:fixed;

  inset:0;

  z-index:999999;

  display:none;

  align-items:center;
  justify-content:center;

  padding:30px;
}

.cm-video-modal.active{
  display:flex;
}

.cm-video-modal-backdrop{
  position:absolute;

  inset:0;

  background:
    rgba(0,4,10,.88);

  backdrop-filter:blur(7px);
}

.cm-video-modal-box{
  position:relative;
  z-index:2;

  width:min(100%,1000px);

  overflow:hidden;

  border:
    1px solid
    rgba(0,160,255,.65);

  border-radius:16px;

  background:#000;

  box-shadow:
    0 25px 80px
    rgba(0,0,0,.60);
}

.cm-video-modal-box video{
  width:100%;

  display:block;

  aspect-ratio:16/9;

  background:#000;
}

.cm-video-close{
  position:absolute;

  right:10px;
  top:10px;

  z-index:10;

  width:36px;
  height:36px;

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

  border-radius:50%;

  color:#fff;

  background:
    rgba(0,0,0,.75);

  cursor:pointer;

  font-size:24px;
}


/* ===============================
   TABLET
================================ */

@media(max-width:1050px){

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

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

}


/* ===============================
   MOBILE
================================ */

@media(max-width:650px){

  .cm-projects-inner{
    padding:
      38px 20px 45px;
  }

  .cm-projects-head h2{
    font-size:31px;
  }

  .cm-projects-head p{
    font-size:13px;
  }

  .cm-project-tabs{
    width:100%;
  }

  .cm-project-tab{
    width:50%;

    min-width:0;

    padding:0 8px;

    font-size:12px;
  }

  .cm-project-panel{
    padding:
      16px 12px;
  }

  .cm-project-panel-head{
    align-items:flex-start;

    flex-direction:column;

    gap:6px;
  }

  .cm-project-panel-head h3{
    font-size:18px;
  }

  .cm-software-grid,
  .cm-web-grid{
    grid-template-columns:1fr;
  }

  .cm-software-content p{
    min-height:auto;
  }

}