/* МурМяу 09.11.2026: гео-блоки главной (geo_metro, geo_cities) — плитки-ссылки в стиле остальных плиток (docs/design-system.md §2).
   Блоки цветов: пиктограмма-мордочка слева (как «М» у метро). Станции: 4 в ряд (20 шт.), города: 5 в ряд (15 шт.); планшет 3, телефон 2. */

.mm-geo {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none; }

.mm-geo_metro {
  grid-template-columns: repeat(4, 1fr); }

.mm-geo_cities {
  grid-template-columns: repeat(5, 1fr); }

/* Блоки цветов (color_kittens, color_cats): до 21 плитки, 4 в ряд, слева цветная точка */
.mm-geo_color {
  grid-template-columns: repeat(4, 1fr); }

.mm-geo__link {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 10px 14px;
  background: var(--content-background-color, #f5f5f5);
  border-radius: 18px;
  box-shadow: 0 2px 12px rgba(26, 63, 122, 0.10);
  color: inherit;
  font-size: .95rem;
  font-weight: 600;
  line-height: 1.25;
  text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease; }

.mm-geo__link:hover,
.mm-geo__link:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 8px 22px rgba(26, 63, 122, 0.18);
  color: #0095d6;
  text-decoration: none; }

.mm-geo__m {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #00B4F5;
  color: #fff;
  font-size: .8rem;
  font-weight: 700; }

/* Пиктограмма окраса: кошачья мордочка, закрашенная цветом (маска-силуэт + фон-окрас). Обводка — drop-shadow на обёртке,
   чтобы белые и светлые окрасы не терялись на светлой плитке. Однотонные цвета — заливка, «с белым»/полосатые/трёхцветные — градиент. */
.mm-geo__dot {
  flex: 0 0 auto;
  position: relative;
  width: 30px;
  height: 30px;
  filter: drop-shadow(0 0 .6px rgba(26, 63, 122, .75)) drop-shadow(0 1px 1px rgba(26, 63, 122, .15)); }

.mm-geo__dot::before {
  content: "";
  position: absolute;
  inset: 0;
  background: #cfcfcf;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M2.6 2.4 9 6.6q3-.8 6 0l6.4-4.2q.9 5.2.3 9.4C21.2 18 17.5 21.6 12 21.6S2.8 18 2.3 11.8q-.6-4.200.3-9.400zM8.600 11.700a1.500 1.900 0 1 0 .01 0zM15.400 11.700a1.500 1.900 0 1 0 .01 0zM10.800 15.500h2.400l-1.200 1.400z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M2.6 2.4 9 6.6q3-.8 6 0l6.4-4.2q.9 5.2.3 9.4C21.2 18 17.5 21.6 12 21.6S2.8 18 2.3 11.8q-.6-4.200.3-9.400zM8.600 11.700a1.500 1.900 0 1 0 .01 0zM15.400 11.700a1.500 1.900 0 1 0 .01 0zM10.800 15.500h2.400l-1.200 1.400z'/%3E%3C/svg%3E") center / contain no-repeat; }

.mm-geo__dot_bielyi::before { background: #fff; }
.mm-geo__dot_biezhievyi::before { background: #e6d2ae; }
.mm-geo__dot_bliu_point::before { background: radial-gradient(circle at 50% 50%, #f1e6d2 45%, #8d9db5 46%); }
.mm-geo__dot_golubo_kriemovyi::before { background: linear-gradient(135deg, #9fb0c4 50%, #f0dcb8 50%); }
.mm-geo__dot_goluboi::before { background: #8fa4bb; }
.mm-geo__dot_dvukhtsvietnyi::before { background: linear-gradient(135deg, #2f2f2f 50%, #fff 50%); }
.mm-geo__dot_dymchatyi::before { background: #6c7078; }
.mm-geo__dot_zolotoi::before { background: #d9a441; }
.mm-geo__dot_mramornyi::before { background: radial-gradient(circle at 30% 30%, #bdbdbd, #7b7b7b 70%); }
.mm-geo__dot_polosatyi::before { background: repeating-linear-gradient(45deg, #5d5d5d 0 4px, #b9b9b9 4px 8px); }
.mm-geo__dot_ryzhii::before { background: #e8832a; }
.mm-geo__dot_ryzhii_s_bielym::before { background: linear-gradient(135deg, #e8832a 50%, #fff 50%); }
.mm-geo__dot_sieriebristyi::before { background: linear-gradient(135deg, #d5d8dd, #a9adb4); }
.mm-geo__dot_sieryi::before { background: #8a8d94; }
.mm-geo__dot_sieryi_s_bielym::before { background: linear-gradient(135deg, #8a8d94 50%, #fff 50%); }
.mm-geo__dot_tabbi::before { background: repeating-linear-gradient(45deg, #5a4630 0 4px, #b08a5a 4px 8px); }
.mm-geo__dot_tighrovyi::before { background: repeating-linear-gradient(45deg, #3a2a1c 0 4px, #e08a2e 4px 8px); }
.mm-geo__dot_triokhtsvietnyi::before { background: conic-gradient(#2f2f2f 0 33%, #e8832a 0 66%, #fff 0); }
.mm-geo__dot_chiernyi::before { background: #222; }
.mm-geo__dot_chiernyi_s_bielym::before { background: linear-gradient(135deg, #222 50%, #fff 50%); }
.mm-geo__dot_chieriepakhovyi::before { background: conic-gradient(#2f2f2f 0 25%, #e8832a 0 50%, #2f2f2f 0 75%, #e8832a 0); }

.mm-geo__text {
  display: flex;
  flex-direction: column;
  min-width: 0; }

.mm-geo__name {
  overflow-wrap: break-word; }

.mm-geo__sub {
  margin-top: 2px;
  font-size: .78rem;
  font-weight: 400;
  opacity: .72; }

/* «Все станции» / «Все города»: кнопка-раскрывашка с полным списком */
.mm-geo-all {
  margin-top: 16px;
  text-align: center; }

.mm-geo-all__btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 11px 24px;
  border-radius: 999px;
  background: #1A3F7A;
  color: #fff;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  list-style: none;
  user-select: none;
  transition: background-color .18s ease; }

.mm-geo-all__btn::-webkit-details-marker {
  display: none; }

.mm-geo-all__btn::after {
  content: "";
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  transition: transform .18s ease; }

.mm-geo-all[open] > .mm-geo-all__btn::after {
  transform: translateY(2px) rotate(-135deg); }

.mm-geo-all__btn:hover,
.mm-geo-all__btn:focus-visible {
  background: #0095d6; }

.mm-geo-all__count {
  padding: 1px 9px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.22);
  font-size: .85rem; }

.mm-geo-all__list {
  columns: 4;
  column-gap: 24px;
  margin: 18px 0 0;
  padding: 18px 22px;
  background: var(--content-background-color, #f5f5f5);
  border-radius: 18px;
  box-shadow: 0 2px 12px rgba(26, 63, 122, 0.10);
  list-style: none;
  text-align: left; }

.mm-geo-all__list li {
  break-inside: avoid;
  padding: 4px 0; }

.mm-geo-all__list a {
  color: inherit;
  text-decoration: none; }

.mm-geo-all__list a:hover,
.mm-geo-all__list a:focus-visible {
  color: #0095d6;
  text-decoration: underline; }

@media (max-width: 991.98px) {
  .mm-geo_metro,
  .mm-geo_cities,
  .mm-geo_color {
    grid-template-columns: repeat(3, 1fr); }
  .mm-geo-all__list {
    columns: 3; } }

@media (max-width: 575.98px) {
  .mm-geo_metro,
  .mm-geo_cities,
  .mm-geo_color {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px; }
  .mm-geo__link {
    gap: 8px;
    min-height: 48px;
    padding: 8px 10px;
    font-size: .85rem; }
  .mm-geo__m {
    width: 22px;
    height: 22px;
    font-size: .7rem; }
  .mm-geo__dot {
    width: 26px;
    height: 26px; }
  .mm-geo-all__list {
    columns: 2;
    column-gap: 16px;
    padding: 14px 16px; } }

@media (max-width: 359.98px) {
  .mm-geo__m,
  .mm-geo__dot {
    display: none; } }

@media (prefers-reduced-motion: reduce) {
  .mm-geo__link,
  .mm-geo-all__btn,
  .mm-geo-all__btn::after {
    transition: none; }
  .mm-geo__link:hover,
  .mm-geo__link:focus-visible {
    transform: none; } }