/* ============================================
   Component: Contacts Section
   ============================================ */
.contacts {
  padding-top: var(--spacing-section);
  padding-bottom: 0;
  background-color: var(--color-bg);
}

.contacts__header {
  margin-bottom: var(--spacing-xl);
}

.contacts__title {
  font-size: var(--font-size-4xl);
  font-weight: var(--font-weight-extra-bold);
  color: var(--color-text-heading);
  line-height: 40px;
  margin-bottom: 5px;
}

.contacts__company-info {
  font-size: var(--font-size-lg);
  color: var(--color-text-body);
  line-height: var(--line-height-relaxed);
}

.contacts__requisites-btn {
  margin-bottom: var(--spacing-5xl);
}

.contacts__grid {
  display: flex;
  gap: var(--spacing-lg);
}

.contacts__info {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 309px;
  flex-shrink: 0;
}

.contacts__info-card {
  display: flex;
  gap: var(--spacing-2xl);
  align-items: flex-start;
  background-color: var(--color-bg-light);
  border-radius: var(--radius-sm);
  padding: 23px var(--spacing-md);
  min-height: 122px;
}

.contacts__info-icon {
  width: 28px;
  height: 28px;
  flex-shrink: 0;
}

.contacts__info-content {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.contacts__info-label {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-extra-bold);
  color: var(--color-text-heading);
  line-height: normal;
}

.contacts__info-value {
  font-size: var(--font-size-lg);
  color: var(--color-text-heading);
  line-height: 22px;
}

.contacts__info-value a {
  color: var(--color-text-heading);
}

.contacts__info-value a:hover {
  color: var(--color-primary);
}

.contacts__map {
  flex: 1;
  border-radius: var(--radius-sm);
  overflow: hidden;
  height: 524px;
  min-height: 524px;
}

.contacts__map > #contacts-map {
  width: 100%;
  height: 100%;
  min-height: inherit;
}

.contacts__map img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.contacts__map [class*="ymaps-"] {
  border-radius: var(--radius-sm);
}

/* Bottom accent strip — flush against footer */
.contacts__accent-strip {
  display: block;
  width: 66.8%;
  height: 13px;
  margin-top: var(--spacing-section);
  background-color: var(--color-primary);
  clip-path: polygon(0 0, calc(100% - 5px) 0, 100% 100%, 0 100%);
}