.contacts-page .legal-document { container: contacts / inline-size; }
.contacts-intro { margin-bottom: var(--space-3); color: var(--text-muted); }
.contacts-general { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); font-size: var(--font-small); }
.contacts-general span { color: var(--text-muted); }
.contacts-general a { text-decoration: none; }
.contact-network { --contact-map-dot-size: 8px; width: 100%; background: transparent; }
.contacts-page .contact-network a { text-decoration: none; }
.contact-map-dot { display: block; flex: none; width: var(--contact-map-dot-size); height: var(--contact-map-dot-size); min-width: var(--contact-map-dot-size); min-height: var(--contact-map-dot-size); max-width: var(--contact-map-dot-size); max-height: var(--contact-map-dot-size); padding: 0; border: 0; border-radius: 50%; box-shadow: 0 0 2px 1px var(--white), 0 0 4px var(--white); }
.contact-map-dot--company { background: #ff870b; }
.contact-map-dot--dealer { background: #247fc4; }
.contact-map-canvas { position: relative; width: 100%; max-width: 540px; margin: 0 auto; background: transparent; }
.contact-map-viewport { overflow: clip; border-radius: inherit; }
.contact-map-surface { position: relative; width: 100%; min-width: 0; aspect-ratio: 1384 / 784; }
.contact-map-surface > img { display: block; width: 100%; height: auto; }
.contact-map-pin { --label-x: 14px; --label-y: 0px; position: absolute; z-index: 1; display: block; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--ink); font-size: var(--font-small); line-height: var(--line-tight); transform: translate(-50%, -50%); white-space: nowrap; }
.contact-map-cluster { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: var(--contact-map-dot-size); height: var(--contact-map-dot-size); transform: translate(-50%, -50%); }
.contact-map-connector { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; fill: none; stroke: #a8bece; stroke-width: 1; stroke-linecap: round; pointer-events: none; }
.contacts-page .contact-map-pin:hover, .contacts-page .contact-map-pin:focus-visible { z-index: 2; color: var(--orange-link); text-decoration: none; }
.contact-map-pin-label { position: absolute; top: calc(50% + var(--label-y)); left: calc(50% + var(--label-x)); transform: translateY(-50%); white-space: nowrap; color: #263541; font-weight: var(--weight-regular); text-shadow: -1px 0 1px var(--white), 1px 0 1px var(--white), 0 -1px 1px var(--white), 0 1px 1px var(--white), -1px -1px 1px var(--white), 1px 1px 1px var(--white), 0 0 3px var(--white); }
.contact-map-country { color: inherit; font-weight: inherit; }
.contact-map-pin:hover .contact-map-pin-label, .contact-map-pin:focus-visible .contact-map-pin-label { color: var(--orange-link); }
.contact-map-pin:hover .contact-map-country, .contact-map-pin:focus-visible .contact-map-country { color: inherit; }
.contact-map-pin[data-network-city="minsk"] { --label-x: 0px; --label-y: -24px; }
.contact-map-pin[data-network-city="minsk"] .contact-map-pin-label { transform: translate(-50%, -50%); }
.contact-map-pin--left .contact-map-pin-label { left: auto; right: calc(50% + 14px); }
.contact-office[id] { scroll-margin-top: calc(var(--control-height) + var(--space-6)); }
.contact-office:target { border-color: var(--orange); }
@container contacts (max-width: 440px) {
  .contact-map-canvas { padding-block: var(--space-2); }
  .contact-map-pin { width: 32px; height: 32px; }
  /* Separate the western cluster without moving its geographic points. */
  .contact-map-pin[data-network-city="minsk"] { --label-x: calc(var(--city-x) * -1cqw); --label-y: -26px; }
  .contact-map-pin[data-network-city="minsk"] .contact-map-pin-label { transform: translateY(-50%); }
  .contact-map-pin[data-network-city="essentuki"] { --label-y: 18px; }
}
.contacts-messengers { --messenger-qr-size: 160px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
.contact-messenger.ui-button { display: grid; grid-template-columns: minmax(0, 1fr); justify-items: center; align-content: start; min-width: 0; padding: var(--space-4); text-align: left; text-decoration: none; gap: var(--space-4); }
.contact-messenger-details { display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: center; min-width: 0; gap: var(--space-1) var(--space-2); }
.contact-messenger-name { font-size: var(--font-body); line-height: var(--line-tight); white-space: nowrap; }
.contact-messenger-action { display: inline-flex; gap: var(--space-1); color: var(--text-muted); font-size: var(--font-caption); font-weight: var(--weight-regular); line-height: var(--line-normal); }
.contact-messenger-qr { display: block; width: var(--messenger-qr-size); height: var(--messenger-qr-size); max-width: 100%; aspect-ratio: 1; }
.contact-messenger-icon { grid-column: 1; grid-row: 1 / 3; width: 36px; height: 36px; flex: none; opacity: .75; transition: opacity var(--duration-fast) var(--ease-standard); }
.messenger-telegram { color: #229ed9; }
.messenger-max { color: #7b32b5; }
@media (hover: hover) { .contact-messenger:hover .contact-messenger-icon { opacity: 1; } }
.contact-messenger:focus-visible .contact-messenger-icon { opacity: 1; }
.contacts-offices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-3); row-gap: var(--space-2); }
.contact-office, .contacts-requisites, .contact-form-panel { min-width: 0; padding: var(--space-4); }
.contact-office { display: grid; grid-row: span 6; grid-template-rows: subgrid; align-items: start; }
.contacts-offices > .contact-office:last-child:nth-child(odd) { grid-column: 1 / -1; }
.contact-office .contact-office-write { grid-row: 6; margin-top: var(--space-2); align-self: end; }
.contact-office h3, .contact-office h4 { grid-row: 1; margin: 0 0 var(--space-1); font-size: var(--font-banner-title); line-height: var(--line-tight); }
.contact-office-header { grid-row: 1; display: grid; grid-template-rows: 1fr auto; align-self: stretch; gap: var(--space-3); width: 100%; min-width: 0; padding-bottom: var(--space-3); border-bottom: var(--border); }
.contact-office-header .contact-office-title { margin: 0; min-width: 0; font-size: var(--font-banner-title); font-weight: var(--weight-bold); line-height: var(--line-tight); }
.contact-office-name { display: block; }
.contacts-page .contact-city-heading { display: flex; align-items: center; gap: var(--space-2); margin: 0; padding: 0; font-size: var(--font-body); line-height: var(--line-tight); }
.contact-city-heading + .contacts-offices { margin-top: var(--space-3); }
.contact-city-heading::before { content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--orange); }
.contact-city-offices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); margin-top: var(--space-3); }
.contact-city-office { display: grid; grid-row: span 7; grid-template-rows: subgrid; min-width: 0; }
.contact-city-office > .contact-office { grid-row: 2 / span 6; }
.contact-dealer-cities { margin-top: 0; }
.contact-dealer-cities .contact-city-heading::before { background: #247fc4; }
.contact-dealer-cities > .contact-city-office:last-child:nth-child(odd) { grid-column: 1 / -1; }
@container contacts (max-width: 620px) {
  .contact-city-offices { grid-template-columns: minmax(0, 1fr); }
}
.contact-office-labels { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: var(--space-1); width: 100%; min-width: 0; }
.contact-warehouse-label { flex: none; padding: var(--space-1) var(--space-2); color: var(--graphite); font-size: var(--font-caption); font-weight: var(--weight-medium); line-height: var(--line-tight); white-space: nowrap; }
.contact-office p, .contact-office address, .contact-office > a { font-size: var(--font-small); line-height: var(--line-normal); }
.contact-office p { margin: 0; }
.contact-office-hours { grid-row: 3; }
.contact-office-phone { grid-row: 4; }
.contact-office address { grid-row: 2; font-style: normal; }
.contact-office > a { grid-row: 4; text-decoration: none; }
.contact-office > a:hover { color: var(--orange-link); }
.contacts-team { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
/* Share image, name, role and action tracks across each row of employee cards. */
.contact-person { display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: 0; min-width: 0; overflow: hidden; }
.contact-person img { grid-row: 1; display: block; width: 100%; height: auto; aspect-ratio: 1020 / 1320; object-fit: cover; }
.contact-person-details { display: grid; grid-row: 2 / span 3; grid-template-rows: subgrid; row-gap: 0; min-width: 0; padding: var(--space-3); }
.contact-person h3 { grid-row: 1; align-self: start; margin: 0; font-size: var(--font-body); line-height: var(--line-tight); }
.contact-person p { grid-row: 2; align-self: start; margin: var(--space-2) 0 var(--space-3); font-size: var(--font-caption); line-height: var(--line-normal); color: var(--text-muted); }
.contact-person .ui-button { grid-row: 3; align-self: end; margin-top: 0; width: 100%; }
.contact-form-intro { margin: 0 0 var(--space-4); font-size: var(--font-small); color: var(--text-muted); }
.contact-company-name { margin: 0 0 var(--space-4); font-weight: var(--weight-semibold); }
.contacts-requisites dl { margin: 0 0 var(--space-4); font-size: var(--font-small); }
.contacts-requisites dl > div { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: var(--space-3); margin-top: var(--space-2); }
.contacts-requisites dt { color: var(--text-muted); }
.contacts-requisites dd { margin: 0; }
.contacts-requisites .ui-button { text-decoration: none; }
.requisites-format { margin-left: var(--space-2); color: var(--text-muted); font-size: var(--font-caption); font-weight: var(--weight-regular); }
@container contacts (max-width: 620px) {
  .contacts-team { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contacts-messengers { grid-template-columns: minmax(0, 1fr); }
  .contact-messenger.ui-button { grid-template-columns: minmax(0, 1fr) var(--messenger-qr-size); align-items: center; justify-items: stretch; }
  .contact-messenger-details { justify-self: start; }
}
@container contacts (max-width: 340px) {
  .contacts-messengers { --messenger-qr-size: 144px; }
  .contact-messenger.ui-button { padding: var(--space-3); gap: var(--space-2); }
  .contact-messenger-details { column-gap: var(--space-1); }
}
@container contacts (max-width: 500px) {
  .contacts-offices { grid-template-columns: minmax(0, 1fr); }
  .contact-office { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-2); }
  .contact-office .contact-office-write { align-self: stretch; }
  .contact-messenger.ui-button { min-height: var(--control-height); }
  .contacts-requisites dl > div { grid-template-columns: minmax(0, 1fr); gap: var(--space-1); }
  .contacts-requisites dl > div:not(:first-child) { grid-template-columns: 64px minmax(0, 1fr); gap: var(--space-3); }
  .contacts-requisites dl > div:not(:first-child) dd { white-space: nowrap; }
}
@container contacts (max-width: 360px) {
  .contacts-team { grid-template-columns: minmax(0, 1fr); }
  .contact-messenger-name { font-size: var(--font-small); }
}
@container contacts (max-width: 280px) {
  .contact-messenger.ui-button { grid-template-columns: minmax(0, 1fr); justify-items: center; }
  .contact-messenger-details { justify-self: center; }
}