@import url('https://fonts.googleapis.com/css2?family=Anta:wght@400&family=Raleway:wght@500&display=swap');
/* Inter for non-homepage title style */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
/* Roboto for breadcrumb styling */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@500&display=swap');

.ccm-block-hero-image {
    position: relative;
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    overflow: hidden;
    /* Full-width breakout from container */
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    /* Bleed upward to the very top of the viewport (for transparent navbars) */
    /* Uses nav offset published by lab_nav (falls back to --lab-navbar-height) */
    --lab-hero-nav-offset: var(--lab-nav-offset-bottom, var(--lab-navbar-height, 80px));
    /* Breadcrumbs need double nav offset because the hero bleeds under the navbar */
    --lab-hero-breadcrumb-top: max(2.5rem, calc(2 * var(--lab-hero-nav-offset, var(--lab-navbar-height, 80px)) + 0.75rem));
    --lab-hero-text-safe-top: max(
        calc(var(--lab-hero-nav-offset, var(--lab-navbar-height, 80px)) + 3rem),
        calc(var(--lab-hero-breadcrumb-top, calc(2 * var(--lab-hero-nav-offset, var(--lab-navbar-height, 80px)) + 0.75rem)) + 1.5rem)
    );
    --lab-hero-full-height: calc(100vh + var(--lab-hero-nav-offset, var(--lab-navbar-height, 80px)));
    --lab-hero-image-scale: 1.05;
    margin-top: calc(-1 * var(--lab-hero-nav-offset, var(--lab-navbar-height, 80px)));
}

.ccm-block-hero-image.is-full-height,
.ccm-block-hero-image.is-full-height .ccm-block-hero-image-cover,
.ccm-block-hero-image.is-full-height .ccm-block-hero-image-image,
.ccm-block-hero-image.is-full-height .ccm-block-hero-image-text,
.ccm-block-hero-image.is-full-height .ccm-block-hero-image-section-divider,
.ccm-block-hero-image.is-full-height .ccm-block-hero-image-video {
    min-height: var(--lab-hero-full-height);
}

.ccm-block-hero-image-cover {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 1;
}

.ccm-block-hero-image-image {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 0;
    overflow: hidden;
}

/* Keep the hero background covering the full text height on responsive layouts */
div.ccm-block-hero-image .ccm-block-hero-image-image {
    height: 100%;
    min-height: 100%;
}

div.ccm-block-hero-image .ccm-block-hero-image-image img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform: scale(var(--lab-hero-image-scale, 1.05));
    transition: transform 0.6s ease;
}

.ccm-block-hero-image-video {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

.ccm-block-hero-image-breadcrumbs {
    position: absolute;
    top: var(--lab-hero-breadcrumb-top);
    left: 1.5rem;
    z-index: 4;
}

.ccm-block-hero-image-breadcrumbs .breadcrumb {
    background: transparent;
    margin-bottom: 0;
    padding: 0;
    color: rgba(255, 255, 255, 0.85);
    font-family: 'Roboto', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
    font-size: clamp(14px, 2.3vw, 20px);
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.ccm-block-hero-image-breadcrumbs .breadcrumb-item,
.ccm-block-hero-image-breadcrumbs .breadcrumb-item a {
    color: rgba(255, 255, 255, 0.85);
    font-family: 'Roboto', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
    font-size: clamp(14px, 2.3vw, 20px);
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-decoration: none;
}

.ccm-block-hero-image-breadcrumbs .breadcrumb-item a:hover,
.ccm-block-hero-image-breadcrumbs .breadcrumb-item a:focus {
    color: rgba(255, 255, 255, 0.95);
    text-decoration: none;
}

.ccm-block-hero-image-breadcrumbs .breadcrumb-item.active {
    color: rgba(255, 255, 255, 0.85);
}

.ccm-block-hero-image-breadcrumbs .breadcrumb-item + .breadcrumb-item::before {
    color: rgba(255, 255, 255, 0.85);
}

.ccm-block-hero-image.has-video .ccm-block-hero-image-image {
    display: none; /* Hide static image if video present */
}

.ccm-block-hero-image-section-divider {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 50%;
    height: 100%;
    background-color: rgba(8, 23, 40, 0.65);
    z-index: 2;
}

div.ccm-block-hero-image.is-about-page div.ccm-block-hero-image-section-divider {
    width: 100%;
}

div.ccm-block-hero-image div.ccm-block-hero-image-text {
    position: relative;
    z-index: 3;
    width: min(58%, 48rem);
    max-width: 48rem;
    text-align: left;
    color: white;
    margin-left: clamp(2.5rem, 7vw, 5rem);
    margin-right: clamp(2.5rem, 9vw, 6rem);
    /* Offset content below transparent navbar while keeping background flush */
    padding-top: max(var(--lab-hero-text-safe-top), clamp(3rem, 8vh, 5rem));
    padding-right: clamp(1.5rem, 3vw, 2.5rem);
    padding-bottom: clamp(2.5rem, 7vh, 3.5rem);
    padding-left: clamp(1.5rem, 3vw, 2.5rem);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: clamp(1rem, 3vh, 1.75rem);
    box-sizing: border-box;
}

@media (min-width: 769px) {
    /* Restore non-about heroes to vertical centering without losing nav clearance */
    div.ccm-block-hero-image.is-homepage div.ccm-block-hero-image-text,
    div.ccm-block-hero-image.is-standard-page div.ccm-block-hero-image-text {
        justify-content: center;
    }
}

div.ccm-block-hero-image:not(.has-section-divider) div.ccm-block-hero-image-text {
    width: min(64%, 52rem);
}

div.ccm-block-hero-image div.ccm-block-hero-image-text.ccm-block-hero-image-text--centered {
    width: min(90%, 48rem);
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    justify-content: center;
    align-items: center;
    padding-top: max(var(--lab-hero-text-safe-top), clamp(3rem, 8vh, 5rem));
    padding-right: clamp(1.5rem, 5vw, 3rem);
    padding-bottom: calc(var(--lab-hero-nav-offset, var(--lab-navbar-height, 80px)) + clamp(2rem, 6vh, 3rem));
    padding-left: clamp(1.5rem, 5vw, 3rem);
}

div.ccm-block-hero-image div.ccm-block-hero-image-text.ccm-block-hero-image-text--centered > * {
    margin-left: auto;
    margin-right: auto;
}

div.ccm-block-hero-image div.ccm-block-hero-image-text.ccm-block-hero-image-text--centered .lab-hero-button {
    display: flex;
    justify-content: center;
}

/* Constrain inner content and center it while keeping text left-aligned */
.ccm-block-hero-image .ccm-block-hero-image-text > * {
    max-width: 48rem; /* ~768px; adjust as needed */
    width: 100%;
}

/* Responsive adjustments */
@media (max-width: 992px) {
    .ccm-block-hero-image {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        --lab-hero-image-scale: 1.03;
        --lab-hero-text-safe-top: max(
            calc(var(--lab-hero-nav-offset, var(--lab-navbar-height, 80px)) + 2.5rem),
            calc(var(--lab-hero-breadcrumb-top, calc(2 * var(--lab-hero-nav-offset, var(--lab-navbar-height, 80px)) + 0.75rem)) + 1rem)
        );
    }

    div.ccm-block-hero-image div.ccm-block-hero-image-text {
        width: min(100%, 42rem);
        margin-left: clamp(1.75rem, 6vw, 3rem);
        margin-right: clamp(1.75rem, 6vw, 3rem);
        padding-top: max(var(--lab-hero-text-safe-top), clamp(2.5rem, 7vh, 4rem));
        padding-right: clamp(1.25rem, 4vw, 2rem);
        padding-bottom: clamp(2.25rem, 7vh, 3rem);
        padding-left: clamp(1.25rem, 4vw, 2rem);
    }

    div.ccm-block-hero-image:not(.has-section-divider) div.ccm-block-hero-image-text {
        width: min(100%, 44rem);
    }

    div.ccm-block-hero-image.has-section-divider div.ccm-block-hero-image-text {
        width: min(100%, 44rem);
    }

    div.ccm-block-hero-image div.ccm-block-hero-image-text.ccm-block-hero-image-text--centered {
        width: min(100%, 44rem);
        margin-left: auto;
        margin-right: auto;
        padding-top: max(var(--lab-hero-text-safe-top), clamp(2.5rem, 7vh, 4rem));
        padding-right: clamp(1.25rem, 5vw, 2.5rem);
        padding-bottom: calc(var(--lab-hero-nav-offset, var(--lab-navbar-height, 80px)) + clamp(2rem, 6vh, 2.75rem));
        padding-left: clamp(1.25rem, 5vw, 2.5rem);
    }
}

@media (max-width: 768px) {
    .ccm-block-hero-image {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        --lab-hero-image-scale: 1;
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        gap: clamp(1rem, 6vh, 1.25rem);
        min-height: auto;
        --lab-hero-text-safe-top: max(
            calc(var(--lab-hero-nav-offset, var(--lab-navbar-height, 80px)) + 1.75rem),
            calc(var(--lab-hero-breadcrumb-top, calc(2 * var(--lab-hero-nav-offset, var(--lab-navbar-height, 80px)) + 0.75rem)) + 0.75rem)
        );
    }

    .ccm-block-hero-image.is-full-height {
        min-height: var(--lab-hero-full-height);
    }

    .ccm-block-hero-image:not(.is-full-height),
    .ccm-block-hero-image:not(.is-full-height) .ccm-block-hero-image-cover,
    .ccm-block-hero-image:not(.is-full-height) .ccm-block-hero-image-image,
    .ccm-block-hero-image:not(.is-full-height) .ccm-block-hero-image-section-divider,
    .ccm-block-hero-image:not(.is-full-height) .ccm-block-hero-image-video,
    .ccm-block-hero-image:not(.is-full-height) .ccm-block-hero-image-text {
        min-height: auto !important;
    }

    .ccm-block-hero-image.is-full-height,
    .ccm-block-hero-image.is-full-height .ccm-block-hero-image-cover,
    .ccm-block-hero-image.is-full-height .ccm-block-hero-image-image,
    .ccm-block-hero-image.is-full-height .ccm-block-hero-image-section-divider,
    .ccm-block-hero-image.is-full-height .ccm-block-hero-image-video,
    .ccm-block-hero-image.is-full-height .ccm-block-hero-image-text {
        min-height: var(--lab-hero-full-height) !important;
    }

    .ccm-block-hero-image.is-about-page .ccm-block-hero-image-cover {
        background: linear-gradient(180deg, rgba(8, 23, 40, 0.85) 0%, rgba(8, 23, 40, 0.65) 45%, rgba(8, 23, 40, 0.35) 100%);
    }

    .ccm-block-hero-image.is-about-page .ccm-block-hero-image-section-divider {
        display: none;
    }

    .ccm-block-hero-image.is-about-page div.ccm-block-hero-image-text {
        background: transparent;
    }

    div.ccm-block-hero-image div.ccm-block-hero-image-text {
        position: relative;
        width: 100%;
        height: auto;
        margin-left: 0;
        margin-right: 0;
        padding-top: var(--lab-hero-text-safe-top);
        padding-right: 1.75rem;
        padding-bottom: clamp(2rem, 7vh, 2.5rem);
        padding-left: 1.75rem;
        align-items: flex-start;
        text-align: left;
        background: linear-gradient(180deg, rgba(8, 23, 40, 0.85) 0%, rgba(8, 23, 40, 0.65) 45%, rgba(8, 23, 40, 0.35) 100%);
        gap: clamp(0.75rem, 5vh, 1rem);
    }

    div.ccm-block-hero-image div.ccm-block-hero-image-text > * {
        max-width: 100%;
    }

    div.ccm-block-hero-image div.ccm-block-hero-image-text.ccm-block-hero-image-text--centered {
        align-items: center;
        text-align: center;
        margin-left: 0;
        margin-right: 0;
    }

    .ccm-block-hero-image .lab-hero-button {
        width: 100%;
        display: flex;
        justify-content: flex-start;
    }

    .ccm-block-hero-image .lab-hero-button .btn {
        width: fit-content;
    }

    .ccm-block-hero-image-section-divider {
        width: 100%;
        background-color: rgba(8, 23, 40, 0.65);
    }

    .ccm-block-hero-image-breadcrumbs {
        position: relative;
        top: auto;
        left: auto;
        padding: calc(var(--lab-hero-nav-offset, var(--lab-navbar-height, 80px)) + 1rem) 1.75rem 0 1.75rem;
        width: 100%;
        z-index: 4;
    }
}

@media (max-width: 576px) {
    div.ccm-block-hero-image div.ccm-block-hero-image-text {
        padding-top: var(--lab-hero-text-safe-top);
        padding-right: 1.25rem;
        padding-bottom: clamp(2rem, 8vh, 2.25rem);
        padding-left: 1.25rem;
        gap: clamp(0.5rem, 5vh, 0.75rem);
        margin-left: 0;
        margin-right: 0;
    }

    .ccm-block-hero-image .lab-hero-button {
        justify-content: center;
    }

    .ccm-block-hero-image .lab-hero-button .btn {
        width: 100%;
        text-align: center;
    }

    .ccm-block-hero-image-breadcrumbs {
        padding: calc(var(--lab-hero-nav-offset, var(--lab-navbar-height, 80px)) + 0.75rem) 1.25rem 0 1.25rem;
    }
}

/* Ensure text is readable with proper contrast */
div.ccm-block-hero-image h1,
div.ccm-block-hero-image h2,
div.ccm-block-hero-image h3,
div.ccm-block-hero-image h4,
div.ccm-block-hero-image h5,
div.ccm-block-hero-image h6 {
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    margin-bottom: 1rem;
    font-family: 'Anta', sans-serif;
    font-weight: 400;
    /* Responsive scaling: comfortable on mobile, bold on desktop */
    font-size: clamp(28px, min(6vw, 8vh), 72px);
    line-height: 120%;
}

/* Non-homepage title override (when "Homepage?" is unchecked) */
.ccm-block-hero-image .lab-hero-title.lab-hero-title--nonhome {
    color: #FFF;
    font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
    font-size: clamp(24px, min(7vw, 9vh), 48px);
    font-style: normal;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: -0.75px;
}

div.ccm-block-hero-image p {
    color: white;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
    margin-bottom: 1.5rem;
    font-family: 'Raleway', sans-serif;
    font-weight: 500;
    /* Scale paragraph text slightly with viewport */
    font-size: clamp(16px, min(2.2vw, 3.5vh), 20px);
    line-height: 150%;
}

/* Button styling adjustments for hero context */
div.ccm-block-hero-image .lab-hero-button {
    --lab-hero-btn-font-family: 'Raleway', sans-serif;
    --lab-hero-btn-font-size: var(--Text-Sizes-Text-Medium, var(--font-size-text-medium, 18px));
    --lab-hero-btn-border: var(--Opacity-Neutral-Darkest-15, rgba(10, 7, 1, 0.15));
    --lab-hero-btn-border-strong: rgba(10, 7, 1, 0.3);
}

div.ccm-block-hero-image .lab-hero-button .btn {
    --lab-hero-btn-bg: var(--bs-btn-bg, transparent);
    --lab-hero-btn-color: var(--bs-btn-color, inherit);
    --lab-hero-btn-border-color: var(--bs-btn-border-color, transparent);
    --lab-hero-btn-hover-bg: var(--bs-btn-hover-bg, var(--lab-hero-btn-bg));
    --lab-hero-btn-hover-color: var(--bs-btn-hover-color, var(--lab-hero-btn-color));
    --lab-hero-btn-hover-border-color: var(--bs-btn-hover-border-color, var(--lab-hero-btn-border-color));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: min(435px, 100%);
    padding: 12px 28px;
    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    background-color: var(--lab-hero-btn-bg);
    border-color: var(--lab-hero-btn-border-color);
    color: var(--lab-hero-btn-color);
    font-family: var(--lab-hero-btn-font-family);
    font-weight: 500;
    font-size: var(--lab-hero-btn-font-size);
    line-height: 150%;
    letter-spacing: 0;
    text-decoration: none;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
    transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

div.ccm-block-hero-image .lab-hero-button .btn:not(.btn-link) {
    min-height: 47px;
    opacity: 1;
}

div.ccm-block-hero-image .lab-hero-button .btn.btn-sm {
    min-height: 40px;
    padding: 10px 22px;
    font-size: calc(var(--lab-hero-btn-font-size) * 0.9);
}

div.ccm-block-hero-image .lab-hero-button .btn.btn-lg {
    min-height: 56px;
    padding: 14px 34px;
    font-size: calc(var(--lab-hero-btn-font-size) * 1.1);
}

div.ccm-block-hero-image .lab-hero-button .btn.btn-link {
    width: max-content;
    min-height: auto;
    padding: 0;
    border-width: 0;
    border-color: transparent;
    background-color: transparent;
    box-shadow: none;
    gap: 6px;
}

div.ccm-block-hero-image .lab-hero-button .btn:hover,
div.ccm-block-hero-image .lab-hero-button .btn:focus-visible {
    transform: translateY(-2px);
    opacity: 0.9;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
    background-color: var(--lab-hero-btn-hover-bg);
    border-color: var(--lab-hero-btn-hover-border-color);
    color: var(--lab-hero-btn-hover-color) !important;
}

div.ccm-block-hero-image .lab-hero-button .btn:focus-visible {
    outline: 0;
}

div.ccm-block-hero-image .lab-hero-button .btn:disabled,
div.ccm-block-hero-image .lab-hero-button .btn.disabled {
    transform: none;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

div.ccm-block-hero-image .lab-hero-button .btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--bs-primary, #1D45A5);
    --bs-btn-border-color: var(--bs-primary, #1D45A5);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #173882;
    --bs-btn-hover-border-color: #173882;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #112c66;
    --bs-btn-active-border-color: #112c66;
    --lab-hero-btn-color: #fff;
    --lab-hero-btn-bg: var(--color-brand-primary, #1D45A5);
    --lab-hero-btn-border-color: var(--color-brand-primary, #1D45A5);
    --lab-hero-btn-hover-bg: #FCFCFC;
    --lab-hero-btn-hover-color: var(--color-brand-primary, #1D45A5);
    --lab-hero-btn-hover-border-color: var(--color-brand-primary, #1D45A5);
}

div.ccm-block-hero-image .lab-hero-button .btn-secondary {
    --bs-btn-color: rgba(27, 26, 48, 0.92);
    --bs-btn-bg: var(--bs-secondary-bg, #E4E6EB);
    --bs-btn-border-color: var(--lab-hero-btn-border);
    --bs-btn-hover-color: rgba(27, 26, 48, 0.95);
    --bs-btn-hover-bg: #d8dae1;
    --bs-btn-hover-border-color: rgba(10, 7, 1, 0.23);
    --bs-btn-active-color: rgba(27, 26, 48, 0.95);
    --bs-btn-active-bg: #cdd0d9;
    --bs-btn-active-border-color: var(--lab-hero-btn-border-strong);
    --lab-hero-btn-color: rgba(27, 26, 48, 0.92);
    --lab-hero-btn-bg: var(--bs-secondary-bg, #E4E6EB);
    --lab-hero-btn-border-color: var(--lab-hero-btn-border);
    --lab-hero-btn-hover-bg: #d8dae1;
    --lab-hero-btn-hover-color: rgba(27, 26, 48, 0.95);
    --lab-hero-btn-hover-border-color: rgba(10, 7, 1, 0.23);
}

div.ccm-block-hero-image .lab-hero-button .btn-light {
    --bs-btn-color: rgba(27, 26, 48, 0.95);
    --bs-btn-bg: #FCFCFC;
    --bs-btn-border-color: var(--lab-hero-btn-border);
    --bs-btn-hover-color: rgba(27, 26, 48, 0.95);
    --bs-btn-hover-bg: #f2f2f6;
    --bs-btn-hover-border-color: rgba(10, 7, 1, 0.23);
    --bs-btn-active-color: rgba(27, 26, 48, 0.95);
    --bs-btn-active-bg: #e7e7ed;
    --bs-btn-active-border-color: var(--lab-hero-btn-border-strong);
    --lab-hero-btn-color: rgba(27, 26, 48, 0.95);
    --lab-hero-btn-bg: #FCFCFC;
    --lab-hero-btn-border-color: var(--lab-hero-btn-border);
    --lab-hero-btn-hover-bg: var(--color-brand-primary, #1D45A5);
    --lab-hero-btn-hover-color: var(--color-white, #FFF);
    --lab-hero-btn-hover-border-color: var(--color-brand-primary, #1D45A5);
}

div.ccm-block-hero-image .lab-hero-button .btn-dark {
    --bs-btn-color: #fff;
    --bs-btn-bg: #1B1A30;
    --bs-btn-border-color: #D9D9D9;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #22213D;
    --bs-btn-hover-border-color: #D9D9D9;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #292845;
    --bs-btn-active-border-color: #D9D9D9;
    --lab-hero-btn-color: #fff;
    --lab-hero-btn-bg: #1B1A30;
    --lab-hero-btn-border-color: #D9D9D9;
    --lab-hero-btn-hover-bg: #22213D;
    --lab-hero-btn-hover-color: #fff;
    --lab-hero-btn-hover-border-color: #D9D9D9;
}

div.ccm-block-hero-image .lab-hero-button .btn-outline-secondary {
    --bs-btn-color: rgba(27, 26, 48, 0.92);
    --bs-btn-border-color: var(--lab-hero-btn-border);
    --bs-btn-hover-color: rgba(27, 26, 48, 0.95);
    --bs-btn-hover-bg: #d8dae1;
    --bs-btn-hover-border-color: rgba(10, 7, 1, 0.23);
    --bs-btn-active-color: rgba(27, 26, 48, 0.95);
    --bs-btn-active-bg: #cdd0d9;
    --bs-btn-active-border-color: var(--lab-hero-btn-border-strong);
    --lab-hero-btn-color: rgba(27, 26, 48, 0.92);
    --lab-hero-btn-bg: transparent;
    --lab-hero-btn-border-color: var(--lab-hero-btn-border);
    --lab-hero-btn-hover-bg: #d8dae1;
    --lab-hero-btn-hover-color: rgba(27, 26, 48, 0.95);
    --lab-hero-btn-hover-border-color: rgba(10, 7, 1, 0.23);
}

div.ccm-block-hero-image .lab-hero-button .btn-outline-light {
    --bs-btn-color: rgba(27, 26, 48, 0.95);
    --bs-btn-border-color: var(--lab-hero-btn-border);
    --bs-btn-hover-color: rgba(27, 26, 48, 0.95);
    --bs-btn-hover-bg: #FCFCFC;
    --bs-btn-hover-border-color: rgba(10, 7, 1, 0.23);
    --bs-btn-active-color: rgba(27, 26, 48, 0.95);
    --bs-btn-active-bg: #e7e7ed;
    --bs-btn-active-border-color: var(--lab-hero-btn-border-strong);
    --lab-hero-btn-color: rgba(27, 26, 48, 0.95);
    --lab-hero-btn-bg: transparent;
    --lab-hero-btn-border-color: var(--lab-hero-btn-border);
    --lab-hero-btn-hover-bg: #D9D9D9;
    --lab-hero-btn-hover-color: #1B1A30;
    --lab-hero-btn-hover-border-color: rgba(10, 7, 1, 0.23);
}

div.ccm-block-hero-image .lab-hero-button .btn-outline-dark {
    --bs-btn-color: #1B1A30;
    --bs-btn-border-color: #1B1A30;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #1B1A30;
    --bs-btn-hover-border-color: #1B1A30;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #1B1A30;
    --bs-btn-active-border-color: #1B1A30;
    --lab-hero-btn-color: #1B1A30;
    --lab-hero-btn-bg: transparent;
    --lab-hero-btn-border-color: #1B1A30;
    --lab-hero-btn-hover-bg: #1B1A30;
    --lab-hero-btn-hover-color: #fff;
    --lab-hero-btn-hover-border-color: #1B1A30;
}


/* ------------------------------
   Staggered Fade-Up Animations
   ------------------------------ */
@keyframes labFadeUp {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Title words animate one-by-one */
.ccm-block-hero-image .lab-hero-title-word {
    display: inline-block;
    opacity: 0;
    transform: translateY(10px);
    animation-name: labFadeUp;
    animation-timing-function: ease;
    animation-fill-mode: both;
}

/* Body and button animate after title */
.ccm-block-hero-image .lab-fade-up {
    opacity: 0;
    transform: translateY(10px);
    animation: labFadeUp 0.5s ease both;
}

/* Respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
    .ccm-block-hero-image .lab-hero-title-word,
    .ccm-block-hero-image .lab-fade-up {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}