.software-hero {
    background-color: var(--primarias-principal-00);
    width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    padding: 32px 0;
}
.software-hero .container {
    position: relative;
}
.software-hero h1 {
    color: var(--primarias-principal-150);
    margin: 0 0 24px 0;
    font-weight: 700;
    font-size: 2rem;
    text-align: left;
}
.software-hero h3 {
    color: var(--secundarias-secundaria-125);
    margin: 0 0;
    font-weight: 500;
    font-size: var(--font-g);
    text-align: left;
}

.software-hero__image {
    width: 80%;
    padding-top: 80%;
    margin: 0 auto;
    border-radius: 50%;
    background-color: var(--primarias-principal-100);
    position: relative;
}
.software-hero__image img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 141%;
    max-width: 141%;
}
.software-hero__description {
    padding: 0.5rem 0;
    font-size: var(--font-p);
}
.software-hero__description p,
.software-hero__description ul
.software-hero__description li {
    font-size: var(--font-m);
    line-height: 1.45;
}

.software-hero .btn {
    background-color: var(--primarias-principal-150);
    border-color: var(--primarias-principal-150);
}

.software-hero__image-celular > img {
    width: 73%;
    transform: translate(-60%, -50%);
    z-index: 2;
    pointer-events: none;
}
.software-hero__image-tablet > img {
    width: 98.6%;
    transform: translate(-50%, -50%);
    z-index: 2;
    pointer-events: none;
}
.software-hero__image-notebook > img {
    width: 127%;
    transform: translate(-50%, -50%);
    z-index: 2;
    pointer-events: none;
}
.software-hero__image-screen {
    background-color: var(--primarias-principal-125);
    border-radius: 20px;
    overflow: hidden;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-49.6%, -51.5%);
    width: 46%;
    height: 98.4%;
    object-fit: cover;
    z-index: 1;
}
.software-hero__image-tablet .software-hero__image-screen {
    border-radius: 0px;
    transform: translate(-49.6%, -49.8%);
    width: 92.5%;
    height: 69.2%;
}
.software-hero__image-notebook .software-hero__image-screen {
    border-radius: 3.9% 3.9% 0 0;
    transform: translate(-50%, -53.7%);
    width: 102.8%;
    height: 67.5%;
}
.software-hero__image-screen img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (min-width: 768px) {
    .software-hero {
        padding: 117px 0;
    }
    .software-hero h1 {
        margin: 0 0 24px 0;
        font-size: 4.5rem;
    }
    .software-hero h3 {
        margin: -20px 0 0 0;
        font-size: 1.5rem;
    }
    .software-hero__description p,
    .software-hero__description ul
    .software-hero__description li {
        font-size: var(--font-g);
    }
    .software-hero .btn {
        background-color: var(--primarias-principal-150);
        font-size: 1.125rem;
        line-height: 1;
    }
}
@media (min-width: 680px) and (max-width: 1023px) {
    .software-hero__image {
        width: 520px;
        padding-top: 520px;
    }
}
@media (min-width: 1024px) {
    .software-hero h1,
    .software-hero h3,
    .software-hero__description {
        width: 50%
    }
    .software-hero__button {
        max-width: 50%;
    }
    .software-hero__image {
        width: 35%;
        padding-top: 35%;
        position: absolute;
        right: 4%;
        top: 50%;
        transform: translate(0, -50%);
    }
}
@media (min-width: 1280px) {
    .software-hero .container {
        padding: 0 0;
    }
    .software-hero__image {
        width: 450px;
        padding-top: 450px;
    }
}
@media (min-width: 1400px) {
    .software-hero__image {
        width: 520px;
        padding-top: 520px;
        right: 0;
    }
}
@media (max-width: 400px) {
    .software-hero .btn {
        width: 100%;
    }
}
