/* Resume page — builds on style.css (same tokens, type and margin-column grid). */
.nav nav a[aria-current="page"] { color: var(--ink); }
.printonly { display: none; }

.rhead { padding-block: 56px 56px; }
.rhead .label { margin: 0 0 14px; }
.rhead h1 { font-size: clamp(40px, 6vw, 80px); }
.rhead .lede { margin-top: 18px; color: var(--ink); max-width: 40ch; }
.margin a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.margin a:hover { color: var(--ink); }

.sect { padding-block: 44px; }
.summary { margin: 0; max-width: 70ch; font-size: 17px; line-height: 1.65; }

.jobs { display: grid; gap: 40px; }
.jh { display: flex; justify-content: space-between; align-items: baseline; gap: 6px 20px; flex-wrap: wrap; }
.jh h3 { margin: 0; font-family: var(--display); font-weight: 400; font-size: clamp(20px, 2.2vw, 26px); line-height: 1.2; }
.jh h3 .co { color: var(--accent); margin-right: .3em; }
.jh h4 { margin: 0; font-size: 16px; font-weight: 600; }
.when { font-family: var(--mono); font-size: 12px; color: var(--muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.where { margin: 4px 0 0; font-size: 14px; color: var(--muted); }
.job ul, .earlier { margin: 14px 0 0; padding: 0; list-style: none; display: grid; gap: 10px; max-width: 78ch; }
.job li, .earlier li { position: relative; padding-left: 18px; font-size: 15.5px; line-height: 1.6; }
.job li::before, .earlier li::before { content: ""; position: absolute; left: 0; top: .78em; width: 8px; height: 1px; background: var(--muted); }
.job b, .earlier b { font-weight: 600; }
.roles { display: grid; gap: 20px; margin-top: 16px; padding-left: 18px; border-left: 1px solid var(--rule); }
.roles ul { margin-top: 8px; }
.earlier { margin: 0; gap: 14px; }

.skills { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.skills h3 { margin: 0 0 12px; font-size: 15px; font-weight: 600; }
.tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.tags li { font-size: 13px; line-height: 1.3; padding: 5px 9px; background: var(--tint); color: var(--ink); }

#education .cv > ul { align-content: start; }
.cv li a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--rule); text-underline-offset: 3px; }
.cv li a:hover { color: var(--accent); text-decoration-color: currentColor; }


@media (max-width: 860px) {
  .skills { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .rhead { padding-block: 40px 44px; }
  .rhead > div { order: 1; }
}

/* ---- print: browser "Save as PDF" and the generated PDF ---- */
@page {
  size: Letter;
  margin: 0.5in 0.55in 0.6in;
  @bottom-center { content: "Wicksell Metellus · Page " counter(page) " of " counter(pages); font-family: "IBM Plex Mono", monospace; font-size: 7.5pt; color: #5c6270; }
}
@media print {
  :root { --margin-col: 1.15in; }
  html, body { background: #fff; }
  body { padding: 0; font-size: 9.5pt; line-height: 1.42; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .page { max-width: none; padding: 0; }
  .nav, .skip, .noprint, footer { display: none !important; }
  /* block layout in print so long sections can break across pages; the label sits in the margin column */
  .hero, .sect { display: block; position: relative; padding-left: calc(var(--margin-col) + 0.2in); }
  .sect > .label, .hero > .margin { position: absolute; left: 0; top: 0; width: var(--margin-col); }
  .sect > .label { top: 10pt; margin-top: 3pt; }
  .jobs { display: block; }
  .jobs > .job + .job { margin-top: 11pt; }
  .rhead { padding-block: 0 9pt; }
  .rhead .label { display: none; }
  .rhead h1 { font-size: 28pt; line-height: 1; }
  .rhead .lede { font-size: 10.5pt; margin-top: 4pt; max-width: none; }
  .rhead > .margin { display: none; }
  #education { border-bottom: 0; }
  .printonly { display: block !important; margin: 5pt 0 0; font-family: var(--mono); font-size: 8pt; color: var(--muted); }
  .margin a { color: var(--ink); text-decoration: none; }
  .sect { padding-block: 8pt; }
  .sect > .label { top: 8pt; }
  .label { font-size: 7.5pt; margin-top: 2pt; }
  .summary { font-size: 9.3pt; line-height: 1.42; max-width: none; }
  .jh h3 { font-size: 12.5pt; }
  .jh h4 { font-size: 9.5pt; }
  .when { font-size: 7.5pt; }
  .where { font-size: 8.5pt; margin-top: 1pt; }
  .job ul, .earlier { margin-top: 5pt; gap: 3.5pt; max-width: none; }
  .job li, .earlier li { font-size: 9pt; line-height: 1.38; padding-left: 11pt; }
  .job li::before, .earlier li::before { width: 5pt; }
  .roles { gap: 6pt; margin-top: 6pt; padding-left: 10pt; }
  .roles ul { margin-top: 2pt; }
  .earlier { margin: 0; gap: 4pt; }
  .skills { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12pt; }
  .skills h3 { font-size: 9pt; margin-bottom: 5pt; }
  .tags { gap: 3pt; }
  .tags li { font-size: 7.5pt; padding: 2pt 5pt; }
  .cv { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16pt; }
  .cv h2 { font-size: 7.5pt; margin-bottom: 5pt; }
  .cv ol, .cv ul { gap: 3pt; }
  .cv li { font-size: 9pt; line-height: 1.38; grid-template-columns: 0.55in minmax(0, 1fr); gap: 4pt; }
  .yr { font-size: 7.5pt; padding-top: 1pt; }
  .cv li a { text-decoration: none; color: var(--ink); }
  .jh, .role, .job li, .earlier li, .skills > div, .cv > * { break-inside: avoid; }
  .jh, .where { break-after: avoid; }
  .label { break-after: avoid; }
  h1, h2, h3, h4 { break-after: avoid; }
}