/* ===== Reset / page ===== */
* { box-sizing: border-box; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
body { margin: 0; }
:root { --acc: #10b981; }
image-slot { display: block; }

#screen-pad {
  background: #e6e9e7;
  min-height: 100vh;
  padding: 40px 20px;
  display: flex;
  justify-content: center;
  font-family: 'IBM Plex Sans', sans-serif;
}
#cv-page {
  width: 794px;
  background: #fbfcfb;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 30px 60px -28px rgba(8, 30, 22, .4);
  border: 1px solid #e2e6e3;
}

@page { size: A4; margin: 0; }
@media print {
  body { background: #fff !important; }
  #screen-pad { padding: 0 !important; background: #fff !important; }
  #cv-page { box-shadow: none !important; border: none !important; border-radius: 0 !important; }
}

/* ===== Utilities ===== */
.accent { color: var(--acc); }
code { font-family: 'JetBrains Mono', monospace; }

/* ===== Header ===== */
.header {
  background: #0b1310;
  color: #e7f3ee;
  padding: 24px 36px;
  display: flex;
  align-items: center;
  gap: 24px;
}
.header__main { flex: 1; min-width: 0; }
.prompt {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: var(--acc);
  margin-bottom: 7px;
}
.name {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: 34px;
  line-height: 1;
  margin: 0 0 6px;
  letter-spacing: -.6px;
}
.role {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 500;
  font-size: 16px;
  color: var(--acc);
  margin-bottom: 12px;
}
.contacts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: #9fb6ab;
}
.contacts a, .contacts__email { color: #ffffff; text-decoration: underline; }
.photo-frame {
  flex: none;
  padding: 3px;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--acc), color-mix(in srgb, var(--acc), white 35%));
}
.photo {
  width: 104px;
  height: 124px;
  border: 2px solid #0b1310;
  border-radius: 11px;
}

/* ===== Body layout ===== */
.body {
  display: grid;
  grid-template-columns: 1.62fr 1fr;
  gap: 28px;
  padding: 24px 36px 24px;
}
.col { min-width: 0; }
.summary {
  font-size: 12.5px;
  line-height: 1.55;
  color: #3a463f;
  margin: 0 0 16px;
}

/* ===== Section title ===== */
.section {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10.5px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--acc);
  border-bottom: 1.5px solid color-mix(in srgb, var(--acc), transparent 70%);
  padding-bottom: 5px;
  margin-bottom: 11px;
  display: flex;
  align-items: center;
  gap: 7px;
}
.section--lg { margin-bottom: 13px; }
.section svg { flex: none; }

/* ===== Experience ===== */
.exp { margin-bottom: 14px; break-inside: avoid; }
.exp:last-child { margin-bottom: 0; }
.exp__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
}
.exp__role {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 600;
  font-size: 14px;
  color: #0b1310;
}
.exp__date {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10.5px;
  color: #6b776f;
  white-space: nowrap;
}
.exp__company {
  font-size: 12px;
  font-weight: 600;
  color: var(--acc);
  margin-bottom: 6px;
}
.exp__list { display: flex; flex-direction: column; gap: 5px; }
.bullet {
  display: flex;
  gap: 7px;
  font-size: 11.5px;
  line-height: 1.45;
  color: #3a463f;
}

/* ===== Tags ===== */
.tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 7px; }
.tag {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9.5px;
  padding: 2px 6px;
  border-radius: 4px;
  background: #eef6f1;
  color: #0a6b4e;
}

/* ===== Right column ===== */
.skills { display: flex; flex-direction: column; gap: 9px; margin-bottom: 18px; }
.skill__label {
  font-size: 10.5px;
  color: #7d978c;
  font-weight: 600;
  margin-bottom: 3px;
}
.skill__value { font-size: 11.5px; color: #3a463f; line-height: 1.45; }
.prose { font-size: 11.5px; color: #3a463f; line-height: 1.5; margin-bottom: 18px; }
.edu-list { display: flex; flex-direction: column; gap: 6px; margin-bottom: 18px; }
.edu-item { font-size: 11.5px; color: #3a463f; }
.edu-year { font-family: 'JetBrains Mono', monospace; color: var(--acc); margin-right: 8px; }
.perso { font-size: 11.5px; color: #3a463f; line-height: 1.5; }
.perso + .perso { margin-top: 5px; }
.perso strong { color: #0b1310; }