/*
 * CVee CV templates
 * Loaded by both the editor and the PDF renderer. Sizes are in mm / pt so
 * one A4 page in the preview is exactly one A4 page in the PDF.
 */

@page { size: A4; margin: 0; }

/* ===================== Base ===================== */
.cv-doc {
  --accent: #8f33e8;
  --accent-deep: #61239e;
  --accent-soft: #e9d6fa;
  --accent-tint: #f6effd;
  --accent-dark: #8f33e8;
  --accent-muted: #86607b;
  --ink: #1f1b24;
  --muted: #625b69;
  --line: #e3dfe8;
  --font: "Inter", Helvetica, Arial, sans-serif;
  --fs: 1;
  --lh: 1;
  --sp: 1;
  --align: left;
  box-sizing: border-box;
  width: 210mm;
}

/* Sample text in the editor preview ("Show sample"); the PDF never contains it. */
.cv-ghost { opacity: 0.35; }

/* Everything the CV needs is set here, so the editor's own styles can never change it.
   Smart fit shrinks vertical spacing through --sp; --spp is a gentler version of it
   for page margins and photos. */
.cv-page {
  --lhn: calc(1.42 * var(--lh));
  --spp: calc(0.5 + var(--sp) * 0.5);
  box-sizing: border-box;
  position: relative;
  width: 210mm;
  height: 297mm;
  overflow: hidden;
  background: #fff;
  color: var(--ink);
  font-family: var(--font);
  font-size: calc(9.4pt * var(--fs));
  line-height: var(--lhn);
  font-kerning: normal;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
  break-after: page;
  page-break-after: always;
}
.cv-page:last-child { break-after: auto; page-break-after: auto; }
.cv-page *, .cv-page *::before, .cv-page *::after { box-sizing: border-box; }
.cv-page h1 { margin: 0; font: inherit; }
.cv-page a { color: inherit; text-decoration: none; }
.cv-page img { display: block; width: 100%; height: 100%; object-fit: cover; }

.cv-region { position: relative; overflow: hidden; min-height: 0; min-width: 0; }
.cv-region > :first-child { margin-top: 0 !important; }

.cv-p, .cv-li { text-align: var(--align); overflow-wrap: break-word; }
.cv-p { margin-top: calc(1.2mm * var(--sp)); }
.cv-li { position: relative; margin-top: calc(0.8mm * var(--sp)); padding-left: 3.8mm; }
.cv-li::before {
  content: "";
  position: absolute;
  left: 0.7mm;
  top: calc(var(--lhn) * 0.5em - 0.55mm);
  width: 1.1mm;
  height: 1.1mm;
  border-radius: 50%;
  background: var(--accent);
}

.cv-ic {
  width: 1em;
  height: 1em;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* ===================== Signature ===================== */
.tpl-signature .cv-page { display: flex; }

.sg-side {
  width: 67mm;
  flex: none;
  background: var(--accent-tint);
  padding: calc(13mm * var(--spp)) 7mm calc(12mm * var(--spp)) 9mm;
}
.sg-main {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: calc(15mm * var(--spp)) 13mm calc(12mm * var(--spp)) 10mm;
}
.sg-flow { flex: 1 1 0; }

/* Thin lines are drawn as backgrounds/shadows, never borders: Chrome rounds border
   widths to device pixels, which would make layout depend on the screen's zoom. */
.sg-head {
  position: relative;
  padding-bottom: calc(5.5mm * var(--sp));
  margin-bottom: calc(4.5mm * var(--sp));
  background: linear-gradient(var(--line), var(--line)) left bottom / 100% 0.3mm no-repeat;
}
.sg-head::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -0.6mm;
  width: 16mm;
  height: 0.9mm;
  border-radius: 1mm;
  background: var(--accent);
}
.sg-name {
  font-size: calc(25pt * var(--fs)) !important;
  line-height: 1.08 !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.sg-name span { color: var(--accent); }

.sg-h {
  display: flex;
  align-items: center;
  gap: 2.4mm;
  margin: calc(6.5mm * var(--sp)) 0 calc(2.4mm * var(--sp));
  font-size: calc(10.5pt * var(--fs));
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink);
}
.sg-h::before {
  content: "";
  flex: none;
  width: 3.4mm;
  height: 3.4mm;
  border-radius: 1mm;
  background: var(--accent);
}
.sg-h--side {
  margin-top: calc(7mm * var(--sp));
  font-size: calc(9pt * var(--fs));
  color: var(--accent-deep);
}
.sg-h--side::before { width: 2.2mm; height: 2.2mm; border-radius: 50%; }

.sg-entry { margin-top: calc(3.6mm * var(--sp)); }
.sg-entry-top { display: flex; align-items: baseline; justify-content: space-between; gap: 3mm; }
.sg-role { font-weight: 700; font-size: calc(10pt * var(--fs)); line-height: 1.3; }
.sg-date {
  flex: none;
  white-space: nowrap;
  font-size: calc(8.4pt * var(--fs));
  font-weight: 500;
  color: var(--muted);
}
.sg-org {
  margin-top: 0.3mm;
  font-size: calc(9pt * var(--fs));
  line-height: 1.35;
  font-weight: 600;
  color: var(--accent-deep);
}
/* Entries moved into the narrow sidebar: the date goes under the title. */
.sg-side .sg-entry-top { display: block; }
.sg-side .sg-role { font-size: calc(9.2pt * var(--fs)); }
.sg-side .sg-date { margin-top: 0.3mm; white-space: normal; }
.sg-side .cv-p, .sg-side .cv-li { font-size: calc(8.6pt * var(--fs)); }
/* Skills and languages moved into the wide main column: kept to sidebar-like width. */
.sg-flow .sg-skill, .sg-flow .sg-lang { max-width: 95mm; }

.sg-photo {
  width: calc(44mm * var(--spp));
  height: calc(44mm * var(--spp));
  margin: 0 auto 1mm;
  border-radius: 50%;
  overflow: hidden;
  border: 1.4mm solid #fff;
  box-shadow: 0 0 0 0.5mm var(--accent);
  background: var(--accent-soft);
}
.sg-photo--initials { display: flex; align-items: center; justify-content: center; background: var(--accent); }
.sg-photo--initials span { color: #fff; font-size: 26pt; font-weight: 700; letter-spacing: 0.04em; line-height: 1; }

.sg-contact {
  display: flex;
  align-items: flex-start;
  gap: 2.2mm;
  margin-top: calc(1.7mm * var(--sp));
  font-size: calc(8.6pt * var(--fs));
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.sg-contact .cv-ic { width: 3.5mm; height: 3.5mm; margin-top: 0.3mm; color: var(--accent); }

.sg-skill { margin-top: calc(2mm * var(--sp)); font-size: calc(8.8pt * var(--fs)); line-height: 1.3; }
.sg-skill-name { font-weight: 500; }
.sg-bar { margin-top: 1mm; height: 1.3mm; border-radius: 1mm; background: var(--accent-soft); overflow: hidden; }
.sg-bar i { display: block; height: 100%; border-radius: 1mm; background: var(--accent); }

.sg-chips { display: flex; flex-wrap: wrap; gap: calc(1.5mm * var(--spp)) 1.5mm; margin-top: calc(1mm * var(--sp)); }
.sg-chips span {
  padding: 0.8mm 2.4mm;
  border-radius: 3mm;
  background: #fff;
  box-shadow: inset 0 0 0 0.25mm var(--accent-soft);
  color: var(--accent-deep);
  font-size: calc(8.2pt * var(--fs));
  line-height: 1.3;
  font-weight: 500;
}

.sg-lang { display: flex; justify-content: space-between; gap: 2mm; margin-top: calc(1.6mm * var(--sp)); font-size: calc(8.8pt * var(--fs)); line-height: 1.3; }
.sg-lang b { font-weight: 600; }
.sg-lang span { color: var(--muted); text-align: right; }

/* ===================== Classic ===================== */
.tpl-classic .cv-page { display: flex; flex-direction: column; padding: calc(15mm * var(--spp)) 16mm calc(13mm * var(--spp)); }
.cl-flow { flex: 1 1 0; }

.cl-head { position: relative; text-align: center; padding-bottom: calc(2mm * var(--sp)); }
.cl-head.has-photo { min-height: calc(30mm * var(--spp)); padding-left: 34mm; padding-right: 34mm; }
.cl-photo { position: absolute; right: 0; top: 0; width: calc(30mm * var(--spp)); height: calc(30mm * var(--spp)); border-radius: 50%; overflow: hidden; }
.cl-name {
  font-size: calc(22pt * var(--fs)) !important;
  line-height: 1.12 !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--accent);
}
.cl-contacts {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1mm 4.5mm;
  margin-top: calc(2.6mm * var(--spp));
  font-size: calc(8.6pt * var(--fs));
  line-height: 1.35;
  color: var(--muted);
}
.cl-contacts > span { display: inline-flex; align-items: center; gap: 1.4mm; }
.cl-contacts .cv-ic { color: var(--accent); width: 3.2mm; height: 3.2mm; }

.cl-h {
  display: flex;
  align-items: center;
  gap: 4mm;
  margin: calc(6mm * var(--sp)) 0 calc(2.4mm * var(--sp));
  font-size: calc(10.5pt * var(--fs));
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent);
}
.cl-h::after { content: ""; flex: 1; height: 0.35mm; background: var(--accent); opacity: 0.75; }

.cl-ind { margin-left: 38mm; }
.cl-entry { display: grid; grid-template-columns: 34mm 1fr; column-gap: 4mm; margin-top: calc(3.4mm * var(--sp)); }
.cl-date { padding-top: 0.2mm; font-size: calc(8.8pt * var(--fs)); line-height: 1.35; color: var(--muted); }
.cl-role { font-size: calc(9.6pt * var(--fs)); line-height: 1.3; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; }
.cl-org { margin-top: 0.3mm; font-weight: 600; line-height: 1.35; }

.cl-skills { display: grid; grid-template-columns: 1fr 1fr; gap: calc(2.6mm * var(--sp)) 7mm; margin-top: calc(2.6mm * var(--sp)); }
.cl-skill-name { font-size: calc(9pt * var(--fs)); line-height: 1.3; }
.cl-seg { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1mm; margin-top: 1.2mm; }
.cl-seg i { height: 1.5mm; background: var(--line); }
.cl-seg i.on { background: var(--accent); }

.cl-tags { display: flex; flex-wrap: wrap; gap: calc(1mm * var(--sp)) 5mm; margin-top: calc(2.2mm * var(--sp)); }
.cl-tags span { display: inline-flex; align-items: center; gap: 1.8mm; }
.cl-tags span::before { content: ""; flex: none; width: 1.1mm; height: 1.1mm; border-radius: 50%; background: var(--accent); }

.cl-langs { display: grid; grid-template-columns: 1fr 1fr; gap: calc(1.4mm * var(--sp)) 7mm; margin-top: calc(2.2mm * var(--sp)); }
.cl-langs > div { display: flex; justify-content: space-between; gap: 2mm; }
.cl-langs b { font-weight: 600; }
.cl-langs span { color: var(--muted); text-align: right; }

/* ===================== Soft ===================== */
.tpl-soft .cv-page { display: flex; flex-direction: column; }

.sf-head {
  position: relative;
  display: flex;
  align-items: center;
  min-height: calc(46mm * var(--spp));
  margin: calc(13mm * var(--spp)) 13mm 0;
}
.sf-band {
  flex: 1;
  min-width: 0;
  min-height: calc(40mm * var(--spp));
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: calc(8mm * var(--spp)) 10mm;
  border-radius: 11mm;
  background: var(--accent-tint);
}
.sf-head.has-photo .sf-band { margin-left: calc(23mm * var(--spp)); padding-left: calc(23mm * var(--spp) + 8mm); }
.sf-photo {
  position: absolute;
  z-index: 1;
  left: 0;
  top: calc(50% - 23mm * var(--spp));
  width: calc(46mm * var(--spp));
  height: calc(46mm * var(--spp));
  border-radius: 50%;
  overflow: hidden;
  border: 2mm solid #fff;
  background: var(--accent-soft);
}
.sf-name {
  font-size: calc(23pt * var(--fs)) !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.sf-contacts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1mm 5mm;
  margin-top: calc(3.2mm * var(--spp));
  font-size: calc(8.5pt * var(--fs));
  line-height: 1.35;
}
.sf-contacts > span { display: flex; align-items: flex-start; gap: 1.6mm; min-width: 0; overflow-wrap: anywhere; }
.sf-contacts .cv-ic { width: 3.2mm; height: 3.2mm; margin-top: 0.3mm; color: var(--accent); }

.sf-body { flex: 1 1 0; min-height: 0; display: flex; margin-top: calc(9mm * var(--sp)); }
.sf-side {
  width: 74mm;
  flex: none;
  padding: calc(9mm * var(--spp)) 7mm calc(11mm * var(--spp)) 13mm;
  border-radius: 0 11mm 0 0;
  background: var(--accent-tint);
}
.sf-main { flex: 1 1 auto; padding: 2mm 13mm calc(11mm * var(--spp)) 9mm; }
.sf-main .sf-skill, .sf-main .sf-lang { max-width: 90mm; } /* moved here from the sidebar */
.sf-cont .sf-body { margin-top: 0; }
.sf-cont .sf-side { border-radius: 0; padding-top: calc(14mm * var(--spp)); }
.sf-cont .sf-main { padding-top: calc(14mm * var(--spp)); }

.sf-h {
  margin: calc(7mm * var(--sp)) 0 calc(2.6mm * var(--sp));
  font-size: calc(12pt * var(--fs));
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.sf-h::after { content: ""; display: block; width: 10mm; height: 0.8mm; margin-top: 1.6mm; border-radius: 1mm; background: var(--accent); }

.sf-entry { margin-top: calc(3.6mm * var(--sp)); }
.sf-role { font-size: calc(9.6pt * var(--fs)); line-height: 1.3; font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase; }
.sf-meta { margin-top: 0.3mm; font-weight: 600; line-height: 1.35; color: var(--accent-deep); }
.sf-meta i { font-style: normal; margin: 0 1.2mm; color: var(--muted); font-weight: 400; }

.sf-skill { display: flex; align-items: center; justify-content: space-between; gap: 2mm; margin-top: calc(1.8mm * var(--sp)); line-height: 1.3; }
.sf-dots { display: flex; gap: 0.9mm; flex: none; }
.sf-dots i { width: 1.8mm; height: 1.8mm; border-radius: 50%; background: var(--accent-soft); }
.sf-dots i.on { background: var(--accent); }

.sf-lang { display: flex; justify-content: space-between; gap: 2mm; margin-top: calc(1.6mm * var(--sp)); line-height: 1.3; }
.sf-lang b { font-weight: 600; }
.sf-lang span { color: var(--muted); text-align: right; }

/* ===================== Curve (cvee.hu: creative-11) ===================== */
.tpl-curve .cv-page { display: flex; }

.cu-side { position: relative; width: 66mm; flex: none; display: flex; flex-direction: column; background: var(--accent-tint); }
/* Top of the first page: an accent shape with a curved edge, the photo over it. */
.cu-top { position: relative; flex: none; height: calc(68mm * var(--spp)); }
.cu-top.no-photo { height: calc(28mm * var(--spp)); }
.cu-top::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 50mm;
  height: calc(56mm * var(--spp));
  border-radius: 0 0 50mm 0 / 0 0 34mm 0;
  background: var(--accent);
  box-shadow: 0 0 0 1.2mm #fff;
}
.cu-top.no-photo::before { height: calc(20mm * var(--spp)); border-radius: 0 0 50mm 0 / 0 0 16mm 0; }
.cu-photo {
  position: absolute;
  left: 10mm;
  top: calc(11mm * var(--spp));
  width: calc(46mm * var(--spp));
  height: calc(46mm * var(--spp));
  border-radius: 50%;
  overflow: hidden;
  box-shadow: 0 0 0 1.6mm #fff;
  background: var(--accent-soft);
}
.cu-photo--initials { display: flex; align-items: center; justify-content: center; }
.cu-photo--initials span { color: var(--accent-deep); font-size: 26pt; font-weight: 700; letter-spacing: 0.04em; line-height: 1; }
/* The bottom keeps room for the curved shape at the foot of the column. */
.cu-sflow { flex: 1 1 0; padding: calc(3mm * var(--spp)) 7mm calc(30mm * var(--spp)) 9mm; }
.cu-cont .cu-sflow { padding-top: calc(14mm * var(--spp)); }
.cu-side::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: calc(22mm * var(--spp));
  border-radius: 100% 0 0 0 / 75% 0 0 0;
  background: var(--accent);
  box-shadow: 0 0 0 1.2mm #fff;
}

.cu-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.cu-head {
  position: relative;
  overflow: hidden;
  flex: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: calc(50mm * var(--spp));
  padding: calc(12mm * var(--spp)) 18mm calc(9mm * var(--spp)) 12mm;
  background: #f7f5f2;
}
.cu-head::before { /* dot grid */
  content: "";
  position: absolute;
  right: 9mm;
  top: calc(8mm * var(--spp));
  width: 13mm;
  height: 13mm;
  background: radial-gradient(circle, #cfc9c0 0.45mm, transparent 0.6mm) 0 0 / 3.25mm 3.25mm;
}
.cu-head::after { /* a soft circle at the edge */
  content: "";
  position: absolute;
  right: -16mm;
  bottom: -26mm;
  width: 48mm;
  height: 48mm;
  border-radius: 50%;
  background: var(--accent-muted);
  opacity: 0.3;
}
.cu-name {
  position: relative;
  z-index: 1;
  font-size: calc(25pt * var(--fs)) !important;
  line-height: 1.06 !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink);
}
.cu-name::after { content: ""; display: block; width: 14mm; height: 0.8mm; margin-top: calc(4.5mm * var(--spp)); border-radius: 0.4mm; background: var(--accent); }
.cu-flow { flex: 1 1 0; padding: calc(9mm * var(--spp)) 13mm calc(12mm * var(--spp)) 11mm; }
.cu-cont .cu-flow { padding-top: calc(14mm * var(--spp)); }

.cu-h {
  display: flex;
  align-items: center;
  gap: 3.2mm;
  margin: calc(7mm * var(--sp)) 0 calc(2.6mm * var(--sp));
  font-size: calc(10pt * var(--fs));
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink);
}
.cu-h::after { /* a line ending in a dot */
  content: "";
  flex: 1 1 auto;
  min-width: 6mm;
  height: 1.6mm;
  background:
    linear-gradient(var(--accent), var(--accent)) left center / calc(100% - 1mm) 0.3mm no-repeat,
    radial-gradient(circle, var(--accent) 0.7mm, transparent 0.8mm) right center / 1.6mm 1.6mm no-repeat;
}
.cu-badge { flex: none; display: flex; align-items: center; justify-content: center; width: 7.6mm; height: 7.6mm; border-radius: 50%; background: var(--accent-muted); color: #fff; }
.cu-badge .cv-ic { width: 3.8mm; height: 3.8mm; }
.cu-hs {
  margin: calc(7mm * var(--sp)) 0 calc(2.6mm * var(--sp));
  padding-bottom: 1.6mm;
  font-size: calc(8.8pt * var(--fs));
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--accent);
  background: linear-gradient(var(--accent), var(--accent)) left bottom / 100% 0.3mm no-repeat;
}

.cu-entry { display: grid; grid-template-columns: 22mm minmax(0, 1fr); column-gap: 4mm; margin-top: calc(4mm * var(--sp)); }
.cu-date { font-size: calc(8.6pt * var(--fs)); line-height: 1.35; font-weight: 700; color: var(--accent); }
.cu-role { font-size: calc(9.6pt * var(--fs)); line-height: 1.3; font-weight: 700; }
.cu-org { margin-top: 0.3mm; font-size: calc(9pt * var(--fs)); line-height: 1.35; color: var(--accent); }
.cu-ind { margin-left: 26mm; }
/* Entries moved into the sidebar: date above the title. */
.cu-side .cu-entry { display: block; margin-top: calc(3.4mm * var(--sp)); }
.cu-side .cu-role { font-size: calc(9.2pt * var(--fs)); }
.cu-side .cv-p, .cu-side .cv-li { font-size: calc(8.6pt * var(--fs)); }

.cu-contact { display: flex; align-items: flex-start; gap: 2.6mm; margin-top: calc(2mm * var(--sp)); font-size: calc(8.6pt * var(--fs)); line-height: 1.35; overflow-wrap: anywhere; }
.cu-contact .cv-ic { width: 3.5mm; height: 3.5mm; margin-top: 0.3mm; color: var(--accent); }
.cu-skill { margin-top: calc(2.4mm * var(--sp)); font-size: calc(8.8pt * var(--fs)); line-height: 1.3; }
.cu-bar { margin-top: 1.2mm; height: 1.4mm; border-radius: 1mm; background: var(--accent-soft); overflow: hidden; }
.cu-bar i { display: block; height: 100%; border-radius: 1mm; background: var(--accent); }
.cu-lang { display: flex; justify-content: space-between; gap: 2mm; margin-top: calc(1.8mm * var(--sp)); font-size: calc(8.8pt * var(--fs)); line-height: 1.3; }
.cu-lang b { font-weight: 500; }
.cu-lang span { color: var(--muted); text-align: right; }
.cu-flow .cu-skill, .cu-flow .cu-lang { max-width: 95mm; } /* moved here from the sidebar */

/* ===================== Bloom (cvee.hu: creative-8) ===================== */
.tpl-bloom .cv-page { display: flex; flex-direction: column; padding: calc(10mm * var(--spp)) 12mm calc(10mm * var(--spp)); }
.bm-deco i { position: absolute; z-index: 0; border-radius: 50%; background: var(--accent-soft); opacity: 0.5; }
.bm-deco i:nth-child(1) { left: -20mm; top: -24mm; width: 56mm; height: 56mm; }
.bm-deco i:nth-child(2) { right: -18mm; top: 70mm; width: 52mm; height: 52mm; }
.bm-deco i:nth-child(3) { right: -8mm; bottom: -16mm; width: 60mm; height: 60mm; }

.bm-body { position: relative; z-index: 1; flex: 1 1 0; min-height: 0; display: flex; gap: 4.5mm; }
.bm-side { width: 60mm; flex: none; padding: calc(6.5mm * var(--spp)) 5.5mm; border-radius: 4mm; background: var(--accent-tint); box-shadow: inset 0 0 0 0.3mm var(--accent-soft); }
.bm-side:empty { background: none; box-shadow: none; }
.bm-main { flex: 1 1 auto; }

.bm-photo {
  width: calc(30mm * var(--spp));
  height: calc(30mm * var(--spp));
  margin: 0 auto calc(1mm * var(--sp));
  border-radius: 50%;
  overflow: hidden;
  box-shadow: 0 0 0 1mm #fff, 0 0 0 1.35mm var(--accent-soft);
  background: var(--accent-soft);
}
.bm-photo--initials { display: flex; align-items: center; justify-content: center; background: var(--accent); }
.bm-photo--initials span { color: #fff; font-size: 20pt; font-weight: 700; letter-spacing: 0.04em; line-height: 1; }
.bm-name {
  margin-top: calc(4mm * var(--sp));
  text-align: center;
  font-size: calc(14pt * var(--fs)) !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  overflow-wrap: break-word;
}

.bm-hs, .bm-h { display: flex; align-items: center; gap: 2.4mm; line-height: 1.2; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink); }
.bm-hs { margin: calc(6.5mm * var(--sp)) 0 calc(2.4mm * var(--sp)); font-size: calc(8.8pt * var(--fs)); }
.bm-h { margin: 0 0 calc(2.2mm * var(--sp)); font-size: calc(9.6pt * var(--fs)); }
.bm-ib { flex: none; display: flex; align-items: center; justify-content: center; width: 6.4mm; height: 6.4mm; border-radius: 50%; background: #fff; color: var(--accent); }
.bm-h .bm-ib { border-radius: 1.8mm; background: var(--accent-tint); }
.bm-ib .cv-ic { width: 3.4mm; height: 3.4mm; }

.bm-contact { display: flex; align-items: flex-start; gap: 1.8mm; margin-top: calc(1.8mm * var(--sp)); font-size: calc(8.3pt * var(--fs)); line-height: 1.35; overflow-wrap: anywhere; }
.bm-contact .cv-ic { width: 3.4mm; height: 3.4mm; margin-top: 0.3mm; color: var(--accent); }
.bm-skill { margin-top: calc(2.2mm * var(--sp)); font-size: calc(8.8pt * var(--fs)); line-height: 1.3; font-weight: 500; }
.bm-bar { margin-top: 1mm; height: 1.3mm; border-radius: 1mm; background: #fff; overflow: hidden; box-shadow: inset 0 0 0 0.2mm var(--accent-soft); }
.bm-bar i { display: block; height: 100%; border-radius: 1mm; background: var(--accent); }
.bm-lang { display: flex; justify-content: space-between; gap: 2mm; margin-top: calc(1.6mm * var(--sp)); font-size: calc(8.8pt * var(--fs)); line-height: 1.3; }
.bm-lang b { font-weight: 500; }
.bm-lang span { color: var(--muted); text-align: right; }
.bm-side .bm-entry { margin-top: calc(3.4mm * var(--sp)); }
.bm-side .cv-p, .bm-side .cv-li { font-size: calc(8.6pt * var(--fs)); }

/* Main column cards. Lines are drawn with inset shadows (never borders). */
.bm-c { display: flow-root; padding: 0 4.5mm; background: #fff; box-shadow: inset 0.3mm 0 0 var(--line), inset -0.3mm 0 0 var(--line); }
.bm-top, .bm-main > .bm-c:first-child {
  margin-top: calc(4mm * var(--sp));
  padding-top: calc(4mm * var(--sp));
  border-radius: 4mm 4mm 0 0;
  box-shadow: inset 0.3mm 0 0 var(--line), inset -0.3mm 0 0 var(--line), inset 0 0.3mm 0 var(--line);
}
.bm-bot, .bm-main > .bm-c:last-child {
  padding-bottom: calc(4mm * var(--sp));
  border-radius: 0 0 4mm 4mm;
  box-shadow: inset 0.3mm 0 0 var(--line), inset -0.3mm 0 0 var(--line), inset 0 -0.3mm 0 var(--line);
}
.bm-top.bm-bot, .bm-main > .bm-c:only-child, .bm-main > .bm-top:last-child, .bm-main > .bm-bot:first-child { border-radius: 4mm; box-shadow: inset 0 0 0 0.3mm var(--line); }

/* An entry inside a card: a tinted box, sliced like the card. */
.bm-in { display: flow-root; padding: 0 3.5mm; background: var(--accent-tint); }
/* Each slice reaches 0.4 mm up over the one before (content stays put), so PDF viewers show no hairline between them. */
.bm-in:not(.bm-in-top) { margin-top: -0.4mm; padding-top: 0.4mm; }
.bm-in-top { margin-top: calc(2.4mm * var(--sp)); padding-top: calc(2.6mm * var(--sp)); border-radius: 2.6mm 2.6mm 0 0; }
.bm-in-bot { padding-bottom: calc(2.6mm * var(--sp)); border-radius: 0 0 2.6mm 2.6mm; }
.bm-in-top.bm-in-bot { border-radius: 2.6mm; }
.bm-in .bm-entry { margin: 0; }
.bm-role { font-size: calc(9.4pt * var(--fs)); line-height: 1.3; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; }
.bm-meta { margin-top: 0.3mm; font-size: calc(8.6pt * var(--fs)); line-height: 1.35; font-weight: 600; letter-spacing: 0.03em; text-transform: uppercase; color: var(--muted); }

.bm-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 6mm; }
.bm-grid > :first-child, .bm-grid > :nth-child(2) { margin-top: 0; }
.bm-chips { display: flex; flex-wrap: wrap; gap: calc(1.5mm * var(--spp)) 1.5mm; }
.bm-chips span { padding: 0.8mm 2.6mm; border-radius: 3mm; background: var(--accent-tint); color: var(--accent-deep); font-size: calc(8.4pt * var(--fs)); line-height: 1.3; font-weight: 500; }

/* ===================== Elegant (cvee.hu: creative-6) ===================== */
.tpl-elegant .cv-page { display: flex; flex-direction: column; }

.el-head { position: relative; flex: none; height: calc(64mm * var(--spp)); }
.el-name {
  position: absolute;
  left: 22mm;
  top: calc(15mm * var(--spp));
  max-width: 94mm;
  font-size: calc(24pt * var(--fs)) !important;
  line-height: 1.08 !important;
  font-weight: 600 !important;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--accent-dark);
}
.el-name > span { display: block; }
.el-tab { position: absolute; right: 15mm; top: 0; width: 72mm; height: calc(44mm * var(--spp)); border-radius: 0 0 18mm 18mm; background: var(--accent-dark); }
.el-photo {
  position: absolute;
  left: calc(50% - 23mm * var(--spp));
  top: calc(21mm * var(--spp));
  width: calc(46mm * var(--spp));
  height: calc(46mm * var(--spp));
  border-radius: 50%;
  overflow: hidden;
  box-shadow: 0 0 0 1.4mm #fff;
  background: var(--accent-soft);
}
.el-photo--initials { display: flex; align-items: center; justify-content: center; }
.el-photo--initials span { color: var(--accent-dark); font-size: 26pt; font-weight: 700; letter-spacing: 0.04em; line-height: 1; }

.el-body { flex: 1 1 0; min-height: 0; display: flex; }
.el-cont .el-body { padding-top: calc(12mm * var(--spp)); }
.el-side {
  width: 65mm;
  flex: none;
  margin-left: 15mm;
  padding: calc(11mm * var(--spp)) 6mm calc(10mm * var(--spp)) 7mm;
  border-radius: 14mm 14mm 0 0;
  background: var(--accent-dark);
  color: #fff;
}
.el-main { flex: 1 1 auto; min-width: 0; padding: calc(10mm * var(--spp)) 13mm calc(12mm * var(--spp)) 8mm; }
.el-cont .el-main { padding-top: calc(11mm * var(--spp)); }

/* sidebar: white on the accent */
.el-hs {
  margin: calc(6.5mm * var(--sp)) 0 calc(2.6mm * var(--sp));
  padding-bottom: 1.8mm;
  font-size: calc(10pt * var(--fs));
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff;
  background: linear-gradient(rgba(255, 255, 255, 0.35), rgba(255, 255, 255, 0.35)) left bottom / 100% 0.3mm no-repeat;
}
.el-side .cv-p, .el-side .cv-li { font-size: calc(8.8pt * var(--fs)); color: rgba(255, 255, 255, 0.92); }
.el-side .cv-li::before { background: #fff; }
.el-contact { display: flex; align-items: center; gap: 2.2mm; margin-top: calc(2.2mm * var(--sp)); font-size: calc(8.3pt * var(--fs)); line-height: 1.35; overflow-wrap: anywhere; }
.el-ib { flex: none; display: flex; align-items: center; justify-content: center; width: 5.4mm; height: 5.4mm; border-radius: 50%; background: #fff; color: var(--accent-dark); }
.el-ib .cv-ic { width: 3mm; height: 3mm; }
.el-skill { display: flex; align-items: center; justify-content: space-between; gap: 3mm; margin-top: calc(2.2mm * var(--sp)); font-size: calc(8.8pt * var(--fs)); line-height: 1.3; }
.el-bar { flex: none; width: 14mm; height: 1.3mm; border-radius: 1mm; background: rgba(255, 255, 255, 0.25); overflow: hidden; }
.el-bar i { display: block; height: 100%; border-radius: 1mm; background: #fff; }
.el-lang { display: flex; justify-content: space-between; gap: 2mm; margin-top: calc(1.8mm * var(--sp)); font-size: calc(8.8pt * var(--fs)); line-height: 1.3; }
.el-lang b { font-weight: 600; }
.el-lang span { opacity: 0.75; text-align: right; }
.el-side .el-top { display: block; }
.el-side .el-date { margin-top: 0.3mm; font-weight: 500; white-space: normal; opacity: 0.8; }
.el-side .el-org { color: #fff; opacity: 0.85; }

/* main column: outlined headings that run off the right edge */
.el-h {
  margin: calc(7mm * var(--sp)) -16mm calc(3mm * var(--sp)) 0;
  padding: 1.5mm 5mm;
  border-radius: 6mm 0 0 6mm;
  box-shadow: inset 0 0 0 0.45mm var(--accent-dark);
  font-size: calc(9.6pt * var(--fs));
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent-dark);
}
.el-entry { margin-top: calc(3.6mm * var(--sp)); }
.el-top { display: flex; align-items: baseline; justify-content: space-between; gap: 3mm; }
.el-role { font-size: calc(9.4pt * var(--fs)); line-height: 1.3; font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase; }
.el-date { flex: none; white-space: nowrap; font-size: calc(8.8pt * var(--fs)); font-weight: 700; }
.el-org { margin-top: 0.3mm; font-weight: 600; line-height: 1.35; color: var(--accent-dark); }
.el-main .cv-li::before { background: var(--accent-dark); }
/* skills and languages moved into the main column */
.el-main .el-skill, .el-main .el-lang { max-width: 90mm; }
.el-main .el-bar { width: 22mm; background: var(--accent-soft); }
.el-main .el-bar i { background: var(--accent-dark); }
.el-main .el-lang span { opacity: 1; color: var(--muted); }