.elementor-9024 .elementor-element.elementor-element-1e8678f{--display:flex;}.elementor-9024 .elementor-element.elementor-element-cdef3e8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9024 .elementor-element.elementor-element-3668488{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9024 .elementor-element.elementor-element-aeb9808{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9024 .elementor-element.elementor-element-d5cc77b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9024 .elementor-element.elementor-element-ee36d7d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-249b1fe *//*=========================================
            META HERO SECTION
=========================================*/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

.meta-hero{

    min-height:100vh;
    display:flex;
    align-items:center;
    padding:100px 8%;

    background:linear-gradient(
        135deg,
        #02101F 0%,
        #04233E 30%,
        #074B67 65%,
        #0A6B68 85%,
        #138A67 100%
    );

}

.container{

    width:100%;
    max-width:1300px;
    margin:auto;

}

.hero-content{

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

}

.hero-left{

    flex:1;

}

.hero-badge{

    display:inline-block;

    padding:10px 22px;

    border-radius:40px;

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

    color:#fff;

    font-size:15px;

    font-weight:600;

    margin-bottom:25px;

    backdrop-filter:blur(10px);

}

.hero-left h1{

    font-size:60px;

    line-height:1.15;

    color:#fff;

    font-weight:800;

    margin-bottom:40px;

}

.hero-left h1 span{

    display:block;

    color:#7CFF8A;

}

.hero-buttons{

    display:flex;

    gap:15px;

    flex-wrap:wrap;

}

.btn-primary{

    padding:12px 24px;

    background:#4FAF8F;

    color:#fff;

    text-decoration:none;

    border-radius:35px;

    font-size:15px;

    font-weight:600;

    transition:.35s;

}

.btn-primary:hover{

    background:#43A483;

    transform:translateY(-3px);

}

.btn-secondary{

    padding:12px 24px;

    border:1.5px solid rgba(255,255,255,.4);

    color:#fff;

    text-decoration:none;

    border-radius:35px;

    font-size:15px;

    font-weight:600;

    transition:.35s;

}

.btn-secondary:hover{

    background:#fff;

    color:#071A2D;

}

.hero-right{

    flex:1;

    text-align:center;

}

.hero-right img{

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

}

@media(max-width:991px){

.hero-content{

flex-direction:column;

text-align:center;

}

.hero-left h1{

font-size:46px;

}

.hero-buttons{

justify-content:center;

}

}

@media(max-width:576px){

.meta-hero{

padding:80px 20px;

}

.hero-left h1{

font-size:34px;

}

.hero-right img{

max-width:100%;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-e1356f5 *//*.why-content strong{*/

/*    color:#4FAF8F;*/
/*    font-weight:700;*/

/*}*/
/*=========================================
        WHY META ADS SECTION
=========================================*/

.why-meta{
    padding:100px 8%;
    background:#fff;
}

.why-meta .container{
    max-width:1300px;
    margin:auto;
}

.why-wrapper{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:70px;
}

/*.why-image{*/
/*    flex:1;*/
/*    text-align:center;*/
/*}*/

/*.why-image img{*/
/*    width:100%;*/
/*    max-width:520px;*/
/*    transition:.4s ease;*/
/*}*/
.why-image{

    flex:1;
    text-align:center;

}

.why-image img{

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

    background:#F8FAFC;
    padding:25px;
    border-radius:25px;
    box-shadow:0 20px 40px rgba(0,0,0,.08);

    transition:.4s ease;

}

.why-image img:hover{

    transform:translateY(-8px);

}
.why-image img:hover{
    transform:translateY(-8px);
}

.why-content{
    flex:1;
}

.section-tag{

    display:inline-block;
    padding:10px 22px;
    background:#EAF8EC;
    color:#4FAF8F;
    border-radius:30px;
    font-size:15px;
    font-weight:600;
    margin-bottom:20px;
}

.why-content h2{

    font-size:46px;
    color:#071A2D;
    line-height:1.25;
    margin-bottom:25px;
    font-weight:700;
}

.why-content p{

    color:#5F6B7A;
    font-size:17px;
    line-height:1.9;
    margin-bottom:22px;
}

.why-content strong{

    color:#4FAF8F;
    font-weight:700;
}






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

@media(max-width:991px){

.why-wrapper{

    flex-direction:column;
    text-align:center;
}

.why-content{

    order:2;
}

.why-image{

    order:1;
}

.why-content h2{

    font-size:38px;
}

.why-image img{

    max-width:420px;
}

}

@media(max-width:768px){

.why-meta{

    padding:80px 25px;
}

.why-content h2{

    font-size:32px;
}

.why-content p{

    font-size:16px;
}

}

@media(max-width:576px){

.why-image img{

    max-width:100%;
}

.section-tag{

    font-size:14px;
}

.why-content h2{

    font-size:28px;
}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-0635adc */*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
font-family:Poppins,sans-serif;
background:#f8fbfa;
}

.meta-services{
padding:100px 8%;
position:relative;
overflow:hidden;
}

.container{
max-width:1200px;
margin:auto;
}

.section-heading{
text-align:center;
margin-bottom:80px;
}

.section-heading span{
color:#4FAF8F;
font-weight:600;
letter-spacing:2px;
}

.section-heading h2{
font-size:44px;
margin:15px 0;
color:#071A2D;
}

.section-heading p{
max-width:760px;
margin:auto;
color:#666;
line-height:1.8;
}

/* center line */

.meta-services::before{
content:"";
position:absolute;
left:50%;
top:260px;
width:3px;
height:100%;
background:#4FAF8F;
transform:translateX(-50%);
}

.service-row{
display:grid;
grid-template-columns:1fr 1fr;
gap:70px;
align-items:center;
margin-bottom:90px;
position:relative;
}

.reverse .service-content{
order:2;
}

.reverse .service-image{
order:1;
}

.service-content{
background:#fff;
padding:45px;
border-radius:20px;
box-shadow:0 12px 35px rgba(0,0,0,.08);
position:relative;
transition:.45s;
}

.service-content::before{
content:"";
position:absolute;
left:-15px;
top:50%;
width:30px;
height:30px;
background:#4FAF8F;
border-radius:50%;
transform:translateY(-50%);
box-shadow:0 0 0 8px #fff;
}

.reverse .service-content::before{
left:auto;
right:-15px;
}

.service-number{
display:inline-block;
font-size:52px;
font-weight:700;
color:#4FAF8F20;
margin-bottom:10px;
}

.service-content h3{
font-size:28px;
margin-bottom:15px;
color:#071A2D;
}

.service-content p{
color:#666;
line-height:1.9;
}

.service-image{
overflow:hidden;
border-radius:25px;
box-shadow:0 20px 45px rgba(0,0,0,.12);
}

.service-image img{
width:100%;
display:block;
transition:.6s;
}

.service-row:hover img{
transform:scale(1.08);
}

.service-row:hover .service-content{
transform:translateY(-10px);
box-shadow:0 25px 55px rgba(79,175,143,.25);
}

.service-row:hover .service-number{
color:#4FAF8F;
transition:.4s;
}

.service-content::after{
content:"";
position:absolute;
bottom:0;
left:0;
width:0;
height:4px;
background:#4FAF8F;
transition:.5s;
}

.service-row:hover .service-content::after{
width:100%;
}

@media(max-width:991px){

.meta-services::before{
display:none;
}

.service-row{
grid-template-columns:1fr;
gap:30px;
}

.reverse .service-content,
.reverse .service-image{
order:unset;
}

.service-content::before{
display:none;
}

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

.service-content{
padding:30px;
}

.service-content h3{
font-size:24px;
}

.service-number{
font-size:42px;
}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-9f96b51 *//*==============================
        WHO BENEFITS SECTION
===============================*/

.who-benefits{
    padding:100px 8%;
    background:#fff;
    overflow:hidden;
}

.who-benefits .container{
    max-width:1300px;
    margin:auto;
    display:grid;
    grid-template-columns:1.05fr 1.15fr;
    gap:80px;
    align-items:center;
}

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

.sub-title{
    display:inline-block;
    color:#4FAF8F;
    font-size:15px;
    font-weight:600;
    letter-spacing:2px;
    text-transform:uppercase;
    margin-bottom:18px;
}

.benefits-left h2{
    font-size:46px;
    line-height:1.2;
    color:#071A2D;
    margin-bottom:22px;
}

.intro{
    font-size:17px;
    color:#666;
    line-height:1.8;
    margin-bottom:40px;
}

.benefit-list{
    display:flex;
    flex-direction:column;
    gap:18px;
}

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

.benefit-item{

    position:relative;
    overflow:hidden;

    display:flex;
    gap:18px;

    padding:20px;

    border-radius:18px;

    transition:all .45s ease;

    cursor:pointer;

    background:#fff;

    will-change:transform;
}

/* Shine Animation */

.benefit-item::before{

    content:"";

    position:absolute;

    top:0;
    left:-120%;

    width:60%;
    height:100%;

    background:linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,.35),
        transparent
    );

    transform:skewX(-25deg);

    transition:.8s;
}

.benefit-item:hover::before{

    left:150%;
}

/* Hover */

.benefit-item:hover{

    background:linear-gradient(135deg,#4FAF8F,#2E8B57);

    transform:translateY(-8px);

    box-shadow:
    0 20px 40px rgba(79,175,143,.30),
    0 0 25px rgba(79,175,143,.20);

}

/* Icon */

.icon{

    width:52px;
    height:52px;

    min-width:52px;

    border-radius:50%;

    background:#4FAF8F;

    color:#fff;

    display:flex;

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

    font-size:20px;

    transition:.4s;
}

.benefit-item:hover .icon{

    background:#fff;

    color:#4FAF8F;

    transform:rotate(15deg) scale(1.1);
}

/* Heading */

.benefit-item h4{

    color:#071A2D;

    font-size:21px;

    margin-bottom:6px;

    transition:.35s;
}

/* Paragraph */

.benefit-item p{

    color:#666;

    font-size:15px;

    line-height:1.8;

    transition:.35s;
}

/* Text Hover */

.benefit-item:hover h4,
.benefit-item:hover p{

    color:#fff;
}

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

.benefits-right{

    position:relative;

    display:flex;

    justify-content:flex-end;

    align-self:flex-start;
}

.benefits-right img{

    width:100%;

    height:650px;

    object-fit:cover;

    border-radius:32px;

    flex-shrink:0;

    box-shadow:0 30px 70px rgba(0,0,0,.15);

    transition:.6s;
}

.benefits-right:hover img{

    transform:scale(1.04);
}

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

.floating-box{

    position:absolute;

    bottom:25px;
    left:-25px;

    width:170px;

    background:#4FAF8F;

    color:#fff;

    padding:18px;

    border-radius:18px;

    text-align:center;

    box-shadow:0 18px 40px rgba(79,175,143,.35);

    animation:float 3s ease-in-out infinite;

    transition:.4s;
}

.floating-box:hover{

    transform:translateY(-6px) scale(1.05);

    box-shadow:0 25px 55px rgba(79,175,143,.45);
}

.floating-box h3{

    font-size:28px;

    margin-bottom:5px;

    color:#fff;
}

.floating-box span{

    color:#fff;

    font-size:14px;

    line-height:1.5;
}

/*==============================
        FLOAT
===============================*/

@keyframes float{

0%{
transform:translateY(0);
}

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

100%{
transform:translateY(0);
}

}

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

@media(max-width:991px){

.who-benefits{

padding:80px 6%;

}

.who-benefits .container{

grid-template-columns:1fr;

gap:60px;

}

.benefits-left h2{

font-size:36px;

}

.intro{

font-size:16px;

}

.benefits-right img{

height:500px;

}

.floating-box{

left:20px;

bottom:20px;

width:165px;

}

}

@media(max-width:576px){

.benefits-left h2{

font-size:30px;

}

.benefits-right img{

height:380px;

}

.benefit-item{

padding:16px;

}

.icon{

width:45px;

height:45px;

min-width:45px;

font-size:18px;

}

.benefit-item h4{

font-size:18px;

}

.benefit-item p{

font-size:14px;

}

.floating-box{

width:150px;

padding:15px;

}

.floating-box h3{

font-size:24px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-03037dc *//*==============================
      META WORKFLOW SECTION
==============================*/

.meta-workflow{
    padding:100px 8%;
    background:#f8fbfa;
}

.meta-workflow .container{
    max-width:1250px;
    margin:auto;
}

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

.workflow-heading{
    text-align:center;
    margin-bottom:60px;
}

.workflow-heading span{
    display:inline-block;
    color:#4FAF8F;
    font-weight:600;
    letter-spacing:2px;
    text-transform:uppercase;
    margin-bottom:15px;
}

.workflow-heading h2{
    font-size:46px;
    color:#071A2D;
    margin-bottom:20px;
}

.workflow-heading p{
    max-width:760px;
    margin:auto;
    color:#666;
    line-height:1.8;
}

/*==============================
      HIDE RADIO BUTTONS
==============================*/

.meta-workflow input[type="radio"]{
    display:none;
}

/*==============================
          TABS
==============================*/

.workflow-tabs{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:18px;
    margin-bottom:50px;
}

.workflow-tabs label{

    cursor:pointer;

    padding:18px 28px;

    background:#fff;

    border-radius:14px;

    font-weight:600;

    color:#071A2D;

    transition:.4s;

    box-shadow:0 10px 25px rgba(0,0,0,.06);

    display:flex;

    align-items:center;

    gap:12px;

    border:2px solid transparent;
}

.workflow-tabs label span{

    width:38px;
    height:38px;

    background:#4FAF8F;

    color:#fff;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:14px;

    transition:.4s;
}

.workflow-tabs label:hover{

    transform:translateY(-6px);

    box-shadow:0 18px 35px rgba(79,175,143,.25);
}

/*==============================
      ACTIVE TAB
==============================*/

#tab1:checked ~ .workflow-tabs label[for="tab1"],
#tab2:checked ~ .workflow-tabs label[for="tab2"],
#tab3:checked ~ .workflow-tabs label[for="tab3"],
#tab4:checked ~ .workflow-tabs label[for="tab4"],
#tab5:checked ~ .workflow-tabs label[for="tab5"]{

    background:#4FAF8F;

    color:#fff;

    border-color:#4FAF8F;

    box-shadow:0 20px 40px rgba(79,175,143,.35);

}

#tab1:checked ~ .workflow-tabs label span,
#tab2:checked ~ .workflow-tabs label span,
#tab3:checked ~ .workflow-tabs label span,
#tab4:checked ~ .workflow-tabs label span,
#tab5:checked ~ .workflow-tabs label span{

    background:#fff;

    color:#4FAF8F;
}

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

.workflow-content{

    background:#fff;

    border-radius:24px;

    padding:45px;

    box-shadow:0 20px 60px rgba(0,0,0,.08);
}

.content-box{

    display:none;

    grid-template-columns:1fr 1fr;

    gap:60px;

    align-items:center;

    animation:fade .5s ease;
}

@keyframes fade{

    from{
        opacity:0;
        transform:translateY(15px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}

/*==============================
      SHOW ACTIVE CONTENT
==============================*/

#tab1:checked ~ .workflow-content .content1{
    display:grid;
}

#tab2:checked ~ .workflow-content .content2{
    display:grid;
}

#tab3:checked ~ .workflow-content .content3{
    display:grid;
}

#tab4:checked ~ .workflow-content .content4{
    display:grid;
}

#tab5:checked ~ .workflow-content .content5{
    display:grid;
}

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

.left h3{

    font-size:36px;

    color:#071A2D;

    margin-bottom:20px;
}

.left p{

    color:#666;

    line-height:1.9;

    margin-bottom:25px;
}

.left ul{

    list-style:none;

    padding:0;
}

.left ul li{

    margin-bottom:14px;

    padding-left:30px;

    position:relative;

    color:#555;

    font-size:16px;
}

.left ul li::before{

    content:"✔";

    position:absolute;

    left:0;

    color:#4FAF8F;

    font-weight:bold;
}

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

.right{

    overflow:hidden;

    border-radius:20px;
}

.right img{

    width:100%;

    height:450px;

    object-fit:cover;

    border-radius:20px;

    transition:.5s;
}

.right:hover img{

    transform:scale(1.05);
}

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

@media(max-width:991px){

.workflow-heading h2{

    font-size:36px;
}

.workflow-content{

    padding:30px;
}

.content-box{

    grid-template-columns:1fr;

    gap:35px;
}

.right img{

    height:320px;
}

.workflow-tabs{

    gap:12px;
}

.workflow-tabs label{

    padding:14px 18px;

    font-size:14px;
}

}

@media(max-width:576px){

.meta-workflow{

    padding:80px 5%;
}

.workflow-heading h2{

    font-size:30px;
}

.left h3{

    font-size:28px;
}

.right img{

    height:240px;
}

.workflow-tabs{

    flex-direction:column;
}

.workflow-tabs label{

    justify-content:center;
}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-5032b11 *//*==================================================
            META FAQ SECTION
===================================================*/

.meta-faq{
    padding:100px 8%;
    background:#f8fbfa;
}

.meta-faq .container{
    max-width:1300px;
    margin:auto;
}

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

.faq-heading{
    text-align:center;
    margin-bottom:60px;
}

.faq-heading span{
    display:inline-block;
    color:#4FAF8F;
    font-size:15px;
    font-weight:600;
    letter-spacing:2px;
    text-transform:uppercase;
    margin-bottom:15px;
}

.faq-heading h2{
    font-size:46px;
    color:#071A2D;
    margin-bottom:20px;
}

.faq-heading p{
    max-width:720px;
    margin:auto;
    color:#666;
    line-height:1.8;
}

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

.faq-wrapper{

    display:grid;

    grid-template-columns:430px 1fr;

    gap:60px;

    align-items:flex-start;

}

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

.contact-card{

    background:#fff;

    padding:40px;

    border-radius:25px;

    box-shadow:0 18px 45px rgba(0,0,0,.08);

    transition:.4s;

    position:sticky;

    top:100px;

}

.contact-card:hover{

    transform:translateY(-8px);

    box-shadow:0 25px 60px rgba(79,175,143,.20);

}

.contact-card h3{

    font-size:30px;

    color:#071A2D;

    margin-bottom:15px;

}

.contact-card p{

    color:#666;

    line-height:1.8;

    margin-bottom:30px;

}

/*==================================================
            INPUTS
===================================================*/

.input-box{

    margin-bottom:18px;

}

.input-box input,
.input-box textarea{

    width:100%;

    padding:16px 18px;

    border:2px solid #e7e7e7;

    border-radius:14px;

    font-size:15px;

    outline:none;

    transition:.35s;

    font-family:inherit;

    background:#fff;

}

.input-box textarea{

    height:140px;

    resize:none;

}

.input-box input:focus,
.input-box textarea:focus{

    border-color:#4FAF8F;

    box-shadow:0 0 15px rgba(79,175,143,.15);

}

/*==================================================
            BUTTON
===================================================*/

.contact-card button{

    width:100%;

    padding:18px;

    border:none;

    border-radius:14px;

    background:#4FAF8F;

    color:#fff;

    font-size:16px;

    font-weight:600;

    cursor:pointer;

    transition:.4s;

}

.contact-card button:hover{

    background:#3d9f80;

    transform:translateY(-3px);

    box-shadow:0 15px 35px rgba(79,175,143,.35);

}

/*==================================================
            FAQ BOX
===================================================*/

.faq-box{

    display:flex;

    flex-direction:column;

    gap:18px;

}

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

.faq-box details{

    background:#fff;

    border-radius:18px;

    overflow:hidden;

    box-shadow:0 10px 30px rgba(0,0,0,.06);

    transition:.35s;

    border:2px solid transparent;

}

.faq-box details:hover{

    border-color:#4FAF8F;

    box-shadow:0 20px 40px rgba(79,175,143,.15);

}

.faq-box details[open]{

    border-color:#4FAF8F;

}

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

.faq-box summary{

    list-style:none;

    cursor:pointer;

    padding:24px 28px;

    font-size:18px;

    font-weight:600;

    color:#071A2D;

    position:relative;

    transition:.3s;

}

.faq-box summary:hover{

    color:#4FAF8F;

}

.faq-box summary::-webkit-details-marker{

    display:none;

}

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

.faq-box summary::after{

    content:"+";

    position:absolute;

    right:28px;

    top:50%;

    transform:translateY(-50%);

    width:36px;

    height:36px;

    border-radius:50%;

    background:#F1FBF8;

    color:#4FAF8F;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:22px;

    font-weight:bold;

    transition:.35s;

}

.faq-box details[open] summary::after{

    transform:translateY(-50%) rotate(45deg);

    background:#4FAF8F;

    color:#fff;

}

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

.faq-box details p{

    padding:0 28px 24px;

    color:#666;

    line-height:1.9;

    animation:fade .35s ease;

}

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

@keyframes fade{

    from{

        opacity:0;

        transform:translateY(-10px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

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

@media(max-width:991px){

.faq-wrapper{

    grid-template-columns:1fr;

    gap:40px;

}

.contact-card{

    position:relative;

    top:0;

}

.faq-heading h2{

    font-size:36px;

}

}

@media(max-width:576px){

.meta-faq{

    padding:80px 5%;

}

.contact-card{

    padding:30px;

}

.contact-card h3{

    font-size:24px;

}

.faq-heading h2{

    font-size:30px;

}

.faq-box summary{

    font-size:16px;

    padding:20px;

}

.faq-box summary::after{

    right:20px;

}

}/* End custom CSS */