main {
    background-color: #fff;
}

.about {
    background: #fff;
}

.about_gradient {
    background: linear-gradient(90deg, var(--main-color-start) 0%, var(--main-color-end) 100%);
    height: 100%;
    width: 100%;
    overflow: hidden;
    padding: 4rem 10vw 4rem 10vw;
    color: #fff;
}

.about_heading {
    color: #fff;
    margin-bottom: 3rem;
    font: var(--heading2-font);
}

.digits_list {
    list-style-type: none;
    display: flex;
    gap: 5vw;
    margin-bottom: 4rem;
}

.digits_list_item_heading {
    opacity: 0;
    font-size: 12vh;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.digits_list_item_desc {
    font: var(--heading3-font);
}

.about_first_paragraph {
    margin-bottom: 1rem;
    line-height: 150%;
}

.about_second_paragraph {
    line-height: 150%;
}

.about_photo {
    opacity: 0;
    width: 100%;
    height: 8rem;
    border-radius: 8px;
    object-fit: cover;
    filter: grayscale(100%);
    margin-bottom: 2rem;
}


/* CONTACTS SECTION */
.contacts {
    padding: 10svh 10vw;
}

.contacts_heading {
    margin-bottom: 2rem;

    font: var(--heading2-font);

    background: linear-gradient(to right, var(--main-color-start), var(--main-color-end));
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

.contacts_paragraph {
    color: var(--secondary-grey);

    &:not(:last-child) {
        margin-bottom: 1rem;
    }
}

.contacts_list {
    list-style-type: none;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.contacts_list_item {
    width: fit-content;
    opacity: 0;
    translate: 50% 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.contacts_list_item_icon {
    height: 2rem;
    width: 2rem;
}

.contacts_list_item_link {
    text-decoration: none;
    color: var(--accent-color);
}

@media screen and (max-width: 960px) {
    /* CONTACTS SECTION */
    .contacts {
        padding: 10svh 5vw 5svh;
    }

    .about_gradient {
        padding: 3rem 5vw;
    }

    .digits_list {
        flex-direction: column;
        gap: 3rem;
    }

    .digits_list_item_desc {
        font-size: 1rem;
    }
}