/* ASAP Pest & Wildlife — Global Styles (v4.1 Visual Rework)
   Matches the live removeasap.com Webflow aesthetic */

/* ============================================
   OUTLINED TEXT EFFECTS
   The signature visual — transparent fill with stroked border
   ============================================ */
.text-outlined-cream {
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 2px #F2EDDC;
  color: transparent;
}

.text-outlined-orange {
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 2px #B77537;
  color: transparent;
}

.text-outlined-navy {
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 2px #212936;
  color: transparent;
}

/* Responsive stroke width — thinner on mobile */
@media (max-width: 768px) {
  .text-outlined-cream,
  .text-outlined-orange,
  .text-outlined-navy {
    -webkit-text-stroke-width: 1.5px;
  }
}

/* ============================================
   WILDLIFE CARDS — hover overlay
   ============================================ */
.wildlife-card {
  cursor: pointer;
  transition: transform 0.2s ease;
}
.wildlife-card:hover {
  transform: translateY(-2px);
}

/* ============================================
   FAQ ACCORDION
   ============================================ */
.faq-item .faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}
.faq-item.open .faq-answer {
  max-height: 500px;
}
.faq-item .faq-toggle-icon {
  transition: transform 0.3s ease;
}
.faq-item.open .faq-toggle-icon {
  transform: rotate(180deg);
}

/* ============================================
   PHOTO GALLERY SLIDER
   ============================================ */
.slider-container {
  position: relative;
  overflow: hidden;
}
.slider-track {
  display: flex;
  transition: transform 0.5s ease;
}
.slider-slide {
  min-width: 100%;
  flex-shrink: 0;
}
.slider-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(242, 237, 220, 0.4);
  cursor: pointer;
  transition: background 0.3s ease;
}
.slider-dot.active {
  background: #B77537;
}

/* ============================================
   LIGHTBOX
   ============================================ */
.lightbox-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.9);
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
.lightbox-overlay.active {
  opacity: 1;
  pointer-events: all;
}
.lightbox-overlay img {
  max-width: 90vw;
  max-height: 85vh;
  object-fit: contain;
}

/* ============================================
   FORM STYLING — matches Webflow original
   ============================================ */
input::placeholder,
select::placeholder {
  color: rgba(242, 237, 220, 0.4);
}

/* Select arrow color fix for dark backgrounds */
select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23F2EDDC' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 36px;
}

/* ============================================
   SMOOTH SCROLL
   ============================================ */
html {
  scroll-behavior: smooth;
}

/* ============================================
   BODY TEXT DEFAULTS
   The header is position: fixed at top:0 so it overlays content;
   padding-top on body pushes the page content below the header height.
   Heights account for the new two-row navbar:
     - lg+ (1024): pill (44) + overlap (-23) + logo (260×0.69 ≈ 179) + paddings (16) ≈ 216
     - md  (768) : pill (44) + overlap (-23) + logo (220×0.69 ≈ 152) + paddings (16) ≈ 189
     - base      : no pill, hamburger only — logo (180×0.69 ≈ 124) + paddings (16) ≈ 140
   Body padding ≈ navbar_height + small buffer.
   On the home page, body.home-page overrides this to 0 at canvas+ where
   the canvas-cap's pt:240 takes over navbar clearance.
   ============================================ */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding-top: 140px;
}
@media (min-width: 768px) {
  body { padding-top: 200px; }
}
@media (min-width: 1024px) {
  body { padding-top: 230px; }
}

@media (min-width: 1024px) {
  #site-header .flex.items-center.justify-between > a:first-child img {
    width: 220px;
    transform: translateY(-55px);
  }
}

/* Reference-matched interior hero treatment.
   These pages use the fixed header over the first viewport, not a separate
   cream spacer above the hero. */
body.theme-navy,
body.theme-orange {
  padding-top: 0;
}
body.theme-navy main > section:first-child,
body.theme-orange main > section:first-child {
  min-height: 430px;
  padding-top: clamp(150px, 15vw, 190px);
}
body.theme-navy main > section:first-child {
  background-color: #212936;
}
body.theme-orange main > section:first-child {
  background-color: #B77537;
}
body.theme-navy main > section:first-child .text-outlined-navy,
body.theme-orange main > section:first-child .text-outlined-navy {
  -webkit-text-stroke-color: #F2EDDC;
}
body.theme-navy main > section:first-child .text-navy,
body.theme-orange main > section:first-child .text-navy {
  color: #F2EDDC;
}
body.theme-navy #site-header:not(.is-scrolled) nav a {
  color: #B77537;
}
body.theme-orange #site-header:not(.is-scrolled) nav a {
  color: #212936;
}
body.theme-navy #site-header:not(.is-scrolled) nav a[aria-current="page"],
body.theme-orange #site-header:not(.is-scrolled) nav a[aria-current="page"] {
  color: #F2EDDC;
}
body.theme-orange #site-header:not(.is-scrolled) .flex.items-center.justify-between > a:first-child img {
  filter: brightness(0) saturate(100%) invert(11%) sepia(18%) saturate(894%) hue-rotate(178deg) brightness(93%) contrast(92%);
}
body.theme-navy #site-header:not(.is-scrolled) #mobile-menu-btn,
body.theme-orange #site-header:not(.is-scrolled) #mobile-menu-btn {
  color: #F2EDDC;
}
body.theme-wildlife main > section:first-child,
body.theme-pest main > section:first-child {
  min-height: 433px;
  padding-top: 160px;
  padding-bottom: 28px;
}
body.theme-wildlife main > section:first-child > .max-w-7xl,
body.theme-pest main > section:first-child > .max-w-7xl {
  text-align: center;
}
body.theme-wildlife main > section:first-child h1,
body.theme-pest main > section:first-child h1 {
  display: inline-block;
  margin: 0 auto;
}
body.theme-wildlife main > section:first-child h1::before,
body.theme-pest main > section:first-child h1::before {
  content: "";
  display: block;
  width: 68px;
  height: 68px;
  margin: 0 auto 42px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
body.theme-wildlife main > section:first-child h1::before {
  background-image: url("/assets/images/mascots/orange-mascot.svg");
}
body.theme-pest main > section:first-child h1 {
  font-size: clamp(4.5rem, 9vw, 8rem) !important;
  white-space: nowrap;
}
body.theme-pest main > section:first-child h1::before {
  background-image: url("/assets/images/animals/ant.webp");
}
@media (max-width: 767px) {
  body.theme-navy,
  body.theme-orange {
    padding-top: 0;
  }
  body.theme-navy main > section:first-child,
  body.theme-orange main > section:first-child {
    min-height: 330px;
    padding-top: 120px;
  }
  body.theme-wildlife main > section:first-child h1::before,
  body.theme-pest main > section:first-child h1::before {
    width: 48px;
    height: 48px;
    margin-bottom: 24px;
  }
  body.theme-pest main > section:first-child h1 {
    white-space: normal;
  }
}

body.about-page main > section:first-child {
  min-height: clamp(426px, 24vw, 736px);
  padding-top: clamp(166px, 13vw, 258px);
  padding-bottom: 0;
}
body.about-page {
  background: #212936;
}
body.about-page #site-header:not(.is-scrolled) nav {
  gap: 30px;
}
body.about-page #site-header:not(.is-scrolled) nav a {
  color: #B77537 !important;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .5px;
  opacity: 1;
  padding-bottom: 10px;
  padding-top: 10px;
}
body.about-page #site-header:not(.is-scrolled) nav a[aria-current="page"] {
  color: #F2EDDC !important;
}
body.about-page .about-contact-pill {
  background: #B77537 !important;
  color: #F2EDDC !important;
  font-size: 16px !important;
  letter-spacing: 2px !important;
  line-height: 20px !important;
  max-width: 500px !important;
  padding: 12px 24px !important;
}
body.about-page .about-contact-pill a,
body.about-page .about-contact-pill span {
  color: #F2EDDC !important;
}
body.about-page #site-header:not(.is-scrolled) #mobile-menu-btn {
  color: #F2EDDC;
}
body.about-page .about-reference-hero {
  background-image: url("/assets/images/backgrounds/about-hero-bg.svg");
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: 120vw;
  overflow: visible;
}
body.about-page .about-reference-hero > .absolute {
  display: none;
}
body.about-page .about-reference-hero > .max-w-7xl {
  max-width: 1440px;
  padding-left: 7.14vw;
  padding-right: 7.14vw;
  text-align: left;
}
body.about-page .about-hero-heading {
  position: relative;
  display: block;
  z-index: 20;
  margin-left: 0;
  width: 100%;
}
body.about-page .about-hero-title {
  font-size: clamp(42.9px, 11vw, 170px);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1.6px #B77537;
  text-stroke: 1.6px #B77537;
}
body.about-page .about-hero-subtitle {
  color: #F2EDDC;
  font-size: clamp(19px, 4vw, 60px);
  font-weight: 900;
  letter-spacing: .25em;
  line-height: 1;
  margin: clamp(23px, 1.785vw, 26px) 0 0;
  position: relative;
  z-index: 20;
}
body.about-page .about-hero-bird {
  position: absolute;
  right: 6.45vw;
  top: clamp(166px, 13vw, 195px);
  width: clamp(120px, 21.875vw, 410px);
  height: auto;
  z-index: 30;
  opacity: .92;
  pointer-events: none;
}
body.about-page .about-reference-divider {
  position: relative;
  height: 118px;
  background: #212936;
  z-index: 10;
}
body.about-page .about-reference-divider::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 28px;
  background: #F2EDDC;
}
body.about-page .about-reference-divider::after {
  content: "";
  position: absolute;
  top: 0;
  left: calc(100% - 220px);
  width: 0;
  height: 0;
  border-left: clamp(100px, 8.1vw, 170px) solid transparent;
  border-right: clamp(100px, 8.1vw, 170px) solid transparent;
  border-top: clamp(170px, 10vw, 300px) solid #F2EDDC;
}
body.about-page .about-aim-section {
  background-image: url("/assets/images/backgrounds/about-bg.svg");
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: 100vw;
  margin-top: 0;
  padding-top: 91.390625px;
}
body.about-page .about-aim-section > .absolute {
  display: none;
}
body.about-page .about-aim-section > .max-w-4xl {
  max-width: 1440px;
  padding-left: 7.14vw;
  padding-right: 7.14vw;
}
body.about-page .about-intro-lockup {
  display: flex;
  align-items: center;
  gap: 16px;
  width: min(457px, 100%);
  margin-left: auto;
  margin-bottom: 181.78125px;
}
body.about-page .about-intro-mascot {
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
}
body.about-page .about-intro-lockup p {
  font-size: 16px !important;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: 0;
  text-transform: none;
}
body.about-page .about-aim-title {
  color: #212936;
  -webkit-text-fill-color: #212936;
  -webkit-text-stroke: 1.2px #B77537;
  font-size: clamp(32px, 6vw, 90px);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  margin-bottom: clamp(28px, 3.57vw, 51.5px);
  text-stroke: 1.2px #B77537;
}
body.about-page .about-main-copy {
  font-size: clamp(18px, 1.953125vw, 30px);
  font-weight: 500;
  line-height: 1.5;
  margin: 0;
  max-width: none;
  width: min(1220px, 88vw);
}

@media (max-width: 767px) {
  body.about-page #site-header .flex.items-center.justify-between > a:first-child img {
    transform: none;
    width: 113.984375px;
  }
  body.about-page main > section:first-child {
    min-height: 189.15625px;
    padding-top: 84px;
  }
  body.about-page .about-reference-hero > .max-w-7xl,
  body.about-page .about-aim-section > .max-w-4xl {
    padding-left: 27.84375px;
    padding-right: 27.84375px;
  }
  body.about-page .about-hero-heading {
    width: 100%;
  }
  body.about-page .about-hero-title {
    font-size: 42.9px;
    line-height: 1;
  }
  body.about-page .about-hero-subtitle {
    font-size: 19px;
    letter-spacing: 3.9px;
    line-height: 22.8px;
    margin-top: 12px;
    max-width: 334.3125px;
  }
  body.about-page .about-hero-bird {
    display: block !important;
    left: 240px;
    right: auto;
    top: 89.15625px;
    width: 119.984375px;
  }
  body.about-page .about-reference-divider {
    display: block;
    height: 51.21875px;
  }
  body.about-page .about-reference-divider::before {
    height: 25px;
  }
  body.about-page .about-reference-divider::after {
    display: none;
  }
  body.about-page .about-aim-section {
    background-position: calc(100% - 16px) 182px;
    background-size: 100vw auto;
    padding-top: 27.84375px;
  }
  body.about-page .about-intro-lockup {
    align-items: center;
    gap: 19.453125px;
    margin-bottom: 55.6875px;
    width: 100%;
  }
  body.about-page .about-intro-mascot {
    width: 55.4375px;
    height: 55.4375px;
  }
  body.about-page .about-intro-lockup p {
    color: #F2EDDC;
    font-size: 15px !important;
    font-weight: 500;
    line-height: 18.75px;
    max-width: 258.859375px;
  }
  body.about-page .about-aim-title {
    color: #212936;
    -webkit-text-fill-color: #212936;
    font-size: 32px;
    line-height: 38.4px;
    margin-bottom: 27.84375px;
  }
  body.about-page .about-main-copy {
    font-size: 18px;
    line-height: 27px;
    max-width: 334.3125px;
  }
}

@media (min-width: 1440px) {
  body.about-page .about-reference-hero > .max-w-7xl,
  body.about-page .about-aim-section > .max-w-4xl {
    padding-left: 103px;
    padding-right: 103px;
  }
  body.about-page .about-hero-bird {
    left: calc(50% + 139px);
    right: auto;
    top: 194.90625px;
    width: 409.984375px;
  }
  body.about-page .about-reference-divider::after {
    left: calc(50% - 205px);
  }
  body.about-page .about-reference-divider {
    height: 222.5px;
  }
  body.about-page .about-reference-divider::after {
    border-left-width: 141.5px;
    border-right-width: 141.5px;
    border-top-width: 265.578125px;
  }
  body.about-page .about-intro-lockup {
    width: 515px;
    margin-bottom: 206px;
  }
  body.about-page .about-aim-section {
    padding-top: 103px;
  }
}

@media (min-width: 768px) {
  body.about-page #site-header .flex.items-center.justify-between > a:first-child img {
    transform: translateY(-46px);
    width: min(16.28vw, 235px);
  }
  body.about-page .about-contact-pill {
    width: auto !important;
  }
  body.about-page #site-header:not(.is-scrolled) nav {
    transform: translateY(8px);
  }
}

@media (min-width: 1024px) {
  body.about-page .about-contact-pill {
    width: 40% !important;
  }
}

/* ============================================
   COMMERCIAL PAGE — Webflow reference match
   Robert 2026-05-26: Commercial uses a cream hero, filled navy headline,
   full-width process artwork, and navy partner band. It must not inherit the
   generic hollow-title inner-page treatment.
   ============================================ */
body.commercial-page {
  background: #F2EDDC;
  padding-top: 0;
}
body.commercial-page #site-header:not(.is-scrolled) nav {
  gap: 30px;
  margin-top: 20px;
}
body.commercial-page #site-header:not(.is-scrolled) nav a {
  color: #B77537 !important;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .5px;
  line-height: 150%;
  padding-bottom: 10px;
  padding-top: 10px;
}
body.commercial-page #site-header:not(.is-scrolled) nav a[aria-current="page"] {
  color: #212936 !important;
}
body.commercial-page #site-header:not(.is-scrolled) #mobile-menu-btn {
  color: #212936;
}
body.commercial-page .commercial-contact-pill {
  width: min(37.144vw, 500px) !important;
}
body.commercial-page #site-header .flex.items-center.justify-between > a:first-child {
  overflow: visible;
  width: min(14.28vw, 206px);
}
body.commercial-page #site-header .flex.items-center.justify-between > a:first-child img {
  filter: none !important;
  max-width: none !important;
  transform: translateY(-46px);
  width: 114% !important;
}
body.commercial-page .commercial-reference-hero {
  background-color: #F2EDDC;
  background-image: url("/assets/images/backgrounds/home-mission-bg.webp"), url("/assets/images/backgrounds/home-mission-bg.svg");
  background-position: 50% 0, 50% 0;
  background-repeat: repeat, no-repeat;
  background-size: auto, 100vw;
  color: #212936;
  overflow: hidden;
  position: relative;
}
body.commercial-page .commercial-hero-inner {
  margin-left: auto;
  margin-right: auto;
  max-width: 1440px;
  padding: clamp(115.84375px, 18.08vw, 260px) 7.14vw 40px;
  position: relative;
  text-align: center;
  z-index: 10;
}
body.commercial-page .commercial-hero-title {
  color: #212936;
  font-family: urw-din, sans-serif;
  font-size: clamp(34px, 4.6875vw, 60px);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.2;
  margin: 0 auto;
  max-width: 1097.21875px;
  text-transform: uppercase;
}
body.commercial-page .commercial-hero-subtitle {
  color: #212936;
  font-family: urw-din, sans-serif;
  font-size: clamp(24px, 2.34vw, 30px);
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.333;
  margin: 42px auto 0;
  max-width: 1097.21875px;
}
body.commercial-page .commercial-hero-subtitle span {
  color: #B77537;
  font-weight: 700;
}
body.commercial-page .commercial-hero-copy {
  color: #212936;
  font-family: urw-din, sans-serif;
  font-size: clamp(24px, 2.34vw, 30px);
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.333;
  margin: 42px auto 0;
  max-width: 1097.21875px;
}
body.commercial-page .commercial-process-image {
  display: block;
  height: auto;
  width: 100%;
}
body.commercial-page .commercial-partners-section {
  background: #212936;
  color: #F2EDDC;
  overflow: hidden;
  padding: 7.14vw 0 40px;
}
body.commercial-page .commercial-partners-inner {
  margin-left: auto;
  margin-right: auto;
  max-width: 1440px;
  padding-left: 7.14vw;
  padding-right: 7.14vw;
}
body.commercial-page .commercial-partners-section h3 {
  color: #F2EDDC;
  font-family: urw-din, sans-serif;
  font-size: 35px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.5;
  margin: 0 auto 45.6875px;
  text-align: center;
}
body.commercial-page .commercial-partners-section h3 span {
  color: #B77537;
}
body.commercial-page .commercial-partner-logos {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-left: auto;
  margin-right: auto;
  max-width: 1126.390625px;
  min-height: 158.9375px;
  position: relative;
  width: 88vw;
}
body.commercial-page .commercial-partner-logos img {
  display: block;
  filter: brightness(0) saturate(100%) invert(92%) sepia(9%) saturate(307%) hue-rotate(351deg) brightness(105%) contrast(91%);
  height: auto;
  object-fit: contain;
  opacity: 1;
}
body.commercial-page .commercial-logo-tps { width: 137.078125px; }
body.commercial-page .commercial-logo-ksm { width: 91.390625px; }
body.commercial-page .commercial-logo-cw { width: 182.78125px; }
body.commercial-page .commercial-logo-gfl { width: 91.390625px; }
body.commercial-page .commercial-logo-ccm { width: 182.78125px; }
body.commercial-page .commercial-logo-nmsdc {
  left: calc(100% + 99px);
  position: absolute;
  width: 128px;
}
body.commercial-page .commercial-business-section {
  background-color: #F2EDDC;
  background-image: url("/assets/images/backgrounds/home-mission-bg.webp"), url("/assets/images/backgrounds/home-mission-bg.svg");
  background-position: 50% 0, 50% 0;
  background-repeat: repeat, no-repeat;
  background-size: auto, 100vw;
  padding: 7.14vw 0;
}
body.commercial-page .commercial-business-section > .absolute {
  display: none;
}
body.commercial-page .commercial-business-section > .max-w-6xl {
  max-width: 1440px;
  padding-left: 7.14vw;
  padding-right: 7.14vw;
}
body.commercial-page .commercial-business-kicker {
  color: #212936;
  font-family: urw-din, sans-serif;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 2px;
  line-height: 1.5;
  margin: 0 0 90px;
}
body.commercial-page .commercial-business-kicker span {
  color: #B77537;
}
body.commercial-page .commercial-business-grid {
  gap: 15px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
body.commercial-page .commercial-business-grid > div {
  align-items: center;
  background: rgba(242, 237, 220, .62) !important;
  border: 1px solid rgba(33, 41, 54, .86) !important;
  border-radius: 24px !important;
  color: #212936 !important;
  display: flex;
  font-family: urw-din, sans-serif;
  font-size: 24px !important;
  font-weight: 700;
  justify-content: center;
  letter-spacing: 0 !important;
  line-height: 1.25;
  min-height: 111px;
  padding: 20px 24px !important;
  text-transform: none !important;
}

@media (max-width: 767px) {
  body.commercial-page #site-header .flex.items-center.justify-between > a:first-child {
    width: 100px;
  }
  body.commercial-page #site-header .flex.items-center.justify-between > a:first-child img {
    max-width: none !important;
    transform: none;
    width: 113.984375px !important;
  }
  body.commercial-page .commercial-reference-hero {
    background-size: auto, 190vw;
  }
  body.commercial-page .commercial-hero-inner {
    padding: 115.84375px 27.84375px 40px;
  }
  body.commercial-page .commercial-hero-title {
    font-size: 34px;
    line-height: 40.8px;
  }
  body.commercial-page .commercial-hero-subtitle {
    font-size: 24px;
    line-height: 32px;
    margin-top: 32px;
  }
  body.commercial-page .commercial-hero-copy {
    font-size: 24px;
    line-height: 34px;
    margin-top: 32px;
  }
  body.commercial-page .commercial-partners-section {
    padding: 27.84375px 0 40px;
  }
  body.commercial-page .commercial-partners-inner {
    padding-left: 27.84375px;
    padding-right: 27.84375px;
  }
  body.commercial-page .commercial-partners-section h3 {
    font-size: 35px;
    line-height: 52.5px;
    margin-bottom: 27.84375px;
    text-align: left;
    width: 334.3125px;
  }
  body.commercial-page .commercial-partner-logos {
    justify-content: flex-start;
    gap: 20px;
    margin-left: 0;
    min-height: 112.5px;
    width: 1126px;
  }
  body.commercial-page .commercial-logo-tps { width: 111.375px; }
  body.commercial-page .commercial-logo-ksm { width: 83.53125px; }
  body.commercial-page .commercial-logo-cw { width: 139.21875px; }
  body.commercial-page .commercial-logo-gfl { width: 83.53125px; }
  body.commercial-page .commercial-logo-ccm { width: 139.21875px; }
  body.commercial-page .commercial-logo-nmsdc {
    left: auto;
    position: relative;
    width: 101.390625px;
  }
  body.commercial-page .commercial-business-section {
    background-size: auto, 190vw;
    padding: 55.6875px 0;
  }
  body.commercial-page .commercial-business-section > .max-w-6xl {
    padding-left: 27.84375px;
    padding-right: 27.84375px;
  }
  body.commercial-page .commercial-business-kicker {
    font-size: 15px;
    line-height: 22.5px;
    margin-bottom: 55.6875px;
  }
  body.commercial-page .commercial-business-grid {
    grid-template-columns: 1fr;
  }
  body.commercial-page .commercial-business-grid > div {
    font-size: 20px !important;
    min-height: 90px;
  }
}

@media (min-width: 1440px) {
  body.commercial-page .commercial-hero-inner,
  body.commercial-page .commercial-partners-inner,
  body.commercial-page .commercial-business-section > .max-w-6xl {
    padding-left: 103px;
    padding-right: 103px;
  }
  body.commercial-page .commercial-hero-inner {
    padding-top: 260px;
  }
  body.commercial-page .commercial-partners-section,
  body.commercial-page .commercial-business-section {
    padding-top: 103px;
  }
}

/* ============================================
   PEST CONTROL PAGE — Webflow reference match
   John/Robert 2026-05-26: this page cannot reuse the generic orange
   inner-page hero. The reference uses a burnt-orange hero with a cream phone
   band, pest art, and a dedicated cream intro section.
   ============================================ */
body.pest-control-page {
  background: #F2EDDC;
}
body.pest-control-page #site-header:not(.is-scrolled) nav {
  gap: 30px;
  margin-top: 20px;
}
body.pest-control-page #site-header:not(.is-scrolled) nav a {
  color: #212936 !important;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .5px;
  line-height: 150%;
  padding-bottom: 10px;
  padding-top: 10px;
}
body.pest-control-page #site-header:not(.is-scrolled) nav a[aria-current="page"] {
  color: #F2EDDC !important;
}
body.pest-control-page #site-header:not(.is-scrolled) #mobile-menu-btn {
  color: #212936;
}
body.pest-control-page #site-header > div.hidden.md\:flex {
  width: min(37.144vw, 500px) !important;
}
body.pest-control-page #site-header .flex.items-center.justify-between > a:first-child {
  overflow: visible;
  width: min(14.28vw, 206px);
}
body.pest-control-page #site-header .flex.items-center.justify-between > a:first-child img,
body.pest-control-page #site-header:not(.is-scrolled) .flex.items-center.justify-between > a:first-child img {
  filter: none !important;
  max-width: none !important;
  transform: translateY(-46px);
  width: 114% !important;
}
body.pest-control-page main > section:first-child,
body.pest-control-page .pest-reference-hero {
  background-color: #B77537;
  background-image: url("/assets/images/backgrounds/contact-hero-bg.svg");
  background-position: 80% 20%;
  background-repeat: no-repeat;
  background-size: 130vw;
  min-height: auto;
  overflow: hidden;
  padding: 0;
  position: relative;
}
body.pest-control-page .pest-reference-hero-inner {
  margin-left: auto;
  margin-right: auto;
  max-width: 1440px;
  padding: 13vw 7.14vw 0;
  position: relative;
  text-align: center;
  z-index: 10;
}
body.pest-control-page .pest-hero-mascot {
  display: block;
  height: auto;
  margin: 0 auto 3.57vw;
  width: 80px;
}
body.pest-control-page .pest-hero-title {
  color: transparent;
  font-family: urw-din, sans-serif;
  font-size: clamp(82px, 11vw, 170px);
  font-weight: 900;
  letter-spacing: 0;
  line-height: .92;
  margin: 0;
  display: inline-block;
  transform: translateY(-23px);
  transform-origin: center center;
  text-transform: uppercase;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 2px #F2EDDC;
  text-stroke: 2px #F2EDDC;
}
body.pest-control-page .pest-hero-phone-band {
  align-items: center;
  background: #F2EDDC;
  display: flex;
  justify-content: flex-end;
  margin: 2.6vw 14.28vw 7.14vw 0;
  max-width: 1440px;
  min-height: 72px;
  padding: 15px 25.75px 15px 7.14vw;
  position: relative;
  z-index: 10;
}
body.pest-control-page .pest-hero-phone {
  color: #212936;
  font-family: urw-din, sans-serif;
  font-size: 35px;
  font-weight: 900;
  letter-spacing: 2px;
  line-height: 1.2;
  position: relative;
  text-decoration: none;
  z-index: 2;
}
body.pest-control-page .pest-hero-phone:hover {
  color: #B77537;
}
body.pest-control-page .pest-hero-carat {
  height: auto;
  position: absolute;
  right: -9%;
  top: 0;
  width: 14.28vw;
  z-index: 1;
}
body.pest-control-page .pest-roach,
body.pest-control-page .pest-ant {
  height: auto;
  pointer-events: none;
  position: absolute;
  z-index: 5;
}
body.pest-control-page .pest-roach {
  left: -4%;
  max-width: 270px;
  top: -5%;
  transform: translate(6vw, -18vw);
  width: 60vw;
}
body.pest-control-page .pest-ant {
  max-width: 410px;
  right: 12%;
  top: 9%;
  transform: rotateY(180deg) translate(-10vw, -8vw);
  width: 30vw;
}
body.pest-control-page .pest-hero-copy-wrap {
  color: #F2EDDC;
  margin-left: auto;
  margin-right: auto;
  max-width: 1440px;
  padding: 7.14vw 7.14vw 60px;
  position: relative;
  z-index: 10;
}
body.pest-control-page .pest-hero-copy-wrap p {
  font-family: urw-din, sans-serif;
  font-size: 25px;
  font-weight: 500;
  line-height: 1.5;
  margin: 0;
  max-width: 824px;
  width: 57.1429vw;
}
body.pest-control-page .pest-intro-section {
  background-color: #F2EDDC;
  background-image: url("/assets/images/backgrounds/home-mission-bg.webp"), url("/assets/images/backgrounds/home-mission-bg.svg");
  background-position: 50% 0, 50% 0;
  background-repeat: repeat, no-repeat;
  background-size: auto, 100vw;
  overflow: hidden;
  padding: 7.14vw 0;
  position: relative;
}
body.pest-control-page .pest-intro-inner,
body.pest-control-page .pest-why-inner,
body.pest-control-page .pest-bugs-inner {
  margin-left: auto;
  margin-right: auto;
  max-width: 1440px;
  padding-left: 7.14vw;
  padding-right: 7.14vw;
  position: relative;
}
body.pest-control-page .pest-intro-heading-wrap {
  display: inline-block;
  margin-bottom: 3.57vw;
  max-width: 760px;
}
body.pest-control-page .pest-intro-heading-wrap h2 {
  color: #212936;
  font-family: urw-din, sans-serif;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 1px;
  line-height: 1.5;
  margin: 0;
  text-transform: uppercase;
}
body.pest-control-page .pest-intro-heading-wrap h2 span {
  color: #B77537;
}
body.pest-control-page .pest-intro-underline {
  background: #212936;
  border-top: 0;
  height: 6px;
  margin-top: 5px;
  position: relative;
  width: 100%;
}
body.pest-control-page .pest-intro-underline img {
  height: auto;
  object-fit: contain;
  object-position: right center;
  position: absolute;
  right: -6px;
  top: 0;
  width: 25px;
}
body.pest-control-page .pest-intro-copy {
  color: #212936;
  font-family: urw-din, sans-serif;
  font-size: clamp(18px, 1.736vw, 25px);
  font-weight: 500;
  line-height: 1.5;
  max-width: 1030px;
}
body.pest-control-page .pest-intro-copy p {
  margin: 0 0 24px;
}
body.pest-control-page .pest-intro-copy ul {
  columns: 2;
  list-style: disc;
  margin: 0 0 24px 24px;
  padding: 0;
}
body.pest-control-page .pest-intro-copy li {
  break-inside: avoid;
  margin-bottom: 8px;
}
body.pest-control-page .pest-why-section {
  background: #212936;
  color: #F2EDDC;
  padding: 7.14vw 0;
}
body.pest-control-page .pest-why-section h2,
body.pest-control-page .pest-bugs-cta h2 {
  color: transparent;
  font-family: urw-din, sans-serif;
  font-size: clamp(48px, 7vw, 105px);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  margin: 0 0 3.57vw;
  text-transform: uppercase;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 2px #F2EDDC;
  text-stroke: 2px #F2EDDC;
}
body.pest-control-page .pest-why-lead {
  color: #B77537;
  font-family: urw-din, sans-serif;
  font-size: clamp(20px, 1.736vw, 25px);
  font-weight: 500;
  line-height: 1.5;
  margin: 0 0 4.285vw;
  max-width: 824px;
}
body.pest-control-page .pest-reason-list {
  display: grid;
  gap: 3.57vw;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 1050px;
}
body.pest-control-page .pest-reason-list article {
  color: #B77537;
}
body.pest-control-page .pest-reason-list h3 {
  background: #B77537;
  border-radius: 4px 16px 4px 16px;
  color: #F2EDDC;
  display: inline-block;
  font-family: urw-din, sans-serif;
  font-size: 25px;
  font-weight: 900;
  letter-spacing: 2px;
  line-height: 1.2;
  margin: 0 0 18px;
  padding: 8px 30px;
  text-transform: uppercase;
}
body.pest-control-page .pest-reason-list p {
  font-family: urw-din, sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.5;
  margin: 0;
}
body.pest-control-page .pest-bugs-cta {
  background-color: #212936;
  background-image: url("/assets/images/backgrounds/contact-hero-bg.svg");
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 110vw;
  color: #F2EDDC;
  overflow: hidden;
  padding: 7.14vw 0;
  text-align: center;
}
body.pest-control-page .pest-bugs-inner {
  max-width: 1100px;
}
body.pest-control-page .pest-bugs-mascot {
  display: block;
  height: auto;
  margin: 0 auto 28px;
  width: 80px;
}
body.pest-control-page .pest-bugs-cta p {
  font-family: urw-din, sans-serif;
  font-size: clamp(18px, 1.736vw, 25px);
  font-weight: 500;
  line-height: 1.5;
  margin: 0 auto 32px;
  max-width: 690px;
}
body.pest-control-page .pest-bugs-cta a {
  background: #F2EDDC;
  border-radius: 4px 16px 4px 16px;
  color: #212936;
  display: inline-block;
  font-family: urw-din, sans-serif;
  font-size: 15px;
  font-weight: 900;
  letter-spacing: 2px;
  line-height: 1.2;
  padding: 14px 28px;
  text-decoration: none;
}
body.pest-control-page .pest-bugs-cta a:hover {
  background: #B77537;
  color: #F2EDDC;
}

@media (max-width: 767px) {
  body.pest-control-page #site-header .flex.items-center.justify-between > a:first-child img,
  body.pest-control-page #site-header:not(.is-scrolled) .flex.items-center.justify-between > a:first-child img {
    max-width: none !important;
    width: 113.984375px !important;
    transform: none;
  }
  body.pest-control-page #site-header .flex.items-center.justify-between > a:first-child {
    width: 100px;
  }
  body.pest-control-page main > section:first-child,
  body.pest-control-page .pest-reference-hero {
    background-position: 55% 0;
    background-size: 210vw;
  }
  body.pest-control-page .pest-reference-hero-inner {
    padding: 51px 27.84375px 0;
  }
  body.pest-control-page .pest-hero-mascot {
    margin-bottom: 14px;
    width: 40px;
  }
  body.pest-control-page .pest-hero-title {
    font-size: 42px;
    line-height: 43px;
    transform: scaleX(1.025);
    white-space: nowrap;
    -webkit-text-stroke-width: 1.5px;
    text-stroke-width: 1.5px;
  }
  body.pest-control-page .pest-hero-phone-band {
    justify-content: center;
    margin: 27px 0 0;
    min-height: 87px;
    padding: 12px 27.84375px;
    text-align: center;
  }
  body.pest-control-page .pest-hero-phone {
    font-size: 30px;
    letter-spacing: 1px;
  }
  body.pest-control-page .pest-hero-carat,
  body.pest-control-page .pest-roach,
  body.pest-control-page .pest-ant {
    display: none;
  }
  body.pest-control-page .pest-hero-copy-wrap {
    padding: 56px 27.84375px 57px;
  }
  body.pest-control-page .pest-hero-copy-wrap p {
    font-size: 18px;
    line-height: 27px;
    max-width: none;
    width: 100%;
  }
  body.pest-control-page .pest-intro-section {
    background-size: auto, 190vw;
    padding: 27.84375px 0 55.6875px;
  }
  body.pest-control-page .pest-intro-inner,
  body.pest-control-page .pest-why-inner,
  body.pest-control-page .pest-bugs-inner {
    padding-left: 27.84375px;
    padding-right: 27.84375px;
  }
  body.pest-control-page .pest-intro-heading-wrap {
    margin-bottom: 35px;
  }
  body.pest-control-page .pest-intro-heading-wrap h2 {
    font-size: 15px;
    line-height: 22.5px;
  }
  body.pest-control-page .pest-intro-underline {
    height: 4px;
    margin-top: 4px;
    width: 100%;
  }
  body.pest-control-page .pest-intro-copy {
    font-size: 18px;
    line-height: 27px;
  }
  body.pest-control-page .pest-intro-copy ul {
    columns: 1;
  }
  body.pest-control-page .pest-why-section,
  body.pest-control-page .pest-bugs-cta {
    padding: 55.6875px 0;
  }
  body.pest-control-page .pest-why-section h2,
  body.pest-control-page .pest-bugs-cta h2 {
    font-size: 42px;
    line-height: 50px;
    margin-bottom: 35px;
    -webkit-text-stroke-width: 1.5px;
    text-stroke-width: 1.5px;
  }
  body.pest-control-page .pest-why-lead {
    font-size: 18px;
    line-height: 27px;
    margin-bottom: 42px;
  }
  body.pest-control-page .pest-reason-list {
    gap: 35px;
    grid-template-columns: 1fr;
  }
  body.pest-control-page .pest-reason-list h3 {
    font-size: 20px;
    letter-spacing: 1.5px;
    padding-left: 20px;
    padding-right: 20px;
  }
  body.pest-control-page .pest-bugs-mascot {
    width: 56px;
  }
}

@media (min-width: 768px) and (max-width: 1439px) {
  body.pest-control-page .pest-hero-phone-band {
    margin-top: calc(2.6vw + 2px);
  }
}

@media (min-width: 1440px) {
  body.pest-control-page .pest-reference-hero-inner,
  body.pest-control-page .pest-intro-inner,
  body.pest-control-page .pest-why-inner,
  body.pest-control-page .pest-bugs-inner {
    padding-left: 103px;
    padding-right: 103px;
  }
  body.pest-control-page .pest-reference-hero-inner {
    padding-top: 13vw;
  }
  body.pest-control-page .pest-hero-title {
    transform: translateY(-26px);
  }
  body.pest-control-page .pest-hero-mascot {
    margin-bottom: 51.5px;
  }
  body.pest-control-page .pest-hero-phone-band {
    margin-bottom: 103px;
    margin-right: 206px;
    padding-left: 103px;
  }
  body.pest-control-page .pest-hero-carat {
    width: 206px;
  }
  body.pest-control-page .pest-roach {
    left: 0;
    top: 0;
    transform: translate(1vw, -16vw);
    width: 14vw;
  }
  body.pest-control-page .pest-ant {
    right: 0;
    top: 0;
    transform: rotateY(180deg) translate(2vw, -3vw);
    width: 20vw;
  }
  body.pest-control-page .pest-hero-copy-wrap {
    padding: 103px 103px 206px;
  }
  body.pest-control-page .pest-intro-section,
  body.pest-control-page .pest-why-section,
  body.pest-control-page .pest-bugs-cta {
    padding-top: 103px;
    padding-bottom: 103px;
  }
}

/* ============================================
   SERVICES PAGE — Webflow reference match
   Robert 2026-05-26: Services is a navy reference page with an orange
   outlined hero, orange phone band, process artwork, and navy service blocks.
   It must not inherit the generic cream inner-page shell.
   ============================================ */
body.services-page {
  background: #212936;
  padding-top: 0;
}
body.services-page #site-header:not(.is-scrolled) nav {
  gap: 30px;
  margin-top: 20px;
}
body.services-page #site-header:not(.is-scrolled) nav a {
  color: #B77537 !important;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .5px;
  line-height: 150%;
  padding-bottom: 10px;
  padding-top: 10px;
}
body.services-page #site-header:not(.is-scrolled) nav a[aria-current="page"] {
  color: #F2EDDC !important;
}
body.services-page #site-header.is-scrolled {
  background-color: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
}
body.services-page #site-header.is-scrolled nav a {
  color: #B77537 !important;
}
body.services-page #site-header.is-scrolled nav a[aria-current="page"] {
  color: #F2EDDC !important;
}
body.services-page #site-header:not(.is-scrolled) #mobile-menu-btn {
  color: #F2EDDC;
}
body.services-page .services-contact-pill {
  background: #B77537 !important;
  color: #F2EDDC !important;
  width: min(37.144vw, 500px) !important;
}
body.services-page .services-contact-pill a,
body.services-page .services-contact-pill span {
  color: #F2EDDC !important;
}
body.services-page #site-header .flex.items-center.justify-between > a:first-child {
  overflow: visible;
  width: min(14.28vw, 206px);
}
body.services-page #site-header .flex.items-center.justify-between > a:first-child img,
body.services-page #site-header:not(.is-scrolled) .flex.items-center.justify-between > a:first-child img {
  filter: none !important;
  max-width: none !important;
  transform: translateY(-46px);
  width: 114% !important;
}
body.services-page .services-reference-hero {
  background-color: #212936;
  background-image: url("/assets/images/backgrounds/contact-hero-bg.svg");
  background-position: 80% 20%;
  background-repeat: no-repeat;
  background-size: 130vw;
  color: #F2EDDC;
  overflow: hidden;
  position: relative;
}
body.services-page .services-hero-inner {
  align-items: center;
  display: flex;
  flex-direction: column;
  margin-left: auto;
  margin-right: auto;
  max-width: 1440px;
  padding: 13vw 7.14vw 0;
  position: relative;
  z-index: 10;
}
body.services-page .services-hero-mascot {
  display: block;
  height: auto;
  margin: 0 auto 1.785vw;
  width: 80px;
}
body.services-page .services-hero-title {
  color: transparent;
  font-family: urw-din, sans-serif;
  font-size: clamp(43.23px, 11vw, 170px);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  margin: 0;
  text-transform: uppercase;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 2px #B77537;
  text-stroke: 2px #B77537;
}
body.services-page .services-hero-phone-band {
  align-items: center;
  background: #B77537;
  display: flex;
  justify-content: flex-end;
  margin: 1.785vw 14.28vw 7.14vw 0;
  max-width: 1440px;
  min-height: 72px;
  padding: 15px 25.75px 15px 7.14vw;
  position: relative;
  z-index: 10;
}
body.services-page .services-phone-copy {
  color: #F2EDDC;
  font-family: urw-din, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  margin-right: 20px;
}
body.services-page .services-phone-copy span {
  text-transform: uppercase;
}
body.services-page .services-phone-number {
  color: #212936;
  font-family: urw-din, sans-serif;
  font-size: 35px;
  font-weight: 900;
  letter-spacing: 2px;
  line-height: 1.2;
  position: relative;
  text-decoration: none;
  z-index: 2;
}
body.services-page .services-phone-number:hover {
  color: #F2EDDC;
}
body.services-page .services-hero-tooth {
  height: auto;
  position: absolute;
  right: -9%;
  top: 0;
  width: 14.28vw;
  z-index: 1;
}
body.services-page .services-intro-wrap,
body.services-page .services-section-inner,
body.services-page .services-wildlife-inner {
  margin-left: auto;
  margin-right: auto;
  max-width: 1440px;
  padding-left: 7.14vw;
  padding-right: 7.14vw;
  position: relative;
  z-index: 10;
}
body.services-page .services-intro-wrap {
  padding-bottom: 35px;
  padding-top: 7.14vw;
}
body.services-page .services-kicker {
  color: #F2EDDC;
  display: inline-block;
  font-family: urw-din, sans-serif;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 1px;
  line-height: 1.5;
  margin-bottom: 3.57vw;
  text-transform: uppercase;
}
body.services-page .services-kicker span {
  color: #B77537;
}
body.services-page .services-kicker-underline {
  background: #B77537;
  height: 6px;
  margin-top: 8px;
  position: relative;
  width: 100%;
}
body.services-page .services-kicker-underline img {
  height: auto;
  object-fit: contain;
  object-position: right center;
  position: absolute;
  right: -6px;
  top: 0;
  width: 25px;
}
body.services-page .services-copy {
  color: #B77537;
  font-family: urw-din, sans-serif;
  font-size: 25px;
  font-weight: 500;
  line-height: 37.5px;
  margin: 0 0 10px;
  max-width: 1220px;
  width: calc(100% + 29px);
}
body.services-page .services-rich-copy {
  margin-bottom: 0;
}
body.services-page .services-process-image {
  display: block;
  height: auto;
  width: 100%;
}
body.services-page .services-detail-section {
  background: #212936;
  overflow: hidden;
  padding: 7.14vw 0 40px;
}
body.services-page .services-process-image + .services-detail-section {
  padding-bottom: 30px;
}
body.services-page .services-section-title {
  color: #F2EDDC;
  font-family: urw-din, sans-serif;
  font-size: clamp(43px, 6vw, 90px);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  margin: 0 0 1.785vw;
  text-transform: uppercase;
  -webkit-text-fill-color: #F2EDDC;
  -webkit-text-stroke: 0 #F2EDDC;
  text-stroke: 0 #F2EDDC;
}
body.services-page .services-section-kicker {
  margin-bottom: 3.57vw;
}
body.services-page .services-rich-copy p {
  margin: 0 0 10px;
}
body.services-page .services-rich-copy ul {
  list-style: disc;
  margin: 0 0 10px;
  padding-bottom: 10px;
  padding-left: 40px;
}
body.services-page .services-rich-copy li {
  margin-bottom: 10px;
}
body.services-page .services-wildlife-cta {
  background: #212936;
  overflow: hidden;
  padding: 7.14vw 0 40px;
}
body.services-page .services-wildlife-inner {
  align-items: center;
  display: flex;
  flex-direction: column;
  text-align: center;
}
body.services-page .services-wildlife-cta h3 {
  color: #F2EDDC;
  font-family: urw-din, sans-serif;
  font-size: 35px;
  font-weight: 700;
  line-height: 52.5px;
  margin: 0 0 3.57vw;
}
body.services-page .services-wildlife-cta h3 span {
  color: #B77537;
}
body.services-page .services-wildlife-button-wrap {
  position: relative;
  width: min(356px, 100%);
}
body.services-page .services-wildlife-button {
  background: #F2EDDC;
  border: 2px solid #F2EDDC;
  border-radius: 5px 20px;
  color: #212936;
  display: block;
  font-family: urw-din, sans-serif;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 4px;
  line-height: 1.2;
  padding: 15px 24px;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
}
body.services-page .services-wildlife-button:hover {
  background: transparent;
  color: #F2EDDC;
}
body.services-page .services-wildlife-mascot {
  bottom: -15px;
  height: auto;
  left: 10px;
  position: absolute;
  width: 60px;
}
body.services-page .services-reference-contact {
  background: #212936;
  color: #F2EDDC;
  font-family: urw-din, sans-serif;
  overflow: hidden;
  padding: 156.75px 0 100px;
}
body.services-page .services-contact-inner {
  margin-left: auto;
  margin-right: auto;
  max-width: 1440px;
  padding-left: 7.14vw;
  padding-right: 7.14vw;
}
body.services-page .services-contact-grid {
  align-items: start;
  display: grid;
  gap: 45.7px;
  grid-template-columns: minmax(0, 525.78125px) minmax(0, 525.78125px);
}
body.services-page .services-contact-copy h2 {
  color: #F2EDDC;
  font-family: urw-din, sans-serif;
  font-size: 76.8px;
  font-weight: 900;
  letter-spacing: .04em;
  line-height: 76.8px;
  margin: 0 0 22px;
  text-transform: uppercase;
}
body.services-page .services-contact-copy p {
  color: #F2EDDC;
  font-size: 18px;
  font-weight: 400;
  line-height: 30.6px;
  margin: 0;
  max-width: 525.78125px;
}
body.services-page .services-contact-lines {
  color: #B77537;
  display: flex;
  flex-direction: column;
  font-size: 16px;
  font-weight: 700;
  gap: 7px;
  line-height: 1.5;
  margin-top: 27px;
}
body.services-page .services-contact-lines a {
  color: #B77537;
  text-decoration: none;
}
body.services-page .services-contact-lines a:hover {
  color: #F2EDDC;
}
body.services-page .services-contact-form {
  color: #B77537;
  font-family: urw-din, sans-serif;
}
body.services-page .services-contact-form .hidden {
  display: none !important;
}
body.services-page .services-form-row {
  margin-bottom: 45.6875px;
}
body.services-page .services-form-row-two {
  display: grid;
  gap: 45px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
body.services-page .services-form-row input:not([type="checkbox"]) {
  background: transparent;
  border: 0;
  border-top: 2px solid #B77537;
  border-radius: 0;
  color: #F2EDDC;
  display: block;
  font-family: urw-din, sans-serif;
  font-size: 16px;
  height: 39px;
  outline: none;
  padding: 0;
  width: 100%;
}
body.services-page .services-form-row label,
body.services-page .services-select-row label {
  color: #B77537;
  display: block;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: .08em;
  line-height: 20px;
  margin-top: 9px;
  text-transform: uppercase;
}
body.services-page .services-select-row {
  margin-bottom: 45.6875px;
  margin-top: 0;
  padding-top: 21.9px;
}
body.services-page .services-select-row label {
  margin: 0 0 10px;
}
body.services-page .services-select-row select {
  appearance: none;
  background-color: #B77537;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath fill='%23F2EDDC' d='M7 9 0 0h14z'/%3E%3C/svg%3E");
  background-position: right 13px center;
  background-repeat: no-repeat;
  border: 0;
  border-radius: 0;
  color: #F2EDDC;
  font-family: urw-din, sans-serif;
  font-size: 16px;
  font-weight: 700;
  height: 38px;
  outline: none;
  padding: 0 38px 0 8px;
  width: 100%;
}
body.services-page .services-select-row option {
  background: #212936;
  color: #F2EDDC;
}
body.services-page #issueOther {
  border-top: 0;
  border-bottom: 2px solid #B77537;
  height: 38px;
  padding-bottom: 0;
}
body.services-page #issueOther::placeholder {
  color: rgba(242, 237, 220, .72);
}
body.services-page .services-consent {
  align-items: flex-start;
  color: #F2EDDC;
  display: flex;
  font-size: 14px;
  font-style: italic;
  font-weight: 700;
  gap: 8px;
  line-height: 20px;
  margin: 60px 0 80.6875px;
}
body.services-page .services-consent input {
  accent-color: #F2EDDC;
  flex: 0 0 auto;
  height: 12px;
  margin-top: 2px;
  width: 12px;
}
body.services-page .services-contact-form button[type="submit"] {
  background: #B77537;
  border: 0;
  border-radius: 5px 16px;
  color: #F2EDDC;
  cursor: pointer;
  display: inline-block;
  font-family: urw-din, sans-serif;
  font-size: 17px;
  font-weight: 900;
  letter-spacing: .12em;
  height: 44px;
  line-height: 20px;
  min-width: 131px;
  padding: 0 28px;
  text-align: center;
  text-transform: uppercase;
}
body.services-page .services-contact-form button[type="submit"]:hover {
  background: #F2EDDC;
  color: #212936;
}
body.services-page .services-privacy {
  color: #F2EDDC;
  font-size: 14px;
  font-style: italic;
  font-weight: 700;
  line-height: 20px;
  margin: 25px auto 0;
  max-width: 658.375px;
  text-align: center;
}

@media (max-width: 767px) {
  body.services-page #site-header .flex.items-center.justify-between > a:first-child {
    width: 100px;
  }
  body.services-page #site-header .flex.items-center.justify-between > a:first-child img,
  body.services-page #site-header:not(.is-scrolled) .flex.items-center.justify-between > a:first-child img {
    max-width: none !important;
    transform: none;
    width: 113.984375px !important;
  }
  body.services-page .services-reference-hero {
    background-position: 55% 0;
    background-size: 210vw;
  }
  body.services-page .services-hero-inner {
    padding: 13vw 27.84375px 0;
  }
  body.services-page .services-hero-mascot {
    margin-bottom: 3.57vw;
    width: 40px;
  }
  body.services-page .services-hero-title {
    font-size: 43.23px;
    line-height: 43.23px;
    -webkit-text-stroke-width: 1.5px;
    text-stroke-width: 1.5px;
  }
  body.services-page .services-hero-phone-band {
    flex-direction: column;
    justify-content: center;
    margin: 14px 0 28px;
    min-height: 87.0625px;
    padding: 11.79px 27.84375px;
    text-align: center;
  }
  body.services-page .services-phone-copy {
    font-size: 15px;
    line-height: 22.5px;
    margin: 0 0 15px;
  }
  body.services-page .services-phone-number {
    font-size: 30px;
    letter-spacing: 1px;
  }
  body.services-page .services-hero-tooth {
    display: none;
  }
  body.services-page .services-intro-wrap,
  body.services-page .services-section-inner,
  body.services-page .services-wildlife-inner {
    padding-left: 27.84375px;
    padding-right: 27.84375px;
  }
  body.services-page .services-intro-wrap {
    padding-bottom: 55.6875px;
    padding-top: 27.84375px;
  }
  body.services-page .services-kicker {
    font-size: 15px;
    line-height: 22.5px;
    margin-bottom: 28px;
  }
  body.services-page .services-kicker-underline {
    height: 4px;
    margin-top: 4px;
  }
  body.services-page .services-kicker-underline img {
    width: 16px;
  }
  body.services-page .services-copy {
    font-size: 18px;
    line-height: 27px;
    max-width: none;
    width: auto;
  }
  body.services-page .services-detail-section,
  body.services-page .services-wildlife-cta {
    padding: 55.6875px 0;
  }
  body.services-page .services-section-title {
    font-size: 32px;
    line-height: 38.4px;
    margin-bottom: 14px;
    -webkit-text-stroke-width: 1.5px;
    text-stroke-width: 1.5px;
  }
  body.services-page .services-wildlife-cta h3 {
    font-size: 30px;
    line-height: 37.5px;
    margin-bottom: 27.84375px;
    text-align: left;
  }
  body.services-page .services-wildlife-button-wrap {
    width: 100%;
  }
  body.services-page .services-wildlife-button {
    font-size: 14px;
    padding-bottom: 12px;
    padding-top: 12px;
  }
  body.services-page .services-wildlife-mascot {
    bottom: -20px;
    left: 0;
    width: 35px;
  }
  body.services-page .services-reference-contact {
    padding: 55.6875px 0;
  }
  body.services-page .services-contact-inner {
    padding-left: 27.84375px;
    padding-right: 27.84375px;
  }
  body.services-page .services-contact-grid {
    display: block;
  }
  body.services-page .services-contact-copy {
    margin-bottom: 44px;
  }
  body.services-page .services-contact-copy h2 {
    font-size: 32px;
    letter-spacing: .04em;
    line-height: 38.4px;
  }
  body.services-page .services-contact-copy p {
    font-size: 13px;
  }
  body.services-page .services-contact-lines {
    font-size: 14px;
  }
  body.services-page .services-form-row-two {
    gap: 16px;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  body.services-page .services-contact-form button[type="submit"] {
    width: auto;
  }
  body.services-page .services-privacy {
    font-size: 10px;
    margin-top: 48px;
  }
}

@media (min-width: 1440px) {
  body.services-page .services-hero-inner,
  body.services-page .services-intro-wrap,
  body.services-page .services-section-inner,
  body.services-page .services-wildlife-inner {
    padding-left: 103px;
    padding-right: 103px;
  }
  body.services-page .services-hero-inner {
    padding-top: 13vw;
  }
  body.services-page .services-hero-mascot {
    margin-bottom: 25.75px;
  }
  body.services-page .services-hero-phone-band {
    margin-right: 206px;
    margin-top: 25.75px;
    padding-left: 103px;
  }
  body.services-page .services-hero-tooth {
    width: 14.28vw;
  }
  body.services-page .services-intro-wrap,
  body.services-page .services-detail-section,
  body.services-page .services-wildlife-cta {
    padding-bottom: 103px;
    padding-top: 103px;
  }
  body.services-page .services-wildlife-cta {
    padding-bottom: 40px;
  }
  body.services-page .services-kicker {
    margin-bottom: 51.5px;
  }
  body.services-page .services-copy {
    font-size: 30px;
    line-height: 45px;
  }
  body.services-page .services-section-title {
    font-size: 90px;
  }
  body.services-page .services-contact-inner {
    padding-left: 103px;
    padding-right: 103px;
  }
}

/* ============================================
   SCROLL-REVEAL ANIMATIONS
   Add class="reveal" to any element to fade-up on viewport enter.
   Stagger via reveal-delay-1..4 on adjacent siblings.
   ============================================ */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s ease-out, transform 0.7s ease-out;
  will-change: opacity, transform;
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }

@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* ============================================
   HOME PAGE — body padding override
   Reference uses position:fixed navbar + zero body padding so the hero
   section starts at viewport y=0. We mirror that on the home page only,
   keeping the absolute-navbar + body-padding pattern on inner pages.
   Selector specificity (0,0,1,1) beats the base body rule (0,0,0,1).
   ============================================ */
/* Only zero body padding at canvas+ (≥1440), where canvas-cap's pt:240 provides
   navbar clearance. Below 1440 we keep the body padding so mobile/tablet hero
   text doesn't collide with the fixed navbar. */
@media (min-width: 1440px) { body.home-page { padding-top: 0; } }

.home-hero-pattern-bg {
  background-image: url('/assets/images/backgrounds/home-hero-bg-mobile.webp');
}
.home-lower-pattern-bg {
  background-image: url('/assets/images/backgrounds/home-hero-bg.webp');
  transform: scaleX(-1);
}
@media (min-width: 768px) {
  .home-hero-pattern-bg {
    background-image: url('/assets/images/backgrounds/home-hero-bg.webp');
  }
}
@media (max-width: 767px) {
  .home-hero-pattern-bg,
  .home-lower-pattern-bg { background-image: none; }
}

/* ============================================
   CTA BANNER — tooth clearance + mobile hide
   The arrow-orange tooth is absolute-positioned inside the bar with top:0
   and h-auto on a 14.28vw-wide SVG (aspect 320/341 ≈ 0.94). It hangs ~196px
   below the bar at canvas+ and ~14vw on smaller viewports. Without bottom
   padding on the section, the tooth overlaps content in the next section
   (visible on contact / about / wildlife pages where text starts close).
   Reference (.hero-arrow-wrapper.background---cream.blog) uses 14.28vw mb;
   at canvas+ we lock to 200px so it stops scaling above the breakpoint.

   Mobile (<768) hides the tooth to match reference's display:none — and
   spares small viewports the extra padding-bottom they don't need.
   ============================================ */
.cta-banner-section { padding-bottom: 14.28vw; }
@media (min-width: 768px) and (max-width: 1439px) {
  .cta-banner-section { padding-bottom: 40px; }
}
@media (min-width: 1440px) {
  .cta-banner-section { padding-bottom: 140px; }
}
.cta-tooth {
  display: none;
  height: auto;
}
@media (min-width: 768px) {
  .cta-tooth { display: block; }
  .cta-canvas-cap > div:first-child {
    flex-wrap: nowrap;
    gap: 0.75rem;
    padding-right: clamp(9rem, 20vw, 21rem);
    position: relative;
    white-space: nowrap;
    z-index: 30;
  }
  .cta-canvas-cap > div:first-child span {
    font-size: clamp(0.68rem, 1.1vw, 1rem);
    letter-spacing: clamp(0.08em, 0.16vw, 0.15em);
  }
  .cta-canvas-cap > div:first-child a {
    font-size: clamp(1rem, 1.55vw, 1.5rem);
    letter-spacing: clamp(0.08em, 0.16vw, 0.15em);
  }
}
@media (max-width: 767px) {
  .cta-banner-section { padding-bottom: 0; }
  .cta-canvas-cap > div:first-child {
    justify-content: center;
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

/* ============================================
   CANVAS CAP @ 1440px
   Mirrors removeasap.com's `@media (min-width: 1440px)` block:
   above this breakpoint reference switches from vw-based fluid
   sizing to fixed pixels so the design stops scaling. Below 1440px
   the existing vw-based fluidity stays. Selector specificity (0,0,2,0)
   is chosen to beat Tailwind utility classes (0,0,1,0) without
   requiring !important.
   ============================================ */

/* Allaine 2026-05-18 flag: nav transparent overlapped content on scroll. */
#site-header.is-scrolled {
  background-color: rgba(242, 237, 220, 0.95);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

@media (min-width: 1440px) {
  .canvas-cap {
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 240px;          /* reference .padding---medium.stackable---bottom.position---relative pt:12vw locked */
    padding-left: 103px;
    padding-right: 103px;
    padding-bottom: 0;
  }
  .canvas-cap .hero-giving { font-size: 90px; }
  .canvas-cap .hero-peace  { font-size: 163px; }
  .canvas-cap .hero-one    {
    font-size: 60px;
    letter-spacing: 16px;
  }
  /* animal canvas+ overrides — reference uses fixed-pixel translates above 1440 */
  .canvas-cap .home-bat       { transform: translate(290px); }
  .canvas-cap .home-groundhog { max-width: 103px; transform: translate(-123px, 74px); }
  .canvas-cap .home-raccoon   { top: 3%; }
  .cta-canvas-cap {
    max-width: 1440px;
    margin-right: 206px;
    padding-left: 103px;
    padding-right: 25.75px;
  }
  .cta-canvas-cap .cta-tooth {
    right: -9%;
  }
}