:root {
  --service-forest: #0c4d40;
  --service-deep: #06352d;
  --service-mint: #daf0df;
  --service-lime: #a8cf45;
  --service-ink: #18312d;
  --service-paper: #f7f8f3;
}

* { box-sizing: border-box; }

.service-page { margin: 0; color: var(--service-ink); background: var(--service-paper); font-family: Georgia, "Times New Roman", serif; }
.service-page a { text-decoration: none; }
.service-header { padding: 16px 4vw; background: rgba(247, 248, 243, 0.94); border-bottom: 1px solid rgba(12, 77, 64, 0.1); }
.service-nav { display: flex; max-width: 1200px; min-height: 48px; margin: 0 auto; align-items: center; justify-content: space-between; background: transparent; box-shadow: none; }
.service-brand { display: inline-flex; gap: 9px; align-items: center; color: var(--service-deep); font-size: 1.3rem; font-weight: 700; letter-spacing: -0.04em; }
.service-brand-icon { display: inline-flex; width: 31px; height: 31px; overflow: hidden; align-items: center; justify-content: center; background: #fff; border: 1px solid rgba(12, 77, 64, 0.14); border-radius: 7px; }
.service-brand-icon img { display: block; width: 100%; height: 100%; object-fit: contain; }
.service-nav-links { display: flex; gap: 27px; }
.service-nav-links a { color: #46645d; font-family: "Trebuchet MS", sans-serif; font-size: 0.9rem; font-weight: 700; }
.service-nav-links a:hover { color: var(--service-forest); }
.service-login { padding: 11px 17px; color: var(--service-forest); border: 1px solid var(--service-forest); border-radius: 999px; font-family: "Trebuchet MS", sans-serif; font-size: 0.9rem; font-weight: 700; }
.service-login:hover { color: #fff; background: var(--service-forest); }

.service-hero, .contact-layout { max-width: 1200px; margin: 0 auto; padding-right: 4vw; padding-left: 4vw; }
.service-hero { display: grid; grid-template-columns: 1fr auto; gap: 60px; padding-top: 84px; padding-bottom: 78px; align-items: end; }
.service-eyebrow { margin: 0 0 15px; color: #638b32; font-family: "Trebuchet MS", sans-serif; font-size: 0.73rem; font-weight: 800; letter-spacing: 0.15em; text-transform: uppercase; }
.service-hero h1, .service-overview h2, .contact-card-heading h2 { margin: 0; color: var(--service-deep); font-size: clamp(2.65rem, 5vw, 4.8rem); font-weight: 500; letter-spacing: -0.06em; line-height: 0.99; }
.service-hero h1 { max-width: 760px; }
.service-hero h1 em { color: #5b8b34; font-style: italic; }
.service-lead { max-width: 670px; margin: 24px 0 0; color: #536b63; font-family: "Trebuchet MS", sans-serif; font-size: 1.08rem; line-height: 1.68; }
.service-hero-note { display: flex; width: 240px; gap: 12px; padding: 17px; align-items: flex-start; color: #49645b; background: var(--service-mint); border-left: 3px solid var(--service-lime); font-family: "Trebuchet MS", sans-serif; font-size: 0.86rem; line-height: 1.5; }
.service-hero-note i { color: var(--service-forest); font-size: 1.4rem; }

.contact-layout { display: grid; grid-template-columns: minmax(280px, 0.78fr) minmax(430px, 1.1fr); gap: clamp(48px, 8vw, 120px); padding-top: 72px; padding-bottom: 110px; background: #edf3ec; }
.service-overview { padding-top: 18px; }
.service-overview h2 { max-width: 390px; font-size: clamp(2.1rem, 3.7vw, 3.35rem); }
.service-overview-card { display: flex; gap: 15px; max-width: 405px; margin-top: 30px; }
.service-overview-card + .service-overview-card { margin-top: 20px; }
.service-overview-icon { display: grid; width: 42px; height: 42px; flex: 0 0 42px; align-items: center; justify-content: center; color: var(--service-forest); background: #fff; border-radius: 50%; }
.service-overview-icon i { font-size: 1.32rem; }
.service-overview-card h3 { margin: 1px 0 5px; color: var(--service-deep); font-size: 1.22rem; font-weight: 600; }
.service-overview-card p, .service-support { margin: 0; color: #60746b; font-family: "Trebuchet MS", sans-serif; font-size: 0.9rem; line-height: 1.6; }
.service-support { margin-top: 38px; }
.service-support a { color: #537f37; font-weight: 700; }

.contact-card { padding: 39px; background: #fff; box-shadow: 0 21px 48px rgba(12, 73, 58, 0.12); }
.contact-card-heading p { margin: 0 0 8px; color: #6c9733; font-family: "Trebuchet MS", sans-serif; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase; }
.contact-card-heading h2 { font-size: clamp(2rem, 3.3vw, 3rem); }
.contact-message { margin: 25px 0 0; padding: 13px 15px; font-family: "Trebuchet MS", sans-serif; font-size: 0.9rem; line-height: 1.5; }
.contact-message-success { color: #215d35; background: #e3f3e6; border-left: 3px solid #50a05f; }
.contact-message-error { color: #a12c27; background: #fff0ed; border-left: 3px solid #cc5148; }
.contact-form { margin-top: 28px; }
.contact-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 17px; }
.contact-field { display: block; margin: 0 0 18px; color: #36574e; font-family: "Trebuchet MS", sans-serif; font-size: 0.77rem; font-weight: 800; letter-spacing: 0.03em; }
.contact-field span { display: block; margin-bottom: 8px; }
.contact-field input, .contact-field select, .contact-field textarea { width: 100%; margin: 0; color: var(--service-ink); background: #fbfcf9; border: 1px solid #cbdacf; border-radius: 3px; box-shadow: none; font-family: "Trebuchet MS", sans-serif; font-size: 0.94rem; }
.contact-field input, .contact-field select { height: 45px; padding: 0 12px; }
.contact-field select { display: block; }
.contact-field textarea { min-height: 120px; padding: 12px; resize: vertical; }
.contact-field input:focus, .contact-field select:focus, .contact-field textarea:focus { border-color: var(--service-forest); box-shadow: 0 0 0 3px rgba(12, 77, 64, 0.1); outline: none; }
.contact-field small { display: block; margin-top: 6px; color: #b03932; font-size: 0.76rem; letter-spacing: 0; }
.contact-terms { margin: 2px 0 21px; color: #6b7f76; font-family: "Trebuchet MS", sans-serif; font-size: 0.78rem; line-height: 1.55; }
.contact-terms a { color: #537f37; font-weight: 700; }
.contact-submit { display: inline-flex; gap: 11px; min-height: 49px; padding: 0 21px; align-items: center; color: #fff; background: var(--service-forest); border: 0; border-radius: 3px; cursor: pointer; font-family: "Trebuchet MS", sans-serif; font-size: 0.92rem; font-weight: 700; }
.contact-submit:hover, .contact-submit:focus { color: #fff; background: #176754; }
.contact-submit-link { margin-top: 26px; }

.service-footer { display: grid; grid-template-columns: 1.4fr 1fr auto; gap: 40px; max-width: 1200px; margin: 0 auto; padding: 56px 4vw 25px; color: #a9c5b3; background: var(--service-deep); box-shadow: 0 0 0 100vmax var(--service-deep); clip-path: inset(0 -100vmax); font-family: "Trebuchet MS", sans-serif; font-size: 0.84rem; }
.service-brand-footer { color: #fff; }
.service-brand-footer .service-brand-icon { border-color: transparent; }
.service-footer p { max-width: 300px; margin: 15px 0 0; line-height: 1.55; }
.service-footer > div:nth-child(2) a { display: block; margin: 0 0 9px; color: #b6cfc0; }
.service-footer > div:nth-child(2) a:hover { color: var(--service-lime); }
.service-footer > span { align-self: end; color: #93ab9d; font-size: 0.74rem; white-space: nowrap; }

@media only screen and (max-width: 800px) {
  .service-nav-links { display: none; }
  .service-hero { grid-template-columns: 1fr; gap: 32px; padding-top: 66px; padding-bottom: 62px; }
  .service-hero-note { width: min(100%, 400px); }
  .contact-layout { grid-template-columns: 1fr; gap: 45px; padding-top: 60px; padding-bottom: 75px; }
  .service-footer { grid-template-columns: 1fr 1fr; }
  .service-footer > span { grid-column: 1 / -1; }
}

@media only screen and (max-width: 500px) {
  .service-header { padding: 12px 5vw; }
  .service-brand { font-size: 1.1rem; }
  .service-brand-icon { width: 27px; height: 27px; }
  .service-login { padding: 9px 12px; font-size: 0.8rem; }
  .service-hero, .contact-layout { padding-right: 5vw; padding-left: 5vw; }
  .service-hero h1 { font-size: 2.7rem; }
  .contact-card { padding: 25px; }
  .contact-form-grid { grid-template-columns: 1fr; }
  .service-footer { grid-template-columns: 1fr; padding-right: 5vw; padding-left: 5vw; }
  .service-footer > span { grid-column: auto; }
}