/* ========================
   GET IN TOUCH
   ======================== */
.section-contact {
  position: relative;
  height: 764px;
  background-color: var(--color-black);
  overflow: hidden;
}

/* --- Background --- */
.section-contact__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section-contact__overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.5);
  pointer-events: none;
}

/* --- Top separator --- */
.section-contact__sep-top {
  position: absolute;
  left: 0;
  top: 6px;
  width: 1920px;
  height: 1px;
  background-color: var(--color-cream);
}

/* --- Logo --- */
.section-contact__logo {
  position: absolute;
  left: 949px;
  top: 100px;
  width: 54px;
  height: 60.581px;
}

.section-contact__logo img {
  width: 100%;
  height: 100%;
}

/* --- Title --- */
.section-contact__title {
  position: absolute;
  left: 0;
  top: 209px;
  width: 100%;
  font-family: var(--font-serif);
  font-size: var(--text-7xl);
  line-height: var(--leading-7xl);
  color: var(--color-cream);
  font-weight: 400;
  font-style: normal;
  text-transform: uppercase;
  text-align: center;
  white-space: nowrap;
}

/* --- Contact items shared --- */
.section-contact__icon {
  position: absolute;
}

.section-contact__icon img {
  width: 100%;
  height: 100%;
}

.section-contact__text {
  position: absolute;
  font-family: var(--font-sans);
  font-size: 24px;
  line-height: normal;
  color: var(--color-cream);
  white-space: nowrap;
}

/* --- Phone --- */
.section-contact__icon--phone {
  left: 318px;
  top: 379px;
  width: 38px;
  height: 38px;
}

.section-contact__text--phone {
  left: 242px;
  top: 459px;
}

/* --- Email --- */
.section-contact__icon--email {
  left: 733px;
  top: 380px;
  width: 44.926px;
  height: 35.941px;
}

.section-contact__text--email {
  left: 620px;
  top: 459px;
}

/* --- Telegram --- */
.section-contact__icon--telegram {
  left: 1153px;
  top: 373px;
  width: 51px;
  height: 51px;
}

.section-contact__text--telegram {
  left: 1178px;
  top: 444px;
  transform: translateX(-50%);
  text-align: center;
}

/* --- Instagram --- */
.section-contact__icon--instagram {
  left: 1576px;
  top: 380px;
  width: 36px;
  height: 37px;
}

.section-contact__text--instagram {
  left: 1510px;
  top: 459px;
}

/* --- CTA Button --- */
.section-contact__cta {
  position: absolute;
  left: 777px;
  top: 595.3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--btn-hero-w);
  height: var(--btn-hero-h);
  background-color: var(--color-cream);
  color: var(--color-maroon);
  font-family: var(--font-sans);
  font-size: 24px;
  line-height: var(--leading-base);
  text-transform: uppercase;
  text-align: center;
  white-space: nowrap;
  transition: background-color 0.25s, color 0.25s;
}

.section-contact__cta:hover {
  background-color: var(--color-maroon);
  color: var(--color-cream);
}

/* --- Clickable links --- */
.section-contact__link {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.2s ease;
}

.section-contact__link:hover {
  opacity: 0.7;
}

.section-contact__link:visited {
  color: inherit;
}

.section-contact__icon-link {
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.2s ease;
}

.section-contact__icon-link:hover {
  opacity: 0.7;
}

.section-contact__messenger-link {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.2s ease;
}

.section-contact__messenger-link:hover {
  opacity: 0.7;
  text-decoration: underline;
}

.section-contact__messenger-link:visited {
  color: inherit;
}

/* --- Bottom separator --- */
.section-contact__sep-bottom {
  position: absolute;
  left: 0;
  top: 763px;
  width: 1920px;
  height: 1px;
  background-color: var(--color-cream);
}