/* Единый блок «Частые вопросы», 15.11.2026. Один вид на всём сайте: услуги, кейсы, блог, страницы.
   Разметка: .lcfq > details > summary + ответ. Собирает mu-plugins/lc-faq.php, раскрытие - js/lc-faq.js.
   Вид блока правится ТОЛЬКО здесь. Образец - «Люкс» (бывший lc-faq-lux.css). Откат: site-files/faq-edinyj/README.md. */
/* :is(:root,#lcfq) даёт правилам вес идентификатора: кейсы и шаблоны услуг пишут свои правила через #lcl и .lclp, общий вид должен быть сильнее */
:root{--fq-ink:#0B0C0E;--fq-paper:#F3EFE7;--fq-paper2:#E9E3D7;--fq-line:rgba(11,12,14,.12);--fq-tx:#1F1E1B;--fq-red:#E2231A;--fq-ease:cubic-bezier(.2,.7,.1,1)}

html:is(:root,#lcfq) body .lcfq.lcfq{display:block;margin:16px 0 0;padding:0;border:0;border-top:1.5px solid var(--fq-ink);background:transparent;box-shadow:none;max-width:none;grid-template-columns:none}
html:is(:root,#lcfq) body .lcfq.lcfq>details{display:block;margin:0;padding:0;border:0;border-bottom:1px solid var(--fq-line);border-radius:0;background:transparent;box-shadow:none}
html:is(:root,#lcfq) body .lcfq.lcfq>details[open]{background:transparent;box-shadow:none;border-radius:0;padding:0}
html:is(:root,#lcfq) body .lcfq.lcfq>details>summary{position:relative;display:block;list-style:none;cursor:pointer;min-height:0;margin:0;padding:24px 60px 24px 0;border:0;background:transparent;
 font:500 clamp(18px,1.15vw,21px)/1.4 LXG,Helvetica,Arial,sans-serif;color:var(--fq-ink);text-transform:none;letter-spacing:normal;transition:padding-left .4s var(--fq-ease)}
html:is(:root,#lcfq) body .lcfq.lcfq>details>summary::-webkit-details-marker{display:none}
html:is(:root,#lcfq) body .lcfq.lcfq>details>summary::marker{content:""}
html:is(:root,#lcfq) body .lcfq.lcfq>details>summary::before{content:none;display:none}
html:is(:root,#lcfq) body .lcfq.lcfq>details>summary::after{content:"";position:absolute;right:0;top:50%;width:36px;height:36px;margin-top:-18px;border:0;border-radius:50%;font-size:0;color:transparent;
 background:linear-gradient(var(--fq-ink),var(--fq-ink)) center/12px 1.5px no-repeat,linear-gradient(var(--fq-ink),var(--fq-ink)) center/1.5px 12px no-repeat,var(--fq-paper2);
 transition:transform .4s var(--fq-ease),background-color .3s}
html:is(:root,#lcfq) body .lcfq.lcfq>details[open]>summary::after{content:"";transform:rotate(45deg)}
html:is(:root,#lcfq) body .lcfq.lcfq>details>summary:focus-visible{outline:2px solid var(--fq-red);outline-offset:4px}

/* ответ: <div class="lcfq__a"> из lc-faq.php или прямой <p>/<div> в шаблонах */
html:is(:root,#lcfq) body .lcfq.lcfq>details>:not(summary){margin:0;padding:0 60px 24px 0;max-width:none;color:var(--fq-tx);font-size:17px;line-height:1.6;background:transparent;border:0}
html:is(:root,#lcfq) body .lcfq.lcfq>details>p{max-width:80ch;margin-top:0!important}
html:is(:root,#lcfq) body .lcfq.lcfq>details>div>p,html:is(:root,#lcfq) body .lcfq.lcfq>details>div>ul,html:is(:root,#lcfq) body .lcfq.lcfq>details>div>ol{margin:0;padding:0;max-width:80ch;color:var(--fq-tx);font-size:17px;line-height:1.6}
html:is(:root,#lcfq) body .lcfq.lcfq>details>div>ul,html:is(:root,#lcfq) body .lcfq.lcfq>details>div>ol{padding-left:1.2em}
html:is(:root,#lcfq) body .lcfq.lcfq>details>div>*+*{margin-top:12px}
html:is(:root,#lcfq) body .lcfq.lcfq>details a{color:inherit;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--fq-red)}
html:is(:root,#lcfq) body .lcfq.lcfq>details[open]>:not(summary){animation:lcfq-in .45s var(--fq-ease) both}

/* наведение, как у строк «Популярные услуги» на главной */
@media (hover:hover){
 html:is(:root,#lcfq) body .lcfq.lcfq>details>summary:hover{padding-left:14px}
 html:is(:root,#lcfq) body .lcfq.lcfq>details>summary:hover::after{background:linear-gradient(var(--fq-paper),var(--fq-paper)) center/12px 1.5px no-repeat,linear-gradient(var(--fq-paper),var(--fq-paper)) center/1.5px 12px no-repeat,var(--fq-ink)}
}
@keyframes lcfq-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (max-width:640px){
 html:is(:root,#lcfq) body .lcfq.lcfq>details>summary{padding-right:52px;font-size:18px}
 html:is(:root,#lcfq) body .lcfq.lcfq>details>:not(summary){padding-right:0}
}
@media (prefers-reduced-motion:reduce){
 html:is(:root,#lcfq) body .lcfq.lcfq>details>summary,html:is(:root,#lcfq) body .lcfq.lcfq>details>summary::after{transition:none}
 html:is(:root,#lcfq) body .lcfq.lcfq>details[open]>:not(summary){animation:none}
 html:is(:root,#lcfq) body .lcfq.lcfq>details>summary:hover{padding-left:0}
}
