:root {
--primary-teal: #2d8277;
--dark-blue: #2d3e50;
--light-gray: #f8f9fa;
}

body {font-family: 'Satoshi', sans-serif;}
.container{width: 100%; max-width: 1170px;}
nav.navbar a {width: 100%;text-align: center;}

.navbar-brand img {height: 40px;}
.pr30px{padding-right: 30px;}

.hero-section {
    padding: 150px 0 80px 0;
    min-height: 382px;
    background: url(../images/banner.png) center left no-repeat;
    /* background-size: cover; */
}
.hero-badge {
    color: #2B2D2F;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
}
.hero-badge span{border-radius: 20px;background: #E9FFFC;padding: 6px 15px;}
.hero-badge i{color: #E33B32;margin-right: 4px;}
.hero-title {
    font-size: 48px;
    font-weight: 900;
    color: #000;
    margin-bottom: 20px;
    line-height: 58px;
    padding-right: 60px;
}
.hero-description {
    font-size: 18px;
    font-weight: 500;
    color: #525D6A;
    line-height: 27px;
}
.bgfeatures{
    padding: 30px 0;
    margin-top:-60px;
    background: rgba(255,255,255,0.17);
    border:1px solid rgba(255,255,255,0.26);    
    backdrop-filter: blur(38.4px);
    -webkit-backdrop-filter: blur(38.4px);
}
.feature-label {font-size: 20px;line-height: 24px;font-weight: 500;color: #858C95;margin-bottom: 5px;}
.bgfeatures h3{font-size: 28px;line-height: 32px;font-weight: 700;color: #2B2D2F;}
.featureouter{display: flex;gap: 20px;justify-content: end;}
.feature-box{
    padding: 16px;
    width:153px;
    border-radius: 8px;
    text-align: center;
    background: rgba(255,255,255,0.28);
    border:1px solid rgba(255,255,255,0.30);
    backdrop-filter: blur(25.8px);
    -webkit-backdrop-filter: blur(25.8px);  
}
.feature-box i{font-size: 28px;margin-bottom: 10px;}

.feature-title {font-size: 18px;line-height: 21px;font-weight: 700;color: #173144;}

.teal-section {
    color: white;
    padding: 120px 0;
    background:#298375 url(../images/mask.png) no-repeat center;
}

.teal-section h2 {
font-size: 32px;
line-height: 38px;
font-weight: 700;
margin-bottom: 20px;
}

.teal-section p {
font-size: 18px;
font-weight: 400;
line-height: 27px;
margin-bottom: 30px;
}

.check-item {
display: flex;
align-items: center;
/* padding: 12px 15px; */
margin-bottom: 24px;
font-size: 15px;
font-weight: 500;
}

.check-item span {
font-size: 20px;
margin-right: 12px;
border-radius: 8px;
background: #fff;
color: #298375;
width: 40px;
height: 40px;
align-items: center;
justify-content: center;
display: flex;
}

.check-item i {
font-size: 24px;
}
.check-item i.fa-balance-scale {font-size: 18px;}


.guarantee-badge {
    background-color: white;
    border: 2px solid #000000;
    color:#2B2D2F;
    padding: 13px 24px;
    border-radius: 8px;
    font-weight: 700;
    text-align: center;
    font-size: 16px;
    display: inline-block;
    position: absolute;
    right: 35px;
    bottom: -25px;
}

.why-section {
padding: 65px 0;
background-color: #F2F9FF;
}

.why-section h2 {
text-align: center;
font-size: 32px;
line-height: 38px;
font-weight: 700;
color:#298375;
margin-bottom: 60px;
}
.why-cardouter{display: flex;gap:12px;}

.why-card {
    padding: 24px 20px;
    background: #fff;
    border-radius: 4px;
}

.why-icon {
width: 40px;
height: 40px;
background-color: var(--primary-teal);
color: white;
border-radius: 6px;
padding: 8px;
display: flex;
align-items: center;
justify-content: center;
font-size: 22px;
margin-bottom: 18px;
}

.why-card h3 {
font-size: 20px;
font-weight: 700;
color: #2B2D2F;
margin-bottom: 12px;
}

.why-card p {
font-size: 15px;
font-weight: 500;
color: #525D6A;
line-height: 22px;
margin-bottom: 0px;
}

.cta-section {
background:
        linear-gradient(rgba(11,34,52,0.86), rgba(11,34,52,0.86)),
        url("../images/bg.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: white;
    padding: 130px 0;
    text-align: center;
    border-radius: 16px;
    margin: 60px 0;
    position: relative;
}

.cta-section h2 {
font-size: 40px;
font-weight: 900;
list-style: 48px;
margin-bottom: 12px;
}

.cta-section p {
font-size: 18px;
font-weight: 500;
list-style: 28px;
max-width: 600px;
margin: 0 auto;
}

.footer {
background-color: var(--dark-blue);
color: white;
padding: 40px 0 20px;
}

.footer-logo {margin-bottom: 20px;}
.footer-logo img{}
.ftext{max-width: 300px;}

.footer p {
font-size: 14px;
line-height: 1.8;
color: rgba(255, 255, 255, 0.8);
}

.footer-contact h5 {
font-size: 16px;
font-weight: 700;
margin-bottom: 15px;
}

.footer-contact a {
color:#fff;
text-decoration: none;
font-size: 16px;
font-weight: 500;
}

.footer-contact a:hover {
color: white;
}

.footer-bottom {
border-top: 1px solid rgba(255, 255, 255, 0.1);
padding-top: 20px;
margin-top: 30px;
text-align: center;
font-size: 16px;
color:#fff;
}


@media (max-width: 991px) {
.hero-section {padding:80px 20px;background-size: cover;}
}


@media (max-width: 768px) {
.hero-section {
    
    /* background: url(../images/mobbanner.svg) center left no-repeat;background-size: cover; */
background:
        linear-gradient(rgba(255,255,255,0.50), rgba(255,255,255,0.50)),
        url("../images/mobbanner.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}



.hero-title {
    font-size: 32px;
    line-height: 38px;
}

.teal-section h2,
.why-section h2,
.cta-section h2 {
    font-size: 28px;
}

.teal-section {padding: 60px 10px;}
.featureouter {justify-content: center;}
.cta-section{padding:40px 30px;}
.why-cardouter{flex-wrap: wrap;}
.why-cardouter .why-card{width:48.9%;}


}

@media (max-width: 575px) {
.why-cardouter .why-card{width:100%;}
.featureouter{flex-wrap: wrap;}
.feature-box{width: 100%;}

}
@media (max-width: 460px) {
.hero-section {
    
    /* background: url(../images/mobbanner1.png) no-repeat right;background-size: cover; */

    background:
        linear-gradient(rgba(255,255,255,0.50), rgba(255,255,255,0.50)),
        url("../images/mobbanner1.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

}



}