/* ============================================================
   LEANDRO MOZZONE
   ============================================================ */


/* ============================================================
   PRESENTACIÓN
   ============================================================ */

.profile-intro {
    display: grid;

    grid-template-columns: .78fr 1.22fr;

    gap: 80px;
    align-items: start;
}

.profile-intro-title h2 {
    max-width: 470px;
}

.profile-intro-text {
    max-width: 700px;

    color: var(--muted);

    font-size: 1.08rem;
    line-height: 1.85;
}

.profile-intro-text p {
    margin: 0 0 20px;
}

.profile-intro-text p:last-child {
    margin-bottom: 0;
}


/* ============================================================
   FORMA DE TRABAJO
   ============================================================ */

.profile-focus {
    display: grid;

    grid-template-columns: .78fr 1.22fr;

    gap: 80px;
    align-items: start;
}

.profile-focus-heading h2 {
    max-width: 470px;
}

.profile-focus-content {
    max-width: 700px;

    color: var(--muted);

    font-size: 1.05rem;
    line-height: 1.82;
}

.profile-focus-content p {
    margin: 0 0 20px;
}

.profile-focus-content p:last-child {
    margin-bottom: 0;
}


/* ============================================================
   MUNDAWA
   ============================================================ */

.profile-mundawa {
    position: relative;

    overflow: hidden;

    padding: 58px;

    border-radius: var(--radius-lg);

    background: var(--mundawa);
    color: white;
}

.profile-mundawa::after {
    content: "";

    position: absolute;

    width: 430px;
    height: 430px;

    right: -170px;
    top: 50%;

    transform: translateY(-50%);

    border: 1px solid rgba(255,255,255,.06);
    border-radius: 50%;

    pointer-events: none;
}

.profile-mundawa-content {
    position: relative;
    z-index: 1;

    max-width: 760px;
}

.profile-mundawa-brand {
    display: block;

    margin-bottom: 17px;

    color: rgba(255,255,255,.62);

    font-family: "Outfit", sans-serif;
    font-size: .78rem;
    font-weight: 600;

    letter-spacing: .1em;
}

.profile-mundawa h2 {
    margin-bottom: 23px;

    color: white;
}

.profile-mundawa p {
    max-width: 720px;

    margin: 0 0 18px;

    color: rgba(255,255,255,.76);

    font-size: 1.04rem;
    line-height: 1.8;
}

.profile-mundawa .btn {
    margin-top: 13px;
}


/* ============================================================
   ÁREAS DE TRABAJO
   ============================================================ */

.profile-areas {
    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 16px;
}

.profile-area {
    min-height: 185px;

    padding: 25px;

    border: 1px solid rgba(39,52,112,.10);
    border-radius: var(--radius);

    background: white;
}

.profile-area h3 {
    margin-bottom: 10px;

    color: var(--mundawa);

    font-size: 1.08rem;
}

.profile-area p {
    margin: 0;

    color: var(--muted);

    font-size: .89rem;
    line-height: 1.68;
}


/* ============================================================
   TABLET
   ============================================================ */

@media (max-width: 940px) {

    .profile-intro,
    .profile-focus {
        grid-template-columns: 1fr;

        gap: 40px;
    }

    .profile-areas {
        grid-template-columns: repeat(2, 1fr);
    }

}


/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 680px) {

    .profile-mundawa {
        padding: 36px 28px;
    }

    .profile-areas {
        grid-template-columns: 1fr;
    }

}