@font-face {
  font-family: "Paytone One";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("fonts/PaytoneOne-Regular.woff2") format("woff2");
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 300;
  font-display: block;
  src: url("fonts/Poppins-Light.woff2") format("woff2");
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("fonts/Poppins-Regular.woff2") format("woff2");
}

@font-face {
  font-family: "Poppins";
  font-style: italic;
  font-weight: 400;
  font-display: block;
  src: url("fonts/Poppins-Italic.woff2") format("woff2");
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-display: block;
  src: url("fonts/Poppins-Medium.woff2") format("woff2");
}

@font-face {
  font-family: "Poppins";
  font-style: italic;
  font-weight: 500;
  font-display: block;
  src: url("fonts/Poppins-MediumItalic.woff2") format("woff2");
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: block;
  src: url("fonts/Poppins-SemiBold.woff2") format("woff2");
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 700;
  font-display: block;
  src: url("fonts/Poppins-Bold.woff2") format("woff2");
}

:root {
  color: #000;
  background: #fdf4db;
  font-family: "Poppins", sans-serif;
  font-synthesis: none;
}

* {
  box-sizing: border-box;
}

html,
body {
  min-width: 320px;
  margin: 0;
  background: #fdf4db;
}

body {
  overflow-x: hidden;
}

a {
  color: inherit;
  text-decoration: none;
}

h1,
h2,
h3,
p {
  margin: 0;
}

.viewport {
  position: relative;
  margin: 0 auto;
  overflow: hidden;
  background: #fdf4db;
}

.canvas {
  position: relative;
  width: 1920px;
  height: 7169px;
  overflow: hidden;
  transform-origin: left top;
  background: #fdf4db;
}

.canvas > header,
.canvas main > section,
.site-footer {
  position: absolute;
  left: 0;
  width: 1920px;
  overflow: visible;
}

.decor {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  user-select: none;
}

.site-header {
  top: 0;
  z-index: 10;
  height: 130px;
}

.brand-link {
  position: absolute;
  left: 110px;
  top: 20px;
  width: 245px;
  height: 85px;
}

.brand-link img {
  display: block;
  width: 245px;
  height: 85px;
}

.selectable-brand {
  position: absolute;
  left: 84px;
  top: 16px;
  color: transparent;
  font-size: 25px;
  line-height: 47px;
  user-select: text;
}

.primary-nav a {
  position: absolute;
  top: 48px;
  height: 21px;
  color: #0c0c0c;
  font-size: 22px;
  font-weight: 400;
  line-height: 25px;
  white-space: nowrap;
}

.nav-home {
  left: 507px;
  width: 76px;
}

.nav-pest {
  left: 640px;
  width: 151px;
}

.nav-prevent {
  left: 848px;
  width: 248px;
}

.nav-training {
  left: 1153px;
  width: 189px;
}

.contact-button {
  position: absolute;
  left: 1515px;
  top: 30px;
  width: 250px;
  height: 79px;
  color: #fdf4db;
}

.contact-button span {
  position: absolute;
  left: 55px;
  top: 29px;
  width: 140px;
  height: 21px;
  font-size: 25px;
  font-weight: 500;
  line-height: 25px;
  white-space: nowrap;
}

.hero {
  top: 130px;
  z-index: 5;
  height: 738px;
}

.hero h1 {
  position: absolute;
  left: 119px;
  /* The hero itself begins at y=130px, so this places the H1 at canvas y=193px. */
  top: 63px;
  width: 929px;
  height: 309px;
  font-family: "Paytone One";
  font-size: 80px;
  font-weight: 400;
  line-height: 90px;
  overflow: visible;
  white-space: normal;
  text-indent: 0;
  transform: none;
}

.hero-intro {
  position: absolute;
  left: 122px;
  top: 356px;
  width: 479px;
  height: 110px;
  font-size: 30px;
  font-weight: 400;
  line-height: 110px;
  white-space: nowrap;
}

.quote-button {
  position: absolute;
  left: 140px;
  top: 506px;
  width: 217px;
  height: 79px;
  color: #fdf4db;
}

.quote-button span {
  position: absolute;
  left: 33px;
  top: 29px;
  width: 151px;
  height: 21px;
  font-size: 25px;
  font-weight: 500;
  line-height: 25px;
  white-space: nowrap;
}

.hero-art {
  position: absolute;
  left: 1057.92px;
  top: 122.3488px;
  width: 706.176px;
  height: 748.4436px;
  z-index: 4;
}

.statistics-strip {
  top: 868px;
  z-index: 4;
  height: 307px;
}

.trophy-icon {
  position: absolute;
  left: 273px;
  top: 85px;
  width: 72px;
  height: 72px;
}

.target-icon {
  position: absolute;
  left: 615px;
  top: 0;
  width: 75px;
  height: 75px;
}

.strip-stat strong,
.strip-stat span {
  position: absolute;
  color: #fdf4db;
  white-space: nowrap;
}

.strip-stat strong {
  font-family: "Paytone One", sans-serif;
  font-size: 65px;
  font-weight: 400;
  line-height: 65px;
}

.strip-stat span {
  font-size: 30px;
  font-weight: 500;
  line-height: 30px;
}

.project-stat strong {
  left: 208px;
  top: 195px;
  width: 210px;
  height: 59px;
}

.project-stat span {
  left: 218px;
  top: 293px;
  width: 191px;
  height: 26px;
}

.client-stat strong {
  left: 578px;
  top: 108px;
  width: 149px;
  height: 59px;
}

.client-stat span {
  left: 555px;
  top: 200px;
  width: 196px;
  height: 26px;
}

.pest-library {
  top: 1175px;
  z-index: 3;
  height: 1005px;
}

.pest-library .eyebrow {
  position: absolute;
  left: 866px;
  top: 206px;
  width: 194px;
  height: 30px;
  font-size: 30px;
  font-weight: 500;
  line-height: 30px;
  white-space: nowrap;
}

.pest-library > h2 {
  position: absolute;
  left: 247px;
  top: 272px;
  width: 1425px;
  height: 170px;
  font-family: "Paytone One", sans-serif;
  font-size: 60px;
  font-weight: 400;
  line-height: 75px;
  text-align: center;
}

.pest-item {
  position: absolute;
  top: 512px;
  width: 220px;
  height: 344px;
}

.pest-item img {
  position: absolute;
  left: 0;
  top: 0;
  width: 220px;
  height: 220px;
}

.pest-item h3 {
  position: absolute;
  top: 264px;
  height: 28px;
  font-family: "Paytone One", sans-serif;
  font-size: 30px;
  font-weight: 400;
  line-height: 30px;
  text-align: center;
  white-space: nowrap;
}

.pest-item p {
  position: absolute;
  top: 314px;
  height: 30px;
  font-size: 20px;
  font-style: italic;
  font-weight: 400;
  line-height: 30px;
  text-align: center;
  white-space: nowrap;
}

.pest-ants {
  left: 150px;
}

.pest-ants h3 {
  left: 75px;
  width: 70px;
}

.pest-ants p {
  left: 18px;
  width: 184px;
}

.pest-cockroaches {
  left: 429px;
}

.pest-cockroaches h3 {
  left: 14px;
  width: 192px;
}

.pest-cockroaches p {
  left: 29px;
  width: 161px;
}

.pest-flies {
  left: 708px;
}

.pest-flies h3 {
  left: 14px;
  width: 192px;
}

.pest-flies p {
  left: 42px;
  width: 136px;
}

.pest-bedbug {
  left: 987px;
}

.pest-bedbug h3 {
  left: 46px;
  width: 128px;
}

.pest-bedbug p {
  left: 59px;
  width: 103px;
}

.pest-stinging {
  left: 1266px;
}

.pest-stinging h3 {
  left: 14px;
  width: 206px;
}

.pest-stinging p {
  left: 42px;
  width: 136px;
}

.pest-rodent {
  left: 1545px;
}

.pest-rodent h3 {
  left: 46px;
  width: 128px;
}

.pest-rodent p {
  left: 34px;
  width: 152px;
}

.beginning {
  top: 2180px;
  z-index: 3;
  height: 943px;
}

.garden-art {
  position: absolute;
  left: 149.952px;
  top: 132.0025px;
  width: 629.952px;
  height: 628.0044px;
}

.beginning-eyebrow {
  position: absolute;
  left: 914px;
  top: 203px;
  width: 603px;
  height: 30px;
  font-size: 30px;
  font-weight: 500;
  line-height: 30px;
  white-space: nowrap;
}

.beginning h2 {
  position: absolute;
  left: 909px;
  top: 262px;
  width: 822px;
  height: 170px;
  font-family: "Paytone One", sans-serif;
  font-size: 60px;
  font-weight: 400;
  line-height: 75px;
}

.beginning-copy {
  position: absolute;
  left: 911px;
  top: 457.97px;
  width: 827px;
  height: 119px;
  color: #636363;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
}

.beginning-link {
  position: absolute;
  left: 914px;
  top: 629.97px;
  width: 217px;
  height: 79px;
  color: #fdf4db;
}

.beginning-link span {
  position: absolute;
  left: 38px;
  top: 29px;
  width: 141px;
  height: 21px;
  font-size: 25px;
  font-weight: 500;
  line-height: 25px;
  white-space: nowrap;
}

.experience {
  top: 3123px;
  z-index: 3;
  height: 1415px;
}

.experience h2 {
  position: absolute;
  left: 277px;
  top: 92px;
  width: 875px;
  height: 137px;
  font-family: "Paytone One", sans-serif;
  font-size: 60px;
  font-weight: 400;
  line-height: 75px;
}

.experience > p {
  position: absolute;
  left: 275px;
  top: 295px;
  width: 877px;
  height: 82px;
  color: #636363;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
}

.experience-link {
  position: absolute;
  left: 281px;
  top: 455px;
  width: 217px;
  height: 79px;
  color: #f4e6be;
}

.experience-link span {
  position: absolute;
  left: 38px;
  top: 29px;
  width: 141px;
  height: 21px;
  font-size: 25px;
  font-weight: 500;
  line-height: 25px;
  white-space: nowrap;
}

.weed-art {
  position: absolute;
  left: 654.912px;
  top: 483.7239px;
  width: 792.384px;
  height: 734.1056px;
}

.happy {
  top: 4538px;
  z-index: 3;
  height: 583px;
}

.happy h2 {
  position: absolute;
  left: 163px;
  top: 0;
  width: 898px;
  height: 146px;
  font-family: "Paytone One", sans-serif;
  font-size: 60px;
  font-weight: 400;
  line-height: 75px;
}

.happy > p {
  position: absolute;
  left: 179px;
  top: 212px;
  width: 877px;
  height: 82px;
  color: #636363;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
}

.happy > a {
  position: absolute;
  left: 179px;
  top: 360px;
  width: 411px;
  height: 24px;
  color: #3a3a3a;
  font-size: 25px;
  font-weight: 600;
  line-height: 30px;
  text-decoration: underline;
  white-space: nowrap;
}

.statistics-cards {
  top: 4556px;
  z-index: 6;
  height: 358px;
  pointer-events: none;
}

.metric {
  position: absolute;
  width: 274px;
  height: 164px;
  color: #fdf4db;
}

.metric strong,
.metric span {
  position: absolute;
  white-space: nowrap;
}

.metric strong {
  left: 50px;
  top: 45px;
  width: 167px;
  height: 28px;
  font-family: "Paytone One", sans-serif;
  font-size: 45px;
  font-weight: 400;
  line-height: 30px;
}

.metric span {
  left: 52px;
  top: 95px;
  height: 30px;
  font-size: 20px;
  font-style: italic;
  font-weight: 400;
  line-height: 30px;
}

.metric-years {
  left: 1171px;
  top: 0;
}

.metric-locations {
  left: 1470px;
  top: 0;
}

.metric-training {
  left: 1171px;
  top: 194px;
}

.metric-support {
  left: 1470px;
  top: 194px;
}

.services {
  top: 5121px;
  z-index: 3;
  height: 938px;
}

.services-eyebrow {
  position: absolute;
  left: 852px;
  top: 0;
  width: 189px;
  height: 30px;
  font-size: 30px;
  font-weight: 500;
  line-height: 30px;
  white-space: nowrap;
}

.services > h2 {
  position: absolute;
  left: 247px;
  top: 66px;
  width: 1425px;
  height: 62px;
  font-family: "Paytone One", sans-serif;
  font-size: 60px;
  font-weight: 400;
  line-height: 75px;
  text-align: center;
}

.service-card {
  position: absolute;
  top: 254px;
  width: 527px;
  height: 549px;
  color: #000;
}

.service-card img {
  position: absolute;
}

.service-card h3 {
  position: absolute;
  left: 47px;
  top: 211px;
  height: 35px;
  font-family: "Paytone One", sans-serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 36px;
  white-space: nowrap;
}

.service-card p {
  position: absolute;
  left: 47px;
  top: 297px;
  width: 435px;
  height: 82px;
  color: #636363;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
}

.service-card > span {
  position: absolute;
  left: 47px;
  top: 445px;
  width: 114px;
  height: 18px;
  color: #3a3a3a;
  font-size: 20px;
  font-weight: 500;
  line-height: 20px;
  white-space: nowrap;
}

.service-targeted {
  left: 150px;
}

.service-targeted img {
  left: 30px;
  top: 15px;
  width: 145px;
  height: 180px;
}

.service-targeted h3 {
  width: 410px;
}

.service-preventative {
  left: 697px;
}

.service-preventative img {
  left: 28px;
  top: 35px;
  width: 165px;
  height: 150px;
}

.service-preventative h3 {
  width: 459px;
}

.service-termite {
  left: 1244px;
}

.service-termite img {
  left: 26px;
  top: 15px;
  width: 180px;
  height: 180px;
}

.service-termite h3 {
  width: 459px;
}

.local-branch {
  top: 6059px;
  z-index: 5;
  height: 540px;
}

.local-footer-decor {
  width: 1920px;
  height: 1110px;
  max-width: none;
}

.local-branch h2 {
  position: absolute;
  left: 233px;
  top: 68px;
  width: 711px;
  height: 62px;
  font-family: "Paytone One", sans-serif;
  font-size: 60px;
  font-weight: 400;
  line-height: 75px;
}

.local-intro {
  position: absolute;
  left: 233px;
  top: 175px;
  width: 738px;
  height: 69px;
  color: #2d2d2d;
  font-size: 25px;
  font-weight: 300;
  line-height: 40px;
}

.local-call {
  position: absolute;
  left: 235px;
  top: 296px;
  width: 665px;
  height: 29px;
  color: #272727;
  font-size: 25px;
  font-weight: 500;
  line-height: 35px;
  white-space: nowrap;
}

.branch-cta {
  position: absolute;
  left: 235px;
  top: 395px;
  width: 550px;
  height: 60px;
  color: #333;
  font-size: 20px;
  font-style: italic;
  font-weight: 500;
  line-height: 40px;
}

.vehicle-art {
  position: absolute;
  left: 1080.96px;
  top: 99.171px;
  width: 572.736px;
  height: 364.1852px;
}

.site-footer {
  top: 6352px;
  z-index: 7;
  height: 817px;
  color: #f4e6be;
  pointer-events: none;
}

.site-footer a {
  pointer-events: auto;
}

.site-footer h2 {
  position: absolute;
  top: 387px;
  height: 21px;
  color: #f4e6be;
  font-size: 25px;
  font-weight: 700;
  line-height: 25px;
  white-space: nowrap;
}

.footer-brand h2 {
  left: 295px;
  width: 132px;
}

.footer-brand p {
  position: absolute;
  left: 197px;
  top: 480px;
  width: 435px;
  height: 82px;
  color: #a69f8b;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
}

.footer-links h2 {
  left: 818px;
  width: 132px;
}

.footer-account h2 {
  left: 1471px;
  width: 172px;
}

.footer-links a,
.footer-account a {
  position: absolute;
  height: 21px;
  color: rgba(244, 230, 190, 0.7);
  font-size: 22px;
  font-weight: 400;
  line-height: 25px;
  white-space: nowrap;
}

.footer-home {
  left: 818px;
  top: 475px;
  width: 76px;
}

.footer-training {
  left: 1054px;
  top: 475px;
  width: 189px;
}

.footer-pest {
  left: 818px;
  top: 551px;
  width: 151px;
}

.footer-prevent {
  left: 1054px;
  top: 551px;
  width: 248px;
}

.pay-link {
  left: 1475px;
  top: 475px;
  width: 76px;
}

.footer-contact {
  left: 1475px;
  top: 551px;
  width: 151px;
}

.copyright {
  position: absolute;
  left: 203px;
  top: 744px;
  width: 482px;
  height: 25px;
  color: #a69f8b;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
  white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
  * {
    scroll-behavior: auto !important;
  }
}