.contact-page {
  --contact-ink: #203b35;
  --contact-muted: #667a75;
  --contact-green: #78b90d;
  color: var(--contact-ink);
  background: #fff;
  font-family: "Open Sans", sans-serif;
}

.contact-page h1,
.contact-page h2 {
  font-family: "Raleway", sans-serif;
}

.contact-hero {
  padding: 180px 0 68px;
  background: linear-gradient(118deg, #f5f8ed 0%, #fff9ed 58%, #eef7fb 100%);
}

.contact-hero-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); align-items: center; gap: clamp(24px, 5vw, 72px); }
.contact-hero-text { position: relative; z-index: 1; }
.contact-hero-art { position: relative; display: grid; min-height: 330px; place-items: center; }
.contact-hero-art::before { position: absolute; width: min(360px, 78%); aspect-ratio: 1; border-radius: 50%; background: rgba(220, 237, 185, .72); content: ""; }
.contact-hero-art img { position: relative; display: block; width: min(100%, 540px); height: auto; object-fit: contain; filter: drop-shadow(0 22px 24px rgba(32, 59, 53, .16)); }
.contact-hero-badge { position: absolute; right: 0; bottom: 12px; display: flex; align-items: center; gap: 10px; padding: 13px 17px; border: 1px solid #edf0e5; border-radius: 14px; background: #fff; box-shadow: 0 12px 32px rgba(32, 59, 53, .1); color: #52645c; font-size: .86rem; font-weight: 600; }
.contact-hero-badge i { color: #78a52b; }

.contact-breadcrumb {
  display: flex;
  gap: 10px;
  margin: 0 0 32px;
  padding: 0;
  color: #788780;
  font-size: .82rem;
  list-style: none;
}

.contact-breadcrumb li + li::before { padding-right: 10px; color: #aab4ae; content: "/"; }
.contact-breadcrumb a { color: #527d12; text-decoration: none; }
.contact-breadcrumb a:hover { text-decoration: underline; }

.contact-eyebrow {
  margin: 0 0 10px;
  color: #a9761e;
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.contact-hero h1 {
  max-width: 790px;
  margin: 0 0 15px;
  color: var(--contact-ink);
  font-size: clamp(2.3rem, 5vw, 4rem);
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1.08;
}

.contact-hero-copy { max-width: 650px; margin: 0; color: var(--contact-muted); font-size: 1.02rem; line-height: 1.8; }
.contact-content { padding: 74px 0 82px; background: #fff; }
.contact-intro { margin-bottom: 26px; }
.contact-intro h2, .contact-form-heading h2 { margin: 0 0 12px; color: var(--contact-ink); font-size: clamp(1.7rem, 3vw, 2.25rem); font-weight: 800; letter-spacing: -.025em; }
.contact-intro > p:last-child, .contact-form-heading > p:last-child { margin: 0; color: var(--contact-muted); font-size: .93rem; line-height: 1.75; }
.contact-topic-list { display: grid; gap: 12px; }
.contact-topic { display: flex; align-items: center; gap: 14px; padding: 17px; border: 1px solid #e5ece5; border-radius: 14px; background: #fff; color: inherit; text-decoration: none; transition: border-color 160ms ease, transform 160ms ease, box-shadow 160ms ease; }
.contact-topic:hover { transform: translateY(-2px); border-color: #b8d58d; box-shadow: 0 8px 22px rgba(32, 59, 53, .07); color: inherit; }
.contact-topic-icon { display: grid; width: 44px; height: 44px; flex: 0 0 44px; place-items: center; border-radius: 12px; background: #f0f7e7; color: #679d10; }
.contact-topic > span:nth-child(2) { display: grid; gap: 4px; }
.contact-topic strong { color: var(--contact-ink); font-size: .91rem; }
.contact-topic small { color: var(--contact-muted); font-size: .77rem; line-height: 1.5; }
.contact-topic-arrow { margin-left: auto; color: #78a52b; font-size: .8rem; }
.contact-response-note { display: flex; gap: 12px; margin-top: 22px; padding: 16px; border-radius: 12px; background: #f6f8f3; color: #62746d; }
.contact-response-note > i { margin-top: 3px; color: #719e25; }
.contact-response-note p { margin: 0; font-size: .8rem; line-height: 1.65; }
.contact-response-note strong { color: var(--contact-ink); }
.contact-form-card { padding: clamp(24px, 4vw, 42px); border: 1px solid #e4ebe3; border-radius: 20px; background: #fff; box-shadow: 0 14px 40px rgba(32, 59, 53, .07); }
.contact-form-heading { margin-bottom: 22px; }
.contact-form-status { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 24px; padding: 13px 15px; border: 1px solid #ead7a8; border-radius: 10px; background: #fff9e9; color: #6f5a27; font-size: .81rem; line-height: 1.55; }
.contact-form-status i { margin-top: 3px; color: #bd8a22; }
.contact-form label { display: block; margin-bottom: 7px; color: #344a43; font-size: .82rem; font-weight: 700; }
.contact-form .form-control, .contact-form .form-select { min-height: 48px; padding: 11px 13px; border: 1px solid #dce5dd; border-radius: 9px; background-color: #fff; color: var(--contact-ink); font-size: .87rem; }
.contact-form textarea.form-control { min-height: 130px; resize: vertical; }

.contact-submit { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: 10px; padding: 11px 20px; border: 1px solid #6eaa0b; border-radius: 999px; background: var(--contact-green); color: #fff; font-size: .88rem; font-weight: 700; }

.contact-privacy-note { margin: 12px 0 0; color: #7b8982; font-size: .74rem; }
.contact-bottom { padding: 35px 0; background: #f5f8ef; }
.contact-bottom .contact-eyebrow { margin-bottom: 7px; }
.contact-bottom h2 { max-width: 650px; margin: 0 0 7px; color: var(--contact-ink); font-size: clamp(1.35rem, 2.5vw, 1.85rem); font-weight: 700; }
.contact-bottom p:last-child { margin: 0; color: var(--contact-muted); font-size: .86rem; }
.contact-explore-link { display: inline-flex; min-height: 46px; align-items: center; gap: 9px; padding: 11px 18px; border-radius: 999px; background: var(--contact-green); color: #fff; font-size: .86rem; font-weight: 700; text-decoration: none; }
.contact-explore-link:hover, .contact-explore-link:focus-visible { background: #639c05; color: #fff; }

@media (max-width: 991.98px) { .contact-hero { padding-top: 145px; } .contact-hero-grid { grid-template-columns: 1fr; gap: 22px; } .contact-hero-art { min-height: 260px; } .contact-hero-art img { width: min(100%, 430px); } .contact-hero-art::before { width: min(300px, 72%); } .contact-hero-badge { right: max(0px, calc((100% - 430px) / 2)); bottom: 0; } .contact-content { padding: 54px 0 62px; } }
@media (max-width: 575.98px) { .contact-hero { padding: 135px 0 44px; } .contact-breadcrumb { margin-bottom: 24px; } .contact-hero-art { min-height: 220px; } .contact-hero-art img { width: min(100%, 360px); } .contact-hero-badge { right: 0; max-width: 230px; padding: 10px 12px; font-size: .78rem; } .contact-content { padding: 40px 0 48px; } .contact-topic { padding: 14px; } .contact-bottom .contact-explore-link { width: 100%; justify-content: center; } }