/* Contact page additions for the recovered Bootstrap site */

.text-brand {
  color: var(--jacks-red) !important;
}

/*
  The archived Contact page uses the same source hero photograph as the
  recovered header, but with its own crop/positioning. Keeping a separate
  local filename lets you tune this page independently of the homepage.
*/
.contact-hero {
  min-height: 390px;
  background:
    linear-gradient(90deg, rgba(0,0,0,.88) 0%, rgba(0,0,0,.42) 34%, rgba(0,0,0,0) 70%),
    url("../images/contact-hero-bg.webp") center 47% / cover no-repeat;
}

.contact-intro {
  background: #fff;
}

.contact-copy {
  color: #111;
  line-height: 1.75;
  text-align: justify;
}

.contact-feature-image {
  display: block;
  width: 100%;
  max-width: 819px;
  margin: 0 auto;
  border: 1px solid #ddd;
}

.contact-footer {
  background: linear-gradient(#f3f3f3 0%, #dcdcdc 40%, #252525 40%, #121212 100%);
  color: #111;
}

.footer-logo {
  max-width: 310px;
}

.footer-phone {
  color: var(--jacks-red);
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  font-weight: 700;
  text-decoration: none;
}

.contact-form {
  background: rgba(255,255,255,.96);
  padding: 1.5rem;
  border-radius: .35rem;
}

.contact-form .form-control {
  border-radius: 0;
  border: 1px solid #aaa;
}

.contact-form .form-control:focus {
  border-color: var(--jacks-red);
  box-shadow: 0 0 0 .15rem rgba(207,40,42,.15);
}

.contact-map-image {
  width: 100%;
  max-width: 858px;
  border: 1px solid rgba(255,255,255,.25);
}

.contact-address {
  line-height: 1.65;
}

@media (max-width: 991.98px) {
  .contact-hero {
    min-height: 330px;
    background-position: 66% center;
  }

  .contact-copy {
    text-align: left;
  }

  .contact-footer {
    background: linear-gradient(#efefef 0%, #d8d8d8 25%, #1b1b1b 25%, #111 100%);
  }
}

@media (max-width: 575.98px) {
  .contact-hero {
    min-height: 290px;
  }

  .footer-logo {
    max-width: 220px;
  }
}