/*==================================================
 Google Fonts
==================================================*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&family=Inter:wght@300;400;500;600;700&display=swap');


/*==================================================
 CSS Variables
==================================================*/

:root{

    --primary:#16A34A;
    --primary-dark:#14532D;
    --secondary:#22C55E;
    --light:#F5FFF8;
    --white:#ffffff;
    --dark:#1F2937;
    --text:#6B7280;
    --border:#E5E7EB;

    --shadow-sm:0 5px 15px rgba(0,0,0,.08);
    --shadow-md:0 15px 35px rgba(0,0,0,.10);
    --shadow-lg:0 20px 60px rgba(0,0,0,.15);

    --radius:12px;
    --radius-lg:20px;

    --transition:.35s ease;

}


/*==================================================
 Reset
==================================================*/

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

html{
    scroll-behavior:smooth;
}

body{

    font-family:'Inter',sans-serif;
    color:var(--text);
    font-size:16px;
    line-height:1.7;
    overflow-x:hidden;
    background:#fff;

}

img{

    max-width:100%;
    display:block;

}

a{
    color:#1F2937;
    text-decoration:none;
    transition:var(--transition);

}

a:hover{
    color:#16A34A;


}

ul{

    list-style:none;
    margin:0;
    padding:0;

}

button{

    border:none;
    outline:none;

}

input,
textarea,
select{

    outline:none !important;
    box-shadow:none !important;

}


/*==================================================
 Typography
==================================================*/

h1,
h2,
h3,
h4,
h5,
h6{

    font-family:'Poppins',sans-serif;
    color:var(--dark);
    font-weight:700;
    line-height:1.3;

}

h1{

    font-size:58px;
    font-weight:800;

}

h2{

    font-size:42px;

}

h3{

    font-size:30px;

}

h4{

    font-size:22px;

}

h5{

    font-size:18px;

}

p{

    color:var(--text);
    margin-bottom:18px;

}


/*==================================================
 Common Section
==================================================*/

section{

    position:relative;
    padding:100px 0;

}

.section-tag{

    display:inline-block;
    padding:10px 22px;
    background:#E9FFF0;
    color:var(--primary);
    border-radius:50px;
    font-weight:600;
    font-size:15px;
    letter-spacing:.5px;

}

.section-title{

    font-size:46px;
    font-weight:700;
    margin:20px 0;

}

.section-text{

    font-size:17px;
    color:var(--text);

}


/*==================================================
 Buttons
==================================================*/

.btn{

    border-radius:50px;
    padding:15px 34px;
    font-size:16px;
    font-weight:600;
    transition:.4s;

}

.btn-success{

    background:linear-gradient(45deg,#16A34A,#22C55E);
    border:none;
    box-shadow:var(--shadow-sm);

}

.btn-success:hover{

    transform:translateY(-5px);
    box-shadow:var(--shadow-lg);

}

.btn-outline-success{

    border:2px solid var(--primary);
    color:var(--primary);
    background:#fff;

}

.btn-outline-success:hover{

    background:var(--primary);
    color:#fff;

}


/*==================================================
 Container
==================================================*/

.container{

    max-width:1240px;

}


/*==================================================
 Top Header
==================================================*/

.topbar{

    background:#0B3D2E;
    color:#fff;
    font-size:14px;
    padding:12px 0;

}

.top-contact{

    display:flex;
    align-items:center;
    gap:25px;

}

.top-contact li{

    display:flex;
    align-items:center;
    color:#fff;

}

.top-contact li i{

    margin-right:8px;
    color:#8BFF9F;

}

.top-contact li a{

    color:#fff;

}

.top-contact li a:hover{

    color:#8BFF9F;

}


/*==================================================
 Common Card
==================================================*/

.card-shadow{

    background:#fff;
    border-radius:20px;
    box-shadow:var(--shadow-sm);

}


/*==================================================
 Utility Classes
==================================================*/

.text-primary{

    color:var(--primary)!important;

}

.bg-light-green{

    background:var(--light);

}

.rounded-xl{

    border-radius:25px;

}

.shadow-custom{

    box-shadow:var(--shadow-md);

}

.mt-80{

    margin-top:80px;

}

.mb-80{

    margin-bottom:80px;

}


/*==================================================
 Image Hover
==================================================*/

.img-hover{

    overflow:hidden;
    border-radius:20px;

}

.img-hover img{

    transition:.5s;

}

.img-hover:hover img{

    transform:scale(1.08);

}


/*==================================================
 Background Shapes
==================================================*/

.bg-circle{

    position:absolute;
    width:450px;
    height:450px;
    border-radius:50%;
    background:rgba(34,197,94,.08);
    filter:blur(80px);

}

.bg-circle.left{

    top:-120px;
    left:-150px;

}

.bg-circle.right{

    right:-150px;
    bottom:-120px;

}


/*==================================================
 Scrollbar
==================================================*/

::-webkit-scrollbar{

    width:8px;

}

::-webkit-scrollbar-track{

    background:#f3f3f3;

}

::-webkit-scrollbar-thumb{

    background:var(--primary);
    border-radius:30px;

}

::-webkit-scrollbar-thumb:hover{

    background:var(--primary-dark);

}


/*==================================================
 Selection
==================================================*/

::selection{

    background:var(--primary);
    color:#fff;

}

/*==================================================
 NAVBAR
==================================================*/

.custom-navbar{
    position:fixed;
    top:48px;
    left:0;
    width:100%;
    z-index:999;
    transition:all .4s ease;
    padding:18px 0;
    background:transparent;
}

.custom-navbar.sticky{
    top:0;
    background:#ffffff;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    padding:12px 0;
}

.logo{
    max-height:96px;
    transition:.3s;
}

.custom-navbar.sticky .logo{
    max-height:55px;
}

.navbar-nav{
    align-items:center;
}

.navbar-nav .nav-item{
    margin:0 10px;
}

.navbar-nav .nav-link{

    color:#1F2937;
    font-weight:600;
    font-size:16px;
    position:relative;
    transition:.35s;
    padding:10px 5px;

}

.navbar-nav .nav-link:hover{

    color:var(--primary);

}

.navbar-nav .nav-link.active{

    color:var(--primary);

}

.navbar-nav .nav-link::after{

    content:'';
    position:absolute;
    width:0;
    height:2px;
    background:var(--primary);
    left:50%;
    bottom:0;
    transition:.35s;

}

.navbar-nav .nav-link:hover::after,
.navbar-nav .nav-link.active::after{

    width:100%;
    left:0;

}

.navbar .btn-success{

    padding:13px 28px;
    font-size:15px;

}

/*=========================
Mega Menu
==========================*/

.mega-menu{

    width:700px;

    border:none;

    border-radius:12px;

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

}

.mega-menu .dropdown-item{

    padding:12px 15px;

    border-radius:6px;

    font-size:15px;

    transition:.3s;

}

.mega-menu .dropdown-item:hover{

    background:#198754;

    color:#fff;

    padding-left:25px;

}

/*=====================================
Desktop Hover Dropdown
======================================*/

@media (min-width:992px){

    .navbar .dropdown{
        position:relative;
    }

    .navbar .dropdown-menu{

        display:block;
        opacity:0;
        visibility:hidden;

        transform:translateY(15px);

        transition:.35s;

        margin-top:0;

    }

    .navbar .dropdown:hover>.dropdown-menu{

        opacity:1;
        visibility:visible;

        transform:translateY(0);

    }

}
/*=====================================
Mobile Dropdown
======================================*/

@media(max-width:991px){

.dropdown-menu{

    position:static !important;

    transform:none !important;

    width:100%;

    border:none;

    box-shadow:none;

    background:#f8f9fa;

    margin-top:8px;

}

.dropdown-item{

    padding:12px 20px;

}

.mega-menu{

    width:100%;

    padding:10px !important;

}

.mega-menu .row{

    display:block;

}

.mega-menu .col-md-6{

    width:100%;

    margin-bottom:10px;

}

}

.dropdown-item{

    padding:12px 18px;

    transition:.3s;

}

.dropdown-item:hover{

    background:#198754;

    color:#fff;

    padding-left:25px;

}

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

.navbar-toggler{

    border:none;
    box-shadow:none !important;

}

.navbar-toggler:focus{

    box-shadow:none;

}

.navbar-toggler-icon{

    background-image:none;
    width:30px;
    height:30px;
    position:relative;

}

.navbar-toggler-icon:before,
.navbar-toggler-icon:after{

    content:'';
    position:absolute;
    width:100%;
    height:3px;
    left:0;
    background:var(--primary);
    transition:.35s;

}

.navbar-toggler-icon:before{

    top:8px;

}

.navbar-toggler-icon:after{

    bottom:8px;

}

.navbar-collapse{

    background:#fff;

    border-radius:15px;

    padding:20px;

    margin-top:15px;

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

}


/*==================================================
 HERO SECTION
==================================================*/

.hero-section{

    position:relative;
    overflow:hidden;
    background:linear-gradient(135deg,#F5FFF8 0%,#E8FFF1 100%);
    padding-top:180px;
    padding-bottom:120px;

}

.hero-section::before{

    content:'';
    position:absolute;
    width:600px;
    height:600px;
    border-radius:50%;
    background:rgba(22,163,74,.06);
    right:-220px;
    top:-180px;

}

.hero-section::after{

    content:'';
    position:absolute;
    width:450px;
    height:450px;
    border-radius:50%;
    background:rgba(34,197,94,.08);
    left:-180px;
    bottom:-180px;

}


/*==================================================
 HERO TAG
==================================================*/

.hero-tag{

    display:inline-block;
    padding:10px 24px;
    background:#ffffff;
    color:var(--primary);
    border-radius:50px;
    box-shadow:0 10px 30px rgba(0,0,0,.06);
    font-weight:600;
    margin-bottom:25px;

}


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

.hero-section h1{

    font-size:60px;
    line-height:1.15;
    font-weight:800;
    margin-bottom:20px;
    color:#183B2D;

}

.hero-section h2{

    font-size:34px;
    color:var(--primary);
    margin-bottom:25px;
    font-weight:700;

}

.hero-section p{

    font-size:17px;
    color:#555;
    margin-bottom:35px;
    max-width:600px;

}


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

.hero-btn{

    display:flex;
    gap:18px;
    flex-wrap:wrap;

}

.hero-btn .btn{

    min-width:190px;

}

.hero-btn .btn-success{

    background:linear-gradient(135deg,#16A34A,#22C55E);

}

.hero-btn .btn-success:hover{

    transform:translateY(-6px);

}

.hero-btn .btn-outline-success{

    background:#fff;

}

.hero-btn .btn-outline-success:hover{

    color:#fff;

}


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

.hero-img{

    width:100%;
    max-width:600px;
    margin:auto;
    position:relative;
    z-index:2;
    animation:floatImage 5s ease-in-out infinite;

}


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

.hero-image-wrapper{

    position:relative;
    text-align:center;

}

.hero-image-wrapper::before{

    content:'';
    position:absolute;
    width:520px;
    height:520px;
    background:#22C55E;
    opacity:.08;
    border-radius:50%;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    z-index:0;

}

.hero-image-wrapper::after{

    content:'';
    position:absolute;
    width:420px;
    height:420px;
    border:2px dashed rgba(22,163,74,.25);
    border-radius:50%;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    animation:rotateCircle 18s linear infinite;

}


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

.hero-badge{

    position:absolute;
    top:40px;
    left:30px;
    background:#fff;
    padding:18px 20px;
    border-radius:18px;
    box-shadow:0 20px 40px rgba(0,0,0,.08);
    z-index:5;

}

.hero-badge h4{

    font-size:24px;
    color:var(--primary);
    margin-bottom:5px;

}

.hero-badge p{

    margin:0;
    font-size:14px;

}


/*==================================================
 HERO BACKGROUND SHAPES
==================================================*/

.hero-shape{

    position:absolute;
    border-radius:50%;
    background:rgba(22,163,74,.08);

}

.hero-shape.one{

    width:120px;
    height:120px;
    top:120px;
    right:10%;

}

.hero-shape.two{

    width:70px;
    height:70px;
    bottom:120px;
    left:12%;

}

.hero-shape.three{

    width:40px;
    height:40px;
    top:45%;
    right:45%;

}


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

@keyframes floatImage{

    0%{
        transform:translateY(0px);
    }

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

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

}

@keyframes rotateCircle{

    from{
        transform:translate(-50%,-50%) rotate(0deg);
    }

    to{
        transform:translate(-50%,-50%) rotate(360deg);
    }

}


/*==================================================
 HERO RESPONSIVE PREPARATION
==================================================*/

.hero-section .row{

    align-items:center;

}

.hero-section .col-lg-6{

    position:relative;
    z-index:2;

}

/*==================================================
 FLOATING FEATURE CARDS
==================================================*/

.floating-card{
    position:absolute;
    background:#ffffff;
    padding:18px 22px;
    border-radius:18px;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    display:flex;
    align-items:center;
    gap:15px;
    min-width:220px;
    z-index:5;
    transition:.35s ease;
    animation:floatCard 5s ease-in-out infinite;
}

.floating-card:hover{
    transform:translateY(-8px);
    box-shadow:0 25px 50px rgba(0,0,0,.15);
}

.floating-card i{
    width:55px;
    height:55px;
    line-height:55px;
    text-align:center;
    border-radius:50%;
    background:linear-gradient(135deg,#16A34A,#22C55E);
    color:#ffffff;
    font-size:22px;
    flex-shrink:0;
}

.floating-card h6{
    margin:0;
    color:var(--dark);
    font-size:16px;
    font-weight:600;
}

.card-one{
    top:30px;
    left:-40px;
}

.card-two{
    top:180px;
    right:-40px;
    animation-delay:1s;
}

.card-three{
    bottom:120px;
    left:-20px;
    animation-delay:2s;
}

.card-four{
    bottom:10px;
    right:0;
    animation-delay:3s;
}

@keyframes floatCard{

    0%{
        transform:translateY(0);
    }

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

    100%{
        transform:translateY(0);
    }

}

/*==================================================
 HERO WAVE
==================================================*/

.hero-wave{
    position:absolute;
    left:0;
    right:0;
    bottom:-2px;
    line-height:0;
}

.hero-wave svg{
    width:100%;
    height:120px;
    display:block;
}

.hero-wave path{
    fill:#ffffff;
}

/*==================================================
 COUNTER SECTION
==================================================*/

.counter-section{
    position:relative;
    margin-top:-70px;
    z-index:10;
    padding-bottom:90px;
}

.counter-box{
    background:#ffffff;
    border-radius:22px;
    padding:40px 25px;
    text-align:center;
    box-shadow:0 20px 45px rgba(0,0,0,.08);
    transition:.35s ease;
    height:100%;
}

.counter-box:hover{
    transform:translateY(-10px);
    box-shadow:0 25px 55px rgba(0,0,0,.15);
}

.counter-box i{
    width:80px;
    height:80px;
    line-height:80px;
    border-radius:50%;
    margin:0 auto 20px;
    display:block;
    background:linear-gradient(135deg,#16A34A,#22C55E);
    color:#ffffff;
    font-size:32px;
}

.counter-box h2{
    font-size:42px;
    margin-bottom:10px;
    color:var(--primary-dark);
    font-weight:700;
}

.counter-box h5{
    margin:0;
    color:#555;
    font-weight:600;
    font-size:17px;
}

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

.whatsapp-btn{
    position:fixed;
    right:25px;
    bottom:95px;
    width:60px;
    height:60px;
    border-radius:50%;
    background:#25D366;
    color:#ffffff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    box-shadow:0 12px 30px rgba(0,0,0,.20);
    z-index:999;
    transition:.35s;
    animation:whatsappPulse 2s infinite;
}

.whatsapp-btn:hover{
    color:#ffffff;
    transform:scale(1.1);
}

@keyframes whatsappPulse{

    0%{
        box-shadow:0 0 0 0 rgba(37,211,102,.6);
    }

    70%{
        box-shadow:0 0 0 18px rgba(37,211,102,0);
    }

    100%{
        box-shadow:0 0 0 0 rgba(37,211,102,0);
    }

}

/*==================================================
 SCROLL TO TOP
==================================================*/

#scrollTop{
    position:fixed;
    right:25px;
    bottom:25px;
    width:55px;
    height:55px;
    border-radius:50%;
    background:linear-gradient(135deg,#16A34A,#22C55E);
    color:#ffffff;
    display:none;
    cursor:pointer;
    z-index:999;
    align-items:center;
    justify-content:center;
    font-size:22px;
    box-shadow:0 12px 30px rgba(0,0,0,.18);
    transition:.35s;
}

#scrollTop:hover{
    transform:translateY(-5px);
}

/*==================================================
 PAGE LOADER
==================================================*/

.page-loader{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:#ffffff;
    display:flex;
    justify-content:center;
    align-items:center;
    z-index:99999;
}

.loader-circle{
    width:70px;
    height:70px;
    border-radius:50%;
    border:6px solid rgba(22,163,74,.2);
    border-top-color:var(--primary);
    animation:loaderSpin 1s linear infinite;
}

@keyframes loaderSpin{

    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }

}

/*==================================================
 COMMON HOVER EFFECTS
==================================================*/

.hover-up{
    transition:.35s ease;
}

.hover-up:hover{
    transform:translateY(-8px);
}

.shadow-hover{
    transition:.35s ease;
}

.shadow-hover:hover{
    box-shadow:0 20px 45px rgba(0,0,0,.12);
}

/*==================================================
 GRADIENT BACKGROUNDS
==================================================*/

.bg-gradient-green{
    background:linear-gradient(135deg,#16A34A,#22C55E);
}

.bg-gradient-light{
    background:linear-gradient(135deg,#F5FFF8,#ECFFF3);
}

/*==================================================
 GLASS EFFECT
==================================================*/

.glass-card{
    background:rgba(255,255,255,.65);
    backdrop-filter:blur(15px);
    -webkit-backdrop-filter:blur(15px);
    border:1px solid rgba(255,255,255,.25);
    border-radius:20px;
}

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

.overlay-dark{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.45);
}

.overlay-green{
    position:absolute;
    inset:0;
    background:rgba(20,83,45,.65);
}

/*==================================================
 TRANSITIONS
==================================================*/

.transition{
    transition:.35s ease;
}

.rotate-hover:hover{
    transform:rotate(3deg);
}

.scale-hover:hover{
    transform:scale(1.05);
}

/*==================================================
 AOS ENHANCEMENTS
==================================================*/

[data-aos]{
    transition-property:transform,opacity;
}

/*==================================================
 SECTION SPACING HELPERS
==================================================*/

.pt-120{
    padding-top:120px;
}

.pb-120{
    padding-bottom:120px;
}

.mt-120{
    margin-top:120px;
}

.mb-120{
    margin-bottom:120px;
}


/*==================================================
 ABOUT SECTION
==================================================*/

.about-section{
    position:relative;
    background:#ffffff;
    overflow:hidden;
}

.about-section::before{
    content:'';
    position:absolute;
    width:450px;
    height:450px;
    background:rgba(34,197,94,.05);
    border-radius:50%;
    top:-180px;
    left:-180px;
}

.about-section::after{
    content:'';
    position:absolute;
    width:380px;
    height:380px;
    background:rgba(22,163,74,.04);
    border-radius:50%;
    bottom:-160px;
    right:-120px;
}

.about-section .container{
    position:relative;
    z-index:2;
}

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

.about-image{
    position:relative;
    overflow:hidden;
    border-radius:24px;
}

.about-image img{
    width:100%;
    border-radius:24px;
    transition:.5s ease;
    box-shadow:0 20px 60px rgba(0,0,0,.12);
}

.about-image:hover img{
    transform:scale(1.05);
}

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

.experience-box{

    position:absolute;
    bottom:35px;
    right:-25px;

    width:180px;
    height:180px;

    border-radius:50%;

    background:linear-gradient(135deg,#16A34A,#22C55E);

    color:#fff;

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

    text-align:center;

    box-shadow:0 20px 45px rgba(22,163,74,.35);

    animation:experiencePulse 3s infinite;

}

.experience-box h2{

    font-size:46px;
    color:#fff;
    margin-bottom:8px;
    line-height:1;

}

.experience-box span{

    font-size:16px;
    font-weight:600;
    line-height:1.5;
    padding:0 15px;

}

@keyframes experiencePulse{

    0%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.05);
    }

    100%{
        transform:scale(1);
    }

}

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

.about-section .section-tag{

    margin-bottom:15px;

}

.about-section .section-title{

    font-size:46px;
    margin-bottom:25px;

}

.about-section p{

    font-size:17px;
    color:#6B7280;
    line-height:1.9;

}

.about-section strong{

    color:var(--primary-dark);

}

/*==================================================
 FEATURE BOXES
==================================================*/

.feature-box{

    background:#ffffff;

    border-radius:18px;

    padding:22px;

    display:flex;
    align-items:center;

    gap:18px;

    transition:.35s ease;

    border:1px solid #F0F0F0;

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

    height:100%;

}

.feature-box:hover{

    transform:translateY(-8px);

    box-shadow:0 20px 45px rgba(0,0,0,.10);

    border-color:#22C55E;

}

.feature-box i{

    width:65px;
    height:65px;

    border-radius:50%;

    background:linear-gradient(135deg,#16A34A,#22C55E);

    color:#fff;

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

    font-size:26px;

    flex-shrink:0;

}

.feature-box h5{

    margin-bottom:5px;

    font-size:18px;

}

.feature-box p{

    margin:0;

    font-size:14px;

    color:#777;

}

/*==================================================
 ABOUT CTA BUTTON
==================================================*/

.about-section .btn{

    margin-top:20px;

    padding:15px 38px;

}

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

.about-image::before{

    content:'';

    position:absolute;

    width:180px;
    height:180px;

    border:3px dashed rgba(22,163,74,.20);

    border-radius:50%;

    top:-60px;
    right:-60px;

    animation:rotateCircle 25s linear infinite;

}

.about-image::after{

    content:'';

    position:absolute;

    width:80px;
    height:80px;

    border-radius:50%;

    background:rgba(22,163,74,.10);

    bottom:50px;
    left:-30px;

}

/*==================================================
 FEATURE ICON ANIMATION
==================================================*/

.feature-box:hover i{

    transform:rotateY(360deg);

}

.feature-box i{

    transition:.7s ease;

}

/*==================================================
 ABOUT HIGHLIGHT LIST
==================================================*/

.about-list{

    margin-top:30px;

}

.about-list li{

    display:flex;

    align-items:flex-start;

    margin-bottom:16px;

    color:#555;

    font-size:16px;

}

.about-list li i{

    color:var(--primary);

    margin-right:12px;

    margin-top:5px;

}

/*==================================================
 SECTION DIVIDER
==================================================*/

.about-divider{

    width:90px;
    height:5px;

    background:linear-gradient(90deg,#16A34A,#22C55E);

    border-radius:20px;

    margin:20px 0;

}

/*==================================================
 BACKGROUND PATTERN
==================================================*/

.about-pattern{

    position:absolute;

    top:50%;

    right:40px;

    width:120px;
    height:120px;

    background-image:radial-gradient(#22C55E 2px,transparent 2px);

    background-size:18px 18px;

    opacity:.12;

}

/*==================================================
 ABOUT SECTION SPACING
==================================================*/

.about-section .row{

    align-items:center;

}

.about-section .col-lg-6{

    position:relative;

}

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

.feature-box:hover{

    background:#fff;

}

.feature-box:hover h5{

    color:var(--primary);

}

.feature-box:hover i{

    box-shadow:0 12px 25px rgba(22,163,74,.30);

}


/*==================================================
 SERVICES SECTION
==================================================*/

.services-section{
    position:relative;
    background:#F8FFFA;
    overflow:hidden;
}

.services-section::before{
    content:'';
    position:absolute;
    width:450px;
    height:450px;
    background:rgba(34,197,94,.05);
    border-radius:50%;
    top:-180px;
    right:-180px;
}

.services-section::after{
    content:'';
    position:absolute;
    width:350px;
    height:350px;
    background:rgba(22,163,74,.04);
    border-radius:50%;
    bottom:-120px;
    left:-120px;
}

.services-section .container{
    position:relative;
    z-index:2;
}


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

.services-section .section-title{
    margin-bottom:18px;
}

.services-section p{
    color:#6B7280;
}


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

.service-card{

    position:relative;

    background:#ffffff;

    border-radius:22px;

    padding:35px 25px;

    text-align:center;

    overflow:hidden;

    transition:.40s ease;

    border:1px solid #EEF1F4;

    box-shadow:0 15px 35px rgba(0,0,0,.05);

    height:100%;

}

.service-card:hover{

    transform:translateY(-12px);

    box-shadow:0 25px 60px rgba(0,0,0,.12);

    border-color:#16A34A;

}


/*==================================================
 TOP BORDER EFFECT
==================================================*/

.service-card::before{

    content:'';

    position:absolute;

    top:0;
    left:0;

    width:100%;

    height:5px;

    background:linear-gradient(90deg,#16A34A,#22C55E);

    transform:scaleX(0);

    transition:.35s;

}

.service-card:hover::before{

    transform:scaleX(1);

}


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

.service-card i{

    width:90px;

    height:90px;

    margin:auto;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    font-size:36px;

    color:#ffffff;

    background:linear-gradient(135deg,#16A34A,#22C55E);

    box-shadow:0 15px 35px rgba(22,163,74,.25);

    transition:.5s ease;

}

.service-card:hover i{

    transform:rotateY(360deg) scale(1.1);

}


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

.service-card h4{

    margin:25px 0 15px;

    font-size:22px;

    color:#1F2937;

    transition:.3s;

}

.service-card:hover h4{

    color:#16A34A;

}


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

.service-card p{

    font-size:15px;

    line-height:1.8;

    color:#6B7280;

    margin-bottom:20px;

}


/*==================================================
 READ MORE BUTTON
==================================================*/

.service-card .read-btn{

    display:inline-flex;

    align-items:center;

    color:#16A34A;

    font-weight:600;

    transition:.35s;

}

.service-card .read-btn i{

    width:auto;
    height:auto;

    background:none;

    color:#16A34A;

    font-size:14px;

    margin-left:8px;

    box-shadow:none;

}

.service-card:hover .read-btn{

    transform:translateX(6px);

}


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

.service-number{

    position:absolute;

    top:18px;

    right:20px;

    font-size:48px;

    font-weight:700;

    color:rgba(22,163,74,.05);

    font-family:Poppins,sans-serif;

}


/*==================================================
 SERVICE SHAPE
==================================================*/

.service-card::after{

    content:'';

    position:absolute;

    width:120px;
    height:120px;

    border-radius:50%;

    background:rgba(22,163,74,.05);

    top:-40px;
    right:-40px;

    transition:.4s;

}

.service-card:hover::after{

    transform:scale(1.4);

}


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

.services-section .row{

    row-gap:30px;

}


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

.services-section .btn{

    padding:16px 40px;

    border-radius:50px;

    margin-top:20px;

}


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

.service-card:hover{

    background:#ffffff;

}


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

.service-card:hover i{

    animation:servicePulse .8s;

}

@keyframes servicePulse{

    0%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.15);
    }

    100%{
        transform:scale(1.05);
    }

}


/*==================================================
 SERVICE TAG
==================================================*/

.service-tag{

    display:inline-block;

    padding:6px 15px;

    border-radius:30px;

    background:#ECFFF2;

    color:#16A34A;

    font-size:13px;

    font-weight:600;

    margin-bottom:15px;

}


/*==================================================
 CARD SHADOW EFFECT
==================================================*/

.service-card:hover{

    box-shadow:
    0 15px 30px rgba(0,0,0,.08),
    0 30px 70px rgba(22,163,74,.12);

}


/*==================================================
 IMAGE SERVICE CARD
==================================================*/

.service-image{

    overflow:hidden;

    border-radius:18px;

    margin-bottom:20px;

}

.service-image img{

    transition:.5s;

}

.service-card:hover .service-image img{

    transform:scale(1.08);

}


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

.service-btn{

    display:inline-block;

    margin-top:15px;

    font-weight:600;

    color:#16A34A;

    transition:.35s;

}

.service-btn:hover{

    color:#14532D;

}


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

.service-pattern{

    position:absolute;

    width:140px;

    height:140px;

    background-image:
    radial-gradient(#16A34A 2px,transparent 2px);

    background-size:18px 18px;

    opacity:.08;

    bottom:60px;

    right:50px;

}


/*==================================================
 CARD BORDER ANIMATION
==================================================*/

.service-card{

    isolation:isolate;

}

.service-card:hover{

    border-color:#22C55E;

}


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

.service-card:hover{

    transform:translateY(-12px) scale(1.02);

}


/*==================================================
 SERVICE TRANSITION
==================================================*/

.service-card,
.service-card *,
.service-card::before,
.service-card::after{

    transition:all .35s ease;

}


/*==================================================
 WHY CHOOSE US SECTION
==================================================*/

.why-choose-section{
    position:relative;
    background:#ffffff;
    overflow:hidden;
    padding:100px 0;
}

.why-choose-section::before{
    content:'';
    position:absolute;
    width:500px;
    height:500px;
    border-radius:50%;
    background:rgba(34,197,94,.05);
    top:-200px;
    right:-200px;
}

.why-choose-section::after{
    content:'';
    position:absolute;
    width:350px;
    height:350px;
    border-radius:50%;
    background:rgba(22,163,74,.04);
    bottom:-150px;
    left:-120px;
}

.why-choose-section .container{
    position:relative;
    z-index:2;
}

/*==================================================
 WHY CHOOSE CONTENT
==================================================*/

.why-choose-section .section-tag{
    margin-bottom:18px;
}

.why-choose-section .section-title{
    font-size:46px;
    margin-bottom:22px;
    color:var(--dark);
}

.why-choose-section .section-text{
    color:#6B7280;
    line-height:1.9;
    margin-bottom:35px;
}

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

.choose-card{

    position:relative;

    background:#ffffff;

    border-radius:20px;

    padding:28px 24px;

    border:1px solid #EEF1F4;

    box-shadow:0 15px 35px rgba(0,0,0,.05);

    transition:.4s ease;

    overflow:hidden;

    height:100%;

}

.choose-card:hover{

    transform:translateY(-10px);

    border-color:#16A34A;

    box-shadow:0 25px 55px rgba(0,0,0,.12);

}

/*==================================================
 CARD TOP BORDER
==================================================*/

.choose-card::before{

    content:'';

    position:absolute;

    top:0;
    left:0;

    width:100%;

    height:5px;

    background:linear-gradient(90deg,#16A34A,#22C55E);

    transform:scaleX(0);

    transition:.35s;

}

.choose-card:hover::before{

    transform:scaleX(1);

}

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

.choose-card i{

    width:75px;
    height:75px;

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

    border-radius:50%;

    background:linear-gradient(135deg,#16A34A,#22C55E);

    color:#ffffff;

    font-size:30px;

    margin-bottom:20px;

    box-shadow:0 15px 30px rgba(22,163,74,.25);

    transition:.6s;

}

.choose-card:hover i{

    transform:rotateY(360deg);

}

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

.choose-card h5{

    font-size:20px;

    margin-bottom:12px;

    color:#1F2937;

    transition:.3s;

}

.choose-card:hover h5{

    color:#16A34A;

}

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

.choose-card p{

    margin:0;

    color:#6B7280;

    line-height:1.8;

    font-size:15px;

}

/*==================================================
 BACKGROUND SHAPE
==================================================*/

.choose-card::after{

    content:'';

    position:absolute;

    width:120px;
    height:120px;

    border-radius:50%;

    background:rgba(22,163,74,.05);

    right:-45px;
    top:-45px;

    transition:.4s;

}

.choose-card:hover::after{

    transform:scale(1.3);

}

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

.why-choose-section img{

    width:100%;

    border-radius:25px;

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

    transition:.5s;

}

.why-choose-section img:hover{

    transform:scale(1.03);

}

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

.why-choose-section .col-lg-6:last-child{

    position:relative;

}

.why-choose-section .col-lg-6:last-child::before{

    content:'';

    position:absolute;

    width:180px;
    height:180px;

    border:3px dashed rgba(22,163,74,.18);

    border-radius:50%;

    top:-40px;
    right:-40px;

    animation:rotateCircle 22s linear infinite;

}

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

.choose-card:hover{

    background:#ffffff;

}

.choose-card:hover i{

    box-shadow:0 20px 40px rgba(22,163,74,.35);

}

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

.choose-number{

    position:absolute;

    top:20px;
    right:20px;

    font-size:44px;

    font-weight:700;

    color:rgba(22,163,74,.06);

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

}

/*==================================================
 LIST STYLE
==================================================*/

.choose-list{

    margin-top:25px;

}

.choose-list li{

    display:flex;

    align-items:flex-start;

    margin-bottom:14px;

    color:#555;

}

.choose-list li i{

    width:auto;
    height:auto;

    background:none;

    color:#16A34A;

    box-shadow:none;

    margin-right:12px;

    font-size:18px;

}

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

.choose-card,
.choose-card *,
.choose-card::before,
.choose-card::after{

    transition:all .35s ease;

}

/*==================================================
 WORKING PROCESS SECTION
==================================================*/

.process-section{
    position:relative;
    background:#F8FFFA;
    overflow:hidden;
    padding:100px 0;
}

.process-section::before{
    content:'';
    position:absolute;
    width:420px;
    height:420px;
    background:rgba(22,163,74,.05);
    border-radius:50%;
    top:-180px;
    left:-180px;
}

.process-section::after{
    content:'';
    position:absolute;
    width:320px;
    height:320px;
    background:rgba(34,197,94,.05);
    border-radius:50%;
    right:-120px;
    bottom:-120px;
}

.process-section .container{
    position:relative;
    z-index:2;
}


/*==================================================
 PROCESS SECTION TITLE
==================================================*/

.process-section .section-tag{
    margin-bottom:15px;
}

.process-section .section-title{
    margin-bottom:18px;
    font-size:46px;
}

.process-section p{
    color:#6B7280;
}


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

.process-card{

    position:relative;

    background:#ffffff;

    border-radius:24px;

    padding:40px 30px;

    text-align:center;

    border:1px solid #EEF1F4;

    box-shadow:0 15px 35px rgba(0,0,0,.05);

    transition:.4s ease;

    overflow:hidden;

    height:100%;

}

.process-card:hover{

    transform:translateY(-12px);

    border-color:#16A34A;

    box-shadow:0 25px 55px rgba(0,0,0,.12);

}


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

.process-icon{

    position:absolute;

    top:20px;

    right:20px;

}

.process-icon span{

    width:48px;

    height:48px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:linear-gradient(135deg,#16A34A,#22C55E);

    color:#ffffff;

    font-weight:700;

    font-size:16px;

    box-shadow:0 10px 25px rgba(22,163,74,.30);

}


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

.process-card i{

    width:90px;

    height:90px;

    margin:20px auto 25px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:linear-gradient(135deg,#16A34A,#22C55E);

    color:#ffffff;

    font-size:34px;

    transition:.5s ease;

    box-shadow:0 18px 35px rgba(22,163,74,.25);

}

.process-card:hover i{

    transform:rotateY(360deg) scale(1.1);

}


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

.process-card h4{

    margin-bottom:18px;

    font-size:22px;

    transition:.3s;

}

.process-card:hover h4{

    color:var(--primary);

}


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

.process-card p{

    margin:0;

    color:#6B7280;

    line-height:1.8;

    font-size:15px;

}


/*==================================================
 TOP BORDER EFFECT
==================================================*/

.process-card::before{

    content:'';

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:5px;

    background:linear-gradient(90deg,#16A34A,#22C55E);

    transform:scaleX(0);

    transition:.35s;

}

.process-card:hover::before{

    transform:scaleX(1);

}


/*==================================================
 BACKGROUND CIRCLE
==================================================*/

.process-card::after{

    content:'';

    position:absolute;

    width:130px;

    height:130px;

    border-radius:50%;

    background:rgba(22,163,74,.05);

    right:-45px;

    top:-45px;

    transition:.35s;

}

.process-card:hover::after{

    transform:scale(1.3);

}


/*==================================================
 TIMELINE CONNECTOR
==================================================*/

.process-section .row{

    position:relative;

}

@media(min-width:992px){

.process-section .col-lg-3{

    position:relative;

}

.process-section .col-lg-3:not(:last-child)::after{

    content:'';

    position:absolute;

    top:85px;

    right:-15px;

    width:30px;

    height:3px;

    background:linear-gradient(90deg,#16A34A,#22C55E);

    z-index:1;

}

}


/*==================================================
 PROCESS CARD HOVER SHADOW
==================================================*/

.process-card:hover{

    box-shadow:
    0 20px 40px rgba(0,0,0,.08),
    0 35px 70px rgba(22,163,74,.12);

}


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

.process-card:hover i{

    animation:processPulse .8s;

}

@keyframes processPulse{

    0%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.18);
    }

    100%{
        transform:scale(1.05);
    }

}


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

.process-card,
.process-card *,
.process-card::before,
.process-card::after{

    transition:all .35s ease;

}

/*==================================================
 PESTS SECTION
==================================================*/

.pests-section{
    position:relative;
    background:#ffffff;
    overflow:hidden;
    padding:100px 0;
}

.pests-section::before{

    content:'';

    position:absolute;

    width:450px;
    height:450px;

    border-radius:50%;

    background:rgba(22,163,74,.05);

    top:-200px;
    right:-180px;

}

.pests-section::after{

    content:'';

    position:absolute;

    width:320px;
    height:320px;

    border-radius:50%;

    background:rgba(34,197,94,.05);

    left:-120px;
    bottom:-120px;

}

.pests-section .container{

    position:relative;
    z-index:2;

}


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

.pests-section .section-tag{

    margin-bottom:15px;

}

.pests-section .section-title{

    font-size:46px;

    margin-bottom:18px;

}

.pests-section p{

    color:#6B7280;

}


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

.pest-card{

    position:relative;

    background:#ffffff;

    border-radius:20px;

    text-align:center;

    padding:35px 20px;

    border:1px solid #EEF1F4;

    box-shadow:0 15px 35px rgba(0,0,0,.05);

    overflow:hidden;

    transition:.35s;

    height:100%;

}

.pest-card:hover{

    transform:translateY(-10px);

    border-color:var(--primary);

    box-shadow:0 25px 60px rgba(0,0,0,.12);

}


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

.pest-card i{

    width:90px;

    height:90px;

    margin:0 auto 20px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:linear-gradient(135deg,#16A34A,#22C55E);

    color:#ffffff;

    font-size:34px;

    box-shadow:0 18px 35px rgba(22,163,74,.25);

    transition:.6s;

}

.pest-card:hover i{

    transform:rotateY(360deg) scale(1.1);

}


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

.pest-card h6{

    font-size:18px;

    font-weight:600;

    color:#1F2937;

    margin:0;

    transition:.3s;

}

.pest-card:hover h6{

    color:var(--primary);

}


/*==================================================
 TOP BORDER
==================================================*/

.pest-card::before{

    content:'';

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:5px;

    background:linear-gradient(90deg,#16A34A,#22C55E);

    transform:scaleX(0);

    transition:.35s;

}

.pest-card:hover::before{

    transform:scaleX(1);

}


/*==================================================
 BACKGROUND SHAPE
==================================================*/

.pest-card::after{

    content:'';

    position:absolute;

    width:110px;
    height:110px;

    border-radius:50%;

    background:rgba(22,163,74,.05);

    top:-40px;
    right:-40px;

    transition:.35s;

}

.pest-card:hover::after{

    transform:scale(1.35);

}


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

.pests-section .row{

    row-gap:30px;

}


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

.pest-card:hover i{

    animation:pestPulse .8s;

}

@keyframes pestPulse{

    0%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.18);
    }

    100%{
        transform:scale(1.08);
    }

}


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

.pest-card:hover{

    background:#ffffff;

}


/*==================================================
 SHADOW EFFECT
==================================================*/

.pest-card:hover{

    box-shadow:
    0 20px 45px rgba(0,0,0,.08),
    0 35px 70px rgba(22,163,74,.12);

}


/*==================================================
 OPTIONAL TAG
==================================================*/

.pest-tag{

    display:inline-block;

    padding:6px 16px;

    background:#ECFFF2;

    color:var(--primary);

    border-radius:30px;

    font-size:13px;

    font-weight:600;

    margin-bottom:15px;

}


/*==================================================
 DECORATIVE DOTS
==================================================*/

.pest-pattern{

    position:absolute;

    width:120px;
    height:120px;

    background-image:
    radial-gradient(#16A34A 2px,transparent 2px);

    background-size:18px 18px;

    opacity:.08;

    top:40px;

    left:40px;

}


/*==================================================
 TRANSITION
==================================================*/

.pest-card,
.pest-card *,
.pest-card::before,
.pest-card::after{

    transition:all .35s ease;

}

/*==================================================
 CALL TO ACTION SECTION
==================================================*/

.cta-section{
    position:relative;
    padding:90px 0;
    overflow:hidden;
    background:linear-gradient(135deg,#14532D,#16A34A,#22C55E);
    color:#ffffff;
}

.cta-section::before{
    content:'';
    position:absolute;
    top:-180px;
    left:-180px;
    width:450px;
    height:450px;
    border-radius:50%;
    background:rgba(255,255,255,.08);
}

.cta-section::after{
    content:'';
    position:absolute;
    bottom:-200px;
    right:-200px;
    width:500px;
    height:500px;
    border-radius:50%;
    background:rgba(255,255,255,.05);
}

.cta-section .container{
    position:relative;
    z-index:2;
}


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

.cta-section h2{

    color:#ffffff;
    font-size:48px;
    font-weight:700;
    margin-bottom:20px;

}

.cta-section p{

    color:rgba(255,255,255,.92);
    font-size:18px;
    line-height:1.8;

}


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

.cta-section .btn{

    padding:16px 38px;
    border-radius:50px;
    font-size:16px;
    font-weight:600;
    transition:.35s ease;

}

.cta-section .btn-light{

    background:#ffffff;
    color:var(--primary-dark);
    border:none;
    box-shadow:0 12px 30px rgba(0,0,0,.18);

}

.cta-section .btn-light:hover{

    transform:translateY(-6px);
    background:#f8f8f8;

}

.cta-section .btn-outline-light{

    border:2px solid #ffffff;
    color:#ffffff;
    background:transparent;

}

.cta-section .btn-outline-light:hover{

    background:#ffffff;
    color:var(--primary-dark);
    transform:translateY(-6px);

}


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

.cta-section .btn i{

    margin-right:8px;

}


/*==================================================
 CTA DECORATION SHAPES
==================================================*/

.cta-shape{

    position:absolute;
    border-radius:50%;
    background:rgba(255,255,255,.08);

}

.cta-shape.one{

    width:100px;
    height:100px;
    top:80px;
    right:8%;

}

.cta-shape.two{

    width:60px;
    height:60px;
    left:12%;
    bottom:70px;

}

.cta-shape.three{

    width:35px;
    height:35px;
    top:45%;
    right:40%;

}


/*==================================================
 CTA PATTERN
==================================================*/

.cta-pattern{

    position:absolute;
    width:180px;
    height:180px;
    right:60px;
    bottom:40px;

    background-image:
        radial-gradient(rgba(255,255,255,.35) 2px,transparent 2px);

    background-size:18px 18px;
    opacity:.25;

}


/*==================================================
 CTA GLASS BOX (OPTIONAL)
==================================================*/

.cta-glass{

    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.18);
    backdrop-filter:blur(15px);
    -webkit-backdrop-filter:blur(15px);
    border-radius:20px;
    padding:35px;

}


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

.cta-section:hover::before{

    transform:scale(1.08);
    transition:1s ease;

}

.cta-section:hover::after{

    transform:scale(1.05);
    transition:1s ease;

}


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

.cta-section .btn-light{

    position:relative;
    overflow:hidden;

}

.cta-section .btn-light::after{

    content:'';

    position:absolute;

    top:0;
    left:-120%;

    width:60%;
    height:100%;

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

    transform:skewX(-25deg);

    transition:.7s;

}

.cta-section .btn-light:hover::after{

    left:150%;

}


/*==================================================
 CTA DIVIDER
==================================================*/

.cta-divider{

    width:80px;
    height:4px;
    border-radius:30px;
    background:#ffffff;
    margin:20px 0;

}


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

.cta-badge{

    display:inline-flex;
    align-items:center;
    gap:10px;

    padding:10px 22px;

    border-radius:40px;

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

    color:#ffffff;

    font-weight:600;

    margin-bottom:20px;

}

.cta-badge i{

    color:#FFD54F;

}


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

.cta-floating{

    animation:ctaFloat 4s ease-in-out infinite;

}

@keyframes ctaFloat{

    0%{
        transform:translateY(0);
    }

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

    100%{
        transform:translateY(0);
    }

}


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

.cta-section .row{

    align-items:center;

}

.cta-section .text-lg-end{

    display:flex;
    justify-content:flex-end;
    gap:15px;
    flex-wrap:wrap;

}


/*==================================================
 CTA TRANSITIONS
==================================================*/

.cta-section,
.cta-section *,
.cta-section::before,
.cta-section::after{

    transition:all .35s ease;

}

/*==================================================
  CITIES SECTION
==================================================*/

.cities-section{
    position:relative;
    padding:100px 0;
    background:#F8FFFA;
    overflow:hidden;
}

.cities-section::before{
    content:'';
    position:absolute;
    top:-180px;
    left:-180px;
    width:450px;
    height:450px;
    border-radius:50%;
    background:rgba(22,163,74,.05);
}

.cities-section::after{
    content:'';
    position:absolute;
    bottom:-180px;
    right:-180px;
    width:420px;
    height:420px;
    border-radius:50%;
    background:rgba(34,197,94,.05);
}

.cities-section .container{
    position:relative;
    z-index:2;
}


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

.cities-section .section-tag{
    margin-bottom:15px;
}

.cities-section .section-title{
    font-size:46px;
    margin-bottom:18px;
}

.cities-section p{
    color:#6B7280;
}


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

.city-card{

    position:relative;

    background:#ffffff;

    border-radius:22px;

    padding:35px 25px;

    text-align:center;

    overflow:hidden;

    border:1px solid #EEF1F4;

    box-shadow:0 15px 35px rgba(0,0,0,.05);

    transition:all .35s ease;

    height:100%;

}

.city-card:hover{

    transform:translateY(-12px);

    border-color:#16A34A;

    box-shadow:
        0 25px 60px rgba(0,0,0,.12),
        0 35px 70px rgba(22,163,74,.10);

}


/*==================================================
  CARD TOP BORDER
==================================================*/

.city-card::before{

    content:'';

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:5px;

    background:linear-gradient(90deg,#16A34A,#22C55E);

    transform:scaleX(0);

    transition:.35s;

}

.city-card:hover::before{

    transform:scaleX(1);

}


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

.city-card i{

    width:85px;
    height:85px;

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

    margin:0 auto 25px;

    border-radius:50%;

    background:linear-gradient(135deg,#16A34A,#22C55E);

    color:#ffffff;

    font-size:34px;

    box-shadow:0 18px 35px rgba(22,163,74,.25);

    transition:.6s;

}

.city-card:hover i{

    transform:rotateY(360deg) scale(1.08);

}


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

.city-card h4{

    font-size:24px;

    margin-bottom:15px;

    color:#1F2937;

    transition:.3s;

}

.city-card:hover h4{

    color:var(--primary);

}


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

.city-card p{

    margin:0;

    color:#6B7280;

    line-height:1.8;

    font-size:15px;

}


/*==================================================
  BACKGROUND SHAPE
==================================================*/

.city-card::after{

    content:'';

    position:absolute;

    width:130px;
    height:130px;

    border-radius:50%;

    background:rgba(22,163,74,.05);

    top:-50px;
    right:-50px;

    transition:.4s;

}

.city-card:hover::after{

    transform:scale(1.3);

}


/*==================================================
  CITY NUMBER (OPTIONAL)
==================================================*/

.city-number{

    position:absolute;

    top:18px;
    right:18px;

    font-size:42px;

    font-weight:700;

    color:rgba(22,163,74,.06);

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

}


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

.city-more{

    background:linear-gradient(135deg,#16A34A,#22C55E);

    color:#ffffff;

}

.city-more h4,
.city-more p{

    color:#ffffff;

}

.city-more i{

    background:#ffffff;

    color:var(--primary);

}

.city-more:hover{

    transform:translateY(-12px);

}


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

.cities-section .row{

    row-gap:30px;

}


/*==================================================
  PATTERN
==================================================*/

.city-pattern{

    position:absolute;

    width:140px;
    height:140px;

    top:40px;
    right:60px;

    opacity:.08;

    background-image:
        radial-gradient(#16A34A 2px,transparent 2px);

    background-size:18px 18px;

}


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

.city-card:hover i{

    animation:cityPulse .8s;

}

@keyframes cityPulse{

    0%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.18);
    }

    100%{
        transform:scale(1.08);
    }

}


/*==================================================
  TRANSITIONS
==================================================*/

.city-card,
.city-card *,
.city-card::before,
.city-card::after{

    transition:all .35s ease;

}

/*==================================================
 TESTIMONIAL SECTION
==================================================*/

.testimonial-section{
    position:relative;
    padding:100px 0;
    background:#ffffff;
    overflow:hidden;
}

.testimonial-section::before{
    content:'';
    position:absolute;
    width:450px;
    height:450px;
    background:rgba(22,163,74,.05);
    border-radius:50%;
    top:-180px;
    right:-180px;
}

.testimonial-section::after{
    content:'';
    position:absolute;
    width:350px;
    height:350px;
    background:rgba(34,197,94,.05);
    border-radius:50%;
    bottom:-150px;
    left:-150px;
}

.testimonial-section .container{
    position:relative;
    z-index:2;
}


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

.testimonial-card{

    position:relative;

    background:#ffffff;

    border-radius:24px;

    padding:35px;

    border:1px solid #EEF1F4;

    box-shadow:0 20px 45px rgba(0,0,0,.06);

    transition:.4s ease;

    overflow:hidden;

    height:100%;

}

.testimonial-card:hover{

    transform:translateY(-10px);

    border-color:#16A34A;

    box-shadow:
        0 25px 60px rgba(0,0,0,.12),
        0 35px 70px rgba(22,163,74,.10);

}

.clieant img{
    width:80px !important;
    hight:80px  !important;

}

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

.testimonial-card::before{

    content:"\f10d";

    font-family:"Font Awesome 6 Free";

    font-weight:900;

    position:absolute;

    top:25px;
    right:25px;

    font-size:50px;

    color:rgba(22,163,74,.08);

}


/*==================================================
 STARS
==================================================*/

.stars{

    display:flex;

    gap:6px;

    margin-bottom:18px;

}

.stars i{

    color:#FFC107;

    font-size:18px;

}


/*==================================================
 REVIEW
==================================================*/

.testimonial-card p{

    color:#666;

    font-size:16px;

    line-height:1.9;

    margin-bottom:28px;

    min-height:120px;

}


/*==================================================
 CLIENT
==================================================*/

.client{

    display:flex;

    align-items:center;

    gap:18px;

}

.client img{

    width:70px;

    height:70px;

    border-radius:50%;

    object-fit:cover;

    border:4px solid #ECFFF2;

}

.client h5{

    margin:0;

    font-size:18px;

    color:#1F2937;

}

.client span{

    color:#16A34A;

    font-size:14px;

    font-weight:600;

}


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

.testimonial-card:hover img{

    transform:scale(1.08);

}

.client img{

    transition:.4s ease;

}


/*==================================================
 TOP BORDER
==================================================*/

.testimonial-card::after{

    content:'';

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:5px;

    background:linear-gradient(90deg,#16A34A,#22C55E);

    transform:scaleX(0);

    transition:.35s;

}

.testimonial-card:hover::after{

    transform:scaleX(1);

}


/*==================================================
 OWL CAROUSEL
==================================================*/

.testimonial-slider{

    position:relative;

}

.testimonial-slider .owl-stage{

    display:flex;

}

.testimonial-slider .owl-item{

    display:flex;

}

.testimonial-slider .testimonial-card{

    width:100%;

}


/*==================================================
 OWL DOTS
==================================================*/

.testimonial-slider .owl-dots{

    margin-top:40px;

    text-align:center;

}

.testimonial-slider .owl-dot{

    width:14px;

    height:14px;

    margin:0 6px;

    border-radius:50%;

    background:#D1D5DB !important;

    transition:.35s;

}

.testimonial-slider .owl-dot.active{

    background:#16A34A !important;

    width:38px;

    border-radius:20px;

}


/*==================================================
 OWL NAVIGATION
==================================================*/

.testimonial-slider .owl-nav{

    margin-top:35px;

    text-align:center;

}

.testimonial-slider .owl-nav button{

    width:48px;

    height:48px;

    border-radius:50% !important;

    background:#ECFFF2 !important;

    color:#16A34A !important;

    margin:0 8px;

    font-size:22px !important;

    transition:.35s;

}

.testimonial-slider .owl-nav button:hover{

    background:#16A34A !important;

    color:#ffffff !important;

}


/*==================================================
 GLASS EFFECT
==================================================*/

.testimonial-card.glass{

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

    backdrop-filter:blur(15px);

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

}


/*==================================================
 TRANSITIONS
==================================================*/

.testimonial-card,
.testimonial-card *,
.testimonial-card::before,
.testimonial-card::after{

    transition:all .35s ease;

}

/*==================================================
 FAQ SECTION
==================================================*/

.faq-section{
    position:relative;
    padding:100px 0;
    background:#F8FFFA;
    overflow:hidden;
}

.faq-section::before{
    content:'';
    position:absolute;
    width:420px;
    height:420px;
    border-radius:50%;
    background:rgba(22,163,74,.05);
    top:-180px;
    left:-180px;
}

.faq-section::after{
    content:'';
    position:absolute;
    width:320px;
    height:320px;
    border-radius:50%;
    background:rgba(34,197,94,.05);
    right:-120px;
    bottom:-120px;
}

.faq-section .container{
    position:relative;
    z-index:2;
}


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

.faq-section img{

    width:100%;

    border-radius:24px;

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

    transition:.4s;

}

.faq-section img:hover{

    transform:scale(1.02);

}


/*==================================================
 ACCORDION
==================================================*/

#faqAccordion{

    margin-top:35px;

}

#faqAccordion .accordion-item{

    border:none;

    margin-bottom:18px;

    border-radius:18px;

    overflow:hidden;

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

    background:#ffffff;

}


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

#faqAccordion .accordion-button{

    background:#ffffff;

    color:#1F2937;

    font-weight:600;

    font-size:17px;

    padding:22px 28px;

    box-shadow:none;

}

#faqAccordion .accordion-button:not(.collapsed){

    background:#16A34A;

    color:#ffffff;

}

#faqAccordion .accordion-button:focus{

    box-shadow:none;

}


/*==================================================
 ACCORDION BODY
==================================================*/

#faqAccordion .accordion-body{

    padding:22px 28px;

    font-size:15px;

    color:#666;

    line-height:1.8;

    background:#ffffff;

}


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

#faqAccordion .accordion-button::after{

    background-image:none;

    content:"+";

    font-size:22px;

    font-weight:700;

    color:#16A34A;

    display:flex;

    align-items:center;

    justify-content:center;

    width:30px;

    height:30px;

    border-radius:50%;

    transition:.35s;

}

#faqAccordion .accordion-button:not(.collapsed)::after{

    content:"−";

    color:#ffffff;

    transform:none;

}


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

#faqAccordion .accordion-item:hover{

    transform:translateY(-4px);

    transition:.35s;

    box-shadow:0 18px 40px rgba(0,0,0,.10);

}


/*==================================================
 ACTIVE LEFT BORDER
==================================================*/

#faqAccordion .accordion-item{

    position:relative;

}

#faqAccordion .accordion-item::before{

    content:'';

    position:absolute;

    left:0;

    top:0;

    width:5px;

    height:100%;

    background:linear-gradient(180deg,#16A34A,#22C55E);

    transform:scaleY(0);

    transition:.35s;

}

#faqAccordion .accordion-item:hover::before{

    transform:scaleY(1);

}

#faqAccordion .accordion-item:has(.accordion-button:not(.collapsed))::before{

    transform:scaleY(1);

}


/*==================================================
 FAQ NUMBER (OPTIONAL)
==================================================*/

.faq-number{

    display:inline-flex;

    width:36px;

    height:36px;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#ECFFF2;

    color:#16A34A;

    font-weight:700;

    margin-right:12px;

}


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

.faq-badge{

    display:inline-block;

    padding:8px 18px;

    border-radius:30px;

    background:#ECFFF2;

    color:#16A34A;

    font-size:14px;

    font-weight:600;

    margin-bottom:18px;

}


/*==================================================
 DECORATIVE PATTERN
==================================================*/

.faq-pattern{

    position:absolute;

    width:140px;

    height:140px;

    top:60px;

    right:50px;

    opacity:.08;

    background-image:
        radial-gradient(#16A34A 2px,transparent 2px);

    background-size:18px 18px;

}


/*==================================================
 GLASS STYLE (OPTIONAL)
==================================================*/

.faq-glass{

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

    backdrop-filter:blur(15px);

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

    border-radius:20px;

}


/*==================================================
 ACCORDION TRANSITIONS
==================================================*/

#faqAccordion .accordion-item,
#faqAccordion .accordion-button,
#faqAccordion .accordion-body{

    transition:all .35s ease;

}


/*==================================================
 INDUSTRY SECTION
==================================================*/

.industry-section{
    position:relative;
    padding:100px 0;
    background:#ffffff;
    overflow:hidden;
}

.industry-section::before{

    content:'';

    position:absolute;

    width:450px;
    height:450px;

    border-radius:50%;

    background:rgba(22,163,74,.05);

    top:-180px;
    right:-180px;

}

.industry-section::after{

    content:'';

    position:absolute;

    width:350px;
    height:350px;

    border-radius:50%;

    background:rgba(34,197,94,.05);

    left:-150px;
    bottom:-150px;

}

.industry-section .container{

    position:relative;
    z-index:2;

}


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

.industry-section .section-tag{

    margin-bottom:15px;

}

.industry-section .section-title{

    font-size:46px;

    margin-bottom:18px;

}

.industry-section p{

    color:#6B7280;

}


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

.industry-card{

    position:relative;

    background:#ffffff;

    border-radius:22px;

    padding:35px 20px;

    text-align:center;

    overflow:hidden;

    border:1px solid #EEF1F4;

    box-shadow:0 15px 35px rgba(0,0,0,.05);

    transition:all .35s ease;

    height:100%;

}

.industry-card:hover{

    transform:translateY(-10px);

    border-color:#16A34A;

    box-shadow:
    0 20px 40px rgba(0,0,0,.08),
    0 35px 70px rgba(22,163,74,.12);

}


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

.industry-card i{

    width:90px;

    height:90px;

    margin:0 auto 22px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:linear-gradient(135deg,#16A34A,#22C55E);

    color:#ffffff;

    font-size:34px;

    box-shadow:0 18px 35px rgba(22,163,74,.25);

    transition:.6s;

}

.industry-card:hover i{

    transform:rotateY(360deg) scale(1.1);

}


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

.industry-card h6{

    margin:0;

    font-size:18px;

    font-weight:600;

    color:#1F2937;

    transition:.3s;

}

.industry-card:hover h6{

    color:#16A34A;

}


/*==================================================
 TOP BORDER
==================================================*/

.industry-card::before{

    content:'';

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:5px;

    background:linear-gradient(90deg,#16A34A,#22C55E);

    transform:scaleX(0);

    transition:.35s;

}

.industry-card:hover::before{

    transform:scaleX(1);

}


/*==================================================
 BACKGROUND SHAPE
==================================================*/

.industry-card::after{

    content:'';

    position:absolute;

    width:120px;
    height:120px;

    border-radius:50%;

    background:rgba(22,163,74,.05);

    top:-40px;
    right:-40px;

    transition:.35s;

}

.industry-card:hover::after{

    transform:scale(1.35);

}


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

.industry-section .row{

    row-gap:30px;

}


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

.industry-card:hover i{

    animation:industryPulse .8s;

}

@keyframes industryPulse{

    0%{

        transform:scale(1);

    }

    50%{

        transform:scale(1.18);

    }

    100%{

        transform:scale(1.08);

    }

}


/*==================================================
 PATTERN
==================================================*/

.industry-pattern{

    position:absolute;

    width:140px;

    height:140px;

    left:60px;

    top:50px;

    opacity:.08;

    background-image:
        radial-gradient(#16A34A 2px,transparent 2px);

    background-size:18px 18px;

}


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

.industry-badge{

    display:inline-block;

    padding:8px 18px;

    border-radius:30px;

    background:#ECFFF2;

    color:#16A34A;

    font-size:13px;

    font-weight:600;

    margin-bottom:18px;

}


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

.industry-card p{

    margin-top:12px;

    margin-bottom:0;

    color:#6B7280;

    font-size:14px;

    line-height:1.7;

}


/*==================================================
 GLASS STYLE
==================================================*/

.industry-card.glass{

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

    backdrop-filter:blur(15px);

    -webkit-backdrop-filter:blur(15px);

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

}


/*==================================================
 TRANSITIONS
==================================================*/

.industry-card,
.industry-card *,
.industry-card::before,
.industry-card::after{

    transition:all .35s ease;

}

/*==================================================
 BLOG SECTION
==================================================*/

.blog-section{
    position:relative;
    padding:100px 0;
    background:#F8FFFA;
    overflow:hidden;
}

.blog-section::before{

    content:'';

    position:absolute;

    width:450px;
    height:450px;

    background:rgba(22,163,74,.05);

    border-radius:50%;

    top:-180px;
    left:-180px;

}

.blog-section::after{

    content:'';

    position:absolute;

    width:350px;
    height:350px;

    background:rgba(34,197,94,.05);

    border-radius:50%;

    right:-150px;
    bottom:-150px;

}

.blog-section .container{

    position:relative;

    z-index:2;

}


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

.blog-card{

    position:relative;

    background:#ffffff;

    border-radius:22px;

    overflow:hidden;

    border:1px solid #EEF1F4;

    box-shadow:0 18px 40px rgba(0,0,0,.06);

    transition:all .35s ease;

}

.blog-card:hover{

    transform:translateY(-12px);

    border-color:#16A34A;

    box-shadow:
    0 25px 60px rgba(0,0,0,.10),
    0 35px 70px rgba(22,163,74,.12);

}


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

.blog-card img{

    width:100%;

    height:260px;

    object-fit:cover;

    transition:.5s ease;

}

.blog-card:hover img{

    transform:scale(1.08);

}


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

.blog-image{

    position:relative;

    overflow:hidden;

}

.blog-image::before{

    content:'';

    position:absolute;

    inset:0;

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

    opacity:0;

    transition:.35s;

}

.blog-card:hover .blog-image::before{

    opacity:1;

}


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

.blog-content{

    padding:28px;

}

.blog-content h4{

    font-size:24px;

    line-height:1.5;

    margin:18px 0;

    transition:.3s;

}

.blog-card:hover h4{

    color:var(--primary);

}

.blog-content p{

    color:#6B7280;

    line-height:1.9;

    margin-bottom:25px;

}


/*==================================================
 BLOG DATE
==================================================*/

.blog-date{

    display:inline-flex;

    align-items:center;

    gap:8px;

    padding:8px 18px;

    border-radius:30px;

    background:#ECFFF2;

    color:#16A34A;

    font-size:14px;

    font-weight:600;

}

.blog-date i{

    color:#16A34A;

}


/*==================================================
 READ MORE
==================================================*/

.read-more{

    display:inline-flex;

    align-items:center;

    gap:10px;

    color:#16A34A;

    font-weight:600;

    transition:.35s;

}

.read-more i{

    transition:.35s;

}

.read-more:hover{

    color:#14532D;

}

.read-more:hover i{

    transform:translateX(6px);

}


/*==================================================
 CATEGORY TAG
==================================================*/

.blog-category{

    position:absolute;

    top:20px;

    left:20px;

    background:#16A34A;

    color:#ffffff;

    padding:8px 16px;

    border-radius:30px;

    font-size:13px;

    font-weight:600;

    z-index:2;

}


/*==================================================
 TOP BORDER
==================================================*/

.blog-card::before{

    content:'';

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:5px;

    background:linear-gradient(90deg,#16A34A,#22C55E);

    transform:scaleX(0);

    transition:.35s;

}

.blog-card:hover::before{

    transform:scaleX(1);

}


/*==================================================
 BACKGROUND SHAPE
==================================================*/

.blog-card::after{

    content:'';

    position:absolute;

    width:130px;

    height:130px;

    border-radius:50%;

    background:rgba(22,163,74,.05);

    right:-40px;

    top:-40px;

    transition:.35s;

}

.blog-card:hover::after{

    transform:scale(1.3);

}


/*==================================================
 AUTHOR
==================================================*/

.blog-author{

    display:flex;

    align-items:center;

    gap:12px;

    margin-top:20px;

}

.blog-author img{

    width:45px;

    height:45px;

    border-radius:50%;

    object-fit:cover;

}

.blog-author h6{

    margin:0;

    font-size:15px;

}

.blog-author span{

    font-size:13px;

    color:#888;

}


/*==================================================
 BLOG PATTERN
==================================================*/

.blog-pattern{

    position:absolute;

    width:140px;

    height:140px;

    top:60px;

    right:60px;

    opacity:.08;

    background-image:
    radial-gradient(#16A34A 2px,transparent 2px);

    background-size:18px 18px;

}


/*==================================================
 BLOG TRANSITIONS
==================================================*/

.blog-card,
.blog-card *,
.blog-card::before,
.blog-card::after{

    transition:all .35s ease;

}

/*==================================================
 CONTACT SECTION
==================================================*/

.contact-section{
    position:relative;
    padding:100px 0;
    background:#ffffff;
    overflow:hidden;
}

.contact-section::before{
    content:'';
    position:absolute;
    width:450px;
    height:450px;
    background:rgba(22,163,74,.05);
    border-radius:50%;
    top:-180px;
    right:-180px;
}

.contact-section::after{
    content:'';
    position:absolute;
    width:350px;
    height:350px;
    background:rgba(34,197,94,.05);
    border-radius:50%;
    left:-150px;
    bottom:-150px;
}

.contact-section .container{
    position:relative;
    z-index:2;
}

/*==================================================
 CONTACT INFO
==================================================*/

.contact-info{
    margin-top:40px;
}

.info-box{

    display:flex;

    align-items:flex-start;

    gap:18px;

    background:#ffffff;

    border:1px solid #EEF1F4;

    border-radius:18px;

    padding:22px;

    margin-bottom:20px;

    box-shadow:0 15px 35px rgba(0,0,0,.05);

    transition:.35s;

}

.info-box:hover{

    transform:translateY(-8px);

    border-color:#16A34A;

    box-shadow:0 20px 45px rgba(22,163,74,.12);

}

.info-box i{

    width:65px;

    height:65px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:linear-gradient(135deg,#16A34A,#22C55E);

    color:#ffffff;

    font-size:24px;

    flex-shrink:0;

    box-shadow:0 12px 25px rgba(22,163,74,.25);

}

.info-box h5{

    margin-bottom:6px;

    color:#1F2937;

    font-size:18px;

}

.info-box p{

    margin:0;

    color:#6B7280;

    line-height:1.7;

}

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

.contact-form{

    background:#ffffff;

    padding:40px;

    border-radius:24px;

    border:1px solid #EEF1F4;

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

}

.contact-form .form-control,
.contact-form .form-select{

    height:58px;

    border-radius:14px;

    border:1px solid #D9E3DD;

    padding:12px 18px;

    font-size:15px;

    transition:.35s;

    background:#ffffff;

}

.contact-form textarea.form-control{

    height:160px;

    resize:none;

    padding-top:18px;

}

.contact-form .form-control:focus,
.contact-form .form-select:focus{

    border-color:#16A34A;

    box-shadow:0 0 0 .18rem rgba(22,163,74,.15) !important;

}

.contact-form .form-control::placeholder{

    color:#999999;

}

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

.contact-form .btn{

    width:100%;

    padding:16px;

    border-radius:50px;

    font-size:17px;

    font-weight:600;

    background:linear-gradient(135deg,#16A34A,#22C55E);

    border:none;

    transition:.35s;

}

.contact-form .btn:hover{

    transform:translateY(-4px);

    box-shadow:0 18px 40px rgba(22,163,74,.28);

}

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

.contact-form label{

    font-weight:600;

    color:#1F2937;

    margin-bottom:8px;

}

/*==================================================
 INPUT ICON STYLE (OPTIONAL)
==================================================*/

.input-group-text{

    background:#ECFFF2;

    border:1px solid #D9E3DD;

    color:#16A34A;

}

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

.form-title{

    font-size:28px;

    margin-bottom:10px;

}

.form-subtitle{

    color:#6B7280;

    margin-bottom:30px;

}

/*==================================================
 SUCCESS MESSAGE
==================================================*/

.form-success{

    display:none;

    padding:16px;

    border-radius:12px;

    background:#ECFFF2;

    color:#16A34A;

    font-weight:600;

    margin-top:20px;

}

/*==================================================
 ERROR MESSAGE
==================================================*/

.form-error{

    display:none;

    padding:16px;

    border-radius:12px;

    background:#FFECEC;

    color:#DC2626;

    font-weight:600;

    margin-top:20px;

}

/*==================================================
 MAP SECTION
==================================================*/

.map-section{

    position:relative;

    overflow:hidden;

}

.map-section iframe{

    width:100%;

    height:500px;

    border:none;

    display:block;

    filter:grayscale(15%);

    transition:.35s;

}

.map-section:hover iframe{

    filter:grayscale(0);

}

/*==================================================
 CONTACT PATTERN
==================================================*/

.contact-pattern{

    position:absolute;

    width:140px;

    height:140px;

    top:60px;

    left:60px;

    opacity:.08;

    background-image:
        radial-gradient(#16A34A 2px,transparent 2px);

    background-size:18px 18px;

}

/*==================================================
 CONTACT DECORATIVE SHAPE
==================================================*/

.contact-shape{

    position:absolute;

    width:120px;

    height:120px;

    border-radius:50%;

    background:rgba(22,163,74,.08);

}

.contact-shape.one{

    top:80px;

    right:8%;

}

.contact-shape.two{

    bottom:70px;

    left:8%;

}

/*==================================================
 TRANSITIONS
==================================================*/

.contact-form,
.contact-form *,
.info-box,
.info-box *{

    transition:all .35s ease;

}

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

.footer{

    position:relative;

    background:#0F172A;

    color:#CBD5E1;

    padding:90px 0 30px;


    max-height: 600px;
    overflow-y: auto;
    overflow-x: hidden;

}

.footer::before{

    content:'';

    position:absolute;

    width:500px;
    height:500px;

    border-radius:50%;

    background:rgba(34,197,94,.05);

    top:-220px;
    right:-220px;

}

.footer::after{

    content:'';

    position:absolute;

    width:350px;
    height:350px;

    border-radius:50%;

    background:rgba(22,163,74,.06);

    bottom:-150px;
    left:-150px;

}

.footer .container{

    position:relative;

    z-index:2;

}


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

.footer-logo{

    max-height:70px;

    margin-bottom:25px;

}

.footer p{

    color:#CBD5E1;

    line-height:1.9;

}


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

.footer h4{

    color:#ffffff;

    margin-bottom:28px;

    font-size:22px;

    position:relative;

}

.footer h4::after{

    content:'';

    position:absolute;

    left:0;

    bottom:-10px;

    width:55px;

    height:3px;

    border-radius:20px;

    background:linear-gradient(90deg,#16A34A,#22C55E);

}


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

.footer ul{

    padding:0;

    margin:0;

}

.footer ul li{

    list-style:none;

    margin-bottom:14px;

}

.footer ul li a{

    color:#CBD5E1;

    transition:.35s;

    display:inline-flex;

    align-items:center;

}

.footer ul li a::before{

    content:"\203A";

    margin-right:10px;

    color:#22C55E;

    transition:.35s;

}

.footer ul li a:hover{

    color:#22C55E;

    transform:translateX(6px);

}


/*==================================================
 SOCIAL ICONS
==================================================*/

.footer-social{

    display:flex;

    gap:15px;

    margin-top:30px;

}

.footer-social a{

    width:48px;

    height:48px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

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

    color:#ffffff;

    transition:.35s;

}

.footer-social a:hover{

    background:linear-gradient(135deg,#16A34A,#22C55E);

    transform:translateY(-6px);

}


/*==================================================
 NEWSLETTER
==================================================*/

.newsletter{

    position:relative;

    margin-top:20px;

}

.newsletter input{

    width:100%;

    height:56px;

    border:none;

    border-radius:50px;

    padding:0 150px 0 22px;

    background:#ffffff;

    color:#1F2937;

    font-size:15px;

}

.newsletter input:focus{

    outline:none;

}

.newsletter button{

    position:absolute;

    top:6px;

    right:6px;

    height:44px;

    padding:0 24px;

    border:none;

    border-radius:40px;

    background:linear-gradient(135deg,#16A34A,#22C55E);

    color:#ffffff;

    font-weight:600;

    cursor:pointer;

    transition:.35s;

}

.newsletter button:hover{

    transform:scale(1.05);

}


/*==================================================
 CONTACT LIST
==================================================*/

.footer-contact{

    margin-top:20px;

}

.footer-contact li{

    display:flex;

    align-items:flex-start;

    margin-bottom:18px;

    color:#CBD5E1;

}

.footer-contact i{

    color:#22C55E;

    margin-right:15px;

    margin-top:5px;

    font-size:18px;

}


/*==================================================
 DIVIDER
==================================================*/

.footer hr{

    border-color:rgba(255,255,255,.08);

    margin:50px 0 25px;

}


/*==================================================
 COPYRIGHT
==================================================*/

.footer-bottom{

    display:flex;

    justify-content:space-between;

    align-items:center;

    flex-wrap:wrap;

    gap:15px;

}

.footer-bottom p{

    margin:0;

    color:#94A3B8;

}

.footer-bottom a{

    color:#CBD5E1;

    transition:.35s;

}

.footer-bottom a:hover{

    color:#22C55E;

}


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

.footer-pattern{

    position:absolute;

    width:180px;

    height:180px;

    top:70px;

    left:70px;

    opacity:.05;

    background-image:
        radial-gradient(#22C55E 2px,transparent 2px);

    background-size:18px 18px;

}


/*==================================================
 GLASS FOOTER CARD
==================================================*/

.footer-card{

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

    backdrop-filter:blur(10px);

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

    border-radius:18px;

    padding:25px;

}


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

.footer-card:hover{

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

    transform:translateY(-5px);

}


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

.footer,
.footer *,
.footer::before,
.footer::after{

    transition:all .35s ease;

}

/*==================================================
  WHATSAPP FLOATING BUTTON
==================================================*/

.whatsapp-btn{
    position:fixed;
    right:25px;
    bottom:95px;
    width:65px;
    height:65px;
    border-radius:50%;
    background:#25D366;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:32px;
    z-index:999;
    box-shadow:0 15px 40px rgba(37,211,102,.45);
    animation:whatsappPulse 2s infinite;
    transition:.35s;
}

.whatsapp-btn:hover{
    color:#fff;
    transform:scale(1.12);
}

@keyframes whatsappPulse{

    0%{
        box-shadow:0 0 0 0 rgba(37,211,102,.60);
    }

    70%{
        box-shadow:0 0 0 18px rgba(37,211,102,0);
    }

    100%{
        box-shadow:0 0 0 0 rgba(37,211,102,0);
    }

}

/*==================================================
 SCROLL TO TOP
==================================================*/

#scrollTop{

    position:fixed;

    right:25px;

    bottom:20px;

    width:55px;

    height:55px;

    border-radius:50%;

    background:linear-gradient(135deg,#16A34A,#22C55E);

    color:#fff;

    display:none;

    align-items:center;

    justify-content:center;

    cursor:pointer;

    z-index:999;

    box-shadow:0 15px 35px rgba(22,163,74,.30);

    transition:.35s;
    padding:10px 18px;

}

#scrollTop:hover{

    transform:translateY(-6px);

}

/*==================================================
 PRELOADER
==================================================*/

.preloader{

    position:fixed;

    inset:0;

    background:#fff;

    display:flex;

    justify-content:center;

    align-items:center;

    z-index:99999;

}

.loader{

    width:75px;

    height:75px;

    border-radius:50%;

    border:6px solid rgba(22,163,74,.15);

    border-top-color:#16A34A;

    animation:loaderRotate 1s linear infinite;

}

@keyframes loaderRotate{

    from{

        transform:rotate(0deg);

    }

    to{

        transform:rotate(360deg);

    }

}

/*==================================================
 GRADIENT HELPERS
==================================================*/

.bg-primary-gradient{

    background:linear-gradient(135deg,#16A34A,#22C55E);

}

.bg-dark-gradient{

    background:linear-gradient(135deg,#0F172A,#1E293B);

}

.text-gradient{

    background:linear-gradient(135deg,#16A34A,#22C55E);

    -webkit-background-clip:text;

    -webkit-text-fill-color:transparent;

}

/*==================================================
 GLASS EFFECT
==================================================*/

.glass{

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

    backdrop-filter:blur(15px);

    -webkit-backdrop-filter:blur(15px);

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

}

/*==================================================
 SHADOW HELPERS
==================================================*/

.shadow-sm-custom{

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

}

.shadow-md-custom{

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

}

.shadow-lg-custom{

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

}

/*==================================================
 BORDER RADIUS
==================================================*/

.radius-10{border-radius:10px;}
.radius-15{border-radius:15px;}
.radius-20{border-radius:20px;}
.radius-30{border-radius:30px;}
.radius-circle{border-radius:50%;}

/*==================================================
 TRANSITIONS
==================================================*/

.transition{
    transition:all .35s ease;
}

.hover-up:hover{
    transform:translateY(-8px);
}

.hover-scale:hover{
    transform:scale(1.05);
}

.hover-rotate:hover{
    transform:rotate(3deg);
}

/*==================================================
 OPACITY HELPERS
==================================================*/

.opacity-75{opacity:.75;}
.opacity-50{opacity:.5;}
.opacity-25{opacity:.25;}

/*==================================================
 Z INDEX
==================================================*/

.z-1{z-index:1;}
.z-2{z-index:2;}
.z-5{z-index:5;}
.z-10{z-index:10;}
.z-999{z-index:999;}

/*==================================================
 SPACING HELPERS
==================================================*/

.pt-120{padding-top:120px;}
.pb-120{padding-bottom:120px;}

.mt-120{margin-top:120px;}
.mb-120{margin-bottom:120px;}

.mt-80{margin-top:80px;}
.mb-80{margin-bottom:80px;}

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

.overlay-dark{

    position:absolute;

    inset:0;

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

}

.overlay-green{

    position:absolute;

    inset:0;

    background:rgba(20,83,45,.70);

}

/*==================================================
 SECTION SHAPE
==================================================*/

.shape-circle{

    position:absolute;

    border-radius:50%;

    background:rgba(22,163,74,.06);

}

.shape-circle.small{

    width:70px;

    height:70px;

}

.shape-circle.medium{

    width:140px;

    height:140px;

}

.shape-circle.large{

    width:300px;

    height:300px;

}

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

.fade-up{

    animation:fadeUp .8s ease;

}

.fade-down{

    animation:fadeDown .8s ease;

}

.fade-left{

    animation:fadeLeft .8s ease;

}

.fade-right{

    animation:fadeRight .8s ease;

}

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

@keyframes fadeDown{

    from{

        opacity:0;

        transform:translateY(-40px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

@keyframes fadeLeft{

    from{

        opacity:0;

        transform:translateX(-40px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}

@keyframes fadeRight{

    from{

        opacity:0;

        transform:translateX(40px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}

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

.float-animation{

    animation:floatObject 4s ease-in-out infinite;

}

@keyframes floatObject{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-15px);

    }

    100%{

        transform:translateY(0);

    }

}

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

.rotate-animation{

    animation:rotate360 15s linear infinite;

}

@keyframes rotate360{

    from{

        transform:rotate(0deg);

    }

    to{

        transform:rotate(360deg);

    }

}

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

.img-cover{

    width:100%;

    height:100%;

    object-fit:cover;

}

.img-contain{

    object-fit:contain;

}

/*==================================================
 CURSOR
==================================================*/

.cursor-pointer{

    cursor:pointer;

}

/*==================================================
 SELECTION
==================================================*/

::selection{

    background:#16A34A;

    color:#ffffff;

}

/*==================================================
 CUSTOM SCROLLBAR
==================================================*/

::-webkit-scrollbar{

    width:8px;

}

::-webkit-scrollbar-track{

    background:#F5F5F5;

}

::-webkit-scrollbar-thumb{

    background:#16A34A;

    border-radius:20px;

}

::-webkit-scrollbar-thumb:hover{

    background:#14532D;

}


/*=====================================================
CONTACT PAGE
======================================================*/

.page-header{
    background:#f8fff8;
    padding:90px 0;
}

.page-header h1{
    font-size:52px;
    font-weight:700;
    margin-bottom:20px;
}

.page-header h1 span{
    color:#198754;
}

.sub-title{
    display:inline-block;
    background:#198754;
    color:#fff;
    padding:8px 20px;
    border-radius:30px;
    font-size:14px;
    margin-bottom:20px;
}

.page-breadcrumb{
    margin-top:25px;
}

.page-breadcrumb a{
    color:#198754;
    text-decoration:none;
    font-weight:600;
}

.page-breadcrumb span{
    margin:0 6px;
}

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

.contact-card{

    background:#fff;

    border-radius:15px;

    padding:35px 25px;

    text-align:center;

    transition:.4s;

    height:100%;

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

}

.contact-card:hover{

    transform:translateY(-10px);

}

.contact-card .icon{

    width:75px;

    height:75px;

    margin:auto;

    border-radius:50%;

    background:#198754;

    color:#fff;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:30px;

    margin-bottom:20px;

}

.contact-card a{

    color:#198754;

    text-decoration:none;

    font-weight:600;

}

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

.booking-form-wrapper{

    background:#fff;

    border-radius:20px;

}

.section-heading h4{

    font-weight:700;

}

.form-floating>.form-control,

.form-floating>.form-select{

    height:58px;

}

.form-floating textarea{

    min-height:140px;

}

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

.booking-progress{

    margin-bottom:40px;

}

.booking-progress .step{

    text-align:center;

    flex:1;

}

.step-number{

    width:45px;

    height:45px;

    background:#e9ecef;

    border-radius:50%;

    display:inline-flex;

    justify-content:center;

    align-items:center;

    font-weight:bold;

    margin-bottom:10px;

}

.step.active .step-number{

    background:#198754;

    color:#fff;

}

/*=====================================================
DIVIDER
======================================================*/

.section-divider{

    text-align:center;

}

.divider-icon{

    width:70px;

    height:70px;

    margin:auto;

    background:#198754;

    color:#fff;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:28px;

}

/*=====================================================
CHECKBOX
======================================================*/

.custom-checkbox{

    background:#fff;

    border:1px solid #dee2e6;

    border-radius:10px;

    padding:15px;

    transition:.3s;

}

.custom-checkbox:hover{

    border-color:#198754;

    background:#f8fff8;

}

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

.property-card{

    cursor:pointer;

    display:block;

}

.property-card input{

    display:none;

}

.property-box{

    border:2px solid #dee2e6;

    border-radius:15px;

    padding:25px;

    text-align:center;

    transition:.3s;

    height:100%;

}

.property-card input:checked + .property-box{

    border-color:#198754;

    background:#f4fff6;

}

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

.custom-radio-card{

    text-align:center;

}

.custom-radio-card input{

    display:none;

}

.custom-radio-card label{

    border:2px solid #ddd;

    border-radius:12px;

    padding:18px 10px;

    cursor:pointer;

    transition:.3s;

}

.custom-radio-card input:checked + label{

    background:#198754;

    color:#fff;

    border-color:#198754;

}

/*=====================================================
BOOKING NOTICE
======================================================*/

.booking-notice{

    margin-top:50px;

}

.advance-price{

    background:#f8fff8;

    border-radius:15px;

    padding:25px;

}

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

.cta-section{

    padding:80px 0;

}

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

.accordion-button:not(.collapsed){

    background:#198754;

    color:#fff;

}

.accordion-button:focus{

    box-shadow:none;

}

/*=====================================================
MAP
======================================================*/

.map-box{

    border-radius:20px;

    overflow:hidden;

}

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

.btn-success{

    background:#198754;

    border-color:#198754;

}

.btn-success:hover{

    background:#157347;

}

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

@media(max-width:991px){

.page-header{

padding:70px 0;

}

.page-header h1{

font-size:36px;

}

.contact-card{

margin-bottom:25px;

}

.property-box{

padding:20px;

}

}

@media(max-width:767px){

.step h6{

font-size:12px;

}

.step-number{

width:38px;

height:38px;

}

.booking-progress{

overflow-x:auto;

}

.cta-section{

text-align:center;

}

}

.page-banner{
    padding:0;
}

.breadcrumb-item+.breadcrumb-item::before{
    color: rgb(255 255 255 / 75%);
}

.breadcrumb .breadcrumb-item a{
    color: rgb(255 255 255 / 75%);
}
.breadcrumb-item.active{
    color: rgb(255 255 255 / 75%);
}

/*=========================================
COMMERCIAL PEST CONTROL PAGE
=========================================*/

/* Section Spacing */

.service-details,
section {
    position: relative;
}

section {
    padding-top: 80px;
    padding-bottom: 80px;
}

/* Section Title */

.section-title,
section h2 {
    font-weight: 700;
    margin-bottom: 20px;
    color: #222;
}

section h5 {
    font-weight: 600;
}

section p {
    color: #666;
    line-height: 1.8;
}

/* Badge */

.badge.bg-success {
    font-size: 14px;
    letter-spacing: .5px;
    padding: 10px 20px;
    border-radius: 30px;
}

/* Cards */

.card {
    border-radius: 15px;
    transition: .35s ease;
    overflow: hidden;
}

.card:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 40px rgba(0,0,0,.12);
}

.card-body {
    padding: 30px;
}

/* Icons */

.card i {
    color: #28a745;
    margin-bottom: 20px;
}

.fa-3x {
    font-size: 48px;
}

/* Lists */

.list-group-item {
    border: none;
    padding: 12px 0;
    color: #555;
}

.list-unstyled li {
    margin-bottom: 15px;
    font-size: 16px;
}

/* Image */

.service-details img {
    border-radius: 20px;
}

/* Process Section */

.card h1 {
    font-size: 60px;
    font-weight: 700;
    color: #28a745;
}

/* Service Area */

.border.rounded {
    transition: .3s;
    font-weight: 600;
    border-radius: 12px !important;
    background: #fff;
}

.border.rounded:hover {
    background: #28a745;
    color: #fff;
    border-color: #28a745 !important;
}

/* Green Sections */

.bg-success h2,
.bg-success h3,
.bg-success h4,
.bg-success h5,
.bg-success p,
.bg-success li {
    color: #fff;
}

/* Buttons */

.btn {
    border-radius: 50px;
    padding: 12px 30px;
    font-weight: 600;
    transition: .3s;
}

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

.btn-light:hover,
.btn-warning:hover,
.btn-dark:hover {
    transform: translateY(-2px);
}

/* CTA */

.bg-success .btn {
    margin-top: 10px;
}

/* Responsive */

@media (max-width:991px){

section{
    padding:60px 0;
}

.card{
    margin-bottom:20px;
}

.service-details img{
    margin-top:40px;
}

}

@media (max-width:767px){

section h2{
    font-size:30px;
}

section h5{
    font-size:20px;
}

.card-body{
    padding:25px;
}

.fa-3x{
    font-size:38px;
}

.btn{
    width:100%;
    margin-bottom:15px;
}

}

/*=========================================
GALLERY
==========================================*/

.gallery-item{

position:relative;

overflow:hidden;

border-radius:15px;

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

}

.gallery-item img{

width:100%;

height:280px;

object-fit:cover;

transition:.5s;

}

.gallery-overlay{

position:absolute;

left:0;

right:0;

bottom:0;

padding:20px;

background:linear-gradient(to top,rgba(0,0,0,.85),transparent);

color:#fff;

opacity:0;

transition:.4s;

}

.gallery-overlay h5{

margin:0;

font-weight:600;

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item:hover .gallery-overlay{

opacity:1;

}

.gallery-item a{

text-decoration:none;

}

@media(max-width:991px){

.gallery-item img{

height:240px;

}

}

@media(max-width:767px){

.gallery-item img{

height:220px;

}

}

/*=========================================
SERVICES PAGE
=========================================*/

.services-page{
    background:#f8f9fa;
    padding:60px 0;
}

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

.service-sidebar{
    background:#fff;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 10px 35px rgba(0,0,0,.08);
    position:sticky;
    top:100px;
}

.sidebar-title{
    background:#198754;
    color:#fff;
    padding:18px;
    margin:0;
    font-size:24px;
    font-weight:700;
    text-align:center;
}

.service-menu{
    list-style:none;
    margin:0;
    padding:0;
}

.service-menu li{
    border-bottom:1px solid #eee;
}

.service-menu li:last-child{
    border-bottom:none;
}

.service-menu li a{

    display:flex;
    align-items:center;
    gap:12px;

    color:#222;
    text-decoration:none;

    padding:15px 20px;

    transition:.35s;

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

}

.service-menu li a i{
    width:20px;
    color:#198754;
    font-size:16px;
}

.service-menu li a:hover{

    background:#198754;
    color:#fff;
    padding-left:28px;

}

.service-menu li a:hover i{
    color:#fff;
}

.service-menu li a.active{

    background:#198754;
    color:#fff;

}

.service-menu li a.active i{
    color:#fff;
}


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

.service-content{

    background:#fff;

    padding:40px;

    border-radius:12px;

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

}

.service-content img{

    border-radius:10px;

}

.service-content h1{

    font-size:38px;

    font-weight:700;

    margin-bottom:20px;

}

.service-content h2{

    font-size:34px;

    font-weight:700;

}

.service-content h3{

    font-size:28px;

    font-weight:700;

}

.service-content p{

    color:#666;

    line-height:30px;

    font-size:16px;

}


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

.service-image{

    overflow:hidden;

    border-radius:10px;

}

.service-image img{

    width:100%;

    transition:.4s;

}

.service-image:hover img{

    transform:scale(1.05);

}


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

.badge{

    font-size:14px;

    padding:10px 20px;

}


/*=========================================
SERVICE LIST
=========================================*/

.service-list{

    margin:0;

    padding:0;

}

.service-list li{

    list-style:none;

    margin-bottom:18px;

    font-size:16px;

    color:#555;

}

.service-list li i{

    margin-right:10px;

    color:#198754;

}


/*=========================================
INFO BOX
=========================================*/

.service-info-box{

    background:#f8f9fa;

    border-left:5px solid #198754;

    padding:25px;

    border-radius:8px;

}

.service-info-box h4{

    font-weight:700;

    margin-bottom:20px;

}

.service-info-box p{

    margin-bottom:12px;

}


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

.service-card{

    background:#fff;

    border-radius:12px;

    padding:30px;

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

    transition:.35s;

    height:100%;

}

.service-card:hover{

    transform:translateY(-8px);

}

.service-card i{

    color:#198754;

}

.service-card h4{

    margin:20px 0 15px;

    font-weight:700;

}


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

.process-box{

    background:#fff;

    border-radius:10px;

    text-align:center;

    padding:25px;

    box-shadow:0 8px 25px rgba(0,0,0,.08);

    transition:.35s;

    height:100%;

}

.process-box:hover{

    transform:translateY(-8px);

}

.process-number{

    width:70px;

    height:70px;

    margin:auto;

    background:#198754;

    color:#fff;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:24px;

    font-weight:700;

    margin-bottom:20px;

}

.process-box h5{

    font-weight:700;

    margin-bottom:15px;

}


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

.service-cta{

    background:linear-gradient(135deg,#198754,#0b5d34);

    border-radius:15px;

    padding:50px;

    margin-top:50px;

}

.service-cta h2,
.service-cta h3{

    color:#fff;

}

.service-cta p{

    color:#f3f3f3;

}

.service-cta .btn{

    border-radius:50px;

    font-weight:600;

    padding:13px 30px;

}


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

.btn-warning{

    color:#000;

    font-weight:700;

}

.btn-warning:hover{

    transform:translateY(-2px);

}

.btn-success:hover,
.btn-light:hover{

    transform:translateY(-2px);

}


/*=========================================
SECTION SPACING
=========================================*/

.service-section{

    margin-bottom:80px;

}

.service-section hr{

    margin:60px 0;

}


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

@media(max-width:991px){

.service-sidebar{

position:relative;

top:0;

margin-bottom:30px;

}

.service-content{

padding:25px;

}

.service-content h1{

font-size:32px;

}

.service-content h2{

font-size:28px;

}

.service-content h3{

font-size:24px;

}

.service-cta{

padding:30px;

text-align:center;

}

.process-box{

margin-bottom:20px;

}

}


@media(max-width:767px){

.service-content{

padding:20px;

}

.service-content h1{

font-size:28px;

}

.service-content h2{

font-size:24px;

}

.service-content h3{

font-size:22px;

}

.sidebar-title{

font-size:22px;

}

.service-menu li a{

font-size:14px;

padding:14px;

}

.process-number{

width:60px;

height:60px;

font-size:20px;

}

.service-cta{

padding:25px;

}

.service-cta .btn{

width:100%;

margin-bottom:15px;

}

}

/*=========================================
BLOG PAGE
=========================================*/

.blog-page{
    background:#f8f9fa;
    padding:60px 0;
}

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

.blog-card{
    background:#fff;
    border-radius:15px;
    overflow:hidden;
    margin-bottom:35px;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    transition:.35s;
}

.blog-card:hover{
    transform:translateY(-8px);
}

.blog-image{
    position:relative;
    overflow:hidden;
}

.blog-image img{
    width:100%;
    transition:.4s;
}

.blog-card:hover .blog-image img{
    transform:scale(1.08);
}

.blog-category{
    position:absolute;
    left:20px;
    top:20px;
    background:#198754;
    color:#fff;
    padding:8px 16px;
    border-radius:30px;
    font-size:13px;
    font-weight:600;
}

.blog-content{
    padding:30px;
}

.blog-content h2{
    font-size:28px;
    font-weight:700;
    margin:20px 0;
    line-height:1.4;
}

.blog-content h2 a{
    color:#222;
    text-decoration:none;
    transition:.3s;
}

.blog-content h2 a:hover{
    color:#198754;
}

.blog-content p{
    color:#666;
    line-height:28px;
    margin-bottom:25px;
}

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

.blog-meta{
    display:flex;
    gap:25px;
    flex-wrap:wrap;
    color:#777;
    font-size:14px;
}

.blog-meta span i{
    color:#198754;
    margin-right:8px;
}

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

.blog-content .btn{
    border-radius:40px;
    padding:12px 28px;
    font-weight:600;
}

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

.blog-sidebar{
    position:sticky;
    top:100px;
}

.sidebar-widget{
    background:#fff;
    border-radius:12px;
    padding:25px;
    margin-bottom:30px;
    box-shadow:0 8px 25px rgba(0,0,0,.08);
}

.widget-title{
    font-size:22px;
    font-weight:700;
    margin-bottom:20px;
    padding-bottom:12px;
    border-bottom:2px solid #198754;
}

/*=========================================
SEARCH
=========================================*/

.sidebar-widget .form-control{
    height:50px;
    border-radius:8px 0 0 8px;
}

.sidebar-widget .btn{
    border-radius:0 8px 8px 0;
}

/*=========================================
CATEGORY
=========================================*/

.category-list{
    margin:0;
    padding:0;
    list-style:none;
}

.category-list li{
    border-bottom:1px solid #eee;
}

.category-list li:last-child{
    border-bottom:none;
}

.category-list li a{
    display:flex;
    justify-content:space-between;
    align-items:center;
    color:#444;
    text-decoration:none;
    padding:14px 0;
    transition:.3s;
}

.category-list li a:hover{
    color:#198754;
    padding-left:10px;
}

/*=========================================
RECENT POSTS
=========================================*/

.recent-post{
    display:flex;
    gap:15px;
    margin-bottom:18px;
}

.recent-post:last-child{
    margin-bottom:0;
}

.recent-post img{
    width:90px;
    height:70px;
    object-fit:cover;
    border-radius:8px;
}

.recent-post a{
    color:#222;
    font-weight:600;
    text-decoration:none;
    display:block;
    margin-bottom:6px;
    transition:.3s;
}

.recent-post a:hover{
    color:#198754;
}

.recent-post small{
    color:#777;
}

.recent-post small i{
    color:#198754;
    margin-right:5px;
}

/*=========================================
TAGS
=========================================*/

.tags{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.tags a{
    background:#f2f2f2;
    color:#333;
    text-decoration:none;
    padding:8px 16px;
    border-radius:30px;
    transition:.3s;
    font-size:14px;
}

.tags a:hover{
    background:#198754;
    color:#fff;
}

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

.cta-widget{
    background:linear-gradient(135deg,#198754,#0b5d34);
    color:#fff;
    text-align:center;
}

.cta-widget i{
    font-size:55px;
    margin-bottom:20px;
}

.cta-widget h3{
    color:#fff;
    font-weight:700;
    margin-bottom:15px;
}

.cta-widget p{
    color:#fff;
    line-height:28px;
}

.cta-widget .btn{
    border-radius:40px;
    padding:12px 25px;
    font-weight:600;
}

/*=========================================
PAGINATION
=========================================*/

.blog-pagination{
    margin-top:40px;
}

.blog-pagination .page-link{
    color:#198754;
    border-radius:8px;
    margin:0 4px;
}

.blog-pagination .page-item.active .page-link{
    background:#198754;
    border-color:#198754;
}

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

@media(max-width:991px){

.blog-sidebar{
    position:relative;
    top:0;
    margin-top:40px;
}

.blog-content{
    padding:25px;
}

.blog-content h2{
    font-size:24px;
}

}

@media(max-width:767px){

.blog-meta{
    flex-direction:column;
    gap:8px;
}

.blog-content{
    padding:20px;
}

.blog-content h2{
    font-size:22px;
}

.widget-title{
    font-size:20px;
}

.recent-post{
    flex-direction:column;
}

.recent-post img{
    width:100%;
    height:auto;
}

.tags a{
    font-size:13px;
    padding:7px 14px;
}

}


.service-area-list {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 600px;
    overflow-y: auto;
    overflow-x: hidden;
}

.service-area-list li{

    padding:8px 0;

    border-bottom:1px solid #eee;

}

.service-area-list li:last-child{

    border-bottom:none;

}

.service-area-list a{

    color:#333;

    text-decoration:none;

    transition:.3s;

    display:block;

}

.service-area-list a:hover{

    color:#198754;

    padding-left:8px;

}

@media (max-width:991px){

    .navbar-collapse{

        max-height:80vh;

        overflow-y:auto;

    }

    .navbar .dropdown-menu{

        position:static !important;

        float:none;

        width:100%;

        border:none;

        box-shadow:none;

        padding-left:15px;

        background:#f8f9fa;

    }

    .navbar .dropdown-menu .dropdown-item{

        padding:8px 15px;

        white-space:normal;

    }

    .navbar .dropdown-header{

        color:#198754;

        font-weight:700;

        padding:10px 15px;

    }

    .mega-menu{

        display:none !important;

    }

}