/**
 * Hero: grote foto-hero (bibliotheek: .herowrapper .bighero — foto als
 * achtergrond met een verloop-overlay, tekst wit).
 *
 * Geen gelijke variant in Figma; zelfde afronding als de andere hero's
 * en de overlay in de Alma-kleuren (donkerblauw onderaan, zodat witte
 * tekst leesbaar blijft).
 */

.bighero {
    --carmel-color-heading: var(--alma-neutral-0);
    --body-color: var(--alma-neutral-0);
    --carmel-color-btn-primary-bg: var(--alma-neutral-0);
    --carmel-color-btn-primary-text: var(--alma-donker-blauw);
    --carmel-color-btn-secondary-bg: transparent;
    --carmel-color-btn-secondary-text: var(--alma-neutral-0);
    --carmel-color-btn-secondary-border: var(--alma-neutral-0);

    .kt-row-has-bg,
    .kt-row-layout-overlay {
        border-radius: var(--alma-hero-radius) !important;
    }

    .kt-row-layout-overlay {
        background-image: linear-gradient(180deg, rgba(229, 0, 126, 0.35) 0%, rgba(44, 42, 103, 0.85) 100%) !important;
        opacity: 1 !important;
    }

    .carmel-label,
    .carmel-label__text,
    :is(h1, h2, h3, h4, h5, h6) {
        color: var(--alma-neutral-0) !important;
    }
}