.about {
    position:relative;
    padding:120px 0;
    background:var(--black-graphite);
    overflow:hidden;
}


.about-grid {
    display:grid;
    grid-template-columns:1fr;
    position:relative;
    z-index:2;
}


/* IMAGEM LATERAL */

.about-media{
    position:absolute;

    top:-180px;
    bottom:-180px;

    left:50%;
    transform:translateX(-50%);

    width:100vw;
    height:auto;

    background:url('../assets/images/06_technician_lab.png')
               center center/cover no-repeat;

    z-index:1;

    -webkit-mask-image:linear-gradient(
        90deg,
        black 0%,
        black 75%,
        transparent 100%
    );

    mask-image:linear-gradient(
        90deg,
        black 0%,
        black 75%,
        transparent 100%
    );
}

/* SOMBRA ENTRE IMAGEM E TEXTO */

.about-media::before {

    content:"";

    position:absolute;

    inset:0;


    background:
        linear-gradient(
            90deg,
            transparent 45%,
            rgba(5,6,8,.55) 80%,
            var(--black-graphite) 100%
        );

}



/* TEXTO */

.about-copy {

    max-width:620px;

    margin-left:auto;

    position:relative;

    z-index:3;

}


.about-copy h2 {

    font-size:clamp(2.6rem,4vw,4.5rem);

    line-height:1.08;

    letter-spacing:-0.03em;

    margin-bottom:28px;

}


.about-copy p {

    max-width:560px;

    color:var(--light);

    margin-bottom:28px;

}



.about-list {

    display:grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:14px;

}


.about-list li {

    position:relative;

    padding-left:24px;

    color:var(--light);

    font-weight:500;

}


.about-list li::before {

    content:'•';

    position:absolute;

    left:0;

    top:0;

    color:var(--white);

}



/* =========================
   RESPONSIVO
========================= */


@media(max-width:992px){

    .about-grid {

        grid-template-columns:1fr;

    }


    .about-media {

        min-height:420px;

    }

}



@media(max-width:768px){

    .about-list {

        grid-template-columns:1fr;

    }

}