@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

* {
    margin: 0;
    padding: 0;
}

:root {
    --primary: #958578ff;
    --primary-light: #dfdfdfff ;
    --secondary: #000000;
    --white: #ffffff;
    --roboto: 'Roboto', sans-serif;
}

body {
    font-family: var(--roboto);font-size: 18px;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}
a:hover {
    color: var(--primary);
}

/* ----------------------------common-css-------------------------- */
ul {
    text-decoration: none;
}

li {
    list-style: none;
}

p {
    margin: 0;
    padding: 0;
}

.section-space {
    padding: 25px;
}
.mr-15{
    margin-right: 15px;
}
a {
    text-decoration: none;
    color: inherit;
}
.btn {
    padding: 7px 22px !important;
    border: 0 !important;
    font-size: 18px !important;
}
.display-5 {
    line-height: 1.1;
}
/* -------------------------header-css------------------------- */

.btn.btn-primary {background-color: var(--primary);color: var(--white);border-radius: 50px;transition: all .3s ease-in-out;}
.btn.btn-primary:hover {background-color: #000;}
.btn.btn-dark:hover {background-color: var(--primary);color: #000 !important;}
.site-header {position: fixed;z-index: 999;width: 100%;transition: all .2s ease-in-out;padding:0;background-color: var(--primary-light);
    box-shadow: 0px 1px 12px 2px rgba(153,153,153,0.26);}
.site-logo h1 {margin: 0;color: var(--white);}
.navbar-nav .nav-link {color: var(--white);}
.navbar-nav .nav-link:hover {color: var(--primary-light);}
.navbar-dark .navbar-nav .nav-link {color: #212529;}
.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
    color: var(--primary);
}
.hero-section {padding-top: 77px;background: url(../img/hero-image.jpg) no-repeat;background-size: cover;min-height: 700px;display: flex;align-items: center;position: relative;}
.hero-section::after {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.3);z-index: -1;}
.hero-section {color: var(--white);z-index: 111;}
.hero-content .hero-title {max-width: 730px;font-size: calc(1.6rem + 2.0vw);line-height: 1.1;font-weight: 700;}
.hero-content .hero-title span.animated-text {color: #fbdd65;background: linear-gradient(270deg, #f042ff 2.36%, #facc15 79.23%);background-clip: text;-webkit-background-clip: text;
    -webkit-text-fill-color: transparent;text-shadow: none;animation: shine 6s linear infinite;background-size: 200% auto;}
@keyframes shine {
  to {
    background-position: 200% center;
  }
}
.hero-content p {max-width: 560px;}
.btn-wrap {margin-top: 20px;}
.feature-card>img {max-height: 250px;min-height: 250px;width: 100%;object-fit: cover;object-position: center;}
.feature-card {background: var(--primary-light);height: 100%;}
.card-content {padding: 15px;}
.icon-wrap {background: #FFF;width: fit-content;margin: 0 auto;padding: 20px;border-radius: 50px;margin-top: -60px;position: relative;z-index: 1;}
.icon-wrap img {width: auto;}
.info-box .icon-box{position: relative;}
.info-box .icon-box img {width: 40px;max-width: 40px;transition: 0.3s ease-in-out;}
.info-box .icon-box::after {content: "";height: 45px;width: 45px;background-color: var(--primary-light);position: absolute;top: -12px;left: -12px;z-index: -1;border-radius: 50%;
    transition: 0.3s ease-in-out;}
.info-box:hover .icon-box::after {width: 62px;height: 62px;}
.info-box:hover .icon-box img {transform: scale(1.1);}
.overlay-section { position: relative;background: url(../img/home-parallax.jpg) no-repeat center center;background-size: cover;background-attachment: fixed;min-height: 500px;
    display: flex;align-items: center;justify-content: center;color: white;}
.health-section h3 {line-height: 1.2;margin-top: 10px;}
.health-section img {margin: 0 auto;}
.support-section {background: url(../img/waves-bg.png) no-repeat center;background-size: cover;}
.banner-section {background: url(../img/banner-img.png) no-repeat center center;background-size: cover;min-height: 300px;display: flex;align-items: center;color: white;padding-top: 77px;position: relative;z-index: 1;}
.banner-section::after {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.3);z-index: -1;}
.contact-ic {padding-left: 35px;position: relative;background-size: 25px;background-position: left top 3px !important;}
.email-ic {background: url(../img/envelope.svg) no-repeat left;margin-bottom: 10px;}
.phone-ic {background: url(../img/phone-alt.svg) no-repeat left;}
.address-ic {background: url(../img/map-marker.svg) no-repeat left;}
.form-wrapper {padding: 40px;box-shadow: 0px 4px 7px 1px rgba(0, 0, 0, 0.1);}

.navbar-brand.site-logo{
    width: 140px;
}

.navbar-brand.site-logo img{
    width: 100%;
}
 .feature-item i {
            color: var( --primary);
            margin-right: 0.75rem;
            font-size: 1.2rem;
}

@media (min-width: 1200px) {
    .hero-content .hero-title {font-size: 4rem;}
}
@media screen and (max-width: 1199px) {
    .overlay-section {min-height: 420px;}
    .hero-section {min-height: 580px;}
    .hero-content .hero-title {max-width: 510px;}
}

@media screen and (max-width: 991px) {
    .hero-content .hero-title {max-width: 470px;}
    .about-section .ps-4 {padding-left: 12px !important;margin-top: 30px;}
    .about-section .info-box {margin-left: 12px;}
    .health-section .icon-box {margin-bottom: 30px;}

}

@media screen and (max-width: 768px) {
    .hero-section {min-height: 440px;}
    .support-section .content-box {margin-bottom: 30px;}
    .support-section .img-box {gap: 10px;flex-wrap: wrap;}
    .form-wrapper {margin-bottom: 30px;}
    .contact-section .row{flex-direction: column-reverse;}
    .banner-section {min-height: 260px;}

}
@media screen and (max-width: 575px) {
    .py-5 {padding-top: 1.5rem!important;padding-bottom: 1.5rem!important;}
    .overlay-section {min-height: 380px;}
    .banner-section {min-height: 200px;}
    .form-wrapper {padding: 25px;}

}