body{
    background: url(../assets/technology/background-technology-mobile.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.tech__tab{
    display: inline-grid;
    place-items: center;
    outline: none;
    background-color: transparent;
    border: 1px solid var(--white-10);
    border-radius: 50%;
    aspect-ratio: 1;
    padding: 0 1rem;
    color: var(--white);
    font-family: var(--belle);
}

.tech__img{
    margin-block: 4rem;
}

.tech__texts {
    margin-block: 4rem;
}

.tech__subheading{
    font-family: var(--condensed);
    font-size: clamp(0.875rem, 2vw, 2rem);
    font-weight: 400;
    color: var(--light);
    letter-spacing: 2px;
}

.tech__heading{
    margin-block-start: 0.7rem;
}

.tech__description{
    margin-block-start: 2rem;
}

@media (min-width: 43.55rem){
    body{
        background: url(../assets/technology/background-technology-tablet.jpg);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    .tech__description{
        margin-inline: 0;
    }

    .tech__container-content{
        display: flex;
        gap: 2rem;
        justify-content: start;
        order: 1;
    }

    .tech__image{
        order: 2;
    }

    .tech__img{
        width: 13rem;
        margin-block: 0;
    }

    .tech__tabs{
        flex-direction: column;
    }

    .tech__tab{
        padding: 0 2rem;
        font-size: 2rem;
    }

    .tech__container{
        display: grid;
        align-items: center;
        gap: 2rem;
        padding-inline: 0;
        margin-inline: 0;
    }

    .tech__texts{
        margin-block: 0;
    }

    .tech__main{
        margin-inline-start: 4rem;
    }
}

@media (min-width: 56.05rem){
    body{
        background: url(../assets/technology/background-technology-desktop.jpg);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    .tech__img{
        width: 25rem;
    }

    .tech__container-content{
        gap: 4rem ;
    }

    .tech__container{
        gap: 4rem;
    }
}