/* One category component: an edge-to-edge photo and text on the page surface. */
#main .catalog-categories {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: start;
  gap: clamp(36px, 3.5vw, 56px) clamp(20px, 2.5vw, 40px);
  padding: 0 var(--content-inset);
  margin: 0;
}
#main .catalog-category { min-width: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
#main .branch-intro h1 { overflow-wrap: anywhere; }
#main .catalog-category__link { display: block; min-width: 0; color: var(--ink); text-decoration: none; }
#main .catalog-category__image {
  width: 100%;
  aspect-ratio: 7 / 5;
  padding: 0;
  margin: 0 0 18px;
  overflow: hidden;
  border-radius: 18px;
  background: var(--paper);
}
#main .catalog-category__image img { display: block; width: 100%; height: 100%; max-width: none; max-height: none; padding: 0; margin: 0; border-radius: 0; object-fit: cover; object-position: center; transition: transform .35s ease; }
#main .catalog-category__title { margin: 0; font-size: clamp(18px, 1.45vw, 24px); font-weight: 500; line-height: 1.3; letter-spacing: -.025em; overflow-wrap: anywhere; transition: color .2s; }
#main .catalog-category__count { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 14px 0 0; font-size: 14px; line-height: 1.5; color: #6b6b6b; }
#main .catalog-category__count span { font-size: 24px; line-height: 1; color: var(--ink); }
#main .catalog-category__description { margin: 14px 0 0; font-size: 15px; line-height: 1.65; color: #656565; }
#main .catalog-category__link:hover .catalog-category__title, #main .catalog-category__link:focus-visible .catalog-category__title { color: #b83c00; }
#main .catalog-category__link:hover img { transform: scale(1.025); }
#main .catalog-category__link:focus-visible { outline: 2px solid var(--orange); outline-offset: 6px; border-radius: 18px; }
@media (max-width: 1100px) { #main .catalog-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { #main .catalog-categories { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { #main .catalog-category__image img, #main .catalog-category__title { transition: none; } #main .catalog-category__link:hover img { transform: none; } }