/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
  /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type=checkbox],
[type=radio] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type=search] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

.main-svg-sprite {
  display: none;
}

.svg-icon {
  display: inline-block;
  width: 24px;
  height: 24px;
  fill: currentColor;
  font-size: 0;
}
.svg-icon__link {
  vertical-align: top;
  fill: inherit;
  width: inherit;
  height: inherit;
}

@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
* {
  min-width: 0;
  min-height: 0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
*::before, *::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  font-family: sans-serif;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body {
  font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
}

svg:not(:root) {
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
}

blockquote {
  padding: 15px;
  padding-left: 20px;
  border-left: 5px solid #5ca98f;
  background-color: rgba(92, 169, 143, 0.03);
}

img {
  max-width: 100%;
  height: auto;
}

.hidden,
template,
[hidden] {
  display: none !important;
}

.theme-color {
  color: #5ca98f;
}

.visuallyhidden,
.screen-reader-text,
.sr-only {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(50%);
          clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal !important;
  -webkit-overflow-scrolling: touch;
}
.visuallyhidden:active, .visuallyhidden:focus,
.screen-reader-text:active,
.screen-reader-text:focus,
.sr-only:active,
.sr-only:focus {
  background-color: #eee;
  clip: auto !important;
  -webkit-clip-path: none;
          clip-path: none;
  color: #444;
  display: block;
  font-size: 1em;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}

/* .animate-element {
  animation: fadeOut 0.3s ease-in;
  display: none;
}

.animate-element._is-active {
  animation: fadeIn 0.3s ease-in;
  display: block;
} */
.footer {
  flex: none;
  position: relative;
  padding-top: 100px;
  padding-bottom: 50px;
  position: relative;
}
.footer:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100px;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1100 200' preserveAspectRatio='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%235ca98f' d='M0 0H1100V2V3H1094.39L0 198V3V2V0Z'%3E%3C/path%3E%3Cpath fill='%23fff ' d='M5.61225 197H0V198V200H1100V198V197V2L5.61225 197Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 100% 80px;
}
.footer__info {
  width: 100%;
  margin-bottom: 50px;
}
.footer__menu {
  margin-bottom: 50px;
}
.footer__copy {
  font-size: 14px;
  color: #444;
  font-weight: 700;
  line-height: 1.4;
  text-transform: uppercase;
  margin-bottom: 50px;
}
.footer__contact {
  font-size: 18px;
  color: #444;
  font-weight: 400;
  line-height: 1.3;
  margin-bottom: 10px;
  display: flex;
}
.footer__contact a {
  font-size: 18px;
  color: #5ca98f;
  font-weight: 700;
  text-decoration: none;
  align-self: flex-end;
}
.footer__contact a:hover {
  text-decoration: underline;
}
.footer__contact:before {
  content: "";
  flex: 0 0 22px;
  width: 22px;
  max-width: 22px;
  height: 22px;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
  margin-right: 5px;
}
.footer__contact--address:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 -960 960 960' width='24' fill='%23444444'%3E%3Cpath d='M240-200h120v-240h240v240h120v-360L480-740 240-560v360Zm-80 80v-480l320-240 320 240v480H520v-240h-80v240H160Zm320-350Z'/%3E%3C/svg%3E");
}
.footer__contact--phone:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 -960 960 960' width='24' fill='%23444444'%3E%3Cpath d='M798-120q-125 0-247-54.5T329-329Q229-429 174.5-551T120-798q0-18 12-30t30-12h162q14 0 25 9.5t13 22.5l26 140q2 16-1 27t-11 19l-97 98q20 37 47.5 71.5T387-386q31 31 65 57.5t72 48.5l94-94q9-9 23.5-13.5T670-390l138 28q14 4 23 14.5t9 23.5v162q0 18-12 30t-30 12ZM241-600l66-66-17-94h-89q5 41 14 81t26 79Zm358 358q39 17 79.5 27t81.5 13v-88l-94-19-67 67ZM241-600Zm358 358Z'/%3E%3C/svg%3E");
}
.footer__contact--email:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 -960 960 960' width='24' fill='%23444444'%3E%3Cpath d='M160-160q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h640q33 0 56.5 23.5T880-720v480q0 33-23.5 56.5T800-160H160Zm320-280L160-640v400h640v-400L480-440Zm0-80 320-200H160l320 200ZM160-640v-80 480-400Z'/%3E%3C/svg%3E");
}
.footer__nav {
  width: 100%;
  margin-bottom: 50px;
}
.footer__nav h3 {
  font-size: 16px;
  color: #4e4353;
  font-weight: 700;
  line-height: 1.4;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 15px;
}
.footer__nav ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}
.footer__nav ul li {
  margin-bottom: 10px;
}
.footer__nav ul li a {
  font-size: 18px;
  color: #5ca98f;
  font-weight: 400;
  line-height: 1.4;
  text-decoration: none;
}
.footer__nav ul li a:hover {
  text-decoration: underline;
}
.footer__bottom {
  padding: 16px 15px 20px 15px;
  background-color: #242424;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 20px;
}
.footer__bottom a {
  font-size: 12px;
  color: #999;
  font-weight: 400;
  line-height: 1;
}
.footer__bottom a:hover {
  text-decoration: none;
}
.footer__bottom span {
  flex: 0 0 14px;
  width: 14px;
  max-width: 14px;
  height: 14px;
  margin-left: 5px;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='13' height='13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.833 6.5a6.333 6.333 0 11-12.666 0 6.333 6.333 0 0112.666 0zm-7.13 2.08v1.431H7.16v-1.43H5.703zm-.13-3.064H4.207c.006-.335.064-.641.172-.92.108-.279.26-.52.455-.725a2.05 2.05 0 01.706-.478c.276-.115.584-.172.924-.172.44 0 .807.06 1.101.181.294.121.531.271.71.45a1.669 1.669 0 01.502 1.161c0 .298-.038.543-.116.735a1.812 1.812 0 01-.668.84 8.79 8.79 0 00-.395.288 1.846 1.846 0 00-.33.33.947.947 0 00-.181.465v.353H5.833v-.418c.018-.267.07-.49.153-.67.084-.179.181-.332.293-.459.111-.127.229-.237.353-.33.123-.093.238-.186.343-.278.106-.093.19-.196.256-.307a.762.762 0 00.088-.418c0-.285-.07-.495-.209-.632-.14-.136-.333-.204-.58-.204a.899.899 0 00-.432.098.861.861 0 00-.298.26 1.128 1.128 0 00-.172.38 1.892 1.892 0 00-.055.47z' fill='%23fff' opacity='.4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
}

.header {
  flex: none;
}

html,
body {
  margin: 0;
  padding: 0;
}

html {
  min-height: 100%;
  min-height: 100vh;
  min-height: calc(var(--vh, 1vh) * 100);
  scroll-padding-top: 40px;
}

.app {
  display: flex;
  flex-direction: column;
  height: 100%;
  height: 100vh;
  height: calc(var(--vh, 1vh) * 100);
}
.app__wrapper {
  display: flex;
  flex-direction: column;
  height: 100%;
  height: 100vh;
  height: calc(var(--vh, 1vh) * 100);
}
.app__content {
  display: flex;
  flex: 1 0 auto;
  padding-top: 100px;
}
.app__main {
  flex: 1 1;
}

.container {
  max-width: 1170px;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin: 0 auto;
}

.button-default {
  font-size: 16px;
  color: #fff;
  text-align: center;
  font-weight: 500;
  line-height: 1.62;
  text-decoration: none;
  text-transform: uppercase;
  background-color: #5ca98f;
  border: none;
  border-radius: 10px;
  padding: 13px 25px;
  transition: color 0.3s, background-color 0.3s;
  cursor: pointer;
}
.button-default:hover {
  color: #000;
  background-color: #f5d3d0;
}
.button-default--accent {
  background-color: #fe5f55;
}
.button-default--accent:hover {
  color: #fff;
  background-color: rgba(231, 76, 60, 0.7);
}

.about-us {
  padding-top: 20px;
}
.about-us h2 {
  font-size: 28px;
  color: #121212;
  font-weight: 500;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 30px;
}
.about-us h3 {
  font-size: 18px;
  color: #4e4353;
  font-weight: 700;
  line-height: 1.4;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 7px;
}
.about-us p {
  color: #444;
  font-size: 16px;
  font-weight: 400;
  margin-top: 0;
  margin-bottom: 0;
}
.about-us__items {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
}
.about-us__item {
  width: 100%;
  display: flex;
}
.about-us__icon {
  flex: 0 0 48px;
  width: 48px;
  max-width: 48px;
  height: 48px;
  margin-top: 10px;
  margin-right: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.about-us__icon svg {
  width: 100%;
  height: 100%;
  fill: #fe5f55;
}

.choose-tariff {
  padding-top: 30px;
  padding-bottom: 50px;
}
.choose-tariff h2 {
  color: #4e4353;
  font-size: 28px;
  font-weight: 40;
  line-height: 1.4;
  text-align: center;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 20px;
}
.choose-tariff h5 {
  font-size: 22px;
  color: #fe5f55;
  font-weight: 400;
  line-height: 1.2;
  margin-top: 0;
  margin-bottom: 10px;
}
.choose-tariff__items {
  display: flex;
  flex-wrap: wrap;
}
.choose-tariff__item {
  display: flex;
  width: 100%;
  border: 1px solid #f7f7f7;
  padding: 10px;
}
.choose-tariff__item:nth-child(1) .choose-tariff__body {
  background-color: #f7f7f7;
}
.choose-tariff__item:nth-child(2) .choose-tariff__body {
  background-color: #ffec1a;
}
.choose-tariff__item:nth-child(3) .choose-tariff__body {
  background-color: #fff;
  box-shadow: 0 0 10px #999;
}
.choose-tariff__body {
  text-align: center;
  width: 100%;
  padding: 10px 15px 15px 15px;
  display: flex;
  flex-direction: column;
}
.choose-tariff .button-default {
  width: 100%;
}
.choose-tariff .button-default--accent:hover {
  color: #5ca98f;
  background-color: #f5d3d0;
}
.choose-tariff__head {
  border-bottom: 1px solid #ddd;
}
.choose-tariff__head p {
  font-size: 16px;
  color: #444;
  font-weight: 400;
  line-height: 1.5;
}
.choose-tariff__head p span {
  font-weight: 700;
}
.choose-tariff__price {
  padding-top: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #ddd;
}
.choose-tariff__price > strong {
  color: #5ca98f;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.2;
  display: block;
}
.choose-tariff__price span {
  color: #5ca98f;
}
.choose-tariff__price span strong {
  font-weight: 700;
  display: block;
}
.choose-tariff__content {
  text-align: center;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.choose-tariff__content ul {
  list-style: none;
  text-align: left;
  padding-left: 0;
  margin-top: 0;
  margin-bottom: 25px;
}
.choose-tariff__content ul li {
  font-size: 16px;
  color: #444;
  font-weight: 400;
  line-height: 1.3;
  padding-top: 12px;
  padding-bottom: 12px;
}
.choose-tariff__content ul li:first-child {
  border-bottom: 1px solid #ddd;
}
.choose-tariff__content ul li span {
  font-weight: 700;
}

.faq {
  padding-top: 30px;
  padding-bottom: 30px;
}
.faq h2 {
  color: #4e4353;
  font-size: 28px;
  font-weight: 40;
  line-height: 1.4;
  text-align: center;
  margin-top: 0;
  margin-bottom: 20px;
}
.faq h3 {
  font-size: 20px;
  color: #6e6e6e;
  font-weight: 400;
  line-height: 1.4;
  padding: 15px;
  margin-top: 0;
  margin-bottom: 0;
  display: flex;
  justify-content: space-between;
  transition: color 0.3s;
  cursor: pointer;
}
.faq h3:after {
  content: "";
  flex: 0 0 30px;
  width: 30px;
  max-width: 30px;
  height: 30px;
  margin-left: 20px;
  border-radius: 50%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 -960 960 960' width='24' fill='%2383888e'%3E%3Cpath d='M480-345 240-585l56-56 184 184 184-184 56 56-240 240Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 24px 24px;
  background-position: 50% 50%;
  transition: background 0.3s, transform 0.3s;
}
.faq__items {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
.faq__item {
  border: 1px solid #9fa4a8;
  border-radius: 10px;
  transition: box-shadow 0.3s ease-out;
  width: 100%;
  align-self: flex-start;
}
.faq__item._is-active {
  align-self: stretch;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.1);
}
.faq__item._is-active h3 {
  color: #000;
}
.faq__item._is-active h3:after {
  transform: rotate(90deg);
  background-color: #9fa4a8;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' fill='%23fff' viewBox='0 -960 960 960' width='24'%3E%3Cpath d='m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z'/%3E%3C/svg%3E");
  background-size: 20px 20px;
}
.faq__item._is-active .faq__content {
  grid-template-rows: 1fr;
  padding-bottom: 15px;
}
.faq__content {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s;
}
.faq__text {
  overflow: hidden;
  padding-right: 15px;
  padding-left: 15px;
  -webkit-overflow-scrolling: touch;
}
.faq ol {
  margin-top: 0;
  padding-left: 30px;
  margin-bottom: 15px;
}
.faq ol li {
  font-size: 14px;
  color: #6e6e6e;
  line-height: 1.5;
  font-weight: 400;
  margin-bottom: 10px;
}
.faq ol li a {
  color: #e74c3c;
  text-decoration: none;
}
.faq ol li a:hover {
  text-decoration: underline;
}
.faq ol li span {
  font-weight: 700;
}
.faq p {
  font-size: 14px;
  color: #6e6e6e;
  line-height: 1.2;
  font-weight: 400;
  margin-top: 0;
  margin-bottom: 10px;
}
.faq p a {
  color: #e74c3c;
  text-decoration: none;
}
.faq p a:hover {
  text-decoration: underline;
}

.hero {
  padding-bottom: 20px;
}
.hero__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.hero__content, .hero__img {
  width: 100%;
}
.hero__content {
  text-align: center;
}
.hero__content h1 {
  font-size: 30px;
  color: #4e4353;
  font-weight: 400;
  line-height: 1.3;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 35px;
}
.hero__buttons {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}
.hero__buttons .button-default {
  font-size: 11px;
  padding-top: 20px;
  padding-bottom: 20px;
  width: 100%;
}
.hero__buttons .button-default:hover {
  color: #fff;
  background-color: #67bcb5;
}
.hero__img img {
  vertical-align: top;
}

.info-block {
  color: #fff;
  padding-bottom: 30px;
  margin-top: 50px;
  background-color: #5ca98f;
  position: relative;
}
.info-block h2 {
  font-size: 25px;
  font-weight: 700;
  line-height: 1.1;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 10px;
}
.info-block p {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.1;
  margin-top: 0;
  margin-bottom: 14px;
}
.info-block:before {
  content: "";
  position: absolute;
  top: -68px;
  left: 0;
  width: 100%;
  height: 70px;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1100 200' preserveAspectRatio='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='M0 0H1100V2V3H1097.19L550 198L2.80612 3H0V2V0Z'%3E%3C/path%3E%3Cpath fill='%235ca98f' d='M1100 197V198V200H0V198V197V2L547.194 197H552.806L1100 2V197Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
}
.info-block__inner {
  padding-top: 30px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  flex-wrap: wrap;
  gap: 30px;
}
.info-block__inner .button-default {
  text-transform: none;
  width: 100%;
}
.info-block__inner .button-default:hover {
  color: #000;
  background-color: #f5d3d0;
}
.info-block__icon {
  width: 50%;
}
.info-block__icon img {
  vertical-align: top;
}
.info-block__content {
  width: 100%;
}

.logo {
  flex: 0 0 180px;
  width: 180px;
  max-width: 180px;
  margin-right: 14px;
}
.logo__img {
  display: block;
}
.logo__img img {
  vertical-align: top;
}

.main-menu {
  width: 100%;
  order: 1;
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s;
}
.main-menu._is-show {
  grid-template-rows: 1fr;
}
.main-menu__nav {
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
}
.main-menu__nav ul {
  list-style: none;
  padding-top: 20px;
  padding-left: 0;
  margin: 0;
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 10px;
}
.main-menu__nav ul li a {
  font-size: 18px;
  color: #5ca98f;
  line-height: 1;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
  padding-bottom: 0;
  border-bottom: 1px solid #5ca98f;
  transition: color 0.3s, border-bottom-color 0.3s;
}
.main-menu__nav ul li a:hover {
  color: #fe5f55 !important;
  border-bottom-color: transparent !important;
}

.our-advantages {
  padding-top: 50px;
  padding-bottom: 50px;
}
.our-advantages h2 {
  color: #4e4353;
  font-size: 28px;
  font-weight: 40;
  line-height: 1.4;
  text-align: center;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 20px;
}
.our-advantages h3 {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.1;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 20px;
}
.our-advantages ul {
  padding-left: 30px;
}
.our-advantages ul li {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.3;
  margin-bottom: 15px;
}
.our-advantages__items {
  display: flex;
  flex-wrap: wrap;
}
.our-advantages__item {
  color: #fff;
  width: 100%;
  background-color: #5ca98f;
}
.our-advantages__item:nth-child(odd) {
  background-color: #fe5f55;
}
.our-advantages__item:hover .our-advantages__img img {
  transform: scale(1.1);
}
.our-advantages__img {
  height: 200px;
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
}
.our-advantages__img img {
  vertical-align: top;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.5s;
}
.our-advantages__content {
  padding: 20px 15px 15px 15px;
}

.steps {
  padding-top: 25px;
  padding-bottom: 80px;
  position: relative;
}
.steps:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 70px;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 3184 446' preserveAspectRatio='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='M3184 257.647L3158.22 253.329C3028.5 232.456 2886.86 222.357 2733.29 223.032C2642.26 223.431 2551.78 228.592 2461.84 236.149C2426.54 236.549 2391.09 238.004 2355.34 240.275C2221 231.285 2068.99 226.286 1913.49 231.156C1723.42 237.109 1558.37 264.563 1391.63 286.417C1137.84 264.35 920.847 223.032 661.328 223.032C563.229 223.032 473.232 231.394 391.326 248.135L343.441 243.122C217.846 230.497 109.05 223.812 17.0527 223.07L0 223V0H3184V257.647Z'%3E%3C/path%3E%3Cpath fill='%235ca98f' d='M2733.29 223.032C2897.09 222.312 3047.33 233.851 3184 257.647V339.233C3184 338.771 2910.31 259.731 2582.38 239.042C2542.25 236.511 2502.17 235.647 2461.89 236.127C2551.82 228.59 2642.28 223.431 2733.29 223.032ZM1845.32 295.894C1568.49 310.033 1352.52 284.477 1144.23 259.829C986.552 241.17 833.274 223.032 661.328 223.032C559.757 223.032 466.872 231.996 382.674 249.926C452.603 251.103 528.079 254.504 609.102 260.128C675.002 264.702 743.206 270.305 813.746 276.1C1114.33 300.792 1457.33 328.97 1845.32 295.894Z' opacity='0.35'%3E%3C/path%3E%3Cpath fill='%235ca98f' d='M2355 240.297C2220.73 231.276 2068.85 226.29 1913.49 231.156C1759.53 235.978 1621.99 254.907 1486.68 273.529C1400.94 285.329 1316.09 297.005 1228.53 304.892C1472.56 316.132 1739.31 314.555 2029.73 275.756C2143.31 260.583 2250.44 246.954 2355 240.297ZM413.43 250.578C249.63 232.193 111.82 223 0 223V274.754C106.985 254.341 244.795 246.283 413.43 250.578Z' opacity='0.35'%3E%3C/path%3E%3Cpath fill='%235ca98f' d='M0 274.754C145.792 246.937 348.826 242.062 609.102 260.128C999.516 287.227 1470.77 350.429 2029.73 275.756C2226.59 249.458 2404.1 227.795 2582.38 239.042C2910.31 259.731 3184 338.771 3184 339.233V446H0V274.754Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
}
.steps h3 {
  font-size: 20px;
  color: #121212;
  font-weight: 400;
  line-height: 1.2;
  margin-top: 0;
  margin-bottom: 0;
}
.steps p {
  color: #444;
  font-size: 18px;
  font-weight: 400;
  margin-top: 0;
  margin-bottom: 14px;
}
.steps__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
  margin-bottom: 40px;
}
.steps__item:last-child {
  margin-bottom: 0;
}
.steps__number {
  font-size: 35px;
  color: #fe5f55;
  font-weight: 500;
  line-height: 1;
  margin-bottom: 15px;
}
.steps__bottom {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 50px;
}
.steps__bottom .button-default {
  width: 100%;
}

.top-panel {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  padding-top: 15px;
  padding-bottom: 15px;
  transition: box-shadow 0.3s, padding-top 0.3s, padding-bottom 0.3s;
  box-shadow: 0 0 3px #b5b5b5;
  z-index: 50;
}
.top-panel._is-fixed {
  padding-top: 15px;
  padding-bottom: 15px;
  box-shadow: 0 0 3px #b5b5b5;
}
.top-panel__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.top-panel__button-burger {
  display: flex;
  flex-direction: column;
  gap: 5px;
  flex: 0 0 35px;
  width: 35px;
  max-width: 35px;
  background-color: transparent;
  position: relative;
  margin-right: 17px;
  border: none;
  padding: 0;
  position: relative;
  cursor: pointer;
  z-index: 50;
}
.top-panel__button-burger:before, .top-panel__button-burger:after {
  content: "";
}
.top-panel__button-burger._is-active:before {
  top: 8px;
  transform: rotate(45deg);
  transition: top 0.2s, transform 0.2s 0.1s;
}
.top-panel__button-burger._is-active span {
  transform: scaleX(0);
}
.top-panel__button-burger._is-active:after {
  bottom: 8px;
  transform: rotate(-45deg);
  transition: bottom 0.2s, transform 0.2s 0.1s;
}
.top-panel__button-burger:before,
.top-panel__button-burger span, .top-panel__button-burger:after {
  width: 100%;
  height: 3px;
  border-radius: 32px;
  background-color: #5ca98f;
  position: relative;
}
.top-panel__button-burger:before {
  top: 0;
  transform: rotate(0);
  transition: top 0.2s 0.1s, transform 0.1s;
}
.top-panel__button-burger span {
  transform: scaleX(1);
  transition: transform 0.15s 0.1s;
}
.top-panel__button-burger:after {
  bottom: 0;
  transform: rotate(0);
  transition: bottom 0.2s 0.1s, transform 0.1s;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@media (min-width: 375px) {
  .footer__copy {
    font-size: 16px;
  }
  .choose-tariff__content ul li:first-child {
    font-size: 18px;
  }
  .steps__bottom .button-default {
    width: auto;
  }
}
@media (min-width: 414px) {
  .choose-tariff .button-default {
    width: auto;
  }
  .hero__buttons .button-default {
    width: auto;
    flex: 0 0 auto;
  }
  .info-block__inner .button-default {
    width: auto;
  }
}
@media (min-width: 480px) {
  .hero__content h1 {
    font-size: 35px;
  }
}
@media (min-width: 640px) {
  .our-advantages__item {
    width: 50%;
  }
}
@media (min-width: 768px) {
  .footer__info {
    width: 60%;
    margin-right: 50px;
  }
  .footer__menu {
    display: flex;
    gap: 30px;
  }
  .footer__contact {
    font-size: 20px;
  }
  .footer__contact a {
    font-size: 16px;
  }
  .footer__nav {
    width: 33.333%;
    margin-bottom: 0;
  }
  .button-default {
    font-size: 18px;
    padding-right: 56px;
    padding-left: 56px;
  }
  .about-us h2 {
    font-size: 32px;
    margin-bottom: 50px;
  }
  .about-us h3 {
    font-size: 20px;
  }
  .about-us p {
    font-size: 18px;
  }
  .about-us__item {
    width: calc(50% - 40px);
  }
  .about-us__icon {
    flex: 0 0 64px;
    width: 64px;
    max-width: 64px;
    height: 64px;
    margin-top: 25px;
    margin-right: 30px;
  }
  .choose-tariff h2 {
    font-size: 32px;
  }
  .faq h2 {
    font-size: 32px;
    margin-bottom: 30px;
  }
  .faq h3 {
    font-size: 24px;
    padding: 30px;
  }
  .faq__item._is-active .faq__content {
    padding-bottom: 30px;
  }
  .faq__text {
    padding-right: 30px;
    padding-left: 30px;
  }
  .faq ol {
    padding-left: 40px;
    margin-bottom: 30px;
  }
  .faq p {
    margin-bottom: 20px;
  }
  .hero__inner {
    flex-direction: row;
    align-items: flex-end;
  }
  .hero__content, .hero__img {
    width: 50%;
    padding-right: 15px;
    padding-left: 15px;
  }
  .hero__content {
    text-align: left;
  }
  .hero__content h1 {
    font-size: 40px;
  }
  .hero__buttons {
    justify-content: flex-start;
  }
  .hero__buttons .button-default {
    padding-top: 30px;
    padding-bottom: 28px;
  }
  .info-block {
    margin-top: 140px;
  }
  .info-block h2 {
    font-size: 30px;
  }
  .info-block p {
    font-size: 20px;
  }
  .info-block:before {
    top: -125px;
    height: 125px;
  }
  .our-advantages h2 {
    font-size: 32px;
  }
  .our-advantages h3 {
    font-size: 25px;
  }
  .our-advantages ul {
    padding-left: 40px;
  }
  .our-advantages ul li {
    font-size: 20px;
  }
  .steps {
    padding-top: 50px;
    padding-bottom: 140px;
  }
  .steps:after {
    height: 125px;
  }
  .steps p {
    font-size: 20px;
  }
  .steps__items {
    display: flex;
    justify-content: space-between;
    gap: 15px;
  }
  .steps__item {
    width: 33.333%;
    margin-bottom: 0;
  }
  .steps__number {
    margin-bottom: 30px;
  }
  .steps__bottom {
    padding-top: 50px;
    padding-top: 70px;
  }
}
@media (min-width: 960px) {
  .footer {
    display: flex;
    justify-content: space-between;
    padding-bottom: 0;
  }
  .footer__inner {
    display: flex;
    justify-content: space-between;
  }
  .faq__items {
    gap: 40px;
  }
  .faq__item {
    width: calc(50% - 40px);
  }
  .info-block__inner {
    text-align: left;
  }
  .info-block__icon {
    width: 25%;
  }
  .info-block__content {
    width: 50%;
  }
  .steps h3 {
    font-size: 24px;
  }
}
@media (min-width: 1024px) {
  .choose-tariff__item {
    width: 33.333%;
  }
  .choose-tariff .button-default {
    margin-top: auto;
  }
  .choose-tariff__content ul {
    margin-bottom: 50px;
  }
  .our-advantages__item {
    width: 25%;
  }
}
@media (min-width: 1025px) {
  .hero__inner {
    align-items: flex-start;
  }
  .hero__content {
    width: 42%;
    padding-top: 70px;
  }
  .hero__img {
    width: 40%;
  }
  .main-menu {
    order: 0;
    display: block;
  }
  .main-menu__nav {
    overflow: visible;
  }
  .main-menu__nav ul {
    flex-direction: row;
    padding-top: 0;
    gap: 20px;
  }
  .steps__items {
    gap: 30px;
  }
  .top-panel {
    padding-top: 35px;
    padding-bottom: 35px;
    box-shadow: none;
  }
  .top-panel._is-fixed .main-menu a {
    color: #333;
    border-bottom-color: #333;
  }
  .top-panel__inner {
    flex-wrap: nowrap;
  }
  .top-panel__button-burger {
    display: none;
  }
}
@media (min-width: 1280px) {
  .choose-tariff__body {
    padding: 20px 30px 30px 30px;
  }
  .hero__content {
    margin-left: 95px;
  }
  .info-block__inner .button-default {
    flex: 0 0 auto;
  }
  .info-block__inner {
    flex-wrap: nowrap;
  }
  .info-block__icon {
    width: 33.333%;
  }
  .our-advantages__content {
    padding: 40px 30px 30px 30px;
  }
}
@media (min-width: 1440px) {
  .hero {
    padding-top: 65px;
  }
}
@media (min-width: 768) {
  html {
    scroll-padding-top: 60px;
  }
}
@media (max-width: 959px) {
  .footer__copy {
    position: absolute;
    left: 15px;
    bottom: -25px;
  }
}