/* Shared professional white/teal redesign for public inner pages. */
:root {
    --page-teal: #087d7b;
    --page-teal-dark: #073f46;
    --page-teal-soft: #e8f7f6;
    --page-aqua: #11aaa5;
    --page-ink: #123038;
    --page-muted: #587176;
    --page-line: #d7eceb;
    --page-bg: #f5fbfa;
    --page-shadow: 0 22px 54px rgba(8, 128, 126, 0.11);
}

body {
    background: #ffffff;
}

/* Common page surfaces */
.about-page,
.what-page,
.help-page,
.csr-page,
.cp-wrap,
.events-page-wrapper,
.career-page,
.contact-page,
.hb-baaz-page,
.support-page,
.health-page,
.donation-ui {
    background:
        radial-gradient(circle at 8% 0%, rgba(17, 170, 165, 0.09), transparent 26%),
        linear-gradient(180deg, #ffffff 0%, var(--page-bg) 42%, #ffffff 100%) !important;
}

.about-shell,
.what-shell,
.help-shell,
.csr-page,
.events-page-wrapper,
.cp-wrap,
.career-page,
.contact-page,
.hb-baaz-page,
.support-page,
.health-page {
    position: relative;
}

/* Remove old decorative orbs that make pages feel template-like. */
.about-orb,
.what-orb,
.help-orb,
.cp-hero__orb {
    display: none !important;
}

/* Premium organization hero treatment. */
.about-hero,
.what-hero,
.help-hero,
.csr-hero,
.cp-hero,
.career-hero,
.contact-hero,
.hb-baaz-hero,
.support-hero,
.health-hero,
.logoheader {
    position: relative;
    overflow: hidden;
    border-radius: 0 !important;
    border: 1px solid rgba(8, 128, 126, 0.16) !important;
    background:
        linear-gradient(112deg, rgba(7, 63, 70, 0.98) 0%, rgba(8, 125, 123, 0.94) 58%, rgba(17, 170, 165, 0.88) 100%) !important;
    box-shadow: var(--page-shadow) !important;
}

.about-hero,
.what-hero,
.help-hero,
.csr-hero {
    padding: 46px !important;
}

.cp-hero {
    min-height: 500px !important;
}

.cp-hero__bg,
.cp-hero__bg::after {
    opacity: 0.28;
}

.logoheader {
    padding: 58px 20px !important;
    margin: 0 !important;
    color: #ffffff !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
}

.about-hero::after,
.what-hero::after,
.help-hero::after,
.csr-hero::after,
.cp-hero::after,
.career-hero::after,
.contact-hero::after,
.hb-baaz-hero::after,
.support-hero::after,
.health-hero::after,
.logoheader::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 8px;
    background: linear-gradient(90deg, #035f5d, #11aaa5, #8de3dc);
}

.about-title,
.what-title,
.help-title,
.csr-hero h1,
.cp-hero h1,
.career-hero h1,
.contact-hero h1,
.hb-baaz-hero h1,
.support-hero h1,
.health-hero h1,
.page-title-section h1 {
    letter-spacing: 0 !important;
    text-wrap: balance;
}

.about-title,
.what-title,
.help-title,
.csr-hero h1,
.cp-hero h1 {
    font-size: clamp(2.35rem, 4vw, 4.2rem) !important;
    line-height: 1.04 !important;
    max-width: 12.5ch !important;
}

.about-badge,
.what-badge,
.help-badge,
.csr-kicker,
.cp-hero__badge,
.csr-section-label,
.event-badge {
    border-radius: 4px !important;
    background: rgba(255, 255, 255, 0.13) !important;
    border: 1px solid rgba(255, 255, 255, 0.24) !important;
    color: #ffffff !important;
    letter-spacing: 0.08em !important;
}

/* Media cards */
.about-visual-card,
.what-visual-card,
.help-visual-card,
.csr-hero__media,
.csr-intro__media,
.cp-hero__img-main,
.event-card-image,
.campaign-card img {
    border-radius: 0 0 0 52px !important;
    border: 8px solid #ffffff !important;
    box-shadow: 0 24px 60px rgba(7, 63, 70, 0.18) !important;
}

.about-visual-chip,
.what-visual-overlay,
.help-visual-overlay,
.csr-hero__note,
.cp-hero__img-badge {
    border-radius: 0 !important;
    border-top: 6px solid var(--page-aqua) !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: var(--page-ink) !important;
    box-shadow: 0 18px 42px rgba(8, 128, 126, 0.15) !important;
}

/* Buttons */
.about-btn,
.what-btn,
.help-btn,
.csr-btn,
.download-btn,
.read-more-btn,
.btn-read-more-modern,
.btn-register-modern,
.cp-btn,
.support-btn,
.contact-btn,
.health-btn,
.career-btn {
    border-radius: 4px !important;
    min-height: 46px;
    font-weight: 900 !important;
    text-decoration: none !important;
}

.about-btn--primary,
.what-btn--primary,
.help-btn--primary,
.csr-btn--primary,
.download-btn,
.read-more-btn,
.btn-read-more-modern,
.cp-btn--primary,
.support-btn--primary,
.contact-btn--primary,
.health-btn--primary,
.career-btn--primary {
    background: linear-gradient(135deg, var(--page-teal), var(--page-aqua)) !important;
    color: #ffffff !important;
    border: 2px solid var(--page-teal) !important;
    box-shadow: 0 15px 30px rgba(8, 128, 126, 0.22) !important;
}

.about-btn--secondary,
.what-btn--secondary,
.help-btn--secondary,
.csr-btn--ghost,
.btn-register-modern,
.cp-btn--ghost,
.support-btn--secondary,
.contact-btn--secondary,
.health-btn--secondary,
.career-btn--secondary {
    background: #ffffff !important;
    color: var(--page-teal) !important;
    border: 2px solid rgba(8, 128, 126, 0.55) !important;
}

/* Cards and panels */
.about-trust__item,
.what-metric,
.help-metric,
.csr-metric,
.csr-panel,
.csr-principle,
.csr-card,
.campaign-card,
.event-card-modern,
.filters-section,
.cp-chip,
.cp-card,
.contact-card,
.career-card,
.health-card,
.support-card,
.form-card,
.card-modern,
.custom-card,
.service-card {
    border-radius: 0 !important;
    border: 1px solid var(--page-line) !important;
    background: #ffffff !important;
    color: var(--page-ink) !important;
    box-shadow: 0 16px 38px rgba(8, 128, 126, 0.08) !important;
}

.about-trust__item:hover,
.what-metric:hover,
.help-metric:hover,
.csr-principle:hover,
.csr-card:hover,
.campaign-card:hover,
.event-card-modern:hover,
.cp-card:hover,
.contact-card:hover,
.career-card:hover,
.health-card:hover,
.support-card:hover,
.service-card:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 28px 70px rgba(8, 128, 126, 0.14) !important;
}

.about-trust__item strong,
.what-metric strong,
.help-metric strong,
.csr-metric strong,
.campaign-card h3,
.event-card-content h3,
.csr-card h3,
.cp-card h3,
.contact-card h3,
.career-card h3,
.health-card h3,
.support-card h3 {
    color: var(--page-teal-dark) !important;
}

.about-trust__item span,
.what-metric span,
.help-metric span,
.csr-metric span,
.campaign-card p,
.event-card-content p,
.csr-card p,
.cp-card p,
.contact-card p,
.career-card p,
.health-card p,
.support-card p {
    color: var(--page-muted) !important;
}

/* Listing pages */
.events-page-wrapper,
.container.mt-5 {
    padding-top: 64px !important;
    padding-bottom: 80px !important;
}

.page-title-section {
    max-width: 820px;
    margin: 0 auto 38px !important;
}

.page-title-section h1 {
    color: var(--page-teal-dark) !important;
    font-weight: 900 !important;
}

.page-title-section p {
    color: var(--page-muted) !important;
}

.filters-section,
.container.mt-5 > .row.mb-4 {
    background: #ffffff !important;
    border: 1px solid var(--page-line) !important;
    box-shadow: var(--page-shadow) !important;
    padding: 24px !important;
    margin-bottom: 34px !important;
}

.form-select,
.form-control {
    border: 1px solid var(--page-line) !important;
    border-radius: 4px !important;
    min-height: 46px;
}

.form-select:focus,
.form-control:focus {
    border-color: var(--page-teal) !important;
    box-shadow: 0 0 0 0.2rem rgba(8, 128, 126, 0.12) !important;
}

.campaign-card {
    padding: 0 !important;
    overflow: hidden;
}

.campaign-card img {
    height: 240px !important;
    width: 100% !important;
    border: 0 !important;
    border-radius: 0 !important;
}

.campaign-card h3,
.campaign-card h6,
.campaign-card p,
.campaign-card .mb-3,
.campaign-card .button-group {
    margin-left: 22px !important;
    margin-right: 22px !important;
}

.campaign-card .button-group {
    gap: 10px;
    padding-bottom: 22px;
}

.progress {
    border-radius: 999px !important;
    background: var(--page-teal-soft) !important;
}

.progress-bar {
    background: linear-gradient(90deg, var(--page-teal), var(--page-aqua)) !important;
}

.badge[style*="#008080"],
.badge[style*="008080"] {
    background: var(--page-teal) !important;
}

/* Old footer overrides embedded in some templates must not win. */
footer.site-footer,
.site-footer {
    text-align: left !important;
}

@media (max-width: 991.98px) {
    .about-hero__grid,
    .what-hero__grid,
    .help-hero__grid,
    .csr-hero {
        grid-template-columns: 1fr !important;
    }

    .about-hero,
    .what-hero,
    .help-hero,
    .csr-hero {
        padding: 30px !important;
    }
}

@media (max-width: 767.98px) {
    .about-title,
    .what-title,
    .help-title,
    .csr-hero h1,
    .cp-hero h1 {
        font-size: clamp(2rem, 10vw, 3rem) !important;
    }

    .about-trust,
    .what-metrics,
    .help-metrics,
    .csr-metrics {
        grid-template-columns: 1fr !important;
    }

    .button-group {
        flex-direction: column;
    }
}

/* Dedicated Who We Are redesign. */
.who-page {
    background:
        radial-gradient(circle at 8% 0%, rgba(17, 170, 165, 0.10), transparent 26%),
        linear-gradient(180deg, #ffffff 0%, #f3fbfa 44%, #ffffff 100%) !important;
}

.who-orb {
    display: none !important;
}

.who-shell {
    padding: 44px 0 92px !important;
}

.who-hero {
    border-radius: 0 !important;
    padding: 46px !important;
    background:
        linear-gradient(112deg, rgba(7, 63, 70, 0.98) 0%, rgba(8, 125, 123, 0.94) 58%, rgba(17, 170, 165, 0.86) 100%) !important;
    border: 1px solid rgba(8, 128, 126, 0.16) !important;
    box-shadow: 0 26px 68px rgba(8, 128, 126, 0.16) !important;
}

.who-hero::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 8px;
    background: linear-gradient(90deg, #035f5d, #11aaa5, #8de3dc);
}

.who-hero__grid {
    grid-template-columns: minmax(0, 0.9fr) minmax(380px, 1fr) !important;
    gap: 44px !important;
    align-items: center !important;
}

.who-badge,
.who-kicker {
    border-radius: 4px !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase;
}

.who-badge {
    background: rgba(255,255,255,0.13) !important;
    border: 1px solid rgba(255,255,255,0.25) !important;
}

.who-title {
    font-size: clamp(2.4rem, 4vw, 4.35rem) !important;
    line-height: 1.04 !important;
    letter-spacing: 0 !important;
    max-width: 11.8ch !important;
    text-wrap: balance;
}

.who-lead {
    max-width: 620px !important;
}

.who-btn,
.who-support__btn {
    border-radius: 4px !important;
    font-weight: 900 !important;
}

.who-btn--primary,
.who-support__btn {
    background: #ffffff !important;
    color: #035f5d !important;
    border: 2px solid #ffffff !important;
}

.who-btn--secondary {
    background: rgba(255,255,255,0.08) !important;
    color: #ffffff !important;
    border: 2px solid rgba(255,255,255,0.58) !important;
}

.who-metric,
.who-values__item {
    border-radius: 0 !important;
    background: rgba(255,255,255,0.12) !important;
    border: 1px solid rgba(255,255,255,0.22) !important;
    box-shadow: none !important;
}

.who-visual-card {
    min-height: 520px !important;
    border-radius: 0 0 0 74px !important;
    border: 10px solid #ffffff !important;
    box-shadow: 0 28px 72px rgba(4, 42, 49, 0.24) !important;
}

.who-visual-card img {
    object-position: center center;
}

.who-visual-overlay {
    border-radius: 0 !important;
    left: 24px !important;
    right: 24px !important;
    bottom: 24px !important;
    border-top: 7px solid #11aaa5;
    background: rgba(255,255,255,0.96) !important;
}

.who-values {
    gap: 12px !important;
}

.who-section {
    margin-top: 46px !important;
}

.who-heading {
    max-width: 820px;
    margin-bottom: 26px !important;
}

.who-kicker {
    background: #e8f7f6 !important;
    color: #035f5d !important;
}

.who-heading h2 {
    color: #073f46 !important;
    font-size: clamp(2rem, 3vw, 3.35rem) !important;
    letter-spacing: 0 !important;
    text-wrap: balance;
}

.who-heading p {
    color: #587176 !important;
}

.who-grid {
    gap: 22px !important;
}

.who-card,
.who-support,
.who-support__card {
    border-radius: 0 !important;
    background: #ffffff !important;
    border: 1px solid #d7eceb !important;
    box-shadow: 0 18px 42px rgba(8, 128, 126, 0.08) !important;
}

.who-card {
    padding: 30px 28px !important;
    border-top: 6px solid #11aaa5 !important;
}

.who-card:hover,
.who-support__card:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 28px 70px rgba(8, 128, 126, 0.14) !important;
}

.who-card__icon,
.who-support__icon {
    border-radius: 4px !important;
    background: linear-gradient(135deg, #087d7b, #11aaa5) !important;
    color: #ffffff !important;
}

.who-card__eyebrow,
.who-card h3,
.who-support__card h3 {
    color: #073f46 !important;
}

.who-card li,
.who-support__card p {
    color: #587176 !important;
}

.who-card li::before {
    border-radius: 0 !important;
    background: #087d7b !important;
    box-shadow: 0 0 0 5px rgba(8, 128, 126, 0.10) !important;
}

.who-support {
    padding: 34px !important;
}

.who-support__card {
    border-top: 6px solid #087d7b !important;
}

.who-support__btn {
    background: linear-gradient(135deg, #087d7b, #11aaa5) !important;
    color: #ffffff !important;
    border-color: #087d7b !important;
}

.who-band {
    border-radius: 0 !important;
    background: linear-gradient(112deg, #073f46 0%, #087d7b 58%, #11aaa5 100%) !important;
    border: 1px solid rgba(8, 128, 126, 0.18) !important;
    box-shadow: 0 26px 64px rgba(8, 128, 126, 0.16) !important;
}

.who-band__image {
    background: #ffffff;
    padding: 14px;
}

@media (max-width: 991.98px) {
    .who-hero__grid,
    .who-grid,
    .who-support__grid,
    .who-band__grid {
        grid-template-columns: 1fr !important;
    }

    .who-visual-card {
        min-height: 420px !important;
    }

    .who-band__image {
        justify-self: start !important;
    }
}

@media (max-width: 767.98px) {
    .who-hero {
        padding: 28px !important;
    }

    .who-title {
        font-size: clamp(2rem, 10vw, 3rem) !important;
    }

    .who-visual-card {
        min-height: 340px !important;
    }
}

/* Who We Are CTA band contrast fix. */
.who-band,
.who-band h2,
.who-band p,
.who-band .who-kicker {
    color: #ffffff !important;
}

.who-band h2 {
    text-shadow: 0 2px 18px rgba(0, 0, 0, 0.18);
}

.who-band p {
    color: rgba(255, 255, 255, 0.9) !important;
}

.who-band .who-kicker {
    background: rgba(255, 255, 255, 0.16) !important;
    border: 1px solid rgba(255, 255, 255, 0.26) !important;
}

.who-band .who-btn--primary {
    background: #ffffff !important;
    color: #035f5d !important;
    border-color: #ffffff !important;
}

.who-band .who-btn--secondary {
    background: rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.72) !important;
}

.who-band .who-btn--secondary:hover {
    background: #ffffff !important;
    color: #035f5d !important;
}


/* Site-wide BHF-style typography. Uses the custom face when a licensed font asset is available. */
:root {
    --hbf-site-font: "BHF Beats Bold", "Trebuchet MS", Trebuchet, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
}

body,
body *:not(i):not(svg):not(path):not([class^="fa"]):not([class*=" fa-"]):not([class^="bi-"]):not([class*=" bi-"]) {
    font-family: var(--hbf-site-font) !important;
}