/* =========================================================

   SECTION PROCESS

========================================================= */



.section-process{



    position:relative;



    overflow:hidden;



    background:#020817;



    padding:16px;



}



/* =========================================================

   CONTAINER

========================================================= */



.section-process__container{



    max-width:95%;



    margin:0 auto;



    display:grid;



    grid-template-columns:1.45fr 1fr;



    gap:14px;



    align-items:start;



}



/* =========================================================

   LEFT / RIGHT

========================================================= */



.section-process__left,

.section-process__right{



    background:

        linear-gradient(

            180deg,

            rgba(6,18,48,0.96),

            rgba(4,13,35,0.98)

        );



    border:1px solid rgba(255,255,255,0.05);



    border-radius:16px;



    padding:16px;



    position:relative;



    overflow:hidden;



}



/* =========================================================

   TITLE

========================================================= */



.section-process__title{



    color:#ffffff;



    font-size:14px;



    font-weight:700;



    margin-bottom:18px;



    line-height:1.3;



}



/* =========================================================

   STEPS

========================================================= */



.section-process__steps{



    display:flex;



    align-items:flex-start;



    justify-content:space-between;



    gap:8px;



    margin-bottom:18px;



}



/* =========================================================

   STEP

========================================================= */



.section-process__step{



    flex:1;



    text-align:center;



    position:relative;



}



.section-process__step-icon{



    width:44px;

    height:44px;



    margin:0 auto 12px;



    border-radius:999px;



    background:

        linear-gradient(

            180deg,

            #2563eb,

            #1d4ed8

        );



    display:flex;



    align-items:center;



    justify-content:center;



    box-shadow:

        0 0 20px rgba(37,99,235,0.25);



}



.section-process__step-icon svg{



    width:18px;

    height:18px;



    color:#ffffff;



    stroke-width:2;



}



.section-process__step-content strong{



    display:block;



    color:#ffffff;



    font-size:12px;



    font-weight:700;



    margin-bottom:6px;



    line-height:1.4;



}



.section-process__step-content p{



    color:rgba(255,255,255,0.68);



    font-size:11px;



    line-height:1.8;



}



/* =========================================================

   SEPARATOR

========================================================= */



.section-process__separator{



    flex-shrink:0;



    width:40px;



    height:1px;



    margin-top:22px;



    background:

        linear-gradient(

            90deg,

            rgba(59,130,246,0),

            rgba(59,130,246,0.35),

            rgba(59,130,246,0)

        );



}



/* =========================================================

   CTA

========================================================= */



.section-process__cta{



    display:flex;



    align-items:center;



    justify-content:space-between;



    gap:18px;



    padding:16px;



    border-radius:16px;



    background:

        linear-gradient(

            90deg,

            rgba(7,22,58,0.98),

            rgba(4,14,40,0.98)

        );



    border:1px solid rgba(255,255,255,0.05);



}



.section-process__cta-left{



    display:flex;



    align-items:center;



    gap:16px;



}



.section-process__cta-icon{



    width:52px;

    height:52px;



    border-radius:999px;



    border:2px solid rgba(59,130,246,0.7);



    display:flex;



    align-items:center;



    justify-content:center;



    flex-shrink:0;



}



.section-process__cta-icon svg{



    width:22px;

    height:22px;



    color:#ffffff;



}



.section-process__cta-content strong{



    display:block;



    color:#ffffff;



    font-size:13px;



    font-weight:700;



    margin-bottom:4px;



}



.section-process__cta-content p{



    color:rgba(255,255,255,0.68);



    font-size:11px;



    line-height:1.7;



}



.section-process__cta-button{



    height:40px;



    padding:0 18px;



    border-radius:10px;



    background:

        linear-gradient(

            90deg,

            #2563eb,

            #3b82f6

        );



    display:inline-flex;



    align-items:center;



    gap:10px;



    text-decoration:none;



    color:#ffffff;



    font-size:12px;



    font-weight:600;



    flex-shrink:0;



    transition:0.2s ease;



}



.section-process__cta-button:hover{



    transform:translateY(-1px);



}



.section-process__cta-button svg{



    width:16px;

    height:16px;



}



/* =========================================================

   BENEFITS

========================================================= */



.section-process__benefits{



    display:grid;



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



    gap:14px;



}



/* =========================================================

   BENEFIT

========================================================= */



.section-process__benefit{



    text-align:center;



}



.section-process__benefit-icon{



    width:50px;

    height:50px;



    margin:0 auto 14px;



    border-radius:999px;



    background:

        linear-gradient(

            180deg,

            rgba(37,99,235,0.22),

            rgba(37,99,235,0.08)

        );



    display:flex;



    align-items:center;



    justify-content:center;



}



.section-process__benefit-icon svg{



    width:22px;

    height:22px;



    color:#3b82f6;



    stroke-width:2;



}



.section-process__benefit strong{



    display:block;



    color:#ffffff;



    font-size:12px;



    line-height:1.5;



    margin-bottom:8px;



}



.section-process__benefit p{



    color:rgba(255,255,255,0.66);



    font-size:11px;



    line-height:1.8;



}



/* =========================================================

   RESPONSIVE

========================================================= */



@media(max-width:1200px){



    .section-process__container{



        grid-template-columns:1fr;



    }



}



@media(max-width:900px){



    .section-process__steps{



        flex-wrap:wrap;



    }



    .section-process__separator{



        display:none;



    }



    .section-process__benefits{



        grid-template-columns:1fr 1fr;



    }



    .section-process__cta{



        flex-direction:column;



        align-items:flex-start;



    }



}



@media(max-width:640px){



    .section-process{



        padding:14px;



    }



    .section-process__benefits{



        grid-template-columns:1fr;



    }



    .section-process__steps{



        flex-direction:column;



    }



}