.home-hero{
    width: 100%;
    max-width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 1fr auto auto;
    background: transparent;
}

.home-hero-background{
    grid-column: 1;
    grid-row: 1;
    position: relative;
}

.home-hero:is([data-color-scheme|="light"], [data-color-scheme|="medium"]) .home-hero-background{
    background-color: var(--color-white);
}

.home-hero:is([data-color-scheme|="dark"]) .home-hero-background{
    background-color: var(--color-black);
}

.home-hero-background::before,
.home-hero-background::after{
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.home-hero:is([data-color-scheme|="light"], [data-color-scheme|="medium"]) .home-hero-background::before{
    background-color: var(--color-white-50);
}

.home-hero:is([data-color-scheme|="dark"]) .home-hero-background::before{
    background-color: var(--color-blue);
    mix-blend-mode: color;
}

.home-hero-background::after{
    background-color: var(--color-blue-50);
}

.home-hero:is([data-color-scheme|="light"], [data-color-scheme|="medium"]) .home-hero-background::after{
    opacity: 0.5;
}

.home-hero-background img{
    width: 100%;
    min-height: 100%;
    object-fit: cover;
}

.home-hero:is([data-color-scheme|="light"], [data-color-scheme|="medium"]) .home-hero-background img{
    opacity: 0.5;
}

.home-hero:is([data-color-scheme|="dark"]) .home-hero-background img{
    opacity: 0.7;
}

.home-hero-title{
    grid-row: 1;
    grid-column: 1;
    width: 100%;
    max-width: var(--wide-width);
    margin: calc(var(--header-height) + var(--block-margin)) auto var(--item-row-gap);
    align-self: end;
    z-index: 1;
}

.home-hero-title h1{
    font-weight: 400;
    margin: 0;
}

.home-hero-title-image{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
    margin-left: auto;
    margin-bottom: var(--item-row-gap);
}

.home-hero-title-image-inner{
    position: relative;

}

.home-hero-title-image img{
    max-width: min(25vw, 25rem);
}

.home-hero-title-image-inner img{
    width: 100%;
    min-height: 100%;
    object-fit: cover;
}

.home-hero-description{
    grid-row: 2;
    grid-column: 1;
    width: 100%;
    background-color: var(--color-black);
    color: var(--color-white);
    padding: var(--page-padding) 0;
    z-index: 1;
}

.home-hero-description p{
    max-width: var(--wide-width);
    margin: 0 auto;
}

.home-hero-cta{
    grid-row: 3;
    grid-column: 1;
    width: 100%;
    z-index: 1;
    padding-bottom: var(--page-padding);
}

.home-hero-cta > div{
    max-width: var(--wide-width);
    margin: 0 auto;
}

.home-hero-filler{
    display: none;
    z-index: 1;
}

@media (max-width: 767px){
    .home-hero-cta{
        background-color: var(--color-black);
        color: var(--color-white);
    }
}

@media (min-width: 768px){
    .home-hero{
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: 1fr auto var(--block-margin);
    }

    .home-hero-background{
        grid-column: 1 / span 2;
        grid-row: 1 / span 2;
    }

    .home-hero-background img{
        aspect-ratio: 1.6;
        max-height: calc(100vh - var(--block-margin));
    }

    .home-hero-title{
        grid-column: 1 / span 2;
    }

    .home-hero-description{
        grid-column: 1;
        grid-row: 2 / span 2;
        padding: 0;
        display: grid;
        align-items: center;
    }

    .home-hero-description p{
        margin: 0 0 0 auto;
        padding: var(--item-row-gap) var(--item-column-gap) var(--item-row-gap) 0;
        max-width: calc(var(--wide-width) / 2);
    }

    .home-hero-cta{
        grid-column: 2;
        grid-row: 2;
        align-self: end;
        justify-self: start;
        padding: var(--item-row-gap) 0 var(--item-row-gap) var(--item-column-gap);
        max-width: calc(var(--wide-width) / 2);
    }

    .home-hero-cta > div{
        margin: 0;
        max-width: unset;
    }

    .home-hero-filler{
        grid-column: 2;
        grid-row: 3;
        display: block;
    }

    .section-background:has(+ [data-color-scheme="light"]) > .section-background > .home-hero:last-child .home-hero-filler,
    .home-hero:has(+ [data-color-scheme="light"]) .home-hero-filler{
        background-color: var(--light-background-color);
    }

    .section-background:has(+ [data-color-scheme="medium"]) > .section-background > .home-hero:last-child .home-hero-filler,
    .home-hero:has(+ [data-color-scheme="medium"]) .home-hero-filler{
        background-color: var(--medium-background-color);
    }

    .section-background:has(+ [data-color-scheme="dark"]) > .section-background > .home-hero:last-child .home-hero-filler,
    .home-hero:has(+ [data-color-scheme="dark"]) .home-hero-filler{
        background-color: var(--dark-background-color);
    }
}