/* Template CV (dipakai app.html dan halaman depan) */
/* ============================================================
   TEMPLATE CV
   ============================================================ */
.sheet { position: relative; background: #fff; color: #1b1b1b; -webkit-print-color-adjust: exact; print-color-adjust: exact; --accent: #2f6f4f; --fs: 1; --lh: 1; --tint: color-mix(in srgb, var(--accent) 11%, #fff); --tint2: color-mix(in srgb, var(--accent) 28%, #fff);
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; font-size: calc(10pt * var(--fs)); line-height: calc(1.28 + (var(--lh) - 1) * .4); }
.sheet .si { position: relative; overflow-wrap: anywhere; }
.sheet .si * { min-width: 0; }
.sheet a { color: inherit; text-decoration: none; }
.sheet h1, .sheet h2, .sheet p { margin: 0; }
.cv-head { display: flex; align-items: center; gap: 1.2em; margin-bottom: calc(1em * var(--lh)); }
.cv-id { min-width: 0; flex: 1; }
.cv-photo { width: 5.6em; height: 5.6em; border-radius: 50%; object-fit: cover; flex: none; }
.cv-contact { display: flex; flex-wrap: wrap; gap: .1em .9em; margin-top: .45em; font-size: .94em; }
.ci { max-width: 100%; }
.cv-sec { margin-top: calc(1.05em * var(--lh)); }
.cv-sec h2 { margin-bottom: calc(.45em * var(--lh)); break-after: avoid; }
.cv-entry { margin-bottom: calc(.7em * var(--lh)); break-inside: avoid; }
.cv-entry:last-child { margin-bottom: 0; }
.cv-entry.cv-tight { margin-bottom: calc(.3em * var(--lh)); }
.cv-row { display: flex; justify-content: space-between; gap: 1em; font-weight: 700; }
.cv-l { min-width: 0; } .cv-r { font-weight: 500; white-space: nowrap; flex: none; max-width: 45%; overflow-wrap: anywhere; text-align: right; }
.cv-sub { color: #444; }
.cv-note { color: #555; font-size: .95em; }
.cv-entry ul { margin: .25em 0 0; padding-left: 1.25em; }
.cv-entry li { margin-bottom: calc(.12em * var(--lh)); padding-left: .1em; }
.cv-skills, .cv-langs { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .25em 0; }
.cv-skills li:not(:last-child)::after { content: " · "; white-space: pre; color: #888; }
.cv-langs li { margin-right: 1.4em; } .cv-langs span { color: #555; }
.cv-summary { text-align: left; }

/* --- Classic --- */
[data-template="classic"] { font-family: "Source Serif 4", Georgia, "Times New Roman", serif; }
[data-template="classic"] .cv-head { display: block; text-align: center; padding-bottom: .7em; border-bottom: 1.6px solid var(--accent); }
[data-template="classic"] .cv-photo { margin: 0 auto .6em; display: block; border-radius: 4px; width: 5.2em; height: 6.4em; }
[data-template="classic"] h1 { font-size: 2.2em; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; line-height: 1.1; }
[data-template="classic"] .cv-title { font-style: italic; font-size: 1.1em; margin-top: .2em; color: #333; }
[data-template="classic"] .cv-contact { justify-content: center; }
[data-template="classic"] .ci:not(:last-child)::after { content: "|"; margin-left: .9em; color: #999; }
[data-template="classic"] .cv-contact { gap: .1em .9em; }
[data-template="classic"] .cv-sec h2 { font-size: 1em; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding-bottom: .15em; border-bottom: 1px solid #222; }
[data-template="classic"] .cv-r { font-style: italic; }

/* --- Modern --- */
[data-template="modern"] h1 { font-size: 2.3em; font-weight: 800; letter-spacing: -.02em; line-height: 1.05; color: var(--accent); }
[data-template="modern"] .cv-title { font-size: 1.15em; font-weight: 500; color: #444; margin-top: .25em; }
[data-template="modern"] .cv-head { padding-bottom: .9em; border-bottom: 2.5px solid var(--accent); flex-direction: row-reverse; justify-content: space-between; }
[data-template="modern"] .cv-contact { gap: .25em 1.1em; color: #333; }
[data-template="modern"] .ci::before { content: ""; display: inline-block; width: 1.05em; height: 1.05em; margin-right: .38em; vertical-align: -.17em; background: var(--accent); -webkit-mask: var(--ic) center / contain no-repeat; mask: var(--ic) center / contain no-repeat; }
[data-template="modern"] .ci-phone { --ic: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.6 21 3 13.4 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1z'/%3E%3C/svg%3E"); }
[data-template="modern"] .ci-email { --ic: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4-8 5-8-5V6l8 5 8-5z'/%3E%3C/svg%3E"); }
[data-template="modern"] .ci-loc { --ic: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5.2 7 13 7 13s7-7.8 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E"); }
[data-template="modern"] .ci-link { --ic: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.9 12a3.1 3.1 0 0 1 3.1-3.1h4V7H7a5 5 0 0 0 0 10h4v-1.9H7A3.1 3.1 0 0 1 3.9 12zM8 13h8v-2H8zm9-6h-4v1.9h4a3.1 3.1 0 0 1 0 6.2h-4V17h4a5 5 0 0 0 0-10z'/%3E%3C/svg%3E"); }
[data-template="modern"] .cv-sec h2 { font-size: .86em; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; color: var(--accent); padding-bottom: .3em; border-bottom: 1px solid var(--tint2); }
[data-template="modern"] .cv-sub { color: var(--accent); font-weight: 600; }
[data-template="modern"] .cv-r { color: #666; font-size: .93em; }
[data-template="modern"] .cv-skills { gap: .4em; }
[data-template="modern"] .cv-skills li { padding: .22em .75em; background: var(--tint); border-radius: 999px; font-weight: 600; color: #222; }
[data-template="modern"] .cv-skills li::after { content: none !important; }
[data-template="modern"] .cv-entry li::marker { color: var(--accent); }

/* --- Minimal --- */
[data-template="minimal"] { color: #222; }
[data-template="minimal"] h1 { font-size: 2.1em; font-weight: 300; letter-spacing: -.01em; line-height: 1.1; }
[data-template="minimal"] .cv-title { color: #777; font-size: 1.08em; margin-top: .2em; }
[data-template="minimal"] .cv-head { margin-bottom: calc(1.5em * var(--lh)); }
[data-template="minimal"] .cv-contact { color: #666; font-size: .9em; gap: .1em 1.1em; }
[data-template="minimal"] .cv-sec { margin-top: calc(1.4em * var(--lh)); }
[data-template="minimal"] .cv-sec h2 { font-size: .74em; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; color: var(--accent); }
[data-template="minimal"] .cv-row { font-weight: 600; }
[data-template="minimal"] .cv-r { color: #888; font-size: .92em; }
[data-template="minimal"] .cv-sub { color: #666; }
[data-template="minimal"] .cv-entry li::marker { color: #bbb; }

/* --- Bold --- */
[data-template="bold"] .cv-head { padding: 1.1em 1.3em; margin-bottom: calc(.5em * var(--lh)); background: var(--accent); color: #fff; border-radius: .4em; }
[data-template="bold"] h1 { font-size: 2.2em; font-weight: 800; letter-spacing: -.015em; line-height: 1.05; }
[data-template="bold"] .cv-title { font-size: 1.1em; opacity: .92; margin-top: .2em; }
[data-template="bold"] .cv-contact { opacity: .95; gap: .1em 1.1em; }
[data-template="bold"] .cv-photo { border: 3px solid rgba(255, 255, 255, .85); }
[data-template="bold"] .cv-sec h2 { display: flex; align-items: center; font-size: .92em; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; padding: .15em 0 .15em .6em; border-left: .32em solid var(--accent); background: linear-gradient(90deg, var(--tint), transparent 70%); }
[data-template="bold"] .cv-sub { font-weight: 600; color: var(--accent); }
[data-template="bold"] .cv-skills { gap: .35em; }
[data-template="bold"] .cv-skills li { padding: .2em .7em; background: var(--tint); border: 1px solid var(--tint2); border-radius: .3em; font-weight: 600; }
[data-template="bold"] .cv-skills li::after { content: none !important; }

/* --- Elegant --- */
[data-template="elegant"] { font-family: "Source Serif 4", Georgia, serif; }
[data-template="elegant"] .cv-head { display: block; text-align: center; padding-bottom: .9em; border-bottom: 4px double var(--accent); }
[data-template="elegant"] .cv-photo { margin: 0 auto .6em; display: block; }
[data-template="elegant"] h1 { font-size: 2.35em; font-weight: 500; letter-spacing: .04em; line-height: 1.1; color: var(--accent); font-variant: small-caps; }
[data-template="elegant"] .cv-title { font-style: italic; font-size: 1.12em; margin-top: .25em; color: #444; }
[data-template="elegant"] .cv-contact { justify-content: center; font-size: .92em; }
[data-template="elegant"] .ci:not(:last-child)::after { content: "•"; margin-left: .9em; color: var(--accent); }
[data-template="elegant"] .cv-sec h2 { display: flex; align-items: center; gap: .8em; justify-content: center; font-size: .95em; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--accent); }
[data-template="elegant"] .cv-sec h2::before, [data-template="elegant"] .cv-sec h2::after { content: ""; flex: 1; height: 1px; background: var(--tint2); }
[data-template="elegant"] .cv-row { font-weight: 600; }
[data-template="elegant"] .cv-r { font-style: italic; color: #555; }
[data-template="elegant"] .cv-sub { font-style: italic; }
[data-template="elegant"] .cv-summary { text-align: center; padding: 0 1.5em; }

/* --- Compact --- */
[data-template="compact"] { font-size: calc(9.2pt * var(--fs)); line-height: calc(1.22 + (var(--lh) - 1) * .4); }
[data-template="compact"] .cv-head { align-items: flex-end; gap: 1em; margin-bottom: calc(.5em * var(--lh)); padding-bottom: .55em; border-bottom: 2px solid var(--accent); flex-wrap: wrap; }
[data-template="compact"] .cv-id { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, auto); gap: 0 1em; align-items: end; }
[data-template="compact"] .cv-photo { width: 4.4em; height: 4.4em; }
[data-template="compact"] h1 { font-size: 1.9em; font-weight: 800; letter-spacing: -.015em; line-height: 1.05; }
[data-template="compact"] .cv-title { font-size: 1.05em; color: var(--accent); font-weight: 600; text-align: right; max-width: 22em; }
[data-template="compact"] .cv-contact { grid-column: 1 / -1; margin-top: .35em; gap: .05em .9em; color: #333; }
[data-template="compact"] .cv-sec { margin-top: calc(.75em * var(--lh)); }
[data-template="compact"] .cv-sec h2 { font-size: .86em; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); margin-bottom: calc(.3em * var(--lh)); display: flex; align-items: center; gap: .6em; }
[data-template="compact"] .cv-sec h2::after { content: ""; flex: 1; height: 1px; background: var(--tint2); }
[data-template="compact"] .cv-entry { margin-bottom: calc(.45em * var(--lh)); }
[data-template="compact"] .cv-entry li { margin-bottom: 0; }
[data-template="compact"] .cv-sub { color: #555; }

/* --- Surat lamaran --- */
.cover .si { font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
[data-template="classic"].cover, [data-template="elegant"].cover { font-family: "Source Serif 4", Georgia, serif; }
.cl-head { margin-bottom: 1.6em; padding-bottom: .8em; border-bottom: 2px solid var(--accent); }
.cl-name { font-size: 1.5em; font-weight: 700; color: var(--accent); }
.cl-addr { color: #555; font-size: .95em; }
.cl-date { margin-bottom: 1.2em; }
.cl-rec { margin-bottom: 1.2em; }
.cl-sal { margin-bottom: .9em; }
.cl-body p { margin-bottom: .9em; text-align: left; }
.cl-gap { height: 2.8em; }
.cl-sign { font-weight: 700; }