/* Resume page, additions to system/case.css and home.css (nav).
   Same column, hairlines and type scale as the cases; no new tokens. */

.site-nav { display: flex; gap: 24px; }
@media (max-width: 640px) { .site-nav { gap: 16px; } }

.resume-hero { padding-top: clamp(32px, 6vw, 72px); }
.resume-hero h1 { margin-bottom: 8px; }
.resume-hero .hero-role { font-size: 19px; line-height: 1.4; letter-spacing: -0.015em; color: var(--ink-3); }
.resume-hero .lede { margin-top: 32px; font-size: 19px; color: var(--ink-2); }
.resume-links { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 8px 28px; font-size: 15px; }
.resume-links a { text-underline-offset: 3px; text-decoration-thickness: 1px; }
.resume-links .pdf { font-weight: 500; }

/* Sections: a label above a hairline, then the entries */
.resume-section { --gap-section: 0px; padding-top: clamp(56px, 7vw, 80px); }
.resume-section > .label { padding-bottom: 12px; border-bottom: 1px solid var(--ink); margin-bottom: 0; }

.job { padding: 22px 0; border-bottom: 1px solid var(--rule); }
.job:last-of-type { border-bottom: 0; }
.job-head { display: flex; justify-content: space-between; align-items: baseline; gap: 24px; }
.job-title { font-size: 17px; font-weight: 500; line-height: 1.4; letter-spacing: -0.015em; margin: 0; padding: 0; border: 0; color: var(--ink); }
.job-title span { font-weight: 400; color: var(--ink-3); }
.dates { font-size: 14px; color: var(--ink-3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.job-head + p { margin-top: 6px; color: var(--ink-2); text-wrap: pretty; }
.job .job-lede { color: var(--ink); margin-bottom: 18px; }
.resume-section .job ul { margin-top: 0; }

.resume-section .brief { margin-top: 0; border-top: 0; }

@media (max-width: 640px) {
  .job-head { flex-direction: column; gap: 2px; }
  .job-title { font-size: 16px; }
  .resume-hero .lede { font-size: 17px; }
}