:root {
  color-scheme: light;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

img {
  max-width: 100%;
}

.h2o-skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 10000;
  padding: 12px 16px;
  background: #e8b54b;
  color: #0a1720;
  font: 600 11px/1 "IBM Plex Mono", monospace;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  transform: translateY(-180%);
  transition: transform 0.2s ease;
}

.h2o-skip-link:focus {
  transform: translateY(0);
}

header a,
footer a,
button,
summary {
  -webkit-tap-highlight-color: transparent;
}

button,
input,
textarea {
  border-radius: 0;
}

@media (max-width: 1100px) {
  header {
    gap: 20px !important;
    padding: 18px 24px !important;
  }

  header nav {
    display: none !important;
  }

  header img {
    height: 40px !important;
    width: auto !important;
  }

  [data-screen-label="Schedule Service"] {
    grid-template-columns: minmax(320px, 390px) 1fr !important;
  }

  footer > div:first-child {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 860px) {
  [data-screen-label="Austin Backflow Hero"] > header + div,
  [data-screen-label="Austin Rules"] > div,
  [data-screen-label="One Visit"] > div > div:first-child,
  [data-screen-label="Coverage"] > div,
  [data-screen-label="FAQ"] > div {
    grid-template-columns: 1fr !important;
  }

  [data-screen-label="Austin Backflow Hero"] > div:last-child,
  [data-screen-label="One Visit"] > div > div:nth-child(2) {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  [data-screen-label="Austin Backflow Hero"] > header + div > div:last-child {
    min-height: 520px !important;
  }

  [data-screen-label] [style*="grid-template-columns:180px 1fr .8fr"],
  [data-screen-label] [style*="grid-template-columns:1.1fr .9fr"],
  [data-screen-label] [style*="grid-template-columns:.9fr 1.1fr"],
  [data-screen-label] [style*="grid-template-columns:1fr 1.1fr"],
  [data-screen-label] [style*="grid-template-columns:1fr 1.2fr"],
  [data-screen-label] [style*="grid-template-columns:1fr 1.3fr"],
  [data-screen-label] [style*="grid-template-columns:1fr 1.4fr"],
  [data-screen-label] [style*="grid-template-columns:1.2fr .8fr"],
  [data-screen-label] [style*="grid-template-columns:1fr .9fr"],
  [data-screen-label] [style*="grid-template-columns:.8fr 1.2fr"] {
    grid-template-columns: 1fr !important;
  }

  [data-screen-label] [style*="grid-template-columns:repeat(3,1fr)"],
  [data-screen-label] [style*="grid-template-columns:repeat(4,1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  [data-screen-label="Hero"] iframe {
    display: none !important;
  }

  [data-screen-label="Story"] > div:first-child,
  [data-screen-label="About Hero"] [style*="min-height"],
  [data-screen-label="Austin Backflow Hero"] [style*="min-height:520px"],
  [data-screen-label="Backflow Hero"] [style*="min-height:520px"],
  [data-screen-label="Plumbing Hero"] [style*="min-height:520px"],
  [data-screen-label="Leak Hero"] [style*="min-height:520px"] {
    min-height: 520px !important;
  }

  [data-screen-label="Schedule Service"] {
    display: block !important;
  }

  [data-screen-label="Schedule Service"] > aside {
    position: relative !important;
    height: auto !important;
    min-height: 0 !important;
  }

  [data-screen-label="Schedule Service"] > aside > div:last-child {
    margin-top: 40px !important;
  }

  [data-screen-label="Schedule Service"] > main {
    max-width: none !important;
  }

  [data-screen-label="Compare"] [style*="grid-template-columns"] {
    min-width: 760px;
  }

  [data-screen-label="Compare"] > div {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 620px) {
  [data-screen-label="Austin Backflow Hero"] > div:last-child,
  [data-screen-label="One Visit"] > div > div:nth-child(2) {
    grid-template-columns: 1fr !important;
  }

  [data-screen-label="Austin Backflow Hero"] > header + div > div:first-child {
    padding: 58px 24px 46px !important;
  }

  [data-screen-label="Austin Backflow Hero"] > header + div > div:last-child {
    min-height: 440px !important;
    margin: 0 24px 46px !important;
  }

  [data-screen-label="Austin Rules"],
  [data-screen-label="One Visit"],
  [data-screen-label="Coverage"],
  [data-screen-label="FAQ"],
  [data-screen-label="Local SEO strip"],
  [data-screen-label="CTA"] {
    padding-right: 24px !important;
    padding-left: 24px !important;
  }

  header > div:last-child > a:first-child,
  header [data-nav-phone] {
    display: none !important;
  }

  header > div:last-child {
    gap: 0 !important;
  }

  header > div:last-child > a:last-child {
    padding: 12px 14px !important;
    font-size: 9px !important;
  }

  h1 {
    overflow-wrap: anywhere;
  }

  [data-screen-label] [style*="grid-template-columns:repeat(2,1fr)"],
  [data-screen-label] [style*="grid-template-columns:repeat(3,1fr)"],
  [data-screen-label] [style*="grid-template-columns:repeat(4,1fr)"] {
    grid-template-columns: 1fr !important;
  }

  [data-screen-label] [style*="grid-template-columns:80px 1fr 1.2fr 40px"] {
    grid-template-columns: 36px 1fr !important;
    gap: 14px !important;
  }

  [data-screen-label] [style*="grid-template-columns:80px 1fr 1.2fr 40px"] > :nth-child(3) {
    grid-column: 2;
  }

  [data-screen-label] [style*="grid-template-columns:80px 1fr 1.2fr 40px"] > :last-child {
    display: none;
  }

  [data-screen-label="Schedule Service"] [style*="grid-template-columns:1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  [data-screen-label="Schedule Service"] [style*="grid-column:1 / -1"] {
    grid-column: auto !important;
  }

  [data-screen-label="Austin Backflow Hero"] [style*="min-height:520px"],
  [data-screen-label="Backflow Hero"] [style*="min-height:520px"],
  [data-screen-label="Plumbing Hero"] [style*="min-height:520px"],
  [data-screen-label="Leak Hero"] [style*="min-height:520px"] {
    min-height: 390px !important;
    margin: 0 24px 46px !important;
  }

  [data-screen-label="Story"] > div:first-child {
    min-height: 440px !important;
  }

  footer {
    padding-inline: 24px !important;
  }

  footer > div:first-child {
    grid-template-columns: 1fr !important;
    gap: 34px !important;
  }
}

@media (max-width: 420px) {
  header > div:last-child > a:last-child {
    display: none !important;
  }
}

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

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}