/* ============================================================
   CV system — A4, print-owned by <doc-page>.
   Tokens mirror index.html / Portfolio.html so all three
   documents read as one system.
   ============================================================ */

:root{
  --paper:#f4f1ea; --card:#e8e4d8; --card-2:#ddd8c8;
  --ink:#161616; --body-ink:#333; --muted:#666;
  --line:#d9d3c2; --line-2:#c9c2ae;
  --signal:#e2001a; --signal-ink:#b80014;
  --gutter:34px; --col-label:126px;
  /* type ramp — six steps, no in-between sizes */
  --t-micro:10px; --t-small:10.8px; --t-body:11.5px; --t-lead:14px;
  --t-h3:15.5px; --t-h2:30px; --t-h1:54px;
  /* spacing — 6px base */
  --s1:4px; --s2:8px; --s3:12px; --s4:18px; --s5:26px; --s6:38px;
  --font:'Space Grotesk', system-ui, sans-serif;
  --mono:'JetBrains Mono', ui-monospace, monospace;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--font);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
doc-page:not(:defined){visibility:hidden}
a{color:var(--signal);text-decoration:none}
a:hover{color:var(--signal-ink);text-decoration:underline}

/* ---------- page ---------- */
.page{background:var(--paper);padding:var(--s6) 50px var(--s5);display:flex;flex-direction:column}

/* ---------- type scale ---------- */
.eyebrow{font-family:var(--mono);font-size:var(--t-micro);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--signal)}
.label{font-family:var(--mono);font-size:var(--t-micro);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.h1{font-size:var(--t-h1);font-weight:700;letter-spacing:-.03em;line-height:.92;margin:0;text-transform:uppercase;white-space:nowrap}
.h2{font-size:var(--t-h2);font-weight:700;letter-spacing:-.025em;line-height:1;margin:0;text-transform:uppercase}
.h3{font-size:var(--t-h3);font-weight:700;letter-spacing:-.01em;line-height:1.15;margin:0}
.body{font-size:var(--t-body);line-height:1.6;color:var(--body-ink);text-wrap:pretty}
.lede{font-size:var(--t-lead);line-height:1.65;color:var(--body-ink);text-wrap:pretty;margin:var(--s4) 0 0}
.metricN{font-size:var(--t-h2);font-weight:700;letter-spacing:-.03em;line-height:1}

/* ---------- document header ---------- */
.doc-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:24px;padding-bottom:var(--s2);border-bottom:2px solid var(--ink)}
.doc-head .sub{font-size:var(--t-lead);color:var(--body-ink);margin-top:8px}
.doc-head .meta{font-family:var(--mono);font-size:var(--t-small);line-height:1.7;color:var(--muted);text-align:right}
.doc-head .meta .strong{color:var(--ink);font-weight:600}

/* ---------- chips ---------- */
.chips{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;margin-top:var(--s2)}
.chip{font-size:var(--t-micro);font-weight:600;color:var(--ink);border:1px solid var(--line-2);padding:3px 9px}
.chip b{font-weight:700}

/* ---------- metric strip ---------- */
.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);margin-top:var(--s4)}
.metric{background:var(--paper);padding:var(--s3) var(--s4)}
.metric .metricN{color:var(--ink)}
.metric.sig .metricN{color:var(--signal)}
.metric .cap{font-family:var(--mono);font-size:var(--t-micro);color:var(--muted);margin-top:var(--s1);line-height:1.3;text-transform:uppercase;letter-spacing:.04em}

/* ---------- section headers ---------- */
.col-h{display:block;border-top:1px solid var(--ink);padding-top:6px;margin-bottom:var(--s2)}

/* ---------- tick lists ---------- */
.tick-list{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;list-style:none}
.tick-list>li{font-size:var(--t-body);line-height:1.6;color:var(--body-ink);padding-left:16px;position:relative;text-wrap:pretty}
.tick-list>li::before{content:"";position:absolute;left:0;top:9px;width:8px;height:1px;background:var(--line-2)}

/* ---------- selected delivery ---------- */
.stack{display:flex;flex-direction:column}
.stack-row{display:grid;grid-template-columns:var(--col-label) 1fr;gap:var(--s3);align-items:baseline;padding:var(--s3) 0;border-top:1px solid var(--line)}
.stack-row:first-child{border-top:1px solid var(--ink)}
.stack-row b{font-weight:700;color:var(--ink);font-size:var(--t-body)}
.stack-row span{color:var(--body-ink);font-size:var(--t-body);line-height:1.55;text-wrap:pretty}

/* ---------- experience ---------- */
.xp{display:grid;grid-template-columns:104px 1fr;gap:var(--gutter);padding:18px 0;border-top:1px solid var(--line)}
.xp:first-of-type{border-top:1px solid var(--ink)}
.xp .when{font-family:var(--mono);font-size:var(--t-small);color:var(--muted);line-height:1.5}
.xp .role{font-size:var(--t-h3);font-weight:700;letter-spacing:-.01em}
.xp .org{font-size:var(--t-body);color:var(--body-ink);font-weight:600;margin-top:2px}
.prog-line{font-size:var(--t-body);color:var(--muted);margin-top:8px;line-height:1.5}
.prog-line .yr{font-family:var(--mono);color:var(--ink);font-weight:500}

.xp-groups{display:grid;grid-template-columns:1fr 1fr;gap:14px var(--gutter);margin-top:16px}
.xp-group--wide{grid-column:1/-1}
.xp-group-h{display:flex;align-items:baseline;gap:var(--s2);padding-bottom:2px}
.xp-group-n{font-family:var(--mono);font-size:var(--t-micro);font-weight:700;color:var(--signal);font-variant-numeric:tabular-nums}
.xp-group-t{font-size:var(--t-body);font-weight:700;letter-spacing:-.01em;color:var(--ink)}
.xp-group .body{font-size:var(--t-body);line-height:1.55}

/* earlier roles — compressed by recency */
.xp--prior .role{font-size:var(--t-lead);font-weight:700;letter-spacing:-.01em}
.xp--prior .org{font-size:var(--t-body);color:var(--muted);font-weight:500}
.xp--prior .body{font-size:var(--t-body);line-height:1.55;margin-top:5px}
.xp--prior{padding:14px 0}

/* ---------- education ---------- */
.edu{display:grid;grid-template-columns:1fr 1fr;gap:0 var(--gutter)}
.edu-row{padding:var(--s2) 0;border-top:1px solid var(--line)}
.edu .edu-row:nth-child(-n+2){border-top:1px solid var(--ink)}
.edu-row .deg{font-size:var(--t-body);font-weight:700}
.edu-row .inst{font-size:var(--t-body);color:var(--body-ink);margin-top:2px}
.edu-row .yr{font-family:var(--mono);font-size:var(--t-small);color:var(--muted);margin-top:2px}

.two-col{display:grid;grid-template-columns:1fr 1fr;gap:var(--gutter);margin-top:var(--s5)}

/* ---------- footer ---------- */
.foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:var(--t-micro);color:var(--muted);border-top:2px solid var(--ink);padding-top:6px}
.foot b{color:var(--ink);font-weight:700;letter-spacing:.02em}

/* page 2 runs lighter than page 1 — open the rhythm so the sheet fills evenly */
.page--2 .stack-row{padding:22px 0}
.page--2 .edu-row{padding:12px 0}
.page--2 .two-col{margin-top:34px}