/* Развилка «или»: форма заявки либо переписка в мессенджере.
   Файл отдельный, а не инлайн в шаблоне: компонент формы кэшируется, и
   инлайновые стили застревали в кэше при уже обновившейся разметке. */


/* ── Согласие на обработку данных ──────────────────────────────────────
   Тема красит всю строку .showcase-form__end в #c0bfbe — это 1,6:1 к фону
   формы, ниже любого порога WCAG, и обе обязательные ссылки («Согласие»,
   «Политика») от обычного текста не отличаются ничем. Файл темы не трогаем:
   перекрываем отсюда селекторами более высокой специфичности, поэтому
   порядок подключения css роли не играет.
   #667085 — 4,5:1 к фону #f4f4f6 (AA для мелкого текста) и при этом заметно
   тише основного текста: строка читаема, но не спорит с полями и кнопкой.
   Не нравится — блок можно удалить целиком, на разметку он не завязан. */
form .showcase-form__end{color:#667085}
form .showcase-form__end a{color:#0f5cc0;text-decoration:underline;
    text-underline-offset:2px;text-decoration-thickness:1px}
form .showcase-form__end a:hover,form .showcase-form__end a:focus{color:#1373eb}
/* Юридическая строка на всю ширину формы (одна строка в ~120 знаков) не
   читается — держим её в пределах 60 знаков. max-width вешаем на .__approve,
   а не на .showcase-form__end: развилка лежит внутри той же строки и обрезалась
   бы вместе с текстом. Во второй модалке («Узнать стоимость») обёртки
   .__approve в разметке нет — там правится шаблоном. */
form .showcase-form__end .showcase-form__approve{max-width:60ch}

/* Плейсхолдеры полей тема красит тем же #c0bfbe — 1,6:1 к белому полю. Подписи
   у полей нет, плейсхолдер её заменяет, поэтому он обязан читаться. */
form .showcase-form__input input::placeholder{color:#667085;opacity:1}
/* Ховер кнопки отправки уводил её в чёрный #262626 — вне палитры и без связи
   с исходным синим. Тот же цвет, что у остальных кнопок сайта в нажатии. */
form .showcase-form__submit input[type="submit"]:hover{background:#0f5cc0}


/* ── Блок развилки ─────────────────────────────────────────────────────
   .showcase-form__end — флекс-СТРОКА с space-between (чекбокс и текст согласия
   по краям). Без переноса развилка встаёт третьей колонкой в этой же строке,
   поэтому родителю разрешаем перенос, а блоку даём целую строку. */
.showcase-form__end{flex-wrap:wrap}
/* Развилка стоит на одном уровне с текстом согласия: он слева, кнопки справа.
   Контейнерные запросы тут не годятся — блок берёт ширину по содержимому, а
   содержимое зависело бы от ширины, поэтому раскладка по медиазапросу. */
.cta-fork{flex:0 1 auto;align-self:center;margin:0}
/* .showcase-form__end — флекс-строка с space-between: согласие уходит влево,
   развилка встаёт справа от него, на одном уровне. Отдельной строкой блок был
   раньше, владелец попросил выровнять по одному уровню с текстом согласия. */


/* ── Раскладка ────────────────────────────────────────────────────────
   «или» вплотную слева от кнопок, вся группа прижата вправо. */
.cta-fork__btns{display:flex;flex-wrap:nowrap;align-items:center;
    gap:12px;justify-content:flex-end}
.cta-fork__or{flex:0 0 auto;color:#475467;font-size:13px;line-height:1;white-space:nowrap}
.cta-fork__pair{display:flex;flex:0 0 auto;gap:10px;flex-wrap:nowrap;min-width:0}

/* min-height вместо height: в модалке ~290px подпись «Узнать цену в Telegram»
   не влезает в строку — пусть переносится на две и кнопка подрастёт, это
   лучше, чем обрезать обещание или прятать кнопку под кнопку. */
.cta-fork__btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
    min-height:50px;padding:8px 18px;border-radius:999px;background:#f5f9ff;color:#0f5cc0;
    border:1.5px solid #1373eb;font-weight:600;font-size:14px;line-height:1.25;
    text-align:center;text-decoration:none;
    transition:background .15s ease,border-color .15s ease}
.cta-fork__btn:hover,.cta-fork__btn:focus{background:#e9f2ff;color:#0f5cc0;
    border-color:#0f5cc0;text-decoration:none}
.cta-fork__btn:focus-visible{outline:3px solid #0f5cc0;outline-offset:3px}
.cta-fork__btn svg{flex:0 0 auto}
.cta-fork__btn>span{text-wrap:balance}
.cta-fork__btn--tg{flex:1 1 auto;min-width:0}
.cta-fork__btn--max{flex:0 0 auto;padding-left:20px;padding-right:20px;white-space:nowrap}

/* Подпись — под кнопками. align-items:flex-start, чтобы галочка держалась
   первой строки, когда текст переносится, а не всплывала в середину блока. */
.cta-fork__trust{display:flex;align-items:flex-start;justify-content:flex-end;gap:8px;
    margin:10px 0 0;color:#475467;font-size:12.5px;line-height:1.4;text-align:right}
.cta-fork__trust svg{flex:0 0 auto;color:#12a150;margin-top:2px}


/* ── Узкий экран ──────────────────────────────────────────────────────
   Тема разворачивает .showcase-form__end в колонку, согласие и развилка идут
   друг под другом. «или» отдельной строкой слева: в одну строку с кнопками оно
   на 375px не помещается и выглядит оторванным заголовком. */
@media (max-width:767px){
    .cta-fork{width:100%;margin-top:14px}
    .cta-fork__btns{flex-wrap:wrap;justify-content:flex-start}
    .cta-fork__or{flex:1 0 100%}
    .cta-fork__pair{flex:1 1 100%}
    .cta-fork__btn{font-size:14px;padding-left:14px;padding-right:14px}
    .cta-fork__btn--tg{flex:1 1 auto}
    .cta-fork__trust{justify-content:flex-start;text-align:left}
}

@media (prefers-reduced-motion:reduce){
    .cta-fork__btn{transition:none}
}