/* Beta and Bloom Brand Styles */

/* Color palette */
:root {
    --deep-teal: #638475;
    --shadow-grey: #272727;
    --frosted-mint: #d6f8d6;
    --rosy-taupe: #b49594;
    --smoky-rose: #a26769;
    --parchment: #F2F1EA;
}


html {
    font-size: 22px;
}



/* Base */
body {
    background-color: var(--shadow-grey);
    color: var(--shadow-grey);
    font-size: 1.05rem;
    line-height: 1.7;
}


/* NAVBAR */
.navbar-main {
    background-color: var(--deep-teal);
}

    .navbar-main .navbar-brand span {
        color: var(--parchment);
        font-weight: 600;
    }

    .navbar-main .nav-link {
        color: var(--parchment);
    }

        .navbar-main .nav-link:hover {
            color: var(--shadow-grey);
        }


        /*Patient Portal Button normal*/
    .navbar-main .btn-dark {
        background-color: var(--parchment);
        color: var(--deep-teal);
        border-color: var(--parchment);
    }
        /*Patient Portal Button hover*/
        .navbar-main .btn-dark:hover {
            border-color: var(--parchment);
            background-color: var( --smoky-rose);
            color: var(--parchment);
        }

/* HERO */


.hero-logo {
    display: block;
    margin: 0 auto;
    max-width: 80vw; /* never wider than 80% of screen */
    width: 320px; /* nice size on larger screens */
    height: auto; /* keep the correct aspect ratio */
}

.hero-section {
    background: linear-gradient(180deg, var(--deep-teal), var(--shadow-grey));
    color: var(--parchment);
}

    .hero-section h1 {
        color: var(--parchment);
    }

    .hero-section .hero-subtext {
        color: var(--parchment);
    }
    /*Request an appointment Button*/
    .hero-section .btn-dark {
        background-color: var(--parchment);
        color: var(--deep-teal);
        border-color: var(--parchment);
    }
        /*Request an appointment Button hover*/
        .hero-section .btn-dark:hover {
            border-color: var(--parchment);
            background-color: var(--smoky-rose);
            color: var(--parchment);
        }
    /*Explore services Button*/
    .hero-section .btn-outline-secondary {
        color: var(--parchment);
        border-color: var(--parchment);
    }
        /*Explore services Button hover*/
        .hero-section .btn-outline-secondary:hover {
            background-color: var(--smoky-rose);
            color: var(--parchment);
        }

/* TRUST STRIP */
.trust-strip {
    background-color: var(--smoky-rose);
    color: var(--parchment);
    border-color: var(--rosy-taupe) !important;
}

    .trust-strip .col {
        font-weight: 5
        00;
    }

/* SERVICES */
.services-section {
    background-color: var(--parchment);
    color: var(--shadow-grey);
}

    .services-section h2 {
        color: var(--shadow-grey);
    }

/* TEAM */
.team-section {
    background-color: var(--deep-teal);
    color: var(--parchment);
}

    .team-section h2 {
        color: var(--parchment);
    }

    .team-section .team-intro {
        color: var(--parchment);
    }

/* INSURANCE */
.insurance-section {
    background-color: var(--parchment);
    color: var(--shadow-grey);
}

    .insurance-section h2 {
        color: var(--shadow-grey);
    }

/* FAQ */
.faq-section {
    background-color: var(--deep-teal);
    color: var(--parchment);
}

    .faq-section h2 {
        color: var(--parchment);
    }

/* CONTACT */
.contact-section {
    background: linear-gradient(180deg, var(--frosted-mint), var(--parchment));
    color: var(--shadow-grey);
}

    .contact-section h2 {
        color: var(--shadow-grey);
    }

/* CARDS */
.card {
    background-color: var(--parchment);
    border-color: var(--rosy-taupe);
    border-radius: 0.75rem;
}

.card-title {
    color: var(--deep-teal);
    font-weight: 600;
}

.card-body .small.text-secondary {
    color: var(--shadow-grey);
}

/* BUTTONS */
.btn-dark {
    background-color: var(--deep-teal);
    border-color: var(--deep-teal);
    color: var(--parchment);
}

    .btn-dark:hover {
        background-color: var(--smoky-rose);
        border-color: var(--smoky-rose);
    }

.btn-outline-secondary {
    color: var(--deep-teal);
    border-color: var(--deep-teal);
}

    .btn-outline-secondary:hover {
        background-color: var(--deep-teal);
        color: var(--parchment);
    }

/* FAQ ACCORDION */
.accordion-item {
    border-color: var(--rosy-taupe);
}

.accordion-button {
    background-color: var(--parchment);
    color: var(--shadow-grey);
}

    .accordion-button:not(.collapsed) {
        background-color: var(--smoky-rose);
        color: var(--parchment);
        border-bottom: 1px solid var(--rosy-taupe);
    }

/* FOOTER */
.site-footer {
    background-color: var(--shadow-grey);
    color: var(--parchment);
    border-color: var(--rosy-taupe) !important;
}

    .site-footer .footer-link {
        color: var(--parchment);
        text-decoration: none;
    }

        .site-footer .footer-link:hover {
            color: var(--smoky-rose);
        }


/* PRIVACY PAGE LAYOUT */

.privacy-page {
    /* keep Bootstrap bg-light for the body, just ensure text uses your normal colors */
    color: var(--shadow-grey);
}

    .privacy-page main {
        /* no extra background; the cards carry the design */
        background-color: transparent;
    }

    .privacy-page .privacy-intro {
        color: var(--shadow-grey);
    }

    .privacy-page .privacy-card {
        background-color: var(--parchment);
    }

        .privacy-page .privacy-card h2,
        .privacy-page .privacy-card h3 {
            color: var(--deep-teal);
        }

        .privacy-page .privacy-card p,
        .privacy-page .privacy-card ul,
        .privacy-page .privacy-card li {
            color: var(--shadow-grey);
        }


/* TERMS PAGE LAYOUT */

.terms-page {
    color: var(--shadow-grey);
}

    .terms-page main {
        background-color: transparent;
    }

    .terms-page .terms-card {
        background-color: var(--parchment);
    }

        .terms-page .terms-card h2,
        .terms-page .terms-card h3 {
            color: var(--deep-teal);
        }

        .terms-page .terms-card p,
        .terms-page .terms-card ul,
        .terms-page .terms-card li {
            color: var(--shadow-grey);
        }


/* ACCESSIBILITY PAGE LAYOUT */

.access-page {
    color: var(--shadow-grey);
}

    .access-page main {
        background-color: transparent;
    }

.access-card {
    background-color: var(--parchment);
}

    .access-card h2,
    .access-card h3 {
        color: var(--deep-teal);
    }

    .access-card p,
    .access-card ul,
    .access-card li {
        color: var(--shadow-grey);
    }



@media (max-width: 576px) {

    /* tighten hero spacing on small screens */
    .hero-section {
        padding-top: 2.5rem;
        padding-bottom: 3rem;
        text-align: center;
    }

        .hero-section h1 {
            font-size: 1.6rem;
        }

        .hero-section .hero-subtext {
            font-size: 1rem;
        }

    /* trust strip – keep items readable and centered */
    .trust-strip .row > .col {
        text-align: center;
    }

    /* cards – a little stronger shadow so they stand off the background */
    .card {
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    }
}