/* СВЕЧЕНИЕ ИЗ-ПОД КНОПКИ — одна механика на весь сайт.
 *
 * При наведении из-под кнопки проступает цветной ореол по нижней кромке и
 * боковым скруглениям. Рисуется тенями, а не слоем: box-shadow ложится ПОД
 * фон элемента, поэтому свет не заезжает на плашку ни при каком фоне секции
 * и ни при каком transform (псевдоэлемент этого не гарантирует — проверено
 * обоими способами 11.09, оба дают брак).
 *
 * ЗАКОН, ВОКРУГ КОТОРОГО ВСЁ ПОСТРОЕНО: box-shadow интерполируется ТОЛЬКО
 * между списками одинаковой длины и с совпадающими флагами inset. Длины
 * разошлись — браузер переключает значение скачком, и свет не разгорается, а
 * вспыхивает. Поэтому покой обязан держать тот же набор слоёв, что и ховер,
 * только прозрачным. Из этого следуют две вещи:
 *   · собственная тень покоя семейства подмешивается переменной --glow-keep,
 *     и она одинакова в покое и на ховере;
 *   · тёмная и светлая палитры имеют ОДНУ форму (5 слоёв + база), иначе
 *     кнопка, у которой палитра меняется контейнером, снова вспыхнет.
 *
 * Файл подключается ПОСЛЕДНИМ в цепочке (base.html) намеренно: скоуп
 * body:not(.no-glow):not(.studio-mode) даёт 0,3,1 — этого хватает против
 * home.css, а порядок решает ничьи. Выключить свечение на странице — дописать
 * no-glow в её {% block body_class %}.
 */

:root{
  /* Светлая палитра — для кнопок на тёмной подложке: фирменные фиолет и
     зелёный там читаются грязью. Лаванда слева, салат справа. Структура
     повторяет --btn-glow слой в слой, включая подсветы боков. */
  --btn-glow-light:
    -12px 8px 14px -8px  rgba(179,149,219,.85),   /* лаванда, левое крыло */
    -14px 0   18px -12px rgba(179,149,219,.5),    /* и подсвет левого бока */
     -2px 10px 14px -9px rgba(240,220,255,.7),    /* по нижней кромке */
     12px 8px 13px -7px  rgba(230,244,198,.8),    /* салат, правое крыло */
     13px 0   15px -10px rgba(230,244,198,.5);    /* и подсвет правого бока */
  --btn-glow-light-off:
    -12px 8px 14px -8px  rgba(179,149,219,0),
    -14px 0   18px -12px rgba(179,149,219,0),
     -2px 10px 14px -9px rgba(240,220,255,0),
     12px 8px 13px -7px  rgba(230,244,198,0),
     13px 0   15px -10px rgba(230,244,198,0);
  /* подложка под ореолом: фиолетовая база на тёмном читается чёрным пятном */
  --btn-glow-light-base:0 16px 30px -22px rgba(240,220,255,.34);
  --btn-glow-light-base-off:0 16px 30px -22px rgba(240,220,255,0);

  /* Действующая палитра. Тёмные подложки переопределяют эти четыре у себя —
     и все кнопки внутри берут светлый набор по наследованию, без единого
     отдельного правила на каждую. */
  --glow:var(--btn-glow);
  --glow-off:var(--btn-glow-off);
  --glow-base:var(--btn-glow-base);
  --glow-base-off:var(--btn-glow-base-off);
}

/* ── тёмные подложки ──────────────────────────────────────────────────── */
.topbar,
.nx-slide,
.cd,
.pnewsletter{
  --glow:var(--btn-glow-light);
  --glow-off:var(--btn-glow-light-off);
  --glow-base:var(--btn-glow-light-base);
  --glow-base-off:var(--btn-glow-light-base-off);
}

/* ── кто светится ─────────────────────────────────────────────────────── */
/* Точки слайдера, кнопки лайтбокса дипломов и сама плитка диплома сюда
   намеренно не входят: они лежат на фотографии, фон у них полупрозрачный и
   белить его нечем — ореол просвечивал бы внутрь. */
body:not(.no-glow):not(.studio-mode) :is(
  .btn, .nx-btn, .icon-btn, .press-feat__go, .topbar__cta,
  .burger, .to-top, .qs__close, .qs__retry, .nx-arw,
  .cd__close, .cd__cta, .cd__drop, .cline__x,
  .pay-result__details,
  .course-next, .course-resume, .course-nav__cert,
  .nx-social__btn, .nx-gifts__btn, .pgift__btn,
  .reg-close__a, .askfork__i, .orders__pay,
  .cat-chip, .cat-sort, :where(.askfork__x) button, :where(#sup-chat-form) button,
  :where(#sup-chat-fab, #sup-chat-close, #rv-invite-close)
):not(.ckb__ok){
  /* покой = тот же набор, что и ховер, только прозрачный */
  box-shadow:var(--glow-off),var(--glow-base-off) var(--glow-keep,);
  /* opacity и visibility в списке потому, что часть кнопок ими же и
     показывается («Наверх» — visibility:hidden в покое, стрелки слайдера —
     opacity:0 на входе плиты). Перепишешь список без них — кнопка начнёт
     возникать и пропадать рывком: visibility щёлкнет в начале и срежет
     затухание, которое ещё идёт по opacity. */
  transition-property:transform,box-shadow,background-color,border-color,color,opacity,visibility;
  transition-duration:var(--btn-glow-dur);
  transition-timing-function:var(--ease-ui);
}

/* Свет только там, где ховер настоящий: на тач-экране :hover залипает после
   тапа, и ореол горел бы до тапа в другое место. */
@media(hover:hover) and (pointer:fine){
  body:not(.no-glow):not(.studio-mode) :is(
    .btn, .nx-btn, .icon-btn, .press-feat__go, .topbar__cta,
    .burger, .to-top, .qs__close, .qs__retry, .nx-arw,
    .cd__close, .cd__cta, .cd__drop, .cline__x,
    .pay-result__details,
    .course-next, .course-resume, .course-nav__cert,
    .nx-social__btn, .nx-gifts__btn, .pgift__btn,
    .reg-close__a, .askfork__i, .orders__pay,
    .cat-chip, .cat-sort, :where(.askfork__x) button, :where(#sup-chat-form) button,
    :where(#sup-chat-fab, #sup-chat-close, #rv-invite-close)
  ):not(.ckb__ok):hover:not(:disabled):not([aria-disabled="true"]){
    box-shadow:var(--glow),var(--glow-base) var(--glow-keep,);
  }
}

/* Клавиатуре тот же отклик, но ВНЕ медиазапроса: иначе на планшете с
   подключённой клавиатурой фокус нем. */
body:not(.no-glow):not(.studio-mode) :is(
  .btn, .nx-btn, .icon-btn, .press-feat__go, .topbar__cta,
  .burger, .to-top, .qs__close, .qs__retry, .nx-arw,
  .cd__close, .cd__cta, .cd__drop, .cline__x,
  .pay-result__details,
  .course-next, .course-resume, .course-nav__cert,
  .nx-social__btn, .nx-gifts__btn, .pgift__btn,
  .reg-close__a, .askfork__i, .orders__pay,
  .cat-chip, .cat-sort, :where(.askfork__x) button, :where(#sup-chat-form) button,
  :where(#sup-chat-fab, #sup-chat-close, #rv-invite-close)
):not(.ckb__ok):focus-visible:not(:disabled):not([aria-disabled="true"]){
  box-shadow:var(--glow),var(--glow-base) var(--glow-keep,);
}

/* Нажатие сажает кнопку — свет садится с ней. */
body:not(.no-glow):not(.studio-mode) :is(
  .btn, .nx-btn, .icon-btn, .press-feat__go, .topbar__cta,
  .burger, .to-top, .qs__close, .qs__retry, .nx-arw,
  .cd__close, .cd__cta, .cd__drop, .cline__x,
  .pay-result__details,
  .course-next, .course-resume, .course-nav__cert,
  .nx-social__btn, .nx-gifts__btn, .pgift__btn,
  .reg-close__a, .askfork__i, .orders__pay,
  .cat-chip, .cat-sort, :where(.askfork__x) button, :where(#sup-chat-form) button,
  :where(#sup-chat-fab, #sup-chat-close, #rv-invite-close)
):not(.ckb__ok):active:not(:disabled):not([aria-disabled="true"]){
  box-shadow:var(--glow-off),var(--btn-press) var(--glow-keep,);
}

/* Выключенная кнопка не светится. */
body:not(.no-glow):not(.studio-mode) :is(.btn, .nx-btn, .icon-btn):disabled,
body:not(.no-glow):not(.studio-mode) :is(.btn, .nx-btn, .icon-btn)[aria-disabled="true"]{
  box-shadow:none;
}

/* ── собственная тень покоя семейства ─────────────────────────────────── */
/* Запятая живёт ВНУТРИ переменной, и у семейства без остатка var(--glow-keep,)
   подставляет пусто — список тогда кончается на --glow-base-off. Объявлять
   --glow-keep в :root нельзя: она станет всеобщей. И писать её без ведущей
   запятой нельзя тоже — значение станет невалидным, а box-shadow МОЛЧА
   превратится в none, то есть свечение у семейства просто исчезнет. */
body:not(.no-glow):not(.studio-mode) :is(.btn, .nx-btn, .press-feat__go){
  --glow-keep: ,var(--gloss);
}
/* Три кнопки стоят на фоне страницы собственной тенью — она остаётся в обоих
   состояниях, иначе общее правило стёрло бы им высоту над плоскостью:
   стрелка слайдера, «Наверх» и выбранный чип-фильтр каталога. */
body:not(.no-glow):not(.studio-mode) :is(.nx-arw, .to-top, .cat-chip.is-on){
  --glow-keep: ,var(--shadow-sm);
}

/* ── где transform трогать нельзя ─────────────────────────────────────── */
/* Пункты развилки «Задать вопрос» сдвигаются отступом слева — свойство есть
   только у них, и общий список перехода его выбрасывал: сдвиг становился
   мгновенным, а свет рядом шёл мягко. */
body:not(.no-glow):not(.studio-mode) .askfork__i{
  transition-property:box-shadow,background-color,border-color,color,padding-left;
}
/* «Наверх» встаёт над панелью покупки сдвигом translate (to-top.js,
   --corner-lift). Общий список его выбрасывал и по весу перебивал shell.css:
   у подвала кнопка падала на 110 px за кадр, а капсула «Спросить» ехала
   свои .6 с и проходила по ней (r85). Сдвиг — той же кривой и за то же
   время, что у капсулы (support-chat.css). :not(.ckb__ok) — ради веса, как
   у глушилки ниже: без него (0,3,1) проигрывает списку (0,4,1). */
body:not(.no-glow):not(.studio-mode) .to-top:not(.ckb__ok){
  transition-property:transform,box-shadow,background-color,border-color,color,opacity,visibility,translate;
  transition-duration:var(--btn-glow-dur),var(--btn-glow-dur),var(--btn-glow-dur),var(--btn-glow-dur),
    var(--btn-glow-dur),var(--btn-glow-dur),var(--btn-glow-dur),.6s;
  transition-timing-function:var(--ease-ui),var(--ease-ui),var(--ease-ui),var(--ease-ui),
    var(--ease-ui),var(--ease-ui),var(--ease-ui),cubic-bezier(.33,1,.68,1);
}

/* ── прозрачный фон: ореол просвечивал бы внутрь ──────────────────────── */
@media(hover:hover) and (pointer:fine){
  body:not(.no-glow):not(.studio-mode) :is(.icon-btn, .burger, :where(.askfork__x) button):hover{
    background:#fff;border-color:var(--violet);
  }
}
body:not(.no-glow):not(.studio-mode) :is(.icon-btn, .burger, :where(.askfork__x) button):focus-visible{
  background:#fff;border-color:var(--violet);
}

/* ── отклик несёт свет, а не перекраска ──────────────────────────────── */
/* Фиолетовый, перекрашенный в другой фиолетовый, читается миганием поверх
   мягкого ореола. Фон остаётся прежним, меняется только свет. */
/* Только первичная пилюля — та, что и так залита фиолетовым. Шире брать
   нельзя: под .btn ходят и контурные кнопки шапки, и «Принять» в
   cookie-баннере — у них светлый фон и тёмный текст, и заливка фиолетовым
   делает надпись нечитаемой (замер: контраст 13.7 → 1.00). */
@media(hover:hover) and (pointer:fine){
  body:not(.no-glow):not(.studio-mode) .nx-btn--primary:hover{
    background:var(--violet);border-color:var(--violet);
  }
}
body:not(.no-glow):not(.studio-mode) .nx-btn--primary:focus-visible{
  background:var(--violet);border-color:var(--violet);
}

/* ── кнопки, которые ховерятся не собой, а карточкой вокруг ───────────── */
/* «Читать разбор» в ленте статей и кнопка на плите флагманов — это <span>
   внутри ссылки-карточки. Правило на самой кнопке до них не доставало:
   навёл на карточку мимо надписи — кнопка оставалась в покое. */
@media(hover:hover) and (pointer:fine){
  body:not(.no-glow):not(.studio-mode) a.press-feat:hover .press-feat__go,
  body:not(.no-glow):not(.studio-mode) a.nx-slide:hover .nx-slide__cta{
    box-shadow:var(--glow),var(--glow-base) var(--glow-keep,);
  }
  body:not(.no-glow):not(.studio-mode) a.press-feat:hover .press-feat__go{
    background:var(--violet);
  }
}

/* ── кто не светится ──────────────────────────────────────────────────── */
/* Кнопка cookie-баннера светлая и лежит на тёмной плашке: ореол перебивал её
   весом и рисовал тёмное пятно вокруг «Хорошо». Тень снята НА ВСЕХ
   состояниях — покой с семью слоями против ховера без тени сам по себе даёт
   вспышку, а её тут и ловили. */
/* Кнопка выведена из общего списка через :not(.ckb__ok) выше, поэтому здесь
   достаточно перебить базовые .btn-правила из style.css, а не гоняться за
   весом с собственной механикой. */
body:not(.no-glow) .ckb__ok,
body:not(.no-glow) .ckb__ok:hover,
body:not(.no-glow) .ckb__ok:focus-visible,
body:not(.no-glow) .ckb__ok:active{box-shadow:none}

/* ── просивший «без анимаций» получает мгновенный отклик ──────────────── */
@media(prefers-reduced-motion:reduce){
  body:not(.no-glow):not(.studio-mode) :is(
    .btn, .nx-btn, .icon-btn, .press-feat__go, .topbar__cta,
    .burger, .to-top, .qs__close, .qs__retry, .nx-arw,
    .cd__close, .cd__cta, .cd__drop, .cline__x,
    .pay-result__details,
    .course-next, .course-resume, .course-nav__cert,
    .nx-social__btn, .nx-gifts__btn, .pgift__btn,
    .reg-close__a, .askfork__i, .orders__pay,
    .cat-chip, .cat-sort, :where(.askfork__x) button, :where(#sup-chat-form) button,
    :where(#sup-chat-fab, #sup-chat-close, #rv-invite-close)
  /* :not(.ckb__ok) тут не ради смысла, а ради веса: точно такой же хвост
     стоит у правила покоя выше, и без него глушилка (0,3,1) проигрывает ему
     (0,4,1) — просивший «без анимаций» получал полные 420 мс разгорания. */
  ):not(.ckb__ok){transition:none}
}

/* ── стрелочные ссылки: механика своя, скорость общая ─────────────────── */
/* «Пациентам»/«Специалистам», «Записаться на приём», «Читать» на карточке
   статьи — не пилюли, плашки у них нет и ореолу не на чем лежать. Свечения не
   получают по решению владельца; выравниваем только скорость, иначе рядом со
   светящимися соседями их отклик читается рывком. */
body:not(.no-glow):not(.studio-mode) :is(.nx-way, .nx-way__arr, .art-card__go, .rev-go){
  transition-property:transform,background-color,border-color,color,padding-left;
  transition-duration:var(--btn-glow-dur);
  transition-timing-function:var(--ease-ui);
}
/* «Записаться на приём»: круг со стрелкой заливался фиолетовым за .3s
   дефолтной кривой, пока соседние кнопки шли мягкой. Правила .nx-exp__cta-*
   лежат в home.css, поэтому нужен :is() — он добавляет вес и правило
   побеждает, не трогая чужой файл. */
body:not(.no-glow):not(.studio-mode) :is(.nx-exp__cta-arr){
  transition:background var(--btn-glow-dur) var(--ease-ui),
             background-color var(--btn-glow-dur) var(--ease-ui),
             color var(--btn-glow-dur) var(--ease-ui),
             border-color var(--btn-glow-dur) var(--ease-ui),
             transform .55s var(--ease-ui);
}
body:not(.no-glow):not(.studio-mode) :is(.nx-exp__cta-lbl){
  transition:background-size var(--btn-glow-dur) var(--ease-ui),
             color var(--btn-glow-dur) var(--ease-ui);
}
@media(prefers-reduced-motion:reduce){
  body:not(.no-glow):not(.studio-mode) :is(
    .nx-way, .nx-way__arr, .art-card__go, .rev-go, .nx-exp__cta-arr, .nx-exp__cta-lbl
  ){transition:none}
}

/* СТРЕЛКА В КРУЖКЕ — одна на весь сайт (13.10.2026, решение Дани: «в белом
   кружке правильно»). На фиолетовой пилюле кружок белый, на светлой —
   фиолетовый; правый отступ кнопки поджат, кружок садится к краю.
   Разметка: <span class="ab-arr" aria-hidden="true">→</span>, вниз — ab-arr--down.
   Копии в about.css и reviews-page.css грузятся сразу — им первый экран. */
.ab-arr{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;flex:0 0 auto;
  background:var(--violet);color:#fff;font-size:var(--fs-note);line-height:1;font-style:normal;
  transition:transform .4s var(--dl-ease)}
.nx-btn--primary .ab-arr{background:#fff;color:var(--violet)}
.nx-btn:has(.ab-arr){padding-right:11px;gap:14px}
.nx-btn:hover .ab-arr{transform:translateX(2px)}
.nx-btn:hover .ab-arr--down{transform:translateY(2px)}
@media(prefers-reduced-motion:reduce){.ab-arr{transition:none}}
