.ce_hero {
    color: var(--color-text-light);
    font-family: var(--font-family-base);
}

.ce_hero__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--spacing-lg);
}

.ce_hero__content,
.ce_hero__statement {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-md);
    min-width: 0;
}

.ce_hero__kicker,
.ce_hero__headline,
.ce_hero__description {
    margin: 0;
    overflow-wrap: anywhere;
}

.home .ce_hero__headline {
    font-weight: var(--font-weight-bold);
}

.home ce_hero__headline-continuation {
    font-weight: var(--font-weight-regular);
}

.ce_hero__kicker {
    letter-spacing: .14em;
    text-transform: uppercase;
}

.ce_hero__headline {
    letter-spacing: -.03em;
}

.ce_hero__headline-continuation {
    display: block;
    font-weight: var(--font-weight-regular);
}

.ce_hero__description {
    color: var(--color-text-ink);
    max-width: 530px;
    white-space: pre-line;
}

.ce_hero__actions {
    max-width: 100%;
    padding-top: var(--spacing-xs);
}

/* Asset-specific icon switching and alignment belong to this Hero only. */
.ce_hero__actions .ic-button__icon--regular {
    display: none;
}

.ce_hero__actions .ic-button__icon--compact {
    width: 10px;
    height: 10px;
}

.ce_hero__actions .ic-button__icon--compact img {
    position: absolute;
    top: -.85px;
    left: -.601px;
}

.ce_hero__visual {
    position: relative;
    min-width: 0;
    aspect-ratio: 342 / 310;
    border-radius: 56px 4px 56px 4px;
    overflow: hidden;
}

/* No-JS browsers show only the noscript poster, without native player UI. */
.ce_hero__video[hidden] {
    display: none;
}

/* The wrapper owns the ratio, including the no-JS poster fallback. */
.ce_hero__picture,
.ce_hero__image {
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

/* Shared geometry for images, poster fallbacks and native video. */
.ce_hero__image {
    object-fit: cover;
    object-position: center;
}

@media (min-width: 701px) {
    .ce_hero__layout {
        grid-template-columns: minmax(0, 374fr) minmax(0, 356fr);
        align-items: center;
        gap: var(--spacing-md);
    }

    .ce_hero__visual {
        aspect-ratio: 356 / 392;
        border-radius: 70px 4px 70px 4px;
    }
}

@media (min-width: 1024px) {
    .ce_hero__actions .ic-button__icon--regular {
        display: block;
    }

    .ce_hero__actions .ic-button__icon--compact {
        display: none;
    }

    .ce_hero__layout {
        grid-template-columns: minmax(0, 636fr) minmax(0, 620fr);
        align-items: start;
        gap: var(--spacing-2xl);
    }

    .ce_hero__content {
        align-self: stretch;
        padding-top: 23px;
    }

    .ce_hero__actions {
        margin-top: auto;
        padding-top: var(--spacing-md);
    }

    .ce_hero__visual {
        align-self: end;
        aspect-ratio: 16 / 11;
        border-radius: 90px 4px 90px 4px;
    }
}