.hero-block {
    display: grid;
    height: max(0px, calc(100svh - var(--hero-header-height, 0px)));
    overflow: hidden;
    position: relative;
}

.hero-block__media {
    inset: 0;
    position: absolute;
    z-index: 0;
}

.hero-block__image {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.hero-block__overlay {
    background: radial-gradient(
        ellipse 70% 75% at 50% 52%,
        hsl(0 0% 5% / 60%) 0%,
        hsl(0 0% 5% / 48%) 42%,
        hsl(0 0% 5% / 26%) 74%,
        hsl(0 0% 5% / 14%) 100%
    );
    inset: 0;
    position: absolute;
    z-index: 1;
}

.hero-block__inner {
    align-items: center;
    display: flex;
    justify-content: center;
    position: relative;
    z-index: 2;
}

.hero-block__content {
    --block-content-flow-gap-before-buttons: calc(var(--space-xl, 2.25rem) + 0.5rem);

    align-items: center;
    max-width: min(100%, 50rem);
    text-align: center;
    width: 100%;
}

.hero-block__heading,
.hero-block__text {
    margin-block: 0;
}

.hero-block__heading {
    line-height: 0.98;
}

.hero-block__text {
    line-height: 1.55;
    margin-inline: auto;
    max-width: min(100%, 50rem);
    text-align: center;
    text-wrap: balance;
}

.hero-block__text :where(p, h1, h2, h3, h4, h5, h6, li, blockquote) {
    line-height: 1.55;
    text-align: center;
}

.hero-block__text > :first-child {
    margin-block-start: 0;
}

.hero-block__text > :last-child {
    margin-block-end: 0;
}

.hero-block__buttons {
    justify-content: center;
}

.editor-styles-wrapper .hero-block__editor-placeholder__notice {
    border: 1px dashed currentColor;
    border-radius: 0.5rem;
    padding: 0.875rem 1rem;
}