@font-face {
  font-family: "SF Pro Display";
  src: url("../fonts/SF-Pro-Display-Light.woff2") format("woff2"),
    url("../fonts/SF-Pro-Display-Light.woff") format("woff"),
    url("../fonts/SF-Pro-Display-Light.ttf") format("truetype");
  font-style: normal;
  font-weight: 300;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../fonts/SF-Pro-Display-Regular.woff2") format("woff2"),
    url("../fonts/SF-Pro-Display-Regular.woff") format("woff"),
    url("../fonts/SF-Pro-Display-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../fonts/SF-Pro-Display-Semibold.woff2") format("woff2"),
    url("../fonts/SF-Pro-Display-Semibold.woff") format("woff"),
    url("../fonts/SF-Pro-Display-Semibold.ttf") format("truetype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../fonts/SF-Pro-Display-Bold.woff2") format("woff2"),
    url("../fonts/SF-Pro-Display-Bold.woff") format("woff"),
    url("../fonts/SF-Pro-Display-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../fonts/SF-Pro-Display-Black.woff2") format("woff2"),
    url("../fonts/SF-Pro-Display-Black.woff") format("woff"),
    url("../fonts/SF-Pro-Display-Black.ttf") format("truetype");
  font-style: normal;
  font-weight: 800;
  font-display: swap;
}

:root {
  --main-color: #336fb2;
  --fucsia-gradient: linear-gradient(
    261deg,
    #2071ff -2.9%,
    #8142ff 48.55%,
    #d051fd 100%
  );
  --private-gradient: linear-gradient(264deg, #336fb2 0%, #b698f5 100%);
  --private-gradient-rotade: linear-gradient(261deg, #b698f5 0%, #336fb2 100%);
  --error-color: #f93232;
  --success-color: #00a700;
  --section-color: #fbff0855;
  --color-btn-hover: #064285;
  --color-text-dark: #333;
  --color-text-medium: #666;
  --color-text-light: #888;
  --color-text-extralight: #fff;
  --color-bg-extralight: #fff;
  --color-bg-page: #f3f6f9;
  --color-border-gray: #dcdfe3;
  --color-bg-lightgray: #fbfbfb;
  --size-text: 1rem;
  --size-title: 2rem;
  --size-card-title: 1.5rem;
  --border-radius-btn: 8px;
  --border-radius-btndefault: 12px;
  --border-radius-card: 24px;
  --border-radius-section: 32px;
  --border-radius-icon: 12px;
  --shadow-card: 0px 4px 30px 0px rgba(0, 0, 0, 0.1);
  --bg-color: var(--color-bg-page);
  --bg-blue: #f3f6f9;
  --padding-btn: 16px 32px;
}

/* Reset styles  */
* {
  padding: 0px;
  margin: 0px;
  border: none;
  box-sizing: border-box;
}
*,
*::before,
*::after {
  box-sizing: border-box;
}
:focus,
:active {
  outline: none;
}
a:focus,
a:active {
  outline: none;
}
a,
a:link,
a:visited {
  /* color: inherit; */
  text-decoration: none;
  /* display: inline-block; */
}
a:hover {
  /* color: inherit; */
  text-decoration: none;
}
ul,
ul li {
  list-style: none;
}
address {
  font-style: normal;
}
input::-ms-clear {
  display: none;
}
button {
  background: none;
  font-size: inherit;
}
input:focus,
input:active,
button:focus,
button:active {
  outline: none;
}
button::-moz-focus-inner {
  padding: 0;
  border: 0;
}
legend {
  display: block;
}
input,
textarea,
button,
a,
i,
li,
label,
div {
  -webkit-tap-highlight-color: transparent;
}
/* end Reset styles */
html {
  scroll-behavior: smooth;
}
body {
  font-family: "SF Pro Display", sans-serif;
  font-weight: 400;
  font-size: var(--size-text);
  color: var(--color-text-medium);
  background: var(--color-bg-page);
}
a {
  color: var(--main-color);
}
/* * {
  scrollbar-width: thin;
  scrollbar-color: var(--color-border-gray) none;
}
::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}
::-webkit-scrollbar-thumb {
  background: var(--color-border-gray);
  border-radius: 4px;
} */

/*IE*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  * {
    scrollbar-face-color: #d1d8da;
    scrollbar-track-color: #dcd5d5;
    scrollbar-3dlight-color: #dcd5d5;
    scrollbar-darkshadow-color: #dcd5d5;
    scrollbar-arrow-color: #dcd5d5;
    /* -ms-overflow-style: -ms-autohiding-scrollbar;
    scrollbar-width: thin; */
    -ms-overflow-style: none; /* IE 10+ */
  }
}

/* for chrome */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  ::-webkit-scrollbar {
    width: 4px;
    height: 4px;
    border-radius: 5px;
  }
  ::-webkit-scrollbar-track {
    /* background-color: #e8e8e8; */
    background: none;
  }
  ::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: var(--color-border-gray);
  }
  ::-webkit-scrollbar-thumb:hover {
    background-color: #c7c7c7;
  }
}

/* for firefox */
@-moz-document url-prefix() {
  * {
    /* scrollbar-width: thin; */
    scrollbar-width: none;
    scroll-behavior: smooth;
    scrollbar-color: var(--color-border-gray) none;
  }
}
/* ----- */
.page-wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
main {
  flex-grow: 1;
}
.container {
  max-width: 1392px;
  padding: 0 16px;
  margin: 0 auto;
}
/* HEADER */
header {
  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}
/* desktop MENU */
.header-top-wrapper {
  width: 100%;
  position: relative;
  background: var(--color-bg-lightgray);
  backdrop-filter: blur(30px);
  border-bottom: 1px solid #e6e6e6;
  z-index: 10;
}
.header-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  padding: 16px 0;
  position: relative;
}
.header-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 24px;
  color: var(--main-color);
position: relative;
}
.header-logo img {
  height: 100%;
}
.header-logo .icon {
  font-size: 1.5rem;
}
.header-logo-text {
  font-size: 1.1rem;
  text-transform: uppercase;
  font-weight: 900;
}
.header-logo:hover {
  color: var(--color-btn-hover);
}
nav {
  flex-grow: 1;
}
.top-nav {
  display: flex;
  align-items: center;
  gap: 32px;
}
.top-nav a {
  color: var(--text-dark-color);
  position: relative;
}
.top-nav a:hover {
  color: var(--main-color);
}
.top-nav a.active {
  color: var(--main-color);
  font-weight: 600;
}
.top-nav a::after {
  display: block;
  content: attr(title);
  font-weight: 600;
  height: 1px;
  color: transparent;
  overflow: hidden;
  visibility: hidden;
}
.apb-online-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  backdrop-filter: blur(2px) saturate(99%);
  -webkit-backdrop-filter: blur(3px) saturate(99%);
  background-color: rgb(101 101 101 / 25%);
}
.apb-online-overlay.active {
  display: block;
}
.apb-online > label {
  display: inline-block;
  padding: 8px 24px;
  color: var(--color-text-extralight);
  background: var(--main-color);
  border-radius: var(--border-radius-btn);
  cursor: pointer;
  white-space: nowrap;
}
.apb-online > label:hover {
  background: var(--color-btn-hover);
}
.apb-online > label .icon {
  display: inline-block;
  margin-left: 8px;
  font-size: 0.7rem;
}
.apb-online-container {
  display: none;
  position: absolute;
  right: 0;
  top: 100%;
  padding: 32px 16px;
  border-radius: 16px;
  background: var(--color-bg-extralight);
  box-shadow: var(--shadow-card);
  z-index: 1000;
}
#apb-online-check {
  display: none;
}
#apb-online-check:checked ~ .apb-online-container {
  display: block;
}
#apb-online-check:checked ~ label .icon {
  transform: rotate(180deg);
}
.apb-online-row:not(:last-child) {
  margin-bottom: 24px;
}
.apb-online-row-descr {
  font-size: 0.875rem;
  margin-bottom: 16px;
}
.apb-online-row a {
  display: inline-block;
  width: 100%;
  padding: 10px 32px;
  color: var(--main-color);
  border: 1px solid var(--main-color);
  border-radius: var(--border-radius-btn);
  text-align: center;
}
.apb-online-row-btns {
  display: flex;
  gap: 16px;
}
.apb-online-row.app a {
  color: var(--color-text-medium);
  border: 1px solid var(--color-text-medium);
  text-align: left;
  font-size: 0.75rem;
  padding: 8px 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.apb-online-row-btns a .icon {
  font-size: 1.6rem;
}
.apb-online-row a:hover {
  color: var(--color-btn-hover);
  border: 1px solid var(--color-btn-hover);
}
.header-bottom-wrapper {
  position: relative;
  background: var(--color-bg-lightgray);
  /* backdrop-filter: blur(30px); */
  width: 100%;
  margin-top: 0;
  transition: margin-top 0.4s ease;
}
.header-bottom-wrapper.hide {
  margin-top: -2000px;
  transition: margin-top 0.3s ease;
}
.header-bottom {
  display: flex;
  gap: 16px;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
.bottom-nav {
  display: flex;
  gap: 40px;
}
.bottom-nav > li {
  position: relative;
  cursor: pointer;
  padding: 16px 0;
}
.bottom-nav > li::before {
  content: "";
  position: absolute;
  top: 90%;
  left: 0;
  width: 100%;
  height: 50%;
}
.bottom-nav > li:hover {
  color: var(--color-btn-hover);
}
.bottom-nav a:hover {
  color: var(--main-color);
}
.bottom-nav a.active {
  color: var(--main-color);
  font-weight: 600;
}
.bottom-nav li.active {
  color: var(--main-color);
  font-weight: 600;
}

.bottom-nav-links {
  position: absolute;
  top: calc(100% + 8px);
  left: -8px;
  padding: 32px 24px;
  display: none;
  font-weight: 400;
  max-width: 700px;
  border-radius: 16px;
  background: var(--color-bg-extralight);
  box-shadow: var(--shadow-card);
  opacity: 0;
  transition: opacity 0.1s ease-in;
  z-index: 900;
}
.bottom-nav li:not(:first-child) .bottom-nav-links {
  /*left: -140%;*/
left: -100px;
}
/* .bottom-nav li:last-child .bottom-nav-links {
  left: -300%;
} */
.bottom-nav-links > li {
  padding-right: 120px;
  width: max-content;
}
.bottom-nav li:hover > .bottom-nav-links {
  display: flex;
  opacity: 1;
  /* transition: opacity 0.2s ease-in;
  z-index: 900; */
}
.bottom-nav-links-title {
  text-transform: uppercase;
  font-weight: 600;
  color: var(--color-text-light);
  margin-bottom: 8px;
  position: relative;
}
.bottom-nav-links-column li a {
  display: inline-block;
  color: var(--color-text-dark);
  padding: 8px 0;
  width: 100%;
}

.bottom-nav-links-column.useful li a {
  color: var(--color-text-medium);
}
.bottom-nav-links-column li a.active,
.bottom-nav-links-column li a:hover {
  color: var(--main-color);
}
.header-search {
  padding: 8px 0;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: end;
}
.header-search > input[type="checkbox"] {
  display: none;
}
.header-search > label {
  padding: 8px;
  cursor: pointer;
}

.header-search-form {
  background: var(--color-bg-lightgray);
  padding: 24px;
  border-radius: 16px;
  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.1);
  display: none;
  position: absolute;
  top: 101%;
  right: 0;
}
.header-search-form form {
  padding: 16px 24px;
  background: var(--color-bg-extralight);
  border-radius: 12px;
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
}
.header-search-form input {
  width: 256px;
  background: inherit;
  font-size: var(--size-text);
  outline: none;
  line-height: 1;
  padding-top: 4px;
  margin-right: 8px;
}
.header-search-form input:focus::placeholder {
  color: transparent;
}
.header-search form button {
  color: var(--color-text-light);
  cursor: pointer;
  display: flex;
  align-items: center;
  font-size: 22px;
  /* margin-right: 8px; */
  line-height: 1;
}
.header-search form label {
  margin-left: 8px;
}
.header-search > input[type="checkbox"]:checked ~ .header-search-form {
  display: flex;
  align-items: center;
}
/* end desktop MENU */

/* mobile MENU */
.mobile-menu {
  display: none;
  background: var(--color-bg-page);
}
.mobile-menu-top {
  width: 100%;
  margin-left: 16px;
  margin-right: 18px;
  position: relative;
  padding: 48px 0 24px 0;
  border-bottom: 1px solid var(--color-border-gray);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.mobile-menu-logo {
  color: var(--main-color);
  font-size: 20px;
  font-weight: 900;
  display: flex;
  align-items: center;
  gap: 8px;
  line-height: 1;
  height: 24px;
position: relative;
}
.mobile-menu-logo img {
  height: 100%;
}
.mobile-menu-logo-img {
  margin-top: -4px;
  margin-bottom: -4px;
}
.mobile-menu-logo-img .icon {
  font-size: 30px;
}
.mobile-menu-icons {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
}
#apb-online-mobile {
  display: none;
}
.apb-online-mob > label .icon {
  color: var(--main-color);
  font-weight: 600;
  font-size: 24px;
  cursor: pointer;
}
.apb-online-mob .apb-online-container {
  top: calc(100% - 8px);
}
#apb-online-mobile:checked ~ .apb-online-container {
  display: block;
}
.mobile-menu-burger {
  padding: 4px 0;
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.mobile-menu-burger label {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  height: 100%;
}
.mobile-menu-burger span {
  width: 100%;
  height: 2px;
  border-radius: 8px;
  background: var(--color-text-medium);
}
.mobile-menu-burger span:last-child {
  width: 70%;
  margin-left: auto;
}
.mobile-menu-burger.active span:last-child {
  display: none;
}
.mobile-menu-burger.active span:first-child {
  transform: translate(4px, 7px) rotate(48deg);
}
.mobile-menu-burger.active span:nth-child(2) {
  transform: translate(3px, -7px) rotate(-48deg);
}
#mobile-menu-check {
  display: none;
}
.mobile-menu-nav-wrapper {
  display: none;
  position: fixed;
  top: 85px;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--color-bg-page);
  padding: 6px 16px 16px;
}
/* #mobile-menu-check:checked ~ .mobile-menu-nav-wrapper {
  display: block;
} */
.mobile-menu-nav-wrapper.active {
  display: block;
}
.mobile-menu-nav {
  border-radius: 16px;
  padding: 24px 16px;
  background: var(--color-bg-lightgray);
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.1);
  overflow-y: auto;
  width: 100%;
  height: 100%;
}
.mobile-menu-search {
  overflow: hidden;
  border: 1px solid var(--color-border-gray);
  border-radius: 10px;
}
.mobile-menu-search form {
  padding: 0 8px;
  display: flex;
  align-items: center;
}
.mobile-menu-search button {
  width: 40px;
  height: 48px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.mobile-menu-search button .icon {
  font-size: 20px;
  color: var(--color-text-light);
}
.mobile-menu-search input {
  width: 100%;
  padding-left: 8px;
  font-size: 0.875rem;
  background: inherit;
}
.mobile-menu-chapter {
  margin-top: 8px;
  padding: 8px 16px;
  background: var(--color-bg-page);
  border-radius: 12px;
}
.mobile-menu-chapter-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-bottom: none;
  color: var(--color-text-dark);
}
.mobile-menu-chapter-title a {
  padding: 16px 0;
  font-size: 1rem;
  font-weight: 600;
  color: var(--color-text-dark);
}
.mobile-menu-chapter-title .icon {
  padding: 16px 0;
  font-size: 14px;
}
.mob-menu-group {
  display: none;
}
.mobile-menu-chapter-title.active {
  border-bottom: 1px solid var(--color-border-gray);
}
.mobile-menu-chapter-title.active .icon {
  transform: rotate(180deg);
}
.mobile-menu-chapter-title.active ~ .mob-menu-group {
  display: block;
}
.mobile-menu-chapter-title a.active {
  color: var(--main-color);
}
.mob-menu-group-title {
  padding: 16px 0;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-transform: uppercase;
  color: var(--color-text-medium);
  margin-bottom: 8px;
}
.mob-menu-group-title.active {
  color: var(--main-color);
}
.mob-menu-group-title .icon {
  font-size: 14px;
}
.mob-menu-group-title.opened .icon {
  transform: rotate(-180deg);
}
.mob-menu-group .bottom-nav-links-title {
  display: inline-block;
}
.mob-menu-group .bottom-nav-links-title::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--color-text-light);
}
.mob-menu-group-nav li a {
  display: inline-block;
  padding: 12px 0;
  color: var(--color-text-medium);
  font-size: 1rem;
  width: 100%;
}
.mob-menu-group-nav li a.active {
  color: var(--main-color);
  font-weight: 600;
}
.mob-menu-group-useful {
  margin-top: 4px;
  margin-bottom: 8px;
}
.mob-menu-group-useful li a {
  display: inline-block;
  padding: 12px 0;
  color: var(--color-text-medium);
  font-size: 0.875;
}
.mob-menu-group-useful li a.active {
  color: var(--main-color);
  font-weight: 600;
}
.mob-menu-nav-wrapper {
  display: none;
}
.mob-menu-group-title.opened ~ .mob-menu-nav-wrapper {
  display: block;
}
/* end mobile MENU */
/* end HEADER */
/* FOOTER */
footer {
  background: var(--color-bg-lightgray);
}
.footer-row {
  display: flex;
  justify-content: space-between;
  gap: 32px;
}
.footer-row:not(:last-child) {
  border-bottom: 1px solid var(--color-border-gray);
}
.footer-row.top {
  padding: 18px 0;
  align-items: center;
}
.footer-logo {
  color: var(--main-color);
  display: flex;
  align-items: center;
  gap: 8px;
  height: 24px;
}
.footer-logo .icon {
  font-size: 1.5rem;
}
.footer-logo img {
  height: 100%;
}
.footer-logo-img .icon {
  font-size: 2.1rem;
}
.footer-logo-text {
  font-size: 1.1rem;
  text-transform: uppercase;
  font-weight: 900;
}
.footer-logo:hover {
  color: var(--color-btn-hover);
}
.footer-toprow-contacts {
  display: flex;
  align-items: center;
  gap: 32px;
}
.footer-toprow-contacts div {
  flex-shrink: 0;
}
.footer-toprow-contacts p {
  color: var(--color-text-dark);
  font-size: 0.875rem;
  margin-bottom: 4px;
}
.footer-toprow-phones {
  display: flex;
  align-items: center;
  gap: 16px;
}
.footer-toprow-phones a {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--color-text-medium);
  white-space: nowrap;
}
.footer-toprow-phones a:first-child {
  color: var(--main-color);
}
.footer-row.middle {
  padding: 24px 0;
}
.footer-column-title {
  text-transform: uppercase;
  margin-bottom: 14px;
  font-weight: 600;
}
.footer-column input[type="checkbox"] {
  display: none;
}
.footer-column-label {
  display: none;
}
.footer-column ul:not(:last-child) {
  margin-bottom: 16px;
}
.footer-column-group-title {
  font-weight: 600;
  color: var(--color-text-medium);
}
.footer-column li {
  margin-bottom: 8px;
}
.footer-column li a {
  display: block;
  padding: 4px 0;
  color: var(--color-text-light);
}
.footer-column li a:hover {
  color: var(--color-btn-hover);
    /* font-weight: 500; */
}
.footer-contacts {
  margin-top: 16px;
}
.footer-contacts.mobile {
  display: none;
}
.footer-contacts li {
  margin-bottom: 8px;
}
.footer-contacts li a {
  display: block;
  padding: 4px 0;
  color: var(--color-text-light);
}
.footer-contacts li a:hover {
  color: var(--color-btn-hover);
}
.apb-contacts li a {
  display: flex;
  align-items: center;
  gap: 8px;
}
.social-links {
  display: flex;
  margin-top: 8px;
  gap: 8px;
}
.social-links .social-link {
  width: 32px;
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--color-text-extralight);
  border-radius: 8px;
  background: var(--main-color);
  font-size: 16px;
}
.social-links .social-link:hover {
  background: var(--color-btn-hover);
  color: var(--color-text-extralight);
}
li.footer-link-bold a {
  font-weight: 600;
  color: var(--color-text-medium);
}
.footer-row.bottom {
  padding: 14px 0;
  align-items: center;
}
.footer-address {
  font-size: 0.875rem;
}
.footer-apps {
  display: flex;
  align-items: center;
  gap: 16px;
}
.footer-apps .footer-column-group-title {
  display: none;
}
.footer-apps a {
  padding: 8px 16px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  line-height: 1;
  color: var(--color-text-medium);
  border: 1px solid var(--color-text-medium);
  border-radius: 12px;
}
.footer-apps a .icon {
  font-size: 22px;
}
.footer-apps a:hover {
  color: var(--main-color);
  border: 1px solid var(--main-color);
}
/* end FOOTER */

/* BUNNER */
.bunner {
  margin-bottom: 96px;
  overflow: hidden;
}
.bunner-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  margin-top: 56px;
  min-height: 340px;
}
.bunner-title-mobile {
  display: none;
}
.bunner-text {
  flex-basis: 43%;
  min-height: 200px;
}
.bunner-title {
  font-size: var(--size-title);
  color: var(--color-text-dark);
  margin-bottom: 24px;
}
.bunner-paragraph {
  line-height: 1.5;
}
.bunner-link {
  display: block;
  color: var(--main-color);
  margin-top: 24px;
  cursor: pointer;
}
.bunner-link:hover {
  color: var(--color-btn-hover);
}
.bunner-list li {
  position: relative;
  padding-left: 26px;
line-height: 1.5;
}
.bunner-list li:not(:last-child) {
  margin-bottom: 8px;
}
.bunner-list li::before {
  content: "";
  position: absolute;
  top: calc(0.5rem - 2px);
  left: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--main-color);
}
.bunner-btns {
  display: flex;
  gap: 16px;
  margin-top: 40px;
}
.bunner-btns button,
.bunner-btns a {
  padding: 16px 32px;
  border-radius: 12px;
  background: var(--main-color);
  color: var(--color-bg-extralight);
  line-height: 1.5;
  font-size: 1rem;
  cursor: pointer;
}
.bunner-btns button:hover,
.bunner-btns a:hover {
  background: var(--color-btn-hover);
}
.bunner-img {
  /*flex-basis: 48%;*/
  flex-basis: 50%;
  display: flex;
  justify-content: end;
  align-items: end;
  min-height: 150px;
}
.bunner-img img {
  width: 100%;
  height: 100%;
  max-height: 400px;
  object-fit: contain;
  object-position: right bottom;
}
.bunner.restyle .bunner-text {
  flex-basis: 65%;
}
.bunner.restyle .bunner-text .bunner-paragraph {
  max-width: 650px;
}
.bunner.restyle .bunner-img {
  flex-basis: 35%;
}
.bunner.restyle .inner-block-btns.mobile {
  display: none;
}
/* end BUNNER */
/* ARTICLE */
.article.wrapper {
   padding: 56px 40px 0 40px;
  border-radius: var(--border-radius-section);
  background: var(--bg-color);
  overflow: hidden;
}
.article-title {
  color: var(--color-text-dark);
  font-size: var(--size-card-title);
  margin-bottom: 24px;
}
.article-img {
  position: relative;
  float: right;
  width: 45%;
  padding-left: 32px;
   /* padding-bottom: 15px; */
  margin-bottom: 16px;
}
.article-img img {
  width: 100%;
  object-fit: contain;
}
.article-img::before {
  content: "";
  position: absolute;
  top: 80%;
  left: 0;
  bottom: -3px;
  width: 100%;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 18%,
    #e5eaf1 90%
  );
}
.bunner .article-img::before {
  content: none;
}
.article.wrapper .article-img img {
  /* height: 100%; */
  height: auto;
  max-height: 400px;
}
.article-text {
  padding-bottom: 56px;
}
.article-text p {
  line-height: 1.5;
  margin-top: 16px;
}


/* end ARTICLE */

/* MAIN */
main {
  background: var(--bg-main);
  min-height: 100px;
  margin-top: 120px;
}
/*PRODUCT CARDS*/
.product-cards-block {
  margin: -20px;
}
.product-card-wrapper {
  padding: 20px;
  width: 50%;
}
.product-cards-row {
  display: flex;
  flex-wrap: wrap;
  /* gap: 40px;
  margin-top: 40px; */
}
.product-card-wrapper {
  flex-basis: 50%;
  flex-shrink: 0;
  padding: 20px;
  flex-grow: 1;
}
.product-card {
  padding: 32px;
  min-height: 320px;
  border-radius: var(--border-radius-card);
  background: var(--bg-color);
  position: relative;
  overflow: hidden;
  height: 100%;
}
.product-card::before {
  content: "";
  position: absolute;
  left: -120px;
  top: 65%;
  width: 430px;
  height: 350px;
  background: var(--before-bg);
  border-radius: 48% 52% 77% 23% / 46% 24% 76% 54%;
}
.product-card-inner {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 16px;
  height: 100%;
  width: 50%;
  z-index: 1;
}
.product-card-inner.full {
  width: 100%;
}
.product-card-text {
  line-height: 1.5;
}
.product-card-inner.light,
.product-card-inner.light h6,
.product-card-inner.light a {
  color: var(--color-text-extralight);
}
.product-card-inner.light .inner-block-list li::before {
  background: var(--color-text-extralight);
}
.product-card-text h6 {
  margin-bottom: 16px;
  line-height: 1.2;
}
.product-card-img {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 55%;
  display: flex;
  justify-content: right;
  align-items: end;
}
.product-card-img img {
  width: 100%;
  height: 100%;
 max-height: 300px;
  object-fit: contain;
  object-position: right bottom;
}
/* .product-card.tower {
  min-width: 320px;
} */
.tower .product-card-img img {
  max-height: 50%;
}
.product-card-wrapper.tower {
  flex-basis: 420px;
}
.product-card-wrapper.tower.mobile {
  display: none;
}
.product-cards-row.top {
  flex-wrap: nowrap;
}
.product-card.tower .link-detail a {
  padding: 12px 32px;
  border-radius: var(--border-radius-btn);
  background: var(--color-bg-extralight);
  color: var(--main-color);
  width: max-content;
}
.product-card.tower .link-detail a:hover {
  background: var(--color-btn-hover);
  color: var(--color-text-extralight);
}
.product-card.tower .product-card-img {
  position: absolute;
  bottom: 40px;
  left: 16px;
  right: 16px;
  width: calc(100% - 32px);
}
/* .product-card.tower .product-card-img img {
  width: 100%;
} */
.product-card.full {
  min-height: 400px;
}
.product-card.full .product-card-img {
  height: 100%;
  padding-top: 16px;
}
.product-card.full::before {
  top: 70%;
}
@media (max-width: 1350px) {
  .product-card-wrapper.tower {
    flex-basis: 370px;
  }
  .product-card.full {
    min-height: 350px;
  }
}
@media (max-width: 1250px) {
  .product-card.full {
    min-height: 300px;
  }
}
@media (max-width: 1100px) {
  .product-card-wrapper.tower {
    display: none;
  }
  .product-card-wrapper.tower.mobile {
    display: block;
    flex-basis: 50%;
  }
  .product-card.tower .product-card-img {
    bottom: 0;
    left: auto;
    right: 16px;
    width: 45%;
    max-height: 80%;
  }
  .product-card-inner {
    width: 100%;
  }
  .product-card.tower .product-card-inner {
    width: 55%;
  }
}
@media (max-width: 1050px) {
  .product-cards-row.top {
    flex-wrap: wrap;
  }
  .product-cards-row.top .product-card {
    flex-basis: 100%;
  }
}
@media (max-width: 900px) {
  .product-cards-block {
    margin: -8px;
  }
  .product-card-wrapper {
    padding: 8px;
  }
}
@media (max-width: 850px) {
  .product-card {
    min-height: 300px;
  }
  .product-card.tower .product-card-inner {
    width: 100%;
  }
  .product-card.tower .product-card-img {
    height: 50%;
  }
.tower .product-card-img img {
    max-height: 100%;
}
}
@media (max-width: 600px) {
  .product-cards-block {
    margin: -20px;
  }

  .product-card-wrapper {
    padding: 20px;
    flex-basis: 100%;
  }
  .product-card {
    padding: 40px 16px;
  }
  .product-card-text h6 {
    width: 80%;
  }
  .product-card-text p {
    width: 60%;
  }
  .product-card-img {
    width: 50%;
  }
  .product-card.tower .product-card-img {
    height: 80%;
  }
}
@media (max-width: 460px) {
  .product-card {
    padding: 40px 0 0 0;
    min-height: 420px;
  display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .product-card-inner {
    padding: 0 32px;
    height: max-content;
    position: static;
  }
  .product-card-text h6 {
    width: 100%;
    text-align: center;
    margin-bottom: 24px;
  }
  .product-card-text {
    text-align: center;
  }
  .product-card-img {
    position: relative;
    margin-top: 56px;
    /* margin-top: 40px; */
    width: 100%;
    min-height: 220px;
  }

  .product-card-text p {
    width: 100%;
  }
  .product-card.full .product-card-img {
    padding-top: 0;
    height: max-content;
  }
  .product-card.tower .product-card-img {
    position: relative;
    height: max-content;
    width: 100%;
right: 0;
  }
 .product-card.tower .product-card-img img {
    max-height: 300px;
object-position: bottom center;
  }
  .product-card .link-detail {
    position: absolute;
    bottom: 28px;
    right: 50%;
    transform: translateX(50%);
    z-index: 1;
  }
  .product-card .link-detail a {
    padding: 12px 32px;
    background: var(--color-bg-extralight);
    color: var(--main-color);
    border-radius: var(--border-radius-btn);
  }
  .product-card .link-detail a:hover {
    background: var(--color-btn-hover);
    color: var(--color-text-extralight);
  }
  .product-card::before {
    top: 60%;
  }
  .product-card.full::before {
    top: 60%;
  }
}
/* end PRODUCT CARDS*/
/* TEXT CARDS */
.about .content-block {
  margin-bottom: 40px;
}
.text-cards {
  margin: -20px;
  display: flex;
  flex-wrap: wrap;
}
.text-card-wrapper {
  padding: 20px;
  flex-basis: 33.33%;
  flex-grow: 1;
  min-height: 320px;
}
.text-card {
  position: relative;
  padding: 32px 32px 90px 32px;
  border-radius: 24px;
  background: var(--bg-color);
  overflow: hidden;
  height: 100%;
}
.text-card::before {
  content: "";
  position: absolute;
  width: 550px;
  height: 360px;
  /* top: 85%; */
  bottom: -288px;
  right: 25%;
  transform: rotate(-6deg);
  background: var(--before-color);
  border-radius: 58% 34% 100% 0% / 18% 19% 81% 82%;
}
.text-card-inner {
  position: relative;
  z-index: 1;
}
.text-card-inner h6 {
  font-weight: 600;
  font-size: var(--size-card-title);
  margin-bottom: 16px;
  color: var(--title-color);
}
.text-card-inner p {
  color: var(--p-color);
  line-height: 1.5;
}

/* end TEXT CARDS */
/* SERVICE CARDS */
.cards-block {
  margin: -20px;
  display: flex;
  flex-wrap: wrap;
}
.service-card-wrapper {
  padding: 20px;
  flex-basis: 33.33%;
  flex-grow: 0;
  min-height: 320px;
}
.service-card {
  padding: 24px;
  background: var(--bg-color);
  position: relative;
  overflow: hidden;
  border-radius: var(--border-radius-card);
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.service-card::before {
  content: "";
  position: absolute;
  width: 550px;
  height: 360px;
  top: 79%;
  right: 35%;
  transform: rotate(-7deg);
  background: var(--before-color);
  border-radius: 58% 42% 100% 0% / 18% 19% 81% 82%;
}
.service-card-icon {
  width: 72px;
  height: 72px;
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}
.service-card-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.service-card-text {
  position: relative;
  margin: 16px 0;
  z-index: 1;
}
.service-card-text h6 {
  font-weight: 600;
  color: var(--color-text-dark);
  font-size: var(--size-card-title);
}
.service-card-text p {
  margin-top: 8px;
  line-height: 1.5;
}
.service-card .link-detail {
  margin-top: auto;
  padding-top: 8px;
  z-index: 1;
}
@media (max-width: 1150px) {
  .service-card::before {
    right: 20%;
  }
}
@media (max-width: 900px) {
  .cards-block {
    margin: -8px;
  }
  .service-card-wrapper {
    padding: 8px;
  }
  .service-card::before {
    top: 83%;
  }
}
@media (max-width: 800px) {
  .service-card-wrapper {
    flex-basis: 50%;
  }
  .service-card::before {
    top: 75%;
  }
}
@media (max-width: 700px) {
  .service-card::before {
    top: 78%;
    right: 25%;
  }
}
@media (max-width: 600px) {
  .cards-block {
    margin: -20px;
  }
  .service-card-wrapper {
    flex-basis: 100%;
    padding: 20px;
  }
  .service-card {
    padding: 40px 24px;
  }
  .service-card::before {
    width: 550px;
    top: 75%;
    right: 40%;
  }
  .service-card-text {
    margin: 24px 0;
    max-width: 400px;
  }
}
@media (max-width: 450px) {
  .service-card::before {
    top: 75%;
    right: 20%;
  }
}
/* end SERVICE CARDS */

/* MONO CARD */
.mono-cards {
  display: flex;
  flex-wrap: wrap;
  margin: -20px;
}
.mono-card-wrapper {
  flex-basis: 33.33%;
  padding: 20px;
  flex-grow: 1;
}
.four .mono-card-wrapper {
  flex-basis: 25%;
 min-width: 200px;
}
.mono-card {
  padding: 32px;
  border-radius: var(--border-radius-card);
  background: var(--color-bg-extralight);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
  height: 100%;
}
/* end MONO CARD */
/* STEP CARD */
.step-cards {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: -20px;
}
.step-card-wrapper {
  flex-basis: 33.33%;
  padding: 50px 20px 20px;
  flex-shrink: 0;
  flex-grow: 1;
}
.step-card {
  height: 100%;
  display: flex;
  /* align-items: start; */
  text-align: center;
  padding: 52px 32px 32px;
  border-radius: var(--border-radius-card);
  background: var(--color-bg-extralight);
  position: relative;
}
.step-card span {
  position: absolute;
  top: -28px;
  left: 50%;
  transform: translateX(-50%);
  width: 56px;
  height: 56px;
  font-size: 2rem;
  color: var(--color-text-extralight);
  background: var(--main-color);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 12px;
  line-height: 1;
  flex-shrink: 0;
}
.step-card p {
  max-width: 320px;
  margin: 0 auto;
  text-align: center;
  color: var(--color-text-dark);
  line-height: 1.5;
}
/* end STEP CARD */
/* SIMPLE IMG CARD */
.simple-imgcards {
  margin: -20px;
  display: flex;
}
.simple-imgcard-wrapper {
  padding: 20px;
  flex-basis: 33.33%;
}
.simple-imgcard {
  padding: 32px;
  display: flex;
  background: var(--bg-color);
  border-radius: var(--border-radius-card);
  overflow: hidden;
  position: relative;
  min-height: 220px;
  height: 100%;
}
.simple-imgcard-content {
  /* position: relative; */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  gap: 24px;
  flex-basis: 70%;
  z-index: 1;
}
.simple-imgcard-content.light .card-title,
.simple-imgcard-content.light .link-detail a {
  color: var(--color-text-extralight);
}
.simple-imgcard-img {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 50%;
  display: flex;
  justify-content: end;
  align-items: end;
}
.simple-imgcard-img img {
  object-fit: contain;
  object-position: right bottom;
  width: 100%;
}
/* end SIMPLE IMG CARD */
/* TWO IMG BLOCK */
.two-img-block {
  padding: 56px 40px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  background: var(--bg-color);
  border-radius: var(--border-radius-section);
}
.two-img-block-row {
  min-height: 200px;
  display: flex;
  justify-content: space-between;
  gap: 80px;
}
.two-img-block-row.leftimg {
  flex-direction: row-reverse;
}
.two-img-row-item {
  flex-basis: calc(50% - 40px);
  flex-shrink: 0;
}
.two-img-row-item.text {
  max-width: 450px;
  margin-top: 56px;
  margin-right: auto;
}
.two-img-row-item.img {
  display: flex;
  justify-content: right;
  align-items: center;
  border-radius: var(--border-radius-section);
  overflow: hidden;
  min-height: 100px;
}
.two-img-block-row.leftimg .two-img-row-item.img {
  justify-content: left;
}
.two-img-row-item.img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
/* end TWO IMG BLOCK */
/* MINI BLOCK */
.mini-block-wrapper {
  background: var(--bg-color);
  padding: 40px 40px 0 40px;
  border-radius: var(--border-radius-section);
}
.mini-block {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 48px;
}
.mini-block-wrapper .mini-block {
  gap: 24px;
}
.mini-block-text {
  max-width: 550px;
  display: flex;
  flex-direction: column;
}
.mini-block-wrapper .mini-block-text {
  margin-bottom: 24px;
}
.mini-block-text-elem h5 {
  font-size: var(--size-title);
  color: var(--color-text-dark);
  margin-bottom: 16px;
}
.mini-block-text-elem p {
  line-height: 1.5;
}
.mini-block-btn {
  padding: 16px 32px;
  background: var(--main-color);
  width: max-content;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin-top: 40px;
  color: var(--color-bg-extralight);
  border-radius: var(--border-radius-btn);
  cursor: pointer;
}
.mini-block-btn:hover {
  background: var(--color-btn-hover);
}
.mini-block-img {
  flex-basis: 40%;
  /* height: 300px; */
  margin-top: auto;
  height: auto;
  display: flex;
  justify-content: end;
  align-items: center;
}
.mini-block-wrapper.beforebg .mini-block-img {
  z-index: 1;
}
.mini-block-img img {
  height: 100%;
  width: 100%;
  max-height: 300px;
  object-fit: contain;
  object-position: center center;
}
.mini-block-wrapper .mini-block-img img {
  object-position: center bottom;
}
/* end MINI BLOCK */
/* FAQ */
.faq {
  max-width: 960px;
  margin: 0 auto;
}
.faq-item {
  padding: 24px 32px;
  background: var(--color-bg-lightgray);
  border-radius: 16px;
  line-height: 1.5;
  position: relative;
}
.faq-item:not(:last-child) {
  margin-bottom: 24px;
}
.faq-item-question {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  color: var(--color-text-dark);
  font-weight: 600;
  cursor: pointer;
}
.faq-item-question img {
  width: 24px;
  transition: all 0.4s;
}
.faq-item-answer {
  height: 0;
  opacity: 0;
  overflow: hidden;
  transition: all 0.5s;
  animation: answerHide 0.1s ease;
}
.faq-item-answer-inner {
  padding: 0 32px;
}
.faq-item-answer-inner a {
  color: var(--main-color);
}
.faq-item-answer-inner ul li {
  padding: 4px 0 4px 26px;
  position: relative;
}
.faq-item-answer-inner ul li:before {
  content: "";
  position: absolute;
  top: 11px;
  left: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--main-color);
}
.faq-item-answer p:not(:first-child) {
  margin-top: 16px;
}
.faq-item.active .faq-item-question img {
  transform: rotate(45deg);
}
.faq-item.active .faq-item-answer {
  padding: 24px 0;
  height: 100%;
  opacity: 1;
  margin-top: 0;
  transition: all 0.5s;
  animation: answerShow 3s ease infinite;
}

@keyframes answerShow {
  0% {
    height: 0;
  }
  100% {
    height: 100%;
  }
}
@keyframes answerHide {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
/* end FAQ */
/* TARIFFS */
.tariffs-wrapper {
  width: 100%;
  position: relative;
}
.tariffs {
  width: 100%;
  /* margin: 0 -40px; */
  /* margin-left: -40px;
  margin-right: -40px; */
  overflow: hidden;
}
.tariffs-table-wrapper {
  margin-left: -40px;
  margin-right: -40px;
  overflow-x: auto;
  overflow-y: hidden;
}
.tariffs table {
  /* border-collapse: collapse; */
  width: 100%;
  border-spacing: 40px 0;
}
/* .tariffs::-webkit-scrollbar-track {
  background-color: none;
} */
.tariffs table th,
td {
  /* border: 1px solid gray; */
  vertical-align: top;
  background: var(--color-bg-extralight);
  text-align: center;
  line-height: 1.3;
  position: relative;
}
.tariffs table th {
  position: relative;
  width: 33.3%;
  border-top-left-radius: 28px;
  border-top-right-radius: 28px;
  padding: 40px;
  min-width: 220px;
}
.tariffs table th::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  inset: 8px;
  background: var(--bg-color);
  border-top-left-radius: 24px;
  border-top-right-radius: 24px;
}
.tariffs table th:not(:first-child) {
  color: var(--color-text-extralight);
}
.tariffs table th p {
  font-weight: 400;
  position: relative;
}
.tariffs table td {
  padding: 24px 40px;
  /* border-right: 40px solid var(--color-bg-extralight);
  border-left: 40px solid var(--color-bg-extralight); */
  line-height: 1.4;
  font-size: 0.875rem;
}
.tariffs table tbody tr:first-child td {
  padding-top: 10px;
  padding-bottom: 36px;
}
.tariffs table tr:not(:last-child) td::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 40px;
  width: calc(100% - 80px);
  height: 1px;
  background-color: var(--color-border-gray);
  z-index: 1;
}
.tarif-cost {
  display: inline-block;
  padding: 12px 32px;
  border-radius: 12px;
  background: var(--bg-color);
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--color-text-extralight);
  white-space: nowrap;
  margin-bottom: 8px;
}
.tarif-cost.text-dark {
  color: var(--color-text-dark);
}
.tarif-cost small {
  font-size: 1rem;
  font-weight: 400;
}
.tariffs table tr:last-child td {
  border-bottom-left-radius: 28px;
  border-bottom-right-radius: 28px;
  padding-bottom: 29px;
}
.tariffs table th h4 {
  display: inline-block;
  padding-bottom: 8px;
  position: relative;
  font-size: 1.5rem;
  font-weight: 600;
  text-transform: uppercase;
}
.tariffs table th h4::before {
  content: "";
  width: 48px;
  height: 1px;
  background-color: var(--color-border-gray);
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}
.tariffs table th p {
  margin-top: 8px;
  line-height: 1.5;
}
.tariffs table td p {
  font-weight: 400;
  color: var(--color-text-dark);
}
.tariffs table td .top-line {
  /* font-size: 0.875; */
  margin-bottom: 16px;
  color: var(--color-text-light);
}
.tariffs table td h6 {
  font-size: 1rem;
  margin-bottom: 4px;
  color: var(--color-text-dark);
  line-height: 1.5;
}
.tariffs-link {
  margin-top: 40px;
  text-align: center;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.5;
  font-size: 0.875rem;
}
.tariffs-link a {
  display: inline-block;
  position: relative;
  color: var(--main-color);
  line-height: 1.5;
  font-size: 1rem;
}
.tariffs-link > p {
  margin-top: 8px;
}
.tariffs-link a .icon {
  margin-left: 8px;
}

.tariffs-link a.tariffs-link-desk::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--main-color);
}
.tariffs-link a.tariffs-link-mob {
  display: none;
}
.tariffs-tabs {
  display: none;
  border-radius: 12px;
  border: 1px solid var(--color-border-gray);
  /* margin: 0 16px; */
  padding: 8px;
  margin-bottom: 40px;
  background: var(--color-bg-extralight);
  position: sticky;
  top: 100px;
  z-index: 10;
}
.tarif-tab {
  padding: 12px 32px;
  text-transform: uppercase;
  border-radius: 12px;
}
.tarif-tab.active {
  background: var(--main-color);
  color: var(--color-text-extralight);
}
@media (max-width: 900px) {
  /* .tariffs {
    margin: 0 -16px;
  } */
  .tariffs-table-wrapper {
    margin-left: -16px;
    margin-right: -16px;
  }
  .tariffs table {
    border-spacing: 16px 0;
  }
  .tarif-cost {
    padding: 12px 24px;
    font-size: 1rem;
  }
  .tariffs table th {
    padding: 32px 24px;
  }
  .tariffs table td {
    padding: 24px;
  }
  .tariffs table tr:not(:last-child) td::before {
    width: calc(100% - 48px);
    left: 24px;
  }
  .tariffs-link {
    margin-top: 24px;
  }
}
@media (max-width: 500px) {
  .tariffs-wrapper {
    padding: 40px 16px;
    background: var(--color-bg-extralight);
    border-radius: var(--border-radius-card);
    overflow: visible;
  }
  .tariffs-tabs {
    display: flex;
    justify-content: space-between;
    gap: 0;
  }
  .tarif-tab {
    padding: 12px 16px;
    font-size: 0.875rem;
  }
  .tariffs table td {
    padding: 24px 16px;
    border-left: 1px solid var(--color-border-gray);
    border-right: 1px solid var(--color-border-gray);
  }
  .tariffs table tbody tr:first-child td {
    padding: 2px 16px 24px 16px;
  }
  .tariffs table tr:not(:last-child) td::before {
    width: calc(100% - 32px);
    left: 16px;
  }
  .tariffs table th {
    border: 1px solid var(--color-border-gray);
    border-bottom: none;
  }
  .tariffs table tr:last-child td {
    border-bottom: 1px solid var(--color-border-gray);
  }
  /* .tariffs table tr th:nth-child(2) {
    display: none;
  }
  .tariffs table tr th:nth-child(3) {
    display: none;
  }
  .tariffs table tr td:nth-child(2) {
    display: none;
  }
  .tariffs table tr td:nth-child(3) {
    display: none;
  } */
}
@media (max-width: 450px) {
  /* .tariffs-link a.tariffs-link-mob {
    display: inline-block;
  } */
  .tariffs-link a.tariffs-link-desk::before {
    display: none;
  }
  .tariffs-link a.tariffs-link-desk {
    /* display: none; */
    text-decoration: underline;
    text-underline-offset: 5px;
  }
}
/* end TARIFFS */
/* TABS BLOCK */
.tabs-content {
/* display: flex; */
   height: 100%; 
}
.tabs-section {
  background: var(--bg-color);
  border-radius: var(--border-radius-section);
}
.tabs {
  min-height: 60px;
  position: relative;
  display: flex;
  justify-content: center;
  margin-bottom: 40px;
}
.tabs-block .tabs label {
  display: none;
}
.tabs-wrapper {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  padding: 8px;
  gap: 16px;
  border: 1px solid var(--color-border-gray);
  border-radius: 16px;
}
.tabs-item {
  padding: 8px 24px;
  border-radius: 12px;
  color: var(--color-text-medium);
  line-height: 1.5;
  /* white-space: nowrap; */
  cursor: pointer;
}
.tabs-item.active {
  background: var(--main-color);
  color: var(--color-text-extralight);
}
.content-item {
  display: none;
  /* display: flex; */
  justify-content: space-between;
  gap: 40px;
}
.content-item.active {
  display: flex;
}
.content-item-img {
  /* margin-top: 16px; */
  flex-basis: calc(50% - 20px);
  height: auto;
  /* margin-top: auto; */
  margin-bottom: auto;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: end;
  position: relative;
  /* border-radius: var(--border-radius-section); */
}
.content-item-img::before {
  content: "";
  position: absolute;
  top: 80%;
  left: 0;
  bottom: -3px;
  width: 100%;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 18%,
    var(--bg-color) 90%
  );
}
.content-item-img img {
  width: 100%;
  /*height: 440px;*/
max-height: 420px;
  object-fit: contain;
  /* object-position: center bottom; */
  object-position: center top;
}
.content-item-text {
  flex-basis: calc(50% - 20px);
  line-height: 1.5;
 /* padding-bottom: 24px; */
  padding-bottom: 40px;
}
.content-item h6 {
  font-size: 1.5rem;
  margin-bottom: 24px;
  line-height: 1.21;
  color: var(--color-text-dark);
}
.content-item-text-group li,
.content-item-text-group p {
  margin-bottom: 8px;
}
.content-item-text ul {
  margin-bottom: 24px;
}
.content-item-text .list-marker > li {
  position: relative;
  padding-left: 26px;
}
.content-item-text .list-marker > li::before {
  content: "";
  position: absolute;
  top: 0.5rem;
  left: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--main-color);
}
.content-item-text .list-marker li:not(:last-child) {
  margin-bottom: 8px;
}
.content-item-text .list-marker label {
  display: flex;
  align-items: center;
  gap: 16px;
}
.content-item-text .list-marker label .icon {
  font-size: 11px;
  font-weight: 600;
}
.content-item-text .list-marker .dropdown {
  display: none;
}
.content-item-text .list-marker li > input[hidden]:checked ~ label .icon {
  transform: rotate(180deg);
}
.content-item-text .list-marker li > input[hidden]:checked ~ .dropdown {
  display: block;
  margin-top: 8px;
}
.content-item-text-group b {
  color: var(--color-text-dark);
  font-weight: 600;
}
.light .content-item-text-group b {
  color: var(--color-text-extralight);
}
.content-item-text-group > label {
  position: relative;
  display: flex;
  align-items: center;
  font-weight: 600;
  color: var(--color-text-dark);
  margin-top: 8px;
  margin-bottom: 8px;
  cursor: pointer;
}
.content-item-text-group > label .icon {
  font-size: 10px;
  margin-left: 16px;
  font-weight: 400;
}
.toggle-content {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1;
  background: var(--bg-color);
  padding: 24px;
  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.1);
  border-radius: 16px;
}
.content-item-text-group > input[type="checkbox"]:checked ~ label .icon {
  transform: rotate(180deg);
}
.content-item-text-group
  > input[type="checkbox"]:checked
  ~ .wrapper-relative
  .toggle-content {
  display: block;
}
@media (max-width: 900px) {
  .tabs {
    margin-bottom: 40px;
  }
  .content-item {
    flex-wrap: wrap;
    gap: 34px;
  }
  .content-item-img {
    flex-basis: 100%;
    margin-top: 0;
    max-height: 300px;
    position: relative;
  }
 .content-item-img img {
    max-height: 300px;
height: auto;
  }
  .content-item-text {
    flex-basis: 100%;
        padding-bottom: 16px;
  }
  .toggle-content {
    position: relative;
    padding: 0;
    box-shadow: none;
  }
}
@media (max-width: 500px) {
  .tabs-block .tabs label {
    display: inline-block;
    position: absolute;
    width: 100%;
    padding: 16px;
    top: 4px;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: end;
    z-index: 2;
  }
  .tabs-wrapper {
    background: var(--bg-color);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1;
    flex-grow: 1;
  }
  .tabs-item {
    padding: 8px;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    visibility: hidden;
  }
  .tabs-item.active {
    position: relative;
    visibility: visible;
    background: none;
    color: var(--main-color);
    padding-right: 32px;
  }
  #open-tabs:checked ~ label {
    width: max-content;
    margin-left: auto;
  }
  #open-tabs:checked ~ label .icon {
    transform: rotate(180deg);
    position: static;
    z-index: 3;
  }
  #open-tabs:checked ~ .tabs-wrapper > .tabs-item {
    position: relative;
    visibility: visible;
  }
}
/* end TABS BLOCK */
/* BLOCK IMG RIGHT */
.block-imgright {
  padding: 56px 40px 0 40px;
  background: var(--bg-color);
  overflow: hidden;
  border-radius: var(--border-radius-section);
}
.block-imgright-inner {
  display: flex;
  justify-content: space-between;
  gap: 80px;
  position: relative;
}
.block-imgright-text {
  flex-basis: calc(50% - 40px);
  padding-top: 40px;
  padding-bottom: 56px;
display: flex;
    flex-direction: column;
}
.block-imgright-img {
  width: calc(50% - 40px);
  display: flex;
  align-items: end;
  justify-content: end;
}
.block-imgright-img img {
  width: 100%;
  height: 100%;
  max-height: 470px;
  object-fit: contain;
    /* object-position: right bottom; */
  object-position: center bottom;
}
.block-list-bold li {
  position: relative;
  padding-left: 26px;
}
.block-list-bold li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.7rem;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--main-color);
}
.block-list-bold li h6 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--color-text-dark);
  margin-bottom: 16px;
}
.block-list-bold li p {
  line-height: 1.5;
}
.block-list-bold li:not(:last-child) {
  margin-bottom: 24px;
}
/* end BLOCK IMG RIGHT */

/* TWO CARDS block */
.two-cards {
  display: flex;
  justify-content: space-between;
  gap: 40px;
}
.two-cards-item {
  flex-basis: calc(50% - 20px);
  padding: 56px 40px;
  background: var(--bg-color);
  border-radius: var(--border-radius-section);
}
.two-cards-item-img {
  position: relative;
  padding: 0 30px;
  height: 400px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 40px;
}
.two-cards-item-img::before {
  content: "";
  position: absolute;
  top: 80%;
  left: 0;
  bottom: -3px;
  width: 100%;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 18%,
    var(--bg-color) 90%
  );
}
.two-cards-item-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
}
/* end TWO CARDS block */

/* SIMPLE BLOCK */
.simple-block {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 80px;
}
.simple-block-img {
  height: 350px;
  max-height: 350px;
  flex-basis: calc(50% - 40px);
  display: flex;
  justify-content: center;
  align-items: center;
  /* overflow: hidden; */
}
.simple-block-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.simple-block-text {
  flex-basis: calc(50% - 40px);
}
.simple-block-text > h4 {
  color: var(--color-text-dark);
  font-weight: 600;
  font-size: var(--size-title);
}
.simple-block.career .block-list-bold li h6 {
  margin-bottom: 8px;
}
.simple-block.career .block-list-bold li:not(:last-child) {
  margin-bottom: 16px;
}
/* end SIMPLE BLOCK */

/* INVITE */
.invite {
  padding: 56px 40px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  background: var(--bg-color);
  border-radius: var(--border-radius-card);
  border: 1px solid var(--border);
  position: relative;
  overflow: hidden;
}
.invite.spotty {
  padding: 32px 40px;
}
.invite.spotty::before {
  content: "";
  position: absolute;
  left: 38%;
  top: -100px;
  width: 400px;
  height: 150px;
  background: var(--before-bg);
  border-radius: 48% 52% 77% 23% / 46% 24% 76% 54%;
}
.invite.spotty::after {
  content: "";
  position: absolute;
  right: -50px;
  top: 60%;
  width: 400px;
  height: 200px;
  transform: rotate(12deg);
  background: var(--before-bg);
  border-radius: 48% 52% 77% 23% / 46% 24% 76% 54%;
}
.invite-text {
  flex-grow: 1;
  z-index: 1;
}
.invite-text h4 {
  color: var(--color-text-dark);
  margin-bottom: 16px;
  font-weight: 600;
  font-size: var(--size-card-title);
}
.invite-text p {
  line-height: 1.5;
}
.invite-text p a {
  color: var(--main-color);
}
.invite-text p a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.invite-btn a{
  white-space: nowrap;
}
.invite-btn button {
  padding: var(--padding-btn);
  border-radius: var(--border-radius-btn);
  background: var(--main-color);
  color: var(--color-bg-extralight);
  white-space: nowrap;
  cursor: pointer;
  position: relative;
  z-index: 1;
}
.invite-btn button:hover {
  background: var(--color-btn-hover);
}
/* end INVITE */
/* INFO BLOCK */
.info-block {
  padding: 40px;
  border-radius: var(--border-radius-section);
  background: var(--bg-color);
}
.info-block .block-title {
  text-align: center;
  max-width: 850px;
  margin: 0 auto;
}
.info-block p {
  line-height: 1.5;
}
.info-block p:not(:last-child) {
  margin-bottom: 16px;
}
.info-block a {
  text-decoration: underline;
  text-underline-offset: 3px;
}
/* end INFO BLOCK */
/* LIGHT CARDS */
.light-cards {
  display: flex;
  justify-content: space-between;
  margin: -20px;
  flex-wrap: wrap;
}
.light-card-wrapper {
  flex-basis: 33.33%;
  padding: 20px;
}
.light-card {
  height: 100%;
  padding: 32px;
  min-height: 256px;
  background: var(--bg-color);
  border-radius: var(--border-radius-card);
  position: relative;
  overflow: hidden;
}
.light-card::before {
  content: "";
  width: 400px;
  height: 200px;
  position: absolute;
  right: 30%;
  /* left: -74px; */
  /* top: 70%; */
  bottom: -125px;
  transform: rotate(-7deg);
  background: var(--before-color);
  border-radius: 61% 39% 63% 37% / 74% 20% 80% 11%;
}
.three .light-card-wrapper {
  flex-grow: 1;
}
.three .light-card::before {
  left: -130px;
}
.light-card-icon {
  width: 32px;
  height: 32px;
  margin-bottom: 24px;
}
.light-card-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.light-card-text {
  position: relative;
  z-index: 1;
}
.light-card .mono-card-title {
  color: var(--title-color);
}
.light-card .mono-card-paragraph {
  color: var(--p-color);
}
/* end LIGHT CARDS */

/* NTH2 CARDS */
.nth2-cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: -24px -20px;
}
.nth2-cards.reverse {
  flex-direction: row-reverse;
}
.nth2-card-wrapper {
  padding: 24px 20px;
  flex-basis: 45%;
}
.nth2-card-wrapper:nth-child(2),
.nth2-card-wrapper:nth-child(3),
.nth2-card-wrapper:nth-child(6),
.nth2-card-wrapper:nth-child(7) {
  flex-basis: 55%;
}
.nth2-card {
  padding: 32px;
  height: 100%;
  position: relative;
  background: var(--bg-color);
  overflow: hidden;
  border-radius: var(--border-radius-card);
  min-height: 300px;
  display: flex;
  justify-content: space-between;
}
.nth2-card::before {
  content: "";
  position: absolute;
  width: 600px;
  height: 300px;
  top: 65%;
  right: 49%;
  transform: rotate(-2deg);
  background: var(--before-color);
  /* border-radius: 58% 42% 100% 0% / 18% 19% 81% 82%; */
  border-radius: 52% 48% 40% 60% / 27% 29% 71% 68%;
}
.nth2-card-inner {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: static;
  z-index: 2;
}
.nth2-card-img {
  margin-top: auto;
 /* width: 40%;*/
width: calc(45% - 24px);
  flex-shrink: 0;
  height: calc(100% - 54px);
  position: absolute;
  right: 32px;
  bottom: -1px;
  z-index: 1;
}
.nth2-card-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: right bottom;
}
.nth2-card .mono-card-title {
  color: var(--title-color);
}
.nth2-card .mono-card-paragraph {
 /* max-width: 60%; */
max-width: 55%;
  color: var(--p-color);
}
.nth2-card .link-detail {
  margin-top: 24px;
  z-index: 1;
}
.nth2-card .link-detail a {
  color: var(--link-color);
}
/* end NTH2 CARDS */
/* DIFFERENT CARDS */
.different-cards {
  margin: -20px;
  display: flex;
  justify-content: space-between;
}
.different-cards.reverse {
  flex-direction: row-reverse;
}
.different-card-wrapper {
  padding: 20px;
}
.different-card-wrapper.tower {
  flex-basis: 480px;
min-width: 350px;
}
.different-cards-row {
  flex-grow: 1;
}
.different-card {
  position: relative;
  padding: 32px;
  background: var(--bg-color);
  min-height: 280px;
  height: 100%;
  border-radius: var(--border-radius-card);
  overflow: hidden;
}
.different-card::before {
  content: "";
  position: absolute;
  width: 600px;
  height: 300px;
  top: 65%;
  right: 50%;
  transform: rotate(-2deg);
  background: var(--before-color);
  border-radius: 52% 48% 40% 60% / 27% 29% 71% 68%;
}
.different-card-text {
  position: relative;
  z-index: 1;
}
.different-card .mono-card-title {
  color: var(--title-color);
}
.different-card .mono-card-paragraph {
  color: var(--p-color);
  width: 60%; 
 /* width: 50%; */
}
.different-card .inner-block-list {
  width: 60%;
 color: var(--p-color);
}
.different-card-wrapper.tower .inner-block-list {
  width: 100%;
}
.different-card-img {
  /* width: 40%; */
   height: 80%; 
 /* height: 75%; */
  position: absolute;
  right: 32px;
  /* left: 50%; */
  left: 60%;
  bottom: -1px;
  display: flex;
  justify-content: end;
}
.different-card-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: right bottom;
}
.different-card-wrapper.tower .different-card-img {
  right: 32px;
  left: 32px;
}
.different-card-wrapper.tower .mono-card-paragraph {
  width: 100%;
}
.imgmax .different-card-img {
  height: 95%;
}
  .imgmax .different-card-wrapper.tower .different-card-img {
    height: 95%;
  }
/* end DIFFERENT CARDS */
/* FIVE CARDS */
.five-cards {
  margin: -20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.fifthcard-wrapper {
  padding: 20px;
  flex-grow: 1;
}
.fifthcard {
  padding-top: 32px;
  position: relative;
  overflow: hidden;
  min-height: 360px;
  background: var(--bg-color);
  border-radius: var(--border-radius-card);
  height: 100%;
  display: flex;
  /* gap: 32px; */

  justify-content: space-between;
}
.fifthcard::before {
  content: "";
  position: absolute;
  width: 600px;
  height: 300px;
  /* top: 65%; */
  /* right: 50%; */
  bottom: -180px;
  left: -220px;
  transform: rotate(-2deg);
  background: var(--before-color);
  border-radius: 52% 48% 40% 60% / 27% 29% 71% 68%;
}
.fifthcard-text {
  padding: 0 32px 32px;
  flex-grow: 1;
  z-index: 1;
}
.fifthcard-text h5 {
  color: var(--title-color);
  margin-bottom: 8px;
  font-weight: 600;
  font-size: var(--size-card-title);
}
.fifthcard-text p {
  color: var(--p-color);
}
.fifthcard .link-detail {
  position: absolute;
  left: 32px;
  bottom: 40px;
  z-index: 3;
}
.fifthcard .link-detail a {
  color: var(--link-color);
}
.fifthcard-img {
  width: 50%;
  flex-shrink: 0;
  align-self: end;
  display: flex;
  align-items: end;
  z-index: 1;
}
.fifthcard-img img {
  width: 100%;
  max-height: 330px;
  object-fit: contain;
  object-position: right bottom;
}
.fifthcard-wrapper:nth-child(1) .fifthcard,
.fifthcard-wrapper:nth-child(2) .fifthcard,
.fifthcard-wrapper:nth-child(3) .fifthcard,
.fifthcard-wrapper:nth-child(4) .fifthcard {
  flex-direction: column;
}
.fifthcard-wrapper:nth-child(1),
.fifthcard-wrapper:nth-child(2) {
  flex-basis: 50%;
}
.fifthcard-wrapper:nth-child(3) {
  flex-basis: 60%;
}
.fifthcard-wrapper:nth-child(4) {
  flex-basis: 40%;
}
/* end FIVE CARDS */
/* BLOCK-ICONS */
.block-icons {
  display: flex;
  justify-content: space-between;
  gap: 10%;
}
.block-icons-img {
  flex-basis: 45%;
  min-height: 300px;
display: flex;
}
.block-icons-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
max-height: 350px;
}
.block-icons-list {
  flex-grow: 1;
  padding-top: 32px;
}
.icons-list li {
  position: relative;
  line-height: 1.5;
  padding-left: 48px;
  padding-top: 4px;
  padding-bottom: 4px;
}
.icons-list li:not(:last-child) {
  margin-bottom: 20px;
}
.icons-list li span {
  position: absolute;
  left: 0;
  top: 0;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px;
  background: var(--main-color);
  border-radius: 7px;
  color: var(--color-text-dark);
}
.icons-list li span img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
/* end BLOCK-ICONS */
/* IMG-CARDS */
.img-cards {
  display: flex;
  justify-content: space-between;
  margin: -20px;
}
.img-card-wrapper {
  padding: 20px;
  flex-basis: 33.33%;
}
.two .img-card-wrapper {
  flex-basis: 50%;
  min-width: 330px;
}
.img-card {
  padding: 32px 32px 0 32px;
  background: var(--bg-color);
  border-radius: var(--border-radius-card);
  height: 100%;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  overflow: hidden;
  /* min-height: 400px; */
  text-align: center;
}
.img-card-title {
  color: var(--title-color);
  font-size: var(--size-card-title);
  font-weight: 600;
  margin-bottom: 56px;
  text-align: center;
}
.img-card.light,
.img-card.light .card-title {
  color: var(--color-text-extralight);
}
.img-card-img {
   position: relative;
  /* max-height: 283px; */
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: end;
}
/*.img-card-img::before {
  content: "";
  position: absolute;
  top: 80%;
  left: 0;
  bottom: -3px;
  width: 100%;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 18%,
    var(--bg-color) 90%
  );
}*/
.img-card-img img {
  width: 100%;
  height: 100%;
 max-height: 280px;
margin-bottom: -1px;
  object-fit: contain;
  object-position: center bottom;
}
/* end IMG-CARDS */
/* LINE STEPS */
.line-steps {
  padding: 56px 40px;
  text-align: center;
  background: var(--color-bg-extralight);
  border-radius: var(--border-radius-section);
}
.line-steps-title {
  font-size: var(--size-title);
  font-weight: 600;
  color: var(--color-text-dark);
  margin-bottom: 50px;
}
.line-steps-content {
  display: flex;
  justify-content: space-between;
  margin: -16px;
}
.line-step {
  flex-basis: 33.4%;
  display: flex;
  flex-direction: column;
  gap: 28px;
  align-items: center;
  position: relative;
  padding: 16px;
}
.line-step::before {
  content: "";
  position: absolute;
  top: 45px;
  left: 0;
  height: 2px;
  width: 100%;
  background: var(--color-border-gray);
}
.line-step:first-child::before {
  left: 50%;
  width: 50%;
}
.line-step:last-child::before {
  right: 50%;
  width: 50%;
}
.line-step-number {
  position: relative;
  font-size: 32px;
  font-weight: 600;
  width: 56px;
  height: 56px;
  border-radius: 12px;
  background: var(--main-color);
  flex-shrink: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--color-text-extralight);
  z-index: 1;
}
.line-step p {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--color-text-dark);
}
/* end LINE STEPS */

/* end MAIN */
/* MODAL FORM*/
.modal {
  display: none;
  overflow: auto;
  position: fixed;
  pointer-events: auto;
overscroll-behavior: contain;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  backdrop-filter: blur(2px) saturate(99%);
  -webkit-backdrop-filter: blur(3px) saturate(99%);
  background-color: rgba(101, 101, 101, 0.25);
  z-index: 2000;
}
/* .bunner-modal {
  display: none;
  overflow: auto;
  position: fixed;
  pointer-events: auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(228, 228, 228, 1);
  z-index: 2000;
} */
.modal-form-wrapper {
  width: 100%;
min-height: 100vh;
  padding: 30px 15px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.modal-form {
  max-width: 456px;
  min-width: 250px;
  padding: 32px;
  background: var(--color-bg-extralight);
  border-radius: 24px;
  position: relative;
  line-height: 1.5;
}
.modal-form-close {
  position: absolute;
  padding: 8px;
  top: 31px;
  right: 24px;
  cursor: pointer;
  color: var(--color-text-dark);
}
.modal-form-close.success {
  padding: 16px;
  top: 0;
  right: 0;
  color: var(--color-text-medium);
}
.modal-form-body {
  max-width: 310px;
  /* margin-right: 52px; */
min-height: 300px;
}
.modal-form-body.success {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 32px;
}
.modal-form-body.success img {
  width: 80px;
margin-top: 20px;
}
.modal-form-body.success h6 {
  color: var(--color-text-dark);
  font-size: 1.25rem;
  font-weight: 600;
  text-align: center;
}
.modal-form-body.success button {
  color: var(--main-color);
  padding: 16px 32px;
  border: 1px solid var(--main-color);
  border-radius: 12px;
margin-top: 8px;
}
.modal-form-body.success button:hover {
  color: var(--color-text-extralight);
  background: var(--main-color);
}
.modal-form-title {
  color: var(--color-text-dark);
  font-size: var(--size-card-title);
  margin-bottom: 24px;
  font-weight: 600;
}
.modal-form-success {
  color: var(--main-color);
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 16px;
}
.modal-form-input {
  margin-bottom: 16px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.modal-form-input label {
  width: 100%;
  margin-bottom: 4px;
  line-height: 1.2;
  font-size: 0.875rem;
  color: var(--color-text-medium);
}
.modal-form-input .form-required {
  /* visibility: hidden; */
  margin-left: 2px;
}
.modal-form-input input,
.modal-form-input select {
  width: 100%;
  padding: 16px;
  border-radius: 5px;
  color: var(--color-text-dark);
  /* font-weight: 600; */
  font-size: 1rem;
  border: 1px solid var(--color-border-gray);
}
.modal-form-input input::placeholder {
  font-family: "SF Pro Display", sans-serif;
  font-size: 0.875rem;
  color: var(--color-text-light);
}
.modal-form-input > select {
  padding: 16px 30px 16px 16px;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  position: relative;
  background-image: url(../img/icons-svg/shevron-down.svg);
  background-repeat: no-repeat;
  background-position: right 10px top 50%;
  background-size: 14px 14px;
}
.modal-form-btn input {
  /* display: block; */
  display: inline-block;
  width: max-content;
  padding: var(--padding-btn);
  background: var(--main-color);
  color: var(--color-text-extralight);
  cursor: pointer;
  border-radius: var(--border-radius-btndefault);
}
.modal-form-btn input:hover {
  background: var(--color-btn-hover);
}
.modal-form-input input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin-right: 8px;
  margin-top: 2px;
}
.modal-form-input input[type="checkbox"] ~ label {
  width: calc(100% - 24px);
  font-size: 1rem;
  color: var(--color-text-dark);
  margin-bottom: 0;
  cursor: pointer;
}

.modal-form-input input[type="checkbox"] ~ label a {
  color: var(--main-color);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.modal-form-captcha {
  margin-top: 24px;
  margin-bottom: 24px;
}
.modal-form-captcha-code img {
  height: 40px;
  max-width: 100%;
}
.modal-form-captcha .reload {
  width: 100%;
  display: flex;
  align-items: center;
  padding: 4px 0;
  gap: 8px;
  font-size: 0.875rem;
  height: max-content;
  cursor: pointer;
line-height: 1;
}
.modal-form-captcha .reload img {
  display: inline-block;
  width: 16px;
  max-height: 16px;
}
.error-field {
  color: #ff0000;
  font-size: 0.875rem;
  margin-bottom: 4px;
  line-height: 1.25;
}
.modal-form-required-fields {
  margin-bottom: 16px;
  color: #ff0000;
  font-size: 0.875rem;
}
.modal-form-input label > img {
  width: 100%;
  max-height: 80px;
  border-radius: 7px;
  object-fit: contain;
  object-position: center;
}
.modal-form-input label:has(input[type="radio"]) {
  width: 20px;
}
.modal-form-input label:has(img) {
  width: calc(50% - 20px);
}
.form-apbid h6 {
  font-size: 18px;
  font-weight: 600;
  margin-top: 24px;
  margin-bottom: 8px;
}
/* end MODAL FORM*/
/* BASE CLASSES */
.mt-n8 {
  margin-top: -8px;
}
.mt-8 {
  margin-top: 8px;
}
.mt-16 {
  margin-top: 16px;
}
.mt-24 {
  margin-top: 24px;
}
.mt-32 {
  margin-top: 32px;
}
.mt-40 {
  margin-top: 40px;
}
.mt-56 {
  margin-top: 56px;
}
.mb-8 {
  margin-bottom: 8px;
}
.mb-16 {
  margin-bottom: 16px;
}
.mb-24 {
  margin-bottom: 24px;
}
.mb-32 {
  margin-bottom: 32px;
}
.mb-40 {
  margin-bottom: 40px;
}
.mb-56 {
  margin-bottom: 56px;
}
.lh-150 {
  line-height: 1.5;
}
.text-dark {
  color: var(--color-text-dark);
}
.text-bold {
  font-weight: 600;
}
.text-error {
  color: var(--error-color);
}
.text-success {
  color: var(--success-color);
}
.no-wrap {
  white-space: nowrap;
}
u {
  text-underline-offset: 3px;
}
.section {
  margin-top: 56px;
  margin-bottom: 96px;
  /* margin-top: 96px; */
  overflow: hidden;
  width: 100%;
}
.section-wrapper {
  background: var(--bg-color);
  padding: 56px 40px;
  border-radius: var(--border-radius-section);
}
.card-linkoverlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}
.over-visible {
  overflow: visible;
}
.wrapper-relative {
  position: relative;
}
.section-title {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 56px;
  text-align: center;
}
.section-title h5 {
  font-weight: 600;
  font-size: var(--size-title);
  color: var(--color-text-dark);
}
.section-title p {
  margin-top: 16px;
  line-height: 1.5;
}
.section-title.inner {
  padding: 56px 16px 0 16px;
  margin-bottom: 0;
}
.block-title {
  font-weight: 600;
  font-size: var(--size-card-title);
  color: var(--color-text-dark);
}
.block-padding {
  /*padding: 56px 40px; */
 padding: 56px 40px 0 40px;
}
.block-descr {
  line-height: 1.5;
}
.card-title {
  font-size: var(--size-card-title);
  color: var(--color-text-dark);
}
.content-block {
  background: var(--bg-color);
  border-radius: 32px;
 /* padding: 56px 100px 0 100px; */
  padding: 56px 40px 0 40px;
}
.content-block-inner {
  display: flex;
  justify-content: space-between;
  /* padding: 56px 100px 0 100px; */
}
.content-block-img-bottom {
  flex-basis: 50%;
  display: flex;
  justify-content: center;
  align-items: end;
  /* padding-top: 30px; */
  padding-right: 40px;
  min-height: 100px;
margin-top: auto;
  /* height: 400px; */
  height: auto;
  max-height: 400px;
}
.content-block-img-bottom.img-top {
  margin-top: 0;
}
.content-block-img-bottom img {
  /* max-width: 100%;
  object-fit: contain; */
  height: 100%;
  width: 100%;
max-height: 400px;
  object-fit: contain;
  object-position: center bottom; 
 /* object-position: left bottom; */
}
.content-block-text {
  flex-basis: 50%;
  text-align: left;
  padding: 0px 0 56px 40px;
}
.text-offset {
  margin-top: 40px;
}
.content-block-text p {
  margin-top: 16px;
  line-height: 1.5;
}
.content-block-text.compressed p {
  margin-top: 8px;
}
.block-bg {
  background: var(--bg-color);
  border-radius: 32px;
  padding: 56px 40px;
}
.inner-block {
  display: flex;
  justify-content: space-between;
  gap: 80px;
}
.inner-block-list li {
  position: relative;
  padding-left: 26px;
  line-height: 1.5;
}
.compressed .inner-block-list li:not(:last-child) {
  margin-bottom: 8px;
}
.inner-block-list li::before {
  content: "";
  width: 10px;
  height: 10px;
  position: absolute;
  left: 0;
  /* top: calc(0.5rem - 4px); */
  top: 0.5rem;
  border-radius: 50%;
  background: var(--main-color);
}
.inner-block-list li:not(:last-child) {
  margin-bottom: 16px;
}
.inner-block-list.compressed li:not(:last-child) {
  margin-bottom: 8px;
}
.inner-block-list.light li {
  color: var(--color-text-extralight);
}
.inner-block-list.light li::before {
  background: var(--color-text-extralight);
}
.inner-block-steps > li {
  position: relative;
  padding-left: 40px;
  line-height: 1.5;
}
.inner-block-steps li a {
  color: var(--main-color);
  font-weight: 600;
  cursor: pointer;
}
.inner-block-steps li span {
  position: absolute;
  left: 0;
  top: 0;
  width: 24px;
  height: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
color: var(--color-text-extralight);
    background: var(--main-color);
  border: 1px solid var(--main-color);
  border-radius: 4px;
}
.inner-block-steps.color-steps li span {
  color: var(--color-text-extralight);
  background: var(--main-color);
}
.inner-block-steps li a:hover {
  color: var(--color-btn-hover);
}
.inner-block-steps li:not(:last-child) {
  margin-bottom: 16px;
}
.inner-block-btns {
  display: flex;
  gap: 16px;
}
.inner-block-btns a {
  padding: 12px 32px;
  color: var(--color-text-medium);
  font-size: 0.75rem;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--color-text-medium);
  border-radius: 12px;
  line-height: 1.13;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
}
.inner-block-btns.logo-img {
  flex-wrap: wrap;
 max-width: 480px;
}
.inner-block-btns.logo-img div {
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 16px;
}
.inner-block-btns.logo-img a {
  padding: 12px;
  font-size: 1rem;
  flex-basis: calc(50% - 8px);
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: center;
}
.inner-block-btns.logo-img a > img {
  height: 32px;
}
.inner-block-btns a .icon {
  font-size: 24px;
}
.inner-block-btns a:hover {
  color: var(--main-color);
  border: 1px solid var(--main-color);
}
.inner-block-btns button {
  padding: var(--padding-btn);
  background: var(--main-color);
  border-radius: var(--border-radius-btndefault);
  color: var(--color-text-extralight);
  cursor: pointer;
}
.inner-block-btns button:hover {
  background: var(--color-btn-hover);
}
.link-detail a {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--main-color);
  cursor: pointer;
  white-space: nowrap;
}
.link-detail.dark a {
  color: var(--color-text-dark);
}
.link-detail a:hover {
  color: var(--color-btn-hover);
  font-weight: 600;
}
.icon-mono {
  width: 56px;
  height: 56px;
  background: var(--main-color);
  color: var(--color-text-extralight);
  border-radius: var(--border-radius-icon);
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
  /* font-size: 32px; */
box-shadow: 4px -4px 4px 0px rgba(255, 255, 255, 0.10) inset, -3px 4px 4px 0px rgba(0, 0, 0, 0.10) inset;
}
.icon-mono img {
  width: 38px;
  max-height: 38px;
  object-fit: contain;
  object-position: center;
}
.mono-card-title {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--color-text-dark);
}
.mono-card-paragraph {
  line-height: 1.5;
}
.simple-btn {
  padding: var(--padding-btn);
  border-radius: var(--border-radius-btndefault);
  /* background: var(--main-color); */
  outline: none;
  border: none;
  color: var(--main-color);
  border: 1px solid var(--main-color);
  cursor: pointer;
  font-size: 1rem;
  display: flex;
  align-items: center;
  width: max-content;
}
.simple-btn:hover {
  color: var(--color-btn-hover);
}
.inner-block-btns .default-btn,
.default-btn {
  padding: var(--padding-btn);
  border-radius: var(--border-radius-btndefault);
  background: var(--main-color);
  outline: none;
  border: none;
  color: var(--color-text-extralight);
  cursor: pointer;
  font-size: 1rem;
  display: flex;
  align-items: center;
  width: max-content;
}
.inner-block-btns .default-btn:hover,
.default-btn:hover {
  background: var(--color-btn-hover);
  color: var(--color-text-extralight);
  border: none;
}
.inner-block-btns .default-btn.private,
.default-btn.private {
  background: var(--private-gradient);
 color: var(--color-text-extralight);
  white-space: nowrap;
}
.inner-block-btns .default-btn.private:hover,
.default-btn.private:hover {
  background: var(--private-gradient-rotade);
}
.img-width-100 .img-card-img {
  width: calc(100% + 64px);
  margin-left: -32px;
}
.gradient-border-btn span {
  background: var(--private-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.gradient-border-btn:hover span {
  background: var(--private-gradient-rotade);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.small-block-wrapper {
  padding: 0 40px;
  background: var(--bg-color);
  border-radius: 24px;
}
.small-block {
  display: flex;
  justify-content: space-between;
  gap: 32px;
}
.small-block-img {
  flex-basis: 40%;
  display: flex;
  justify-content: end;
  align-items: end;
}
.small-block-img img {
  height: 100%;
  width: 100%;
  max-height: 180px;
  object-fit: contain;
  object-position: center bottom;
}
.small-block-text {
  padding-top: 16px;
  padding-bottom: 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-basis: 50%;
  gap: 32px;
}
/* end BASE CLASSES */
@media (max-width: 1400px) {
  .bunner-text {
    padding-left: 36px;
  }
}
@media (max-width: 1300px) {
  .two-cards-item-img {
    height: 300px;
  }
}
@media (max-width: 1220px) {
  .text-card-wrapper {
    flex-basis: 50%;
    /* flex-basis: 100%; */
  }
  .text-card::before {
    left: -150px;
  }
}
@media (max-width: 1200px) {
   /* .content-block-inner {
    padding: 56px 40px 0 40px;
  } */
  .content-block {
    padding: 56px 40px 0 40px;
  }
  .block-imgright-text {
    padding-top: 0;
  }
}
@media (max-width: 1100px) {
  .section-wrapper {
    padding: 40px 32px;
  }
  .content-block {
    /* padding: 0 32px; */
    /* padding: 32px; */
    padding: 56px 32px 0 32px;
  }
  /* .content-block-inner {
    padding: 0 32px;
  } */
  .content-block-img-bottom {
    padding-top: 20px;
    /* flex-basis: 40%; */
    padding-right: 20px;
  }
  .content-block-text {
     /* padding: 40px 0 40px 20px; */
    padding: 0 0 40px 20px;
    flex-basis: 50%;
  }
  .bottom-nav-links {
    max-width: 600px;
  }
  .bottom-nav-links > li {
    padding-right: 70px;
  }
  .two-img-row-item.text {
    margin-top: 16px;
  }
  .simple-imgcards {
    flex-wrap: wrap;
  }
  .simple-imgcard-wrapper {
    flex-basis: 50%;
  }
  .block-imgright-inner {
    gap: 56px;
  }
  .block-imgright-text {
    flex-basis: 40%;
  }
  .block-imgright-img {
    flex-grow: 1;
  }
  .simple-block {
    gap: 40px;
  }
  .simple-block-img {
    flex-basis: calc(50% - 20px);
  }
  .simple-block-text {
    flex-basis: calc(50% - 20px);
  }
.two-cards-item-img {
    height: 250px;
  }
  /* .nth2-card-wrapper:nth-child(1) .nth2-card-inner,
  .nth2-card-wrapper:nth-child(4) .nth2-card-inner {
    flex-basis: 100%;
  }
  .nth2-card-wrapper:nth-child(1) .mono-card-paragraph,
  .nth2-card-wrapper:nth-child(4) .mono-card-paragraph {
    max-width: 60%;
  } */
}
@media (max-width: 1000px) {
  header {
    box-shadow: none;
  }
  .header-wrapper {
    display: none;
  }
  .mobile-menu {
    display: flex;
  }
  .block-icons {
    gap: 5%;
  }
  .bunner.restyle .bunner-text {
    flex-basis: 50%;
  }
  .bunner.restyle .bunner-img {
    flex-basis: 50%;
  }
  .block-icons-list {
    padding-top: 0;
  }
  .block-icons-img {
    min-height: 250px;
    flex-basis: 48%;
  }
 .nth2-card-img {
    height: 50%;
  }

  /* .nth2-card-wrapper:nth-child(1) .nth2-card-inner,
  .nth2-card-wrapper:nth-child(4) .nth2-card-inner {
    flex-basis: 100%;
  } */
/*  .nth2-card-wrapper:nth-child(1) .mono-card-paragraph,
  .nth2-card-wrapper:nth-child(4) .mono-card-paragraph {
    max-width: 100%;
  }*/
  .nth2-card .mono-card-paragraph {
    max-width: 100%;
  }
/*  .nth2-card-wrapper:nth-child(1) .nth2-card-img,
  .nth2-card-wrapper:nth-child(4) .nth2-card-img {
    height: 50%;
  }*/
  .text-card::before {
    left: -200px;
  }
}
@media (max-width: 900px) {
  .bunner {
    margin-bottom: 56px;
  }
  .section {
    margin-top: 56px;
    margin-bottom: 56px;
  }
  .section-title {
    margin-bottom: 40px;
  }
  .content-block-img-bottom {
    padding-top: 10px;
  }
  .mono-cards {
    margin: -8px;
  }
  .mono-card-wrapper {
    padding: 8px;
  }
  .step-cards {
    margin: -8px;
  }
  .step-card-wrapper {
    padding: 38px 8px 8px;
  }
  .two-img-block {
    padding: 40px 32px;
  }
  .two-img-block-row {
    gap: 32px;
  }
  .two-img-row-item {
    flex-basis: calc(50% - 16px);
  }
  .simple-imgcards {
    margin: -8px;
  }
  .simple-imgcard-wrapper {
    padding: 8px;
  }
  .two-cards {
    gap: 16px;
  }
  .two-cards-item-img {
    padding: 0;
  }
  .two-cards-item {
    padding: 40px 32px;
    flex-basis: calc(50% - 8px);
  }
  .light-cards {
    margin: -8px;
  }
  .light-card-wrapper {
    flex-basis: 50%;
    padding: 8px;
  }
  .nth2-cards {
    margin: 12px 8px;
  }
  .nth2-card-wrapper {
    padding: 12px 8px;
  }
  .different-cards {
    margin: -8px;
  }
  .different-card-wrapper {
    padding: 8px;
  }
  .different-card .mono-card-paragraph {
    width: 100%;
  }
  .different-card-img {
    right: 0;
    height: 50%;
  }
  .different-card-wrapper.tower .different-card-img {
    right: 16px;
    left: 16px;
  }
  .img-cards {
    margin: -8px;
  }
  .img-card-wrapper {
    padding: 8px;
  }
  .line-steps-content {
    flex-direction: column;
  }
  .line-step {
    flex-direction: row;
    align-items: start;
    overflow: hidden;
    text-align: left;
    gap: 19px;
  }
  .line-step:not(:last-child) {
    padding-bottom: 80px;
  }
  .line-step::before {
    top: 0;
    left: 43px;
    height: 100%;
    width: 2px;
  }
  .line-step:first-child::before {
    top: 20px;
    left: 43px;
    width: 2px;
    height: 100%;
  }
  .line-step:last-child::before {
    width: 2px;
    height: 45%;
  }
  .line-step p {
    padding-top: 4px;
  }
  .five-cards {
    margin: -8px;
  }
  .fifthcard-wrapper {
    padding: 8px;
  }
  .fifthcard-wrapper:nth-child(3),
  .fifthcard-wrapper:nth-child(4) {
    flex-basis: 50%;
  }
 .block-padding {
    padding: 40px 24px;
  } 
}
@media (max-width: 850px) {
  .section-wrapper {
    padding: 40px 16px;
  }
  .section-title.inner {
    padding-top: 40px;
  }
 .content-block {
    padding: 40px 32px;
  }
  .content-block-inner {
    flex-wrap: wrap;
    /* padding: 40px 16px; */
  }
  .content-block-img-bottom {
    position: relative;
    padding: 0;
    margin-bottom: 48px;
    max-height: 300px;
    flex-basis: 100%;
  }
  .content-block-img-bottom img {
    object-position: center bottom;
	max-height: 300px;
  }
  .content-block-img-bottom::before {
    content: "";
    position: absolute;
   top: 80%;
/*top: 85%;*/
    left: 0;
    bottom: -3px;
    width: 100%;
    /* background: linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0) 75%,
      rgba(255, 255, 255, 1) 98%
    ); */
    background: linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0) 18%,
      var(--bg-color) 90%
    );
  }
  .content-block-img-bottom.ext::before {
    content: "";
    position: absolute;
    top: 90%;
    left: 0;
    bottom: -3px;
    width: 100%;
    background: linear-gradient(
      to bottom,
      rgba(229, 234, 241, 0) 18%,
      var(--bg-color) 90%
    );
  }
  .content-block-text {
    flex-basis: 100%;
    padding: 0;
  }
  .content-block-text.text-offset,
.block-imgright-text.text-offset {
    margin-top: 0;
  }
  .content-block-text .block-title {
    text-align: center;
  }
  .block-imgright {
    padding: 40px 16px;
  }
  .block-imgright-inner {
    flex-wrap: wrap-reverse;
    gap: 40px;
  }
  .block-imgright-text {
    flex-basis: 100%;
    padding-bottom: 0;
  }
  .block-imgright-img {
    width: 100%;
    position: relative;
    padding: 0;
    max-height: 300px;
  }
  .block-imgright-img.mb-56 {
    margin-bottom: 0;
  }
  .block-imgright-img img {
    object-position: center bottom;
  }
  .simple-block {
    flex-wrap: wrap;
    padding: 16px;
  }
  .simple-block-img {
    flex-basis: 100%;
    border-radius: var(--border-radius-section);
    overflow: hidden;
    position: relative;
  }
  .simple-block-img::before,
  .block-imgright-img::before {
    content: "";
    position: absolute;
    top: 80%;
    left: 0;
    bottom: -3px;
    width: 100%;
    background: linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0) 18%,
      var(--bg-color) 90%
    );
  }
  .simple-block-img img {
    max-width: 100%;
    max-height: 300px;
    object-position: center bottom;
    /* border-radius: var(--border-radius-section); */
  }
  .simple-block-text {
    flex-basis: 100%;
  }
  .nth2-card-wrapper {
    flex-basis: 50%;
    min-height: 380px;
  }
  .nth2-card-wrapper:nth-child(2),
  .nth2-card-wrapper:nth-child(3),
  .nth2-card-wrapper:nth-child(6),
  .nth2-card-wrapper:nth-child(7) {
    flex-basis: 50%;
  }
  .nth2-card::before {
    top: 75%;
    right: 30%;
    transform: rotate(-7deg);
  }
  .nth2-card {
    flex-wrap: wrap;
    gap: 16px;
  }
  .nth2-card-inner {
    width: 100%;
  }
  .nth2-card-wrapper .mono-card-paragraph {
    max-width: 100%;
  }
.nth2-card-wrapper .nth2-card-img {
    /* height: 40%; */
    margin-left: auto;
  }
  .nth2-card .link-detail {
    position: absolute;
    bottom: 32px;
  }
}
@media (max-width: 830px) {
  .text-card-wrapper {
    flex-basis: 100%;
  }
  .text-card::before {
    right: 40%;
    left: auto;
  }
}
@media (max-width: 800px) {
  .article {
    border-radius: 32px;
    padding: 40px;
    background: #e5eaf1;
  }
 .article.wrapper {
    padding: 40px;
  }
  .article-img {
    position: relative;
    float: none;
    width: 100%;
    max-height: 300px;
    padding: 0;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 32px;
    display: flex;
    justify-content: center;
  }
  /* .article-img::before {
    content: "";
    position: absolute;
    top: 80%;
    left: 0;
    bottom: -3px;
    width: 100%;
    background: linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0) 18%,
      #e5eaf1 90%
    );
  } */
 .bunner .article-img::before {
    content: "";
  }
  .article-text {
    width: 100%;
    padding-bottom: 20px;
  }
  .mono-card-wrapper {
    flex-basis: 50%;
  }
  .step-card-wrapper {
    flex-basis: 50%;
  }
  .footer-row.top,
  .footer-row.middle {
    border-bottom: none;
    position: relative;
    padding-bottom: 32px;
  }
  .footer-row.top::before,
  .footer-row.middle::before {
    content: "";
    position: absolute;
    top: 100%;
    left: -16px;
    width: calc(100% + 32px);
    height: 1px;
    background: var(--color-border-gray);
  }
  .footer-column:not(:last-child) {
    border-bottom: 1px solid var(--color-border-gray);
  }
  .footer-column .footer-contacts {
    display: none;
  }
  .footer-contacts.mobile {
    display: block;
    margin-top: 32px;
    margin-bottom: 24px;
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
  }
  .footer-contacts.mobile .apb-contacts {
    flex-basis: 100%;
  }
  .footer-row.middle {
    flex-wrap: wrap;
    gap: 0;
    padding: 0;
  }
  .footer-column {
    flex-basis: 100%;
  }
  .footer-column-title {
    display: none;
  }
  .footer-column-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 0;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 1.125rem;
    cursor: pointer;
  }
  .footer-column-label .icon {
    font-size: 12px;
  }
  .footer-column-links {
    display: none;
  }
  .footer-column input[type="checkbox"]:checked ~ .footer-column-links {
    display: block;
  }
  .footer-column input[type="checkbox"]:checked ~ .footer-column-label .icon {
    transform: rotate(180deg);
  }
  .footer-row.bottom {
    flex-wrap: wrap-reverse;
    gap: 32px;
    margin-top: 24px;
    margin-bottom: 32px;
    padding: 0;
  }
  .footer-apps {
    flex-wrap: wrap;
    padding-bottom: 32px;
    position: relative;
    width: 100%;
  }
  .footer-apps::before {
    content: "";
    position: absolute;
    top: 100%;
    left: -16px;
    width: calc(100% + 32px);
    height: 1px;
    background: var(--color-border-gray);
  }
  .footer-apps .footer-column-group-title {
    display: block;
    flex-basis: 100%;
  }
  .img-cards {
    flex-wrap: wrap;
  }
  .img-card-wrapper {
    flex-basis: 50%;
    flex-grow: 1;
    min-width: 280px;
    flex-shrink: 0;
  }
  .small-block {
    flex-wrap: wrap-reverse;
  }
  .small-block-img {
    flex-basis: 100%;
    display: flex;
    justify-content: end;
    align-items: end;
  }
  .small-block-text {
    flex-basis: 100%;
  }
}
@media (max-width: 750px) {
  .bunner-title.bunner-title-mobile {
    display: block;
    margin-top: 40px;
    margin-bottom: 40px;
    text-align: center;
  }
  .bunner-container {
    margin-top: 40px;
    background: #e5eaf1;
    border-radius: 24px;
    /* padding: 20px 16px 0 16px; */
    min-height: max-content;
    flex-wrap: wrap;
    gap: 56px;
    padding: 40px 32px 0 32px;
  }
  .bunner-container .bunner-title {
    display: none;
  }
  .bunner-list {
    margin-top: 0;
  }
  .bunner-img {
    margin-top: auto;
    display: flex;
    align-items: end;
    /* justify-content: end; */
    flex-basis: 100%;
    justify-content: center;
  }
  .bunner-img img {
    max-height: 350px;
    object-position: center bottom;
  }
  .bunner-text {
    padding: 20px 0 40px 16px;
    min-height: 100%;
    /* flex-basis: 50%; */
    flex-basis: 100%;
    padding: 0;
  }
/* .block-padding {
    padding: 40px 24px;
  } */
  .bunner.restyle .bunner-text {
    display: none;
  }
  .bunner.restyle .bunner-img {
    flex-basis: 100%;
  }
  .bunner.restyle .bunner-container {
    background: none;
    position: relative;
  }
  .bunner.restyle .inner-block-btns.mobile {
    width: 100%;
    display: flex;
    justify-content: center;
  }
  .bunner.restyle .inner-block-btns.mobile a {
    min-width: 180px;
  }
 .two-cards-item-img {
    height: 200px;
  }
}
@media (max-width: 720px) {
  .two-img-block {
    padding: 40px 16px 16px;
  }
  .two-img-block-row {
    flex-wrap: wrap;
  }
  .two-img-row-item {
    flex-basis: 100%;
  }
  .two-img-row-item.text {
    margin-top: 0;
  }
  .two-img-row-item.img {
    max-height: 300px;
  }
  .faq-item {
    padding: 24px 16px;
  }
  .footer-row.top {
    flex-wrap: wrap;
    gap: 32px;
  }
  .footer-toprow-contacts {
    flex-wrap: wrap;
    gap: 24px;
  }
  .different-cards {
    margin: -20px;
    flex-wrap: wrap;
  }
  .different-cards.reverse {
    flex-direction: column-reverse;
  }
  .different-card-wrapper {
    padding: 20px;
  }
  .different-card-wrapper.tower {
    flex-basis: 100%;
	min-width: 300px;
  }
  .different-card-wrapper.tower .mono-card-paragraph,
  .different-card .mono-card-paragraph {
    width: 60%;
  }
  .different-card-wrapper.tower .inner-block-list {
    width: 60%;
  }
  .different-card-wrapper.tower .different-card-img {
    right: 0;
    left: 60%;
 height: 75%;
  }
  .different-card-img {
    height: 75%;
  }
}

@media (max-width: 700px) {
  .mini-block {
    flex-wrap: wrap;
  }
  .mini-block-img {
    flex-basis: 100%;
  }
  .invite {
    padding: 40px 24px;
  }
  .block-icons {
    flex-wrap: wrap;
    gap: 40px;
  }
  .block-icons-img {
    flex-basis: 100%;
    min-height: auto;
    max-height: 300px;
    position: relative;
  }
  .block-icons-img::before {
    content: "";
    position: absolute;
    top: 80%;
    left: 0;
    bottom: -3px;
    width: 100%;
    background: linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0) 18%,
      var(--color-bg-page) 90%
    );
  }
/*  .block-icons-img img {
    object-position: center bottom;
  } */
}
@media (max-width: 650px) {
  .nth2-cards {
    margin: -20px;
  }
  .nth2-card-wrapper {
    flex-basis: 100%;
    min-height: 300px;
    padding: 20px;
  }
  .nth2-card-wrapper:nth-child(2),
  .nth2-card-wrapper:nth-child(3),
  .nth2-card-wrapper:nth-child(6),
  .nth2-card-wrapper:nth-child(7) {
    flex-basis: 100%;
  }
  .nth2-card::before {
    top: 70%;
    right: 40%;
    transform: rotate(-4deg);
  }
  .nth2-card-wrapper .mono-card-paragraph {
    max-width: 100%;
  }
/*  .nth2-card-wrapper .nth2-card-img {
    height: 85%;
    width: 40%;
  }*/
 /* .nth2-card-wrapper:nth-child(1) .nth2-card-img,
  .nth2-card-wrapper:nth-child(4) .nth2-card-img {
    height: 85%;
  }*/
  .nth2-card-wrapper:nth-child(1) .mono-card-paragraph,
  .nth2-card-wrapper:nth-child(4) .mono-card-paragraph {
    max-width: 100%;
  }
  .fifthcard {
    padding-top: 40px;
    flex-direction: column;
    min-height: 300px;
  }
  .fifthcard-text {
    padding: 0 24px 40px 24px;
  }
  .fifthcard-text h5 {
    margin-bottom: 24px;
  }
  .fifthcard .link-detail {
    left: 24px;
    bottom: 24px;
  }
  .fifthcard-img {
    width: 50%;
  }
  .fifthcard-img img {
    max-height: 200px;
  }
}
@media (max-width: 600px) {
  .mono-cards {
    margin: -20px;
  }
  .mono-card-wrapper {
    flex-basis: 100%;
    padding: 20px;
  }
  .four .mono-card-wrapper {
    flex-basis: 100%;
  }
  .step-card-wrapper {
    flex-basis: 100%;
  }
  .simple-imgcards {
    margin: -20px;
  }
  .simple-imgcard-wrapper {
    padding: 20px;
    flex-basis: 100%;
  }
  .simple-imgcard {
    padding: 32px 16px;
  }
  .two-cards {
    flex-wrap: wrap;
    gap: 40px;
  }
  .two-cards-item {
    padding: 40px 24px;
    flex-basis: 100%;
  }
  .two-cards-item-img {
    height: 300px;
    padding: 0 30px;
  }
  .invite {
    flex-wrap: wrap;
    gap: 32px;
  }
  .light-cards {
    margin: -20px;
  }
  .light-card-wrapper {
    flex-basis: 100%;
    padding: 20px;
  }
  .different-card {
    padding: 40px 16px;
  }
  .different-card-img {
    height: 70%;
  }

  .img-cards {
    margin: -20px;
  }
  .img-card-wrapper {
    padding: 20px;
  }
  .img-card {
    padding: 40px 24px 0 24px;
  }
  .line-steps {
    padding: 40px 24px;
  }
  .registration {
    padding: 40px 16px;
  }
  .five-cards {
    margin: -20px;
  }
  .fifthcard-wrapper {
    padding: 20px;
  }
  .fifthcard-wrapper:nth-child(1),
  .fifthcard-wrapper:nth-child(2),
  .fifthcard-wrapper:nth-child(3),
  .fifthcard-wrapper:nth-child(4) {
    flex-basis: 100%;
  }
  .img-width-100 .img-card-img {
    width: calc(100% + 48px);
    margin-left: -24px;
  }
}
@media (max-width: 550px) {
  .text-card {
    padding: 40px 16px 90px 16px;
  }
  .text-card::before {
    right: 25%;
  }
  .content-block {
    padding: 40px 16px;
  }
  .bunner-container {
    padding: 40px 16px 0 16px;
  }
}
@media (max-width: 520px) {
  .footer-row.middle {
    border-bottom: none;
  }
}
@media (max-width: 500px) {
  :root {
    --size-title: 1.5rem;
  }
  .info-block {
    padding: 40px 16px;
  }
  .apb-online-mob .apb-online-container {
    top: calc(100% - 8px);
    width: 100%;
  }
  .tariffs-section {
    overflow: visible;
  }
  .simple-block {
    padding: 0;
    margin-top: 16px;
  }
  .simple-block-img {
    /* max-height: 300px; */
    height: auto;
  }
  /* .simple-block-img img {
    height: auto;
  } */
  .block-list-bold li h6 {
    font-size: 1.25rem;
  }
  .block-padding {
    padding: 40px 24px;
  }
  .nth2-card {
   /* flex-wrap: wrap;*/
    gap: 32px;
    padding: 40px 16px 0 16px;
    text-align: center;
  }
  .nth2-card-wrapper .nth2-card-img {
    position: relative;
    height: 250px;
    width: 100%;
    right: 0;
    z-index: 0;
  }
  .nth2-card-wrapper .nth2-card-img img {
    object-position: center bottom;
  }
  .nth2-card::after {
    content: "";
    position: absolute;
    top: 80%;
    left: 0;
    bottom: -3px;
    width: 100%;
    background: linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0) 18%,
      var(--bg-color) 90%
    );
  }
  .nth2-card .link-detail {
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    padding: var(--padding-btn);
    border-radius: var(--border-radius-btndefault);
    background: var(--color-bg-extralight);
    color: var(--main-color);
    cursor: pointer;
    z-index: 2;
  }
  .nth2-card .link-detail a {
    color: var(--main-color);
  }
  .fifthcard::before {
    right: 20%;
  }
  .fifthcard::after {
    content: "";
    position: absolute;
    top: 80%;
    left: 0;
    bottom: -3px;
    width: 100%;
    background: linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0) 18%,
      var(--bg-color) 90%
    );
    z-index: 2;
  }
  .fifthcard-text {
    text-align: center;
  }
  .fifthcard .link-detail {
    left: 50%;
    transform: translateX(-50%);
  }
  .fifthcard .link-detail a {
    padding: var(--padding-btn);
    border-radius: var(--border-radius-btndefault);
    background: var(--color-bg-extralight);
    color: var(--main-color);
  }
  .fifthcard-img {
    width: 100%;
    padding: 0 24px;
  }
  .fifthcard-img img {
    max-height: 300px;
    object-position: center bottom;
  }
  .different-card {
    padding: 40px 16px 0 16px;
  }
  .different-card-wrapper.tower .mono-card-title,
  .different-card .mono-card-title {
    text-align: center;
  }
  .different-card-wrapper.tower .mono-card-paragraph,
  .different-card .mono-card-paragraph {
    width: 100%;
    text-align: center;
  }
  .different-card-wrapper.tower .inner-block-list,
  .different-card-wrapper .inner-block-list {
    width: 100%;
  }
  .different-card-img {
    position: relative;
    margin-top: 40px;
    width: 100%;
    left: 0;
  }
  .different-card-wrapper.tower .different-card-img {
    width: 100%;
    left: 0;
    height: auto;
  }
.different-card-img img {
    max-height: 250px;
    object-position: center bottom;
  }
  .article,
.article.wrapper {
    padding: 40px 16px;
  }
  .bunner.restyle .inner-block-btns.mobile {
    flex-wrap: wrap;
  }
  .bunner.restyle .inner-block-btns.mobile a {
    flex-basis: 100%;
    justify-content: center;
  }
}
@media (max-width: 460px) {
  .simple-imgcard {
    padding: 40px 0 0 0;
    min-height: 350px;
  }
  .simple-imgcard {
    flex-wrap: wrap;
  }
  .simple-imgcard-content {
    flex-basis: 100%;
    padding: 0 32px;
    height: max-content;
  }
  .simple-imgcard-img {
    position: relative;
    margin-top: 56px;
    width: 100%;
    min-height: 220px;
  }
  .simple-imgcard .link-detail {
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
  }
  .simple-imgcard .link-detail a {
    padding: 12px 32px;
    background: var(--color-bg-extralight);
    color: var(--main-color);
    border-radius: var(--border-radius-btn);
  }
  .inner-block-btns {
    flex-wrap: wrap;
    justify-content: center;
  }
  /* .inner-block-btns a {
    flex-basis: 170px;
    padding: 14px 32px;
  } */
  .inner-block-btns a {
    flex-basis: 50%;
    /* padding: 14px 16px; */
    padding: 14px 32px;
  }
  .two-cards-item-img {
    height: 200px;
    padding: 0;
  }
  .inner-block-btns.logo-img a {
    flex-wrap: wrap;
  }
  .inner-block-btns.logo-img a span {
    flex-basis: 100%;
    text-align: center;
  }
}
@media (max-width: 400px) { 
  .footer-apps a {
    flex-basis: calc(50% - 8px);
  }
}



/* PRIVATE CLIENTS */
.bunner-btns.private button, .bunner-btns.private a {
  background: var(--private-gradient);
}
.bunner-btns.private button:hover, .bunner-btns.private a:hover {
  background: var(--private-gradient-rotade);
}
.simple-imgcards.ext .simple-imgcard::before {
  content: "";
  position: absolute;
  left: -120px;
  top: 62%;
  width: 430px;
  height: 350px;
  background: var(--before-bg);
  transform: rotate(-14deg);
  border-radius: 48% 52% 77% 23% / 46% 24% 76% 54%;
}
/* SHORT BLOCK */
.short-block {
  display: flex;
  justify-content: space-between;
  gap: 60px;
  padding: 24px 40px;
  background: var(--bg-color);
  border-radius: var(--border-radius-card);
}
.short-block-img {
  flex-basis: 320px;
  margin-top: auto;
  display: flex;
  align-items: end;
}
.short-block-img img {
  width: 100%;
  height: 160px;
  object-fit: contain;
  object-position: centers;
}
.short-block-text {
  flex-grow: 1;
  margin-top: auto;
  margin-bottom: auto;
}
.short-block-text h2 {
  margin-bottom: 16px;
  color: var(--color-text-extralight);
  font-size: 1.5rem;
  font-weight: 600;
}
.short-block-text p {
  line-height: 1.5;
  color: var(--color-text-extralight);
}
.short-block-btn {
  display: flex;
  align-items: center;
}
.short-block-btn button {
  background: var(--color-bg-extralight);
  padding: var(--padding-btn);
  border-radius: var(--border-radius-btn);
  color: var(--private-gradient);
  cursor: pointer;
  white-space: nowrap;
}
.short-block-btn button span {
  background: var(--private-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.short-block-btn button:hover span {
  background: var(--private-gradient-rotade);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
/* end SHORT BLOCK */
/* PAIR */
.pair {
  margin: -20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.paircard-wrapper {
  padding: 20px;
  flex-grow: 1;
}
.paircard {
  padding-top: 32px;
  position: relative;
  overflow: hidden;
  min-height: 360px;
  background: var(--bg-color);
  border-radius: var(--border-radius-card);
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.paircard::before {
  content: "";
  position: absolute;
  width: 600px;
  height: 300px;
  bottom: -180px;
  /* left: -220px; */
  left: -270px;
  transform: rotate(-4deg);
  background: var(--before-color);
  border-radius: 52% 48% 40% 60% / 27% 29% 71% 68%;
}
.paircard-text {
  /* padding: 0 8px 32px 32px; */
  padding: 0 32px;
  flex-grow: 1;
  z-index: 1;
}
.paircard-text h5 {
  color: var(--title-color);
  margin-bottom: 8px;
  font-weight: 600;
  font-size: var(--size-card-title);
}
.paircard-text p {
  color: var(--p-color);
  line-height: 1.5;
}
.paircard .link-detail {
  position: absolute;
  left: 32px;
  bottom: 40px;
  z-index: 3;
}
.paircard .link-detail a {
  color: var(--link-color);
}
.paircard-img {
  width: 45%;
  flex-shrink: 0;
  align-self: end;
  display: flex;
  align-items: end;
  z-index: 1;
}
.paircard-img img {
  width: 100%;
  max-height: 300px;
  object-fit: contain;
  object-position: right bottom;
}
.paircard-wrapper:nth-child(1) {
  flex-basis: 55%;
}
.paircard-wrapper:nth-child(2) {
  flex-basis: 45%;
}
/* end PAIR */
/* FOUR CARDS */
.four-cards {
  margin: -20px;
  display: flex;
}
.four-cards-column {
  display: flex;
  flex-wrap: wrap;
  flex-grow: 1;
}
.four-cards-tower-wrapper {
  padding: 20px;
  flex-basis: 40%;
  flex-shrink: 0;
  min-width: 330px;
}
.four-cards-element-wrapper.mobile {
  display: none;
}
.four-cards-tower {
  position: relative;
  height: 100%;
  width: 100%;
  background: var(--bg-color);
  padding: 32px;
  border-radius: var(--border-radius-card);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}
.four-cards-tower::before {
  content: "";
  position: absolute;
  width: 600px;
  height: 300px;
  /* top: 65%; */
  right: 20%;
  bottom: -218px;
  /* left: -220px; */
  transform: rotate(-6deg);
  background: var(--before-bg);
  border-radius: 52% 48% 40% 60% / 27% 29% 71% 68%;
}
.four-cards-tower-img {
  /* min-height: 400px; */
  max-height: 460px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: start;
}
.four-cards-tower-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: top center;
}
.four-cards-tower-text {
  margin-top: 32px;
  z-index: 1;
}
.four-cards-tower-text h6 {
  font-size: 1.5rem;
  color: var(--color-text-dark);
  font-weight: 600;
  margin-bottom: 8px;
}
.four-cards-tower-text .link-detail {
  margin-top: 32px;
}
.four-cards-tower-text .link-detail a {
  color: var(--color-text-medium);
}
.four-cards-element-wrapper {
  padding: 20px;
  flex-basis: 50%;
  min-width: 300px;
  flex-grow: 1;
}
.four-cards-element {
  position: relative;
  height: 100%;
  width: 100%;
  background: var(--bg-color);
  padding: 32px;
  border-radius: var(--border-radius-card);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}
.four-cards-element::before {
  content: "";
  position: absolute;
  width: 600px;
  height: 300px;
  /* top: 65%; */
  /* right: 20%; */
  bottom: -218px;
  left: -220px;
  transform: rotate(-6deg);
  background: var(--before-bg);
  border-radius: 52% 48% 40% 60% / 27% 29% 71% 68%;
}
.four-cards-element .link-detail {
  position: absolute;
  bottom: 32px;
  left: 32px;
  z-index: 1;
}
.four-cards-element h6 {
  font-size: 1.5rem;
  color: var(--color-text-dark);
  font-weight: 600;
  margin-bottom: 16px;
  z-index: 1;
}
.four-cards-element-img {
  width: 90%;
  display: flex;
  align-items: end;
  justify-content: end;
  margin-top: auto;
  margin-bottom: -32px;
  margin-right: -32px;
  margin-left: auto;
}
.four-cards-element-img img {
  width: 100%;
  max-height: 214px;
  object-fit: contain;
  object-position: right bottom;
  z-index: 1;
}
/* end FOUR CARDS */
/* SALARY CARDS */
.salary-cards {
  display: flex;
}
.salary-cards .product-card-wrapper {
  flex-basis: 33.333%;
}
.salary-cards .product-card-img {
  height: 65%;
}
/* end SALARY CARDS */
/* SEARCH BLOCK */
.search-block {
  padding: 56px 32px;
  background: #fbfbfb;
  border-radius: var(--border-radius-section);
}
.search-block h5 {
  font-weight: 600;
  font-size: var(--size-title);
  color: var(--color-text-dark);
  margin-bottom: 40px;
  text-align: center;
}
.search-block form {
  padding: 16px;
  border: 1px solid var(--color-border-gray);
  border-radius: 12px;
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}
.search-block form input {
  width: 100%;
  background: none;
  color: var(--color-text-dark);
  font-size: 1rem;
}
.search-block form input::placeholder {
  font-size: 0.875rem;
  color: var(--color-text-light);
}
.search-block form button {
  padding-left: 16px;
  font-size: 1.3rem;
}
/* end SEARCH BLOCK */
/* TRIO */
.trio {
  display: flex;
  justify-content: space-between;
  margin: -20px;
  flex-wrap: wrap;
}
.trio-item-wrapper {
  flex-basis: 50%;
  padding: 20px;
}
.trio-item {
  position: relative;
  height: 100%;
  min-height: 320px;
  padding: 32px;
  border-radius: 24px;
  display: flex;
  justify-content: space-between;
  gap: 24px;
  background: var(--bg-color);
  overflow: hidden;
}
.trio-item::before {
  content: "";
  position: absolute;
  width: 650px;
  height: 300px;
  top: 70%;
  right: 55%;
  transform: rotate(-3deg);
  background: var(--before-bg);
  border-radius: 52% 48% 40% 60% / 27% 29% 71% 68%;
}
.trio-item-text {
  display: flex;
  flex-direction: column;
  /* flex-grow: 1; */
  z-index: 1;
  line-height: 1.5;
}
.trio-item-text span {
  width: 56px;
  height: 56px;
  padding: 14px 7px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: var(--main-color);
  border-radius: 12px;
  color: var(--color-text-extralight);
  font-size: 24px;
  font-weight: 600;
}
.trio-item-text h6 {
  color: var(--color-text-dark);
  font-size: 1.5rem;
  font-weight: 600;
}
.trio-item-text ul li {
  position: relative;
  color: var(--color-text-medium);
  padding-left: 26px;
  line-height: 1.5;
}
.trio-item-text ul li::before {
  content: "";
  position: absolute;
  top: 0.5rem;
  left: 0;
  width: 10px;
  height: 10px;
  background: var(--main-color);
  border-radius: 50%;
}
.trio-item-text ul li:not(:last-child) {
  margin-bottom: 8px;
}
.trio-item-text.light h6,
.trio-item-text.light ul li,
.trio-item-text.light p {
  color: var(--color-text-extralight);
}
.trio-item-img {
  flex-basis: 40%;
  flex-shrink: 0;
  display: flex;
  justify-content: end;
  align-items: end;
  margin-right: -16px;
  margin-bottom: -32px;
  z-index: 1;
}
.trio-item-img img {
  max-height: 350px;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: right bottom;
}
.trio-item-wrapper:first-child {
  flex-basis: 100%;
}
/* end TRIO */
/* CORNER CARDS */
.corner-cards {
  display: flex;
  flex-wrap: wrap;
  margin: -20px;
}
.corner-card-wrapper {
  flex-basis: 25%;
  max-width: 25%;
  padding: 20px;
}
.corner-card {
  height: 100%;
  min-height: 240px;
  min-width: 310px;
  position: relative;
  overflow: hidden;
  padding: 32px 16px;
  display: flex;
  flex-direction: column;
  background: var(--bg-color);
  border-radius: 24px;
  border-bottom-left-radius: 0;
}
.corner-card::before {
  content: "";
  width: 600px;
  height: 220px;
  position: absolute;
  bottom: -141px;
  right: 16%;
  transform: rotate(-14deg);
  background: var(--before-bg);
  border-radius: 52% 48% 40% 60% / 27% 29% 71% 68%;
}
.corner-card.simple {
  border-bottom-left-radius: 24px;
}
.corner-card.simple:before {
  content: none;
}
.corner-card p.light {
  color: var(--color-text-extralight);
}
.corner-card .card-logo {
  margin-left: auto;
  margin-right: auto;
  z-index: 1;
}
.corner-card-name {
  color: var(--color-text-dark);
  font-size: 1.5rem;
  font-weight: 600;
  text-align: center;
  z-index: 1;
}
.corner-card-name.light {
  color: var(--color-text-extralight);
}
/* end CORNER CARDS */
/* INSTALMENT CREDIT */
.instalment-credit {
  flex-wrap: wrap;
}
.instalment-credit .info-card-img img {
  max-height: 280px;
}

/* end INSTALMENT CREDIT */
/* BRIEF CARDS */
.brief-cards {
  display: flex;
  flex-wrap: wrap;
  margin: -20px;
}
.brief-card-wrapper {
  padding: 20px;
  flex-basis: 25%;
}
.brief-card {
  height: 100%;
  padding: 32px;
  border-radius: var(--border-radius-card);
  background: var(--bg-color);
  min-height: 260px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.brief-card h6 {
  font-size: 1rem;
  font-weight: 600;
  color: var(--color-text-dark);
  line-height: 1.5;
}
.brief-card.light h6 {
  color: var(--color-text-extralight);
}
.bottom-descr {
  margin-top: 16px;
}
.bottom-descr table {
  width: 100%;
}
.bottom-descr table th,
.bottom-descr table td {
  background: none;
  text-align: left;
}
.bottom-descr table th {
  font-size: 0.75rem;
  font-weight: 400;
}
.bottom-descr table td {
  color: var(--color-text-dark);
  font-size: 1.25rem;
  font-weight: 600;
}
.brief-card.light .bottom-descr table th,
.brief-card.light .bottom-descr table td {
  color: var(--color-text-extralight);
}
/* end BRIEF CARDS */
/* CREDIT LIMIT */
.credit-limit-title {
  color: var(--color-text-dark);
  font-weight: 600;
  font-size: 1.5rem;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 56px;
  text-align: center;
}
.credit-limit {
  padding: 40px 32px;
  background: var(--color-bg-extralight);
  border-radius: var(--border-radius-section);
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  min-height: 320px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.credit-limit-step {
  max-width: 500px;
  flex-grow: 1;
  margin-left: auto;
  margin-right: auto;
  display: none;
}
.credit-limit-step.active {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.autocreditform {
  max-width: 310px;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.credit-limit-input input {
  width: 100%;
  margin-top: 8px;
  padding: 16px;
  border-radius: 5px;
  border: 1px solid var(--color-border-gray);
  font-size: 1rem;
  color: var(--color-text-dark);
  font-weight: 600;
}
.credit-limit-input input::placeholder {
  font-size: 0.875rem;
  color: var(--color-text-light);
  font-weight: 400;
}
.credit-limit-message {
  margin-bottom: 24px;
  line-height: 1.5;
}
.truestate .amount {
  color: var(--main-color);
  font-size: 1.5rem;
  font-weight: 600;
}
.credit-limit-btns {
  margin-top: 32px;
  display: flex;
  justify-content: center;
  gap: 16px;
}
.credit-limit-btns .default-btn.empty {
  background: none;
  border: 1px solid var(--main-color);
  color: var(--main-color);
}
.credit-limit-btns .default-btn.empty:hover {
  color: var(--color-text-extralight);
  background: var(--private-gradient-rotade);
  border: 1px solid transparent;
}
#step2 .credit-limit-btns button {
  flex-grow: 1;
}
#debugerr,
#panerr,
.confirmerror {
  color: var(--error-color);
}
.steptracker {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  width: max-content;
  margin-top: 40px;
  margin-left: auto;
  margin-right: auto;
}
.steptracker .point {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #bbbbbb;
}
/* .steptracker .point.active {
  background: var(--main-color);
} */
.credit-limit-step:first-child.active ~ .steptracker .point:first-child {
  background: var(--main-color);
}
.credit-limit-step:nth-child(2).active ~ .steptracker .point:nth-child(1),
.credit-limit-step:nth-child(2).active ~ .steptracker .point:nth-child(2) {
  background: var(--main-color);
}
.credit-limit-step:nth-child(3).active ~ .steptracker .point:nth-child(1),
.credit-limit-step:nth-child(3).active ~ .steptracker .point:nth-child(2),
.credit-limit-step:nth-child(3).active ~ .steptracker .point:nth-child(3) {
  background: var(--main-color);
}
/* end CREDIT LIMIT */
/* ADVT CARDS */
.advt-cards {
  display: flex;
  gap: 40px;
}
.advt-card {
  flex-basis: 50%;
  padding: 32px;
  background: var(--bg-color);
  border-radius: var(--border-radius-card);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.advt-card h4 {
  text-transform: uppercase;
  color: var(--color-text-dark);
}
.advt-card.light h4 {
  color: var(--color-text-extralight);
}
.advt-card-img {
  max-width: 660px;
  max-height: 160px;
}
.advt-card-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 16px;
}
.advt-card a,
.advt-card button {
  white-space: nowrap;
}
/* end ADVT CARDS */
/* INFO CARDS */
.info-cards {
  display: flex;
  margin: -20px;
}
.info-card-wrapper {
  padding: 20px;
  flex-basis: 50%;
}
.info-cards.three .info-card-wrapper {
  flex-basis: 33.333%;
  min-width: 33.333%;
}
.info-card {
  position: relative;
  height: 100%;
  min-height: 320px;
  padding: 32px;
  background: var(--bg-color);
  border-radius: var(--border-radius-card);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.info-card::before {
  content: "";
  position: absolute;
  left: -120px;
  top: 65%;
  width: 430px;
  height: 350px;
  background: var(--before-bg);
  border-radius: 48% 52% 77% 23% / 46% 24% 76% 54%;
}
.info-card.light,
.info-card.light .card-title,
.info-card.light a {
  color: var(--color-text-extralight);
}
.info-card.light .inner-block-list li::before {
  background: var(--color-text-extralight);
}
.info-card-body {
  height: 100%;
  display: flex;
  justify-content: space-between;
  gap: 4px;
  z-index: 1;
}
.info-card .card-title {
  margin-bottom: 16px;
}
.info-card-text {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  line-height: 1.5;
  gap: 24px;
}
.info-card p {
  line-height: 1.5;
  margin-bottom: 16px;
}
.info-card p a {
  color: var(--color-text-medium);
}
.info-card.light p a {
  color: var(--color-text-extralight);
}
.info-card-img {
  flex-basis: 46%;
  min-width: 140px;
  flex-shrink: 0;
  /* margin-top: -16px; */
  margin-bottom: -33px;
  margin-right: -33px;
  display: flex;
  justify-content: end;
  align-items: end;
}
.info-card-img img {
  width: 100%;
  height: 100%;
  /* max-height: 250px; */
  max-height: 270px;
  object-fit: contain;
  object-position: right bottom;
}
.info-card.ext .info-card-img {
  flex-basis: 65%;
}
.info-cards.different .info-card-wrapper:nth-child(1) {
  flex-basis: 55%;
}
.info-cards.different .info-card-wrapper:nth-child(2) {
  flex-basis: 45%;
}
.info-cards.different .info-card-img img {
  max-height: 300px;
}
.info-card-wrapper.wide {
  flex-basis: 100%;
}
.wide .info-card-img {
  margin-right: 0;
  flex-basis: 55%;
}
/* end INFO CARDS */
/* LIMITS TABLE */
.limits-wrapper {
  padding: 40px 16px;
  background: var(--color-bg-extralight);
  border-radius: 40px;
}
.limitstable-title {
  font-size: var(--size-title);
  font-weight: 600;
  text-align: center;
  color: var(--color-text-dark);
}
.limitstable {
  max-width: 960px;
  margin: 0 auto;
}
.limitstable-row {
  padding: 40px 0;
}
.limitstable-row:not(:last-child) {
  border-bottom: 1px solid var(--color-border-gray);
}
.limitstable-row-name {
  display: flex;
  align-items: start;
  gap: 16px;
  cursor: pointer;
  /* padding-bottom: 24px; */
}
.limitstable-row-name > span {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--color-text-dark);
}
.limitstable-row-name .icon {
  margin-top: 0.6rem;
  font-size: 0.8rem;
}
.limitstable-dropdown {
  height: 0;
  /* opacity: 0; */
  transition: all 0.5s ease;
  overflow: hidden;
  /* animation: fadeIn ease 0.8s; */
}
.limitstable-dropdown > table {
  width: 100%;
  border-collapse: collapse;
  color: var(--color-text-dark);
  /* opacity: 0;
  transition: all 0.6s ease; */
}
.limitstable-dropdown tr th {
  font-size: 0.875rem;
  font-weight: 400;
}
.limitstable-dropdown tr th:first-child {
  padding: 0 8px 16px 24px;
  text-align: left;
}
.limitstable-dropdown tr th:last-child {
  padding: 0 24px 16px 8px;
  text-align: right;
}
.limitstable-dropdown tr td:first-child {
  padding: 16px 12px 16px 24px;
  text-align: left;
  background: #f3f6f9;
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
  line-height: 1.5;
  width: 50%;
  min-width: 330px;
}
.limitstable-dropdown tr td:last-child {
  padding: 16px 24px 16px 12px;
  text-align: right;
  background: #f3f6f9;
  border-top-right-radius: 12px;
  border-bottom-right-radius: 12px;
  font-weight: 600;
  line-height: 1.5;
  vertical-align: middle;
}
.limitstable-dropdown tr.row-empty td {
  padding: 12px;
  background: none;
}
.limitstable-row.active .limitstable-row-name > .icon {
  transform: rotate(180deg);
}
.limitstable-row.active > .limitstable-dropdown {
  padding-top: 24px;
  height: 100%;
  /* opacity: 1; */
  transition: all 0.5s;
  animation: fadeOut 2s ease infinite;
}
.limitstable-row.active > .limitstable-dropdown > table {
  /* height: 100%; */
  /* opacity: 1; */
}
@keyframes fadeIn {
  0% {
    height: 0;
  }
  100% {
    height: 100%;
  }
}
@keyframes fadeOut {
  0% {
    height: 100%;
  }
  100% {
    height: 0;
  }
}
/* end LIMITS TABLE */
/* COLLAGE */
.collage {
  display: grid;
  grid-template-columns: 44% 28% 28%;
  grid-template-rows: repeat(2, 1fr);
  margin: -20px;
}
.collage-card-wrap {
  padding: 20px;
}
.collage-card-wrap.one {
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  grid-row-end: 3;
}
.collage-card-wrap.two {
  grid-column-start: 2;
  grid-column-end: 2;
  grid-row-start: 1;
  grid-row-end: 2;
}
.collage-card-wrap.four {
  grid-column-start: 2;
  grid-column-end: 4;
  grid-row-start: 2;
  grid-row-end: 3;
}
.collage-card {
  position: relative;
  height: 100%;
  min-height: 300px;
  max-height: 320px;
  border-radius: 24px;
  background: var(--bg-color);
  display: flex;
  align-items: end;
  overflow: hidden;
}
.collage-card > a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  cursor: pointer;
  z-index: 15;
}
.collage-card-wrap.one .collage-card {
  max-height: 100%;
}
.collage-card::before {
  content: "";
  width: 600px;
  height: 300px;
  position: absolute;
  bottom: -200px;
  right: 20%;
  transform: rotate(-6deg);
  background: var(--before-bg);
  border-radius: 56% 44% 56% 44% / 55% 26% 74% 45%;
  z-index: 2;
}
.collage-card::after {
  content: "";
  width: 100%;
  height: 35%;
  position: absolute;
  bottom: 0;
  left: 0;
  background: var(--after-bg);
  z-index: 1;
}
.collage-card-wrap.one .collage-card::before {
  bottom: -120px;
  right: 30%;
}
.collage-card-wrap.four .collage-card::before {
  right: 55%;
}
.collage-card-text {
  position: absolute;
  width: 100%;
  height: 100%;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  justify-content: end;
  left: 0;
  bottom: 0;
  padding: 32px 32px 24px 32px;
  z-index: 10;
}
.collage-card-text h3 {
  color: var(--color-text-dark);
  font-weight: 600;
  font-size: 1.5rem;
}
.collage-card-text p {
  font-weight: 600;
  font-size: 1.25rem;
  margin-top: 8px;
}
.collage-card.light .collage-card-text,
.collage-card.light .collage-card-text h3 {
  color: var(--color-text-extralight);
}
.collage-card-text .link-detail {
  margin-top: 32px;
  margin-bottom: 16px;
}
.collage-card.light .link-detail a {
  color: var(--color-text-extralight);
}
.collage-card-img {
  margin-top: 40px;
  margin-left: 40px;
  width: calc(100% - 40px);
  height: calc(100% - 40px);
}
.collage-card-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: right bottom;
}
.collage-card-wrap.one .collage-card-img {
  max-height: 600px;
  margin-right: 40px;
}
.collage-card-wrap.one .collage-card-img img {
  object-position: center bottom;
}
.collage-card-wrap.four .collage-card-img {
  width: 60%;
  margin-left: auto;
}
/* end COLLAGE */
/* BLOCK1 */
.block1 {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: -20px;
}
.block1-card-wrapper {
  padding: 20px;
}
.block1-card-wrapper:nth-child(1),
.block1-card-wrapper:nth-child(4) {
  flex-basis: 55%;
  min-width: 55%;
}
.block1-card-wrapper:nth-child(2),
.block1-card-wrapper:nth-child(3) {
  flex-basis: 45%;
  min-width: 45%;
}
.block1-card {
  height: 100%;
  min-height: 300px;
  position: relative;
  padding: 32px;
  background: var(--bg-color);
  border-radius: 24px;
  display: flex;
  justify-content: space-between;
  gap: 24px;
  overflow: hidden;
}
.block1-card::before {
  content: "";
  position: absolute;
  left: -120px;
  top: 65%;
  width: 430px;
  height: 350px;
  background: var(--before-bg);
  border-radius: 48% 52% 77% 23% / 46% 24% 76% 54%;
}
.block1-card-inner {
   z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 16px;
}
.light .block1-card-inner,
.light .mono-card-title {
  color: var(--color-text-extralight);
}
.block1-card-img {
  flex-basis: 300px;
  flex-shrink: 0;
   /* margin-top: 30px; */
  margin-right: -32px;
  margin-bottom: -32px;
  display: flex;
  align-items: end;
  justify-content: end;
  z-index: 1;
}
.child .block1-card-img {
  margin-right: -16px;
}
.block1-card-img img {
  width: 100%;
  height: 100%;
  max-height: 270px;
  object-fit: contain;
  object-position: right bottom;
}

.block1-card-wrapper:nth-child(2) .block1-card-img,
.block1-card-wrapper:nth-child(3) .block1-card-img {
  max-width: 55%;
}
/* end BLOCK1 */
/* METAL RATE */
.metalrate {
  padding: 56px 40px;
  border-radius: 30px;
  background: var(--bg-color);
}
.metalrate-table-wrapper {
  max-width: 1000px;
  margin: 0 auto;
}
.metalrate-table {
  width: 100%;
  background: var(--bg-color);
  border-collapse: collapse;
}
.metalrate-table tr {
  border-bottom: 1px solid var(--color-border-gray);
}
.metalrate-table td {
  padding: 16px 0;
  background: var(--bg-color);
}
.metalrate-table tr th {
  padding-bottom: 8px;
}
.metalrate-table tr .rate-th {
  font-size: 0.75rem;
  text-align: right;
  font-weight: 400;
}
.metalrate-table tr .name {
  color: var(--color-text-dark);
  font-weight: 600;
  font-size: 1rem;
  text-align: left;
}
.metalrate-table tr .name span {
  display: block;
  font-size: 0.75rem;
  font-weight: 400;
}
.metalrate-table tr .rate {
  color: var(--color-text-dark);
  font-weight: 600;
  font-size: 1.5rem;
  text-align: right;
  width: 200px;
}
.metalrate-table tr td:not(:first-child) {
  padding-left: 16px;
}
.metalrate-table tr td:first-child {
  width: 40px;
  text-align: left;
}
.metalrate-sub {
  margin-top: 8px;
  font-size: 0.75rem;
}
.metalrate-sub span {
  color: var(--color-text-dark);
  font-weight: 600;
}
/* end METAL RATE */
/* SUPPORT CONTACTS */
.support-contacts {
  margin: 0 auto;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 40px;
}
.support-contacts li {
  padding: 24px;
  border-radius: 16px;
  background: var(--color-bg-extralight);
  min-width: 190px;
}
.support-contacts li p {
  font-size: 0.875rem;
  color: var(--color-text-dark);
  margin-bottom: 8px;
}
.support-contacts li a {
  font-size: 1.25rem;
  color: var(--main-color);
  font-weight: 600;
}
.support-contacts li a:hover {
  color: var(--color-btn-hover);
}
/* end SUPPORT CONTACTS */
/* TARIFFS SAFE */
.safe .tariffs table th h4 {
  font-size: 1.25rem;
}
.safe .tariffs table th:first-child h4 {
  color: var(--color-text-dark);
}
.safe .tariffs table th {
  padding: 40px 32px;
}
.safe .tariffs table tbody td img {
  width: 100%;
  object-fit: contain;
  object-position: top center;
}
.tariffs table tbody tr:first-child td {
  padding-bottom: 8px;
}
.tariffs table tbody tr:first-child td:before {
  content: none;
}
.tariffs-links {
  margin-top: 56px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 16px;
}
.tariffs-links h2 {
  font-size: 1.5rem;
  color: var(--main-color);
  font-weight: 600;
  text-align: center;
  margin-bottom: 16px;
}
.tariffs-links a {
  color: var(--color-text-medium);
  line-height: 1.5;
}
.tariffs-links a span {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.tariffs-links a .icon {
  text-decoration: none;
}
.tariffs-links a:hover {
  color: var(--main-color);
}
/* end TARIFFS SAFE */

/* BASE */
.private-btn {
  background: var(--color-bg-extralight);
  padding: var(--padding-btn);
  border-radius: var(--border-radius-btndefault);
  color: var(--private-gradient);
  cursor: pointer;
  white-space: nowrap;
  z-index: 1;
}
.private-btn span {
  background: var(--private-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.private-btn:hover span {
  background: var(--private-gradient-rotade);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.card-logo {
  width: 80px;
  height: 80px;
  padding: 4px;
  border-radius: 12px;
  overflow: hidden;
  background: #f3f4f7;
}
.card-logo img {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  object-fit: contain;
}
.suggestion {
  text-align: center;
  color: var(--color-text-dark);
  font-size: 1.5rem;
  font-weight: 600;
}
.content-block-img-bottom.student {
  max-height: 500px;
}
.content-block-img-bottom.student img {
  max-height: 500px;
}
.product-card.ext .product-card-img {
  height: 80%;
}
.mini-block-wrapper.ext {
  padding-top: 8px;
}
.mini-block-wrapper.ext .mini-block-img {
  flex-basis: 50%;
}
.content-block-inner.ext .content-block-text {
  padding-bottom: 0;
}
.autocredit .info-card:before {
  content: none;
}
.autocredit .info-card-text-bottom a {
  position: absolute;
  left: 32px;
  bottom: 32px;
  z-index: 3;
}
.different-cards.safe .tower {
  min-width: 35%;
}
.safe .different-card .mono-card-paragraph {
  width: 100%;
  max-width: 500px;
}
.exclamation {
  display: flex;
  gap: 8px;
  font-weight: 600;
  color: var(--main-color);
}
.exclamation > img {
  width: 24px;
}
/* end BASE */
/* DETAIL */
.news-detail h3 {
  color: var(--main-color);
  margin-bottom: 16px;
  font-weight: 600;
  font-size: 1.5rem;
}
.news-detail a {
  color: var(--main-color);
}
.news-detail p {
  line-height: 1.5;
}
.news-detail p:not(:last-child) {
  margin-bottom: 8px;
}
.news-detail small {
  display: block;
  margin-top: 16px;
}
.news-detail ul {
  margin-bottom: 16px;
  margin-top: 8px;
}
.news-detail ul > li {
  position: relative;
  padding-left: 26px;
  line-height: 1.5;
}
.news-detail ul > li::before {
  content: "";
  position: absolute;
  top: 0.5rem;
  left: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--main-color);
}
.news-detail ul li:not(:last-child) {
  margin-bottom: 8px;
}
.news-detail .news-date-time {
  display: block;
  margin-bottom: 8px;
  font-size: 0.75rem;
  color: var(--color-text-medium);
}
.news-detail > h2 {
  margin-top: 16px;
  margin-bottom: 16px;
  font-weight: 600;
  font-size: 1.5rem;
}
.news-detail img {
  display: inline-block;
  margin: 8px;
}
/* end DETAIL */
.min .block-imgright-img img {
  max-height: 350px;
  object-position: right bottom;
}
.min .content-block-img-bottom img {
  max-height: 300px;
}
.min .mini-block-img img {
  max-height: 160px;
}
.number > span {
  float: left;
  width: 24px;
  height: 24px;
  color: var(--color-text-extralight);
  background: var(--main-color);
  font-size: 16px;
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 16px;
  margin-top: 3px;
}
@media (max-width: 1400px) {
  .corner-card-wrapper {
    flex-basis: 33.333%;
    max-width: 33.333%;
  }
}
@media (max-width: 1100px) {
  .salary-cards {
    flex-wrap: wrap;
  }
  .salary-cards .product-card-wrapper {
    flex-basis: 50%;
  }
  .brief-cards {
    flex-wrap: wrap;
  }
  .brief-card-wrapper {
    flex-basis: 50%;
  }
  .collage {
    margin: -12px;
  }
  .collage-card-wrap {
    padding: 12px;
  }
  .product-card.ext .product-card-img {
    height: 58%;
  }
}
@media (max-width: 1050px) {
  .corner-card-wrapper {
    flex-basis: 50%;
    max-width: 50%;
  }
}
@media (max-width: 1000px) {
  .four-cards-tower-wrapper {
    display: none;
  }
  .four-cards-element-wrapper.mobile {
    display: flex;
    flex-basis: 50%;
    flex-grow: 1;
  }
  .four-cards-tower-img {
    max-height: 200px;
    min-height: 100px;
  }
  .trio-item-wrapper {
    flex-basis: 100%;
  }
  .trio-item::before {
    right: 50%;
  }
  .info-cards.three {
    flex-wrap: wrap;
  }
  .info-cards.three .info-card-wrapper {
    flex-basis: 50%;
    min-width: 340px;
    flex-grow: 1;
  }
  .collage {
    grid-template-columns: 50% 50%;
    grid-template-rows: repeat(2, 1fr);
    margin: -12px;
  }
  .collage-card-wrap {
    padding: 12px;
  }
  .collage-card-wrap.one {
    grid-row-start: 1;
    grid-row-end: 2;
  }
  .collage-card-wrap.two {
    grid-column-start: 2;
    grid-column-end: 3;
  }
  .collage-card-wrap.four {
    grid-column-start: 2;
    grid-column-end: 3;
    grid-row-start: 2;
    grid-row-end: 3;
  }
  .collage-card-wrap.one .collage-card {
    max-height: 320px;
  }
  .collage-card-wrap.one .collage-card-img {
    max-height: 100%;
    margin-right: 0;
  }
  .collage-card-wrap.one .collage-card-img img {
    object-position: right bottom;
  }
  .collage-card-wrap.four .collage-card-img {
    width: 100%;
  }
  .collage-card-wrap.four .collage-card::before {
    right: 20%;
  }
  .block1-card-wrapper:nth-child(1),
  .block1-card-wrapper:nth-child(4) {
    flex-basis: 50%;
    min-width: 50%;
  }
  .block1-card-wrapper:nth-child(2),
  .block1-card-wrapper:nth-child(3) {
    flex-basis: 50%;
    min-width: 50%;
  }
  .block1-card-img {
    flex-basis: 55%;
  }
  .paircard-wrapper:nth-child(1) {
    flex-basis: 50%;
  }
  .paircard-wrapper:nth-child(2) {
    flex-basis: 50%;
  }
}
@media (max-width: 900px) {
  .pair {
    margin: -8px;
  }
  .paircard-wrapper {
    padding: 8px;
  }
  .advt-cards {
    gap: 16px;
  }
  .advt-card {
    padding: 32px 16px;
  }
  .brief-cards {
    margin: -8px;
  }
  .brief-card-wrapper {
    padding: 8px;
  }
  .info-cards {
    flex-wrap: wrap;
  }
  .info-card-wrapper {
    flex-basis: 100%;
  }
  .info-cards.different .info-card-wrapper:nth-child(1) {
    flex-basis: 100%;
  }
  .info-cards.different .info-card-wrapper:nth-child(2) {
    flex-basis: 100%;
  }
  .wide .info-card-img {
    margin-right: -33px;
  }
  .block1 {
    margin: -8px;
  }
  .block1-card-wrapper {
    padding: 8px;
  }
  .block1-card-img {
    flex-basis: 55%;
  }
}
@media (max-width: 850px) {
  .info-cards {
    flex-wrap: wrap;
  }
  .info-card-wrapper {
    flex-basis: 100%;
  }
  .content-block-img-bottom.student {
    max-height: 300px;
  }
  .content-block-img-bottom.student img {
    max-height: 300px;
  }
  .min .block-imgright-img img {
    max-height: 300px;
    object-position: center bottom;
  }
  .content-block.gold {
    padding: 40px 32px 0 32px;
  }
  .content-block.gold .content-block-inner {
    flex-wrap: wrap-reverse;
    gap: 40px;
  }
  .content-block.gold .content-block-img-bottom {
    margin-bottom: 0;
  }
}
@media (max-width: 800px) {
  .short-block {
    padding: 40px 32px;
  }
  .block1-card-wrapper:nth-child(1),
  .block1-card-wrapper:nth-child(4) {
    flex-basis: 100%;
    min-width: 100%;
  }
  .block1-card-wrapper:nth-child(2),
  .block1-card-wrapper:nth-child(3) {
    flex-basis: 100%;
    min-width: 100%;
  }
  .block1 {
    margin: -20px;
  }
  .block1-card-wrapper {
    padding: 20px;
  }

  .block1-card-img {
    flex-basis: 50%;
  }
}
@media (max-width: 750px) {
  .short-block {
    flex-wrap: wrap;
    gap: 24px;
  }
  .short-block-img {
    margin-bottom: 0;
    flex-basis: 100%;
    position: relative;
  }
  .short-block-img::before {
    content: "";
    position: absolute;
    top: 80%;
    left: 0;
    bottom: -3px;
    width: 100%;
    background: linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0) 18%,
      var(--bg-color) 90%
    );
  }
  .short-block-text {
    flex-basis: 100%;
  }
  .collage {
    grid-template-columns: 100%;
    grid-template-rows: repeat(4, 1fr);
    margin: -20px;
  }
  .collage-card-wrap {
    padding: 20px;
  }
  .collage-card-wrap.one {
    grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 1;
    grid-row-end: 2;
  }
  .collage-card-wrap.two {
    grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 2;
    grid-row-end: 3;
  }
  .collage-card-wrap.four {
    grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 4;
    grid-row-end: 5;
  }
  .collage-card-wrap.one .collage-card::before,
  .collage-card-wrap.two .collage-card::before,
  .collage-card-wrap.three .collage-card::before,
  .collage-card-wrap.four .collage-card::before {
    right: auto;
    left: -250px;
  }
  .product-card.ext {
    min-height: 330px;
  }
}
@media (max-width: 720px) {
  .safe .tower .mono-card-paragraph {
    width: 60%;
  }
}
@media (max-width: 700px) {
  .salary-cards .product-card-wrapper {
    flex-basis: 100%;
  }
  .corner-card-wrapper {
    flex-basis: 100%;
    max-width: 100%;
  }
  .mini-block-wrapper.ext .mini-block-img {
    flex-basis: 100%;
  }
  .wide .info-card-body {
    flex-wrap: wrap;
    gap: 40px;
  }
  .wide .info-card-img {
    margin-right: 0;
    flex-basis: 100%;
  }
}
@media (max-width: 650px) {
  .pair {
    margin: -20px;
  }
  .paircard-wrapper {
    padding: 20px;
  }
  .paircard-wrapper:nth-child(1),
  .paircard-wrapper:nth-child(2) {
    flex-basis: 100%;
  }
  .paircard {
    padding-top: 40px;
    /* flex-direction: column; */
    min-height: 300px;
  }
  .paircard-text {
    padding: 0 24px;
  }
  .paircard-text h5 {
    margin-bottom: 24px;
  }
  .paircard .link-detail {
    left: 24px;
    bottom: 24px;
  }
  .paircard-img {
    width: 50%;
  }
  .paircard-img img {
    max-height: 200px;
  }
}
@media (max-width: 600px) {
  .advt-cards {
    flex-wrap: wrap;
    gap: 40px;
  }
  .advt-card {
    flex-basis: 100%;
  }
  .brief-cards {
    margin: -20px;
  }
  .brief-card-wrapper {
    padding: 20px;
    flex-basis: 100%;
  }
  .search-section {
    padding: 40px 16px;
  }
  .product-card.ext {
    min-height: 300px;
  }
}
@media (max-width: 550px) {
  .short-block {
    padding: 40px 16px;
  }
  .limitstable-row-name > span {
    font-size: 1rem;
    line-height: 1.5;
  }
  .limitstable-row-name .icon {
    margin-top: 0.35rem;
  }
  .limitstable-dropdown thead {
    display: none;
  }
  .limitstable-dropdown tr {
    display: flex;
    flex-wrap: wrap;
  }
  .limitstable-dropdown tr td:first-child {
    width: 100%;
    padding-bottom: 4px;
    padding-left: 8px;
    padding-right: 8px;
    border-bottom-left-radius: 0;
    border-top-right-radius: 12px;
    min-width: 100%;
  }
  .limitstable-dropdown tr td:last-child {
    padding-top: 4px;
    padding-right: 8px;
    width: 100%;
    text-align: left;
    border-bottom-left-radius: 12px;
    border-top-right-radius: 0;
  }
  .limitstable-dropdown tr.row-empty td {
    padding: 12px;
  }
  .trio-item {
    flex-wrap: wrap;
    gap: 40px;
    padding: 40px 16px;
  }
  .trio-item::after {
    content: "";
    position: absolute;
    top: 80%;
    left: 0;
    bottom: -3px;
    width: 100%;
    background: linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0) 18%,
      var(--bg-color) 90%
    );
    z-index: 2;
  }
  .trio-item-img {
    flex-basis: 100%;
    margin-right: 0;
    margin-bottom: -40px;
  }
  .trio-item-img img {
    max-height: 300px;
    object-position: center bottom;
  }
}
@media (max-width: 500px) {
  .paircard::before {
    right: 20%;
  }
  .paircard::after {
    content: "";
    position: absolute;
    top: 80%;
    left: 0;
    bottom: -3px;
    width: 100%;
    background: linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0) 18%,
      var(--bg-color) 90%
    );
    z-index: 2;
  }
  .paircard-text {
    text-align: center;
    margin-bottom: 40px;
  }
  .paircard .link-detail {
    left: 50%;
    transform: translateX(-50%);
  }
  .paircard .link-detail a {
    padding: var(--padding-btn);
    border-radius: var(--border-radius-btndefault);
    background: var(--color-bg-extralight);
    color: var(--main-color);
  }
  .paircard-img {
    width: 100%;
    padding: 0 24px;
  }
  .paircard-img img {
    max-height: 300px;
    object-position: center bottom;
  }
  .info-cards {
    margin: -20px;
  }
  .info-card-wrapper {
    padding: 20px;
  }
  .info-card {
    padding: 32px 16px;
  }
  .info-card .card-title {
    text-align: center;
  }
  .info-card-text {
    width: 100%;
    gap: 0;
  }
  .info-card-text ul li {
    text-align: left;
  }
  .info-card-body {
    flex-wrap: wrap;
    gap: 40px;
  }
  .info-card-img {
    flex-basis: 100%;
    margin-top: 0;
    margin-right: 16px;
    justify-content: center;
    position: relative;
  }
  .info-card.ext .info-card-img {
    flex-basis: 100%;
  }
  .info-card.light .link-detail a {
    color: var(--main-color);
  }
  /* .info-card-img::before {
    content: "";
    position: absolute;
    top: 80%;
    left: 0;
    bottom: 0;
    width: 100%;
    background: linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0) 18%,
      var(--bg-color) 90%
    );
  } */
  .info-card-img img {
    object-position: center bottom;
  }
  .info-card .link-detail {
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    padding: var(--padding-btn);
    border-radius: var(--border-radius-btndefault);
    background: var(--color-bg-extralight);
    color: var(--main-color);
    cursor: pointer;
    z-index: 2;
  }
  .info-card .link-detail a,
  .info-card .link-detail.dark a {
    color: var(--main-color);
  }
  .wide .info-card .link-detail {
    position: relative;
    margin-top: 24px;
    bottom: 0;
    padding: 0;
    background: none;
  }
  .info-card.no-picture .info-card-text-bottom:has(.link-detail) {
    margin-bottom: 72px;
  }
  .info-card-text-bottom button {
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;
    z-index: 2;
  }
  .block1-card {
    flex-wrap: wrap;
    gap: 40px;
  }
  .block1-card-wrapper:nth-child(2) .block1-card-img,
  .block1-card-wrapper:nth-child(3) .block1-card-img {
    max-width: 100%;
  }
  .block1-card-img {
    margin-top: 0;
    margin-right: 0;
    justify-content: center;
    flex-basis: 100%;
  }
  .block1-card-img img {
    object-position: center bottom;
  }
  .mini-block-wrapper.ext {
    padding-top: 24px;
    padding-left: 16px;
    padding-right: 16px;
  }
  .autocredit .info-card-text-bottom a {
    left: 50%;
    transform: translateX(-50%);
  }
  .metalrate {
    padding: 40px 16px;
  }
  .metalrate-table tr td.name {
    padding-left: 8px;
  }
  .metalrate-table tr .rate {
    font-size: 1.25rem;
  }
  .safe .tower .mono-card-paragraph {
    width: 100%;
  }
  .small-block-wrapper {
    padding: 0 16px;
  }
}
@media (max-width: 460px) {
  .salary-cards .product-card-img {
    height: auto;
  }
  .collage-card-wrap.one .collage-card::before,
  .collage-card-wrap.two .collage-card::before,
  .collage-card-wrap.three .collage-card::before,
  .collage-card-wrap.four .collage-card::before {
    bottom: -190px;
    right: 20%;
    left: auto;
  }
  .product-card.ext .product-card-img {
    height: auto;
  }
  .content-block.gold {
    padding: 40px 16px 0 16px;
  }
}
@media (max-width: 420px) {
  .safe .tarif-tab {
    padding: 12px 8px;
  }
}
/* end PRIVATE CLIENTS */

/* NEW YEAR */
/*.mobile-menu-logo::before,
.header-logo::before {
  content: "";
  background-image: url(/upload/new_year/hat.png);
  background-size: cover;
  background-repeat: no-repeat;
  position: absolute;
  top: -18px;
  left: -12px;
  width: 37px;
  height: 24px;
}
.apb-online {
  position: relative;
}
.apb-online::before {
  content: "";
  background-image: url(/upload/new_year/santa_reindeer.png);
  background-size: cover;
  background-repeat: no-repeat;
  position: absolute;
  bottom: 0;
  right: 100%;
  width: 152px;
  height: 48px;
  z-index: -1;
}
@media (max-width: 1170px) {
  .apb-online::before {
    content: none;
  }
}*/
/* end NEW YEAR */