/* ТЗ-111 — кнопка «Показать ещё». Вторичное действие: контурная, не заливная — заливка синим оставлена кнопке «Купить», иначе они спорят за внимание на одном экране. Цвета взяты из general.css, не подобраны на глаз: #001960 — основной цвет бренда (44 вхождения в стилях), #f5f5f6 и #e1e5f0 — штатные фоны наведения, #a9adb4 — приглушённый текст. */ .pagination--skryta { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } /* Пагинация НЕ display:none и не удаляется из разметки: ссылки page/2/, page/3/ должны остаться доступными роботу, а rel=prev/next в — продолжать работать. Прячем визуально, оставляя в DOM. */ .btn-more-wrap { display: flex; justify-content: center; margin: 32px 0 8px; } .btn-more { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 260px; height: 48px; padding: 0 28px; font-family: inherit; font-size: 15px; font-weight: 500; line-height: 1; color: #001960; background: #fff; border: 1.5px solid #001960; border-radius: 8px; cursor: pointer; transition: background-color .18s ease, color .18s ease, border-color .18s ease; -webkit-appearance: none; appearance: none; } .btn-more:hover { background: #f5f5f6; } .btn-more:active { background: #e1e5f0; } .btn-more:focus-visible { outline: 2px solid #001960; outline-offset: 2px; } .btn-more__count { font-weight: 400; color: #a9adb4; } .btn-more--loading { color: #a9adb4; border-color: #e1e5f0; cursor: default; pointer-events: none; } @media (max-width: 640px) { .btn-more { width: 100%; min-width: 0; } .btn-more-wrap { margin: 24px 0 4px; } }