/* Shared viewport fixes for the catalogue, news, articles and video page. */
:root { --rail-left: 12px; --rail-size: 54px; --rail-gap: 11px; }
.site { width: 100%; min-width: 0; padding-left: calc(92px + env(safe-area-inset-left, 0px)); padding-right: calc(34px + env(safe-area-inset-right, 0px)); }
.brand > div, .layout > *, .intro > div, .contact-section > *, .map-view > div, .footer-inner > * { min-width: 0; }
.brand-title, .brand-sub, .footer-information p, .article p, .article li { overflow-wrap: anywhere; }
.toolbar-top, .result-heading { flex-wrap: wrap; }
.toolbar-top > strong { min-width: 0; }
.filter-row select, .mobile-categories select { min-width: 0; }
.condition-tabs, .menu-row, .menu-links { min-width: 0; max-width: 100%; }
.condition-tabs button { flex-shrink: 0; }
.section-menu a { min-width: 0; overflow-wrap: anywhere; }
.contact-rail {
  left: calc(var(--rail-left) + env(safe-area-inset-left, 0px));
  top: max(12px, env(safe-area-inset-top, 0px));
  bottom: max(12px, env(safe-area-inset-bottom, 0px));
  transform: none;
  width: calc(var(--rail-size) + 8px);
  gap: var(--rail-gap);
  justify-content: safe center;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  padding: 4px;
}
.rail-item { flex: 0 0 auto; }
.rail-circle { width: var(--rail-size); height: var(--rail-size); flex-shrink: 0; }
dialog { overflow-y: auto; max-height: calc(100dvh - 24px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); }
.quick-dialog { right: auto; bottom: auto; max-width: calc(100vw - 24px); }
.quick-number { white-space: normal; overflow-wrap: anywhere; }
@media (min-width: 1580px) { :root { --rail-left: max(12px, calc((100vw - 1460px) / 2 + 12px)); } }
@media (max-width: 1200px) { .site { padding-left: calc(88px + env(safe-area-inset-left, 0px)); padding-right: calc(24px + env(safe-area-inset-right, 0px)); } }
@media (max-width: 570px) {
  :root { --rail-left: 7px; --rail-size: 46px; --rail-gap: 8px; }
  .site { padding-left: calc(67px + env(safe-area-inset-left, 0px)); padding-right: calc(14px + env(safe-area-inset-right, 0px)); }
}
@media (max-width: 420px) {
  .filter-row { grid-template-columns: 1fr; }
  .map-view { flex-direction: column; }
  .dialog-contacts { grid-template-columns: 1fr; }
}
@media (max-height: 360px) { :root { --rail-size: 44px; --rail-gap: 6px; } }

/* Readable catalogue images and compact screens. */
.card-art.has-photo { height: auto; min-height: 260px; aspect-ratio: 4 / 3; }
.card-art.has-photo .product-preview { position: absolute; inset: 0; width: 100%; height: 100%; padding: 28px 12px 38px; object-fit: contain; }
.card-actions .photo-link { color: var(--blue); font-size: 14px; min-height: 44px; display: inline-flex; align-items: center; text-decoration: underline; text-underline-offset: 3px; }
.card-actions button { min-height: 44px; font-size: 14px; }
.intro p, .card-desc, .contact-section p { font-size: 1rem; }
.parts, .vehicle-line, .field label, .brand-sub, .quick-note { font-size: .875rem; }
.section-menu a, .news-tabs a, .card h3, .quick-top h2 { overflow-wrap: anywhere; }
.news-tabs a { white-space: normal; }
@media (max-width: 570px) {
  .brand-row { min-height: 94px; }
  .logo { width: 52px; height: 52px; }
  .brand-title { font-size: 18px; letter-spacing: 0; }
  .brand-sub { font-size: 14px; }
  .section-menu > .site { gap: 0; }
  .section-menu a { font-size: 15px; padding: 12px 9px; }
  .toolbar { padding: 12px; }
  .card-art.has-photo { min-height: 280px; }
  .condition-tabs { flex-wrap: wrap; overflow: visible; }
  .condition-tabs button { white-space: normal; text-align: left; }
}
@media (max-width: 350px) {
  .brand { flex-wrap: nowrap; }
  .logo { width: 42px; height: 42px; }
  .brand-title { font-size: 17px; }
  .brand-sub { font-size: 14px; }
  .card-art.has-photo { min-height: 230px; }
}