/* The CV on paper (docs/cv-spec.md §3–4). Loaded with media="print"; /cv/?print switches it to media="all" so the
   screen shows exactly what Cmd+P and the PDF script render. `html:root` outranks the site's own :root tokens. */
@page { size: A4; margin: 14mm 16mm; }

/* Print-only Archivo (scripts/cv-fonts.py): the same font with latin and latin-ext in one static file per weight, so
   the PDF embeds one TrueType font per weight and text extractors read "Boğaziçi" as one word. */
@font-face { font-family: 'Archivo CV'; font-weight: 300; src: url(cv-fonts/archivo-cv-300.woff2) format('woff2'); }
@font-face { font-family: 'Archivo CV'; font-weight: 340; src: url(cv-fonts/archivo-cv-340.woff2) format('woff2'); }
@font-face { font-family: 'Archivo CV'; font-weight: 400; src: url(cv-fonts/archivo-cv-400.woff2) format('woff2'); }
@font-face { font-family: 'Archivo CV'; font-weight: 560; src: url(cv-fonts/archivo-cv-560.woff2) format('woff2'); }

html:root {
  --page: #fff; --paper: #fff; --ink: #000; --ink-2: #333; --ink-3: #555;
  --rule: rgb(0 0 0 / 0.16); --rule-2: rgb(0 0 0 / 0.55); --link: #000;
  --font: 'Archivo CV', system-ui, sans-serif;
  --cv-text: 16px; /* 12pt (2026-11-07, after the content pass; 11pt while the products were still in print) */
  color-scheme: light;
  background: #fff;
}
html:root body { background: #fff; color: #000; min-height: 0; display: block; }
/* !important: the page's scoped styles would otherwise outrank these. */
html:root .site-header, html:root .site-footer, html:root .top-sentinel, html:root .skip { display: none !important; }
html:root .web-only, html:root .cv .get { display: none !important; }
html:root .cv .print-only { display: block !important; }

/* One column on paper: section headings above their entries, the full measure for text. */
html:root body:not(.home) main.cv { max-width: none; margin: 0; padding: 0; }
html:root .cv { --rail: 1 / -1; --col: 1 / -1; }
html:root .cv-head { order: -2; display: block; margin: 0 0 10px; }
html:root .cv .page-title { font-size: 34px; letter-spacing: -0.035em; white-space: nowrap; word-spacing: 0.12em; }
/* Name only on paper (Arda, 2026-11-07): the headline stays on the web page. */
html:root .cv .who .lede { display: none; }

/* The contact line sits under the name: location, then each link as an icon and its handle. */
html:root .cv .contact { order: -1; display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 4px 18px; margin: 0 0 14px; padding: 0; border: 0; font-size: 13px; line-height: 1.5; color: #333; }
html:root .cv .contact a { min-height: 0; color: #000; text-decoration: none; gap: 6px; }
html:root .cv .contact .label { display: none; }
html:root .cv .contact .handle { display: inline; }
html:root .cv .contact svg { display: inline-block; width: 12px; height: 12px; }
html:root .cv .contact .mark { display: inline; font-weight: 560; letter-spacing: -0.02em; }
html:root .cv .contact .mark .dot { color: #de6830; }

html:root .cv .sec { display: block; padding: 6px 0 8px; border-top-color: rgb(0 0 0 / 0.55); }
html:root .cv .sec h2 { margin: 0 0 4px; font-size: 13px; font-weight: 560; letter-spacing: 0.02em; break-after: avoid; }
html:root .cv .summary p { max-width: none; font-size: var(--cv-text); line-height: 1.42; font-weight: 400; letter-spacing: 0; }
html:root .cv .summary p + p { margin-top: 4px; }

/* Long entries may split, but never right after their title block, and a bullet never splits. */
html:root .cv .entry { break-inside: auto; }
/* Education entries are short: never split a degree from its grade and thesis. */
html:root .cv .entry:has(.fact) { break-inside: avoid; }
/* Page 2 opens with Education (Arda, 2026-11-07): page 1 is Summary and Experience. */
html:root .cv .sec:has(#education) { break-before: page; }
html:root .cv .head, html:root .cv .sub { break-after: avoid; }
html:root .cv .bullets li, html:root .cv .one, html:root .cv .stack, html:root .cv .skills > div { break-inside: avoid; }
html:root .cv .entry + .entry { margin-top: 7px; padding-top: 7px; }
html:root .cv .head { flex-direction: row; gap: 2px 16px; }
html:root .cv .head h3 { font-size: 15.5px; font-weight: 560; letter-spacing: -0.01em; break-after: avoid; }
html:root .cv .when { font-size: 12px; color: #444; }
html:root .cv .sub { margin-top: 1px; font-size: 13px; color: #333; }
html:root .cv .sub a { min-height: 0; color: #333; text-decoration: none; }
html:root .cv .one, html:root .cv .fact, html:root .cv .bullets, html:root .cv .skills dd,
html:root .cv .plain, html:root .cv .langs { max-width: none; font-size: var(--cv-text); line-height: 1.42; }
html:root .cv .one { margin-top: 3px; }
html:root .cv .bullets { margin-top: 3px; }
/* In-flow markers: a positioned marker would make Chromium paint (and the PDF text layer list) the bullets after
   everything else in the entry. */
html:root .cv .bullets li { position: static; padding-left: 16px; }
html:root .cv .bullets li::before { position: static; display: inline-block; vertical-align: 0.3em; width: 7px; margin: 0 9px 0 -16px; background: #555; }
html:root .cv .bullets li + li { margin-top: 1px; }
html:root .cv .stack { margin-top: 3px; font-size: 13px; color: #333; }
html:root .cv .fact { margin-top: 2px; }
html:root .cv .fact + .fact { margin-top: 0; }
html:root .cv .skills > div { grid-template-columns: 11rem 1fr; gap: 0 16px; padding: 1px 0; border-top: 0; }
html:root .cv .skills dt { font-size: 13px; padding-top: 0.25em; }
html:root .cv .plain li + li { margin-top: 0; }
html:root .cv .award-title { font-size: 15.5px; font-weight: 560; letter-spacing: -0.01em; break-after: avoid; }
/* A little extra word space, so text extractors (ATS parsers) see the gap after capitals. */
html:root body { word-spacing: 0.04em; }

/* On screen (?print): one A4 sheet's width on white, so the layout can be checked in a browser. */
@media screen {
  html:root body { width: 210mm; margin: 0 auto; padding: 14mm 16mm; }
}