/* ============ ResumeFree - styles ============ */
:root{
  --bg:#f4f6fb; --card:#ffffff; --ink:#1a2233; --muted:#667085;
  --brand:#2563eb; --brand-dark:#1d4ed8; --ok:#16a34a; --warn:#d97706; --fail:#dc2626;
  --line:#e4e9f2; --radius:12px; --shadow:0 2px 10px rgba(16,24,40,.06);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  line-height:1.55}
.wrap{max-width:1240px;margin:0 auto;padding:0 18px}
h1,h2,h3{line-height:1.25}
.muted{color:var(--muted)} .small{font-size:.85rem} .center{text-align:center}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- header ---------- */
#siteHeader{background:linear-gradient(135deg,#1e3a8a,#2563eb);color:#fff;padding:18px 0 0}
.header-inner{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{font-size:2rem}
.brand-name{margin:0;font-size:1.5rem;letter-spacing:.2px}
.brand-tag{margin:0;font-size:.85rem;opacity:.85}
.tabs{display:flex;gap:8px}
.tab{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);color:#fff;
  padding:9px 16px;border-radius:999px;cursor:pointer;font-size:.95rem;transition:.15s}
.tab:hover{background:rgba(255,255,255,.25)}
.tab.active{background:#fff;color:var(--brand-dark);font-weight:700}
.free-banner{margin:14px 0 0;background:rgba(0,0,0,.22);text-align:center;font-size:.82rem;
  padding:8px 12px;letter-spacing:.2px}

/* ---------- buttons / inputs ---------- */
.btn{border:1px solid var(--line);background:#fff;color:var(--ink);padding:9px 16px;
  border-radius:9px;cursor:pointer;font-size:.92rem;transition:.15s}
.btn:hover{border-color:var(--brand);color:var(--brand)}
.btn-primary{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:700}
.btn-primary:hover{background:var(--brand-dark);color:#fff}
.btn-ghost{background:#fff}
input[type=text],input[type=email],input[type=tel],textarea,select{
  width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:8px;
  font-size:.92rem;font-family:inherit;background:#fbfcfe;color:var(--ink)}
input:focus,textarea:focus,select:focus{outline:2px solid var(--brand);outline-offset:0;border-color:var(--brand)}
textarea{resize:vertical}
label{display:block;font-size:.88rem;font-weight:600;margin-bottom:10px}
label input,label textarea,label select{font-weight:400;margin-top:5px}
fieldset.card{border:1px solid var(--line);background:var(--card);border-radius:var(--radius);
  padding:18px;margin:0 0 16px;box-shadow:var(--shadow)}
fieldset.card legend{font-weight:800;font-size:1rem;padding:0 8px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
@media(max-width:560px){.grid2{grid-template-columns:1fr}}

/* ---------- builder ---------- */
.tab-panel{display:none;padding:26px 0 40px}
.tab-panel.active{display:block}
.builder-head h2{margin:0 0 4px}
.builder-actions{display:flex;gap:10px;margin:12px 0 4px;flex-wrap:wrap}
.template-picker-wrap{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:18px;margin-bottom:18px;box-shadow:var(--shadow)}
.template-picker-wrap h3{margin:0 0 12px}
.template-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:700px){.template-picker{grid-template-columns:repeat(2,1fr)}}
.tpl-card{background:#fbfcfe;border:2px solid var(--line);border-radius:10px;padding:12px 8px;
  cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;transition:.15s;color:var(--ink)}
.tpl-card:hover{border-color:var(--brand)}
.tpl-card.active{border-color:var(--brand);box-shadow:0 0 0 3px rgba(37,99,235,.15)}
.tpl-card span:last-child{font-size:.78rem;color:var(--muted)}
.tpl-thumb{width:54px;height:70px;border:1px solid var(--line);border-radius:4px;position:relative;overflow:hidden;background:#fff}
.tpl-thumb i{position:absolute;background:#c7d2e8;border-radius:2px}
.tpl-thumb-modern i{left:0;top:0;bottom:0;width:18px;background:var(--brand)}
.tpl-thumb-classic i{left:10px;right:10px;top:12px;height:6px}
.tpl-thumb-minimal i{left:8px;right:8px;top:10px;height:4px}.tpl-thumb-minimal i+i{top:22px}
.tpl-thumb-rtl i{right:0;top:0;bottom:0;width:18px;background:#0d9488}
.picker-options{display:flex;align-items:center;gap:22px;margin-top:14px;flex-wrap:wrap}
.color-label,.size-label{display:flex;align-items:center;gap:8px;margin:0}
.color-label input[type=color]{width:44px;height:32px;padding:2px;border:1px solid var(--line);border-radius:6px;cursor:pointer}
.page-estimate{background:#eef2ff;color:var(--brand-dark);font-weight:700;font-size:.82rem;
  padding:5px 12px;border-radius:999px}

.builder-layout{display:grid;grid-template-columns:minmax(340px,430px) 1fr;gap:20px;align-items:start}
@media(max-width:980px){.builder-layout{grid-template-columns:1fr}}

/* dynamic entries */
.entry{border:1px dashed var(--line);border-radius:10px;padding:14px;margin-bottom:12px;background:#fbfcfe;position:relative}
.entry-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.entry-head strong{font-size:.92rem}
.entry-remove{background:none;border:none;color:var(--fail);cursor:pointer;font-size:.85rem}
.entry .row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0 12px}
@media(max-width:560px){.entry .row3{grid-template-columns:1fr}}
.current-row{display:flex;align-items:center;gap:8px;font-size:.85rem;font-weight:400;margin:4px 0 8px}
.current-row input{width:auto}

/* ---------- preview / resume sheet ---------- */
.preview-col{position:sticky;top:16px}
@media(max-width:980px){.preview-col{position:static}}
.preview-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:10px;flex-wrap:wrap}
.preview-label{font-weight:800}
.sheet{background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:var(--shadow);
  padding:34px 36px;min-height:900px;font-size:.9rem;color:#222;overflow-wrap:break-word}
.sheet.font-s{font-size:.8rem}.sheet.font-l{font-size:1rem}
.sheet h1,.sheet h2,.sheet h3,.sheet p{margin:0}
.sheet ul{margin:4px 0 8px;padding-inline-start:20px}
.sheet li{margin-bottom:3px}
.empty-note{color:#9aa3b5;font-style:italic}

/* template: modern */
.tpl-modern{--accent:#2563eb;display:grid;grid-template-columns:200px 1fr;padding:0;overflow:hidden}
.tpl-modern .rs-side{background:var(--accent);color:#fff;padding:28px 20px}
.tpl-modern .rs-side h3{font-size:.72rem;letter-spacing:1.5px;text-transform:uppercase;
  border-bottom:1px solid rgba(255,255,255,.35);padding-bottom:6px;margin:18px 0 8px}
.tpl-modern .rs-side h3:first-child{margin-top:0}
.tpl-modern .rs-side p,.tpl-modern .rs-side li{font-size:.8rem}
.tpl-modern .rs-side ul{padding-inline-start:16px}
.tpl-modern .rs-main{padding:28px 30px}
.tpl-modern .rs-name{font-size:1.7rem;font-weight:800}
.tpl-modern .rs-title{color:var(--accent);font-weight:700;margin:2px 0 6px}
.tpl-modern .rs-sec{font-size:.85rem;letter-spacing:1.2px;text-transform:uppercase;font-weight:800;
  color:var(--accent);border-bottom:2px solid var(--accent);padding-bottom:4px;margin:16px 0 8px}
.tpl-modern .rs-job-head{display:flex;justify-content:space-between;gap:10px;font-weight:700}
.tpl-modern .rs-dates{color:var(--muted);font-size:.8rem;white-space:nowrap}
.tpl-modern .rs-company{color:var(--muted);font-size:.85rem;margin-bottom:2px}

/* template: classic */
.tpl-classic{font-family:Georgia,"Times New Roman",serif;text-align:left}
.tpl-classic .rs-head{text-align:center;border-bottom:2px solid #333;padding-bottom:12px;margin-bottom:14px}
.tpl-classic .rs-name{font-size:1.9rem}
.tpl-classic .rs-title{font-style:italic;color:#444;margin-top:2px}
.tpl-classic .rs-contact{font-size:.82rem;color:#444;margin-top:6px}
.tpl-classic .rs-sec{font-size:1rem;font-variant:small-caps;letter-spacing:2px;font-weight:700;
  border-bottom:1px solid #999;padding-bottom:3px;margin:16px 0 8px}
.tpl-classic .rs-job-head{display:flex;justify-content:space-between;gap:10px;font-weight:700}
.tpl-classic .rs-dates{font-size:.82rem;color:#555;white-space:nowrap}

/* template: minimal */
.tpl-minimal .rs-name{font-size:1.6rem;font-weight:800;letter-spacing:.3px}
.tpl-minimal .rs-title{color:#444;font-size:.92rem;margin:2px 0 4px}
.tpl-minimal .rs-contact{font-size:.82rem;color:#666}
.tpl-minimal .rs-sec{font-size:.78rem;font-weight:800;letter-spacing:2.5px;text-transform:uppercase;
  color:#111;border-bottom:1px solid #ddd;padding-bottom:5px;margin:18px 0 8px}
.tpl-minimal .rs-job-head{display:flex;justify-content:space-between;gap:10px;font-weight:700}
.tpl-minimal .rs-dates{font-size:.8rem;color:#777;white-space:nowrap}
.tpl-minimal .rs-company{font-size:.85rem;color:#555}

/* template: RTL */
.tpl-rtl{--accent:#0d9488;direction:rtl;text-align:right;display:grid;grid-template-columns:1fr 200px;padding:0;overflow:hidden}
.tpl-rtl .rs-side{background:var(--accent);color:#fff;padding:28px 20px;order:2}
.tpl-rtl .rs-main{padding:28px 30px;order:1}
.tpl-rtl .rs-name{font-size:1.7rem;font-weight:800}
.tpl-rtl .rs-title{color:var(--accent);font-weight:700;margin:2px 0 6px}
.tpl-rtl .rs-sec{font-size:.85rem;font-weight:800;color:var(--accent);
  border-bottom:2px solid var(--accent);padding-bottom:4px;margin:16px 0 8px}
.tpl-rtl .rs-side h3{font-size:.75rem;letter-spacing:1px;border-bottom:1px solid rgba(255,255,255,.35);
  padding-bottom:6px;margin:18px 0 8px}
.tpl-rtl .rs-side h3:first-child{margin-top:0}
.tpl-rtl .rs-side p,.tpl-rtl .rs-side li{font-size:.8rem}
.tpl-rtl ul{padding-inline-start:0;padding-inline-end:20px}
.tpl-rtl .rs-job-head{display:flex;justify-content:space-between;gap:10px;font-weight:700}
.tpl-rtl .rs-dates{color:var(--muted);font-size:.8rem;white-space:nowrap}

/* ---------- ATS ---------- */
.ats-head h2{margin:0 0 4px}
.ats-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:16px 0}
@media(max-width:760px){.ats-grid{grid-template-columns:1fr}}
.ats-box{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}
.ats-actions{display:flex;align-items:center;gap:14px;margin:6px 0 20px;flex-wrap:wrap}
.ats-results{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:24px;box-shadow:var(--shadow);margin-bottom:20px}
.score-wrap{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-bottom:8px;position:relative}
.score-ring{width:120px;height:120px;transform:rotate(-90deg)}
.ring-bg{fill:none;stroke:var(--line);stroke-width:11}
.ring-fg{fill:none;stroke:var(--brand);stroke-width:11;stroke-linecap:round;
  stroke-dasharray:326.7;stroke-dashoffset:326.7;transition:stroke-dashoffset .8s ease,stroke .3s}
.score-num{position:absolute;left:0;width:120px;text-align:center;font-size:1.7rem;font-weight:800}
.score-num small{font-size:.9rem;color:var(--muted)}
.score-verdict{font-weight:700;font-size:1.05rem;margin:0}
.checks{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:10px}
.check{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:#fbfcfe}
.check-head{display:flex;align-items:center;gap:10px;font-weight:700}
.badge{font-size:.75rem;font-weight:800;padding:3px 10px;border-radius:999px;text-transform:uppercase;letter-spacing:.5px}
.badge.pass{background:#dcfce7;color:#15803d}
.badge.warn{background:#fef3c7;color:#b45309}
.badge.fail{background:#fee2e2;color:#b91c1c}
.check .detail{font-size:.87rem;color:var(--muted);margin:6px 0 0}
.check .fix{font-size:.87rem;margin:6px 0 0;padding-inline-start:18px}
.missing-kw{margin-top:18px}
.kw-chips{display:flex;flex-wrap:wrap;gap:8px}
.kw-chips span{background:#fef3c7;border:1px solid #fcd34d;color:#92400e;font-size:.82rem;
  padding:4px 11px;border-radius:999px}

/* ---------- FAQ ---------- */
.faq-list{max-width:820px;display:grid;gap:12px;margin-top:14px}
.faq{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:6px 18px;box-shadow:var(--shadow)}
.faq summary{cursor:pointer;font-weight:700;padding:12px 0;font-size:1rem}
.faq p{margin:0 0 14px;color:#374151}

/* ---------- footer / toast ---------- */
#siteFooter{background:#101828;color:#cbd5e1;padding:26px 0;margin-top:10px}
#siteFooter p{margin:6px 0}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);
  background:#101828;color:#fff;padding:12px 22px;border-radius:10px;font-size:.92rem;
  opacity:0;pointer-events:none;transition:.25s;z-index:99;max-width:90vw;text-align:center}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ============ PRINT - clean PDF ============ */
@page{size:A4;margin:11mm}
@media print{
  body{background:#fff}
  #siteHeader,#siteFooter,.toast{display:none!important}
  .tab-panel{display:none!important}
  #panel-builder{display:block!important;padding:0}
  #panel-builder .builder-head,#panel-builder .template-picker-wrap,
  #panel-builder .form-col,.preview-toolbar,
  .preview-col>p.muted{display:none!important}
  .builder-layout{display:block}
  .preview-col{position:static}
  .sheet{box-shadow:none;border:none;border-radius:0;margin:0;padding:0;
    min-height:auto;width:100%;font-size:9.2pt}
  .sheet.font-s{font-size:8.4pt}.sheet.font-l{font-size:10pt}
  .tpl-modern,.tpl-rtl{grid-template-columns:170px 1fr}
  .tpl-modern .rs-side,.tpl-rtl .rs-side{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .rs-entry{break-inside:avoid}
}