/* Конструктор резюме — прежней версии сайта. Светлая плоская тема, Signal Blue, Montserrat. Без теней и градиентов. */
:root{
  --ink:#1e2532;--carbon:#0f141e;--pencil:#656e83;--fog:#828ba2;--haze:#9fa6bb;
  --paper:#fff;--mist:#f7f9fc;--lavender:#f4f9fa;--chalk:#d9deeb;--ash:#e7eaf4;
  --blue:#5699d9;--blue-d:#307bb9;--blue-dd:#2a6aa3;--iris:#5699d9;--midnight:#1a1c6a;
  --mint:#e7f4ed;--blush:#ffebe4;--err:#b3261e;
  --r-card:16px;--r-btn:36px;--r-sm:4px;--r-tag:100px;
  --nav-h:64px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Montserrat,"DM Sans",system-ui,sans-serif;color:var(--ink);background:var(--paper);font-size:16px;line-height:1.25;;overflow-x:clip}
a{color:inherit;text-decoration:none}
img{max-width:100%}
button,input,select,textarea{font:inherit;letter-spacing:inherit;color:inherit}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
h1,h2,h3{color:var(--carbon);font-weight:500}
[hidden]{display:none!important}
.skip{position:absolute;left:-9999px;top:8px;background:#fff;padding:10px 16px;border-radius:var(--r-btn);z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:6px}
.eyebrow{font-size:14px;font-weight:600;letter-spacing:.129em;text-transform:uppercase;color:var(--blue-d)}

/* Кнопки */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--blue-d);color:#fff;font-weight:500;font-size:16px;line-height:1;padding:16px 24px;min-height:48px;border-radius:var(--r-btn);border:0;cursor:pointer;transition:background .15s;white-space:nowrap}
.btn:hover{background:var(--blue-dd)}
.btn-sm{padding:12px 20px;font-size:15px;min-height:44px}
.btn-out{display:inline-flex;align-items:center;justify-content:center;background:#fff;color:var(--blue-d);border:1px solid var(--chalk);font-weight:500;font-size:15px;line-height:1;padding:12px 20px;min-height:44px;border-radius:var(--r-btn);cursor:pointer;transition:background .15s,border-color .15s;white-space:nowrap}
.btn-out:hover{background:var(--mist);border-color:var(--blue)}
.ghost,.link{color:var(--blue-d);font-weight:500;padding:8px 4px;background:none;border:0;cursor:pointer;font-size:15px;min-height:44px;display:inline-flex;align-items:center}
.ghost:hover,.link:hover{text-decoration:underline}
.link{min-height:32px;padding:4px;font-size:14px}
button:disabled{opacity:.45;cursor:not-allowed}

/* Шапка и подвал (как на index.html) */
.nav{position:sticky;top:0;z-index:40;background:#fff;border-bottom:1px solid var(--chalk)}
.nav .wrap{height:var(--nav-h);display:flex;align-items:center;gap:32px}
.logo{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:20px;color:var(--carbon);white-space:nowrap}
.logo-ic{width:36px;height:36px;flex:none;display:block}
.logo-lg .logo-ic{width:42px;height:42px}
.menu{display:flex;gap:28px;margin:0 0 0 8px}
.menu a{color:var(--ink)}
.menu a:hover{color:var(--blue-d)}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:16px}
.nav-right .sep{width:1px;height:24px;background:var(--haze)}
footer{border-top:1px solid var(--chalk);padding:48px 0;margin-top:0}
footer .wrap{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap}
footer .tagline{font-size:14px;color:var(--pencil);margin-top:8px}
footer nav{display:flex;gap:24px;color:var(--pencil);flex-wrap:wrap}
@media (max-width:1000px){.menu{display:none}}
@media (max-width:560px){.nav .logo-ic{width:32px;height:32px}.nav .wrap{gap:12px;padding:0 16px}.nav-right .ghost,.nav-right .sep{display:none}}

/* Каркас конструктора */
.ed{max-width:1348px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,560px);gap:32px;padding:0 24px;align-items:start;background:var(--paper)}
.ed-form{padding:40px 0 64px;min-width:0}
.ed-head h1{font-size:40px;line-height:1.07;margin:12px 0 12px}
.ed-head h1 span{color:var(--blue-d)}
.ed-head p{font-size:17px;line-height:1.43;color:var(--pencil);max-width:640px}

.tabs{display:inline-flex;margin:28px 0 20px;background:var(--mist);border:1px solid var(--ash);border-radius:var(--r-tag);padding:4px}
.tabs button{border:0;background:none;color:var(--pencil);font-weight:500;font-size:15px;padding:10px 22px;min-height:44px;border-radius:var(--r-tag);cursor:pointer}
.tabs button[aria-selected="true"]{background:#fff;color:var(--blue-d);outline:1px solid var(--chalk)}

.card{background:#fff;border:1px solid var(--chalk);border-radius:var(--r-card);padding:24px;margin-bottom:16px}
.card h2{font-size:22px;line-height:1.2;font-weight:600;color:var(--ink);margin-bottom:16px}
.note{font-size:14px;line-height:1.43;color:var(--pencil);margin-top:6px}
.err{font-size:14px;line-height:1.43;color:var(--err);margin-top:8px}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px;min-width:0}
.field:last-child{margin-bottom:0}
label{font-size:14px;font-weight:500;color:var(--ink)}
input[type=text],input[type=tel],input[type=email],select,textarea{width:100%;min-height:48px;padding:12px 14px;border:1px solid var(--chalk);border-radius:var(--r-sm);background:#fff;font-size:16px;line-height:1.3;transition:border-color .15s}
textarea{resize:vertical;min-height:96px;line-height:1.43}
input::placeholder,textarea::placeholder{color:#6b7388}
input:hover,select:hover,textarea:hover{border-color:var(--haze)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--blue);outline-offset:0;border-color:var(--blue)}
select{appearance:none;padding-right:36px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%23656e83' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 14px center;cursor:pointer}
select:disabled{background-color:var(--mist);color:var(--pencil)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.grid2.g3{grid-template-columns:1fr 1fr 1fr}
.fields{flex:1;min-width:0}

/* Фото */
.identity{display:flex;gap:20px;align-items:flex-start;margin-bottom:16px}
.photo-box{display:flex;flex-direction:column;align-items:center;gap:4px;flex:none}
.photo-btn{width:124px;height:124px;border-radius:var(--r-card);border:1.5px dashed var(--haze);background:var(--mist);cursor:pointer;display:grid;place-items:center;overflow:hidden;color:var(--pencil);padding:0;transition:border-color .15s}
.photo-btn:hover{border-color:var(--blue)}
.photo-btn.has{border-style:solid;border-color:var(--chalk)}
.photo-btn img{width:100%;height:100%;object-fit:cover;display:block}
.photo-ph{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:13px;line-height:1.25;text-align:center}
.photo-acts{display:flex;gap:4px}
.photo-box.off{opacity:.55}

/* Повторяющиеся записи */
.list{display:flex;flex-direction:column;gap:12px;margin-bottom:12px}
.list:empty{display:none}
.item{border:1px solid var(--ash);background:var(--mist);border-radius:12px;padding:16px}
.item-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
.item-head b{font-size:15px;font-weight:600;color:var(--ink)}
.item-acts{display:flex;gap:4px}
.ib{width:44px;height:44px;border-radius:var(--r-sm);border:1px solid var(--chalk);background:#fff;color:var(--pencil);display:grid;place-items:center;cursor:pointer;transition:border-color .15s,color .15s}
.ib:hover:not(:disabled){border-color:var(--blue);color:var(--blue-d)}
.ib.del:hover:not(:disabled){border-color:var(--err);color:var(--err)}
.ib svg{width:18px;height:18px}
.item .field,.item .grid2{margin-bottom:12px}
.item .field:last-child,.item>.grid2:last-child{margin-bottom:0}
.item .grid2 .field{margin-bottom:12px}
.item .grid2:last-child .field{margin-bottom:0}
.period{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;margin-bottom:12px}
.period fieldset{border:0;min-width:0}
.period legend{font-size:14px;font-weight:500;margin-bottom:6px;padding:0}
.period .pair{display:grid;grid-template-columns:1.3fr 1fr;gap:8px}
.now{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-size:15px;font-weight:400;cursor:pointer;min-height:44px}
.btn-add{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px dashed var(--haze);color:var(--blue-d);font-weight:500;font-size:15px;min-height:48px;padding:12px 20px;border-radius:var(--r-btn);cursor:pointer;transition:border-color .15s,background .15s}
.btn-add:hover{border-color:var(--blue);background:var(--mist)}
.btn-add span{font-size:20px;line-height:1}
.inline-add{display:flex;gap:8px}
.inline-add input{flex:1}

/* Чипы */
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--chalk);background:#fff;border-radius:var(--r-tag);padding:10px 16px;min-height:44px;font-size:14px;font-weight:500;color:var(--ink);cursor:pointer;text-align:left;transition:border-color .15s}
.chip:hover{border-color:var(--blue)}
.chip.on{background:var(--lavender);border-color:var(--chalk);color:var(--ink);cursor:default}
.chips-sel{margin:4px 0 16px}
.chips-sel li{display:inline-flex;align-items:center;border:1px solid var(--chalk);background:var(--lavender);border-radius:var(--r-tag);padding:0 4px 0 16px;min-height:44px;font-size:14px;font-weight:500;gap:2px;cursor:grab}
.chips-sel li.drag{opacity:.4}
.chips-sel li.over{border-color:var(--blue)}
.chips-sel li button{width:36px;height:36px;border:0;background:none;border-radius:50%;cursor:pointer;color:var(--pencil);font-size:20px;line-height:1}
.chips-sel li button:hover{color:var(--err)}
.chips-sel li .mv{display:none;color:var(--blue-d);font-size:22px}
.chips-sel li:focus-within .mv{display:inline-block}
.chips-sel li .mv:hover{color:var(--blue-dd)}
.disc summary{cursor:pointer;color:var(--blue-d);font-weight:500;font-size:15px;min-height:44px;display:flex;align-items:center;list-style:none}
.disc summary::-webkit-details-marker{display:none}
.disc summary::before{content:"+";font-size:20px;margin-right:8px;width:14px}
.disc[open] summary::before{content:"–"}
.disc .chips{margin-top:8px}
.sg{margin-top:12px}
.sg h3{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--pencil);margin-bottom:8px}
.checks{border:0;display:grid;grid-template-columns:1fr 1fr;gap:4px 16px;margin-bottom:16px}
.checks legend{font-size:14px;font-weight:500;margin-bottom:6px;padding:0}
.checks label{display:flex;align-items:center;gap:10px;min-height:44px;font-weight:400;font-size:15px;cursor:pointer}
input[type=checkbox]{width:20px;height:20px;accent-color:var(--blue-d);flex:none;cursor:pointer}
.form-end{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:24px}

/* Переключатели */
.switches{display:flex;flex-direction:column;gap:12px}
.sw{display:flex;align-items:center;gap:16px;border:1px solid var(--ash);background:var(--mist);border-radius:12px;padding:16px;cursor:pointer;min-height:64px;position:relative}
.sw input{position:absolute;opacity:0;width:100%;height:100%;left:0;top:0;margin:0;cursor:pointer}
.sw-t{flex:1;display:flex;flex-direction:column;gap:4px}
.sw-t b{font-size:16px;font-weight:500}
.sw-t small{font-size:14px;color:var(--pencil);line-height:1.35}
.sw-k{width:46px;height:28px;border-radius:14px;background:var(--haze);position:relative;flex:none;transition:background .15s}
.sw-k::after{content:"";position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:transform .15s}
.sw input:checked~.sw-k{background:var(--blue-d)}
.sw input:checked~.sw-k::after{transform:translateX(18px)}
.sw:has(input:focus-visible){outline:2px solid var(--blue);outline-offset:3px}

.lbl{font-size:14px;font-weight:500;color:var(--ink)}
.swatches{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.sw-c{width:44px;height:44px;border-radius:50%;border:2px solid #fff;outline:1px solid var(--chalk);background:var(--c);cursor:pointer;display:grid;place-items:center;color:#fff;font-size:18px;line-height:1;padding:0}
.sw-c[aria-checked="true"]{outline:2px solid var(--ink);outline-offset:1px}
.sw-c:hover{outline-color:var(--blue)}
.sw-auto{border-radius:var(--r-tag);width:auto;padding:0 16px;background:#fff;color:var(--ink);font-size:14px;font-weight:500;border:1px solid var(--chalk)}
.sw-pick{position:relative;width:44px;height:44px;border-radius:50%;border:1px dashed var(--haze);display:grid;place-items:center;color:var(--pencil);cursor:pointer;overflow:hidden;font-size:22px}
.sw-pick input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer;min-height:0;padding:0;border:0}
.sw-pick:has(input:focus-visible){outline:2px solid var(--blue);outline-offset:2px}

/* Галерея шаблонов */
.gal-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:16px}
.gal-head h2{margin-bottom:0}
.gal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tpl{display:flex;flex-direction:column;gap:8px;background:#fff;border:1px solid var(--chalk);border-radius:12px;padding:8px;cursor:pointer;text-align:left;transition:border-color .15s;position:relative;content-visibility:auto;contain-intrinsic-size:auto 260px}
.tpl:hover{border-color:var(--blue)}
.tpl[aria-checked="true"]{border:2px solid var(--blue);padding:7px}
.tpl img{display:block;width:100%;height:auto;aspect-ratio:580/820;border-radius:4px;background:var(--mist);outline:1px solid var(--ash)}
.tpl-live{pointer-events:none;border-radius:4px;overflow:hidden}
.tpl>span{font-size:14px;font-weight:500;padding:0 4px 4px;display:flex;justify-content:space-between;align-items:center;gap:6px}
.tpl .ck{display:none;width:18px;height:18px;border-radius:50%;background:var(--blue-d);color:#fff;place-items:center;font-size:11px}
.tpl[aria-checked="true"] .ck{display:grid}

/* Предпросмотр */
.ed-prev{position:sticky;top:var(--nav-h);height:calc(100vh - var(--nav-h));display:flex;flex-direction:column;padding:24px 0;min-width:0;min-height:0}
.pv-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.pv-meta{display:flex;flex-direction:column;gap:4px;min-width:0}
.pv-meta b{font-size:16px;font-weight:600}
.save{font-size:13px;color:var(--pencil)}
.pv-acts{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pv-stage{flex:1;min-height:0;overflow:auto;background:var(--mist);border:1px solid var(--ash);border-radius:var(--r-card);padding:16px}
.pv-page{width:100%;max-width:560px;margin:0 auto}
.pv-sample{background:var(--lavender);color:var(--ink);border-radius:var(--r-sm);font-size:14px;line-height:1.4;padding:10px 14px;margin:0 auto 12px;max-width:560px}
.pv-warn{background:var(--blush);color:#7a2e12;border-radius:var(--r-sm);font-size:14px;line-height:1.4;padding:10px 14px;margin:12px auto 0;max-width:560px}
@media (min-width:901px){.pv-page{max-width:max(320px,min(560px,calc((100vh - 230px) * .7073)))}}
.pv-page .pgw{outline:1px solid var(--chalk)}

/* Диалоги */
dialog{border:0;border-radius:20px;padding:24px;width:min(480px,calc(100vw - 32px));margin:auto;color:var(--ink);background:#fff}
dialog::backdrop{background:rgba(15,20,30,.55)}
.dlg-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px}
.dlg-head h2{font-size:24px;font-weight:600;color:var(--ink)}
.x{width:44px;height:44px;border-radius:50%;border:1px solid var(--ash);background:var(--mist);font-size:22px;line-height:1;cursor:pointer;color:var(--ink)}
.dlg-acts{display:flex;justify-content:flex-end;gap:12px;margin-top:20px;flex-wrap:wrap}
.dl-opts{display:flex;flex-direction:column;gap:12px;margin-top:16px}
.dl-opts button{display:flex;align-items:center;gap:16px;text-align:left;border:1px solid var(--chalk);background:#fff;border-radius:var(--r-card);padding:16px;cursor:pointer;min-height:72px;transition:border-color .15s}
.dl-opts button:hover{border-color:var(--blue);background:var(--mist)}
.dl-opts b{display:block;font-weight:500;font-size:16px}
.dl-opts small{display:block;font-size:14px;color:var(--pencil);margin-top:4px;line-height:1.35}
.fi{width:52px;height:52px;border-radius:var(--r-sm);background:var(--lavender);color:#3b43b5;display:grid;place-items:center;font-weight:600;font-size:14px;flex:none}
.fi-w{background:var(--mint);color:#1f6b45}
.dl-opts button[aria-busy=true]{opacity:.6}
.crop-stage{margin:12px auto;width:320px;max-width:100%;background:var(--mist);border-radius:12px;overflow:hidden}
.crop-stage canvas{display:block;width:100%;height:auto;touch-action:none;cursor:grab}
.crop-ctl{display:flex;align-items:center;gap:12px;margin:8px 0 12px}
.crop-ctl input{flex:1;accent-color:var(--blue-d);min-height:44px}
.seg{display:inline-flex;background:var(--mist);border:1px solid var(--ash);border-radius:var(--r-tag);padding:4px}
.seg button{border:0;background:none;color:var(--pencil);font-weight:500;font-size:14px;padding:8px 16px;min-height:44px;border-radius:var(--r-tag);cursor:pointer}
.seg button[aria-checked="true"]{background:#fff;color:var(--blue-d);outline:1px solid var(--chalk)}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:90;background:var(--carbon);color:#fff;border-radius:var(--r-btn);padding:14px 22px;font-size:15px;line-height:1.35;max-width:calc(100vw - 32px)}

/* Нижняя панель (только на мобильном) */
.mbar{display:none}

@media (max-width:1180px){.ed{grid-template-columns:minmax(0,1fr) 400px;gap:24px}.gal{grid-template-columns:repeat(2,minmax(0,1fr))}}

@media (max-width:900px){
  .ed{display:block;padding:0 16px}
  .ed-form{padding:24px 0 112px}
  .ed-head h1{font-size:30px}
  .ed-prev{position:static;height:auto;padding:16px 0 112px}
  .ed[data-view="form"] .ed-prev{display:none}
  .ed[data-view="preview"] .ed-form{display:none}
  .pv-stage{overflow:visible;padding:12px}
  .pv-acts{width:100%}
  .pv-acts .btn,.pv-acts .btn-out{flex:1}
  .mbar{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:30;background:#fff;border-top:1px solid var(--chalk);padding:10px 16px calc(10px + env(safe-area-inset-bottom))}
  .mbar button{min-height:48px;border-radius:var(--r-btn);border:1px solid var(--chalk);background:#fff;font-weight:500;font-size:15px;color:var(--ink);cursor:pointer}
  .mbar button[aria-current="page"]{background:var(--lavender);color:#3b43b5;border-color:var(--lavender)}
  .mbar .mb-dl{background:var(--blue-d);color:#fff;border-color:var(--blue-d)}
  footer{padding-bottom:96px}
  .toast{bottom:84px}
}
@media (max-width:900px){.logo{min-height:44px;min-width:44px}footer nav a{display:inline-flex;align-items:center;min-height:44px}footer nav{gap:4px 20px}#dl-open{display:none}.link{min-height:44px;padding:8px 6px}.chips-sel li{padding-right:0}.chips-sel li button{width:44px;height:44px}}
@media (max-width:560px){
  .card{padding:16px}
  .grid2,.grid2.g3,.checks{grid-template-columns:1fr}
  .identity{flex-direction:column;align-items:stretch}
  .photo-box{flex-direction:row;align-items:center;gap:16px}
  .photo-acts{flex-direction:column}
  .period{grid-template-columns:1fr}
  .gal{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .ed-head h1{font-size:28px}
  .tabs{display:flex}
  .tabs button{flex:1;padding:10px 12px}
  footer .wrap{padding:0 16px}
  .inline-add{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important;animation:none!important}}
@media print{body>*:not(.print-only){display:none!important}}

/* Логотип-картинка и начертания Montserrat как на образца */
.logo-img{display:block;width:40px;height:40px;flex:none;object-fit:contain}
.logo-lg .logo-img{width:48px;height:48px}

body{font-family:Montserrat,system-ui,sans-serif;font-weight:400}
h1{font-weight:300!important}
h2{font-weight:400!important}
h3{font-weight:300!important}
h4{font-weight:400!important}
b,strong{font-weight:700}
button,.btn,.btn-sm,.rh-btn,.tag,.seg button,.ghost{font-family:Montserrat,system-ui,sans-serif;font-weight:400}

/* Кнопки в стиле кнопки hero главной */
:root{--r-btn:10px}
.btn{background:#5699d9;font-weight:400;border-radius:10px;transition:.3s}
.btn:hover{background:#307bb9}
.btn-out{background:#f9fcfc;color:#307bb9;border:1px solid #cbe1ef;font-weight:400;border-radius:10px;transition:.3s}
.btn-out:hover{background:#5699d9;color:#fff;border-color:#5699d9}
.btn-add{border-radius:10px;font-weight:400;transition:.3s}
.mbar button{border-radius:10px;font-weight:400}
