.outline {
    margin-top: 3rem;
    line-height: 1.45;
}

.outline-sections {
    row-gap: 3rem;
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
}

.outline > div {
    padding: 0 3rem;
    cursor: pointer;
}

.outline-query {
    margin-bottom: 3rem;
}

.outline-section {
    display: flex;
    flex-direction: column;
    row-gap: 1rem;
    padding: 1rem;
}

.section-dropdown {
    font-size: 1.7rem;
    color: rgb(131, 135, 192);
    margin-right: 2rem;
    transition: 100ms;
}

/* .section-dropdown:hover {
    color: #444dbf;
} */

.outline-section-title {
    font-size: 1.6rem;
    color: #e2e2e2;
    transition: 150ms;
}

.outline-section-keywords {
    font-size: 1.5rem;
    color: rgb(152, 152, 152);
}

.outline-section-desc {
    color: #c9c9c9;
    font-size: 1.55rem;
}

.outline-subsections {
    font-size: 1.5rem;
    color: rgb(204, 204, 204);
    margin-top: 1.5rem;
    row-gap: 3.5rem;
}

.outline-sub {
    border-left: 2px solid #3c3c3c;
    padding-left: 3rem;
}

.outline-sub-title {
    color: white;
}

.iteration {
    border-radius: 3rem;
    width: max-content;
    padding: 0.5rem 1rem !important;
    margin-left: 3rem;
    background-color: #363636;
}

.iteration-back, .iteration-forward {
    font-size: 1.5rem;
    color: rgb(119, 119, 119);
    transition: 100ms;
    user-select: none;
}

.iteration-back:hover, .iteration-forward:hover {
    color: rgb(84, 84, 84);
}

.iteration-title {
    font-size: 1.5rem;
    color: #e0e0e0;
}

.iteration-why {
    font-size: 1.5rem;
    color: rgb(152, 152, 152);
}