@import "https://fonts.googleapis.com/css2?family=Inter:slnt,wght@-10..0,100..900&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap";
:root {
  --content-width: 1216px;
  --container-offset: 15px;
  --container-width: calc(var(--content-width)  + (var(--container-offset) * 2));
  --font-family-primary: "Inter", sans-serif;
  --font-family-secondary: "Work Sans", sans-serif;
  --fw-400: 400;
  --fw-500: 500;
  --fw-600: 600;
  --fw-700: 700;
  --color-white: #fff;
  --color-black: #000;
  --color-dark-900: #292e3d;
  --color-dark-800: #1a2429;
  --color-blue-25: #007eda14;
  --color-blue-50: #ebf2f6;
  --color-blue-300: #44b5f5;
  --color-blue-400: #007eda;
  --color-gray-100: #f2f2f2;
  --color-gray-400: #f6f9fa;
  --color-gray-700: #7b7b7b;
  --color-tile-800: #073e57;
  --filter-blue-40: brightness(0) saturate(100%) invert(23%) sepia(67%) saturate(4858%) hue-rotate(207deg) brightness(93%) contrast(101%);
  --radius-main: 8px;
  --box-shadow-blue: 0 4px 40px 0 #007eda14;
  --gradient-blue: linear-gradient(90deg, #e7f3f9 30%, #e7f3f900 100%);
  --quote: url("data:image/svg+xml,%3Csvg width='20' height='16' viewBox='0 0 20 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.49937 7.51698C7.19377 7.83907 7.73538 8.3222 8.12424 8.96639C8.5131 9.61057 8.70753 10.3719 8.70753 11.2503C8.70753 12.5094 8.33256 13.5269 7.58262 14.3029C6.83267 15.0788 5.87443 15.4668 4.70785 15.4668C3.54127 15.4668 2.57608 15.0715 1.81225 14.2809C1.04841 13.4903 0.666504 12.4801 0.666504 11.2503C0.666504 10.6647 0.735942 10.0791 0.874821 9.49345C1.0137 8.90782 1.31923 8.0294 1.79141 6.85815L4.20789 0.533447H8.33256L6.49937 7.51698ZM16.8378 7.51698C17.5322 7.83907 18.0738 8.3222 18.4627 8.96639C18.8516 9.61057 19.046 10.3719 19.046 11.2503C19.046 12.5094 18.671 13.5269 17.9211 14.3029C17.1711 15.0788 16.2129 15.4668 15.0463 15.4668C13.8797 15.4668 12.9145 15.0715 12.1507 14.2809C11.3869 13.4903 11.005 12.4801 11.005 11.2503C11.005 10.6647 11.0744 10.0791 11.2133 9.49345C11.3522 8.90782 11.6577 8.0294 12.1299 6.85815L14.5464 0.533447H18.671L16.8378 7.51698Z' fill='%23000'/%3E%3C/svg%3E%0A");
  --arrow-down-icon: url("data:image/svg+xml,%3Csvg width='19' height='12' viewBox='0 0 19 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.55707 0.666706C9.32326 0.665355 9.09149 0.71017 8.87504 0.798579C8.65858 0.886989 8.46171 1.01725 8.29571 1.18191L1.18946 8.28815C1.02382 8.4538 0.892425 8.65045 0.802779 8.86687C0.713133 9.08329 0.666992 9.31526 0.666992 9.54951C0.666992 9.78377 0.713133 10.0157 0.802779 10.2322C0.892425 10.4486 1.02382 10.6452 1.18946 10.8109C1.35511 10.9765 1.55176 11.1079 1.76818 11.1976C1.9846 11.2872 2.21657 11.3333 2.45082 11.3333C2.68508 11.3333 2.91704 11.2872 3.13347 11.1976C3.34989 11.1079 3.54654 10.9765 3.71218 10.8109L9.55707 4.93045L15.4197 10.5799C15.5832 10.7616 15.7823 10.9077 16.0048 11.0089C16.2272 11.1102 16.4682 11.1644 16.7125 11.1683C16.9569 11.1722 17.1994 11.1256 17.425 11.0314C17.6505 10.9373 17.8542 10.7976 18.0233 10.6212C18.1924 10.4447 18.3233 10.2353 18.4078 10.0059C18.4922 9.77657 18.5285 9.53227 18.5142 9.28828C18.4999 9.0443 18.4355 8.80588 18.3249 8.58794C18.2143 8.37 18.0599 8.17722 17.8714 8.02167L10.7651 1.16414C10.4402 0.850908 10.0083 0.673059 9.55707 0.666706Z' fill='%23000'/%3E%3C/svg%3E%0A");
  --arrow-back: url("data:image/svg+xml,%3Csvg width='14' height='12' viewBox='0 0 14 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.414531 6.39792L5.47703 11.4604C5.58258 11.566 5.72573 11.6253 5.875 11.6253C6.02427 11.6253 6.16742 11.566 6.27297 11.4604C6.37852 11.3549 6.43781 11.2117 6.43781 11.0624C6.43781 10.9132 6.37852 10.77 6.27297 10.6645L2.17023 6.56245H13.1875C13.3367 6.56245 13.4798 6.50318 13.5852 6.39769C13.6907 6.29221 13.75 6.14913 13.75 5.99995C13.75 5.85076 13.6907 5.70769 13.5852 5.6022C13.4798 5.49671 13.3367 5.43745 13.1875 5.43745H2.17023L6.27297 1.33542C6.37852 1.22987 6.43781 1.08671 6.43781 0.937447C6.43781 0.788179 6.37852 0.645026 6.27297 0.539478C6.16742 0.43393 6.02427 0.374634 5.875 0.374634C5.72573 0.374634 5.58258 0.43393 5.47703 0.539478L0.414531 5.60198C0.362232 5.65422 0.320742 5.71626 0.292435 5.78454C0.264128 5.85283 0.249557 5.92603 0.249557 5.99995C0.249557 6.07387 0.264128 6.14706 0.292435 6.21535C0.320742 6.28364 0.362232 6.34567 0.414531 6.39792Z' fill='%23000'/%3E%3C/svg%3E%0A");
}

.checkbox__field:checked + .checkbox__content:after {
  opacity: 1;
}

.checkbox__field:focus + .checkbox__content:before {
  outline: 1px solid var(--color-gray-100);
  outline-offset: 1px;
}

.checkbox__field:disabled + .checkbox__content {
  opacity: .4;
  pointer-events: none;
}

html, body {
  scroll-behavior: smooth;
  overscroll-behavior-y: none;
}

.page {
  height: var(--vh);
  font-family: var(--font-family-primary);
  font-weight: var(--fw-400);
  letter-spacing: 0;
  color: var(--color-dark-900);
  background-color: var(--color-white);
  font-optical-sizing: auto;
  font-size: clamp(16px, 1vw, 20px);
  font-style: normal;
  line-height: 1.5;
}

.page__body {
  min-width: 320px;
  min-height: var(--vh);
}

.page.open {
  overflow: hidden;
}

.container {
  padding: 0 var(--container-offset);
  width: 100%;
  max-width: var(--container-width);
  margin: 0 auto;
}

.site-container {
  min-height: var(--vh);
  grid-template-rows: 1fr auto;
  grid-template-columns: 100%;
  display: grid;
}

.main {
  padding-top: var(--header-height);
}

.overlay {
  position: relative;
}

.overlay:before {
  content: "";
  z-index: 1;
  background: var(--gradient-blue);
  position: absolute;
  inset: 0;
}

@media only screen and (max-width: 992px) {
  .overlay:before {
    background: var(--color-blue-50);
    opacity: .7;
  }
}

.background {
  background-color: var(--color-blue-50);
}

.logo {
  width: 100%;
  max-width: 309px;
  margin-right: 20px;
}

.logo img {
  width: 100%;
}

@media only screen and (max-width: 475px) {
  .logo {
    max-width: 250px;
  }
}

.colored {
  border-radius: calc(var(--radius-main) * 3 - 4px);
  letter-spacing: .02em;
  text-align: center;
  color: var(--color-blue-400);
  background-color: var(--color-blue-25);
  padding: 24px 32px;
  overflow: hidden;
}

.colored b {
  font-weight: var(--fw-600);
}

.colored--about {
  max-width: 802px;
  margin: 0 auto;
  padding-block: 6.375rem 30px;
  font-size: 20px;
  position: relative;
}

.colored--about:before {
  content: "";
  width: 48px;
  height: 40px;
  background-image: var(--quote);
  filter: var(--filter-blue-40);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  margin: 0 auto;
  position: absolute;
  top: 33px;
  left: 0;
  right: 0;
}

.hidden {
  display: none !important;
}

.sr-only {
  -webkit-clip-path: inset(50%) !important;
  clip-path: inset(50%) !important;
  width: 1px !important;
  height: 1px !important;
  white-space: nowrap !important;
  clip: rect(1px, 1px, 1px, 1px) !important;
  border: 0 !important;
  margin: -1px !important;
  padding: 0 !important;
  position: absolute !important;
  overflow: hidden !important;
}

.dis-scroll {
  width: 100%;
  height: 100dvh;
  height: calc(var(--vh, 1vh) * 100);
  overscroll-behavior: none;
  position: fixed;
  top: 0;
  left: 0;
  overflow: hidden;
}

.js-focus-visible :focus:not(.focus-visible) {
  outline: none;
}

h1, h2, h3 {
  width: -moz-fit-content;
  width: fit-content;
  font-weight: var(--fw-600);
  text-transform: capitalize;
  color: var(--color-dark-800);
  overflow: hidden;
}

h1 {
  font-size: clamp(2.375rem, 2.0536rem + 1.6071vi, 3.5rem);
}

@media only screen and (max-width: 768px) {
  h1 {
    font-size: 34px;
    line-height: 1.2;
  }
}

h2, .title {
  text-align: left;
  margin-bottom: 2rem;
  font-size: clamp(2rem, 1.7143rem + 1.4286vi, 3rem);
  line-height: 1.2;
}

h2 {
  text-transform: none;
}

@media only screen and (max-width: 992px) {
  h2 {
    text-align: center;
  }
}

@media only screen and (max-width: 768px) {
  h2 {
    margin-bottom: 30px;
  }
}

h3, .title--sec {
  font-size: 20px;
}

.sub-desc {
  width: 100%;
  max-width: 1000px;
  text-align: center;
  margin: 0 auto 3.9375rem;
}

@media only screen and (max-width: 576px) {
  .sub-desc {
    margin-bottom: 30px;
  }
}

p {
  font-family: var(--font-family-secondary);
  opacity: .86;
  font-size: 20px;
  line-height: 1.5;
}

.header {
  z-index: 10;
  border-radius: var(--radius-main);
  width: 100%;
  max-width: 1344px;
  background-color: var(--color-white);
  margin: 0 auto;
  padding: 20px 0;
  transition-property: transform, padding;
  transition-duration: .15s;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}

.header.hide {
  transform: translateY(calc(-100% - 30px));
}

.header button.formsapp-popup-button, .header .btn {
  padding: 10px 16px !important;
}

.nav {
  justify-content: space-between;
  align-items: center;
  display: flex;
  position: relative;
}

.nav__inner {
  width: 100%;
  justify-content: flex-end;
  display: flex;
}

@media only screen and (max-width: 992px) {
  .header .nav__inner {
    z-index: -1;
    padding-top: calc(var(--header-height) * 1.5);
    width: 100%;
    height: calc(var(--vh));
    background-color: var(--color-white);
    flex-direction: column;
    justify-content: flex-start;
    transition-property: transform;
    transition-duration: .4s;
    position: fixed;
    top: 0;
    left: 0;
    overflow-y: auto;
    transform: translateX(150%);
  }
}

.nav__list {
  align-items: center;
  margin-right: 16px;
  display: flex;
}

@media only screen and (max-width: 1280px) {
  .header .nav__list {
    margin-right: 10px;
  }
}

@media only screen and (max-width: 992px) {
  .header .nav__list {
    z-index: -1;
    flex-direction: column;
  }
}

.nav__item:not(:last-of-type) {
  margin-right: 12px;
}

@media only screen and (max-width: 1280px) {
  .nav__item:not(:last-of-type) {
    margin-right: 10px;
  }
}

@media only screen and (max-width: 992px) {
  .header .nav__item {
    margin-bottom: 30px;
  }
}

.nav__link {
  letter-spacing: .035em;
  white-space: nowrap;
  text-transform: capitalize;
  color: var(--color-black);
  background-color: #0000;
  font-size: 16px;
}

.nav__link.true {
  color: var(--color-blue-400);
}

.nav__btns {
  width: 100%;
  max-width: 292px;
  display: flex;
  translate: 8px;
}

.nav__btns .btn {
  white-space: nowrap;
  margin-right: 8px;
  padding: 10px;
}

.nav__btns .btn:first-of-type {
  width: -moz-fit-content;
  width: fit-content;
  min-width: 100px;
}

@media only screen and (max-width: 992px) {
  .nav__btns {
    margin: 0 auto;
  }

  .nav--footer {
    flex-direction: column;
  }

  .nav--footer .logo, .nav--footer .nav__list {
    margin-bottom: 20px;
  }

  .nav--footer .nav__inner {
    flex-direction: column;
    align-items: center;
  }
}

[class].btn {
  border: 1px solid var(--color-blue-400);
  border-radius: calc(var(--radius-main) * 4 - 4px);
  width: 100%;
  max-width: 176px;
  font-weight: var(--fw-500);
  text-align: center;
  color: var(--color-blue-400);
  background-color: var(--color-white);
  justify-content: center;
  align-items: center;
  padding: 18px 10px;
  font-size: 18px;
  line-height: 1;
  transition-property: background-color, color, border-color;
  transition-duration: .2s;
  display: flex;
  position: relative;
}

[class].btn--reverse {
  border-color: var(--color-blue-300);
  color: var(--color-white);
  background-color: var(--color-blue-300);
}

[class].btn--reverse:hover, [class].btn--reverse:focus {
  border-color: var(--color-blue-400);
  color: var(--color-white);
  background-color: var(--color-blue-400);
}

button.formsapp-popup-button {
  margin: 0 !important;
  padding: 18px 16px !important;
}

.burger {
  --line-height: 2px;
  --buger-size: 20px;
  --move: calc(var(--buger-size) / 3);
  --move-decrement: calc(var(--move) * -1);
  --transition-time: .5s;
  --lines-color: var(--color-black);
  width: calc(var(--buger-size)  + 5px);
  height: var(--buger-size);
  transition: opacity var(--transition-time) ease;
  background-color: #0000;
  display: none;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

.burger span {
  z-index: -1;
  width: 100%;
  height: var(--line-height);
  background-color: var(--lines-color);
  transition: transform var(--transition-time) ease, background-color var(--transition-time) ease .3s;
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.burger span:before, .burger span:after {
  content: "";
  width: 100%;
  height: var(--line-height);
  background-color: var(--lines-color);
  animation-duration: .4s;
  animation-timing-function: cubic-bezier(.645, .045, .355, 1);
  animation-fill-mode: forwards;
  position: absolute;
  left: 0;
}

.burger span:before {
  transform: translateY(var(--move-decrement)) rotate(0);
}

.burger span:after {
  transform: translateY(var(--move)) rotate(0);
}

.burger:hover {
  opacity: 1;
}

@media only screen and (max-width: 992px) {
  .burger {
    display: block;
  }
}

.closed.opened span {
  background-color: var(--lines-color);
  transition: background-color .2s;
}

.closed.opened span:before {
  animation-name: toplineburger;
}

.closed.opened span:after {
  animation-name: bottomlineburger;
}

.opened .nav__inner {
  transform: translateX(0);
}

.opened span {
  background-color: #0000;
  transition: background-color .2s;
}

.opened span:before, .opened span:after {
  animation-duration: .2s;
  animation-timing-function: cubic-bezier(.645, .045, .355, 1);
  animation-fill-mode: forwards;
}

.opened span:before {
  animation-name: toplinecross;
}

.opened span:after {
  animation-name: bottomlinecross;
}

.hero {
  background-position: 100% 0;
  background-repeat: no-repeat;
  background-size: cover;
}

.hero__inner {
  min-height: 645px;
  flex-direction: column;
  justify-content: center;
  display: flex;
}

.hero__btns {
  display: flex;
}

.hero__btns .btn {
  max-width: none;
}

.hero__btns .btn:first-child {
  max-width: 242px;
  margin-right: 8px !important;
}

.hero__btns .btn:last-child {
  max-width: 192px;
}

.hero__btns .formsapp-button.formsapp-popup-button:not(.btn--reverse) {
  color: var(--color-dark-800) !important;
  border-color: #0000 !important;
}

.hero__content {
  z-index: 1;
  width: 100%;
  max-width: 560px;
  position: relative;
  translate: 0 13px;
}

.hero--simple .hero__content {
  translate: 0 30px;
}

.hero h1 {
  letter-spacing: .01em;
  margin-bottom: 24px;
  line-height: 1.2;
}

.hero p {
  margin-bottom: 32px;
}

@media only screen and (max-width: 768px) {
  .hero {
    background-position: center;
    background-size: cover;
  }

  .hero__inner {
    min-height: 450px;
  }

  .hero__content {
    translate: 0;
  }

  .hero--simple .hero__inner {
    min-height: 370px;
  }

  .hero--simple .hero__content {
    translate: 0;
  }
}

.faq {
  padding: 4.875rem 0 5.4375rem;
}

.faq h1 {
  margin: 0 auto 2.5rem;
}

.faq__item:not(:last-child) {
  margin-bottom: 17px;
}

.faq details {
  border-radius: calc(var(--radius-main) * 4 - 4px);
  background-color: var(--color-blue-50);
  overflow: hidden;
}

.faq details p {
  width: 95%;
  font-family: var(--font-family-primary);
  font-size: 16px;
  line-height: 1.6;
}

.faq details[open] summary {
  padding-bottom: 7px;
}

.faq details[open] summary:before {
  rotate: none;
}

.faq summary {
  font-weight: var(--fw-600);
  letter-spacing: .02em;
  color: var(--color-blue-400);
  cursor: pointer;
  padding: 13px 54px 13px 24px;
  font-size: 18px;
  position: relative;
}

.faq summary:before {
  content: "";
  border-radius: var(--radius-main);
  width: 32px;
  height: 32px;
  background-image: var(--arrow-down-icon);
  filter: var(--filter-blue-40);
  perspective-origin: bottom;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 20px 13px;
  position: absolute;
  top: 10px;
  right: 25px;
  overflow: hidden;
  rotate: 180deg;
}

.faq summary + div {
  padding: 0 24px 15px;
}

.faq h1 {
  text-align: center;
  margin: 0 auto 3rem;
}

@media only screen and (max-width: 992px) {
  .faq {
    padding: 3.75rem 0;
  }
}

@media only screen and (max-width: 768px) {
  .faq {
    padding: 2.5rem 0;
  }

  .faq summary:before {
    top: 10px;
    right: 15px;
  }
}

@media only screen and (max-width: 576px) {
  .faq details p {
    width: 100%;
  }
}

@keyframes toplinecross {
  0% {
    transform: translateY(var(--move-decrement));
  }

  50% {
    transform: translateY(0);
  }

  100% {
    transform: rotate(45deg);
  }
}

@keyframes bottomlinecross {
  0% {
    transform: translateY(var(--move));
  }

  50% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(0)rotate(-45deg);
  }
}

@keyframes toplineburger {
  0% {
    transform: rotate(45deg);
  }

  50% {
    transform: rotate(0);
  }

  100% {
    transform: translateY(var(--move-decrement)) rotate(0);
  }
}

@keyframes bottomlineburger {
  0% {
    transform: translateY(0)rotate(-45deg);
  }

  50% {
    transform: rotate(0);
  }

  100% {
    transform: translateY(var(--move)) rotate(0);
  }
}

.policy {
  color: var(--color-dark-900);
  padding: 4.875rem 0;
}

.policy > * {
  font-family: var(--font-family-primary);
}

.policy__content {
  margin-bottom: 3rem;
}

.policy h1 {
  margin: 0 auto 2.5rem;
  position: relative;
}

.policy h2 {
  color: var(--color-blue-400);
  margin-bottom: 24px;
  font-size: 30px;
}

.policy ul {
  margin-bottom: 24px;
  padding-left: 15px;
}

.policy li {
  padding-left: 5px;
  font-size: 20px;
  line-height: 1.43;
}

.policy li:not(:last-child) {
  margin-bottom: 3px;
}

.policy li::marker {
  content: "✓";
  margin-right: 5px;
}

.policy p {
  font-size: 20px;
  line-height: 1.2;
}

.policy p:not(:last-child) {
  margin-bottom: 30px;
}

.policy a {
  color: var(--color-blue-400);
  text-decoration: underline;
}

.policy b, .policy strong {
  font-weight: var(--fw-600);
}

@media only screen and (max-width: 768px) {
  .policy {
    padding: 40px 0;
  }

  .policy h1 {
    text-align: center;
    margin-bottom: 30px;
  }
}

.footer {
  color: var(--color-white);
  background-color: var(--color-blue-50);
}

.footer__bottom {
  color: var(--color-dark-800);
  background-color: var(--color-gray-400);
  padding: 25px 0;
}

.footer__bottom .nav__item:not(:last-child) {
  margin-right: 3.75rem;
}

.footer__bottom p {
  font-size: 16px;
}

.footer__inner {
  justify-content: space-between;
  display: flex;
}

.footer button.formsapp-popup-button, .footer .btn {
  padding: 10px 16px !important;
}

.footer .nav__inner {
  translate: -8px;
}

.footer .nav__btns {
  max-width: 284px;
}

.footer .nav .btn {
  border-radius: var(--radius-main);
}

.footer .nav .btn:first-child {
  background-color: #0000;
}

.footer .nav--footer {
  padding: 3.5625rem 0 3.4375rem;
}

@media only screen and (max-width: 992px) {
  .footer .nav--footer {
    padding: 30px 0;
  }

  .footer .nav__list {
    margin: 0 auto 30px;
  }
}

@media only screen and (max-width: 768px) {
  .footer__inner {
    text-align: center;
    flex-direction: column;
    align-items: center;
  }

  .footer__inner .nav {
    width: max-content;
  }

  .footer__inner > p {
    margin-bottom: 20px;
  }
}

@media only screen and (max-width: 576px) {
  .footer .nav__list {
    flex-direction: column;
  }

  .footer .nav__item:not(:last-child) {
    margin-bottom: 20px;
    margin-right: 0;
  }

  .footer__bottom .nav__item:not(:last-child) {
    margin-bottom: 0;
    margin-right: 15px;
  }
}

.desc {
  border-radius: calc(var(--radius-main) * 4);
  padding: 7.9375rem 1.875rem 3.75rem;
  position: relative;
}

.desc:before {
  content: "";
  width: 48px;
  height: 48px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: auto;
  position: absolute;
  top: 60px;
  left: 30px;
}

.desc h3 {
  margin-bottom: 20px;
}

.desc p {
  font-size: 16px;
}

.desc--integrity:before {
  background-image: url("../images/icons/handshake.svg");
}

.desc--quality:before {
  background-image: url("../images/icons/ok.svg");
}

.desc--reliability:before {
  background-image: url("../images/icons/shield.svg");
}

.desc--repair:before {
  background-image: url("../images/icons/tools.svg");
}

.desc--fixture:before {
  background-image: url("../images/icons/shower.svg");
}

.desc--replacement:before {
  background-image: url("../images/icons/refresh.svg");
}

.desc--emergency:before {
  background-image: url("../images/icons/clock.svg");
}

.desc--drain:before {
  background-image: url("../images/icons/air.svg");
}

.desc--idea:before {
  background-image: url("../images/icons/idea.svg");
}

.desc--favorite:before {
  background-image: url("../images/icons/favorite.svg");
}

.desc--volunteering:before {
  background-image: url("../images/icons/volunteering.svg");
}

.desc--piping:before {
  background-image: url("../images/icons/piping.svg");
}

.desc--tools:before {
  background-image: url("../images/icons/tools.svg");
}

.desc--maintenance:before {
  background-image: url("../images/icons/maintenance.svg");
}

.desc--quick_mode:before {
  background-image: url("../images/icons/quick_mode.svg");
}

.desc--plumbing:before {
  background-image: url("../images/icons/plumbing.svg");
}

.desc--recycle:before {
  background-image: url("../images/icons/recycle.svg");
}

.desc--broom:before {
  background-image: url("../images/icons/broom.svg");
}

.desc--shower:before {
  background-image: url("../images/icons/shower.svg");
}

.desc--water:before {
  background-image: url("../images/icons/water.svg");
}

.desc--speech_bubble:before {
  background-image: url("../images/icons/speech_bubble.svg");
}

.desc--good_quality:before {
  background-image: url("../images/icons/good_quality.svg");
}

.desc--average_price:before {
  background-image: url("../images/icons/average_price.svg");
}

.desc--people:before {
  background-image: url("../images/icons/people.svg");
}

.desc--heating:before {
  background-image: url("../images/icons/heating.svg");
}

.desc--toilet_bowl:before {
  background-image: url("../images/icons/toilet_bowl.svg");
}

.desc--dishwasher:before {
  background-image: url("../images/icons/dishwasher.svg");
}

.desc--conversion:before {
  background-image: url("../images/icons/conversion.svg");
}

.desc--bath:before {
  background-image: url("../images/icons/bath.svg");
}

.desc--kitchen:before {
  background-image: url("../images/icons/kitchen.svg");
}

.desc--soap:before {
  background-image: url("../images/icons/soap.svg");
}

.desc--shadow {
  box-shadow: var(--box-shadow-blue);
}

@media only screen and (max-width: 576px) {
  .desc {
    padding: 6.25rem 1.875rem 2.5rem;
  }

  .desc:before {
    top: 30px;
  }
}

.additional {
  padding: 4.0625rem 0 5.625rem;
}

.additional__inner {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.additional__picture {
  border-radius: calc(var(--radius-main) * 4);
  width: 100%;
  max-width: 596px;
  overflow: hidden;
}

.additional__content {
  width: 100%;
  max-width: 493px;
}

.additional__content > :not(:last-child) {
  margin-bottom: 32px;
}

.additional p span {
  font-weight: var(--fw-500);
  color: var(--color-blue-400);
}

.additional .btn {
  max-width: 146px;
}

.additional--reverse .additional__inner {
  flex-direction: row-reverse;
}

.additional--less .additional__picture {
  max-width: 389px;
}

.additional--less .additional__content {
  max-width: 700px;
}

.additional--services {
  padding: 5.4375rem 0;
}

.additional--optional {
  padding: 5rem 0;
}

@media only screen and (max-width: 1180px) {
  .additional__picture, .additional .additional__content {
    max-width: 550px;
    margin-right: 20px;
  }
}

@media only screen and (max-width: 992px) {
  .additional--reverse .additional__inner {
    flex-direction: column;
  }

  .additional__inner {
    text-align: center;
    flex-direction: column;
    justify-content: center;
  }

  .additional__content {
    max-width: 800px;
    flex-direction: column;
    align-items: center;
    display: flex;
  }

  .additional__picture {
    margin-bottom: 30px;
  }

  .additional .additional__picture {
    margin-right: 0;
  }

  .additional, .additional--services {
    padding: 40px 0;
  }
}

@media only screen and (max-width: 768px) {
  .additional__content, .additional .additional__content {
    margin: 0;
  }

  .additional h2 {
    text-align: center;
  }
}

@media only screen and (max-width: 576px) {
  .additional__picture {
    max-width: none !important;
  }

  .additional__picture img {
    aspect-ratio: 13 / 9;
    object-position: center;
  }
}

@media only screen and (max-width: 475px) {
  .additional .btn {
    max-width: none;
  }
}

.values-grid {
  padding: 5.3125rem 0 5.625rem;
}

.values-grid__list {
  grid-template-columns: repeat(3, 1fr);
  gap: 3.125rem 25px;
  margin-bottom: 3.125rem;
  display: grid;
}

.values-grid__desc {
  max-width: 290px;
}

.values-grid .desc {
  padding: 4.375rem 0 0;
}

.values-grid .desc:before {
  top: 0;
  left: 0;
}

.values-grid h2 {
  margin-bottom: 24px;
}

.values-grid .btn {
  max-width: 220px;
  color: var(--color-dark-900);
  border-color: #0000;
  margin: 0 auto;
}

.values-grid--about {
  padding-bottom: 2.3125rem;
}

.values-grid--service {
  padding-bottom: 35px;
}

.values-grid--service .values-grid__list {
  gap: 24px;
}

.values-grid--service h2 {
  margin: 0 auto 4.25rem;
}

.values-grid--service .desc {
  box-shadow: var(--box-shadow-blue);
  padding-block: 6.25rem 30px;
  padding-inline: 30px;
}

.values-grid--service .desc:before {
  top: 29px;
  left: 29px;
}

.values-grid--offered {
  padding-bottom: 35px;
}

.values-grid--provided {
  padding-block: 8.75rem 5rem;
}

.values-grid--provided .values-grid__list {
  margin-bottom: 0;
}

.values-grid--emergency {
  padding-block: 5.75rem 5rem;
}

.values-grid--emergency h2 {
  margin-bottom: 2.125rem;
}

.values-grid--emergency h2 + p {
  max-width: 800px;
  text-align: center;
  margin: 0 auto 4.0625rem;
}

.values-grid--emergency .values-grid__list {
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 0;
  display: flex;
}

.values-grid--emergency .desc {
  width: 100%;
  max-width: 388px;
}

.values-grid--drain h2 {
  margin-bottom: 1.875rem;
}

.values-grid--drain h2 + p {
  max-width: 800px;
  text-align: center;
  margin: 0 auto 4.0625rem;
}

@media only screen and (max-width: 992px) {
  .values-grid {
    padding: 30px 0;
  }

  .values-grid__list {
    grid-template-columns: repeat(2, 1fr);
  }

  .values-grid--emergency {
    padding: 30px 0;
  }

  .values-grid--drain .desc:last-child {
    grid-column: span 2;
  }
}

@media only screen and (max-width: 576px) {
  .values-grid__list {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .values-grid__desc, .values-grid .desc {
    max-width: none;
  }

  .values-grid--drain .desc:last-child {
    grid-column: auto;
  }
}

@media only screen and (max-width: 475px) {
  .values-grid .btn {
    max-width: none;
  }
}

.blog {
  padding: 4.375rem 0 6.8125rem;
}

.blog__grid {
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-bottom: 1.75rem;
  display: grid;
}

.blog h2 {
  text-transform: none;
  margin: 0 auto 24px;
}

.blog h2 + p {
  margin-bottom: 3.125rem;
}

.blog .btn {
  max-width: 228px;
  color: var(--color-dark-800);
  background-color: var(--color-blue-50);
  border-color: #0000;
  margin: 0 auto;
  font-size: 19px;
}

.blog--articles {
  padding: 5.4375rem 0;
}

.blog--articles .news__content {
  padding: 24px 23px;
}

.blog--articles .news h3 {
  margin-bottom: 8px;
}

.blog--articles .news a {
  font-size: 14px;
}

@media only screen and (max-width: 992px) {
  .blog__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media only screen and (max-width: 768px) {
  .blog {
    padding: 40px 0;
  }

  .blog h2 {
    text-align: center;
  }
}

@media only screen and (max-width: 576px) {
  .blog__grid {
    grid-template-columns: 1fr;
  }
}

.article {
  padding: 4.5625rem 0;
}

.article__header {
  max-width: 860px;
  margin-bottom: 21px;
  display: flex;
}

.article__time {
  letter-spacing: .032em;
  color: var(--color-gray-700);
  font-size: 20px;
}

.article__time time {
  margin-right: 10px;
  position: relative;
}

.article__time time:before {
  content: "";
  width: 3px;
  height: 3px;
  background-color: var(--color-gray-700);
  border-radius: 50%;
  position: absolute;
  top: 11px;
  right: -1px;
}

.article .back {
  height: max-content;
  text-transform: capitalize;
  margin-right: 2.5625rem;
  padding-top: 7px;
  padding-left: 3.25rem;
  font-size: 18px;
  position: relative;
}

.article .back:before {
  content: "";
  width: 15px;
  height: 13px;
  background-image: var(--arrow-back);
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 12px;
  left: 27px;
}

.article h1 {
  text-transform: none;
  margin-bottom: 22px;
  font-size: 36px;
  line-height: 1.2;
}

.article h2 {
  font-family: var(--font-family-primary);
  letter-spacing: .02em;
  margin-bottom: 26px;
  padding-left: 10px;
  font-size: 30px;
}

.article img {
  margin-bottom: 24px;
}

.article img:first-of-type {
  margin-bottom: 4rem;
}

.article img:last-of-type {
  border-bottom: 1px solid var(--color-gray-100);
  margin-bottom: 1.75rem;
  padding-bottom: 20px;
}

.article p {
  font-family: var(--font-family-primary);
  letter-spacing: .02em;
  margin-bottom: 26px;
  line-height: 1.2;
}

.contact {
  min-height: 900px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  justify-content: flex-end;
  align-items: flex-end;
  display: flex;
}

.contact__wrapper {
  width: 100%;
  max-width: 915px;
  background-color: var(--color-white);
  padding: 5.5rem 6.5625rem 5.3125rem;
}

.contact__inner {
  display: flex;
}

.contact__data {
  max-width: 294px;
}

.contact__data > * {
  margin-bottom: 24px;
}

.contact__data a {
  color: var(--color-blue-400);
  text-decoration: underline;
  display: block;
}

.contact__data p {
  font-size: 16px;
}

.contact__data span {
  letter-spacing: -.01em;
  line-height: 1.4;
  display: block;
}

.contact__form {
  width: 100%;
  max-width: 390px;
  margin-right: 22px;
}

.contact label {
  margin-bottom: 16px;
  display: block;
}

.contact label:last-of-type {
  margin-bottom: 22px;
}

.contact input, .contact textarea {
  border-radius: calc(var(--radius-main) * 4 - 4px);
  width: 100%;
  color: var(--color-dark-800);
  background-color: var(--color-gray-400);
  border-color: #0000;
  padding: 13px;
}

.contact textarea {
  min-height: 156px;
}

.contact .btn {
  max-width: none;
}

@media only screen and (max-width: 768px) {
  .contact__wrapper {
    padding: 40px;
  }
}

@media only screen and (max-width: 576px) {
  .contact h2 {
    text-align: center;
    margin: 0 auto 40px;
  }

  .contact__wrapper {
    padding: 40px 20px;
  }

  .contact__inner {
    flex-direction: column;
    align-items: center;
  }

  .contact__form {
    max-width: none;
    margin-bottom: 40px;
    margin-right: 0;
  }
}

.news {
  border: 1px solid var(--color-blue-50);
  border-radius: calc(var(--radius-main) * 3);
  height: 100%;
  flex-direction: column;
  display: flex;
  overflow: hidden;
}

.news__content {
  height: 100%;
  flex-direction: column;
  padding: 22px;
  display: flex;
}

.news h3 {
  text-transform: none;
  margin-bottom: 10px;
  line-height: 1.2;
}

.news p {
  margin-bottom: 8px;
  font-size: 14px;
}

.news img {
  width: 100%;
}

.news a:not(.btn) {
  color: var(--color-blue-400);
  margin-top: auto;
  font-size: 15px;
  text-decoration: underline;
}

.about {
  border-bottom: 1px solid var(--color-blue-50);
  padding: 5.5rem 0 4.0625rem;
}

.about__inner {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.about__content {
  width: 100%;
  max-width: 490px;
}

.about__grid {
  width: 100%;
  max-width: 596px;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  display: grid;
}

.about__item {
  width: 100%;
}

.about__item:last-child {
  max-width: 286px;
  grid-column: span 2;
  justify-items: center;
  margin: 0 auto;
}

.about h2 {
  margin-bottom: 33px;
}

.about h2 + p {
  margin-bottom: 7px;
}

.about h2 ~ img {
  translate: 0 23px;
}

.about--page {
  border-bottom: 1px solid var(--color-blue-50);
  padding: 13.125rem 0 5.625rem;
}

.about--page .about__item {
  padding-block: 6.25rem 2.3125rem;
}

.about--page .about__item:before {
  top: 28px;
}

@media only screen and (max-width: 1180px) {
  .about__content {
    max-width: 450px;
    margin-right: 20px;
  }
}

@media only screen and (max-width: 992px) {
  .about--page {
    padding-top: 60px;
  }

  .about__inner {
    flex-direction: column;
  }

  .about__content {
    max-width: 800px;
    margin: 0 auto 30px;
  }

  .about h2 ~ img {
    translate: 0;
  }
}

@media only screen and (max-width: 768px) {
  .about__inner {
    flex-direction: column;
  }

  .about__grid {
    grid-template-columns: 1fr;
  }

  .about__item:last-child {
    max-width: none;
    grid-column: auto;
  }
}

.customers {
  padding: 5.125rem 0 5.625rem;
}

.customers__image {
  margin: 0 auto 4.0625rem;
}

.customers__slider {
  max-width: 1216px;
  margin-bottom: 4.0625rem;
  overflow: hidden;
}

.customers__item {
  border-radius: calc(var(--radius-main) * 4);
  text-align: center;
  background-color: var(--color-gray-400);
  padding: 5.625rem 32px 32px;
  position: relative;
}

.customers__item:before {
  content: "";
  width: 42px;
  height: 42px;
  background-image: var(--quote);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 20px;
  background-color: var(--color-blue-50);
  border-radius: 50%;
  margin: 0 auto;
  position: absolute;
  top: 33px;
  left: 0;
  right: 0;
}

.customers__item p {
  min-height: 96px;
  align-items: center;
  margin-bottom: 16px;
  font-size: 16px;
  display: flex;
}

.customers__item span {
  font-weight: var(--fw-600);
}

.customers .desc {
  padding: 4.1875rem 0 0;
}

.customers .desc:before {
  top: 0;
  left: 0;
}

.customers .swiper-pagination {
  position: relative;
}

.customers .swiper-pagination-bullet {
  border: 2px solid var(--color-blue-400);
  width: 12px;
  height: 12px;
  background-color: #0000;
}

.customers .swiper-pagination-bullet:not(:last-child) {
  margin-right: 10px;
}

.customers .swiper-pagination-bullet-active {
  background-color: var(--color-blue-400);
}

.customers h2 {
  margin: 0 auto 24px;
}

.customers--about {
  padding-block: 3.9375rem 4.5rem;
}

.customers--about h2 {
  margin-bottom: 4.0625rem;
}

@media only screen and (max-width: 768px) {
  .customers {
    padding: 40px 0;
  }

  .customers h2 {
    text-align: center;
  }
}

@media only screen and (max-width: 576px) {
  .customers__image {
    margin-bottom: 20px;
  }

  .customers__item {
    padding-inline: 20px;
  }

  .customers h2 {
    margin-bottom: 30px;
  }
}

.about-page .additional {
  border-bottom: 1px solid var(--color-blue-50);
  padding-bottom: 4.0625rem;
}

.about-page .additional:first-child {
  padding-top: 5.375rem;
}

.team {
  padding: 6.5625rem 0 5.625rem;
}

.team__grid {
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  display: grid;
}

.team__member {
  font-family: var(--font-family-primary);
  text-align: center;
  flex-direction: column;
  align-items: center;
  padding: 30px;
  display: flex;
}

.team__member img {
  margin-bottom: 24px;
}

.team__member h3 {
  margin-bottom: 5px;
  font-size: 24px;
}

.team__member span {
  color: var(--color-blue-400);
  margin-bottom: 12px;
  font-size: 16px;
  display: block;
}

.team__member p {
  font-size: 14px;
}

.team h2 {
  margin: 0 auto 24px;
}

.team h2 + p {
  max-width: 800px;
}

@media only screen and (max-width: 992px) {
  .team__grid {
    gap: 15px;
  }
}

@media only screen and (max-width: 768px) {
  .team__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .team__member:last-child {
    grid-column: span 2;
  }
}

@media only screen and (max-width: 576px) {
  .team__grid {
    grid-template-columns: 1fr;
  }

  .team__member:last-child {
    grid-column: auto;
  }
}

.benefits {
  padding: 5.4375rem 0 2.3125rem;
}

.benefits__grid {
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-bottom: 4.0625rem;
  display: grid;
}

.benefits__item {
  box-shadow: var(--box-shadow-blue);
  padding-block: 6.375rem 1.875rem;
}

.benefits__item:before {
  top: 33px;
}

.benefits h2 {
  margin: 0 auto 3.75rem;
}

@media only screen and (max-width: 992px) {
  .benefits {
    padding: 40px 0;
  }

  .benefits__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    margin-bottom: 30px;
  }

  .benefits--services {
    padding: 40px 0;
  }
}

@media only screen and (max-width: 576px) {
  .benefits {
    padding: 30px 0;
  }

  .benefits__grid {
    grid-template-columns: 1fr;
    margin-bottom: 20px;
  }
}

.projects {
  padding: 5.5rem 0;
}

.projects__header h2 {
  margin: 0 auto 1.875rem;
}

.projects__header p {
  max-width: 800px;
  text-align: center;
  margin: 0 auto 4.0625rem;
}

.projects .additional {
  padding: 22px 0 9.375rem;
}

.projects .additional__content h2 {
  font-size: 40px;
}

.projects .additional:last-child {
  padding-bottom: 0;
}

.projects--less .projects__header p {
  margin-bottom: 5.8125rem;
}

@media only screen and (max-width: 768px) {
  .projects .additional {
    padding-bottom: 50px;
  }
}