/* Единые переиспользуемые компоненты ABC. Подключается после стилей страниц.
   Локальные файлы отвечают за раскладку; типографику этих ролей не дублировать. */
:root{
 --abc-content-width:1280px;--abc-gutter:56px;--abc-title-size:52px;
 --abc-heading-size:32px;--abc-compact-size:24px;--abc-document-size:26px;
 --abc-display-size:66px;--abc-display-heading:46px;
 --abc-intro-space:40px;--abc-button-size:15px;--abc-faq-size:17px;
}
html body .abc-container{max-width:var(--abc-content-width);width:calc(100% - var(--abc-gutter)*2);margin-inline:auto}
html body .abc-title{font-family:var(--ff-display);font-size:var(--abc-title-size);font-weight:600;line-height:1.12;letter-spacing:-.025em;overflow-wrap:break-word}
html body .abc-title-display{font-size:var(--abc-display-size)}
html body .abc-heading{font-family:var(--ff-display);font-size:var(--abc-heading-size);font-weight:600;line-height:1.2;letter-spacing:-.025em}
html body .abc-heading-compact{font-size:var(--abc-compact-size);line-height:1.3}
html body .abc-heading-document{font-size:var(--abc-document-size);line-height:1.35}
html body .abc-heading-display{font-size:var(--abc-display-heading);line-height:1.15}
html body .abc-intro{padding-block:var(--abc-intro-space)}
/* Кнопка обычная и компактная. Цвет и фокус — существующие общие варианты. */
html body .btn.btn{font-family:var(--ff-body);font-size:var(--abc-button-size);font-weight:600;line-height:1.25;letter-spacing:0;padding:12px 22px;min-height:48px;border-radius:var(--r-sm);gap:12px;text-align:center;white-space:normal;max-width:100%}
html body .btn.btn-sm{font-size:13px;min-height:44px;padding:10px 16px}
/* Один нативный FAQ: работает с клавиатуры и без JavaScript.
   Старые .ans/.ans-wrap оставлены только как совместимые обёртки содержимого. */
html body .abc-faq-item{border:0;border-bottom:1px solid var(--ink-line);border-radius:0;background:transparent;margin:0;padding:0}
html body .abc-faq-item>summary{display:flex;justify-content:space-between;align-items:center;gap:24px;list-style:none;cursor:pointer;font:500 var(--abc-faq-size)/1.5 var(--ff-body);letter-spacing:0;color:var(--ink);padding:20px 0;background:transparent}
html body .abc-faq-item>summary::-webkit-details-marker{display:none}
html body .abc-faq-item>summary::after{content:"+";font:400 24px/1 var(--ff-body);width:24px;flex:none;text-align:center}
html body .abc-faq-item[open]>summary::after{content:"−"}
html body .abc-faq-item>summary:hover{color:var(--coral-600)}
html body .abc-faq-item>summary :is(.sym,svg){display:none}
html body .abc-faq-item .ans-wrap{display:block}
html body .abc-faq-item :is(.ans-inner,.ans){overflow:visible}
html body .abc-faq-item :is(.ans,p){font:400 15px/1.75 var(--ff-body);letter-spacing:0;color:var(--ink-mute);margin:0;padding:0 0 24px}
html body .abc-faq-item .ans p{padding:0}
html body .faq-list:has(>.abc-faq-item){background:transparent;border:0;border-radius:0;overflow:visible}
@media(max-width:1100px){:root{--abc-gutter:32px;--abc-title-size:44px;--abc-display-size:52px;--abc-display-heading:36px}}
@media(max-width:760px){:root{--abc-gutter:20px;--abc-title-size:36px;--abc-heading-size:28px;--abc-compact-size:22px;--abc-document-size:23px;--abc-display-size:40px;--abc-display-heading:32px;--abc-intro-space:28px;--abc-faq-size:16px}}
@media(max-width:380px){:root{--abc-title-size:32px;--abc-display-size:36px}}
/* Информационная карточка. Акцентная верхняя граница остаётся вариантом страницы. */
html body .abc-panel{border-radius:var(--r-md);padding:32px;background:var(--paper-3)}
html body .abc-panel-title{font:600 var(--abc-compact-size)/1.3 var(--ff-display);letter-spacing:-.025em}
html body .abc-lead{font:400 18px/1.7 var(--ff-body);color:var(--ink-soft)}
@media(max-width:760px){html body .abc-panel{padding:24px}html body .abc-lead{font-size:16px}}
