/* Two-screen contact layout inspired by the supplied visual references. */
.contact-page {
  --contact-blue: #123538;
  --contact-link: #087a78;
  --contact-navy: #082d31;
  --contact-light: #f0f6f5;
  --contact-copy: #586f70;
  overflow: clip;
  color: var(--contact-blue);
  background: #fff;
}

.contact-page__screen { position: relative; isolation: isolate; }
.contact-page__screen--locations {
  min-height: auto;
  padding: 50px 0 30px;
  background: #fff;
}
.contact-page__locations-backdrop {
  position: absolute;
  inset: 0 0 auto;
  z-index: -1;
  height: 288px;
  background:
    linear-gradient(90deg, rgba(4, 38, 40, 0.98) 0%, rgba(7, 55, 56, 0.92) 49%, rgba(8, 58, 59, 0.3) 76%, rgba(4, 31, 33, 0.12) 100%),
    url("https://images.unsplash.com/photo-1477959858617-67f85cf4f1df?auto=format&fit=crop&q=80&w=1800") center 48% / cover no-repeat;
}
.contact-page__screen-inner { position: relative; }
.contact-page__locations-heading { color: #fff; }
.contact-page__eyebrow {
  margin: 0;
  color: #fff;
  font-size: 0.76rem;
  font-weight: 760;
  letter-spacing: 0.14em;
  line-height: 1.2;
  text-transform: uppercase;
}
.contact-page__locations-heading h1 {
  margin: 17px 0 0;
  color: #fff;
  font-size: clamp(2.8rem, 5vw, 4.25rem);
  font-weight: 800;
  line-height: 0.95;
  letter-spacing: 0.015em;
}
.contact-page__service-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: 760px;
  margin-top: 31px;
  gap: clamp(20px, 4vw, 64px);
}
.contact-page__service-strip > div { display: flex; align-items: center; gap: 13px; min-width: 0; }
.contact-service-icon {
  width: 46px;
  height: 46px;
  display: grid;
  flex: 0 0 46px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 50%;
  color: #fff;
  font-size: 1.35rem;
  line-height: 1;
}
.contact-page__service-strip p { display: grid; gap: 6px; margin: 0; }
.contact-page__service-strip strong { color: #fff; font-size: 0.86rem; line-height: 1.1; }
.contact-page__service-strip small { color: rgba(255, 255, 255, 0.92); font-size: 0.78rem; line-height: 1.2; }

.contact-location-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-top: 36px;
}
.contact-location-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #d9dfeb;
  border-top: 3px solid var(--contact-link);
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 16px 34px rgba(4, 45, 49, 0.10);
  transition: transform 220ms ease, box-shadow 220ms ease;
}
.contact-location-card:hover { transform: translateY(-5px); box-shadow: 0 22px 42px rgba(4, 45, 49, 0.16); }
.contact-location-card > img { width: 100%; height: 190px; object-fit: contain; padding: 11px 21px 0; background: #f3f6fb; }
.contact-location-card__body { min-height: 208px; display: flex; flex-direction: column; padding: 16px 21px 19px; }
.contact-location-card h2 { margin: 0; color: var(--contact-blue); font-size: clamp(1.18rem, 1.8vw, 1.5rem); font-weight: 800; line-height: 1.1; }
.contact-location-card__address { max-width: 35ch; margin: 19px 0 0; color: var(--contact-copy); font-size: 0.88rem; line-height: 1.55; }
.contact-location-card__links { display: grid; gap: 10px; margin-top: auto; padding-top: 21px; }
.contact-location-card__links a,
.contact-location-card__agent-link { overflow-wrap: anywhere; color: var(--contact-blue); font-size: 0.86rem; font-weight: 680; line-height: 1.25; }
.contact-location-card__links a:hover,
.contact-location-card__agent-link:hover { color: var(--contact-link); }
.contact-location-card__agent-link { display: inline-flex; gap: 8px; align-items: center; margin-top: auto; padding-top: 21px; color: var(--contact-link); }
.contact-location-card__agent-link span { font-size: 1rem; }

.contact-page__screen--message {
  min-height: max(700px, calc(100svh - 92px));
  padding: 48px 0 56px;
  color: var(--contact-blue);
  background: var(--contact-light);
  border-top: 1px solid #d8e0ec;
}
.contact-page__message-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.28fr) minmax(290px, 0.72fr);
  gap: clamp(40px, 6vw, 78px);
}
.contact-page__form-column { min-width: 0; }
.contact-page__message-heading h2 { margin: 0; color: var(--contact-blue); font-size: clamp(1.4rem, 2.3vw, 2rem); font-weight: 800; line-height: 1.1; letter-spacing: 0.01em; }
.contact-page__message-heading p { max-width: 620px; margin: 16px 0 0; color: var(--contact-copy); font-size: 0.92rem; line-height: 1.55; }
.contact-page__message-heading .contact-page__eyebrow { display: none; }
.contact-page__form-link {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 9px;
  margin-top: 21px;
  padding: 0 19px;
  border-radius: 5px;
  color: #fff;
  background: var(--contact-link);
  font-size: 0.84rem;
  font-weight: 760;
  transition: background 180ms ease, transform 180ms ease;
}
.contact-page__form-link:hover { transform: translateY(-2px); background: #075d5b; }
.contact-page__form-card { margin-top: 23px; }
.contact-notice { margin: 0 0 18px; padding: 12px 14px; border-radius: 5px; font-size: 0.8rem; }
.contact-notice--success { color: #0b5d52; background: #dcefe9; }
.contact-notice--error { color: #8b2d2d; background: #f4dddd; }
.contact-form { margin: 0; }
.contact-honeypot { position: absolute; left: -10000px; }
.contact-form__grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
.contact-form label { display: grid; gap: 0; }
.contact-form label > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
.contact-form input,
.contact-form textarea {
  width: 100%;
  border: 1px solid #d6deeb;
  border-radius: 5px;
  padding: 14px;
  color: var(--contact-blue);
  background: #fff;
  font: inherit;
  font-size: 0.9rem;
  transition: border-color 180ms ease, box-shadow 180ms ease;
}
.contact-form input::placeholder,
.contact-form textarea::placeholder { color: #5c6e90; opacity: 1; }
.contact-form textarea { min-height: 124px; resize: vertical; }
.contact-form input:focus,
.contact-form textarea:focus { outline: 0; border-color: var(--contact-link); box-shadow: 0 0 0 3px rgba(8, 122, 120, 0.15); }
.contact-consent { display: flex !important; flex-direction: row; align-items: flex-start; gap: 9px !important; margin-top: 17px; color: var(--contact-copy); font-size: 0.77rem; line-height: 1.4; }
.contact-consent span { position: static !important; width: auto !important; height: auto !important; overflow: visible !important; clip: auto !important; }
.contact-consent input { width: auto; margin-top: 3px; accent-color: var(--contact-link); }
.contact-form__submit {
  width: 100%;
  min-height: 50px;
  margin-top: 22px;
  border: 1px solid var(--contact-navy);
  border-radius: 5px;
  color: #fff;
  background: var(--contact-navy);
  font-size: 0.92rem;
  font-weight: 760;
  cursor: pointer;
  transition: background 180ms ease, transform 180ms ease;
}
.contact-form__submit:hover { transform: translateY(-2px); background: #064f54; }

.contact-page__team-column { min-width: 0; padding-left: clamp(28px, 5vw, 70px); border-left: 1px solid #d5deeb; }
.contact-team-intro { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: start; }
.contact-team-icon { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid #d3ddec; border-radius: 50%; color: var(--contact-blue); background: #fff; font-size: 1rem; }
.contact-team-intro h2 { margin: 4px 0 0; color: var(--contact-blue); font-size: clamp(1.35rem, 2.1vw, 1.8rem); font-weight: 800; line-height: 1.05; }
.contact-team-intro p { margin: 17px 0 0; color: var(--contact-blue); font-size: 0.9rem; line-height: 1.6; }
.contact-team-list { display: grid; gap: 21px; margin-top: 26px; padding-left: 54px; }
.contact-team-list a { display: grid; gap: 8px; color: var(--contact-blue); }
.contact-team-list a:hover span { color: var(--contact-link); }
.contact-team-list strong { font-size: 0.88rem; font-weight: 800; line-height: 1.2; }
.contact-team-list span { color: var(--contact-link); font-size: 0.86rem; line-height: 1.2; }
.contact-hours { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: start; margin-top: 32px; }
.contact-hours h3 { margin: 4px 0 0; color: var(--contact-blue); font-size: 0.92rem; font-weight: 800; }
.contact-hours p { margin: 15px 0 0; color: var(--contact-blue); font-size: 0.87rem; line-height: 1.65; }

.contact-page [data-reveal] { opacity: 1; transform: none; }
.contact-motion-ready .contact-page [data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity 600ms cubic-bezier(0.16, 1, 0.3, 1), transform 600ms cubic-bezier(0.16, 1, 0.3, 1); transition-delay: var(--contact-delay, 0ms); }
.contact-motion-ready .contact-page [data-reveal].is-visible { opacity: 1; transform: none; }

@media (max-width: 900px) {
  .contact-page__screen--locations { min-height: auto; padding-bottom: 42px; }
  .contact-page__locations-backdrop { height: 350px; }
  .contact-page__service-strip { gap: 22px; }
  .contact-location-grid { grid-template-columns: 1fr 1fr; }
  .contact-location-card:last-child { grid-column: 1 / -1; }
  .contact-page__screen--message { min-height: auto; }
  .contact-page__message-inner { grid-template-columns: 1fr; gap: 44px; }
  .contact-page__team-column { padding: 0; border-top: 1px solid #d5deeb; border-left: 0; padding-top: 48px; }
}

@media (max-width: 620px) {
  .contact-page__screen--locations { padding: 48px 0 42px; }
  .contact-page__locations-backdrop { height: 365px; }
  .contact-page__locations-heading h1 { font-size: clamp(2.45rem, 12vw, 3.6rem); }
  .contact-page__service-strip { grid-template-columns: 1fr; gap: 17px; margin-top: 31px; }
  .contact-page__service-strip > div { max-width: 260px; }
  .contact-location-grid { grid-template-columns: 1fr; gap: 18px; margin-top: 38px; }
  .contact-location-card:last-child { grid-column: auto; }
  .contact-location-card > img { height: 190px; padding-inline: 16px; }
  .contact-location-card__body { min-height: 214px; padding: 18px 20px 22px; }
  .contact-page__screen--message { padding: 48px 0 58px; }
  .contact-page__form-link { margin-top: 21px; }
  .contact-page__form-card { margin-top: 24px; }
  .contact-team-list { padding-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .contact-page [data-reveal],
  .contact-motion-ready .contact-page [data-reveal] { opacity: 1; transform: none; transition: none; }
  .contact-location-card,
  .contact-page__form-link,
  .contact-form__submit { transition: none; }
}

/* Taste pass: a quiet industrial contact studio. The form fields, anchors and
 * server-side action stay unchanged; only the presentation is rebalanced for
 * Elementor's editable page shell. */
.contact-page {
  --contact-blue: #0b3438;
  --contact-link: #087a78;
  --contact-navy: #062b30;
  --contact-light: #edf5f3;
  --contact-copy: #587274;
  background: #fff;
}

.contact-page__screen--locations {
  padding: 0 0 76px;
  background: #fff;
}

.contact-page__locations-backdrop {
  height: 366px;
  background:
    linear-gradient(90deg, rgba(3, 27, 30, .96) 0%, rgba(4, 48, 50, .8) 52%, rgba(4, 48, 50, .35) 100%),
    url("../images/ying-group-forest-hero.webp") center / cover no-repeat;
}

.contact-page__screen-inner {
  padding-top: 62px;
}

.contact-page__locations-heading h1 {
  margin-top: 14px;
  font-size: clamp(2.8rem, 5.2vw, 4.8rem);
  letter-spacing: -.065em;
}

.contact-page__service-strip {
  max-width: 820px;
  margin-top: 34px;
  gap: clamp(18px, 4vw, 70px);
}

.contact-service-icon {
  width: 42px;
  height: 42px;
  flex-basis: 42px;
  border-color: rgba(191, 233, 225, .62);
  color: #bfe9e1;
  background: rgba(7, 63, 66, .32);
}

.contact-page__service-strip strong {
  font-size: .84rem;
}

.contact-page__service-strip small {
  color: rgba(255, 255, 255, .76);
}

.contact-location-grid {
  position: relative;
  z-index: 1;
  gap: 18px;
  margin-top: 50px;
}

.contact-location-card {
  border: 1px solid rgba(11, 52, 56, .14);
  border-top: 3px solid var(--contact-link);
  border-radius: 18px;
  box-shadow: 0 18px 46px rgba(11, 52, 56, .12);
  transition: transform 260ms cubic-bezier(.16, 1, .3, 1), box-shadow 260ms ease, border-color 260ms ease;
}

.contact-location-card:hover {
  border-color: rgba(8, 122, 120, .45);
  transform: translateY(-6px);
  box-shadow: 0 26px 58px rgba(11, 52, 56, .17);
}

.contact-location-card > img {
  height: 180px;
  padding: 14px 20px 0;
  background: #edf5f3;
}

.contact-location-card__body {
  min-height: 220px;
  padding: 22px 22px 24px;
}

.contact-location-card h2 {
  font-size: clamp(1.2rem, 1.8vw, 1.55rem);
  letter-spacing: -.035em;
}

.contact-location-card__address {
  margin-top: 17px;
  line-height: 1.6;
}

.contact-page__screen--message {
  min-height: auto;
  padding: 84px 0 96px;
  background: var(--contact-light);
  border-top: 0;
}

.contact-page__message-inner {
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
  gap: clamp(42px, 7vw, 96px);
}

.contact-page__message-heading h2 {
  font-size: clamp(2.2rem, 4.5vw, 4.1rem);
  letter-spacing: -.065em;
}

.contact-page__message-heading p {
  max-width: 54ch;
  margin-top: 18px;
  line-height: 1.65;
}

.contact-page__form-link {
  margin-top: 26px;
  border-radius: 999px;
  padding-inline: 22px;
}

.contact-page__form-card {
  margin-top: 34px;
  padding: 26px;
  border: 1px solid rgba(11, 52, 56, .14);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(11, 52, 56, .1);
}

.contact-form__grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.contact-form__grid .contact-form__wide {
  grid-column: 1 / -1;
}

.contact-form input,
.contact-form textarea {
  border-color: rgba(11, 52, 56, .18);
  border-radius: 10px;
  padding: 15px 16px;
}

.contact-form__submit {
  width: auto;
  min-width: 190px;
  padding-inline: 26px;
  border-radius: 999px;
}

.contact-page__team-column {
  padding-left: 0;
  border-left: 0;
  border-top: 1px solid rgba(11, 52, 56, .18);
  padding-top: 30px;
}

.contact-team-intro {
  grid-template-columns: 44px minmax(0, 1fr);
}

.contact-team-icon {
  border-color: rgba(8, 122, 120, .32);
  color: var(--contact-link);
  background: #fff;
}

.contact-team-intro h2 {
  font-size: clamp(1.45rem, 2.2vw, 2rem);
  letter-spacing: -.045em;
}

.contact-team-intro p {
  color: var(--contact-copy);
}

.contact-team-list {
  gap: 0;
  margin-top: 30px;
  padding-left: 0;
}

.contact-team-list a {
  gap: 7px;
  padding: 18px 0;
  border-top: 1px solid rgba(11, 52, 56, .14);
}

.contact-team-list a:last-child {
  border-bottom: 1px solid rgba(11, 52, 56, .14);
}

.contact-hours {
  margin-top: 28px;
}

@media (max-width: 900px) {
  .contact-page__message-inner {
    grid-template-columns: 1fr;
  }

  .contact-page__team-column {
    border-top: 1px solid rgba(11, 52, 56, .18);
    padding-top: 30px;
  }
}

@media (max-width: 620px) {
  .contact-page__screen-inner {
    padding-top: 48px;
  }

  .contact-page__locations-backdrop {
    height: 336px;
  }

  .contact-page__service-strip {
    margin-top: 28px;
  }

  .contact-location-grid {
    margin-top: 40px;
  }

  .contact-page__screen--message {
    padding: 58px 0 68px;
  }

  .contact-page__form-card {
    padding: 20px;
  }

  .contact-form__grid {
    grid-template-columns: 1fr;
  }

  .contact-form__grid .contact-form__wide {
    grid-column: auto;
  }

  .contact-form__submit {
    width: 100%;
  }
}

/* Phones and narrow tablets get a single reading column. This keeps the
 * location cards, form controls and team contacts comfortably tappable while
 * preserving the same editable Elementor content structure. */
@media (max-width: 767px) {
  .contact-page__screen--locations {
    padding: 52px 0 46px;
  }

  .contact-page__locations-backdrop {
    height: 410px;
  }

  .contact-page__locations-heading h1 {
    font-size: clamp(2.45rem, 12vw, 3.7rem);
    line-height: .96;
  }

  .contact-page__service-strip {
    grid-template-columns: 1fr;
    max-width: 290px;
    gap: 16px;
    margin-top: 28px;
  }

  .contact-page__service-strip > div {
    max-width: none;
  }

  .contact-location-grid {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-top: 38px;
  }

  .contact-location-card:last-child {
    grid-column: auto;
  }

  .contact-location-card > img {
    height: 176px;
  }

  .contact-location-card__body {
    min-height: 0;
  }

  .contact-page__screen--message {
    padding: 56px 0 66px;
  }

  .contact-page__message-inner {
    grid-template-columns: 1fr;
    gap: 38px;
  }

  .contact-page__message-heading h2 {
    font-size: clamp(1.9rem, 8.5vw, 2.8rem);
  }

  .contact-page__form-card {
    padding: 20px;
  }

  .contact-form__grid {
    grid-template-columns: 1fr;
  }

  .contact-form__grid .contact-form__wide {
    grid-column: auto;
  }

  .contact-form__submit {
    width: 100%;
  }

  .contact-page__team-column {
    padding-top: 34px;
  }
}