@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');
:root {
  --color-accent: #FFC300;
  --color-secondary: #131C44;
  --color-text: #FFF;
  --swiper-theme-color: #FFC300;
  --swiper-pagination-bottom: 50px;
  --swiper-navigation-color: #fff;
  --swiper-navigation-size: 25px;
  --swiper-navigation-sides-offset: 16px;
  --swiper-pagination-bullet-inactive-color: #FFC300;
  --swiper-pagination-bullet-inactive-opacity: 1;
  --swiper-pagination-bullet-horizontal-gap: 2.5px;
  --swiper-pagination-bullet-border-radius: 0;
  --swiper-pagination-bullet-height: 2px;
  --swiper-pagination-bullet-width: 50px;
}
.link {transition: ease-in-out 0.3s; text-decoration: none; color: var(--color-text);}
.link:hover {color: var(--color-accent);}
.object-fit-cover {width: 100%; height: 100%; object-fit: cover;}
.container {width: 100%; max-width: 1440px; padding: 0 20px; margin: 0 auto;}
.hidden {display: none!important;}

html {overflow-x: hidden;}
body {font-family: 'Ubuntu', sans-serif; font-size: 16px; line-height: normal; background-color: #000; color: var(--color-text); overflow-x: hidden;}

.header {position: fixed; left: 0; top: 35px; width: 100%; z-index: 10;}
.header__wrap {display: flex; align-items: center; justify-content: space-between;}
.header__contacts-email {font-size: 30px; color: #fff;}

.slider {position: absolute; left: 0; top: 0; width: 100%; height: 95vh;}
.slider__slide {display: flex; align-items: center; background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed;  overflow-y: auto;}
.slider__slide .container {height: 100%;}
.slider__body {display: flex; align-items: center; gap: 10px; height: 100%;}
.slider__body:not(.slider__body--home) .slider__header {width: 30%;}
.slider__header {flex-shrink: 0;}
.slider__title {font-size: 55px; font-weight: bold; text-transform: uppercase;}
.slider__subtitle {font-size: 35px; margin-top: 31px;}
.slider__content {flex-grow: 1; height: 100%; padding: 10% 0;}
.slider__content--contacts {display: flex; align-items: center;}

.about__tabs {display: flex; gap: 83px; padding-left: 92px; margin-bottom: 42px;}
.about__tab {position: relative; border: none; background: none; padding: 0 0 4px 0; color: #fff; cursor: pointer;}
.about__tab.active {font-size: 18px; font-weight: bold; color: var(--color-accent);}
.about__tab.active:after {content: ''; display: block; position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; background-color: var(--color-accent);}

.about__content {height: 100%;}
.about__tab-content {height: 100%; padding-left: 52px;}
.about__tab-content:not(.active) {display: none;}
.about__tab-content--features {display: flex; align-items: center; gap: 37px; padding-left: 42px;}

.about__feature {display: flex; height: 100%; padding: 80px 22px; flex-grow: 1; border: solid 1px var(--color-accent); border-radius: 35px; background-color: rgba(235,236,238,0.1); backdrop-filter: blur(25px);}
.about__feature-title {font-size: 45px;}
.about__feature-subtitle {font-size: 35px;}
.about__feature-img {padding: 24px 3px 0 3px;}

.about__feature--first {flex-direction: column; justify-content: flex-end; max-width: 295px;}
.about__feature--first .about__feature-title {font-size: 80px; text-align: right;}
.about__feature--first .about__feature-subtitle {text-align: right;}

.about__feature--second {align-items: center; gap: 28px; padding: 62px; max-height: 487px;}

.about__feature-circle {display: flex; align-items: center; justify-content: center; flex-shrink: 0; border: solid 1px #fff; border-radius: 50%;}
.about__feature-circle--main {width: 200px; height: 200px;}
.about__feature-circle--inside {width: 156px; height: 156px;}

.about__docs {display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px;}
.about__doc {display: flex; flex-shrink: 0; gap: 34px;}
.about__doc-pdf {width: 86px; height: 86px; flex-shrink: 0;}
.about__doc-info {display: flex; flex-direction: column; gap: 10px;}
.about__doc-title {color: #fff;}
.about__doc-download {width: 35px; height: 35px;}

.services {display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; padding-bottom: 100px;}
.services__item {position: relative; padding: 38px 20px 65px 20px; aspect-ratio: 1 / 1; border: solid 1px var(--color-accent); border-radius: 35px; background-color: rgba(235,236,238,0.1); backdrop-filter: blur(10px);}
.services__item:hover {background-color: #fff; color: var(--color-secondary); cursor: pointer;}
.services__item-title {font-size: 18px; font-weight: bold; margin-bottom: 5px;}
.services__item-subtitle {font-size: 14px;}
.services__item-arrow {width: 35px; height: 35px; position: absolute; left: 20px; bottom: 20px;}

.services-info {position: relative; display: flex; width: 100%; height: 100%; border-radius: 35px; overflow: hidden;}
.services-info:not(.active) {display: none;}
.services-info__header {padding: 47px 46px 47px 50px; background-color: var(--color-accent); color: var(--color-secondary); max-width: 210px;}
.services-info__title {font-size: 18px; font-weight: bold; margin-bottom: 4px;}
.services-info__subtitle {font-size: 12px;}
.services-info__body {flex-grow: 1; padding: 115px 50px 50px 50px; background-color: #fff; color: var(--color-secondary); overflow-y: auto;}
.services-info__close {width: 35px; height: 35px; background: none; border: none; position: absolute; right: 50px; top: 50px; cursor: pointer;}
.services-info__list {display: flex; flex-direction: column; padding-left: 37px; gap: 34px;}
.services-info__list-item {position: relative;}
.services-info__list-item:before {content: ''; position: absolute; left: -37px; top: -3px; display: block; width: 25px; height: 25px; background: url('../img/svg/icon-check.svg') no-repeat center center;}

.products {display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px 30px; padding-right: 115px;}
.products__item {display: flex; flex-direction: column; gap: 8px;}

.partners {display: grid; grid-template-columns: repeat(4, 1fr); gap: 23px; max-width: 730px; margin-left: auto;}
.partners__item {display: flex; align-items: center; justify-content: center; padding: 15px; aspect-ratio: 1 / 1; background-color: rgba(19,28,68,0.1); backdrop-filter: blur(10px);}
.products__item-img {width: 160px; aspect-ratio: 1 / 1;}

.contacts {flex-grow: 1; max-width: 450px; padding: 62px 81px 83px 62px; border: solid 1px var(--color-accent); border-radius: 35px; background-color: rgba(235,236,238,0.1); backdrop-filter: blur(10px);}
.contacts__title {font-size: 35px; margin-bottom: 23px;}
.contacts__list {display: flex; flex-direction: column; gap: 25px; margin: 0;}
.contacts__item {position: relative;}
.contacts__item:before {content: ''; position: absolute; left: -37px; top: -3px; display: block; width: 25px; height: 25px;}
.contacts__item--address:before {background: url('../img/svg/icon-address.svg') no-repeat center center;}
.contacts__item--mail:before {background: url('../img/svg/icon-mail.svg') no-repeat center center;}

.footer {position: fixed; left: 0; bottom: 0; width: 100%; background-color: #000; z-index: 10;}
.footer__menu-list {display: flex; align-items: center; margin: 0; padding: 0;}
.footer__menu-link {display: inline-flex; gap: 5px; padding: 21px 30px; color: #fff;}
.footer__menu-link span {color: var(--color-accent);}
.footer__menu-link.active {background-color: var(--color-accent); color: var(--color-secondary);}
.footer__menu-link.active span {color: var(--color-secondary);}
