.org-vacancy-page-hero {
    @apply relative grid items-end rounded-2xl;
    @apply pb-4 md:pb-0 min-h-[540px] h-[70vh] md:mx-16 mt-5 mb-14;

    .atm-image {
        @apply relative h-full transition-all;
        grid-area: 1/1;

        img {
            @apply w-full h-full object-cover absolute md:rounded-2xl;
        }
    }

    .hero-content-wrapper {
        @apply relative z-10 transition-all m-8 rounded-2xl;
        grid-area: 1/1;
        @apply flex items-center justify-between flex-wrap backdrop-blur-[20px];
        background: linear-gradient(
            110deg,
            rgba(255, 255, 255, 0.75) 0%,
            rgba(255, 255, 255, 0.45) 100%
        );
        @apply p-6;

        .hero-content {
            @apply flex flex-col max-w-max w-full;
            hyphens: auto;

            .atm-heading {
                @apply mb-3;
            }
        }

        .hero-links {
            @apply flex items-center gap-4 flex-wrap;

            .mol-contact-info-cta {
                @apply relative top-0 right-0;
            }
        }
    }

    .hero-content-wrapper.is-sticky {
        @apply fixed w-full z-[1000] shadow-[0_4px_10px_rgba(0,0,0,0.1)] m-0 left-0 top-0 bg-white;
    }
}

.mol-contact-info-cta #contact-cta-link-wrapper {
    @apply absolute bottom-12 cursor-default;

    .mol-social-media {
        @apply mb-4 inline-flex;
    }
}

.hero-content-wrapper.is-sticky
    ~ *
    .mol-contact-info-cta
    #contact-cta-link-wrapper,
.hero-content-wrapper.is-sticky
    .mol-contact-info-cta
    #contact-cta-link-wrapper {
    @apply top-full bottom-auto mt-2;
}

.org-vacancy-page-hero.job-alert {
    @apply h-[50vh];

    .hero-content-wrapper {
        @apply bg-secondary-col-1 bg-none p-8;

        .atm-heading {
            @apply mb-0 text-white;
        }
    }
}