@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap');

:root {
  --main-font: 'Montserrat', sans-serif;
  --bold: 700;
  --normal: 400;
  --font-color: #212121;
  --white-color: #fff;
  --black-color: #000;
  --link-color: #1D86DA;
  --ginger-color: #FF8F60;
  --ginger-color-alt: #EA7F52;
  --greeny-color: #42FF60;
  --red-color: #5C1606;
  --red-color-alt: #6E1907;
  --blue-color: #6AFFF6;
  --blue-color-alt: #56D4CC;
  --sea-color: #194350;
  --support-block: #1C6B69;
  --mobility-block: #0085B2;
  --speed-block: #E8681F;
  --best-price-block: #7A063A;
  --volumes-block: #21BAF3;
  --tablet: 768px;
  --laptop: 1024px;
  --laptopL: 1440px;
  --desktop: 1920px;
  --transition: all 0.2s ease-in-out;
  --container-width: 1354px;
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
body {
  line-height: 1;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

html *{
  box-sizing: border-box;
}

html {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
button, input {
  font-family: var(--main-font);
  cursor: pointer;
  border: none;
  padding: 0;
  transition: var(--transition);
}
body {
  font-family: var(--main-font);
  color: var(--font-color);
  background-color: var(--white-color);
  line-height: 100%;
  font-size: 1em;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  width: 100%;
}
a, .fake-link {
  color: var(--link-color);
  text-decoration: none;
}
b {
  font-weight: var(--bold);
}
main {
  flex: 1;
}
.container {
  width: 100%;
  max-width: var(--container-width);
  margin: 0 auto;
  padding: 0 20px;
  transition: var(--transition);
}
.page-title {
  padding: 0 0 30px 0;
}
.page-title h1 {
  font-weight: var(--bold);
  font-size: 1.25em;
  text-transform: uppercase;
  line-height: 130%;
}
.section-title {
  padding: 0 0 30px 0;
}
.section-title h2 {
  font-weight: var(--bold);
  font-size: 1.1em;
  text-transform: uppercase;
  line-height: 130%;
}
@media screen and (min-width: 768px) {
  .section-title {
    padding: 0 0 30px 0;
  }
  .section-title h2 {
    font-weight: var(--bold);
    font-size: 1.6em;
    text-transform: uppercase;
    line-height: 130%;
  }
  .page-title {
    padding: 0 0 30px 0;
  }
  .page-title h1 {
    font-weight: var(--bold);
    font-size: 2.25em;
    text-transform: uppercase;
    line-height: 130%;
  }
}
.section-subtitle {
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.section-subtitle p {
  font-size: 1.1em;
  line-height: 130%;
}
.highlight-title {
  font-size: 1.75em;
  line-height: 130%;
  font-weight: var(--bold);
  text-transform: uppercase;
  transition: var(--transition);
}
.highlight-subtitle {
  line-height: 130%;
  font-weight: var(--bold);
  transition: var(--transition);
  margin: 0 0 33px 0;
}
.highlight-logo {
  margin: 0 0 20px 0;
}
.highlight-logo img {
  max-height: 50px;
  width: auto;
}
.highlight-list {
  display: flex;
  flex-direction: column;
  gap: 27px;
  margin: 0 0 27px 0;
  line-height: 110%;
}
.highlight-list li {
  position: relative;
  padding-left: 23px;
}
.highlight-list li:before {
  content: '';
  height: 12px;
  width: 12px;
  position: absolute;
  display: block;
  border: solid 2px var(--font-color);
  border-radius: 50%;
  left: 0;
  top: 0px;
}
.highlight-list li::after {
  content: '';
  display: block;
  position: absolute;
  width: 2px;
  height: 2px;
  background: var(--font-color);
  left: 7px;
  top: 7px;
}
.highlight-split {
  display: flex;
  flex-direction: column;
  gap: 30px;
  margin: 0 0 62px 0;
  line-height: 130%;
}
.highlight-split > div p {
  font-weight: var(--bold);
  margin: 0 0 12px 0;
}
@media screen and (min-width: 768px) {
  .highlight-title {
    font-size: 2.25em;
  }
  .highlight-split {
    flex-direction: row;
  }
  .highlight-split > div p {
    font-size: 1.6em;
    margin: 0 0 17px 0;
  }
}
@media screen and (min-width: 1024px) {
  .highlight-content {
    max-width: 55%;
  }
  .highlight-title {
    font-size: 3.75em;
  }
  .highlight-subtitle {
    font-size: 1.75em;
    margin: 0 0 80px 0;
  }
  .highlight-logo {
    margin: 0 0 39px 0;
  }
  .highlight-logo img {
    max-height: 100px;
  }
  .highlight-list {
    font-size: 1.35em;
    gap: 41px;
    margin-bottom: 41px;
  }
  .highlight-list li {
    padding-left: 31px;
  }
  .highlight-list li:before {
    width: 16px;
    height: 16px;
  }
  .highlight-list li:after {
    width: 4px;
    height: 4px;
    left: 8px;
    top: 8px;
  }
}

.modal-window {
  z-index: 250;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
.modal-window .modal-window-content {
  background: white;
  box-shadow: 0px 22px 41px rgba(130, 132, 157, 0.07), 0px 9.19107px 17.1288px rgba(130, 132, 157, 0.0503198), 0px 4.91399px 9.15789px rgba(130, 132, 157, 0.0417275), 0px 2.75474px 5.13384px rgba(130, 132, 157, 0.035), 0px 1.46302px 2.72654px rgba(130, 132, 157, 0.0282725), 0px 0.608796px 1.13458px rgba(130, 132, 157, 0.0196802);
  position: relative;
  width: 420px;
  margin: 5vh auto;
  padding: 20px;
}
.modal-window .modal-window-content .close-this-modal {
  background: white;
  height: 30px;
  width: 30px;
  position: absolute;
  right: 20px;
  top: 20px;
  padding: 0;
  display: block;
  z-index: 10;
}
.modal-window .modal-window-content .close-this-modal svg {
  display: block;
  height: 22px;
  width: 22px;
  top: calc(50% - 11px);
  left: calc(50% - 11px);
  position: absolute;
}
.modal-window .modal-window-content .close-this-modal svg path {
  fill: grey;
}
.modal-window .modal-window-content .close-this-modal:hover {
  background: black;
}
.modal-window .modal-window-content .close-this-modal:hover svg path {
  fill: white;
}
.modal-window .modal-window-content .close-this-modal:active {
  transform: scale(0.95);
}
.modal-window .modal-window-content .modal-window-title {
  font-size: 1.1em;
  font-weight: bold;
  line-height: 130%;
  margin: 0 0 5px 0;
  position: relative;
}
.modal-window .modal-window-content .modal-window-title span {
  position: relative;
  display: block;
}
.modal-window .modal-window-content .modal-window-subtitle {
  font-size: 0.9em;
}
.modal-window .modal-window-content .modal-window-content-holder {
  padding: 25px 0 0 0;
  position: relative;
}
.modal-window .modal-window-content .modal-window-content-holder .modal-window-result {
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(5px);
  position: absolute;
  width: calc(100% + 2px);
  height: calc(100% + 45px + 2px);
  top: -45px;
  left: -1px;
  z-index: 50;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  flex-direction: row;
  justify-content: center;
}
.modal-window .modal-window-content .modal-window-content-holder .modal-window-result .modal-window-result-content {
  text-align: center;
}
.modal-window .modal-window-content .modal-window-content-holder .modal-window-result .modal-window-result-content .modal-window-result-content-icon {
  margin: 0 0 10px 0;
}
.modal-window .modal-window-content .modal-window-content-holder .modal-window-result .modal-window-result-content .modal-window-result-content-icon svg {
  display: block;
  margin: 0 auto;
}
.modal-window .modal-window-content .modal-window-content-holder .modal-window-result .modal-window-result-content .modal-window-result-content-title {
  font-weight: bold;
  margin: 0 0 10px 0;
}
.modal-window .modal-window-content .modal-window-content-holder .modal-window-result .modal-window-result-content .modal-window-result-content-text {
  margin: 0 0 10px 0;
}
.modal-window .modal-window-content .modal-window-content-holder .modal-window-result.positive .modal-window-result-content .modal-window-result-content-icon svg path {
  fill: green;
}
.modal-window .modal-window-content .modal-window-content-holder .modal-window-result.positive .modal-window-result-content .modal-window-result-content-title {
  color: green;
}
.modal-window .modal-window-content .modal-window-content-holder .modal-window-result.negative .modal-window-result-content .modal-window-result-content-icon svg path {
  fill: red;
}
.modal-window .modal-window-content .modal-window-content-holder .modal-window-result.negative .modal-window-result-content .modal-window-result-content-title {
  color: red;
}
.modal-window .modal-window-content .modal-window-controls {
  padding: 20px 0 0 0;
}
.modal-window .modal-window-content .modal-window-controls .checkbox-holder {
  margin: 0 0 20px 0;
}
.modal-window .modal-window-content .modal-window-controls .modal-window-buttons {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
}
.modal-window .modal-window-content .modal-window-controls .modal-window-buttons button {
  width: auto;
  min-width: 50%;
}
.modal-window.open-window {
  display: block;
}
.overlay-cover {
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(10px);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 200;
}

@media screen and (max-width: 768px) {
    .modal-window {
        .modal-window-content {
            width: 100%;
            box-shadow: none;
            margin: 0;
            min-height: 100%;

            .modal-window-controls {
                .modal-window-buttons {
                    button {
                        width: 100%;
                    }
                }
            }
        }
    }
}


@media screen and (min-width: 1440px) {
  .highlight-title {
    font-size: 5em;
  }
  .highlight-subtitle {
    font-size: 1.9em;
  }
}
.def-button {
  max-width: 270px;
  width: 100%;
  height: 65px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--link-color);
  background: #2196F3 linear-gradient(128.3deg, #2196F3 0%, #00BEFF 100%);
  color: var(--white-color);
  text-transform: uppercase;
  font-weight: var(--bold);
  font-size: 1.05em;
  padding: 0 20px;
  border-radius: 2px;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.24), 0 0px 2px rgba(0, 0, 0, 0.12);
}
.def-button:hover {
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.24), 0px 0px 2px rgba(0, 0, 0, 0.12);
  background: #2196F3 linear-gradient(128.3deg, #2196F3 0%, #00BEFF 0%);
}
.def-button:active {
  transform: scale(0.98);
}
@media screen and (min-width: 1440px) {
  .container {
    padding: 0;
  }
}