﻿.desklogoright
{
    display:block;
}
.text-black-33 {
    color: #333;
}

.ml-15 {
    margin-left: 25px;
}
.websiteorderlist {
    padding-left: 20px;
    list-style: decimal;
}

    .websiteorderlist li {
        padding:7px 10px;
        
        transition: 0.3s;
    }

       

.faqsdiv .h5 {
    font-size: 18px;
    font-weight: 600;
}
.service-desc img {
    border-radius: 18px;
}
.servicedesch1 {
    font-size: 32px;
    font-weight: 600;
}
.servicedesch2 {
    font-size: 26px;
    font-weight: 600;
}
.servicedesch5 {
    font-size: 18px;
    font-weight: 600;
}
    .servicedesch5 span {
        color: #e5067f;
        font-weight: 700;
    }
.servicedesch2 span {
    color: #e5067f;
    font-weight: 700;
}
    .servicedesch1 span {
        color: #e5067f;
        font-weight: 700;
    }
.sidemenubg {
    background-color: #fad3de;
    border: 1px solid #f8cdda;
    border-radius: 18px;
    transition: 0.35s ease;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    padding: 20px;
}
    .sidemenubg h5 {
        font-size: 32px;
        line-height: 36px;
        font-weight: 600;
    }
        .sidemenubg h5 span {
            display: inline;
            color: #e5067f;
            font-weight: 700;
        }
    .sidemenubg a {
        background: #fff;
        border: 1px solid #f2f2f2;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
        color:#333;
    }
        .sidemenubg a.active {
            background: #e5067f;
            border: 1px solid #e5067f;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
            color: #fff;
        }
        .sidemenubg a.active i {
            color: #fff;
        }
    .font-32 {
        font-size: 32px !important;
    }
.ds-trust-col .trust-col h6 {
    font-weight: 600;
    margin-bottom: 5px;
    font-size: 18px !important;
    line-height: 28px;
    margin-top: -10px;
}
.ds-grid {
    margin: auto;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 24px;
}

/* =========================
   CARD
========================= */

.ds-card {
    background: #fff;
    border: 1px solid #f1f1f1;
    border-radius: 22px;
    overflow: hidden;
    transition: 0.35s ease;
    box-shadow: 0 5px 20px rgba(0,0,0,0.04);
}

    .ds-card:hover {
        transform: translateY(-8px);
        box-shadow: 0 18px 45px rgba(255,105,180,0.12);
    }

/* =========================
   TOP CONTENT
========================= */

.ds-content {
    padding: 35px 25px 25px;
    text-align: center;
}

/* Icon Circle */

.ds-icon {
    width: 120px;
    height: 120px;
    margin: auto auto 20px;
    border-radius: 50%;
    background: #fff1f6;
    display: flex;
    align-items: center;
    justify-content: center;
}

    /* Icon */

    .ds-icon i {
        font-size: 40px;
        color: #ef5b9c;
    }

/* Title */

.ds-content h3 {
    font-size: 20px;
    color: #333;
    margin-bottom: 15px;
}

/* Small Divider */

.ds-small-line {
    width: 45px;
    height: 2px;
    background: #ef5b9c;
    margin: 0 auto 18px;
}

/* Text */

.ds-content p {
    font-size: 17px;
    line-height: 1.8;
    color: #333;
    margin-bottom: 20px;
}

/* Learn More */

.ds-content a {
    text-decoration: none;
    color: #d81b60;
    font-weight: 600;
    font-size: 17px;
    transition: 0.3s;
}

    .ds-content a:hover {
        letter-spacing: 0.5px;
    }

/* =========================
   IMAGE
========================= */

.ds-image {
    height: 180px;
    overflow: hidden;
}

    .ds-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: 0.5s ease;
        border-radius:22px;
    }

.ds-card:hover .ds-image img {
    transform: scale(1.08);
}

/* =========================
   RESPONSIVE
========================= */

@media(max-width:1100px) {

    .ds-grid {
        grid-template-columns: repeat(2,1fr);
    }
}

@media(max-width:650px) {

    .ds-grid {
        grid-template-columns: 1fr;
    }
}

    .whealth-grid {
        max-width: 1200px;
        margin: auto;
        display: grid;
        grid-template-columns: repeat(3,1fr);
        gap: 20px;
    }

    /* ===== CARD ===== */

    .whealth-card {
        background: #fff;
        border: 1px solid #f2f2f2;
        border-radius: 18px;
        padding: 28px 24px;
        display: flex;
        gap: 18px;
        position: relative;
        overflow: hidden;
        transition: 0.35s ease;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    }

        /* Hover Effect */

        .whealth-card:hover {
            transform: translateY(-6px);
            box-shadow: 0 15px 40px rgba(255,105,180,0.08);
            border-color: #ffd6e7;
        }

    /* ===== ICON BOX ===== */

    .whealth-icon {
        min-width: 80px;
        width: 80px;
        height: 80px;
        border-radius: 50%;
        background: #fff1f6;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        /* ===== ICON ===== */

        .whealth-icon img {
            width: 80px;
            transition: 0.3s;
        }

    /* Hover Icon */

    .whealth-card:hover .whealth-icon i {
        transform: scale(1.1);
        color: #e60073;
    }

    /* ===== CONTENT ===== */

    .whealth-content h3 {
        font-size: 20px;
        line-height: 32px;
        color: #1e293b;
        margin-bottom: 5px;
    }

    .whealth-content p {
        font-size: 17px;
        line-height: 1.8;
        color: #5b6475;
        margin-bottom: 16px;
    }

    /* ===== LINK ===== */

    .whealth-content a {
        text-decoration: none;
        color: #ef5b9c;
        font-size: 14px;
        font-weight: 600;
        transition: 0.3s;
    }

        .whealth-content a:hover {
            letter-spacing: 0.5px;
        }

    /* ===== RESPONSIVE ===== */

    @media(max-width:992px) {

        .whealth-grid {
            grid-template-columns: repeat(2,1fr);
        }
    }

    @media(max-width:600px) {

        .whealth-grid {
            grid-template-columns: 1fr;
        }
    }

    .tinyicon-container-wh {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    /* Tiny Icon Box */
    .tinyicon-wh {
        display: flex;
        align-items: center;
        gap: 15px;
    }


        /* Icon */
        .tinyicon-wh img {
            width: 80px;
        }

        /* Text */
        .tinyicon-wh h5 {
            font-size: 15px;
            color: #333;
            line-height: 24px;
        }

    @media (max-width: 768px) {
        .tinyicon-container-wh {
            grid-template-columns: 1fr;
        }
    }
    /* Main Card */
    .top-white-container-wh {
        margin: auto;
        background-color: rgba(255,255,255,0.7);
        border-radius: 12px;
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        overflow: hidden;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
        margin-top: 30px;
    }

    /* Box */
    .top-white-box-wh {
        display: flex;
        align-items: center; /* vertical center */
        justify-content: center; /* horizontal center */
        gap: 15px;
        padding: 20px 10px;
        position: relative;
        text-align: left;
        width: 190px;
    }

        .top-white-box-wh:last-child {
            width: 240px;
            padding-right: 20px;
        }
        /* Divider Line */
        .top-white-box-wh:not(:last-child)::after {
            content: "";
            position: absolute;
            top: 12%;
            right: 0;
            width: 1px;
            height: 80%;
            background: #d9adb8;
        }

        /* Icon */
        .top-white-box-wh img {
            width: 40px;
            height: 40px;
        }

        /* Number */
        .top-white-box-wh h2 {
            font-size: 14px;
            color: #333;
            margin-bottom: 0px;
            line-height: 21px;
        }



        /* Hover */
        .top-white-box-wh:hover {
            background: rgba(255, 0, 100, 0.05);
        }

    /* Responsive */
    @media (max-width: 768px) {
        .top-white-container-wh {
            grid-template-columns: 1fr;
        }

        .top-white-box-wh {
            border-right: none;
            border-bottom: 1px solid rgba(0,0,0,0.08);
            width: 100%;
        }

            .top-white-box-wh:last-child {
                width: 100%;
            }
    }

    .service-cta-section-after {
        background: linear-gradient(90deg, rgb(229 6 127), #ec407a);
        color: #fff;
        padding: 40px 0;
        position: relative;
        overflow: hidden;
    }

        /* Background Image Optional */
        .service-cta-section-after::after {
            content: "";
            position: absolute;
            right: 0;
            top: 0;
            width: 250px;
            height: 100%;
            background: url('../../assets/images/pangudda.jpeg') no-repeat left center;
            background-size: contain;
            opacity: 0.9;
        }

    .cta-wrapper-after {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 30px;
        padding-right: 220px;
    }
        /* Divider line */
        .cta-wrapper-after::after {
            content: "";
            position: absolute;
            top: 10%;
            left: 38%;
            transform: translateX(-50%);
            width: 1px;
            height: 80%;
            background: rgba(255,255,255,0.4);
        }
    /* Main Card */
    .pink-stats-container-pan {
        margin: auto;
        background: linear-gradient(90deg, #fde4ea, #fbf0f2);
        border-radius: 16px;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        overflow: hidden;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    }

    /* Box */
    .pink-stat-box-pan {
        display: flex;
        align-items: center; /* vertical center */
        justify-content: center; /* horizontal center */
        gap: 15px;
        padding: 40px 25px;
        position: relative;
        text-align: left;
    }

        /* Divider Line */
        .pink-stat-box-pan:not(:last-child)::after {
            content: "";
            position: absolute;
            top: 12%;
            right: 0;
            width: 1px;
            height: 80%;
            background: #f8cdda;
        }

        /* Icon */
        .pink-stat-box-pan img {
            width: 80px;
            height: 80px;
            color: #ff4d8d;
        }

        /* Number */
        .pink-stat-box-pan h2 {
            font-size: 40px;
            color: #d81b60;
            margin-bottom: 0px;
        }

        .pink-stat-box-pan h6 {
            line-height: 27px;
        }
        /* Text */
        .pink-stat-box-pan p {
            font-size: 17px;
            color: #333;
        }

        /* Hover */
        .pink-stat-box-pan:hover {
            background: rgba(255, 0, 100, 0.05);
        }

    /* Responsive */
    @media (max-width: 768px) {
        .pink-stats-container-pan {
            grid-template-columns: 1fr;
        }

        .pink-stat-box-pan {
            border-right: none;
            border-bottom: 1px solid rgba(0,0,0,0.08);
        }
    }

    .tinyicon-container {
        display: flex;
        gap: 20px;
        flex-wrap: wrap;
    }

    /* Tiny Icon Box */
    .tinyicon {
        display: flex;
        align-items: center;
        gap: 8px;
        background: #fef2f5;
        padding: 13px;
        border-radius: 12px;
    }


        /* Icon */
        .tinyicon img {
            width: 60px;
        }

        /* Text */
        .tinyicon h5 {
            font-size: 15px;
            color: #333;
        }

    .appimg-pan {
        z-index: 1;
    }

        .appimg-pan img {
            border-bottom-left-radius: 12px;
            border-top-left-radius: 12px;
            height: 470px;
        }

    .whappimg img {
        border-bottom-left-radius: 12px;
        border-top-left-radius: 12px;
        height: 450px;
    }

    .wch-container {
        background: linear-gradient(90deg, #fde4ea, #fbf0f2);
        border-radius: 16px;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    }
    /* Row */
    .trust-row-6 {
        display: flex;
        flex-wrap: wrap;
        text-align: center;
    }

    /* Column */
    .trust-col-6 {
        width: 16.66%;
        padding: 20px 15px;
        position: relative;
    }

        /* Vertical Divider Line */
        .trust-col-6:not(:last-child)::after {
            content: "";
            position: absolute;
            top: 20%;
            right: 0;
            width: 1px;
            height: 70%;
            background: #f8cdda;
        }

        /* Icon */
        .trust-col-6 img {
            width: 100px;
        }

        /* Text */
        .trust-col-6 h6 {
            font-weight: 600;
            margin-bottom: 5px;
            font-size: 16px;
            line-height: 28px;
        }

        .trust-col-6 p {
            font-size: 17px;
        }


    @media (max-width: 992px) {
        .trust-col {
            width: 33.33%;
        }
    }

    @media (max-width: 576px) {
        .trust-col {
            width: 50%;
        }
    }
    /* Main Card */
    .top-white-container {
        margin: auto;
        background-color: rgba(255,255,255,0.7);
        border-radius: 12px;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        overflow: hidden;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
        margin-top: 30px;
    }

    /* Box */
    .top-white-box {
        display: flex;
        align-items: center; /* vertical center */
        justify-content: center; /* horizontal center */
        gap: 15px;
        padding: 20px 10px;
        position: relative;
        text-align: left;
    }

        /* Divider Line */
        .top-white-box:not(:last-child)::after {
            content: "";
            position: absolute;
            top: 12%;
            right: 0;
            width: 1px;
            height: 80%;
            background: #d9adb8;
        }

        /* Icon */
        .top-white-box img {
            width: 40px;
            height: 40px;
        }

        /* Number */
        .top-white-box h2 {
            font-size: 15px;
            color: #333;
            margin-bottom: 0px;
            line-height: 21px;
        }



        /* Hover */
        .top-white-box:hover {
            background: rgba(255, 0, 100, 0.05);
        }

    /* Responsive */
    @media (max-width: 768px) {
        .top-white-container {
            grid-template-columns: 1fr;
        }

        .top-white-box {
            border-right: none;
            border-bottom: 1px solid rgba(0,0,0,0.08);
        }
    }

    /* Updated class name */
    .my-hero-banner {
        background-color: #fdf0f4; /* Soft pink background */
        width: 100%;
        border-radius: 20px;
        overflow: hidden;
        box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    }

        .my-hero-banner .hero-container {
            display: flex;
            align-items: center;
            flex-wrap: wrap; /* Stacks vertically on smaller screens */
        }

            .my-hero-banner .hero-container .hero-content {
                flex: 1;
                padding: 60px;
                min-width: 230px;
            }

            .my-hero-banner .hero-container .hero-title {
                font-size: 42px;
                line-height: 1.2;
                color: #333; /* Dark navy blue from original */
                margin-bottom: 20px;
            }

            /* Decorative heart divider */
            .my-hero-banner .hero-container .divider {
                display: flex;
                align-items: center;
                margin-bottom: 25px;
            }

                .my-hero-banner .hero-container .divider::before, .my-hero-banner .hero-container .divider::after {
                    content: "";
                    height: 1.5px;
                    width: 80px;
                    background-color: #e6a4b4;
                }

            .my-hero-banner .hero-container .heart {
                color: #d63384;
                padding: 0 10px;
                font-size: 14px;
            }

            .my-hero-banner .hero-container .hero-description {
                font-size: 18px;
                line-height: 1.6;
                color: #4a4a4a;
                max-width: 350px;
            }

            .my-hero-banner .hero-container .hero-image {
                flex: 1;
                min-width: 750px;
                line-height: 0;
            }

                .my-hero-banner .hero-container .hero-image img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    display: block;
                }

    /* Mobile Responsiveness */
    @media (max-width: 768px) {
        .my-hero-banner .hero-container .hero-content {
            padding: 40px 30px;
            text-align: center;
        }

        .my-hero-banner .hero-container .divider {
            justify-content: center;
        }

        .my-hero-banner .hero-container .hero-description {
            margin: 0 auto;
        }
    }

    /* Main Card */
    .pink-stats-container {
        margin: auto;
        background: linear-gradient(90deg, #fde4ea, #fbf0f2);
        border-radius: 16px;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        overflow: hidden;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    }

    /* Box */
    .pink-stat-box {
        display: flex;
        align-items: center; /* vertical center */
        justify-content: center; /* horizontal center */
        gap: 15px;
        padding: 40px 25px;
        position: relative;
        text-align: left;
    }

        /* Divider Line */
        .pink-stat-box:not(:last-child)::after {
            content: "";
            position: absolute;
            top: 12%;
            right: 0;
            width: 1px;
            height: 80%;
            background: #f8cdda;
        }

        /* Icon */
        .pink-stat-box img {
            width: 80px;
            height: 80px;
            color: #ff4d8d;
        }

        /* Number */
        .pink-stat-box h2 {
            font-size: 40px;
            color: #d81b60;
            margin-bottom: 0px;
        }

        /* Text */
        .pink-stat-box p {
            font-size: 17px;
            color: #333;
        }

        /* Hover */
        .pink-stat-box:hover {
            background: rgba(255, 0, 100, 0.05);
        }

    /* Responsive */
    @media (max-width: 768px) {
        .pink-stats-container {
            grid-template-columns: 1fr;
        }

        .pink-stat-box {
            border-right: none;
            border-bottom: 1px solid rgba(0,0,0,0.08);
        }
    }
    /* Row */
    .services-row {
        display: flex;
        flex-wrap: wrap;
        justify-content: center; /* ⭐ KEY LINE */
        margin-left: -10px;
        margin-right: -10px;
    }

    /* Each item */
    .service-item-4 {
        width: 25%;
        padding: 10px;
        box-sizing: border-box; /* 4 items per row */
    }

        .service-item-4 a {
            color: #333;
            display: block;
        }

    @media (max-width: 992px) {
        .service-item-4 {
            width: 33.33%;
        }
    }

    @media (max-width: 576px) {
        .service-item-4 {
            width: 50%;
        }

    }

    @media (max-width: 400px) {
        .service-item-4 {
            width: 100%;
        }
    }
    /* Card */
    .my-service-card-4 {
        background: #fff;
        border-radius: 12px;
        padding: 20px 15px;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
        height: 100%;
        transition: 0.3s;
        min-height: 360px;
        width: 100%;
    }

        .my-service-card-4:hover {
            transform: translateY(-5px);
            box-shadow: 0 5px 20px rgba(0,0,0,0.1);
        }

        .my-service-card-4 h6 {
            font-weight: 600;
            margin-bottom: 8px;
            font-size: 20px;
            line-height: 28px;
        }

        .my-service-card-4 p {
            font-size: 17px;
        }

        .my-service-card-4 h6 span {
            font-size: 17px;
        }
    /* Each item */
    .service-item-5 {
        display: block;
    }

    .service-item-5 {
        width: 33.33%;
        padding: 10px;
        box-sizing: border-box; /* 4 items per row */
    }

        .service-item-5 a {
            color: #333;
            display: block;
        }

    @media (max-width: 992px) {
        .service-item-5 {
            width: 33.33%;
        }
    }

    @media (max-width: 576px) {
        .service-item-5 {
            width: 50%;
        }
    }

    @media (max-width: 400px) {
        .service-item-5 {
            width: 100%;
        }
    }
    /* Card */
    .my-service-card-5 {
        background: #fff;
        border-radius: 12px;
        padding: 20px 15px;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
        height: 100%;
        transition: 0.3s;
        min-height: 360px;
        width: 100%;
    }

        .my-service-card-5:hover {
            transform: translateY(-5px);
            box-shadow: 0 5px 20px rgba(0,0,0,0.1);
        }

        .my-service-card-5 h6 {
            font-weight: 600;
            margin-bottom: 8px;
            font-size: 20px;
            line-height: 28px;
        }

        .my-service-card-5 p {
            font-size: 17px;
        }

        .my-service-card-5 h6 span {
            font-size: 17px;
        }
    /* Row */
    .trust-row-fs {
        display: flex;
        flex-wrap: wrap;
        text-align: center;
        z-index: 7;
        position: relative;
        background-color: #fff;
        box-shadow: 0px 4px 18px 0px rgba(0,0,0,0.3);
        border-radius: 20px;
        padding: 0px 20px;
        margin-top: -100px;
    }

    /* Column */
    .trust-col-fs {
        width: 20%;
        padding: 20px 15px;
        position: relative;
    }

        /* Vertical Divider Line */
        .trust-col-fs:not(:last-child)::after {
            content: "";
            position: absolute;
            top: 20%;
            right: 0;
            width: 1px;
            height: 60%;
            background: #f8cdda;
        }

        /* Icon */
        .trust-col-fs img {
            width: 120px;
        }

        /* Text */
        .trust-col-fs h6 {
            font-weight: 600;
            margin-bottom: 5px;
            font-size: 20px;
            line-height: 28px;
        }

        .trust-col-fs p {
            font-size: 17px;
        }


    @media (max-width: 992px) {
        .trust-col-fs {
            width: 33.33%;
        }
    }

    @media (max-width: 576px) {
        .trust-col-fs {
            width: 50%;
        }
        .desklogoright {
            display: none !important;
        }
    }

    /* Section */


    /* Container */
    .health-container {
        margin: auto;
        background: linear-gradient(90deg, #fbe2eb, #feecf2);
        border-radius: 20px;
        display: flex;
        align-items: center;
        gap: 20px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    }

    /* Left Image */
    /* Left Image Wrapper */
    .health-left {
        position: relative;
        display: inline-block;
    }

        /* Image */
        .health-left img {
            display: block;
            width: 370px;
            border-bottom-left-radius: 20px;
            border-top-left-radius: 20px;
            height: 220px;
            object-fit: cover;
            display: block;
            position: relative;
            z-index: 1;
        }



    /* Content */
    .health-content {
        flex: 1;
        padding-left: 30px;
    }

        .health-content h2 {
            font-size: 25px;
            margin-bottom: 10px;
            color: #333;
        }

        .health-content p {
            font-size: 16px;
            color: #666;
            line-height: 1.6;
        }

    /* Right Illustration */
    .health-right img {
        height: 220px;
        opacity: 0.7;
    }

    /* Responsive */
    @media (max-width: 768px) {
        .health-container {
            flex-direction: column;
            text-align: center;
        }

        .health-left img {
            width: 100%;
            max-width: 250px;
        }

        .health-right img {
            width: 100px;
        }
    }



    .calc-div .results {
        margin-top: 18px;
        padding: 14px;
        border-radius: 10px;
        background: linear-gradient(180deg,#fbfdff,#ffffff);
        border: 1px solid #eef2f7
    }

    .calc-div .result-item {
        display: flex;
        justify-content: space-between;
        padding: 8px 6px;
        border-bottom: 1px dashed #eef2f7;
        font-size: 16px;
        font-weight: 500;
    }

        .calc-div .result-item:last-child {
            border-bottom: 0
        }

    .calc-div .card {
        background: #ffffff;
        border-radius: 12px;
        box-shadow: 0 6px 20px rgba(15,23,42,0.08);
        padding: 35px
    }

    .select-button {
        cursor: pointer;
    }

    .calc-div .container {
        max-width: 820px;
        margin: 0px auto;
        padding: 20px
    }

    .calc-div p.lead {
        margin: 0 0 35px;
        color: #333;
        font-size: 18px;
        font-weight: 600;
        line-height: 2;
    }

    .calc-div input[type=date], .calc-div input[type=number], .calc-div select {
        width: 100%;
        padding: 10px;
        border: 1px solid #e6e9ef;
        border-radius: 8px;
        font-size: 16px
    }

    .calc-div label {
        display: block;
        font-size: 16px;
        margin-bottom: 10px;
        color: #333;
        font-weight: 500;
    }

    .calc-div .small {
        font-size: 16px;
        color: #333;
    }

    .calc-div .actions {
        display: flex;
        gap: 10px;
        margin-top: 20px
    }

    .calc-div .button {
        background: var(--main-600);
        color: #fff;
        padding: 10px 14px;
        border-radius: 10px;
        border: 0;
        font-weight: 600;
        cursor: pointer
    }

    .calc-div .secondary {
        background: var(--main-two-600);
        color: #fff;
        padding: 10px 14px;
        border-radius: 10px;
        border: 0;
        font-weight: 600;
        cursor: pointer
    }

    .calc-div footer {
        margin-top: 30px;
        font-size: 16px;
        color: #333;
        font-weight: 500;
    }

    .calc-div .bigpink {
        color: var(--main-600);
        font-weight: 800;
        font-size: 18px;
    }

    .calc-div .smallpink {
        color: #333;
        font-weight: 500;
        font-size: 16px;
    }

    .due-calc-div .container {
        max-width: 820px;
        margin: 0px auto;
        padding: 20px
    }

    .due-calc-div #calculator {
        max-width: 850px;
        margin: 0 auto;
        background-color: #fff;
        border-radius: 12px;
        box-shadow: 0 6px 20px rgba(15,23,42,0.08);
        padding: 35px;
        border: 1px solid #e6e9ef;
    }

    .due-calc-div label {
        display: block;
        margin-bottom: 15px;
        font-weight: 600;
        font-size: 16px;
    }

    .due-calc-div input {
        width: 100%;
        padding: 10px;
        border: 1px solid #e6e9ef;
        border-radius: 8px;
        font-size: 16px;
        margin-bottom: 26px;
    }

    .due-calc-div .button {
        background: var(--main-600);
        color: #fff;
        padding: 10px 14px;
        border-radius: 10px;
        border: 0;
        font-weight: 600;
        cursor: pointer
    }

        .due-calc-div .button:hover {
            background-color: var(--main-two-600);
        }

    .due-calc-div .dueresult {
        margin-top: 20px;
        font-weight: bold;
        width: 100%;
        padding: 10px 14px;
        border-radius: 8px;
        font-size: 18px;
        color: #333;
    }

    .due-calc-div .bigpink {
        color: var(--main-600);
        font-weight: 800;
        font-size: 25px;
    }

    .ov-calc-div .container {
        max-width: 820px;
        margin: 0px auto;
        padding: 20px
    }

    .ov-calc-div .card {
        background: #ffffff;
        border-radius: 12px;
        box-shadow: 0 6px 20px rgba(15,23,42,0.08);
        padding: 55px
    }

    .ov-calc-div .title {
        text-align: center;
        width: 100%;
        margin: 20px auto;
        font-size: 21px;
        line-height: 1.5;
        font-weight: 500;
        font-family: var(--body-font);
    }

    .ov-calc-div div#input {
        width: 100%;
    }

    .ov-calc-div input[name="ovul_input"] {
        text-align: center;
        width: 100%;
        padding: 15px;
        border: 1px solid #e6e9ef;
        border-radius: 8px;
        font-size: 16px;
        margin-bottom: 26px;
    }

    .ov-calc-div div#butt {
        text-align: center;
        display: block;
    }

    .ov-calc-div button[name="button"] {
        background: var(--main-600);
        color: #fff;
        padding: 15px 15px;
        border-radius: 10px;
        border: 0;
        font-weight: 600;
        cursor: pointer;
        width: 100%;
    }

    .ov-calc-div div#result {
        background-color: #808080;
        border-radius: 5px;
        background: linear-gradient(#333, #808080);
        width: 100%;
        min-height: 100px;
        margin: 50px auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 15px;
    }

        .ov-calc-div div#result #res1 {
            color: #fff;
            padding: 0px 25px;
            margin: 2px auto;
            text-align: justify;
            font-size: 21px;
        }

        .ov-calc-div div#result #res2 {
            color: #fff;
            padding: 0px 25px;
            margin: 2px auto;
            text-align: justify;
            font-size: 21px;
            line-height: 31px;
        }

    .bmi-calc-div .container {
        max-width: 820px;
        margin: 0px auto;
        padding: 20px
    }

    .bmi-calc-div .card {
        border-radius: 12px;
        padding: 40px 25px !important;
    }

    .bmi-calc-div .result-box {
        padding: 35px;
        background-color: #e6e9ef;
        background: linear-gradient(#e6e9ef, #eef2f7);
        border-radius: 8px;
        font-size: 22px;
        line-height: 35px;
        color: #333;
        margin-bottom: 50px;
        height: auto;
    }

    .bmi-calc-div canvas {
        background: #fff;
        border-radius: 10px;
        margin-top: 30px;
    }

    .bmi-calc-div label {
        display: block;
        margin-bottom: 15px;
        font-weight: 600;
        font-size: 16px;
    }

    .bmi-calc-div h3 {
        font-size: 25px;
        margin-bottom: 15px;
    }

    .bmi-calc-div input {
        width: 100%;
        padding: 15px 10px;
        border: 1px solid #e6e9ef;
        border-radius: 8px;
        font-size: 16px;
        margin-bottom: 20px;
    }

    .bmi-calc-div select {
        width: 100%;
        padding: 15px 10px;
        border: 1px solid #e6e9ef;
        border-radius: 8px;
        font-size: 16px;
        margin-bottom: 26px;
    }

    .bmi-calc-div .btncalc {
        background: var(--main-600);
        color: #fff;
        padding: 15px 10px;
        border-radius: 10px;
        border: 0;
        font-weight: 600;
        cursor: pointer;
        margin-top: 15px;
    }

        .bmi-calc-div .btncalc:hover {
            background-color: var(--main-two-600);
        }

    .status-blue {
        color: #007bff;
        font-weight: bold;
    }

    .status-green {
        color: #28a745;
        font-weight: bold;
    }

    .status-orange {
        color: #fd7e14;
        font-weight: bold;
    }

    .status-red {
        color: #dc3545;
        font-weight: bold;
    }

    .bmi-calc-div .button {
        background: var(--main-600);
        color: #fff;
        padding: 15px 10px;
        border-radius: 10px;
        border: 0;
        font-weight: 600;
        cursor: pointer;
        margin-top: 15px;
    }

        .bmi-calc-div .button:hover {
            background-color: var(--main-two-600);
        }

    .bmi-calc-div .result {
        margin-top: 15px;
        padding: 13px;
        background: #fff2f7;
        border-left: 5px solid #d81b60;
        border-radius: 5px
    }

    .bmi-calc-div .table-box {
        margin-top: 20px;
        overflow-x: auto
    }

    .bmi-calc-div table {
        width: 100%;
        border-collapse: collapse;
        font-size: 14px
    }

    .bmi-calc-div th, td {
        border: 1px solid #ddd;
        padding: 8px;
        text-align: center
    }

    .bmi-calc-div th {
        background: #ffebf0;
        font-weight: bold;
        color: #d81b60
    }

    .bmi-calc-div tr:nth-child(even) {
        background: #fafafa
    }
