/* ==========================================================================
   Topline — верхняя сервисная полоса (город / меню / контакты)
   ========================================================================== */

:root{
  --mkf-topline-bg: var(--mkf-surface, #fff);
  --mkf-topline-text: var(--mkf-muted, #6B7280);
  --mkf-topline-link: var(--mkf-on-surface, #111418);
  --mkf-topline-br: var(--mkf-border-subtle, #e5e7eb);
}

/* Bar */
.mkf-topline{
  background: var(--mkf-topline-bg);
  border-bottom: 1px solid var(--mkf-topline-br);
}

/* Layout */
.mkf-topline__inner{
  width: min(96%, 1700px);
  margin-inline: auto;
  padding: 6px 24px;

  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;

  font-size: 13px;
  line-height: 1.2;
  color: var(--mkf-topline-text);
}

/* Columns */
.mkf-topline__left{
  justify-self: start;
  display: inline-flex;
  align-items: center;
}

.mkf-topline__center{
  justify-self: center;
}

.mkf-topline__right{
  justify-self: end;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

/* City */
.mkf-topline__city{
  display: inline-flex;
  align-items: center;
  gap: 6px;

  color: var(--mkf-topline-text);
  text-decoration: none;
  white-space: nowrap;
}
.mkf-topline__city:hover{
  color: var(--mkf-topline-link);
  text-decoration: underline;
}

/* Links (phone / mail) */
.mkf-topline__link{
  display: inline-flex;
  align-items: center;
  gap: 6px;

  color: var(--mkf-topline-link);
  text-decoration: none;
  white-space: nowrap;
  opacity: .9;
}
.mkf-topline__link:hover{
  opacity: 1;
  text-decoration: underline;
}

/* Separator */
.mkf-topline__sep{
  width: 1px;
  height: 14px;
  background: var(--mkf-topline-br);
  display: inline-block;
}

/* Center pill menu */
.mkf-topline__menu{
  display: inline-flex;
  align-items: center;
  gap: 14px;

  padding: 6px 12px;
  border: 1px solid var(--mkf-topline-br);
  border-radius: 999px;
  background: var(--mkf-topline-bg);
}

.mkf-topline__nav{
  color: var(--mkf-topline-text);
  text-decoration: none;
  white-space: nowrap;
}
.mkf-topline__nav:hover{
  color: var(--mkf-topline-link);
  text-decoration: underline;
}

/* SVG icons from sprite */
.mkf-topline__ico{
  color: var(--mkf-topline-text);
  opacity: .9;
}

/* Hover sync: icon follows text */
.mkf-topline__city:hover .mkf-topline__ico,
.mkf-topline__link:hover .mkf-topline__ico{
  color: var(--mkf-topline-link);
  opacity: 1;
}

/* Responsive */
@media (max-width: 900px){
  .mkf-topline__inner{
    grid-template-columns: 1fr auto;
    padding-inline: 12px;
  }

  .mkf-topline__center{
    display: none; /* меню скрываем на мобиле */
  }

  .mkf-topline__right{
    gap: 8px;
  }
}

/* Smaller icons for topline */
.mkf-topline .mkf-ico{
  width: 14px;
  height: 14px;
  vertical-align: -1px;
}