/* Контентные блоки страниц (hero конструктора, SEO-статья, карточка редакции, FAQ). Переменные цветов — из editor.css */

/* Hero конструктора */
.kh{background:var(--mist);padding:56px 0 64px;border-bottom:1px solid var(--ash);overflow:hidden}
.kh .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.kh h1{font-size:50px;line-height:1.04;letter-spacing:.01em;font-weight:500;color:var(--carbon)}
.kh h1 span{color:var(--blue)}
.kh .lead{font-size:18px;line-height:1.5;color:var(--pencil);margin:22px 0 28px;max-width:600px}
.kh-cta{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.kh-facts{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}
.kh-facts li{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--chalk);border-radius:var(--r-tag);padding:9px 14px;font-size:14px;font-weight:500;color:var(--ink)}
.kh-facts li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--blue)}
.kh-facts li.ok::before{background:#2f8f66}
.vframe{position:relative;background:#fff;border:1px solid var(--chalk);border-radius:32px;padding:16px;max-width:480px;justify-self:end;width:100%}
.vframe-inner{border:8px solid var(--blue);border-radius:22px;overflow:hidden;background:var(--mist);aspect-ratio:9/10}
.vframe video,.vframe img{display:block;width:100%;height:100%;object-fit:cover}
.vplay{position:absolute;top:-24px;right:-18px;width:68px;height:68px;border-radius:50%;background:var(--blue);border:6px solid #fff;display:grid;place-items:center;padding-left:4px}
@media (max-width:1000px){.kh .wrap{grid-template-columns:1fr;gap:36px}.vframe{justify-self:center}}
@media (max-width:560px){.kh{padding:36px 0 44px}.kh h1{font-size:33px}.kh .lead{font-size:17px}.vframe{padding:10px;border-radius:24px}.vframe-inner{border-width:5px;border-radius:16px}.vplay{width:50px;height:50px;top:-16px;right:-6px;border-width:4px}}

/* Подзаголовок формы вместо второго H1 */
.ed-head .ed-title{font-size:30px;line-height:1.1;font-weight:500;color:var(--carbon);margin:10px 0 10px;max-width:none}
.ed-head .ed-title span{color:var(--blue-d)}
@media (max-width:560px){.ed-head .ed-title{font-size:24px}}

/* Выбор языка резюме */
.lang-pick{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:16px}
.lp-l{font-size:14px;font-weight:600;color:var(--ink)}
.lp{position:relative}
.lp-btn{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:8px 14px;border:1px solid var(--chalk);border-radius:var(--r-btn);background:#fff;font-weight:500;font-size:15px;color:var(--ink);cursor:pointer;transition:border-color .15s}
.lp-btn:hover,.lp-btn[aria-expanded="true"]{border-color:var(--blue)}
.lp-cur,.lp-menu li{display:inline-flex;align-items:center;gap:10px}
.flag{flex:none;border-radius:2px;display:block}
.lp-ch{color:var(--pencil);transition:transform .2s}
.lp-btn[aria-expanded="true"] .lp-ch{transform:rotate(180deg)}
.lp-menu{position:absolute;z-index:45;top:calc(100% + 6px);left:0;width:260px;max-height:340px;overflow:auto;list-style:none;margin:0;padding:6px;background:#fff;border:1px solid var(--chalk);border-radius:14px;box-shadow:0 16px 40px -18px rgba(15,20,30,.35)}
.lp-menu li{display:flex;width:100%;padding:9px 10px;border-radius:10px;font-size:15px;color:var(--ink);cursor:pointer;min-height:40px}
.lp-menu li:hover,.lp-menu li:focus{background:var(--mist);outline:none}
.lp-menu li[aria-selected="true"]{background:#eef6fe;color:var(--blue-d);font-weight:500}
.lp-note{flex-basis:100%;font-size:13px;color:var(--pencil);line-height:1.4}

/* Окно «Скачать резюме» */
dialog.dlx{padding:24px;width:min(500px,calc(100vw - 32px))}
dialog.dlx[open]{animation:dlIn .22s ease-out}
dialog.dlx[open]::backdrop{animation:dlFade .22s ease-out}
@keyframes dlIn{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes dlFade{from{opacity:0}to{opacity:1}}
.dlx .dlg-head{align-items:flex-start;margin-bottom:18px}
.dlx .dlg-head h2{font-size:24px;line-height:1.15}
.dl-sub{font-size:14px;color:var(--pencil);margin-top:6px;line-height:1.35}
.dlx .x{flex:none;display:grid;place-items:center;background:#fff;border:1px solid var(--chalk);transition:background .15s,border-color .15s,color .15s,transform .12s}
.dlx .x:hover{background:var(--mist);border-color:var(--blue);color:var(--blue)}
.dlx .x:active{transform:scale(.94)}
.dlx .dl-opts{gap:10px;margin-top:0}
.dlx .dl-o{position:relative;display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:1px solid var(--chalk);background:#fff;border-radius:16px;padding:14px 16px;min-height:76px;cursor:pointer;color:var(--ink);transition:border-color .15s,background .15s,transform .12s,box-shadow .15s}
.dlx .dl-o:hover{border-color:var(--blue);background:#f6faff}
.dlx .dl-o:active{transform:scale(.985)}
.dlx .dl-o-main{border-color:var(--blue);box-shadow:0 0 0 3px #e3f0fd}
.dlx .fi{width:46px;height:46px;border-radius:10px;font-size:12px;font-weight:700;letter-spacing:.04em;color:#fff}
.dlx .fi-p{background:#d93a2b}
.dlx .fi-w{background:#2b579a;color:#fff}
.dlx .dl-t{flex:1;min-width:0}
.dlx .dl-t b{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:16px;font-weight:600}
.dlx .dl-t em{font-style:normal;font-size:12px;font-weight:600;color:#1f7a4d;background:var(--mint);padding:3px 8px;border-radius:var(--r-tag)}
.dlx .dl-t small{display:block;font-size:13px;color:var(--pencil);margin-top:4px;line-height:1.35}
.dl-go{flex:none;color:var(--blue);transition:transform .15s}
.dlx .dl-o:hover .dl-go{transform:translateY(2px)}
.dlx .dl-o[aria-busy=true]{opacity:1;pointer-events:none}
.dlx .dl-o[aria-busy=true] .dl-go{opacity:0}
.dlx .dl-o[aria-busy=true]::after{content:"";position:absolute;right:18px;top:50%;width:18px;height:18px;margin-top:-9px;border-radius:50%;border:2px solid #cfe3f8;border-top-color:var(--blue);animation:dlSpin .7s linear infinite}
@keyframes dlSpin{to{transform:rotate(360deg)}}
.dl-safe{display:flex;align-items:center;gap:8px;margin-top:16px;padding-top:14px;border-top:1px solid var(--ash);font-size:13px;color:var(--pencil);line-height:1.4}
.dl-safe svg{flex:none;color:#2f8f66}
@media (max-width:560px){
  dialog.dlx{width:100%;max-width:100%;margin:auto 0 0;border-radius:20px 20px 0 0;padding:20px 16px calc(20px + env(safe-area-inset-bottom))}
  dialog.dlx[open]{animation:dlUp .25s ease-out}
  @keyframes dlUp{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
}
@media (prefers-reduced-motion:reduce){dialog.dlx[open],dialog.dlx[open]::backdrop{animation:none}.dlx .dl-o[aria-busy=true]::after{animation:none}}

/* Подсказки-чипы: выбор и повторное нажатие для отмены */
.ed .chip{transition:border-color .15s,background .15s,color .15s,transform .12s,box-shadow .15s}
.ed .chip:hover{border-color:var(--blue);background:#f6faff}
.ed .chip:active{transform:scale(.97)}
.ed .chip.on{background:#eef6fe;border-color:var(--blue);color:var(--blue-d);cursor:pointer;animation:chipOn .2s ease-out}
.ed .chip.on:hover{background:#fff5f2;border-color:#e0a59b;color:#b4432a}
.ed .chip:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
@keyframes chipOn{0%{transform:scale(.94)}60%{transform:scale(1.03)}100%{transform:none}}

/* Чекбоксы */
.ed input[type=checkbox]:not([role=switch]){appearance:none;-webkit-appearance:none;margin:0;width:22px;height:22px;flex:none;border:1.5px solid var(--haze);border-radius:6px;background:#fff center/14px 14px no-repeat;cursor:pointer;transition:background-color .15s,border-color .15s,box-shadow .15s,transform .12s}
.ed input[type=checkbox]:not([role=switch]):hover{border-color:var(--blue);box-shadow:0 0 0 4px #e9f3fe}
.ed input[type=checkbox]:not([role=switch]):active{transform:scale(.9)}
.ed input[type=checkbox]:not([role=switch]):checked{background-color:var(--blue-d);border-color:var(--blue-d);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");animation:chkPop .22s ease-out}
.ed input[type=checkbox]:not([role=switch]):focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.ed input[type=checkbox]:not([role=switch]):disabled{opacity:.45;cursor:not-allowed}
@keyframes chkPop{0%{transform:scale(.8)}60%{transform:scale(1.1)}100%{transform:none}}
.ed .checks label{padding:0 10px;margin:0 -10px;border-radius:10px;transition:background .15s}
.ed .checks label:hover{background:var(--mist)}
.ed .checks label:has(input:checked) span{color:var(--blue-d);font-weight:500}
.ed label:has(>input[type=checkbox]:not([role=switch])){cursor:pointer}

/* Выпадающие списки */
.ed select{transition:border-color .15s,box-shadow .15s,background-color .15s}
.ed select:hover{border-color:var(--blue);background-color:#fbfdff}
.ed select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px #e3f0fd;background-image: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='%231a91f0' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 6.5l5-5 5 5'/%3E%3C/svg%3E")}
.ed select:focus-visible{outline:2px solid var(--blue);outline-offset:0}
.ed select:has(option:checked:not([value=""])){color:var(--ink)}
.ed select:invalid,.ed select.empty{color:var(--pencil)}
.ed select option{color:var(--ink)}
@media (prefers-reduced-motion:reduce){.ed .chip.on,.ed input[type=checkbox]:not([role=switch]):checked{animation:none}}

/* ===== Остальные элементы редактора: единая схема состояний ===== */
/* Поля ввода */
.ed input[type=text],.ed input[type=tel],.ed input[type=email],.ed textarea,.ed select{border-radius:10px;transition:border-color .15s,box-shadow .15s,background-color .15s}
.ed input[type=text]:hover,.ed input[type=tel]:hover,.ed input[type=email]:hover,.ed textarea:hover{border-color:#9cc8f3}
.ed input[type=text]:focus,.ed input[type=tel]:focus,.ed input[type=email]:focus,.ed textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px #e3f0fd}
.ed input[type=text]:focus-visible,.ed input[type=tel]:focus-visible,.ed input[type=email]:focus-visible,.ed textarea:focus-visible{outline:2px solid var(--blue);outline-offset:0}
.ed .field:focus-within>label{color:var(--blue-d)}
.ed label{transition:color .15s}

/* Вкладки «Содержание / Шаблон» */
.ed .tabs button{transition:background .2s,color .15s,box-shadow .2s,transform .12s}
.ed .tabs button:hover:not([aria-selected="true"]){color:var(--ink);background:rgba(255,255,255,.6)}
.ed .tabs button:active{transform:scale(.97)}
.ed .tabs button[aria-selected="true"]{box-shadow:0 2px 8px -4px rgba(15,20,30,.25)}

/* Карточки разделов и записи */
.ed .card{transition:border-color .2s,box-shadow .2s}
.ed .card:focus-within{border-color:#bcdcf8;box-shadow:0 10px 28px -22px rgba(1,111,208,.5)}
.ed .item{transition:border-color .2s,background .2s}
.ed .list>.item:last-child{animation:itIn .25s ease-out}
.ed .item:focus-within{border-color:#bcdcf8;background:#f8fbff}
@keyframes itIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* Кнопки действий записи (вверх, вниз, удалить) */
.ed .ib{border-radius:10px;transition:border-color .15s,color .15s,background .15s,transform .12s}
.ed .ib:hover:not(:disabled){background:#f6faff}
.ed .ib.del:hover:not(:disabled){background:#fff5f2}
.ed .ib:active:not(:disabled){transform:scale(.9)}
.ed .ib:disabled{opacity:.35;cursor:not-allowed}
.ed .ib:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

/* Кнопка «+ Добавить …» */
.ed .btn-add{transition:border-color .15s,background .15s,color .15s,transform .12s}
.ed .btn-add:hover{border-style:solid;border-color:var(--blue);background:#f6faff}
.ed .btn-add span{display:inline-block;transition:transform .2s}
.ed .btn-add:hover span{transform:rotate(90deg)}
.ed .btn-add:active{transform:scale(.97)}

/* Основные кнопки редактора и предпросмотра */
.btn,.btn-out{transition:background .15s,border-color .15s,color .15s,transform .12s,box-shadow .15s}
.btn:active,.btn-out:active{transform:scale(.97)}
.btn:hover{box-shadow:0 8px 20px -12px rgba(1,111,208,.7)}
.ghost,.link{transition:color .15s,opacity .15s}
.ghost:active,.link:active{opacity:.7}

/* Фото */
.ed .photo-btn{transition:border-color .15s,background .15s,transform .12s}
.ed .photo-btn:hover{background:#f6faff}
.ed .photo-btn:hover .photo-ph svg{transform:translateY(-2px)}
.ed .photo-ph svg{transition:transform .2s}
.ed .photo-btn img{transition:transform .3s}
.ed .photo-btn.has:hover img{transform:scale(1.04)}
.ed .photo-btn:active{transform:scale(.97)}

/* Раскрывающиеся подсказки («Подобрать формулировку», «Подсказки: популярные навыки») */
.ed .disc summary{border-radius:10px;padding:0 8px;margin:0 -8px;transition:background .15s,color .15s}
.ed .disc summary:hover{background:#f6faff}
.ed .disc summary::before{display:inline-block;transition:transform .2s}
.ed .disc[open]>summary::before{transform:rotate(180deg)}
.ed .disc[open]>*:not(summary){animation:itIn .22s ease-out}

/* Выбранные навыки */
.ed .chips-sel li{transition:border-color .15s,background .15s,box-shadow .15s}
.ed .chips-sel li:last-child{animation:chipOn .2s ease-out}
.ed .chips-sel li:hover{border-color:var(--blue)}
.ed .chips-sel li:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px #e3f0fd}
.ed .chips-sel li button{transition:background .15s,color .15s,transform .12s}
.ed .chips-sel li button:hover{background:#ffe9e4}
.ed .chips-sel li button:active{transform:scale(.88)}

/* Переключатели «Фото в резюме», «Опыт работы» */
.ed .sw{transition:border-color .2s,background .2s}
.ed .sw:hover{border-color:#9cc8f3}
.ed .sw:has(input:checked){background:#f2f8fe;border-color:#bcdcf8}
.ed .sw-k{transition:background .2s}
.ed .sw-k::after{box-shadow:0 1px 3px rgba(15,20,30,.25);transition:transform .22s cubic-bezier(.3,1.4,.5,1),width .15s}
.ed .sw:active .sw-k::after{width:26px}
.ed .sw:active input:checked~.sw-k::after{transform:translateX(14px)}

/* Палитра цветов */
.ed .sw-c{transition:transform .15s,outline-color .15s,outline-offset .15s}
.ed .sw-c:hover{transform:scale(1.08)}
.ed .sw-c:active{transform:scale(.94)}
.ed .sw-c[aria-checked="true"]{outline-offset:2px}
.ed .sw-c:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.ed .sw-pick{transition:border-color .15s,color .15s,transform .15s}
.ed .sw-pick:hover{border-color:var(--blue);color:var(--blue);transform:scale(1.06)}

/* Галерея шаблонов */
.ed .tpl{transition:border-color .15s,transform .15s,box-shadow .2s}
.ed .tpl:hover{transform:translateY(-2px);box-shadow:0 12px 24px -16px rgba(15,20,30,.35)}
.ed .tpl:active{transform:scale(.98)}
.ed .tpl[aria-checked="true"]{box-shadow:0 0 0 4px #e3f0fd}
.ed .tpl[aria-checked="true"] .ck{animation:chipOn .22s ease-out}
.ed .tpl:focus-visible{outline:2px solid var(--blue);outline-offset:3px}

@media (prefers-reduced-motion:reduce){.ed .list>.item:last-child,.ed .chips-sel li:last-child,.ed .disc[open]>*:not(summary),.ed .tpl[aria-checked="true"] .ck{animation:none}.ed .tpl:hover,.ed .sw-c:hover,.ed .btn-add:hover span{transform:none}}

/* Нижняя панель редактора прячется, когда редактор не на экране */
.mbar{transition:transform .25s ease}
.mbar.off{transform:translateY(110%);pointer-events:none}

/* Секции контента */
.cs{padding:80px 0}
.cs-mist{background:var(--mist)}
.eyebrow-c{display:block;text-align:center}

/* SEO-статья */
.art{max-width:none}
.art h2{font-size:34px;line-height:1.12;margin:56px 0 16px;color:var(--carbon);font-weight:500}
.art h2:first-child{margin-top:0}
.art h3{font-size:23px;line-height:1.2;font-weight:600;color:var(--ink);margin:36px 0 12px}
.art p{font-size:17px;line-height:1.6;color:var(--ink);margin:0 0 16px}
.art ul,.art ol{list-style:none;margin:0 0 20px;padding-left:0;font-size:17px;line-height:1.6}
.art li{margin-bottom:8px}
.art p,.art li,.art td,.faq-a p,.faq-i summary span{overflow-wrap:anywhere}
.art ul>li{position:relative;padding-left:24px}
.art ul>li::before{content:"";position:absolute;left:4px;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--blue)}
.art ol{counter-reset:st}
.art ol>li{position:relative;counter-increment:st;padding:4px 0 4px 44px;min-height:32px}
.art ol>li::before{content:counter(st);position:absolute;left:0;top:2px;width:30px;height:30px;border-radius:50%;background:#eef6fe;border:1px solid #d6e8fa;color:var(--blue);font-weight:600;font-size:15px;display:grid;place-items:center}
.art a{color:var(--blue-d);text-decoration:underline;text-underline-offset:3px}
.art-tbl{width:100%;overflow-x:auto;margin:8px 0 24px;border:1px solid var(--chalk);border-radius:12px}
.art table{width:100%;border-collapse:collapse;font-size:16px;line-height:1.45;min-width:560px}
.art caption{caption-side:bottom;text-align:left;padding:12px 16px 14px;font-size:14px;line-height:1.45;color:var(--pencil);border-top:1px solid var(--ash);background:var(--mist)}
.art th,.art td{text-align:left;vertical-align:top;padding:12px 16px;border-bottom:1px solid var(--ash)}
.art th{background:var(--mist);font-weight:600;color:var(--carbon)}
.art tr:last-child td{border-bottom:0}
.art td.y{color:#1f7a4d;font-weight:500}
.art td.n{color:#b4432a}
.art figure{margin:8px 0 28px}
.art figure img{display:block;width:100%;height:auto;border-radius:8px;outline:1px solid var(--ash);background:#fff}
.art figcaption{font-size:15px;line-height:1.45;color:var(--pencil);margin-top:12px}
.art .figs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.note{background:var(--lavender);border-radius:var(--r-card);padding:20px 24px;margin:8px 0 24px}
.note-t{font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--iris);margin-bottom:10px}
.art .note p:last-child,.art .note ul:last-child{margin-bottom:0}
@media (max-width:760px){.art .figs{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.cs{padding:56px 0}.art h2{font-size:27px;margin-top:44px}.art h3{font-size:20px}.note{padding:16px}}

/* Иллюстрация «было / стало» */
.ba{display:grid;grid-template-columns:1fr 1fr;gap:16px;background:var(--mist);border:1px solid var(--ash);border-radius:20px;padding:20px}
.ba-card{background:#fff;border:1px solid var(--chalk);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:10px}
.ba-lbl{align-self:flex-start;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:var(--r-tag)}
.ba-bad .ba-lbl{background:var(--blush);color:#b4432a}
.ba-good{border-color:#cfe8da}
.ba-good .ba-lbl{background:var(--mint);color:#1f7a4d}
.ba-head{font-size:15px;color:var(--pencil);line-height:1.4}
.ba-head b{display:block;color:var(--carbon);font-size:17px;font-weight:600}
.ba-line{height:1px;background:var(--ash)}
.art .ba-card p{font-size:16px;line-height:1.5;margin:0}
.art .ba-bad p{color:var(--pencil);font-style:italic}
.art .ba-card ul{margin:0;font-size:16px;line-height:1.5}
.art .ba-good li::before{background:#2f8f66}
.ba-ctx{grid-column:1/-1;font-size:15px;color:var(--ink);line-height:1.45}
.ba-ctx span{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--iris);margin-right:8px}
@media (max-width:700px){.ba{grid-template-columns:1fr;padding:12px}}

/* Карточка редакции */
.author{max-width:880px;margin:0 auto 72px;display:flex;gap:28px;align-items:flex-start;background:#fff;border:1px solid var(--chalk);border-radius:24px;padding:32px;box-shadow:0 12px 32px -20px rgba(26,28,106,.25)}
.author-ph{flex:none;width:96px;height:96px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--iris));display:grid;place-items:center;box-shadow:0 0 0 6px #eef6fe}
.author-ph svg{width:44px;height:44px}
.author-b{flex:1;min-width:0}
.author-name{font-size:24px;font-weight:600;color:var(--carbon);margin:6px 0 10px}
.author-txt{color:var(--ink);font-size:16px;line-height:1.6}
.author-facts{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:20px;padding:0}
.author-facts li{background:var(--mist);border:1px solid var(--ash);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:2px}
.author-facts b{font-size:20px;font-weight:600;color:var(--blue)}
.author-facts span{font-size:13px;color:var(--pencil);line-height:1.3}
@media (max-width:760px){.author{flex-direction:column;align-items:center;text-align:center;padding:24px 20px}.author-facts{grid-template-columns:1fr 1fr}}

/* FAQ */
.faq-head{max-width:760px;margin:0 auto 32px;text-align:center}
.faq-head h2{font-size:40px;line-height:1.07;margin:12px 0 14px}
.faq-head p{font-size:18px;line-height:1.43;color:var(--pencil)}
.faq{max-width:880px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.faq-i{background:#fff;border:1px solid var(--chalk);border-radius:16px;transition:border-color .2s,box-shadow .2s}
.faq-i:hover{border-color:#bcdcf8}
.faq-i[open]{border-color:var(--blue);box-shadow:0 10px 28px -18px rgba(1,111,208,.45)}
.faq-i summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;font-size:18px;font-weight:500;color:var(--carbon);cursor:pointer;list-style:none;min-height:44px}
.faq-i summary::-webkit-details-marker{display:none}
.faq-i summary i{flex:none;position:relative;width:32px;height:32px;border-radius:50%;background:#eef6fe;transition:transform .25s,background .2s}
.faq-i summary i::before,.faq-i summary i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;background:var(--blue);border-radius:2px}
.faq-i summary i::after{transform:rotate(90deg)}
.faq-i[open] summary i{transform:rotate(45deg);background:var(--blue)}
.faq-i[open] summary i::before,.faq-i[open] summary i::after{background:#fff}
.faq-a{padding:0 24px 22px}
.faq-a p{color:var(--ink);font-size:16px;line-height:1.6}
.faq-i[open] .faq-a{animation:faqIn .28s ease-out}
@keyframes faqIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (max-width:560px){.faq-head h2{font-size:28px}.faq-i summary{padding:16px 18px;font-size:16px}.faq-a{padding:0 18px 18px}}

/* Появление при прокрутке (только с JS) */
.js .reveal{opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s ease}
.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none}.faq-i[open] .faq-a{animation:none}}