.elementor-249 .elementor-element.elementor-element-30335f6{--display:flex;}.elementor-249 .elementor-element.elementor-element-2b9f0df{--display:flex;}.elementor-249 .elementor-element.elementor-element-be7e791{width:100%;max-width:100%;}/* Start custom CSS for html, class: .elementor-element-f16a1dc *//*==============================
 GOOGLE FONTS
==============================*/
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:'Poppins',sans-serif;
    background:#fff;
    overflow-x:hidden;
    color:#222;
}

.hero{
    position:relative;
    min-height:100vh;
    display:flex;
    align-items:center;
    padding:90px 8%;
    background:linear-gradient(135deg,#ffffff,#f7fff6,#edf9ef);
    overflow:hidden;
}

/*==============================
BACKGROUND CIRCLES
==============================*/

.hero-bg-circle{
    position:absolute;
    border-radius:50%;
    filter:blur(70px);
    z-index:0;
}

.hero-bg-circle.one{
    width:320px;
    height:320px;
    background:#9be79a;
    top:-100px;
    left:-80px;
    opacity:.35;
}

.hero-bg-circle.two{
    width:420px;
    height:420px;
    background:#c7ffd3;
    bottom:-170px;
    right:-120px;
    opacity:.45;
}

/*==============================
CONTAINER
==============================*/

.hero .container{
    width:100%;
    max-width:1300px;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:80px;
    position:relative;
    z-index:2;
}

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

.hero-content{
    flex:1;
}

.hero-badge{
    display:inline-block;
    background:#ffffff;
    color:#2e7d32;
    padding:12px 22px;
    border-radius:50px;
    font-size:15px;
    font-weight:600;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    margin-bottom:25px;
}

.hero-content h1{
    font-family:'Outfit',sans-serif;
    font-size:65px;
    line-height:1.12;
    font-weight:800;
    margin-bottom:25px;
    color:#111;
}

.hero-content h1 span{
    background:linear-gradient(90deg,#25a244,#38b000,#70e000);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.hero-content .green{
    font-weight:800;
}

.hero-content p{
    font-size:18px;
    color:#666;
    line-height:1.9;
    max-width:620px;
    margin-bottom:35px;
}

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

.hero-btns{
    display:flex;
    gap:18px;
    margin-bottom:40px;
}

.btn-primary{

    padding:16px 36px;
    border-radius:50px;
    text-decoration:none;
    color:#fff;
    font-weight:700;
    background:linear-gradient(135deg,#38b000,#2e7d32);
    box-shadow:0 18px 35px rgba(56,176,0,.30);
    transition:.4s;
}

.btn-primary:hover{
    transform:translateY(-6px);
}

.btn-secondary{

    padding:16px 36px;
    border-radius:50px;
    text-decoration:none;
    color:#2e7d32;
    border:2px solid #2e7d32;
    font-weight:700;
    transition:.4s;
}

.btn-secondary:hover{

    background:#2e7d32;
    color:#fff;
}

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

.hero-features{

    display:flex;
    gap:30px;
    flex-wrap:wrap;
}

.hero-features div{

    display:flex;
    align-items:center;
    gap:8px;
    font-weight:600;
    color:#444;
}

.hero-features i{

    color:#38b000;
    font-size:18px;
}

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

.hero-image{

    flex:1;
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
}

.hero-image img{

    width:100%;
    max-width:480px;
    animation:floatImage 4s ease-in-out infinite;
    filter:drop-shadow(0 35px 45px rgba(0,0,0,.18));
}

/*==============================
FLOATING ICONS
==============================*/

.floating{

    position:absolute;
    width:70px;
    height:70px;
    border-radius:50%;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 18px 35px rgba(0,0,0,.12);
    color:#38b000;
    font-size:28px;
    animation:floating 3s ease-in-out infinite;
}

.leaf{

    top:20px;
    left:20px;
}

.heart{

    top:80px;
    right:10px;
    animation-delay:.5s;
}

.shield{

    bottom:70px;
    left:40px;
    animation-delay:1s;
}

.bowl{

    bottom:15px;
    right:40px;
    font-size:30px;
    animation-delay:1.5s;
}

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

.offer-card{

    position:absolute;
    bottom:-20px;
    left:50%;
    transform:translateX(-50%);
    background:#fff;
    padding:20px 35px;
    border-radius:18px;
    box-shadow:0 20px 45px rgba(0,0,0,.12);
    text-align:center;
}

.offer-card h3{

    font-size:22px;
    color:#2e7d32;
    margin-bottom:5px;
}

.offer-card p{

    color:#666;
}

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

@keyframes floating{

    0%{

        transform:translateY(0px);
    }

    50%{

        transform:translateY(-12px);
    }

    100%{

        transform:translateY(0px);
    }

}

@keyframes floatImage{

    0%{

        transform:translateY(0px);
    }

    50%{

        transform:translateY(-15px);
    }

    100%{

        transform:translateY(0px);
    }

}

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

@media(max-width:992px){

.hero .container{

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

.hero-content h1{

    font-size:48px;
}

.hero-content p{

    margin:auto auto 35px;
}

.hero-btns{

    justify-content:center;
}

.hero-features{

    justify-content:center;
}

.hero-image img{

    max-width:380px;
}

.offer-card{

    position:relative;
    left:0;
    transform:none;
    margin-top:25px;
    bottom:0;
}

}

@media(max-width:768px){

.hero{

    padding:70px 20px;
}

.hero-content h1{

    font-size:38px;
}

.hero-content p{

    font-size:16px;
}

.hero-btns{

    flex-direction:column;
}

.btn-primary,
.btn-secondary{

    width:100%;
    text-align:center;
}

.hero-image img{

    max-width:300px;
}

.floating{

    width:55px;
    height:55px;
    font-size:22px;
}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-be7e791 *//*==========================
 WHY CHOOSE SECTION
==========================*/

.why-section{

    padding:100px 6%;

    background:
    linear-gradient(
    135deg,
    #ffffff,
    #f1fff0
    );

    overflow:hidden;

}


.why-container{

    max-width:1200px;

    margin:auto;

}


/* HEADER */

.why-header{

    text-align:center;

    max-width:750px;

    margin:auto;

}


.why-tag{

    display:inline-block;

    padding:10px 25px;

    background:#ffffff;

    border-radius:50px;

    font-size:15px;

    font-weight:700;

    color:#2e7d32;

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

    margin-bottom:25px;

}



.why-header h2{

    font-size:48px;

    line-height:1.2;

    font-weight:800;

    color:#111;

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

    margin-bottom:20px;

}



.why-header h2 span{

    color:#38b000;

}



.why-header p{

    font-size:18px;

    line-height:1.7;

    color:#666;

}



/* CARDS GRID */

.why-cards{

    margin-top:60px;

    display:grid;

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

    gap:25px;

}



/* CARD */

.why-card{


    background:#ffffff;

    padding:35px 25px;

    border-radius:28px;

    text-align:center;


    box-shadow:

    0 20px 50px rgba(0,0,0,.08);


    transition:.4s ease;


    position:relative;

    overflow:hidden;

}



/* GREEN GLOW */

.why-card::before{

    content:"";

    position:absolute;

    width:120px;

    height:120px;

    background:#38b000;

    opacity:.08;

    border-radius:50%;

    top:-40px;

    right:-40px;

}



/* HOVER */

.why-card:hover{

    transform:translateY(-12px);

    box-shadow:

    0 30px 70px rgba(56,176,0,.18);

}




/* ICON */

.why-icon{


    width:75px;

    height:75px;


    margin:auto;

    margin-bottom:25px;


    border-radius:50%;


    display:flex;

    align-items:center;

    justify-content:center;


    font-size:35px;


    background:

    linear-gradient(
    135deg,
    #38b000,
    #8bc34a
    );


    color:white;


    box-shadow:

    0 15px 30px rgba(56,176,0,.25);


    transition:.4s;

}



.why-card:hover .why-icon{

    transform:rotateY(360deg);

}




/* CARD TITLE */

.why-card h3{

    font-size:23px;

    font-weight:800;

    color:#222;

    margin-bottom:15px;

}




/* CARD TEXT */

.why-card p{

    font-size:15px;

    line-height:1.7;

    color:#666;

}




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


@media(max-width:992px){


    .why-cards{

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

    }


    .why-header h2{

        font-size:38px;

    }

}



@media(max-width:600px){


    .why-section{

        padding:70px 20px;

    }


    .why-cards{

        grid-template-columns:1fr;

    }


    .why-header h2{

        font-size:32px;

    }


    .why-header p{

        font-size:16px;

    }


}/* End custom CSS */