.ww-gw-hero {
    display: grid;
    grid-template-areas: 'stack';

    --content-heading-font-size: 2.5rem;
    --content-subheading-font-size: 1.25rem;
    --content-gap: 1rem;

    --video-aspect-ratio: 1;
}

@media (width>=768px) {
    .ww-gw-hero {
        --content-heading-font-size: 5rem;
        --content-gap: 2rem;
        --video-aspect-ratio: 16 /9;
    }
}
.ww-gw-hero-video {
    aspect-ratio: var(--video-aspect-ratio);
}
.ww-gw-hero-video > * {
    display: block;
    width: 100%;
    height: 100%;
}

.ww-gw-hero>* {
    grid-area: stack;
}

.ww-gw-hero .content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: var(--content-gap);

    isolation: isolate;
}

.ww-gw-hero .content>* {
    text-align: center;
    text-transform: uppercase;
    text-wrap: balance;

    color: var(--colors-white);

}

.ww-gw-hero h1 {
    font-family: var(--fonts-azo);
    font-size: var(--content-heading-font-size);
}

.ww-gw-hero p {
    font-family: var(--fonts-montserrat);
    font-weight: 700;
    font-size: var(--content-subheading-font-size);
    line-height: 100%;
}

.ww-gw-hero {

    picture,
    img {
        display: block;
        width: 100%;
    }
}