/* Кнопка перехода в DNS на шаге выбора комплекта главной (задача 28064).
   Файл подключается только на главной странице шаблона responsive
   (local/templates/responsive/init.php), поэтому модификатор .btn_dns
   действует только там: фирменные цвета партнёра намеренно не входят в общий
   набор кнопок сайта (css/components.css) и в тему (css/common.css).
   Подключается после components.css — на этом порядке держится переопределение
   горизонтальных отступов .btn_lg. */

.btn_dns {
    /* Опорные цвета градиента DNS. Объявлены на самой кнопке, а не в :root:
       наследуются только внутрь неё и в тему сайта не попадают. */
    --dns-gradient-from: #FC8507;
    --dns-gradient-to: #FFA218;

    background: linear-gradient(0deg, var(--dns-gradient-from), var(--dns-gradient-to));
    color: var(--color-primary-inverse);
    border-color: transparent;
    /* Градиент между значениями background не интерполируется, поэтому переход
       идёт по filter; список переходов .btn заменяется осознанно — ни фон, ни
       цвет, ни рамка при наведении не меняются. */
    transition: filter var(--animate);
    /* Текст длиннее, чем у соседней кнопки: на узком экране отступы .btn_lg
       (0 48px) не оставляют места под строку «Выбрать ещё больше». */
    padding: 0 24px;
}
.btn_dns:hover {
    filter: brightness(0.92);
    color: var(--color-primary-inverse);
}

@media screen and (min-width: 768px) {
    .btn_dns {
        padding: 0 48px;
    }
}