/* Contact location cards (Figma /Kontakt): two grey cards, city + hours + buttons. */

.section.contact-cards { padding-block: var(--space-l) 0; }
/* Bottom breather when the section closes the page (no 0-padding against the footer). */
.site-main > .section.contact-cards:last-child { padding-bottom: var(--space-5xl); }

.contact-cards__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-s);
  max-width: 858px;
  margin-inline: auto;
}

.contact-cards__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2xl);
  padding: var(--space-3xl);
  background: var(--color-grey-100);
  border-radius: var(--radius-m);
}

.contact-cards__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-3xs);
  text-align: center;
}
.contact-cards__title {
  font: 400 28px / 40px var(--font-heading);
  letter-spacing: -1px;
  color: var(--color-black);
}
.contact-cards__text {
  font-size: var(--fs-body-m);
  line-height: var(--lh-body-m);
  color: var(--color-black);
}

.contact-cards__buttons {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
  width: 100%;
}
/* Figma card buttons are slimmer than the base .btn (py 8 / px 12, min 44px). */
.contact-cards__btn {
  width: 100%;
  max-width: 236px;
  padding: var(--space-2x) var(--space-xs);
  min-height: 44px;
}
.contact-cards__btn svg { width: 24px; height: 24px; }

@media (max-width: 767px) {
  .contact-cards__grid { grid-template-columns: minmax(0, 1fr); }
  /* Mobile buttons are taller (Figma Grid-S: 52px). */
  .contact-cards__btn { padding-block: var(--space-xs); min-height: 52px; }
}