/* ============================================================
   CONTACT — heading + map + address card. Figma: top:7971 h:755
   ============================================================ */
.contact {
  position: relative;
  width: 1728px;
  height: 801px;
  background: var(--color-bg);
  margin-top: 42px;
}
.contact__watermark {
  position: absolute;
  left: 50%;
  top: -86px;
  transform: translateX(-560px);
  font-family: var(--font-watermark);
  font-size: 225px;
  color: rgba(255, 255, 255, 0.05);
  white-space: nowrap;
}
.contact__heading {
  position: absolute;
  left: 50%;
  top: 50px;
  transform: translateX(-50%);
  font-family: var(--font-text);
  font-weight: 500;
  font-size: 64px;
  line-height: 85px;
  color: var(--color-white);
  white-space: nowrap;
}

.contact__map {
  position: absolute;
  left: 435px;
  top: 232px;
  width: 1024px;
  height: 610px;
  border-radius: 20px;
  overflow: hidden;
  background: #424242;
}
.contact__map img {
  position: absolute;
  left: -98px;
  top: -83px;
  width: 1548px;
  height: 755px;
  object-fit: cover;
}
.contact__map img.contact__map-pin {
  position: absolute;
  left: 588px;
  top: 261px;
  width: 59px;
  height: 59px;
  object-fit: contain;
}

.contact__card {
  padding: 48px 20px;
  position: absolute;
  left: 254px;
  top: 231px;
  width: 404px;
  background: rgb(66 66 66);
  border-radius: 20px;
  z-index: 2;
}
.contact__card-logo { position: relative; height: 130px; text-align: center; }
.contact__card-icon { position: absolute; left: 159px; top: 0; width: 45px; height: 40px; }
.contact__card-icon img { width: 100%; height: 100%; }
.contact__card-name { position: absolute; left: 0; top: 58px; width: 100%; font-family: var(--font-watermark); font-size: 41px; color: var(--color-accent-1); }
.contact__card-tag { position: absolute; left: 0; top: 107.5px; width: 100%; font-size: 12px; color: var(--color-gray); letter-spacing: 0.6px; text-transform: uppercase; }
.contact__card-divider { position: absolute; left: 100px; top: 129px; width: 163.5px; height: 0.5px; background: rgba(217, 217, 217, 0.3); }

.contact__card-city {
  position: relative;
  margin-top: 28px;
  width: 363px;
  height: 80px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 26px;
  font-size: 18px;
  color: var(--color-white);
}
.contact__card-city img {
  position: absolute;
  right: 32px;
  top: 35px;
  width: 10px;
  height: 22px;
  transform: rotate(90deg);
}

.contact__card-address {
  margin-top: 40px;
  text-align: center;
  font-size: 18px;
  line-height: 27px;
  color: var(--color-white);
}
.contact__card-phone {
  margin-top: 36px;
  text-align: center;
  font-family: var(--font-display);
  font-size: 30px;
  color: var(--color-white);
}
.contact__card-cta.btn {
  position: relative;
  left: auto;
  top: auto;
  margin: 24px auto 24px;
}