/*=========================================================
=                         ABOUT                           =
=========================================================*/

/*---------- Section ----------*/

.about{
    position:relative;
    overflow:hidden;
}

/*---------- Container ----------*/

.about__container{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:var(--space-5);
    align-items:center;
}

/*---------- Content ----------*/

.about__header{
    margin-bottom:var(--space-4);
    max-width:34rem;
}

.about__title{}

.about__description{
    margin-top:var(--space-2);
}

/*---------- Values ----------*/

.about__values{
    display:grid;
    gap:var(--space-3);
}

.about-value{
    position:relative;
    padding-left:1.6rem;
    border-left:2px solid var(--border-strong);
}

.about-value::before{
    content:"";
    position:absolute;
    left:-5px;
    top:.35rem;
    width:8px;
    height:8px;
    border-radius:50%;
    background:var(--sunflower);
}

.about-value__title{
    margin-bottom:.35rem;
    font-size:1.05rem;
    text-transform:uppercase;
    letter-spacing:.04em;
    color:var(--primary-dark);
}

.about-value__description{
    color:var(--text-soft);
}

/*---------- Media ----------*/

.about__media{
    position:relative;
}

.about__media::before{
    content:"";
    position:absolute;
    inset:-14px auto auto -14px;
    width:100%;
    height:100%;
    border:2px solid var(--sunflower);
    border-radius:var(--radius-lg);
    z-index:-1;
}

.about__image{
    width:100%;
    aspect-ratio:4/5;
    object-fit:cover;
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-lg);
}

/*---------- Responsive ----------*/

@media(max-width:900px){

    .about__container{
        grid-template-columns:1fr;
    }

    .about__media{
        order:-1;
    }

    .about__media::before{
        display:none;
    }

    .about__image{
        aspect-ratio:16/10;
    }

}