/* ============================================================
   Free Resume Maker - resume.css
   Styles for the resume paper and all 18 templates.
   Colours come from CSS variables set by resume-engine.js,
   so every template works with any colour the user picks.
   ============================================================ */

.rs, .rs * { box-sizing: border-box; margin: 0; padding: 0; }
.rs {
  width: 794px; min-height: 1123px; background: #fff; color: var(--ink, #1f2933);
  font-family: var(--rs-font, Arial, sans-serif); font-size: var(--fs, 13px); line-height: 1.45;
  text-align: left; position: relative; overflow-wrap: anywhere; word-break: normal;
  -webkit-font-smoothing: antialiased;
}
.rs ul { list-style: none; }
.rs h1, .rs h2, .rs h3 { font-family: inherit; color: inherit; letter-spacing: normal; line-height: 1.2; font-weight: 700; }

/* Header basics */
.rs-head { padding: calc(40px * var(--sp, 1)) 52px calc(14px * var(--sp, 1)); display: flex; gap: 20px; align-items: center; }
.rs-head-text { flex: 1; min-width: 0; }
.rs-name { font-size: 2.2em; font-weight: 700; line-height: 1.08; }
.rs-name.rs-empty { opacity: .35; }
.rs-role { font-size: 1.12em; color: var(--a-text); margin-top: 4px; font-weight: 600; }
.rs-mono { display: none; }
.rs-contacts { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 10px; color: var(--muted); font-size: .94em; }
.rs-ci { display: inline-flex; align-items: center; gap: 6px; }
.rs-ico { display: inline-flex; width: 1.05em; height: 1.05em; flex-shrink: 0; font-style: normal; }
.rs-ico svg { width: 100%; height: 100%; fill: var(--a-text); }
.rs-photo { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; flex-shrink: 0; display: block; }

.rs-head-split { justify-content: space-between; align-items: flex-start; }
.rs-head-split .rs-head-left { flex: 1; min-width: 0; }
.rs-head-split .rs-contacts { flex-direction: column; align-items: flex-end; margin-top: 4px; gap: 3px; text-align: right; max-width: 46%; }
.rs-head-split .rs-ci { flex-direction: row-reverse; }

/* Body */
.rs-main { padding: 0 52px calc(40px * var(--sp, 1)); }
.rs-sec { margin-top: calc(16px * var(--sp, 1)); }
.rs-h { font-size: 1.08em; color: var(--a-text); margin-bottom: calc(8px * var(--sp, 1)); }
.rs-item + .rs-item { margin-top: calc(11px * var(--sp, 1)); }
.rs-item, .rs-h, .rs-lang, .rs-skill { break-inside: avoid; page-break-inside: avoid; }
.rs-h { break-after: avoid; page-break-after: avoid; }
.rs-item-top { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; }
.rs-item-main { min-width: 0; }
.rs-item-title { font-size: 1.04em; font-weight: 700; }
.rs-item-sub { color: var(--muted); font-size: .96em; margin-top: 1px; }
.rs-date { color: var(--muted); font-size: .9em; white-space: nowrap; flex-shrink: 0; }
.rs-note { color: var(--muted); font-size: .92em; margin-top: 2px; }
.rs-p { margin-top: 4px; }
.rs-summary .rs-p { margin-top: 0; }
.rs-ul { margin-top: 4px; padding-left: 1.15em; }
.rs-ul li { list-style: disc; margin: 2px 0; padding-left: 2px; }
.rs-ul li::marker { color: var(--a-text); }
.rs-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.rs-tag { background: var(--a10); color: var(--a-dark); padding: 2px 10px; border-radius: 4px; font-size: .92em; font-weight: 600; }
.rs-skill-inline { line-height: 1.6; }
.rs-sep { color: var(--a-text); }
.rs-skill-list { padding-left: 1.1em; }
.rs-skill-list li { list-style: disc; margin: 2px 0; }
.rs-skill-meter { display: flex; flex-direction: column; gap: calc(7px * var(--sp, 1)); }
.rs-skill { display: flex; flex-direction: column; gap: 3px; }
.rs-skill-dots .rs-skill { flex-direction: row; justify-content: space-between; align-items: center; gap: 10px; }
.rs-bar { display: block; height: 5px; border-radius: 3px; background: var(--a20); overflow: hidden; }
.rs-bar span { display: block; height: 100%; background: var(--a); border-radius: 3px; }
.rs-dots { display: inline-flex; gap: 4px; flex-shrink: 0; }
.rs-dots i { width: 8px; height: 8px; border-radius: 50%; background: var(--a20); display: block; }
.rs-dots i.on { background: var(--a); }
.rs-langs { display: flex; flex-direction: column; gap: 4px; }
.rs-lang { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.rs-lang-level { color: var(--muted); font-size: .92em; }
.rs-link { color: var(--a-text); }

/* Two-column layouts */
.rs-l-side-left, .rs-l-side-right { display: flex; flex-direction: column; }
.rs-cols { display: flex; flex: 1; align-items: stretch; }
.rs-side { width: 33%; flex-shrink: 0; padding: calc(36px * var(--sp, 1)) 26px; }
.rs-cols .rs-main { flex: 1; min-width: 0; padding: calc(36px * var(--sp, 1)) 40px; }
.rs-side .rs-sec:first-child { margin-top: 0; }
.rs-side .rs-contacts { flex-direction: column; gap: 6px; margin-top: 0; }
.rs-side .rs-ci { align-items: flex-start; }
.rs-side .rs-ico { margin-top: .2em; }
.rs-photo-side { width: 128px; height: 128px; margin: 0 auto calc(20px * var(--sp, 1)); }

/* ───────── 1. Meridian: centred classic ───────── */
.rs-t-meridian .rs-head { flex-direction: column; text-align: center; padding-bottom: calc(18px * var(--sp, 1)); margin: 0 52px; padding-left: 0; padding-right: 0; border-bottom: 3px double var(--a); }
.rs-t-meridian .rs-name { font-size: 2.4em; font-weight: 400; letter-spacing: .03em; }
.rs-t-meridian .rs-role { font-weight: 400; font-style: italic; }
.rs-t-meridian .rs-contacts { justify-content: center; }
.rs-t-meridian .rs-h { text-transform: uppercase; letter-spacing: .14em; font-size: .92em; border-bottom: 1px solid var(--line); padding-bottom: 4px; }
.rs-t-meridian .rs-sec { margin-top: calc(18px * var(--sp, 1)); }

/* ───────── 2. Plain ATS ───────── */
.rs-t-plain .rs-name { color: var(--a-text); font-size: 2em; }
.rs-t-plain .rs-role { color: var(--ink); font-weight: 400; }
.rs-t-plain .rs-head-split .rs-ci { flex-direction: row; }
.rs-t-plain .rs-h { color: var(--ink); text-transform: uppercase; font-size: 1em; letter-spacing: .04em; border-bottom: 1px solid var(--ink); padding-bottom: 3px; }
.rs-t-plain .rs-ul li::marker, .rs-t-plain .rs-sep { color: var(--ink); }
.rs-t-plain .rs-photo { border-radius: 4px; width: 84px; height: 84px; }

/* ───────── 3. Harbor: colour sidebar ───────── */
.rs-t-harbor .rs-side { background: var(--a); color: var(--on-a); }
.rs-t-harbor .rs-side .rs-h { color: var(--on-a); text-transform: uppercase; letter-spacing: .1em; font-size: .9em; border-bottom: 1px solid var(--on-a-muted); padding-bottom: 5px; opacity: .95; }
.rs-t-harbor .rs-side .rs-ico svg { fill: var(--on-a); }
.rs-t-harbor .rs-side .rs-contacts, .rs-t-harbor .rs-side .rs-lang-level { color: var(--on-a-muted); }
.rs-t-harbor .rs-side .rs-bar { background: rgba(255,255,255,.25); }
.rs-t-harbor .rs-side .rs-bar span { background: var(--on-a); }
.rs-t-harbor .rs-side .rs-dots i { background: rgba(255,255,255,.3); }
.rs-t-harbor .rs-side .rs-dots i.on { background: var(--on-a); }
.rs-t-harbor .rs-side .rs-skill-list li::marker { color: var(--on-a); }
.rs-t-harbor .rs-side .rs-item-sub, .rs-t-harbor .rs-side .rs-date { color: var(--on-a-muted); }
.rs-t-harbor .rs-photo-side { border: 4px solid rgba(255,255,255,.35); }
.rs-t-harbor .rs-head { padding: 0 0 calc(18px * var(--sp, 1)); border-bottom: 2px solid var(--a20); margin-bottom: 4px; }
.rs-t-harbor .rs-name { font-size: 2.5em; font-weight: 800; color: var(--a-text); letter-spacing: -.01em; }
.rs-t-harbor .rs-role { color: var(--muted); font-weight: 500; }
.rs-t-harbor .rs-main .rs-h { text-transform: uppercase; letter-spacing: .1em; font-size: .95em; }

/* ───────── 4. Ledger: label column ───────── */
.rs-t-ledger .rs-head { padding-bottom: calc(22px * var(--sp, 1)); }
.rs-t-ledger .rs-name { font-size: 2.3em; letter-spacing: -.01em; }
.rs-t-ledger .rs-sec { display: grid; grid-template-columns: 138px 1fr; gap: 22px; margin-top: calc(14px * var(--sp, 1)); }
.rs-t-ledger .rs-h { border-top: 3px solid var(--a); padding-top: 7px; font-size: .86em; text-transform: uppercase; letter-spacing: .1em; margin: 0; }
.rs-t-ledger .rs-body { border-top: 1px solid var(--line); padding-top: 8px; }

/* ───────── 5. Summit: colour band ───────── */
.rs-t-summit .rs-head-band { background: var(--a); color: var(--on-a); padding: calc(38px * var(--sp, 1)) 52px; margin-bottom: calc(8px * var(--sp, 1)); }
.rs-t-summit .rs-name { font-size: 2.5em; }
.rs-t-summit .rs-role { color: var(--on-a-muted); font-weight: 500; }
.rs-t-summit .rs-contacts { color: var(--on-a); }
.rs-t-summit .rs-ico svg { fill: var(--on-a); }
.rs-t-summit .rs-photo { border: 4px solid rgba(255,255,255,.4); width: 104px; height: 104px; }
.rs-t-summit .rs-h { font-size: 1.15em; padding-bottom: 5px; border-bottom: 2px solid var(--a20); }

/* ───────── 6. Atlas: tinted right column ───────── */
.rs-t-atlas .rs-head { border-bottom: 4px solid var(--a); padding-bottom: calc(20px * var(--sp, 1)); }
.rs-t-atlas .rs-name { font-size: 2.4em; }
.rs-t-atlas .rs-photo { border-radius: 12px; }
.rs-t-atlas .rs-side { background: var(--a5); border-left: 1px solid var(--a20); padding-top: calc(26px * var(--sp, 1)); }
.rs-t-atlas .rs-cols .rs-main { padding-top: calc(26px * var(--sp, 1)); }
.rs-t-atlas .rs-h { text-transform: uppercase; font-size: .92em; letter-spacing: .08em; }

/* ───────── 7. Chronicle: timeline ───────── */
.rs-t-chronicle .rs-head { background: var(--a5); padding-bottom: calc(26px * var(--sp, 1)); margin-bottom: calc(10px * var(--sp, 1)); }
.rs-t-chronicle .rs-name { font-size: 2.4em; }
.rs-t-chronicle .rs-name::after { content: ''; display: block; width: 56px; height: 4px; background: var(--a); border-radius: 2px; margin-top: 10px; }
.rs-t-chronicle .rs-h { font-size: 1.2em; }
.rs-t-chronicle .rs-sec-experience .rs-list, .rs-t-chronicle .rs-sec-education .rs-list, .rs-t-chronicle .rs-sec-projects .rs-list { border-left: 2px solid var(--a20); margin-left: 5px; }
.rs-t-chronicle .rs-sec-experience .rs-item, .rs-t-chronicle .rs-sec-education .rs-item, .rs-t-chronicle .rs-sec-projects .rs-item { position: relative; padding-left: 20px; }
.rs-t-chronicle .rs-sec-experience .rs-item::before, .rs-t-chronicle .rs-sec-education .rs-item::before, .rs-t-chronicle .rs-sec-projects .rs-item::before { content: ''; position: absolute; left: -7px; top: 3px; width: 12px; height: 12px; border-radius: 50%; background: var(--a); border: 2px solid #fff; }
.rs-t-chronicle .rs-date { color: var(--a-text); font-weight: 600; }

/* ───────── 8. Quill: book serif ───────── */
.rs-t-quill .rs-head { flex-direction: column; text-align: center; padding-top: calc(48px * var(--sp, 1)); }
.rs-t-quill .rs-name { font-size: 2.6em; font-weight: 400; letter-spacing: .08em; }
.rs-t-quill .rs-role { font-weight: 400; letter-spacing: .12em; font-variant: small-caps; font-size: 1.15em; }
.rs-t-quill .rs-contacts { justify-content: center; }
.rs-t-quill .rs-ico { display: none; }
.rs-t-quill .rs-ci + .rs-ci::before { content: '/'; color: var(--a40); margin-right: 10px; }
.rs-t-quill .rs-contacts { gap: 4px 10px; }
.rs-t-quill .rs-h { display: flex; align-items: center; gap: 14px; font-variant: small-caps; letter-spacing: .16em; font-weight: 400; font-size: 1.2em; }
.rs-t-quill .rs-h::before, .rs-t-quill .rs-h::after { content: ''; flex: 1; height: 1px; background: var(--a40); }
.rs-t-quill .rs-item-title { font-weight: 700; }
.rs-t-quill .rs-item-sub { font-style: italic; }

/* ───────── 9. Stripe: left edge band ───────── */
.rs-t-stripe { border-left: 16px solid var(--a); }
.rs-t-stripe .rs-head, .rs-t-stripe .rs-main { padding-left: 44px; }
.rs-t-stripe .rs-name { font-size: 2.8em; font-weight: 800; letter-spacing: -.02em; line-height: 1; }
.rs-t-stripe .rs-h { display: flex; align-items: center; gap: 8px; text-transform: uppercase; font-size: .95em; letter-spacing: .06em; }
.rs-t-stripe .rs-h::before { content: ''; width: 10px; height: 10px; background: var(--a); display: inline-block; }
.rs-t-stripe .rs-photo { border-radius: 8px; }

/* ───────── 10. Terminal: developer ───────── */
.rs-t-terminal .rs-name, .rs-t-terminal .rs-h, .rs-t-terminal .rs-tag, .rs-t-terminal .rs-date { font-family: 'Courier New', Consolas, monospace; }
.rs-t-terminal .rs-name { font-size: 2.2em; }
.rs-t-terminal .rs-name::before { content: '> '; color: var(--a-text); }
.rs-t-terminal .rs-head { border-bottom: 1px dashed var(--a40); padding-bottom: calc(20px * var(--sp, 1)); margin: 0 52px; padding-left: 0; padding-right: 0; }
.rs-t-terminal .rs-h { font-size: 1.1em; }
.rs-t-terminal .rs-h::before { content: '// '; opacity: .7; }
.rs-t-terminal .rs-tag { background: var(--a5); border: 1px solid var(--a40); border-radius: 3px; font-weight: 400; color: var(--ink); }
.rs-t-terminal .rs-photo { border-radius: 6px; }

/* ───────── 11. Campus: freshers ───────── */
.rs-t-campus .rs-head { padding-bottom: calc(16px * var(--sp, 1)); }
.rs-t-campus .rs-name { font-size: 2.4em; font-weight: 800; }
.rs-t-campus .rs-name::after { content: ''; display: block; height: 6px; width: 72px; background: var(--a40); margin-top: 6px; border-radius: 3px; }
.rs-t-campus .rs-h { display: inline-block; background: var(--a10); border-left: 4px solid var(--a); padding: 3px 12px; border-radius: 0 4px 4px 0; color: var(--a-dark); }

/* ───────── 12. Monogram ───────── */
.rs-t-monogram .rs-side { background: #f4f5f7; border-right: 1px solid #e6e8eb; }
.rs-t-monogram .rs-head { padding: 0 0 calc(18px * var(--sp, 1)); border-bottom: 1px solid var(--line); gap: 16px; }
.rs-t-monogram .rs-mono { display: flex; width: 66px; height: 66px; border-radius: 50%; border: 2px solid var(--a); color: var(--a-text); align-items: center; justify-content: center; font-size: 1.7em; font-family: Georgia, serif; letter-spacing: .04em; flex-shrink: 0; }
.rs-t-monogram .rs-name { font-size: 2.2em; font-weight: 400; }
.rs-t-monogram .rs-h { font-size: .9em; text-transform: uppercase; letter-spacing: .12em; }
.rs-t-monogram .rs-side .rs-h { color: var(--ink); }
.rs-t-monogram .rs-photo-side { border-radius: 8px; }

/* ───────── 13. Orbit: rounded header ───────── */
.rs-t-orbit .rs-head-band { background: var(--a); color: var(--on-a); margin: 0 22px; border-radius: 0 0 40px 40px; padding: calc(34px * var(--sp, 1)) 34px calc(30px * var(--sp, 1)); }
.rs-t-orbit .rs-name { font-size: 2.4em; }
.rs-t-orbit .rs-role, .rs-t-orbit .rs-contacts { color: var(--on-a-muted); }
.rs-t-orbit .rs-ico svg { fill: var(--on-a); }
.rs-t-orbit .rs-photo { border-radius: 22px; border: 4px solid #fff; width: 110px; height: 110px; }
.rs-t-orbit .rs-main { padding-top: calc(10px * var(--sp, 1)); }
.rs-t-orbit .rs-h { display: flex; align-items: center; gap: 9px; }
.rs-t-orbit .rs-h::before { content: ''; width: 14px; height: 14px; border-radius: 50%; border: 4px solid var(--a); box-sizing: border-box; }
.rs-t-orbit .rs-sec-skills .rs-skill-meter { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 28px; }

/* ───────── 14. Tiles ───────── */
.rs-t-tiles .rs-name { color: var(--a-text); font-size: 2.4em; }
.rs-t-tiles .rs-role { color: var(--ink); }
.rs-t-tiles .rs-main { padding-left: 40px; padding-right: 40px; }
.rs-t-tiles .rs-head { padding-left: 40px; padding-right: 40px; }
.rs-t-tiles .rs-sec { background: var(--a5); border: 1px solid var(--a10); border-radius: 10px; padding: calc(13px * var(--sp, 1)) 18px; margin-top: calc(11px * var(--sp, 1)); }
.rs-t-tiles .rs-tag { background: #fff; border: 1px solid var(--a20); }
.rs-t-tiles .rs-photo { border-radius: 14px; }

/* ───────── 15. Nordic ───────── */
.rs-t-nordic .rs-head { flex-direction: row; padding: calc(60px * var(--sp, 1)) 64px calc(26px * var(--sp, 1)); }
.rs-t-nordic .rs-main { padding: 0 64px calc(56px * var(--sp, 1)); }
.rs-t-nordic .rs-name { font-size: 2.9em; font-weight: 300; letter-spacing: -.02em; }
.rs-t-nordic .rs-role { color: var(--muted); font-weight: 400; }
.rs-t-nordic .rs-ico { display: none; }
.rs-t-nordic .rs-h { font-weight: 400; text-transform: uppercase; letter-spacing: .22em; font-size: .8em; color: var(--muted); }
.rs-t-nordic .rs-sec { margin-top: calc(22px * var(--sp, 1)); }
.rs-t-nordic .rs-date { color: var(--a-text); }
.rs-t-nordic .rs-item-title { font-weight: 600; }

/* ───────── 16. Executive ───────── */
.rs-t-executive .rs-head-band { background: var(--ink); color: #fff; padding: calc(40px * var(--sp, 1)) 52px calc(32px * var(--sp, 1)); border-bottom: 6px solid var(--a); margin-bottom: calc(8px * var(--sp, 1)); }
.rs-t-executive .rs-name { font-size: 2.5em; letter-spacing: .02em; font-weight: 400; }
.rs-t-executive .rs-role { color: var(--a40); font-weight: 400; text-transform: uppercase; letter-spacing: .14em; font-size: .95em; margin-top: 8px; }
.rs-t-executive .rs-contacts { color: rgba(255,255,255,.82); }
.rs-t-executive .rs-ico svg { fill: var(--a40); }
.rs-t-executive .rs-photo { border-radius: 4px; border: 3px solid rgba(255,255,255,.25); }
.rs-t-executive .rs-h { color: var(--ink); text-transform: uppercase; letter-spacing: .12em; font-size: .95em; border-bottom: 2px solid var(--a); padding-bottom: 4px; display: inline-block; }


/* ───────── 17. Spark ───────── */
.rs-t-spark .rs-head { border-bottom: 1px solid var(--line); padding-bottom: calc(20px * var(--sp, 1)); }
.rs-t-spark .rs-name { font-size: 2.3em; }
.rs-t-spark .rs-h { display: flex; align-items: center; gap: 9px; }
.rs-t-spark .rs-h::before { content: ''; width: 9px; height: 9px; background: var(--a); transform: rotate(45deg); flex-shrink: 0; }
.rs-t-spark .rs-side { background: #fafafa; border-left: 3px solid var(--a); }
.rs-t-spark .rs-cols .rs-main { padding-top: calc(24px * var(--sp, 1)); }
.rs-t-spark .rs-side { padding-top: calc(24px * var(--sp, 1)); }

/* ───────── 18. Metro ───────── */
.rs-t-metro .rs-head { align-items: stretch; padding-bottom: calc(20px * var(--sp, 1)); }
.rs-t-metro .rs-head-left { display: flex; flex-direction: column; justify-content: center; }
.rs-t-metro .rs-name { font-size: 2.4em; font-weight: 800; }
.rs-t-metro .rs-head-split .rs-contacts { background: var(--a); color: var(--on-a); padding: 14px 18px; border-radius: 6px; margin: 0; align-items: flex-start; text-align: left; }
.rs-t-metro .rs-head-split .rs-ci { flex-direction: row; }
.rs-t-metro .rs-ico svg { fill: var(--on-a); }
.rs-t-metro .rs-h { border-left: 4px solid var(--a); padding-left: 9px; text-transform: uppercase; letter-spacing: .06em; font-size: .98em; }

/* Languages flow across the page in single-column layouts */
.rs-l-single .rs-langs, .rs-l-labels .rs-langs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px 28px; }
.rs-t-executive .rs-grid2 .rs-langs { grid-template-columns: 1fr; }

/* ───────── 19. Horizon / banner: illustrated header ───────── */
.rs-t-banner .rs-head-hero { background-color: var(--a); background-image: var(--art-on); background-size: cover; background-position: center; color: var(--on-a); padding: calc(40px * var(--sp, 1)) 52px calc(36px * var(--sp, 1)); min-height: 178px; gap: 28px; }
.rs-t-banner .rs-head-hero .rs-name { font-size: 2.6em; font-weight: 800; letter-spacing: -.01em; }
.rs-t-banner .rs-head-hero .rs-role { color: var(--on-a-muted); font-weight: 500; font-size: 1.18em; }
.rs-t-banner .rs-head-hero .rs-contacts { color: var(--on-a); }
.rs-t-banner .rs-head-hero .rs-ico svg { fill: var(--on-a); }
.rs-t-banner .rs-head-hero .rs-photo { order: 2; width: 124px; height: 124px; border: 5px solid #fff; box-shadow: 0 6px 18px rgba(0,0,0,.18); }
.rs-t-banner .rs-main { padding-top: calc(10px * var(--sp, 1)); }
.rs-t-banner .rs-h { display: flex; align-items: center; gap: 10px; font-size: 1.14em; }
.rs-t-banner .rs-h::after { content: ''; flex: 1; height: 2px; background: var(--a20); }

/* ───────── 20. Canvas: sidebar with artwork ───────── */
.rs-t-canvas .rs-side { background: var(--a5); border-right: 1px solid var(--a10); padding-top: 0; }
.rs-t-canvas .rs-side-art { margin: 0 -26px 0; height: 150px; background-color: var(--a10); background-image: var(--art-side); background-size: cover; background-position: center; }
.rs-t-canvas .rs-photo-side { margin: -70px auto calc(18px * var(--sp, 1)); border: 5px solid #fff; width: 132px; height: 132px; box-shadow: 0 6px 16px rgba(0,0,0,.12); position: relative; }
.rs-t-canvas .rs-side-art + .rs-sec { margin-top: calc(18px * var(--sp, 1)); }
.rs-t-canvas .rs-side .rs-h { text-transform: uppercase; letter-spacing: .1em; font-size: .86em; }
.rs-t-canvas .rs-head { padding: 0 0 calc(16px * var(--sp, 1)); border-bottom: 3px solid var(--a); margin-bottom: 4px; }
.rs-t-canvas .rs-name { font-size: 2.4em; font-weight: 800; }
.rs-t-canvas .rs-main .rs-h { font-size: 1.12em; }

/* ───────── 21. Corner: artwork in the corners ───────── */
.rs-t-corner { overflow: hidden; }
.rs-corner { position: absolute; width: 330px; height: 250px; background-image: var(--art-corner); background-repeat: no-repeat; background-size: 330px 250px; pointer-events: none; }
.rs-corner-a { top: 0; right: 0; }
.rs-corner-b { bottom: 0; left: 0; transform: rotate(180deg); width: 220px; height: 170px; background-size: 220px 170px; opacity: .8; }
.rs-t-corner .rs-head { position: relative; flex-direction: row; padding-right: 250px; padding-top: calc(52px * var(--sp, 1)); }
.rs-t-corner .rs-name { font-size: 2.7em; font-weight: 800; letter-spacing: -.02em; color: var(--a-text); }
.rs-t-corner .rs-role { color: var(--ink); font-weight: 500; }
.rs-t-corner .rs-photo { border: 4px solid var(--a20); }
.rs-t-corner .rs-main { position: relative; }
.rs-t-corner .rs-h { display: inline-block; font-size: 1.12em; padding-bottom: 3px; border-bottom: 3px solid var(--a40); }

/* ───────── 22. Portrait: large framed photo ───────── */
.rs-t-portrait .rs-head-portrait { background-color: var(--a5); background-image: var(--art-ac); background-size: cover; padding: calc(36px * var(--sp, 1)) 52px; gap: 30px; align-items: center; border-bottom: 4px solid var(--a); margin-bottom: calc(8px * var(--sp, 1)); }
.rs-t-portrait .rs-photo-portrait { width: 150px; height: 178px; border-radius: 16px; border: 5px solid #fff; box-shadow: 0 8px 22px rgba(0,0,0,.16); }
.rs-portrait-mono { width: 150px; height: 178px; border-radius: 16px; background: var(--a); color: var(--on-a); display: flex; align-items: center; justify-content: center; font-size: 3.6em; font-weight: 800; letter-spacing: .02em; flex-shrink: 0; border: 5px solid #fff; box-shadow: 0 8px 22px rgba(0,0,0,.16); }
.rs-t-portrait .rs-name { font-size: 2.7em; font-weight: 800; letter-spacing: -.02em; }
.rs-t-portrait .rs-role { font-size: 1.2em; }
.rs-t-portrait .rs-contacts { flex-direction: column; gap: 4px; margin-top: 14px; color: var(--ink); }
.rs-t-portrait .rs-h { display: flex; align-items: center; gap: 8px; }
.rs-t-portrait .rs-h::before { content: ''; width: 18px; height: 4px; border-radius: 2px; background: var(--a); }

/* ───────── 23. Ribbon: colour ribbon headings ───────── */
.rs-strip { height: 30px; background-color: var(--a); background-image: var(--art-on); background-size: cover; }
.rs-t-ribbon .rs-head { flex-direction: column; text-align: center; padding-top: calc(28px * var(--sp, 1)); }
.rs-t-ribbon .rs-name { font-size: 2.5em; font-weight: 800; letter-spacing: .01em; }
.rs-t-ribbon .rs-contacts { justify-content: center; }
.rs-t-ribbon .rs-photo { border: 4px solid var(--a20); }
.rs-t-ribbon .rs-h { display: inline-block; background: var(--a); color: var(--on-a); margin-left: -52px; padding: 5px 22px 5px 52px; border-radius: 0 30px 30px 0; font-size: 1em; letter-spacing: .06em; text-transform: uppercase; }
.rs-t-ribbon .rs-sec + .rs-sec { margin-top: calc(18px * var(--sp, 1)); }
/* Corner: keep the text clear of the artwork */
.rs-t-corner .rs-head { min-height: 210px; align-items: flex-start; }
.rs-t-corner .rs-main { z-index: 1; }
.rs-t-portrait .rs-sec-skills .rs-skill-meter { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 28px; }
.rs-corner-b { width: 160px; height: 120px; background-size: 160px 120px; opacity: .45; }

/* ============================================================
   v9: paper sizes, signature, CV sections, cover letter,
   and new high-end / student layouts
   ============================================================ */
.rs.rs-paper-letter { width: 816px; min-height: 1056px; }

/* Shared two-column block for short sections */
.rs-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; }
.rs-grid2 .rs-langs { grid-template-columns: 1fr !important; }

/* Signature at the bottom of the page */
.rs.rs-has-sign { display: flex; flex-direction: column; }
.rs.rs-has-sign > .rs-main, .rs.rs-has-sign .rs-cols > .rs-main { flex: 1; display: flex; flex-direction: column; }
.rs.rs-has-sign > .rs-cols { flex: 1; }
.rs-sign { margin-top: auto; padding-top: calc(26px * var(--sp, 1)); break-inside: avoid; page-break-inside: avoid; }
.rs-decl { margin-bottom: 18px; }
.rs-decl .rs-p { font-size: .95em; }
.rs-sign-row { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; }
.rs-sign-box { width: 42%; min-width: 0; }
.rs-sign-auth { text-align: right; }
.rs-sign-space { height: 44px; }
.rs-sign-img { display: block; height: 52px; max-width: 220px; object-fit: contain; margin-bottom: -4px; }
.rs-sign-auth .rs-sign-img { margin-left: auto; }
.rs-sign-line { border-top: 1.5px solid var(--ink); opacity: .8; }
.rs-sign-name { font-weight: 700; margin-top: 6px; }
.rs-sign-label { color: var(--muted); font-size: .9em; }
.rs-sign-meta { color: var(--muted); font-size: .88em; margin-top: 4px; }

/* CV-only sections */
.rs-dl { display: grid; grid-template-columns: auto 1fr; gap: 3px 16px; }
.rs-dl dt { color: var(--muted); font-weight: 600; }
.rs-dl dd { margin: 0; }
.rs-side .rs-dl { grid-template-columns: 1fr; gap: 0; }
.rs-side .rs-dl dd { margin-bottom: 6px; }
.rs-refs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 28px; }
.rs-ref { break-inside: avoid; }

/* Cover letter */
.rs-letter { padding-top: calc(10px * var(--sp, 1)); font-size: 1.04em; line-height: 1.6; }
.rs-letter p { margin: 0 0 calc(12px * var(--sp, 1)); }
.rs-l-date { color: var(--muted); }
.rs-l-to { margin-top: 6px !important; }
.rs-l-subject { font-weight: 700; color: var(--a-text); }
.rs-l-greet { margin-top: 6px !important; }
.rs-l-close { margin-top: calc(20px * var(--sp, 1)); }
.rs-l-close .rs-sign-img { margin: 4px 0 2px; }
.rs-l-name { font-weight: 700; }
.rs-empty-text { color: var(--muted); font-style: italic; }

/* ───────── 24. Aurora: gradient header with glass chips ───────── */
.rs-t-aurora .rs-head-hero { background: linear-gradient(120deg, var(--a) 0%, var(--a-2) 100%); color: #fff; padding: calc(44px * var(--sp, 1)) 52px calc(40px * var(--sp, 1)); gap: 28px; position: relative; }
.rs-t-aurora.rs-has-art .rs-head-hero { background-image: var(--art-on), linear-gradient(120deg, var(--a) 0%, var(--a-2) 100%); background-size: cover, auto; }
.rs-t-aurora .rs-name { font-size: 2.8em; font-weight: 800; letter-spacing: -.02em; color: #fff; }
.rs-t-aurora .rs-role { color: rgba(255,255,255,.88); font-weight: 500; font-size: 1.2em; }
.rs-t-aurora .rs-head-hero .rs-contacts { gap: 8px; margin-top: 16px; color: #fff; }
.rs-t-aurora .rs-head-hero .rs-ci { background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.35); border-radius: 999px; padding: 4px 12px; }
.rs-t-aurora .rs-head-hero .rs-ico svg { fill: #fff; }
.rs-t-aurora .rs-head-hero .rs-photo { order: 2; width: 128px; height: 128px; border: 4px solid rgba(255,255,255,.85); box-shadow: 0 10px 26px rgba(0,0,0,.22); }
.rs-t-aurora .rs-main { padding-top: calc(14px * var(--sp, 1)); }
.rs-t-aurora .rs-h { display: flex; align-items: center; gap: 10px; font-size: 1.15em; color: var(--ink); }
.rs-t-aurora .rs-h::before { content: ''; width: 12px; height: 12px; border-radius: 4px; background: linear-gradient(135deg, var(--a), var(--a-2)); }
.rs-t-aurora .rs-tag { background: var(--a10); color: var(--a-dark); border-radius: 999px; }
.rs-t-aurora .rs-date { background: var(--a5); border-radius: 999px; padding: 1px 10px; color: var(--a-text); font-weight: 600; }

/* ───────── 25. Cardstack: sections on white cards ───────── */
.rs-t-cardstack { background: var(--a5); padding-bottom: 24px; }
.rs-t-cardstack .rs-head { background: #fff; margin: 24px 28px 0; border-radius: 14px; padding: 26px 28px; border: 1px solid var(--a10); box-shadow: 0 2px 10px rgba(15,23,42,.06); border-top: 5px solid var(--a); }
.rs-t-cardstack .rs-name { font-size: 2.4em; font-weight: 800; letter-spacing: -.02em; }
.rs-t-cardstack .rs-photo { border-radius: 14px; }
.rs-t-cardstack .rs-main { padding: 0 28px; }
.rs-t-cardstack .rs-sec, .rs-t-cardstack .rs-sign { background: #fff; border-radius: 14px; padding: calc(16px * var(--sp, 1)) 22px; margin-top: calc(12px * var(--sp, 1)); border: 1px solid var(--a10); box-shadow: 0 2px 10px rgba(15,23,42,.05); }
.rs-t-cardstack .rs-h { font-size: 1.08em; display: flex; align-items: center; gap: 8px; }
.rs-t-cardstack .rs-h::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--a); box-shadow: 0 0 0 4px var(--a20); }
.rs-t-cardstack .rs-grid2 { gap: 0 12px; }

/* ───────── 26. Duet: bold name block, two balanced columns ───────── */
.rs-t-duet .rs-head { flex-direction: column; align-items: flex-start; padding-bottom: calc(22px * var(--sp, 1)); border-bottom: 6px solid var(--a); margin: 0 52px; padding-left: 0; padding-right: 0; }
.rs-t-duet .rs-name { font-size: 3em; font-weight: 800; letter-spacing: -.03em; line-height: .95; }
.rs-t-duet .rs-role { font-size: 1.25em; color: var(--a-text); }
.rs-t-duet .rs-head .rs-contacts { margin-top: 14px; }
.rs-t-duet .rs-photo { display: none; }
.rs-t-duet .rs-cols .rs-main { padding: calc(24px * var(--sp, 1)) 28px 40px 52px; }
.rs-t-duet .rs-side { width: 36%; padding: calc(24px * var(--sp, 1)) 52px 40px 28px; border-left: 1px solid var(--line); }
.rs-t-duet .rs-h { text-transform: uppercase; letter-spacing: .14em; font-size: .86em; color: var(--ink); padding-bottom: 6px; border-bottom: 2px solid var(--a); display: inline-block; }

/* ───────── 27. Luxe: elegant serif with monogram ───────── */
.rs-t-luxe { --gold: var(--a); }
.rs-t-luxe .rs-head { flex-direction: column; text-align: center; padding-top: calc(50px * var(--sp, 1)); padding-bottom: calc(22px * var(--sp, 1)); }
.rs-t-luxe .rs-mono { display: flex; width: 64px; height: 64px; border: 1.5px solid var(--a); border-radius: 50%; align-items: center; justify-content: center; color: var(--a-text); font-size: 1.5em; letter-spacing: .08em; margin: 0 auto 12px; }
.rs-t-luxe .rs-head-stack { align-items: center; }
.rs-t-luxe .rs-name { font-size: 2.8em; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; }
.rs-t-luxe .rs-role { color: var(--a-text); letter-spacing: .3em; text-transform: uppercase; font-size: .9em; font-weight: 400; margin-top: 8px; }
.rs-t-luxe .rs-contacts { justify-content: center; margin-top: 14px; }
.rs-t-luxe .rs-ico { display: none; }
.rs-t-luxe .rs-ci + .rs-ci::before { content: '◆'; color: var(--a40); font-size: .6em; margin-right: 12px; }
.rs-t-luxe .rs-photo { border: 2px solid var(--a40); padding: 3px; background: #fff; }
.rs-t-luxe .rs-h { display: flex; align-items: center; justify-content: center; gap: 12px; text-transform: uppercase; letter-spacing: .24em; font-weight: 400; font-size: .92em; color: var(--ink); text-align: center; margin-bottom: 12px; }
.rs-t-luxe .rs-h::before, .rs-t-luxe .rs-h::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--a40)); }
.rs-t-luxe .rs-h::after { background: linear-gradient(90deg, var(--a40), transparent); }
.rs-t-luxe .rs-sec { margin-top: calc(20px * var(--sp, 1)); }
.rs-t-luxe .rs-item-title { letter-spacing: .02em; }
.rs-t-luxe .rs-date { font-style: italic; }

/* ───────── 28. Sleek: charcoal sidebar with accent stripe ───────── */
.rs-t-sleek .rs-side { background: #1f2430; color: #e9edf3; border-right: 6px solid var(--a); }
.rs-t-sleek .rs-side .rs-h { color: #fff; text-transform: uppercase; letter-spacing: .14em; font-size: .82em; }
.rs-t-sleek .rs-side .rs-h::after { content: ''; display: block; width: 28px; height: 3px; background: var(--a); margin-top: 6px; border-radius: 2px; }
.rs-t-sleek .rs-side .rs-contacts, .rs-t-sleek .rs-side .rs-lang-level, .rs-t-sleek .rs-side .rs-item-sub, .rs-t-sleek .rs-side .rs-date, .rs-t-sleek .rs-side .rs-dl dt { color: #b8c0cc; }
.rs-t-sleek .rs-side .rs-ico svg { fill: var(--a40); }
.rs-t-sleek .rs-side .rs-bar { background: rgba(255,255,255,.14); }
.rs-t-sleek .rs-side .rs-bar span { background: var(--a); }
.rs-t-sleek .rs-side .rs-dots i { background: rgba(255,255,255,.18); }
.rs-t-sleek .rs-side .rs-dots i.on { background: var(--a); }
.rs-t-sleek .rs-side .rs-skill-list li::marker { color: var(--a); }
.rs-t-sleek .rs-photo-side { border: 4px solid var(--a); width: 132px; height: 132px; }
.rs-t-sleek .rs-head { padding: 0 0 calc(18px * var(--sp, 1)); }
.rs-t-sleek .rs-name { font-size: 2.9em; font-weight: 800; letter-spacing: -.03em; line-height: 1; }
.rs-t-sleek .rs-role { color: var(--a-text); text-transform: uppercase; letter-spacing: .12em; font-size: .95em; margin-top: 8px; }
.rs-t-sleek .rs-main .rs-h { font-size: 1.1em; text-transform: uppercase; letter-spacing: .08em; padding-left: 12px; border-left: 4px solid var(--a); }

/* ───────── 29. Scholar: for students ───────── */
.rs-t-scholar .rs-head { background: var(--a5); border-bottom: 3px solid var(--a); padding-bottom: calc(24px * var(--sp, 1)); margin-bottom: calc(6px * var(--sp, 1)); }
.rs-t-scholar .rs-name { font-size: 2.5em; font-weight: 800; letter-spacing: -.02em; }
.rs-t-scholar .rs-photo { border-radius: 16px; border: 3px solid #fff; box-shadow: 0 4px 12px rgba(0,0,0,.1); }
.rs-t-scholar .rs-h { font-size: 1.1em; display: flex; align-items: center; gap: 8px; }
.rs-t-scholar .rs-h::after { content: ''; flex: 1; height: 1px; background: var(--a20); }
.rs-t-scholar .rs-sec-education .rs-item { border-left: 3px solid var(--a); padding-left: 12px; }
.rs-t-scholar .rs-sec-projects .rs-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.rs-t-scholar .rs-sec-projects .rs-item { margin: 0 !important; border: 1px solid var(--a20); border-radius: 10px; padding: 10px 12px; background: #fff; }
.rs-t-scholar .rs-sec-projects .rs-item-top { flex-direction: column; gap: 0; }
.rs-t-scholar .rs-sec-certifications .rs-list { display: flex; flex-wrap: wrap; gap: 8px; }
.rs-t-scholar .rs-sec-certifications .rs-item { margin: 0 !important; background: var(--a10); border-radius: 999px; padding: 4px 14px 4px 10px; }
.rs-t-scholar .rs-sec-certifications .rs-item-top { gap: 8px; align-items: center; }
.rs-t-scholar .rs-sec-certifications .rs-item-main { display: flex; gap: 6px; align-items: baseline; }
.rs-t-scholar .rs-sec-certifications .rs-item-title::before { content: '✓ '; color: var(--a-text); }
.rs-t-scholar .rs-sec-certifications .rs-item-title { font-size: .95em; }

/* ───────── 30. Grid Card: for freshers ───────── */
.rs-t-gridcard .rs-head-band { background: var(--a); color: var(--on-a); padding: calc(34px * var(--sp, 1)) 52px; border-radius: 0 0 28px 0; margin-right: 80px; }
.rs-t-gridcard .rs-name { font-size: 2.5em; font-weight: 800; }
.rs-t-gridcard .rs-role, .rs-t-gridcard .rs-head-band .rs-contacts { color: var(--on-a-muted); }
.rs-t-gridcard .rs-head-band .rs-ico svg { fill: var(--on-a); }
.rs-t-gridcard .rs-photo { border: 4px solid #fff; border-radius: 20px; width: 104px; height: 104px; }
.rs-t-gridcard .rs-h { color: var(--a-text); font-size: 1.08em; padding-bottom: 4px; border-bottom: 2px dashed var(--a40); }
.rs-t-gridcard .rs-grid2 { gap: 0 18px; }
.rs-t-gridcard .rs-grid2 .rs-sec { background: var(--a5); border-radius: 12px; padding: 12px 14px; }
.rs-t-gridcard .rs-sec-projects .rs-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.rs-t-gridcard .rs-sec-projects .rs-item { margin: 0 !important; border-left: 3px solid var(--a); padding-left: 10px; }

/* Polish for every template */
.rs-item-title { letter-spacing: -.005em; }
.rs-ul li { line-height: 1.5; }
.rs.rs-has-sign .rs-main { padding-bottom: calc(30px * var(--sp, 1)); }
