/* profil.html — CV layout on top of site.css, plus a print stylesheet */

.cv-head { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; }
@media (max-width: 720px) { .cv-head { grid-template-columns: minmax(0, 1fr); } }
.cv-photo { width: clamp(7rem, 14vw, 10rem); aspect-ratio: 1; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 1px var(--hair-strong), 0 0 0 8px rgb(34 224 107 / .08); }
.cv-photo img { width: 100%; height: 100%; object-fit: cover; display: block; filter: grayscale(1) contrast(1.08); }
.cv-head h1 { font-size: clamp(2.3rem, 1.4rem + 4vw, 4.4rem); line-height: 1; letter-spacing: -.045em; margin: var(--s4) 0 var(--s3); }
.cv-head .role { font-size: var(--t-lg); color: var(--fg-soft); font-weight: 300; }
.cv-contacts { display: flex; flex-wrap: wrap; gap: var(--s3) var(--s5); margin-top: var(--s5); font-size: var(--t-sm); }
.cv-profile { margin-top: clamp(2rem, 4vw, 3rem); padding-top: var(--s5); border-top: 1px solid var(--hair); color: #BFC5C0; max-width: 70ch; font-weight: 300; font-size: var(--t-lg); line-height: 1.55; }
.cv-profile b { color: var(--fg); font-weight: 500; }

.job { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: var(--s3) var(--s6); padding-block: clamp(1.75rem, 3vw, 2.5rem); border-top: 1px solid var(--hair); }
.job:first-of-type { border-top: 0; padding-top: 0; }
@media (max-width: 720px) { .job { grid-template-columns: minmax(0, 1fr); } }
.job .y { font: 500 .85rem var(--mono); color: var(--mut); padding-top: .35rem; font-variant-numeric: tabular-nums; }
.job.now .y { color: var(--green); }
.job h3 { font-size: var(--t-xl); }
.job .where { color: var(--mut); font-size: var(--t-sm); margin-top: .3rem; }
.job .goal { margin-top: var(--s4); color: var(--fg-soft); max-width: 72ch; }
.job .cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s5) var(--s7); margin-top: var(--s5); }
@media (max-width: 900px) { .job .cols { grid-template-columns: minmax(0, 1fr); } }
.job h4 { font: 500 .72rem var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--green); margin: 0 0 var(--s3); }
.job ul { margin: 0; padding-left: 1.1rem; display: grid; gap: .45rem; color: #BFC5C0; font-size: var(--t-sm); }
.job ul li::marker { color: var(--green); }
.job .tags { margin-top: var(--s5); }

.cv-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s4); }
@media (max-width: 820px) { .cv-grid { grid-template-columns: minmax(0, 1fr); } }
.box { background: var(--card); border-radius: var(--r-md); box-shadow: 0 0 0 1px var(--hair); padding: clamp(1.25rem, 2.5vw, 2rem); display: grid; gap: var(--s3); align-content: start; min-width: 0; }
.box h3 { font-size: var(--t-lg); }
.box p, .box li { color: #BFC5C0; font-size: var(--t-sm); }
.box ul { margin: 0; padding-left: 1.1rem; display: grid; gap: .45rem; }
.box ul li::marker { color: var(--green); }
.box .tags { margin-top: var(--s2); }
.box a.link { justify-self: start; font-size: var(--t-sm); }

.dl { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: .55rem var(--s4); margin: 0; font-size: var(--t-sm); }
.dl dt { font: 500 .82rem var(--mono); color: var(--mut); font-variant-numeric: tabular-nums; }
.dl dd { margin: 0; color: #BFC5C0; }
.dl dd b { color: var(--fg); font-weight: 500; }

.mini { list-style: none; margin: var(--s5) 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem var(--s6); }
@media (max-width: 720px) { .mini { grid-template-columns: minmax(0, 1fr); } }
.mini li { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); gap: var(--s3); font-size: var(--t-sm); color: #BFC5C0; }
.mini li span:first-child { font: 500 .82rem var(--mono); color: var(--mut); }

.svc .plist { margin: 0; padding-left: 1.1rem; display: grid; gap: .45rem; color: var(--paper-mut); font-size: var(--t-sm); }
.svc .plist li::marker { color: var(--green-deep); }
.svc.wide { grid-column: 1 / -1; min-height: 0; }

/* ---- OpenWebUI scale for the CV (screen only, print below is unchanged) ---- */
@media screen {
  .cv-head { gap: 32px; }
  .cv-photo { width: 96px; }
  .cv-head h1 { font-size: var(--t-3xl); line-height: 1.15; margin: 16px 0 12px; }
  .cv-head .role { font-size: var(--t-base); }
  .cv-contacts { gap: 8px 24px; margin-top: 24px; font-size: var(--t-sm); }
  .cv-profile { margin-top: 40px; padding-top: 24px; font-size: var(--t-base); line-height: 1.625; max-width: 42rem; }
  .job { padding-block: 32px; gap: 12px 32px; }
  .job .y { font-size: 13px; }
  .job h3 { font-size: var(--t-lg); line-height: 1.375; }
  .job .where { font-size: var(--t-sm); margin-top: 4px; }
  .job .goal { margin-top: 16px; font-size: var(--t-base); max-width: 42rem; }
  .job .cols { gap: 24px 48px; margin-top: 24px; }
  .job h4 { font-size: var(--fs-eye); letter-spacing: .18em; margin-bottom: 12px; }
  .job ul { gap: 8px; font-size: var(--t-sm); }
  .job .tags { margin-top: 24px; }
  .cv-grid { gap: var(--g-cards); }
  .box { padding: 24px; gap: 12px; }
  .svc { padding: 24px; gap: 20px; min-height: 0; }
  .box h3, .svc h3 { font-size: var(--t-lg); line-height: 1.375; }
  .box p, .box li, .svc p, .svc .plist, .dl, .mini li { font-size: var(--t-sm); }
  .mini { margin-top: 24px; gap: 8px 32px; }
}
@media screen and (min-width: 1024px) {
  .cv-photo { width: 128px; }
  .job { padding-block: 40px; }
  .job:first-of-type { padding-top: 0; }
  .box, .svc { padding: 32px; }
}

/* ---- print: white paper, no chrome, no motion ---- */
@media print {
  @page { margin: 18mm 16mm; }
  /* site.css sets color-scheme: dark on :root; Chrome then paints the page margins dark */
  :root { color-scheme: light; }
  html, body { background: #fff !important; color: #111 !important; font-size: 10.5pt; }
  #net, .veil, .pill, .bar .links, .skip, .no-print, footer nav { display: none !important; }
  .bar { padding: 0 0 6mm; }
  .plane, .plane.paper { background: none !important; box-shadow: none !important; padding: 0 !important; width: 100% !important; -webkit-backdrop-filter: none; backdrop-filter: none; margin-top: 8mm !important; }
  *, *::before, *::after { animation: none !important; transition: none !important; color: inherit; }
  .label, .job h4, .g, .job.now .y { color: #0B6B35 !important; }
  .label::before { box-shadow: none; background: #0B6B35; }
  .sec-h h2 { font-size: 18pt; }
  .cv-head h1 { font-size: 26pt; }
  .cv-profile, .cv-head .role, .job .goal, .job ul, .box p, .box li, .dl dd, .mini li, .job .where, .dl dt, .job .y, .mini li span:first-child { color: #222 !important; }
  .box { background: none; box-shadow: none; border: 1px solid #ddd; break-inside: avoid; }
  .job { break-inside: avoid; border-color: #ddd; }
  .tags span { border-color: #ccc; color: #333; }
  .link { color: #0B6B35; border: 0; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 8pt; color: #555; }
  .cv-contacts a::after { content: ""; }
  footer { border-color: #ddd; color: #555; padding-block: 4mm 0; }
}