.ww-gw-stories {
    --background-bottom: var(--image-sunburst-bottom) no-repeat center bottom;
    --background-top: transparent;
    --container-background: var(--background-bottom);
    --logo-margin-inline: auto;

    overflow: hidden;
    background: #FF6400;
}

@media (min-width: 768px) {
    .ww-gw-stories {
        --logo-margin-inline: 0 auto;
        --container-background: var(--background-top), var(--background-bottom);

        --background-bottom: var(--image-sunburst-bottom) no-repeat left bottom;
        --background-top: var(--image-sunburst-top) no-repeat right top;
    }
}


.ww-gw-stories>.container--full {
    display: grid;
    grid-template-columns: 1fr;
    gap: 22px;
    align-items: center;

    padding-block: 90px 113px;

    background: var(--container-background);

    @media (min-width: 768px) {
        grid-template-columns: 40% 60%;
        gap: 50px;

        padding-block: 137px 161px;
    }
}

.ww-gw-stories__panel {
    :is(h2, h3) {
        font-family: var(--fonts-azo);
        text-transform: uppercase;
        text-wrap: balance;
    }

    img {
        display: block;
        margin-inline: var(--logo-margin-inline);
    }

    >* {
        font-family: var(--fonts-montserrat);
        text-align: start;
        text-wrap: pretty;
        margin-block-end: var(--_item-spacing);

        --_item-spacing: 1rem;

        @media (min-width: 768px) {
            --_item-spacing: 1.5rem;
        }

        &:last-child {
            --_item-spacing: 0;
        }
    }

    background-color: transparent;
    color: var(--colors-black);
}

.ww-gw-stories__panel--blue {

    --content-button-background-color: var(--colors-deep-blue);
    --content-button-active-background-color: #FF6400;


    :is(h2, h3) {
        font-family: var(--fonts-azo);
        text-transform: uppercase;
        text-wrap: balance;
    }

    background-color: var(--colors-cream);
    color: var(--colors-black);

    >* {
        font-family: var(--fonts-montserrat);

        text-align: center;
        text-wrap: pretty;

        margin-block-end: 1em;

        &:last-child {
            margin-block-end: 0;
        }
    }


    padding-inline: 24px;
    padding-block: 31px 37px;

    @media (min-width: 768px) {
        padding-block: 60px 70px;
        padding-inline: 47px;
    }
}

.ww-gw-stories__btn {
    place-self: center;
}