:root {
  --font-mulish: "Mulish", sans-serif;

  --text-12: 12px;
  --text-13: 13px;
  --text-14: 14px;
  --text-15: 15px;
  --text-16: 16px;
  --text-18: 18px;
  --text-20: 20px;
  --text-24: 24px;
  --text-26: 26px;
  --text-36: 36px;
  --text-40: 40px;
  --text-55: 55px;
  --text-64: 64px;

  --font-medium: 500;
  --font-semibold: 600;

  --text-light: #ffffff;
  --text-dark: #2a2c31;
  --text-accent: #6f2bdf;
  --text-accent-lighter: #8948f3;

  --bg-primary: #c8cbd3;
  --bg-sf: #2a2c31;

  --border-btn: 1.3px solid var(--bg-btn-primary);
  --border-btn-hover: 1.3px solid var(--bg-btn-primary-hover);

  --bg-btn-primary: #6f2bdf;
  --text-btn-primary: var(--text-light);
  --box-shadow-btn-primary: 1px 0 7.8px 0 var(--bg-btn-primary);

  --bg-btn-primary-hover: #6121c9;
  --box-shadow-btn-primary-hover: 1px 0 7.8px 0 var(--bg-btn-primary-hover);

  --bg-btn-secondary: transparent;
  --text-btn-secondary: var(--text-light);

  --space-3: 3px;
  --space-8: 8px;
  --space-10: 10px;
  --space-11: 11px;
  --space-13: 13px;
  --space-14: 14px;
  --space-15: 15px;
  --space-17: 17px;
  --space-18: 18px;
  --space-19: 19px;
  --space-20: 20px;
  --space-21: 21px;
  --space-22: 22px;
  --space-24: 24px;
  --space-26: 26px;
  --space-29: 29px;
  --space-30: 30px;
  --space-32: 32px;
  --space-33: 33px;
  --space-37: 37px;
  --space-38: 38px;
  --space-39: 39px;
  --space-41: 41px;
  --space-42: 42px;
  --space-46: 46px;
  --space-48: 48px;
  --space-50: 50px;
  --space-54: 54px;
  --space-56: 56px;
  --space-58: 58px;
  --space-62: 62px;
  --space-65: 65px;
  --space-69: 69px;
  --space-77: 77px;
  --space-78: 78px;
  --space-86: 86px;
  --space-93: 93px;
  --space-100: 100px;
  --space-104: 104px;
  --space-114: 114px;
  --space-175: 175px;
  --space-238: 238px;

  --border-radius-4: 4px;
  --border-radius-6: 6px;

  --transition: all 0.2s ease-in-out;

  --messenger-size: 30px;
  --form-control-height: 55px;
  --checkbox-size: 18px;
  --icon-size: 18px;
  --advantage-short-icon-size: 60px;
  --header-height: 171px;
  --service-icon-size: 110px;
  --work-step-arrow-height: 15px;
  --advantage-icon-size: 43px;
  --scroll-to-top-size: 46px;
  --messenger-aside-size: 50px;
  --messenger-aside-icon-size: 25px;
}

html {
  scrollbar-gutter: stable;
  padding-right: 0 !important;
}

body {
  padding-right: 0 !important;
}

div.page {
  background-color: var(--bg-primary);
}

.page-node--822 .field--name-title {
  hyphens: auto;
}

header,
footer,
main,
.offcanvas {
  font-family: var(--font-mulish);
  color: var(--text-dark);
}

header a,
footer a,
main a,
.offcanvas a {
  color: var(--text-dark);
  text-decoration: none;
  transition: var(--transition);
}

header a:hover,
footer a:hover,
main a:hover,
.offcanvas a:hover {
  color: var(--text-accent-lighter);
}

main .contextual-links,
main .contextual-links a {
  color: #333;
  text-decoration: initial;
  font-family: sans-serif;
  text-shadow: none;
}

main p {
  margin: 0;
}

main p + p {
  margin-top: 1rem;
}

.front h1,
.front h2,
.front h3,
.front h4,
.front h5 {
  margin: 0;
}

.not-front h1 {
  margin-bottom: var(--space-30);
  margin-top: var(--space-10);
}

h1 {
  font-size: var(--text-55);
  font-weight: bold;
}

h2 {
  font-size: var(--text-40);
  font-weight: bold;
}

h3 {
  font-size: var(--text-36);
  font-weight: bold;
}

h4 {
  font-size: var(--text-26);
  font-weight: bold;
}

h4 {
  font-size: var(--text-20);
  font-weight: bold;
}

.front h2,
.front h3,
.front h4,
.front h5 {
  margin: 0;
}

.not-front .text-formatted {
  font-size: var(--text-18);
  font-weight: var(--font-medium);
}

main .text-formatted ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 0;
  padding: 0;
}

main .text-formatted ul li {
  display: flex;
  gap: var(--space-10);
  font-weight: var(--font-medium);
  line-height: 22px;
}

main .text-formatted ul li::before {
  content: "";
  width: 5px;
  height: 5px;
  background-color: var(--bg-btn-primary);
  border-radius: 100%;
  flex-shrink: 0;
  margin-top: 10.5px;
}

ul.slick-dots li button {
  width: var(--space-8);
  height: var(--space-8);
}

ul.slick-dots {
  margin: 4px 0;
}

.text-accent {
  color: var(--text-accent);
}

.nav .nav-link {
  padding: 0;
  font-size: var(--text-16);
  color: var(--text-light);
  font-weight: var(--font-medium);
  transition: var(--transition);
}

.nav .nav-link:hover {
  color: var(--text-accent-lighter);
}

.dropdown-toggle::after {
  display: none;
}

.dropdown-menu {
  border-radius: var(--border-radius-6);
  background-color: var(--bg-primary);
}

.offcanvas .dropdown-menu {
  border-bottom: none !important;
}

.dropdown-menu a.dropdown-item,
.dropdown-menu a.dropdown-item.is-active {
  font-size: var(--text-16);
  color: var(--text-dark);
  font-weight: var(--font-medium);
  transition: var(--transition);
  background-color: var(--bg-primary);
}

.dropdown-menu a.dropdown-item:hover,
.dropdown-menu a.dropdown-item:focus,
.dropdown-menu a.dropdown-item:active {
  color: var(--text-accent-lighter) !important;
  background-color: var(--bg-primary) !important;
}

.offcanvas .dropdown-menu a.dropdown-item,
.offcanvas .dropdown-menu a.dropdown-item.is-active {
  font-size: var(--text-16);
  color: var(--text-light);
  font-weight: var(--font-medium);
  transition: var(--transition);
  background-color: var(--bg-sf);
}

.offcanvas .dropdown-menu a.dropdown-item:hover,
.offcanvas .dropdown-menu a.dropdown-item:focus,
.offcanvas .dropdown-menu a.dropdown-item:active {
  color: var(--text-accent-lighter) !important;
  background-color: var(--bg-sf) !important;
}

.btn,
.vpa-actions .btn-primary,
.field--name-field-hero-photogallery-link a,
.field--name-field-about-page-link a,
.more-link a,
.field--name-field-service-file-download a {
  display: block;
  transition: var(--transition);
  padding: var(--space-17) var(--space-17);
  border: var(--border-btn);
  border-radius: var(--border-radius-6);
  text-align: center;
  font-family: var(--font-mulish);
  font-size: var(--text-16);
  font-weight: bold;
  line-height: 125%;
  text-wrap: nowrap;
}

.btn-primary,
.vpa-actions .btn-primary,
.field--name-field-service-file-download a {
  background-color: var(--bg-btn-primary);
  color: var(--text-light);
  box-shadow: var(--box-shadow-btn-primary);
}

.btn-primary:hover,
.vpa-actions .btn-primary:hover,
.field--name-field-service-file-download a:hover,
.btn-primary:active,
.vpa-actions .btn-primary:active,
.field--name-field-service-file-download a:active,
.btn-primary:disabled,
.vpa-actions .btn-primary:disabled,
.field--name-field-service-file-download a:disabled {
  background-color: var(--bg-btn-primary-hover) !important;
  border: var(--border-btn-hover) !important;
  color: var(--text-light) !important;
  box-shadow: var(--box-shadow-btn-primary-hover) !important;
}

.vpa-actions .btn-primary {
  padding: var(--space-15) var(--space-30) var(--space-13) var(--space-30);
}

.btn-secondary,
.field--name-field-hero-photogallery-link a,
.field--name-field-about-page-link a,
.more-link a {
  background-color: transparent;
  border: var(--border-btn);
  color: var(--text-light);
}

.btn-secondary:hover,
.field--name-field-hero-photogallery-link a:hover,
.field--name-field-about-page-link a:hover,
.more-link a:hover,
.btn-secondary:active,
.field--name-field-hero-photogallery-link a:active,
.field--name-field-about-page-link a:active,
.more-link a:active,
.btn-secondary:disabled,
.field--name-field-hero-photogallery-link a:disabled,
.field--name-field-about-page-link a:disabled,
.more-link a:disabled {
  background-color: var(--bg-btn-primary-hover) !important;
  box-shadow: var(--box-shadow-btn-primary-hover) !important;
  border: var(--border-btn-hover) !important;
  color: var(--text-light) !important;
}

.btn-close:focus {
  box-shadow: none;
}

.offcanvas-header .btn-close,
.modal-content .btn-close,
.ui-dialog-titlebar-close {
  transition: var(--transition);
  filter: brightness(0) saturate(100%) invert(99%) sepia(4%) saturate(2689%)
    hue-rotate(187deg) brightness(121%) contrast(100%);
}

#scrollToTop {
  height: var(--scroll-to-top-size);
  width: var(--scroll-to-top-size);
  background-image: url(/sites/all/themes/vesta_theme/image/icon/arrow-up.svg);
  background-position: center;
  background-repeat: no-repeat;
  border: var();
  transition: var(--transition);
  background-color: var(--bg-btn-primary);
  right: var(--space-41);
  bottom: var(--space-93);
  border-radius: 100%;
}

#scrollToTop:hover {
  border: none;
  background-color: var(--bg-btn-primary-hover);
  box-shadow: var(--box-shadow-btn-primary-hover);
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0px 1000px var(--bg-primary) inset;
  transition: background-color 5000s ease-in-out 0s;
}

.modal-content .ajax-progress,
.ui-dialog.ui-widget .ajax-progress,
.webform-submission-send-request-form .ajax-progress {
  display: none;
}

.modal-content .alert-error,
.ui-dialog.ui-widget .alert-error,
.webform-submission-send-request-form .alert-error {
  display: none;
}

.modal-content .alert-dismissible,
.ui-dialog.ui-widget .alert-dismissible,
.webform-submission-send-request-form .alert-dismissible {
  display: none;
}

input[type="checkbox"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: var(--checkbox-size);
  height: var(--checkbox-size);
  border: 1px solid #ffffff;
  border-radius: var(--border-radius-4);
  background-color: var(--bg-sf);
  cursor: pointer;
  position: relative;
}

input[type="checkbox"]:checked {
  background-color: var(--bg-sf);
  background-image: url("../../vesta_theme/image/icon/check.svg");
  background-repeat: no-repeat;
  background-position: calc(50%) calc(50%);
  background-size: 16px 16px;
  border-color: #ffffff;
}

.modal-content .js-form-item-privacy,
.ui-dialog.ui-widget .js-form-item-privacy,
.webform-submission-send-request-form .js-form-item-privacy {
  font-size: var(--text-12);
  color: var(--text-light);
}

.modal-content .js-form-item-privacy a,
.ui-dialog.ui-widget .js-form-item-privacy a,
.webform-submission-send-request-form .js-form-item-privacy a {
  color: var(--text-accent-lighter);
  text-decoration: none;
  transition: var(--transition);
}

.modal-content .js-form-item-privacy a:hover,
.ui-dialog.ui-widget .js-form-item-privacy a:hover,
.webform-submission-send-request-form .js-form-item-privacy a:hover {
  color: var(--text-light);
}

.modal-content .js-form-type-checkbox,
.ui-dialog.ui-widget .js-form-type-checkbox,
.webform-submission-send-request-form .js-form-type-checkbox {
  display: grid;
  grid-template-columns: 18px 1fr;
  column-gap: 10px;
}

.webform-submission-send-request-form .js-form-type-checkbox {
  margin-top: calc(var(--space-39) - var(--space-29));
}

.modal-content .js-form-type-checkbox .description,
.ui-dialog.ui-widget .js-form-type-checkbox .description,
.webform-submission-send-request-form .description {
  grid-column: 2;
  grid-row: 1;
  font-size: var(--text-12);
  font-weight: var(--font-medium);
}

.modal-content .js-form-type-checkbox .form-item--error-message,
.ui-dialog.ui-widget .js-form-type-checkbox .form-item--error-message,
.webform-submission-send-request-form .form-item--error-message {
  grid-column: 1 / -1;
}

.modal-content .form-item--error-message,
.ui-dialog.ui-widget .form-item--error-message,
.webform-submission-send-request-form .form-item--error-message {
  font-size: var(--text-15);
  color: var(--text-accent-lighter);
  margin-top: 2px;
}

.modal-content .js-form-item-privacy .form-item--error-message,
.ui-dialog.ui-widget .js-form-item-privacy .form-item--error-message,
.webform-submission-send-request-form
  .js-form-item-privacy
  .form-item--error-message {
  grid-column: 2;
}

.modal-content .form-item--error-message .placeholder,
.ui-dialog.ui-widget .form-item--error-message .placeholder,
.webform-submission-send-request-form .form-item--error-message .placeholder {
  background-color: transparent;
  vertical-align: unset;
}

.form-control {
  border: var(--border-btn);
  margin: 0;
  box-shadow: none;
  font-family: var(--font-mulish) !important;
  font-size: var(--text-15) !important;
  font-weight: var(--font-medium);
  height: var(--form-control-height);
  border-radius: var(--border-radius-6);
  background-color: var(--bg-sf);
  color: var(--text-light);
  resize: none;
}

.search .form-control {
  height: 40px;
}

.form-control:focus {
  box-shadow: none;
  border: var(--border-btn);
  background-color: var(--bg-sf);
  color: var(--text-light);
}

.form-control::placeholder {
  color: var(--text-light);
  font-size: var(--text-15);
  font-weight: var(--font-medium);
}

.modal-content,
.ui-dialog.ui-widget {
  font-family: var(--font-mulish);
  border: var(--border-btn);
  border-radius: var(--border-radius-6);
  background-color: var(--bg-sf);
  color: var(--text-light);
}

.ui-dialog .ui-dialog-content {
  font-family: var(--font-mulish);
  color: var(--text-light);
}

.modal-content form,
.ui-dialog.ui-widget form {
  display: flex;
  flex-direction: column;
  gap: var(--space-10);
}

.webform-submission-send-request-form {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-29);
  z-index: 1;
}

.ui-widget-content .ui-widget-header {
  background: none;
  border: none;
}

.ui-widget-content .ui-widget-header .ui-dialog-title {
  font-size: var(--text-26);
  color: var(--text-light);
}

.modal-content .btn-close {
  box-shadow: none;
}

.ui-dialog-titlebar-close {
  border: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414'/%3e%3c/svg%3e");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 15px;
  opacity: 0.5;
  background-color: transparent;
  transition: var(--transition);
  box-shadow: none;
}

.ui-dialog-titlebar-close:hover {
  opacity: 0.75;
}

.modal-content .modal-header {
  border-bottom: none;
  padding-bottom: 0;
}

.modal-content .modal-title {
  font-size: var(--text-26);
}

.modal-content .modal-footer {
  border-top: none;
  padding-top: 0;
  justify-content: flex-start;
}

.modal-content .modal-footer button,
.ui-dialog.ui-widget .webform-actions button {
  font-family: var(--font-mulish);
  font-size: var(--text-16);
  padding: var(--space-17) var(--space-17);
  border: var(--border-btn);
  border-radius: var(--border-radius-6);
  background-color: var(--bg-btn-primary);
  color: var(--text-light);
  transition: var(--transition);
  text-decoration: none;
  font-weight: var(--font-medium);
  box-shadow: var(--box-shadow-btn-primary);
}

.modal-content .modal-footer button:hover,
.ui-dialog.ui-widget .webform-actions button:hover {
  border: var(--border-btn-hover);
  background-color: var(--bg-btn-primary-hover);
  box-shadow: var(--box-shadow-btn-primary-hover);
}

.modal-content .modal-footer button:disabled,
.ui-dialog.ui-widget .webform-actions button:disabled,
.webform-submission-send-request-form .webform-actions button:disabled {
  background-color: var(--bg-btn-primary-hover);
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  display: none;
}

.header .nav-link.is-active {
  text-transform: uppercase;
}

.header .search form > div,
.offcanvas .search form > div {
  display: block;
}

.header .search,
.offcanvas .search {
  position: relative;
  display: flex;
  align-items: center;
  height: 20px;
  flex-shrink: 0;
}

.header .region-search,
.offcanvas .region-search {
  position: absolute;
  right: 25px;
  bottom: 50%;
  transform: translateY(50%);
  width: 0px;
  opacity: 0;
  overflow: hidden;
  transition: all 0.3s ease-in-out;
}

.header #search-api-page-block-form-search .form-item.js-form-type-search,
.offcanvas #search-api-page-block-form-search .form-item.js-form-type-search {
  width: 100%;
  margin: 0;
}

.offcanvas .region-search {
  left: 25px;
}

.header .region-search.active,
.offcanvas .region-search.active {
  width: 250px;
  opacity: 1;
}

.offcanvas .region-search.active {
  width: 300px;
}

.header .js-search-btn,
.offcanvas .js-search-btn {
  position: relative;
  width: var(--icon-size);
  height: var(--icon-size);
}

.header .js-search-btn img,
.offcanvas .js-search-btn img {
  display: block;
}

.search-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 1;
  transition: var(--transition);
}

.search-icon-dark {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: var(--transition);
  z-index: 2;
}

.header .js-search-btn:hover .search-icon,
.offcanvas .js-search-btn:hover .search-icon {
  opacity: 0;
}

.header .js-search-btn:hover .search-icon-dark,
.offcanvas .js-search-btn:hover .search-icon-dark {
  opacity: 1;
}

.header button.search-button,
.offcanvas button.search-button {
  width: 20px;
  height: 20px;
  background-color: transparent;
  border-radius: 100%;
  border: none;
  font-size: 0px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.header .region-search .form-control,
.offcanvas .region-search .form-control {
  border: var(--border-btn);
  border-radius: var(--btn-border-radius);
  height: 35px;
  width: 100%;
  margin: 0;
  padding: 0;
  text-indent: 15px;
  box-shadow: none;
  font-size: var(--text-15);
  font-weight: var(--font-medium);
  background-color: var(--bg-primary);
  color: var(--text-dark);
  border-radius: var(--border-radius-6);
}

.header .region-search .form-control::placeholder,
.offcanvas .region-search .form-control::placeholder {
  color: var(--text-dark);
}

.header .region-search button.search-form__submit,
.offcanvas .region-search button.search-form__submit {
  position: absolute;
  top: 0;
  right: 10px;
  background-color: transparent;
  font-size: 0px;
  background-image: url("../../vesta_theme/image/icon/search.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  padding: 0;
  width: 18px;
  height: 35px;
  border: none !important;
  display: none;
  box-shadow: none;
}

.header .region-search button.search-form__submit:hover,
.offcanvas .region-search button.search-form__submit:hover {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.header .region-search.active button.search-form__submit,
.offcanvas .region-search.active button.search-form__submit {
  display: block;
  filter: brightness(0) saturate(100%) invert(15%) sepia(78%) saturate(0%)
    hue-rotate(239deg) brightness(108%) contrast(98%);
}

.header .js-search-btn img,
.offcanvas .js-search-btn img {
  display: block;
  transition: var(--transition);
  height: var(--icon-size);
  width: var(--icon-size);
}

.header .js-search-btn,
.offcanvas .js-search-btn {
  display: block;
  transition: var(--transition);
}

.header .js-search-btn:hover,
.offcanvas .js-search-btn:hover {
  display: block;
  transition: var(--transition);
}

.header .js-search-btn span.search-x,
.offcanvas .js-search-btn span.search-x {
  display: none;
}

.header .js-search-btn.active span.search-x,
.offcanvas .js-search-btn.active span.search-x {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  line-height: 100%;
  color: var(--text-light);
  width: 18px;
  height: 13px;
  transition: var(--transition);
}

.header .js-search-btn.active:hover span.search-x,
.offcanvas .js-search-btn.active:hover span.search-x {
  color: var(--text-accent-lighter);
}

.header .js-search-btn.active img,
.offcanvas .js-search-btn.active img {
  display: none;
}

.messengers {
  gap: var(--space-10);
}

.messenger {
  width: var(--messenger-size);
  height: var(--messenger-size);
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--bg-btn-primary);
  border-radius: 100%;
  transition: var(--transition);
}

.messenger:hover {
  background-color: var(--bg-btn-primary-hover);
  box-shadow: var(--box-shadow-btn-primary-hover);
}

.messengers-aside {
  gap: var(--space-13);
  position: fixed;
  right: var(--space-41);
  bottom: 225px;
  z-index: 10;
}

.messengers-aside .messenger {
  width: var(--messenger-aside-size);
  height: var(--messenger-aside-size);
}

.messengers-aside .messenger img {
  width: var(--messenger-aside-icon-size);
  height: var(--messenger-aside-icon-size);
}

.contact,
.contact a {
  gap: 4px;
  color: var(--text-light);
  font-size: var(--text-16);
  font-weight: var(--font-medium);
}

.contact img,
.messenger img {
  height: var(--icon-size);
  width: var(--icon-size);
}

.header {
  background-color: transparent;
  z-index: 10;
}

.not-front .header {
  background-color: var(--bg-sf);
}

.header-inner {
  gap: var(--space-20);
}

.col-logo {
  flex-shrink: 0;
}

.col-header-content {
  width: 100%;
}

.header-top {
  height: 97px;
  gap: var(--space-15);
}

.header .contacts {
  column-gap: var(--space-13);
  margin-top: 8px;
  align-items: flex-start;
}

.header .contact {
  gap: var(--space-3);
}

.contacts .phone-work-time img,
.contacts .address img {
  margin-top: 7px;
}

.header .contacts .address div {
  max-width: 175px;
}

.header .contacts .phone-work-time a {
  font-size: var(--text-16);
  text-wrap: nowrap;
}

.offcanvas .contacts .phone-work-time a {
  font-size: var(--text-20);
}

.contacts .phone-work-time div {
  font-size: var(--text-13);
}

.contacts .work-time,
.offcanvas .contacts .work-time {
  margin-left: calc(var(--icon-size) + 4px);
}

.header hr {
  color: #ffffff30;
  margin: 0;
}

.header-bottom {
  background-color: transparent;
  gap: var(--space-93);
}

.header-bottom .navigation {
  width: 100%;
}

.header .nav {
  display: flex;
  justify-content: space-between;
  margin-block: var(--space-29) var(--space-20);
}

.header-mob {
  background-color: var(--bg-sf);
}

.header-mob .contacts {
  grid-template-columns: repeat(2, max-content);
  gap: var(--space-8);
}

.header-mob .contacts .phone-work-time {
  grid-column: 1 / -1;
}

.header-mob .contacts .phone-work-time-inner {
  gap: 4px;
}

.header-mob .col-nav-messengers {
  gap: var(--space-10);
}

.offcanvas {
  --bs-offcanvas-bg: var(--bg-sf);
}

.offcanvas .offcanvas-header {
  align-items: start;
}

.offcanvas .offcanvas-body {
  display: flex;
  flex-direction: column;
  gap: var(--space-20);
}

.offcanvas .nav {
  gap: var(--space-10);
}

.offcanvas .contacts {
  gap: var(--space-14);
}

.offcanvas .contacts .phones {
  gap: var(--space-14);
}

.hero-block {
  position: relative;
  margin-block: calc(var(--header-height) * -1) var(--space-65);
}

.hero-block .group-content {
  position: relative;
  padding-block: var(--space-238) var(--space-104);
  z-index: 5;
  color: var(--text-light);
  gap: var(--space-41);
}

.hero-block .field--name-field-hero-image {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.hero-block .field--name-field-hero-image * {
  height: 100% !important;
}

.hero-block .field--name-field-hero-image img {
  width: 100%;
  object-fit: cover;
}

.hero-block .field--name-field-hero-image::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, #1b1f22, #1b1f2200);
  z-index: 1;
}

.hero-block .field--name-field-hero-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, #2a2c31 55%, #2a2c3100);
  z-index: 2;
}

.hero-block .field--name-field-hero-text {
  margin-bottom: calc(var(--space-56) - var(--space-41));
}

.hero-block .field--name-field-hero-text * {
  font-size: var(--text-20);
  font-weight: var(--font-medium);
  max-width: 890px;
}

.hero-block .group-buttons {
  margin-bottom: calc(var(--space-69) - var(--space-41));
  gap: var(--space-20);
}

.hero-block .field--name-field-hero-form-link a {
  padding-inline: var(--space-33);
}

.hero-block .field--name-field-hero-photogallery-link a {
  padding-inline: var(--space-30);
}

.hero-block .field--name-field-hero-advantages {
  display: grid;
  grid-template-columns: repeat(4, max-content);
  column-gap: var(--space-46);
  row-gap: var(--space-20);
}

.hero-block .paragraph--type--advantage-short {
  display: flex;
  align-items: center;
  gap: var(--space-10);
}

.hero-block
  .paragraph--type--advantage-short
  .field--name-field-advantage-short-icon {
  min-width: unset;
  flex-shrink: 0;
}

.hero-block
  .paragraph--type--advantage-short
  .field--name-field-advantage-short-icon
  img {
  height: var(--advantage-short-icon-size);
  width: var(--advantage-short-icon-size);
}

.hero-block
  .paragraph--type--advantage-short
  .field--name-field-advantage-short-title {
  font-size: var(--text-20);
  font-weight: var(--font-medium);
  word-break: break-word;
  hyphens: auto;
}

.about-block {
  margin-block: var(--space-65) var(--space-100);
}

.block-content--type-about .group-content {
  gap: var(--space-37);
}

.block-content--type-about .group-col-text {
  gap: var(--space-37);
  max-width: 331px;
}

.block-content--type-about .field--name-field-about-text-on-front {
  font-size: var(--text-16);
  font-weight: var(--font-medium);
}

.block-content--type-about .field--name-field-about-page-link a {
  color: var(--text-accent);
  padding-inline: var(--space-38);
}

.block-content--type-about .field--name-field-about-image-on-front img {
  max-width: 370px;
  max-height: 325px;
  object-fit: cover;
  z-index: 1;
}

.block-content--type-about .field--name-field-about-stats {
  display: grid;
  grid-template-columns: max-content min-content max-content;
  justify-items: center;
}

.block-content--type-about .field--name-field-about-stats::before {
  content: "";
  width: 100%;
  height: 0.3px;
  background-color: white;
  grid-column: 1/-1;
  grid-row: 2;
  margin-block: var(--space-14);
  filter: blur(6px);
}

.block-content--type-about .field--name-field-about-stats::after {
  content: "";
  width: 0.3px;
  height: 100%;
  background-color: white;
  grid-column: 2;
  grid-row: 1 / span 3;
  margin-inline: var(--space-41);
  filter: blur(6px);
}

.paragraph--type--stat .group-content {
  gap: var(--space-8);
}

.paragraph--type--stat .field--name-field-stat-number {
  font-size: var(--text-64);
  font-weight: bold;
  color: var(--text-accent);
}

.paragraph--type--stat .field--name-field-stat-number-suffix {
  font-size: var(--text-40);
  font-weight: bold;
  color: var(--text-accent);
  line-height: 170%;
}

.paragraph--type--stat .field--name-field-stat-title {
  font-size: var(--text-16);
  font-weight: var(--font-semibold);
}

.block-content--type-about.block-content--view-mode-full
  .field--name-field-about-page-content {
  margin-top: var(--space-30);
}

.services-block {
  margin-block: var(--space-100);
}

.services-block .view-header {
  margin-bottom: var(--space-33);
}

.view-services .view-content {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-30);
}

.services-block .more-link {
  margin-top: var(--space-50);
}

.services-block .more-link a {
  max-width: fit-content;
  color: var(--text-dark);
  margin-inline: auto;
  padding-inline: var(--space-46);
}

.node--type-service.node--view-mode-teaser {
  height: 100%;
  background-color: var(--bg-sf);
  padding: var(--space-14) var(--space-20) var(--space-38) var(--space-26);
  color: var(--text-light);
  transition: var(--transition);
}

.node--type-service.node--view-mode-teaser:hover {
  box-shadow: var(--box-shadow-btn-primary-hover);
}

.node--type-service.node--view-mode-teaser .group-content {
  height: 100%;
}

.node--type-service.node--view-mode-teaser .field--name-field-service-icon {
  min-width: unset;
}

.node--type-service.node--view-mode-teaser .field--name-field-service-icon img {
  width: var(--service-icon-size);
  height: var(--service-icon-size);
}

.node--type-service.node--view-mode-teaser
  .field--name-field-service-overtitle {
  font-size: var(--text-20);
  font-weight: var(--font-semibold);
}

.node--type-service.node--view-mode-teaser .field--name-node-title {
  margin-bottom: var(--space-14);
  text-align: center;
}

.node--type-service.node--view-mode-teaser .field--name-node-title h4 {
  margin-bottom: 0;
}

.node--type-service.node--view-mode-teaser .field--name-node-title a {
  font-size: var(--text-26);
  font-weight: bold;
  color: var(--text-light);
}

.node--type-service.node--view-mode-teaser .field--name-node-title a:hover {
  color: var(--text-accent-lighter);
}

.node--type-service.node--view-mode-teaser .field--name-field-service-price {
  font-size: var(--text-20);
  font-weight: bold;
  margin-bottom: var(--space-21);
  text-align: center;
}

.node--type-service.node--view-mode-teaser .field--name-field-service-for-whom {
  margin-bottom: var(--space-13);
}

.node--type-service.node--view-mode-teaser
  .field--name-field-service-description {
  margin-bottom: var(--space-13);
}

.node--type-service.node--view-mode-teaser
  .field--name-field-service-timeframe {
  margin-bottom: var(--space-21);
}

.node--type-service.node--view-mode-teaser
  .field--name-field-service-for-whom
  .field__label,
.field--name-field-service-description .field__label,
.field--name-field-service-timeframe .field__label {
  font-size: var(--text-16);
  font-weight: bold;
  margin-bottom: var(--space-3);
}

.node--type-service.node--view-mode-teaser
  .field--name-field-service-for-whom
  .field__item,
.field--name-field-service-description .field__item,
.field--name-field-service-timeframe .field__item {
  font-size: var(--text-16);
  font-weight: var(--font-medium);
}

.field--name-field-service-description .field__item ul li::before {
  background-color: var(--text-light);
}

.node--type-service.node--view-mode-teaser
  .field--name-field-service-form-link {
  width: 100%;
  margin-top: auto;
}

.node--type-service.node--view-mode-full .field--name-field-service-photos {
  max-width: 50%;
}

.node--type-service.node--view-mode-full .field--name-field-service-photos img {
  width: 100%;
  height: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
}

.node--type-service.node--view-mode-full li button {
  background-color: var(--bg-sf);
}

.node--type-service.node--view-mode-full li.slick-active button {
  background-color: var(--text-accent);
}

.node--type-service.node--view-mode-full .group-content {
  gap: var(--space-41);
}

.node--type-service.node--view-mode-full h1 {
  margin-bottom: var(--space-26);
  gap: var(--space-8);
}

.node--type-service.node--view-mode-full .field--name-field-service-price {
  display: flex;
  gap: var(--space-3);
  font-size: var(--text-20);
  font-weight: var(--font-semibold);
}

.node--type-service.node--view-mode-full
  .field--name-field-service-price
  .field__item {
  color: var(--text-accent);
  font-weight: bold;
}

.node--type-service.node--view-mode-full
  .field--name-field-service-file-download {
  margin-top: var(--space-26);
  max-width: fit-content;
}

.node--type-service.node--view-mode-full
  .field--name-field-service-page-content {
  margin-top: var(--space-41);
}

.photogallery-block {
  margin-block: var(--space-100);
}

.photogallery-block .block-block-contentfb6c1dc5-9293-4c22-8276-f64d2ba5b290 {
  margin-bottom: calc(var(--space-50) - var(--space-30));
}

.region-photogallery {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-30);
}

.view-id-photogallery .view-content {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 1fr;
  gap: var(--space-30);
  color: var(--text-light);
}

.view-id-photogallery .views-row {
  background-color: var(--bg-sf);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

.view-id-photogallery .views-field-field-photogallery-photos {
  grid-column: 1/-1;
}

.view-id-photogallery .views-field-field-photogallery-photos img {
  max-height: 216px;
  aspect-ratio: 360 / 216;
  width: 100%;
  object-fit: cover;
}

.view-id-photogallery .views-field-title {
  margin-top: var(--space-13);
  margin-inline: var(--space-20);
  grid-column: 1/-1;
}

.view-id-photogallery .views-field-title a {
  display: inline-block;
  color: var(--text-light);
  font-size: var(--text-18);
  font-weight: bold;
  line-height: 1.1;
}

.view-id-photogallery .views-field-title a:hover {
  color: var(--text-light);
}

.view-id-photogallery .views-field-field-photogallery-renovation-pa {
  margin-top: var(--space-11);
  margin-inline: var(--space-20);
  grid-column: 1/-1;
}

.view-id-photogallery
  .views-field-field-photogallery-renovation-pa
  .group-content,
.view-id-photogallery
  .views-field-field-photogallery-renovation-pa
  .field--name-field-renovation-parameters-area,
.node--type-photogallery .paragraph--type--renovation-parameters .group-content,
.node--type-photogallery
  .paragraph--type--renovation-parameters
  .field--name-field-renovation-parameters-area {
  gap: var(--space-10);
  font-size: var(--text-14);
  font-weight: var(--font-medium);
  align-items: center;
}

.view-id-photogallery
  .views-field-field-photogallery-renovation-pa
  .field--name-field-renovation-parameters-area:not(:last-child),
.view-id-photogallery
  .views-field-field-photogallery-renovation-pa
  .field--name-field-renovation-parameters-room:not(:last-child) {
  padding-right: var(--space-10);
  border-right: 1px solid white;
}

.view-id-photogallery .views-field-field-photogallery-price {
  font-size: var(--text-20);
  font-weight: var(--font-semibold);
  margin: var(--space-11) 0 var(--space-13) var(--space-20);
  line-height: 20px;
}

.view-id-photogallery
  .views-field-field-photogallery-renovation-pa
  .field--name-field-renovation-parameters-serv {
  display: none;
}

.view-id-photogallery .views-field-view-node {
  margin: var(--space-11) var(--space-20) var(--space-13) 0;
  text-align: end;
}

.view-id-photogallery .views-field-view-node a {
  font-size: var(--text-16);
  font-weight: var(--font-medium);
  color: var(--text-light);
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 5px;
}

.view-id-photogallery .views-field-view-node a:after {
  content: "";
  width: 24px;
  height: 20px;
  background-image: url("../../vesta_theme/image/icon/arrow-right-white.svg");
  background-repeat: no-repeat;
  transition: var(--transition);
  background-size: contain;
}

.photogallery-block .more-link {
  max-width: fit-content;
  margin-inline: auto;
}

.photogallery-block .more-link a {
  color: var(--text-dark);
  padding-inline: var(--space-37);
}

.node--type-photogallery .field--name-field-photogallery-price {
  display: flex;
  gap: var(--space-8);
  font-size: var(--text-20);
  font-weight: var(--font-semibold);
}

.node--type-photogallery .field--name-field-photogallery-price .field__item {
  color: var(--text-accent);
  font-weight: bold;
}

.node--type-photogallery
  .paragraph--type--renovation-parameters
  .field--name-field-renovation-parameters-area:not(:last-child),
.node--type-photogallery
  .paragraph--type--renovation-parameters
  .field--name-field-renovation-parameters-room:not(:last-child),
.node--type-photogallery
  .paragraph--type--renovation-parameters
  .field--name-field-renovation-parameters-leng:not(:last-child) {
  padding-right: var(--space-10);
  border-right: 1px solid var(--text-dark);
}

.node--type-photogallery .field--name-field-photogallery-photos {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-30);
  margin-top: var(--space-30);
}

.node--type-photogallery .field--name-field-photogallery-photos img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  aspect-ratio: 16 / 11;
}

.advantages-block {
  margin-block: var(--space-100);
}

.advantages-block .block-title {
  margin-bottom: var(--space-86);
}

.advantages-block .field--name-field-advantages-advantages {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  row-gap: var(--space-62);
  column-gap: var(--space-175);
}

.paragraph--type--advantage .group-content {
  grid-template-columns: min-content 1fr;
  column-gap: var(--space-17);
  row-gap: var(--space-10);
  align-items: center;
}

.paragraph--type--advantage .group-content::before {
  content: "";
  width: var(--advantage-icon-size);
  height: var(--advantage-icon-size);
  background-image: url("../../vesta_theme/image/icon/circle-check.svg");
  background-position: center;
  background-size: contain;
}

.field--name-field-advantage-title {
  font-size: var(--text-20);
  font-weight: var(--font-medium);
}

.paragraph--type--advantage .field--name-field-advantage-description {
  grid-column: 2;
}

.paragraph--type--advantage .field--name-field-advantage-description * {
  font-size: var(--text-14);
  font-weight: var(--font-medium);
}

.work-steps-block {
  margin-block: var(--space-100);
}

.work-steps-block .block-title {
  margin-bottom: var(--space-32);
  max-width: 984px;
}

.view-work-steps .field--name-field-work-steps-text-on-front {
  font-size: var(--text-24);
  font-weight: var(--font-medium);
  margin-bottom: var(--space-58);
}

.view-work-steps .field--name-field-work-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-54);
}

.view-work-steps .group-number-arrow {
  margin-bottom: var(--space-17);
}

.view-work-steps .field__item:not(:last-of-type) .group-number-arrow:after {
  margin-left: var(--space-48);
  content: "";
  background-image: url("../../vesta_theme/image/icon/arrow-right.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: right;
  height: var(--work-step-arrow-height);
  width: 100%;
}

.view-work-steps .field--name-field-work-step-number {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column-reverse;
  width: 66px;
  height: 66px;
  background-color: var(--text-accent);
  color: var(--text-light);
  border-radius: 100%;
  flex-shrink: 0;
}

.view-work-steps .field--name-field-work-step-number .field__item {
  font-size: var(--text-36);
  font-weight: var(--font-semibold);
  line-height: 80%;
}

.view-work-steps .field--name-field-work-step-number .field__label {
  font-size: var(--text-14);
  font-weight: var(--font-semibold);
}

.view-work-steps .field--name-field-work-step-description {
  font-size: var(--text-16);
  font-weight: bold;
  color: var(--text-accent);
  margin-bottom: var(--space-17);
  max-width: 344px;
}

.view-work-steps .field--name-field-work-step-content {
  max-width: 303px;
}

.view-work-steps .field--name-field-work-step-content .field__label {
  font-size: var(--text-16);
  font-weight: bold;
  margin-bottom: var(--space-3);
}

.view-work-steps .field--name-field-work-step-content .field__item {
  font-size: var(--text-13);
  font-weight: var(--font-medium);
}

.view-work-steps .field--name-field-work-step-content .field__item p {
  margin-left: calc(5px + var(--space-10));
}

.view-work-steps .field--name-field-work-steps-page-content {
  margin-top: var(--space-41);
}

.send-request-form-block {
  background-color: var(--bg-sf);
  padding: var(--space-39) var(--space-39) var(--space-54) var(--space-39);
  margin-block: var(--space-100);
  position: relative;
}

.region-send-request-form {
  max-width: 484px;
}

.send-request-form-block:before {
  content: "";
  position: absolute;
  right: var(--space-54);
  top: var(--space-22);
  width: 100%;
  height: 100%;
  max-width: 811px;
  max-height: 573px;
  background-image: url("../../vesta_theme/image/bg-form.png");
  background-size: contain;
  background-repeat: no-repeat;
  pointer-events: none;
}

.send-request-form-block:after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  height: 100%;
  max-height: 587px;
  background-image: url("../../vesta_theme/image/bg-form-2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right;
  pointer-events: none;
}

.block-block-content8d532e9b-0186-4c53-ae9f-457f70c4aef2 {
  position: relative;
  margin-bottom: var(--space-24);
  color: var(--text-light);
  z-index: 1;
}

.block-block-contenteca19f07-da21-45b7-aa01-110696560336 {
  position: relative;
  font-size: var(--text-16);
  font-weight: var(--font-medium);
  margin-bottom: var(--space-42);
  color: var(--text-light);
  z-index: 1;
}

.send-request-form-block button {
  width: 100%;
}

.contacts-map {
  gap: var(--space-77);
}

.contacts-map .contacts-block {
  flex-shrink: 0;
}

.contacts-map .contacts-block .block-title {
  margin-bottom: var(--space-48);
}

.view-contacts {
  display: flex;
  flex-direction: column;
  gap: var(--space-19);
}

.view-contacts .contact,
.view-contacts .contact a {
  color: var(--text-dark);
}

.view-contacts .contact a:hover {
  color: var(--text-accent-lighter);
}

.view-contacts .contact.phone a {
  font-size: var(--text-20);
}

.view-contacts .contact.phone img {
  margin-top: 7px;
}

.view-contacts.view-display-id-page_contacts {
  margin-bottom: var(--space-30);
}

.map-block {
  width: 100%;
}

.footer {
  margin-top: var(--space-100);
}

.footer .col-logo {
  gap: var(--space-15);
}

.footer .col-logo .logo {
  margin-bottom: calc(var(--space-18) - var(--space-15));
}

.footer .col-logo .slogan {
  font-size: var(--text-14);
  font-weight: var(--font-medium);
  max-width: 184px;
  margin-bottom: calc(var(--space-22) - var(--space-15));
}

.footer .col-logo .copyright {
  font-size: var(--text-14);
  font-weight: var(--font-medium);
}

.footer .col-logo a.privacy {
  font-size: var(--text-14);
  font-weight: var(--font-medium);
  text-decoration: underline;
}

.footer .col-title {
  font-size: var(--text-20);
  font-weight: var(--font-medium);
  margin-bottom: var(--space-26);
}

.footer .nav {
  flex-direction: column;
  gap: var(--space-14);
}

.footer .nav a {
  font-size: var(--text-14);
  color: var(--text-dark);
  transition: var(--transition);
}

.footer .contacts {
  gap: var(--space-14);
  margin-bottom: var(--space-24);
}

.footer .contact,
.footer .contact a {
  font-size: var(--text-14);
  font-weight: var(--font-medium);
  color: var(--text-dark);
  gap: var(--space-8);
}

.footer .contact a:hover {
  color: var(--text-accent-lighter);
}

.footer .contacts .address {
  margin-bottom: 4px;
  max-width: 193px;
}

.footer .messengers {
  margin-bottom: var(--space-24);
}

.footer hr {
  margin-block: var(--space-42) var(--space-26);
  color: #2a2c3150;
}

.footer .col-webvesta {
  margin-bottom: var(--space-41);
}

.footer .col-webvesta a {
  font-size: var(--text-14);
  font-weight: var(--font-medium);
}

div#vpa-short-wrapper {
  background-color: var(--bg-sf);
  gap: var(--space-38);
  padding: var(--space-26) var(--space-15) var(--space-22) var(--space-17);
  border-radius: 0;
  border: 1px solid #66666650;
}

.vpa-content * {
  font-family: var(--font-mulish);
  font-weight: var(--font-medium);
  font-size: var(--text-13);
  color: var(--text-light) !important;
}

.vpa-content a {
  color: var(--text-light);
  text-decoration: none;
}

.vpa-content a:hover {
  color: var(--text-accent-lighter) !important;
}

@media (min-width: 1400px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: calc(1.5rem + 1170px);
  }
}

@media screen and (max-width: 1400px) {
  #scrollToTop,
  .messengers-aside {
    right: var(--space-30);
  }

  .messengers-aside {
    bottom: 210px;
  }

  .header .contact,
  .header .contact a,
  .header .contacts .phone-work-time a {
    font-size: var(--text-15);
  }

  .contacts .phone-work-time img,
  .contacts .address img {
    margin-top: 2px;
  }
}

@media screen and (max-width: 1200px) {
  :root {
    --text-16: 15px;
    --text-18: 17px;
    --text-20: 18px;
    --text-24: 22px;
    --text-26: 24px;
    --text-36: 32px;
    --text-40: 35px;
    --text-55: 48px;
    --text-64: 56px;

    --space-20: 18px;
    --space-21: 19px;
    --space-22: 20px;
    --space-24: 21px;
    --space-26: 23px;
    --space-29: 25px;
    --space-30: 26px;
    --space-32: 28px;
    --space-33: 29px;
    --space-37: 33px;
    --space-38: 34px;
    --space-39: 35px;
    --space-41: 30px;
    --space-42: 37px;
    --space-46: 40px;
    --space-48: 42px;
    --space-50: 44px;
    --space-54: 47px;
    --space-56: 49px;
    --space-58: 51px;
    --space-62: 55px;
    --space-65: 58px;
    --space-69: 58px;
    --space-77: 68px;
    --space-78: 69px;
    --space-86: 76px;
    --space-93: 82px;
    --space-100: 78px;
    --space-104: 85px;
    --space-114: 101px;
    --space-175: 90px;
    --space-238: 190px;

    --advantage-short-icon-size: 55px;
    --header-height: 164px;
    --service-icon-size: 95px;
    --advantage-icon-size: 40px;
    --messenger-aside-size: 45px;
    --scroll-to-top-size: 45px;
  }

  #scrollToTop,
  .messengers-aside {
    right: var(--space-22);
  }

  #scrollToTop {
    bottom: var(--space-86);
  }

  .messengers-aside {
    bottom: 190px;
  }

  .header .contacts {
    grid-template-columns: repeat(2, max-content);
    margin-top: 0;
    row-gap: var(--space-3);
  }

  .header .contact,
  .header .contact a,
  .header .contacts .phone-work-time a {
    font-size: var(--text-14);
  }

  .header .contacts .address div {
    max-width: unset;
  }

  .header .contacts .phone-work-time {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .header .contacts .phone-work-time-inner {
    display: flex;
    gap: 10px;
    align-items: start;
  }

  .contacts .work-time {
    margin-left: 0;
  }

  .hero-block .field--name-field-hero-advantages {
    column-gap: var(--space-20);
  }

  .block-content--type-about .field--name-field-about-stats::after {
    margin-inline: var(--space-20);
  }

  .block-content--type-about .field--name-field-about-image-on-front img {
    max-width: 350px;
  }

  .node--type-service.node--view-mode-teaser .field--name-node-title a {
    font-size: var(--text-20);
  }

  .node--type-service.node--view-mode-teaser .field--name-field-service-price {
    font-size: var(--text-16);
  }

  .view-id-photogallery .views-field-view-node a:after {
    width: 20px;
    height: 20px;
  }

  .node--type-photogallery .field--name-field-photogallery-photos {
    grid-template-columns: repeat(3, 1fr);
  }

  .view-work-steps .field--name-field-work-step-number {
    width: var(--advantage-short-icon-size);
    height: var(--advantage-short-icon-size);
  }

  .view-work-steps .field--name-field-work-step-number .field__item {
    font-size: var(--text-26);
  }

  .contacts-map {
    gap: var(--space-42);
  }

  .mapContainer {
    max-height: 360px;
  }
}

@media screen and (max-width: 992px) {
  :root {
    --text-13: 12px;
    --text-14: 13px;
    --text-15: 14px;
    --text-16: 15px;
    --text-18: 16px;
    --text-20: 17px;
    --text-24: 20px;
    --text-26: 22px;
    --text-36: 29px;
    --text-40: 32px;
    --text-55: 43px;
    --text-64: 50px;

    --space-10: 9px;
    --space-11: 10px;
    --space-13: 12px;
    --space-14: 13px;
    --space-15: 14px;
    --space-17: 15px;
    --space-18: 16px;
    --space-19: 17px;
    --space-20: 17px;
    --space-21: 18px;
    --space-22: 19px;
    --space-24: 20px;
    --space-26: 21px;
    --space-29: 23px;
    --space-30: 24px;
    --space-32: 26px;
    --space-33: 27px;
    --space-37: 30px;
    --space-38: 31px;
    --space-39: 32px;
    --space-41: 26px;
    --space-42: 34px;
    --space-46: 37px;
    --space-48: 38px;
    --space-50: 40px;
    --space-54: 43px;
    --space-56: 45px;
    --space-58: 46px;
    --space-62: 50px;
    --space-65: 52px;
    --space-69: 50px;
    --space-77: 62px;
    --space-78: 63px;
    --space-86: 60px;
    --space-93: 74px;
    --space-100: 70px;
    --space-104: 75px;
    --space-114: 91px;
    --space-175: 100px;
    --space-238: 130px;

    --form-control-height: 50px;
    --checkbox-size: 17px;
    --header-height: 78px;
    --advantage-icon-size: 38px;
    --messenger-aside-size: 40px;
    --scroll-to-top-size: 40px;
    --messenger-aside-icon-size: 22px;
  }

  #scrollToTop {
    bottom: calc(var(--space-58) + 88px);
  }

  .messengers-aside {
    bottom: calc(
      var(--space-58) + var(--space-13) + var(--scroll-to-top-size) + 88px
    );
  }

  .header-mob .contact,
  .header-mob .contact a,
  .header-mob .contacts .phone-work-time a {
    font-size: var(--text-14);
  }

  .header-mob .contacts .phone-work-time {
    grid-row: 2;
  }

  .hero-block .field--name-field-hero-advantages {
    grid-template-columns: repeat(2, 1fr);
  }

  .block-content--type-about > .group-content {
    flex-wrap: wrap;
  }

  .block-content--type-about .group-col-text,
  .block-content--type-about .field--name-field-about-image-on-front {
    width: calc(50% - (var(--space-37) / 2));
    flex-shrink: 0;
  }

  .block-content--type-about .field--name-field-about-image-on-front img {
    max-width: 100%;
  }

  .block-content--type-about .field--name-field-about-stats {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    width: 100%;
  }

  .view-services .view-content {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-26);
  }

  .node--type-service.node--view-mode-teaser .group-description {
    max-height: 450px;
    overflow: scroll;
  }

  .region-photogallery {
    grid-template-columns: repeat(2, 1fr);
  }

  .view-id-photogallery .view-content {
    grid-template-columns: 1fr;
  }

  .view-id-photogallery.view-display-id-page_photogallery .view-content {
    grid-template-columns: repeat(2, 1fr);
  }

  .photogallery-block .block-block-contentfb6c1dc5-9293-4c22-8276-f64d2ba5b290,
  .photogallery-block .block-block-content07a237c0-f02b-435c-9546-7487d7b2c5e8 {
    grid-column: 1/-1;
  }

  .node--type-photogallery .field--name-field-photogallery-photos {
    grid-template-columns: repeat(2, 1fr);
  }

  .advantages-block .field--name-field-advantages-advantages {
    grid-template-columns: repeat(2, 1fr);
    row-gap: var(--space-32);
    column-gap: var(--space-41);
  }

  .view-work-steps .field--name-field-work-steps {
    gap: var(--space-30);
  }

  .webform-submission-send-request-form {
    gap: var(--space-24);
  }

  .send-request-form-block:after {
    filter: brightness(0.3);
  }

  .send-request-form-block:before {
    right: 0;
  }

  .modal-content .js-form-type-checkbox,
  .ui-dialog.ui-widget .js-form-type-checkbox,
  .webform-submission-send-request-form .js-form-type-checkbox {
    column-gap: 6px;
  }

  .contacts-map {
    gap: var(--space-30);
  }

  .mapContainer {
    max-height: 300px;
  }

  .footer-top {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-30);
  }

  .footer .logo {
    max-width: 150px;
  }

  .footer .col-contacts-callback {
    grid-column: 2;
    grid-row: 1;
  }

  .footer .messengers,
  .footer .callback {
    margin-top: auto;
  }
}

@media screen and (max-width: 768px) {
  :root {
    --text-14: 12px;
    --text-15: 13px;
    --text-16: 14px;
    --text-18: 15px;
    --text-20: 16px;
    --text-24: 18px;
    --text-26: 20px;
    --text-36: 26px;
    --text-40: 28px;
    --text-55: 36px;
    --text-64: 45px;

    --space-8: 7px;
    --space-10: 8px;
    --space-11: 9px;
    --space-13: 10px;
    --space-14: 11px;
    --space-15: 12px;
    --space-17: 13px;
    --space-18: 14px;
    --space-19: 15px;
    --space-20: 15px;
    --space-21: 16px;
    --space-22: 17px;
    --space-24: 18px;
    --space-26: 19px;
    --space-29: 21px;
    --space-30: 22px;
    --space-32: 23px;
    --space-33: 24px;
    --space-37: 26px;
    --space-38: 27px;
    --space-39: 28px;
    --space-41: 22px;
    --space-42: 30px;
    --space-46: 32px;
    --space-48: 34px;
    --space-50: 35px;
    --space-54: 38px;
    --space-56: 39px;
    --space-58: 41px;
    --space-62: 43px;
    --space-65: 46px;
    --space-69: 42px;
    --space-77: 54px;
    --space-78: 55px;
    --space-86: 50px;
    --space-93: 65px;
    --space-100: 55px;
    --space-104: 60px;
    --space-114: 80px;
    --space-175: 70px;
    --space-238: 110px;

    --form-control-height: 46px;
    --messenger-size: 27px;
    --icon-size: 16px;
    --advantage-short-icon-size: 50px;
    --header-height: 75px;
    --service-icon-size: 85px;
    --work-step-arrow-height: 13px;
    --advantage-icon-size: 35px;
    --messenger-aside-size: 36px;
    --scroll-to-top-size: 36px;
    --messenger-aside-icon-size: 20px;
  }

  main .text-formatted ul li {
    gap: var(--space-3);
  }

  .block-content--type-about > .group-content {
    gap: var(--space-14);
  }

  .block-content--type-about .field--name-field-about-stats::before {
    margin-block: var(--space-8);
  }

  .block-content--type-about .field--name-field-about-stats::after {
    margin-inline: var(--space-14);
  }

  .view-services .view-content {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-26);
  }

  .node--type-service.node--view-mode-full .field--name-field-service-photos {
    max-width: unset;
  }

  .node--type-service.node--view-mode-full
    .field--name-field-service-photos
    img {
    aspect-ratio: 16/9;
  }

  .node--type-service.node--view-mode-full .group-content {
    gap: var(--space-22);
  }

  .node--type-service.node--view-mode-full
    .field--name-field-service-page-content {
    margin-top: var(--space-22);
  }

  .node--type-service.node--view-mode-teaser .group-description {
    max-height: 300px;
    overflow: scroll;
  }

  .view-id-photogallery .views-field-field-photogallery-price {
    margin: var(--space-11) 0 var(--space-11) var(--space-20);
  }

  .view-id-photogallery .views-field-view-node {
    margin: var(--space-11) var(--space-20) var(--space-11) 0;
  }

  .view-id-photogallery .views-field-view-node a:after {
    width: 18px;
    height: 18px;
  }

  .view-id-photogallery .view-content {
    grid-template-columns: 1fr;
  }

  .advantages-block .field--name-field-advantages-advantages {
    gap: var(--space-13);
  }

  .view-work-steps .field--name-field-work-steps {
    grid-template-columns: repeat(2, 1fr);
  }

  .paragraph--type--stat .field--name-field-stat-number {
    font-size: var(--text-55);
  }

  .footer .logo {
    max-width: 130px;
  }

  #scrollToTop {
    bottom: calc(var(--space-58) + 79px);
  }

  .messengers-aside {
    bottom: calc(
      var(--space-58) + var(--space-13) + var(--scroll-to-top-size) + 79px
    );
  }
}

@media screen and (max-width: 576px) {
  :root {
    --text-15: 12px;
    --text-16: 13px;
    --text-18: 14px;
    --text-20: 15px;
    --text-24: 17px;
    --text-26: 18px;
    --text-36: 24px;
    --text-40: 26px;
    --text-55: 34px;
    --text-64: 40px;

    --space-8: 6px;
    --space-10: 7px;
    --space-11: 8px;
    --space-13: 9px;
    --space-14: 10px;
    --space-15: 11px;
    --space-17: 12px;
    --space-18: 13px;
    --space-19: 14px;
    --space-20: 15px;
    --space-21: 15px;
    --space-22: 16px;
    --space-24: 17px;
    --space-26: 18px;
    --space-29: 20px;
    --space-30: 21px;
    --space-32: 22px;
    --space-33: 23px;
    --space-37: 25px;
    --space-38: 26px;
    --space-39: 27px;
    --space-41: 20px;
    --space-42: 29px;
    --space-46: 31px;
    --space-48: 28px;
    --space-50: 34px;
    --space-54: 37px;
    --space-56: 38px;
    --space-58: 39px;
    --space-62: 42px;
    --space-65: 44px;
    --space-69: 38px;
    --space-77: 52px;
    --space-78: 53px;
    --space-86: 40px;
    --space-93: 63px;
    --space-100: 50px;
    --space-104: 50px;
    --space-114: 77px;
    --space-175: 45px;
    --space-238: 90px;

    --form-control-height: 44px;
    --checkbox-size: 16px;
    --advantage-short-icon-size: 45px;
    --header-height: 74px;
    --service-icon-size: 70px;
    --advantage-icon-size: 28px;
    --messenger-aside-size: 30px;
    --scroll-to-top-size: 30px;
    --messenger-aside-icon-size: 18px;
  }

  #scrollToTop {
    bottom: calc(var(--space-24) + 130px);
  }

  .messengers-aside {
    bottom: calc(
      var(--space-24) + var(--space-13) + var(--scroll-to-top-size) + 130px
    );
  }

  .header-mob .col-logo img {
    max-height: 60px;
  }

  #header-mob > * {
    padding: 0 6px;
  }

  .hero-block .paragraph--type--advantage-short br,
  .hero-block .field--name-field-hero-title br {
    display: none;
  }

  .hero-block .field--name-field-hero-form-link a,
  .hero-block .field--name-field-hero-photogallery-link a {
    padding-inline: var(--space-18);
  }

  .block-content--type-about .group-col-text,
  .block-content--type-about .field--name-field-about-image-on-front {
    width: 100%;
  }

  .block-content--type-about .group-col-text {
    max-width: unset;
  }

  .view-services .view-content {
    gap: var(--space-13);
  }

  .node--type-service.node--view-mode-teaser {
    padding: var(--space-13);
  }

  .node--type-service.node--view-mode-teaser .group-description {
    max-height: 250px;
    overflow: scroll;
  }

  .node--type-service.node--view-mode-full
    .field--name-field-service-photos
    img {
    aspect-ratio: 16/12;
  }

  .region-photogallery,
  .view-id-photogallery.view-display-id-page_photogallery .view-content {
    grid-template-columns: 1fr;
  }

  .node--type-photogallery .field--name-field-photogallery-photos {
    gap: var(--space-14);
  }

  .view-work-steps .field--name-field-work-steps {
    grid-template-columns: 1fr;
  }

  .view-work-steps .field__item:not(:last-of-type) .group-number-arrow:after {
    background-size: contain;
    background-position: left;
  }

  .view-work-steps .field--name-field-work-step-description,
  .view-work-steps .field--name-field-work-step-content {
    max-width: unset;
  }

  .view-contacts .contact.phone img {
    margin-top: 3px;
  }

  .footer-top {
    align-self: center;
    justify-items: start;
  }

  .footer .col-logo {
    grid-column: 1 / -1;
  }

  .footer .col-contacts-callback {
    grid-column: 1/-1;
    grid-row: 2;
  }
}
