/* Catalogue cards for the six service hubs. These pages do not load uslugi.html styles. */
body.hub-page .article-body .cat-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin: 20px 0 0 !important;
}

body.hub-page .article-body .svc-card {
  display: flex !important;
  min-width: 0 !important;
  min-height: 116px !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  gap: 18px !important;
  padding: 18px !important;
  border: 1px solid var(--wc-line) !important;
  border-top: 3px solid var(--wc-green) !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: var(--wc-ink) !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: border-color .16s ease, background .16s ease !important;
}

body.hub-page .article-body .svc-card:hover {
  border-color: var(--wc-green) !important;
  background: var(--wc-soft) !important;
}

body.hub-page .article-body .svc-card .t {
  color: var(--wc-ink) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

body.hub-page .article-body .svc-card .p {
  margin: 0 !important;
  color: var(--wc-green) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

@media (max-width: 620px) {
  body.hub-page .article-body .cat-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
    margin-top: 16px !important;
  }

  body.hub-page .article-body .svc-card {
    min-height: 96px !important;
    gap: 14px !important;
    padding: 16px !important;
  }
}
