/**
 *
 * @Copyright 2025 VOID SOFTWARE, S.A.
 *
 */

.home-screen__hero {
    padding: 5rem 2.5rem 3rem 4.5rem;
    background-color: var(--color-neutral-0);
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: url('/assets/images/home-hero-bg.png');
    background-image: image-set(
        url('/assets/images/home-hero-bg.webp') type('image/webp'),
        url('/assets/images/home-hero-bg.png') type('image/png')
    );
    background-size: cover;
    background-position: 75% center;
    background-repeat: no-repeat;
    min-height: calc(100vh - var(--topbar-height));
    position: relative;
}

.home-screen__hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(61.87% 210.83% at 52.71% 76.25%, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.08) 100%);
    z-index: 0;
}

.home-screen__hero__text-content {
    max-width: 48rem;
    color: #464547;
    z-index: 10;
}

.home-screen__hero__text-content .btn {
    padding: 2.2rem 2.4rem;
    font-size: 1.8rem;
    background: radial-gradient(224.23% 733.02% at 133.93% 125%, #ECE5FB 0%, #855FD8 25%, #E85689 100%);
}

.home-screen__hero__text-content h1 {
    font-size: 5.2rem;
    font-weight: 700;
    line-height: 1.2;
    color: #714ABF;
}

.home-screen__hero__text-content h1:last-of-type {
    color: var(--color-purple-darkest);
}

.home-screen__hero__text-content p {
    font-size: 1.8rem;
    font-weight: 500;
    margin: 2rem 0 3.2rem 0;
    color: #464547;
}

.home-screen__hero__image {
    display: none;
    background-image: url('/assets/images/home-hero-bg-2560w.png');
    background-image: image-set(
        url('/assets/images/home-hero-bg-2560w.webp') type('image/webp'),
        url('/assets/images/home-hero-bg-2560w.png') type('image/png')
    );
    background-size: cover;
    background-position: right center;
    background-repeat: no-repeat;
    width: 100%;
}

.how-it-works-switcher__buttons {
    background-color: var(--color-neutral-0);
}

.home-screen__how-it-works {
    background-color: #F2F0F4;
    color: var(--color-neutral-900);
    padding: 7rem 3.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}


@media screen and (max-width: 1560px) {
    .home-screen__hero {
        background-position: 75% center;
    }

    .home-screen__hero__text-content {
        padding-top: 30rem;
    }
}

@media screen and (max-width: 1250px) {
    .home-screen__hero {
        background-position: 80% center;
    }

    .home-screen__hero__text-content h1 {
        font-size: 4.6rem;
    }

    .home-screen__hero__text-content p {
        max-width: 40rem;
    }
}

@media screen and (max-width: 1150px) {
    .home-screen__hero {
        background-image: none;
        height: auto;
        padding: 0;
        align-items: center;
    }

    .home-screen__hero__text-content {
        padding: 5rem 2.5rem;
        max-width: 65rem;
    }

    .home-screen__hero__text-content p {
        max-width: unset
    }

    .home-screen__hero__text-content h1 {
        font-size: 4.2rem;
    }

    .home-screen__hero__image {
        display: block;
        height: 50rem;
    }
}

@media screen and (max-width: 570px) {
    .home-screen__hero__image {
        background-position: 80% center;
    }

    .home-screen__hero__text-content h1 {
        font-size: 3.6rem;
    }
}