/* Résumé page — pairs with resume.html. Uses the tokens from site.css. */

.resume-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 2rem;
  padding: calc(var(--line-height) * 1em) 0 calc(4 * var(--line-height) * 1em);
}
.resume-head .project-title { font-size: 1.8rem; line-height: 1.1; }
.resume .resume-head p { margin: 0.7rem 0 0; color: #e8262a; }

/* Every row shares one grid: name | role (+ description) | dates */
.resume .row,
.resume-foot {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 6fr) minmax(0, 3fr);
  column-gap: 3rem;
  align-items: baseline;
}

.resume section + section { margin-top: calc(4 * var(--line-height) * 1em); }
.resume h2 {
  padding: 1rem 0 2.6rem;
  font-weight: 700;
  color: var(--text);
}

.resume p { margin: 0; }
.resume .row h3 { margin: 0; }
.resume .row + .row { margin-top: 1rem; }
.resume .row.cont { margin-top: 0.3rem; }
.resume .row.detail + .row { margin-top: 2.6rem; }
/* Titles and dates: darker than the site's caption grey so they pass 4.5:1. */
.resume { --resume-meta: rgba(0, 0, 0, 0.6); }
:root[data-theme="dark"] .resume { --resume-meta: rgba(255, 255, 255, 0.6); }
.resume .meta { color: var(--resume-meta); }
.resume .meta span { padding: 0 0.25em; }
.resume .dates { color: var(--resume-meta); text-align: right; font-variant-numeric: tabular-nums; }
.resume .desc { max-width: 40em; margin-top: 0.9rem; line-height: 1.5; color: var(--text-secondary); }
/* Each sentence gets a quiet + hung in the gutter (echoing the headline), so the text itself stays
   flush with the job title above it. */
.resume .desc li { position: relative; }
.resume .desc li::before { content: "+"; position: absolute; left: -1.15em; color: var(--text-muted); }
.resume .desc li + li { margin-top: 0.75rem; }

/* Skills | Tools | Languages, on the same three columns */
.resume-foot { align-items: start; }
.resume-foot > hr { grid-column: 1 / -1; }
.resume-foot p { max-width: 30em; line-height: 1.5; }
.resume ul { margin: 0; padding: 0; list-style: none; }
.resume li + li { margin-top: 0.3rem; }

@media (max-width: 720px) {
  .resume-head { display: block; }
  .resume-head .resume-pdf { display: inline-block; margin-top: 1rem; }
  .resume .row, .resume-foot { display: block; }
  .resume .row + .row { margin-top: 1.6rem; }
  .resume .row.cont { margin-top: 0.6rem; }
  .resume .dates { text-align: left; }
  .resume .desc li { padding-left: 1.15em; }
  .resume .desc li::before { left: 0; }
  .resume-foot > div + div h2 { padding-top: 2.6rem; }
}

/* ---- Print / Save as PDF: one US Letter page, no sidebar ---------------- */
.print-only { display: none; }

@media print {
  @page { size: letter; margin: 0.5in 0.6in; }

  :root, :root[data-theme="dark"] {
    --bg: #fff;
    --text: #1a1a1a;
    --text-secondary: #333;
    --text-muted: #777;
    --rule: #ccc;
    color-scheme: light;
  }
  .resume, :root[data-theme="dark"] .resume { --resume-meta: #777; }
  html { font-size: 11.2px !important; }
  body { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

  .sidebar, .screen-only { display: none !important; }
  .print-only { display: block; }
  span.print-only { display: inline; }
  .page { margin: 0; padding: 0; }
  .resume > hr:first-child { display: none; }

  .resume-head { padding: 0 0 calc(2.6 * var(--line-height) * 1em); }
  .resume-head address { font-style: normal; text-align: right; color: var(--text-secondary); }
  .resume section + section { margin-top: calc(2.6 * var(--line-height) * 1em); }
  .resume h2 { padding-bottom: 2rem; }
  .resume .row.detail + .row { margin-top: 2.6rem; }
  .resume .row + .row { margin-top: 1.5rem; }
  .resume .row.cont { margin-top: 0.4rem; }
  .resume .desc { margin-top: 0.9rem; line-height: 1.5; }
  .resume .desc li + li { margin-top: 0.9rem; }
  .resume-foot li + li { margin-top: 0.15rem; }
  .resume-foot h2 { padding-bottom: 1.2rem; }
  .resume-foot li { break-inside: avoid; }
  .resume .row { break-inside: avoid; }

  /* Two columns on paper: experience and education on the left; skills,
     tools and languages stacked in a narrow column on the right. */
  .resume { display: grid; grid-template-columns: minmax(0, 1fr) 11.5rem; column-gap: 3rem; align-items: start; }
  .resume > .resume-head { grid-column: 1 / -1; }
  .resume > section { grid-column: 1; }
  .resume > .resume-foot { grid-column: 2; grid-row: 2 / span 2; display: block; margin-top: 0; }
  /* Name column is only as wide as a company name; the long school name wraps
     onto a second line. Descriptions run the full width under role + dates. */
  .resume .row { grid-template-columns: 10.5rem minmax(0, 1fr) max-content; column-gap: 1.6rem; }
  .resume .dates { white-space: nowrap; }
  .resume .row.detail > .what { display: contents; }
  .resume .row.detail > .what > .meta { grid-column: 2; grid-row: 1; }
  .resume .row.detail > .dates { grid-column: 3; grid-row: 1; }
  .resume .row.detail > .what > .desc { grid-column: 2 / -1; grid-row: 2; max-width: none; }
  .resume-foot > div + div { margin-top: calc(2 * var(--line-height) * 1em); }
  .resume-foot > div + div h2 { padding-top: 0; }
}
