/* Nav */

.about-nav {
    display: flex;
    justify-content: start;
    height: max-content;
    padding: 24px 36px;
    margin-bottom: 180px;
    width: calc(100% - 72px);
    position: fixed;
    top: 0;
    z-index: 2;
    align-items: center;
    gap: 48px;
    background: hsla(213, 72%, 6%, 72%);
    border-bottom: 1px solid var(--dark-grey-2);
    backdrop-filter: saturate(180%) blur(20px);
}

    .about-nav
    .about-nav_icon {
        height: 72px;
    }

    .about-nav
    .about-nav_project {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 24px;
    }

        .about-nav
        .about-nav_project:hover {
            cursor: pointer;
        }

    .about-nav
    .about-nav_project
    .about-nav_project_text {
        display: flex;
        flex-direction: column;
        text-align: left;
        color: var(--light-grey);
        gap: 6px;
    }

        .about-nav
        .about-nav_project
        .about-nav_link {
            color: var(--white);
            text-decoration: none;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }




/* Content */

.content {
    display: flex;
    flex-direction: column;
    width: 93vw;
    margin: 240px auto;
    gap: 72px;
}

    .content
    .typography_paragraph-x-small,
    .content
    .typography_paragraph-small,
    .content
    .typography_paragraph-medium,
    .content
    .typography_paragraph-large {
        color: var(--light-grey);
    }

    .content
    .image-contain {
        width: 100%;
    }

    .content
    .layout_image-full {
        display: flex;
        flex-direction: column;
        gap: 36px;
    }

        .content
        .layout_image-full
        .image {
            width: 100%;
        }

    .content
    .objective-list_container {
        display: flex;
        flex-direction: column;
        gap: 36px;
    }

        .content
        .objective-list_container
        .objective {
            display: flex;
            flex-direction: column;
            gap: 12px;
            padding: 72px;
        }

        .content
        .objective-list_container
        .objective
        .objective_header {
            display: flex;
            flex-direction: flex-start;
            align-items: flex-start;
            gap: 12px;
        }

        .content
        .icon {
            width: 5px;
        }

            .content
            .objective-list_container
            .objective
            .typography_paragraph-medium {
                color: var(--white);
            }

            .content
            .objective-list_container
            .objective
            .typography_paragraph-medium
            .typography_caption {
                color: var(--white);
            }

    .content
    .layout_typography {
        gap: 24px;
    }



/* Bio */

.content.bio {
    margin: 240px auto 120px auto;
}

.bio
.layout_inner
.layout_typography
.typography_caption {
    text-align: center;
}

.bio
.layout_image-full
.image {
    margin-bottom: -240px;
    z-index: -1;
}



/* Learning */

.learning {
    display: flex;
    flex-direction: column;
    width: 93vw;
    margin: 144px auto;
}

.learning
.layout_inner {
    gap: 18px;
}

    .learning
    .layout_inner
    .grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: 1fr;
        border: 1px solid var(--dark-grey-2);
        padding: 12px;
        width: 100%;
    }

    .learning
    .layout_inner
    .grid
    .grid_column {
        display: flex;
        flex-direction: column;
        padding: 24px;
        gap: 12px;
    }

    .learning
    .layout_inner
    .grid
    .grid_column
    .typography_caption {
        color: var(--dark-grey);
    }

    .learning
    .grid
    .grid_column
    .typography_paragraph-x-small {
        color: var(--light-grey);
    }

.learning
.layout_inner
.image_tile
.typography_caption {
    color: var(--white);
}

.learning
.layout_inner
.image_tile
.typography_paragraph-x-small {
    color: var(--light-grey);
}


/* Content */

.content {
    display: flex;
    flex-direction: column;
    width: 93vw;
    margin: 240px auto;
    gap: 72px;
}

    .content
    .typography_paragraph-x-small,
    .content
    .typography_paragraph-small,
    .content
    .typography_paragraph-medium,
    .content
    .typography_paragraph-large {
        color: var(--light-grey);
    }

    .content
    .image-contain {
        width: 100%;
    }

    .content
    .layout_image-full {
        display: flex;
        flex-direction: column;
        gap: 36px;
    }

        .content
        .layout_image-full
        .image {
            width: 100%;
        }


    .content
    .layout_typography {
        gap: 24px;
    }


/* Image */

.image_tile {
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 60px 0;
}

    .image_tile
    .image {
        width: 100%;
        border-radius: 18px;
    }

    .image_tile
    .typography_paragraph-x-small {
        width: 50%;
    }