@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

:root {
    --font-family-base: 'Inter', sans-serif;
    --font-family-montserrat: 'Montserrat', sans-serif;
    --color-primary: #1EA859;
    --color-black: #000000;
    --color-white: #FFFFFF;
    --color-gray: #333333;
    --color-Grays-gray: #8E8E93;
    --color-white: #FFFFFF;
    --color-black: #000000;





    --font-weight-300: 300;
    --font-weight-400: 400;
    --font-weight-500: 500;
    --font-weight-600: 600;
    --font-weight-700: 700;
    --font-weight-800: 800;

    --border-radius: 8px;
}

.font-family-montserrat {
    font-family: var(--font-family-montserrat);
}

.font-family-base {
    font-family: var(--font-family-base);
}

.green-text {
    color: var(--color-primary) !important;
}

.black-text {
    color: var(--color-black) !important;
}

.gray-text-form {
    color: #8897AE !important;
}

.font-weight-400 {
    font-weight: var(--font-weight-400)
}

.font-weight-500 {
    font-weight: var(--font-weight-500)
}

.font-weight-600 {
    font-weight: var(--font-weight-600)
}

.font-weight-700 {
    font-weight: var(--font-weight-700)
}

.font-weight-800 {
    font-weight: var(--font-weight-800);
}

.banner-heading {
    font-family: var(--font-family-base);
    font-size: 65px;
    font-weight: var(--font-weight-700);
    color: var(--color-white);
}

.domiciliary-banner-heading {
    font-family: var(--font-family-base);
    font-size: 48px;
    font-weight: var(--font-weight-700);
    color: var(--color-white);
}

.banner-sub-heading {
    font-family: var(--font-family-base);
    font-size: 17px;
    font-weight: var(--font-weight-400);
    color: var(--color-white);
}


.allbannners-heading {
    font-family: var(--font-family-base);
    font-size: 65px;
    font-weight: var(--font-weight-700);
    color: var(--color-black);
}

.card1heading {
    font-family: var(--font-family-base);
    font-size: 20px;
}

.card1Subheading {
    font-family: var(--font-family-base);
    font-size: 15px;
    font-weight: var(--font-weight-400);
}

.main-heading {
    font-family: var(--font-family-base);
    font-size: 35px;
}

.faqs-heading {
    font-family: var(--font-family-base);
    font-size: 43px;
    font-weight: var(--font-weight-700);
    color: var(--color-black);
}


.footer-heading {
    font-family: var(--font-family-montserrat);
    font-size: 16px;
    font-weight: var(--font-weight-700);
    color: var(--color-gray);
}

.footer-dec {
    font-family: var(--font-family-montserrat);
    font-size: 12px;
    font-weight: var(--font-weight-400);
    color: var(--color-gray);
}

.heading-24 {
    font-family: var(--font-family-base);
    font-size: 24px;

}

.heading-40 {
    font-family: var(--font-family-base);
    font-size: 40px;
}

.heading-32 {
    font-family: var(--font-family-base);
    font-size: 32px;
}



.p {
    font-family: var(--font-family-base);
    font-size: 17px;
    font-weight: var(--font-weight-400);

}
.card1Subheading p {
    font-family: var(--font-family-base);
    font-size: 15px;
    font-weight: var(--font-weight-400);
}

@media (max-width: 767.98px) {

    .heading-40 {

        font-size: 28px;
    }

    .domiciliary-banner-heading {
        font-size: 35px;


    }

    .faqs-heading {
        font-size: 30px;

    }

    .heading-32 {
        font-family: var(--font-family-base);
        font-size: 26px;
    }
}


.more-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background-color: var(--color-primary);
    /* green */
    color: #ffffff;

    padding: 15px 26px;
    border-radius: 14px;
    border-bottom-right-radius: 0;
    font-size: 17px;
    font-weight: 400;
	 border: 1px solid var(--color-primary);
    text-decoration: none;
    transition: all 0.6s ease;
}

.more-btn span {
    font-size: 17px;
    font-weight: 400;
}


/* Hover effect (optional but nice) */
.more-btn:hover {
    background-color: transparent;
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
    transform: translateX(6px);
}


.more-btnwhite {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background-color: var(--color-white);
    /* green */
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
    padding: 13px 28px;
    border-radius: 14px;
    border-bottom-right-radius: 0;
    font-size: 17px;
    font-weight: 400;
    text-decoration: none;
    transition: all 0.6s ease;
}

.more-btnwhite span {
    font-size: 17px;
    font-weight: 400;
}


/* Hover effect (optional but nice) */
.more-btnwhite:hover {
    background-color: transparent;
    color: var(--color-white);
    border: 1px solid var(--color-white);
    transform: translateX(6px);
}



@media (max-width: 767.98px) {
    .main-heading {
        font-size: 28px;
    }

    .banner-sub-heading {
        font-size: 14px;
    }

    .more-btn, .more-btnwhite {
        font-size: 14px;
        padding: 10px 20px;
    }
}

.btn-read {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 11px 16px;
    border: 1px solid var(--color-primary);
    border-radius: 12px;
    border-bottom-left-radius: 0;
    color: var(--color-primary);
    text-decoration: none;
    font-weight: 400;
    transition: 0.6s ease;
}

/* Small line before text */
.btn-read .line {
    width: 15px;
    height: 0.8px;
    background: var(--color-primary);
    display: inline-block;
}

/* Hover */
.btn-read:hover {
    background: var(--color-primary);
    color: #fff;
    transform: translateX(6px);
}

.btn-read:hover .line {
    background: #fff;
}

/* More Details Button */

.btn-more-details {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 18px;
    border: 1px solid var(--color-primary);
    border-radius: 12px;
    border-bottom-right-radius: 0;
    color: var(--color-primary);
    text-decoration: none;
    font-weight: 400;
    transition: 0.6s ease;
}

/* Small line before text */
.btn-more-details .line {
    width: 15px;
    height: 0.8px;
    background: var(--color-primary);
    display: inline-block;
}

/* Hover */
.btn-more-details:hover {
    background: var(--color-primary);
    color: #fff;
    transform: translateX(6px);
}

.btn-more-details:hover .line {
    background: #fff;
}