#home-hero {
    position: relative;
    width: 100%;
    min-height: 88vh;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;

    /*background-color: white;*/
    /*margin-top: 80px;*/
}

/*#home-hero .background {*/
/*    position: absolute;*/
/*    inset: 0;*/
/*    z-index: 0;*/
/*}*/

#home-hero .overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.3));
    z-index: 10;
}

#home-hero img {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
    object-fit: cover;
}

#home-hero .content {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1rem;
    text-align: center;
    z-index: 20;
}

#home-hero .title {
    color: var(--theme-color-reverse-text);
    line-height: 1.2;
    margin-bottom: 1.6rem;
    opacity: 0;
    animation: slideInFadeIn 1s ease forwards;
}

#home-hero .title .accent {
    color: var(--theme-color-accent);
}

#home-hero .description {
    max-width: 42rem;
    margin: 0 auto 2.5rem;
    font-size: 1.25rem;
    line-height: 1.75;
    color: var(--theme-color-reverse-text-trans1);
    animation: slideInFadeIn 1s ease 0.2s forwards;
}

#home-hero .buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1em;
    opacity: 0;
    animation: slideInFadeIn 1s ease 0.3s forwards;
}

/* TODO Responsive */
/*@media (min-width: 640px) {*/
/*    .hero-buttons {*/
/*        flex-direction: row;*/
/*    }*/
/*    .btn-primary, .btn-secondary {*/
/*        width: auto;*/
/*    }*/
/*}*/

@media (min-width: 820px) {
    #home-hero .buttons {
        flex-direction: row;
    }

    /*.hero-title {*/
    /*    font-size: 4rem;*/
    /*}*/
}

/*@media (min-width: 1024px) {*/
/*    .hero-title {*/
/*        font-size: 4.5rem;*/
/*    }*/

/*    .hero-description {*/
/*        font-size: 1.25rem;*/
/*    }*/
/*}*/