/* Categories and learning projects on the code page. */
.code-category {
    margin: 0;
    scroll-margin-top: 80px;
}

.code-category + .code-category {
    margin-top: 32px;
}

.code-category-title {
    margin: 0 0 20px;
    font-size: 24px;
    line-height: 1.3;
}

.code-page .code-entry h3 {
    margin: 0 0 8px;
    color: var(--site-heading-ink);
    font-family: var(--site-ui-font);
    font-size: 21px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.012em;
}

/* Compact project lists; Software styling above is preserved. */
#learning,
#workflows {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
    font-size: 16px;
    scroll-margin-top: 84px;
}
.code-category + #learning { margin-top: 40px; }
#learning + #workflows { margin-top: 36px; }
.learning-header { margin-bottom: 16px; }
.learning-header .code-category-title {
    margin: 0;
    color: var(--site-heading-ink);
    font-family: inherit;
    font-size: 1.375em;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -.025em;
}
.learning-header p {
    margin: 5px 0 0;
    color: #59636b;
    font-size: .875em;
    line-height: 1.5;
}
.learning-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--site-rule); }
.learning-entry {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr) 3rem;
    align-items: baseline;
    column-gap: 20px;
    row-gap: 3px;
    margin: 0;
    padding: 13px 0;
    border-bottom: 1px solid #e9ebed;
}
.learning-entry h3 {
    grid-column: 1;
    grid-row: 1;
    margin: 0;
    min-width: 0;
    font-family: inherit;
    font-size: .96875em;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -.01em;
    text-wrap: initial;
}
.learning-link,
.workflow-paper {
    color: var(--minimal-blue);
    text-decoration: underline;
    text-decoration-color: #c3d0d8;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
.learning-link { display: inline-block; padding-block: 2px; }
.learning-link:hover,
.workflow-paper:hover { color: var(--minimal-blue-hover); text-decoration-color: currentColor; }
.learning-link:focus-visible,
.workflow-paper:focus-visible { outline: 2px solid var(--minimal-blue); outline-offset: 4px; border-radius: 2px; }
.learning-entry .learning-description {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
    min-width: 0;
    color: #59636b;
    font-size: .875em;
    line-height: 1.55;
    text-wrap: initial;
}
.learning-year {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
    color: #59636b;
    font-size: .8125em;
    font-weight: 400;
    font-variant-numeric: tabular-nums;
    line-height: 1.5;
    white-space: nowrap;
}
.workflow-paper {
    display: inline-block;
    min-height: 26px;
    margin-left: 8px;
    padding-block: 2px;
    font-size: 1em;
    white-space: nowrap;
}
@media (max-width: 900px) {
    .learning-entry { grid-template-columns: minmax(0, 1fr) auto; column-gap: 20px; padding-block: 11px; }
    .learning-year { grid-column: 2; }
    .learning-entry .learning-description { grid-column: 1 / -1; grid-row: 2; }
}
@media (max-width: 480px) {
    .learning-header .code-category-title { font-size: 1.25em; }
    .learning-link { padding-block: 4px; }
    .workflow-paper { min-height: 30px; padding-block: 4px; }
}
