/* ============================================================
   Hero — photo-led, full-bleed, bottom-anchored copy.
   Copy remains over the photo at every supported width.
   Mobile and tablet crops reserve the left side for text.
   ============================================================ */

.hero {
  position: relative;
  isolation: isolate;
  background: oklch(0.96 0.005 274);
  color: var(--hero-ink);
  font-family: 'Golos Text', 'Montserrat', system-ui, -apple-system, sans-serif;
  overflow: clip;
  display: block;
  width: 100%;
  min-height: clamp(42rem, 120vw, 48rem);
}

/* ============================================================
   Photo
   ============================================================ */

.hero-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: oklch(0.93 0.005 274);
  z-index: 0;
}

.hero-photo::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    oklch(0.96 0.005 274 / 0.76) 0%,
    oklch(0.96 0.005 274 / 0.48) 34%,
    oklch(0.96 0.005 274 / 0.12) 50%,
    oklch(0.96 0.005 274 / 0) 65%
  );
}

.hero-photo img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  /* Keep the technician on the trailing side, leaving a readable text lane. */
  object-position: 8% 18%;
}

/* ============================================================
   Copy column
   ============================================================ */

.hero-copy {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  min-height: inherit;
  padding: clamp(2rem, 5vw, 3rem) clamp(1.4rem, 4vw, 3rem) clamp(5rem, 12vw, 7rem);
  pointer-events: none;
}

.hero-copy-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  max-width: min(22rem, 68vw);
  pointer-events: auto;
}

.hero-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
  margin: 0 0 0.875rem;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--hero-ink-faint);
}

.hero-kicker .hero-brand {
  font-weight: 700;
  color: var(--hero-ink);
  letter-spacing: 0;
  text-transform: none;
  font-size: 0.875rem;
}

.hero-kicker .hero-brand sup {
  font-size: 0.6em;
  margin-left: 0.05em;
  font-weight: 500;
  vertical-align: super;
}

.hero-kicker .hero-divider {
  color: var(--hero-ink-faint);
  font-weight: 400;
}

.hero-headline {
  font-size: clamp(2.125rem, 4.5vw + 0.5rem, 4.25rem);
  line-height: 1.04;
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--hero-ink);
  margin: 0;
  text-wrap: balance;
  overflow-wrap: break-word;
  hyphens: manual;
}

.hero-lede {
  margin: 1.125rem 0 0;
  font-size: clamp(1.0625rem, 0.9rem + 0.45vw, 1.25rem);
  line-height: 1.5;
  font-weight: 400;
  color: var(--hero-ink-muted);
  max-width: 38ch;
  text-wrap: pretty;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.875rem 1.5rem;
  margin-top: clamp(1.5rem, 3vw, 2.25rem);
}

.hero-cta {
  /* Now a <button>: reset UA chrome so it matches the link styling that was here before. */
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
  background: var(--hero-accent);
  color: var(--hero-accent-ink);
  font: inherit;
  font-weight: 700;
  font-size: 1.1875rem;
  text-decoration: none;
  padding: 1.1875rem 2.125rem;
  border-radius: 999px;
  border: 1px solid transparent;
  transition:
    background-color 220ms cubic-bezier(.22,1,.36,1),
    transform 220ms cubic-bezier(.22,1,.36,1),
    box-shadow 220ms cubic-bezier(.22,1,.36,1);
}

.hero-cta:hover,
.hero-cta:focus-visible {
  background: var(--hero-accent-hover);
  transform: translateY(-1px);
  box-shadow: 0 12px 28px -10px oklch(0.55 0.20 30 / 0.45);
}

.hero-cta:active {
  background: var(--hero-accent-hover);
  transform: translateY(0);
  box-shadow: 0 4px 12px -4px oklch(0.55 0.20 30 / 0.35);
}

.hero-cta:focus-visible {
  /* Dark navy outline reads clearly against the red button (high contrast),
     unlike a red-on-red outline. A white halo via box-shadow separates outline
     from button edge when the button sits on the photo. */
  outline: 2px solid var(--hero-ink);
  outline-offset: 3px;
  box-shadow: 0 0 0 5px oklch(0.99 0 0 / 0.85);
}

.hero-cta-arrow {
  width: 1.125rem;
  height: 1.125rem;
  flex-shrink: 0;
  transition: transform 220ms cubic-bezier(.22,1,.36,1);
}

.hero-cta:hover .hero-cta-arrow,
.hero-cta:focus-visible .hero-cta-arrow {
  transform: translateX(4px);
}

.hero-secondary {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  color: var(--hero-ink-muted);
  font-weight: 500;
  font-size: 1rem;
  text-decoration: none;
  /* 44px minimum touch target on all viewports. Vertical padding does the work
     without changing the underline position. */
  min-height: 44px;
  padding: 0.625rem 0;
  border-bottom: 1px solid transparent;
  transition: color 180ms ease, border-color 180ms ease;
}

.hero-secondary svg {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}

.hero-secondary:hover,
.hero-secondary:focus-visible,
.hero-secondary:active {
  color: var(--hero-ink);
  border-bottom-color: var(--hero-ink);
}

.hero-secondary:focus-visible {
  outline: 2px solid var(--hero-ink);
  outline-offset: 4px;
  border-bottom-color: transparent;
}

@media (max-width: 1023px) {
  .hero-actions {
    margin-block-start: clamp(7rem, 10vw, 8rem);
  }

  .hero-cta {
    gap: 0.5rem;
    padding: 1rem 1.15rem;
    font-size: 1rem;
  }

  .hero-cta-arrow {
    width: 1.1rem;
    height: 1.1rem;
  }
}

@media (max-width: 639px) {
  .hero-copy {
    align-items: stretch;
    padding-block-end: 2rem;
  }

  .hero-actions {
    flex-direction: column;
    align-items: center;
    width: max-content;
    max-width: 100%;
    margin-block-start: auto;
  }
}

/* ============================================================
   Tablet
   ============================================================ */
@media (min-width: 640px) {
  .hero {
    min-height: clamp(44rem, 58vw, 54rem);
  }

  .hero-photo img {
    width: 125%;
    max-width: none;
    object-position: 50% 5%;
  }

  .hero-copy {
    padding: clamp(2.4rem, 4vw, 3.4rem) clamp(2rem, 5vw, 5rem) clamp(5rem, 7vw, 7rem);
  }

  .hero-copy-inner {
    max-width: min(34rem, 45vw);
  }
}

/* Tablet hero uses the same bottom anchoring as mobile, but sits 20px higher
   for better balance beside the wider photo crop. This block follows the
   tablet padding shorthand above so the 40px bottom inset wins in the
   cascade without affecting desktop from 1024px. */
@media (min-width: 640px) and (max-width: 1023px) {
  .hero-copy {
    align-items: stretch;
    padding-block-end: 4rem;
  }

  .hero-actions {
    margin-block-start: auto;
  }
}

/* ============================================================
   Desktop — full-bleed photo, copy bottom-anchored over the
   bright corridor area to the left of the technician.
   ============================================================ */
@media (min-width: 1024px) {
  .hero {
    display: block;
    min-height: clamp(540px, 78vh, 760px);
  }

  .hero-photo {
    position: absolute;
    inset: 0;
    aspect-ratio: auto;
    max-height: none;
    width: 100%;
    height: 100%;
    z-index: 0;
  }
  .hero-photo img {
    width: 100%;
    /* Push the technician right-of-center; keep face and torso visible;
       leave the bottom-left corridor zone uncovered for the copy. The
       vertical 18% lifts the crop so his head is no longer cut off by the
       wide box's top-and-bottom vertical crop. */
    object-position: 65% 18%;
  }

  .hero-photo::after {
    content: none;
  }

  .hero-copy {
    position: relative;
    z-index: 1;
    height: 100%;
    min-height: inherit;
    padding: 0;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    pointer-events: none;
  }

  .hero-copy-inner {
    pointer-events: auto;
    /* NB: the site sets html { font-size: 10px } (--rem in main-menu.css),
       so 1rem = 10px in every value below.
       Wide enough that the enlarged headline wraps by its own 16ch cap,
       not by this box. The lede keeps its independent 38ch measure. */
    max-width: 62rem;
    padding: clamp(2.5rem, 4vw, 4rem) clamp(2.5rem, 5vw, 5rem) clamp(2.75rem, 4.5vw, 4.5rem);
    /* Defensive contrast wash: guarantees ≥4.5:1 for dark text even if the
       underlying photo region has LED-strip reflections or other bright/dark
       speckle. The wash matches the corridor's white-grey so it's near-invisible
       to a sighted user, but locks the contrast floor for screen-magnifier users
       and any photo crop variation. */
    background: linear-gradient(
      to top right,
      oklch(0.96 0.005 274 / 0.88) 0%,
      oklch(0.96 0.005 274 / 0.55) 55%,
      oklch(0.96 0.005 274 / 0) 90%
    );
  }

  .hero-kicker {
    font-size: 1rem;
    margin-bottom: 1.75rem;
  }

  .hero-headline {
    /* 2026-07-12: the earlier "calmer cap" was reversed by the owner — it read
       as a caption clumped in the corner. The headline is now the dominant
       element: 48px at 1280, 53px at 1440, 60px at 1920 (1rem = 10px). */
    font-size: clamp(4rem, 3vw + 1rem, 6rem);
    /* Keeps the three-line wrap; wide enough for the longest UZ word
       ("Zararkunandalardan") without a mid-word break. */
    max-width: 16ch;
  }

  .hero-lede {
    margin-top: 2rem;
    font-size: 1.6rem;
    line-height: 1.55;
  }

  .hero-actions {
    margin-top: clamp(2.8rem, 2.5vw, 4rem);
  }
}

/* Short desktop viewports (iPad landscape 1024×768, small laptops 1280×720).
   The 78vh min-height would force the hero to dominate; relax it. */
@media (min-width: 1024px) and (max-height: 800px) {
  .hero {
    min-height: clamp(440px, 70vh, 600px);
  }
  .hero-copy-inner {
    padding-top: clamp(1.5rem, 3vw, 2.5rem);
    padding-bottom: clamp(1.5rem, 3vw, 2.5rem);
  }
  .hero-headline {
    /* The shorter hero can't carry the full 6rem cap, but stays
       unmistakably dominant: 45px at 1280×800 (1rem = 10px). */
    font-size: clamp(3.5rem, 3vw + 1rem, 4.5rem);
  }
}

/* Wider viewports: more breathing room around the copy block */
@media (min-width: 1440px) {
  .hero-copy-inner {
    max-width: 70rem;
    padding-left: clamp(3rem, 7vw, 7rem);
    padding-bottom: clamp(3rem, 5vw, 5rem);
  }
}

/* ============================================================
   Page-load reveal — transform-only on the H1 so LCP is unaffected.
   ============================================================ */
@media (prefers-reduced-motion: no-preference) {
  .hero-headline {
    transform: translateY(6px);
    animation: hero-headline-rise 520ms cubic-bezier(.22, 1, .36, 1) 60ms forwards;
  }
  .hero-kicker,
  .hero-lede,
  .hero-actions {
    opacity: 0;
    transform: translateY(8px);
    animation: hero-rise 620ms cubic-bezier(.22, 1, .36, 1) forwards;
  }
  .hero-kicker   { animation-delay:  40ms; }
  .hero-lede     { animation-delay: 180ms; }
  .hero-actions  { animation-delay: 260ms; }

  @keyframes hero-rise {
    to { opacity: 1; transform: none; }
  }
  @keyframes hero-headline-rise {
    to { transform: none; }
  }
}

/* ============================================================
   Pest quicknav — elevated popular-requests panel.
   It overlaps the hero edge, then adapts from 2 to 4 cards.
   ============================================================ */

.pest-quicknav {
  position: relative;
  z-index: 2;
  margin-top: clamp(-4rem, -3vw, -2rem);
  padding-inline: clamp(1.6rem, 4vw, 6rem);
  font-family: 'Golos Text', 'Montserrat', system-ui, -apple-system, sans-serif;
}

.pest-quicknav-inner {
  max-width: 1600px;
  margin-inline: auto;
  padding: 1.2rem;
  background: var(--hero-quicknav-surface);
  border: none;
  border-radius: 1.6rem;
  box-shadow:
    0 -0.4rem 1.4rem -0.5rem var(--hero-quicknav-card-shadow),
    0 0.3rem 0.9rem -0.25rem var(--hero-quicknav-card-shadow),
    0 1.8rem 4rem -2rem var(--hero-quicknav-shadow);
}

.pest-quicknav-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.2rem;
  margin-bottom: 1.4rem;
}

.pest-quicknav-intro {
  min-width: 0;
}

.pest-quicknav-title {
  margin: 0;
  color: var(--hero-ink);
  font-size: clamp(1.8rem, 1.4rem + 0.6vw, 2.4rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.015em;
}

.pest-quicknav-description {
  max-width: 34ch;
  margin: 0.5rem 0 0;
  color: var(--hero-ink-muted);
  font-size: 1.3rem;
  line-height: 1.45;
}

.pest-quicknav-more {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  min-height: 44px;
  padding: 0.6rem 0.2rem;
  color: var(--hero-accent);
  font-size: 1.35rem;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color 180ms ease, border-color 180ms ease;
}

.pest-quicknav-more svg {
  width: 1.7rem;
  height: 1.7rem;
  transition: transform 220ms cubic-bezier(.22, 1, .36, 1);
}

.pest-quicknav-more:hover,
.pest-quicknav-more:focus-visible,
.pest-quicknav-more:active {
  color: var(--hero-accent-hover);
  border-bottom-color: currentColor;
}

.pest-quicknav-more:hover svg,
.pest-quicknav-more:focus-visible svg {
  transform: translateX(0.3rem);
}

.pest-quicknav-more:focus-visible {
  outline: 2px solid var(--hero-accent);
  outline-offset: 3px;
  border-bottom-color: transparent;
}

.pest-quicknav-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.8rem;
}

.pest-quicknav-item {
  position: relative;
  display: grid;
  grid-template-columns: clamp(2.4rem, 7.5vw, 2.8rem) minmax(0, 1fr);
  align-items: center;
  gap: 0.6rem;
  min-width: 0;
  min-height: 11.6rem;
  padding: 1rem 0.8rem;
  background: var(--hero-quicknav-card);
  border: 1px solid transparent;
  border-radius: 1rem;
  box-shadow:
    0 -0.3rem 1rem -0.35rem var(--hero-quicknav-card-shadow),
    0 0.2rem 0.6rem -0.2rem var(--hero-quicknav-card-shadow),
    0 0.9rem 2.4rem -1rem var(--hero-quicknav-card-shadow);
  color: var(--hero-ink);
  text-decoration: none;
  transition:
    background-color 180ms ease,
    box-shadow 220ms ease,
    transform 220ms cubic-bezier(.22, 1, .36, 1);
}

.pest-quicknav-item:hover,
.pest-quicknav-item:focus-visible {
  background: var(--hero-quicknav-card-hover);
  border-color: transparent;
  box-shadow:
    0 -0.3rem 1rem -0.3rem var(--hero-quicknav-card-shadow),
    0 0.3rem 0.8rem -0.2rem var(--hero-quicknav-card-shadow),
    0 1.4rem 3rem -1rem var(--hero-quicknav-shadow);
  transform: translateY(-2px);
}

.pest-quicknav-item:active {
  background: var(--hero-quicknav-card-hover);
  border-color: transparent;
  transform: translateY(0);
}

.pest-quicknav-item:focus-visible {
  outline: 2px solid var(--hero-accent);
  outline-offset: 2px;
}

.pest-quicknav-icon {
  display: block;
  width: clamp(2.4rem, 7.5vw, 2.8rem);
  height: clamp(2.4rem, 7.5vw, 2.8rem);
  padding: 0.1rem;
  object-fit: contain;
}

.pest-quicknav-item-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 0.45rem;
}

.pest-quicknav-item-title {
  padding-right: 1.6rem;
  font-size: 1.3rem;
  font-weight: 700;
  line-height: 1.25;
}

.pest-quicknav-item-description {
  color: var(--hero-ink-muted);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.4;
  overflow-wrap: break-word;
  hyphens: auto;
}

.pest-quicknav-arrow {
  position: absolute;
  top: 1.1rem;
  right: 0.9rem;
  width: 1.5rem;
  height: 1.5rem;
  color: var(--hero-accent);
  transition: transform 220ms cubic-bezier(.22, 1, .36, 1);
}

.pest-quicknav-item:hover .pest-quicknav-arrow,
.pest-quicknav-item:focus-visible .pest-quicknav-arrow {
  transform: translateX(0.25rem);
}

@media (min-width: 640px) {
  .pest-quicknav-inner {
    padding: 2rem;
  }

  .pest-quicknav-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
  }

  .pest-quicknav-item {
    grid-template-columns: 3rem minmax(0, 1fr);
    align-content: center;
    gap: 0.8rem;
    min-height: 11.2rem;
    padding: 1.4rem 1.2rem;
  }

  .pest-quicknav-icon {
    width: 3rem;
    height: 3rem;
  }
}

@media (min-width: 1024px) {
  .pest-quicknav-inner {
    padding: 2.4rem;
  }

  .pest-quicknav-header {
    margin-bottom: 1.8rem;
  }

  .pest-quicknav-list {
    gap: 1.2rem;
  }

  .pest-quicknav-item {
    grid-template-columns: 4rem minmax(0, 1fr);
    gap: 1.2rem;
    padding: 1.6rem 1.4rem;
  }

  .pest-quicknav-icon {
    width: 4rem;
    height: 4rem;
  }

  .pest-quicknav-item-title {
    font-size: 1.5rem;
  }

  .pest-quicknav-item-description {
    font-size: 1.2rem;
  }
}

@media (min-width: 1321px) {
  .pest-quicknav-inner {
    display: grid;
    grid-template-columns: minmax(22rem, 0.9fr) minmax(0, 4fr);
    align-items: stretch;
    gap: 1.6rem;
  }

  .pest-quicknav-header {
    flex-direction: column;
    margin-bottom: 0;
  }

  .pest-quicknav-more {
    justify-content: flex-start;
    margin-top: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pest-quicknav-item,
  .pest-quicknav-arrow,
  .pest-quicknav-more svg {
    transition: none;
  }
}

/* ============================================================
   Pest icon backgrounds — preserved.
   ============================================================ */

.pest-icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 287.258 291.803'%3E%3Cpath d='M143.279,288.163c34.05-10.23,40.93-98.39,40.93-148.62,0,0,2.47-32.16-13.95-40.99-2.01-3.61-.2-8.63-5.22-12.44-2.21-10.03-13.24-17.2-21.22-15.65h-1.1c-7.98-1.55-19.01,5.62-21.22,15.65-5.02,3.81-3.21,8.83-5.22,12.44-16.41,8.83-13.95,40.99-13.95,40.99,0,50.22,8.48,141.39,40.93,148.62h.02Z' fill='%23e13a15'/%3E%3Cpath d='M257.839,189.093c-.42,0-.84-.07-1.26-.23l-21.67-8.03c-1.88-.69-2.83-2.78-2.14-4.65.69-1.88,2.79-2.83,4.65-2.14l21.67,8.03c1.88.69,2.83,2.78,2.14,4.65-.54,1.46-1.92,2.36-3.39,2.36zM229.019,174.753c-1.34,0-2.63-.75-3.26-2.03l-19.26-39.52c-.88-1.8-.13-3.96,1.67-4.84,1.79-.87,3.96-.13,4.84,1.67l19.26,39.52c.88,1.8.13,3.96-1.67,4.84-.51.25-1.05.37-1.58.37zM244.239,277.613c-1.06,0-2.11-.46-2.83-1.36l-19.46-24.28c-1.25-1.56-1-3.84.56-5.09s3.83-1,5.09.56l19.46,24.28c1.25,1.56,1,3.84-.56,5.09-.67.54-1.47.8-2.26.8zM221.269,245.103c-1.86,0-3.45-1.43-3.6-3.32l-5.01-60.19c-.17-1.99,1.31-3.74,3.31-3.91,1.98-.19,3.74,1.31,3.91,3.31l5.01,60.19c.17,1.99-1.31,3.74-3.31,3.91-.1,0-.2.01-.3.01zM57.429,174.753c-.53,0-1.07-.12-1.58-.37-1.8-.87-2.55-3.04-1.67-4.84l19.26-39.52c.87-1.8,3.04-2.55,4.84-1.67,1.8.87,2.55,3.04,1.67,4.84l-19.26,39.52c-.63,1.29-1.92,2.03-3.26,2.03zM28.609,189.093c-1.47,0-2.85-.9-3.39-2.36-.69-1.87.26-3.96,2.14-4.65l21.67-8.03c1.86-.69,3.96.26,4.65,2.14.69,1.87-.26,3.96-2.14,4.65l-21.67,8.03c-.41.15-.84.23-1.26.23zM66.389,245.103c-.1,0-.2,0-.3-.01-1.99-.17-3.47-1.92-3.31-3.91l5.02-60.19c.17-1.99,1.91-3.49,3.91-3.31,1.99.17,3.47,1.92,3.31,3.91l-5.02,60.19c-.16,1.89-1.74,3.32-3.6,3.32zM43.419,277.613c-.8,0-1.59-.26-2.26-.8-1.56-1.25-1.81-3.53-.56-5.09l19.46-24.28c1.25-1.56,3.53-1.81,5.09-.56,1.56,1.25,1.81,3.53.56,5.09l-19.46,24.28c-.72.89-1.77,1.36-2.83,1.36z' fill='%23ffffff'/%3E%3C/svg%3E"); }

.termite-icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180.066 293.044'%3E%3Cpath d='M126.928,172.824c-1.12-4.98-2.57-9.89-4.36-14.67-1.09-2.89-5.52-8.74-2.8-11.35,2.21-2.13,3.06-4.66,2.53-7.52-1.19-6.39-6.88-8.29-10.77-12.66-1.08-1.21-1.94-2.95-1.23-4.42.35-.72,1.04-1.26,1.27-2.03.32-1.03-.26-2.1-.87-2.98-1.4-2-2.84-9.11-4.71-13.59,4.99-3.33,8.5-8.89,8.5-17.43,0-3.41-1.73-11.15-1.65-10.5-1.56-4.69-3.3-7.92-3.3-7.92-4.33-7.98-11.05-14.08-18.39-14.08s-14.06,6.1-18.39,14.08c0,0-2.71,5.44-3.3,7.92,0,0-1.65,7.09-1.65,10.5,0,8.09,3.15,13.51,7.72,16.89-1.13,4.52-2.18,12.35-3.13,13.57-.89,1.13-1.73,2.6-1.16,3.92.36.84.64,1.6.87,2.49.09.32.08.65,0,.97-.11.52-.39,1.03-.68,1.49-3.47,5.36-9.72,6.74-11.03,13.79-.53,2.86.32,5.38,2.53,7.52.88.85,1.29,2.01,1.23,3.16-6.23,11.54-8.58,22.6-9.8,35.62-.68,7.28-1.37,14.58-1.08,21.88.57,14.87,5.15,29.24,10.89,42.85,5.22,12.37,10.86,25.34,19,36.1,1.95,2.58,4.93,4.07,8.18,4.07s6.23-1.48,8.18-4.07c8.51-11.27,14.23-24.82,19.69-37.73,6.08-14.37,9.76-29.79,10.41-45.4.43-10.21-.46-20.48-2.69-30.46z' fill='%23e13a15'/%3E%3C/svg%3E"); }

.bedbug-icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72.13 68.326'%3E%3Cpath d='M44.9,14.526h0c-.3.24-.6.46-.89.68-.46-1.59-1.54-2.93-2.97-3.7.17-.5.28-1.02.28-1.58,0-2.67-2.14-4.83-4.77-4.83s-4.77,2.16-4.77,4.83c0,.5.1.96.23,1.41-1.63.76-2.86,2.2-3.34,3.96-.34-.24-.68-.5-1.02-.77-22.25,10.27-11.03,46.78,8.69,48.33h.12c19.72-1.55,30.67-38.05,8.42-48.33z' fill='%23e13a15'/%3E%3C/svg%3E"); }

.mosquito-icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 94.565 93.973'%3E%3Cpath d='M51.147,73.303l-1.12-4.27-.52-1.96c-.03-.13-.04-.26-.03-.39l.19-1.92.48-4.83.22-2.26c-.99.43-2.05.65-3.07.65s-2.08-.21-3.07-.65l.22,2.26.48,4.83.19,1.92c.01.13,0,.26-.03.39l-.52,1.96-1.12,4.27-.69,2.61.56,1.66,1.43,4.27,2.54,7.58,2.54-7.58,1.43-4.27.56-1.66z' fill='%23e13a15'/%3E%3Cpath d='M39.017,44.133c.06,1.07.21,2.14.38,3.2l-16.23,14.32c-2.88,2.54-6.86,3.63-10.63,2.9l-6.88-1.32c-1.34-.26-2.44-1.11-3.03-2.34-.58-1.23-.55-2.63.1-3.83,1.87-3.46,4.98-5.98,8.75-7.09l27.55-8.16c-.02.21-.03.43-.04.64z' fill='%23ffffff'/%3E%3Cpath d='M55.577,42.433c0-.21-.02-.43-.04-.64l27.55,8.16c3.77,1.12,6.88,3.63,8.75,7.09.65,1.2.69,2.59.1,3.83-.58,1.23-1.69,2.09-3.03,2.34l-6.88,1.32c-3.78.73-7.75-.36-10.63-2.9l-16.23-14.32c.17-1.06.32-2.13.38-3.2z' fill='%23ffffff'/%3E%3C/svg%3E"); }

/* ============================================================
   Forced colors (Windows High Contrast Mode).
   Backgrounds and box-shadows are stripped by the OS, so we use
   system color keywords for borders to keep elements distinguishable.
   ============================================================ */
@media (forced-colors: active) {
  .hero-cta {
    border: 2px solid ButtonText;
    background: ButtonFace;
    color: ButtonText;
  }
  .hero-cta:focus-visible {
    outline: 2px solid Highlight;
    outline-offset: 3px;
    box-shadow: none;
  }
  .hero-secondary:focus-visible,
  .pest-quicknav-item:focus-visible,
  .pest-quicknav-more:focus-visible {
    outline: 2px solid Highlight;
    outline-offset: 3px;
  }
  .pest-quicknav-item {
    border-color: ButtonText;
  }
  /* The defensive contrast wash relies on color; in forced-colors the
     OS substitutes solid backgrounds anyway, so drop it to avoid double-fills. */
  .hero-copy-inner {
    background: Canvas;
  }
}