/**
 * Contact page modification layer
 *
 * Keep all user-requested contact-page visual changes in this file.
 * It loads after the base stylesheets, so scoped rules here can safely
 * override the original contact page without changing the approved base CSS.
 */

/* Future contact-page modifications go below this line. */

/* Contact Form 7 bridge: retain the approved secure form while matching the static card. */
.elg-contact-page .elg-contact-hero__form .cf7-content {
  gap: 10px;
}

.elg-contact-page .elg-contact-hero__form input:not([type="submit"]),
.elg-contact-page .elg-contact-hero__form input[type="submit"] {
  min-height: 50px;
}

.elg-contact-page .elg-contact-hero__note {
  margin-top: 0;
}

@media (min-width: 768px) {
  .elg-contact-page .elg-contact-hero__phone {
    width: 330px;
    min-width: 330px;
    padding: 17px 26px;
  }

  .elg-contact-page .elg-contact-hero__phone-copy {
    gap: 14px;
  }
}

@media (max-width: 1500px) {
  .elg-contact-page h1 {
    font-size: 80px;
    letter-spacing: -1.8px;
    line-height: 72px;
  }

  .elg-contact-page h2 {
    font-size: 60px;
    letter-spacing: -1.4px;
    line-height: 60px;
  }
}

@media (max-width: 1200px) {
  .elg-contact-page h1 {
    font-size: 72px;
    letter-spacing: -1.8px;
    line-height: 65px;
  }

  .elg-contact-page h2 {
    font-size: 52px;
    letter-spacing: -1.4px;
    line-height: 52px;
  }
}

@media (max-width: 1024px) {
  .elg-contact-page h1 {
    font-size: 72px;
    letter-spacing: -1.8px;
    line-height: 65px;
  }

  .elg-contact-page h2 {
    font-size: 48px;
    letter-spacing: -1px;
    line-height: 48px;
  }
}

@media (max-width: 767px) {
  .elg-contact-page .elg-contact-offices__glow--left {
    right: auto;
    left: -401px;
  }

  .elg-contact-page .elg-contact-hero::after {
    content: "";
    position: absolute;
    z-index: 3;
    top: 1057px;
    right: 0;
    bottom: 0;
    left: 0;
    background: var(--elg-navy);
    pointer-events: none;
    position-anchor: --elg-contact-phone-field;
    top: anchor(center);
  }

  .elg-contact-page .elg-contact-hero__fields input[name="phone"] {
    anchor-name: --elg-contact-phone-field;
  }

  .elg-contact-page .elg-contact-hero__container {
    padding-bottom: 30px;
  }

  .elg-contact-page .elg-contact-hero__backdrop img {
    top: -140px;
    bottom: auto;
    height: 1205px;
  }

  .elg-contact-page h1 {
    font-size: 60px;
    letter-spacing: -1px;
    line-height: 55px;
  }

  .elg-contact-page h2 {
    font-size: 40px;
    letter-spacing: -0.8px;
    line-height: 45px;
  }
}

@media (max-width: 390px) {
  .elg-contact-page h1 {
    font-size: 50px;
    letter-spacing: -1px;
    line-height: 45px;
  }
}


/* Keep the form compact at desktop/tablet widths from the supplied reference. */
@media (min-width: 1360px) {
  .elg-contact-page .elg-contact-hero__form-heading {
    gap: 15px;
  }

  .elg-contact-page .elg-contact-hero__form-title {
    font-size: 40px;
    letter-spacing: 0;
    line-height: 50px;
  }
}

@media (min-width: 1025px) and (max-width: 1359px) {
  .elg-contact-page .elg-contact-hero__form-heading {
    gap: 15px;
  }

  .elg-contact-page .elg-contact-hero__form-title {
    font-size: 36px;
    letter-spacing: 0;
    line-height: 44px;
  }
}

/* The reference uses 100px vertical breathing room before the offices here. */
@media (min-width: 1025px) and (max-width: 1499px) {
  .elg-contact-page .elg-contact-offices {
    padding: 100px 0;
  }
}

/* Footer typography must stay identical to the shared Home page footer. */
.elg-contact-page .elg-site-footer__heading {
  font-size: 15px;
  letter-spacing: 2px;
  line-height: 11px;
}

@media (max-width: 767px) {
  .elg-contact-page .elg-site-footer__heading {
    font-size: 12px;
    line-height: 9px;
  }
}


/* Contact Form 7 parity with the approved static Contact reference. */
.elg-contact-page .elg-contact-hero__form .cf7-content {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.elg-contact-page .elg-contact-hero__form .cf7-submit {
  margin-top: 5px;
}

.elg-contact-page .elg-contact-hero__form input:not([type="submit"]) {
  height: 50px;
  min-height: 50px;
  border: 1px solid var(--elg-border-blue);
  border-radius: 0;
  padding: 0 20px;
  color: var(--elg-white);
  background: var(--elg-navy);
  font: 400 16px/26px var(--elg-font-ui);
  appearance: none;
}

.elg-contact-page .elg-contact-hero__form input:not([type="submit"])::placeholder {
  color: var(--elg-muted);
  opacity: 1;
}

.elg-contact-page .elg-contact-hero__form input:not([type="submit"]):focus {
  border-color: var(--elg-gold-bright);
  outline: 0;
}

.elg-contact-page .elg-contact-hero__form input[type="submit"] {
  min-height: 50px;
  border: 0;
  border-radius: 0;
  padding: 15px 30px;
  color: var(--elg-ink);
  background: linear-gradient(90deg, var(--elg-gold-bright) 0%, var(--elg-gold) 100%);
  font: 700 15px/18px var(--elg-font-ui);
}

@media (max-width: 767px) {
  .elg-contact-page .elg-contact-hero__form .cf7-content {
    grid-template-columns: minmax(0, 1fr);
  }

  .elg-contact-page .elg-contact-hero__form input:not([type="submit"]) {
    font-size: 14px;
  }

  .elg-contact-page .elg-contact-hero__form input[type="submit"] {
    font-size: 13px;
    line-height: 16px;
  }
}
