:root {
    --brand-blue: #1f4e79;
    --brand-blue-dark: #163a5c;
    --brand-blue-light: #dbeafe;
    --heading-dark: #1e3a5f;
    --text-dark: #1f2937;
    --text-muted: #4b5563;
    --off-white: #f8fafc;
}

body {
    background-color: #ffffff;
    color: var(--text-dark);
}

h1, h2, h3, h4, h5, h6 {
    color: var(--heading-dark);
}

p {
    color: var(--text-dark);
    line-height: 1.7;
}

.bg-brand-light {
    background-color: var(--brand-blue);
    color: white;
}

.bg-off-white {
    background-color: var(--off-white);
}

.text-brand-dark {
    color: var(--brand-blue);
}

.text-brand-heading {
    color: var(--heading-dark);
}

.navbar-brand,
.navbar-nav .nav-link {
    color: white;
}

    .navbar-brand:hover,
    .navbar-nav .nav-link:hover {
        color: var(--brand-blue-light);
    }

.hero-banner {
    position: relative;
    height: 80vh;
    overflow: hidden;
}

.hero-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('/images/cover-image-compressed.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transform: scale(1);
    transition: transform 0.1s linear;
    z-index: 0;
    will-change: transform;
}

.hero-banner .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    z-index: 1;
}

.hero-banner .container {
    z-index: 2;
    position: relative;
}

.card {
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
}

.card-title {
    color: var(--heading-dark);
    font-weight: 600;
}

.card-text {
    color: var(--text-muted);
    line-height: 1.6;
}

.card-zoom-hover {
    transition: transform 0.3s ease;
}

    .card-zoom-hover:hover {
        transform: scale(1.03);
    }

.bg-brand-light h1,
.bg-brand-light h2,
.bg-brand-light h3,
.bg-brand-light h4,
.bg-brand-light h5,
.bg-brand-light h6,
.bg-brand-light p,
.bg-brand-light a {
    color: white;
}

    .bg-brand-light a:hover {
        color: var(--brand-blue-light);
    }


h1, h2, h3, h4, h5, h6 {
    color: var(--heading-dark);
}

.hero-banner h1,
.hero-banner p,
.hero-banner .lead {
    color: #ffffff;
}

.bg-brand-light h1,
.bg-brand-light h2,
.bg-brand-light h3,
.bg-brand-light h4,
.bg-brand-light h5,
.bg-brand-light h6,
.bg-brand-light p,
.bg-brand-light a {
    color: #ffffff;
}

.bg-brand-light .btn-light {
    background-color: #ffffff;
    color: var(--brand-blue);
    border: 1px solid #ffffff;
    font-weight: 600;
}

    .bg-brand-light .btn-light:hover {
        background-color: #eaf2fb;
        color: var(--brand-blue-dark);
        border-color: #eaf2fb;
    }

.bg-brand-light a.fw-bold {
    color: #cfe4ff;
    text-decoration: underline;
}

    .bg-brand-light a.fw-bold:hover {
        color: #ffffff;
    }

.hero-banner h1:focus {
    outline: none;
    box-shadow: none;
}