.at-homepageHero {
    padding-block: 5.8rem 6.2rem !important;
    background-image: linear-gradient(0deg, #F4F1ED 0%, rgba(239,235,229,0.00) 50%),
                      linear-gradient(269deg, #F77AB4 27%, rgba(247,122,180,0.00) 100%),
                      linear-gradient(48deg, #F05A00 57%, rgba(240,90,0,0.00) 80%);
}

.at-homepageHero__inner {
    max-width: 784px;
    margin-inline: auto;
    text-align: center;
}

.at-homepageHero * {
    color: var(--baseLight100);
}

.at-homepageHero__intro {
    max-width: 400px;
    margin-inline: auto;
    letter-spacing: .32px;
}

/**
 * News flash
 */

.at-homepageHero:has(.newsFlash) .g-container__inner {
    direction: rtl; /** Hack to get relative positioning on a fixed positioned element */
}

.at-homepageHero:has(.newsFlash) :where(.at-homepageHero__inner, .newsFlash) {
    direction: ltr; /** Revert above declaration so texts are readable */
}

.newsFlash {
    position: fixed;
    top: 7rem;
    max-width: var(--maxIntroWidthSmall);
    padding: var(--marginSmall);
    border-radius: var(--borderRadius);
    background-color: rgba(250, 249, 247, 0.8);
    box-shadow: 0 0 20px rgb(0 0 0 / 10%);
    transition: all .3s ease-in-out;
}

@media (prefers-reduced-motion: no-preference) {
    .newsFlash {
        animation: .3s ease-in-out 0s 1 popUp;
    }

    @keyframes popUp {
        0% {
            scale: 0;
            opacity: 0;
            transform: translateY(4rem);
        }
        50% {
            opacity: 1;
            transform: translateY(0);
        }
        100% {
            scale: 1;
        }
    }
}

.newsFlash:has(.newsFlash__image) {
    display: grid;
    grid-template-columns: 1fr 84px;
    gap: 2rem;
}

.newsFlash.--hidden {
    opacity: 0;
    pointer-events: none;
}

.newsFlash__contentWrapper * {
    color: var(--primaryColor500);
}

.newsFlash__title {
    margin-bottom: var(--marginExtraSmall);
    font-family: var(--siteFont);
    font-size: var(--14Size);
    font-weight: 600;
}

.newsFlash__intro {
    font-size: var(--13Size);
    line-height: 1.384;
}

.newsFlash__image {
    border-radius: 0;
}

@media (max-width: 768px) {
    .at-homepageHero:has(.newsFlash) .g-container__inner {
        display: flex;
        flex-direction: column-reverse;
        gap: var(--marginLarge);
    }

    .newsFlash {
        position: relative;
        transform: translateY(-6rem);
        margin-top: -6rem;
    }
}