:root {
  --main-solid: #020D2C;
  --main: #020D2C;
  --main-trans: linear-gradient(90deg, rgba(2, 13, 44, 0.6), rgba(7, 43, 141, 0.6));
  --accent: #6DB847;
  --accent-gradient: linear-gradient(125deg, #a7d491, rgba(109, 184, 71, 0.6));
  --accent-gradient-trans: linear-gradient(125deg, #a7d491, rgba(109, 184, 71, 0.6));
  --secondary: #efefef;
  --secondary-gradient: linear-gradient(125deg, #efefef, #bdbdbd);
  --secondary-gradient-trans: linear-gradient(125deg, rgba(240, 240, 240, 0.6), rgba(189, 189, 189, 0.6));
  --bg: #fff;
  --dark: #020D2C;
  --dark-gradient: linear-gradient(90deg, #020D2C, #072b8d);
  --dark-gradient-trans: linear-gradient(90deg, rgba(2, 13, 44, 0.6), rgba(7, 43, 141, 0.6));
  --defVal: 10px;
  --text-v1: #fff;
}

::-moz-selection {
  color: var(--bg);
  background: var(--secondary);
}

::selection {
  color: var(--bg);
  background: var(--secondary);
}

.contact-hero {
  height: calc(100vh - 10px * 16);
}

.contact-hero::before {
  background-image: url(../../assets/img/spurbuddy-map.png);
  background-position: calc(50% - -15vw) center;
}

.contact-hero--light .contact-hero__header {
  color: var(--secondary);
}

.contact-hero--light::after {
  background: radial-gradient(circle at center left, white 25%, rgba(255, 255, 255, 0.2) 65%, rgba(255, 255, 255, 0) 100%);
  opacity: 1;
}

.contact-hero--dark::after {
  background: radial-gradient(circle at center left, rgba(23, 19, 26, 0.949) 25%, rgba(23, 19, 26, 0.761) 65%, rgba(0, 0, 0, 0.25) 100%);
  opacity: 1;
}

.contact-section {
  background: transparent;
  padding-top: 0;
}