@font-face {
   font-family: 'TT Norms Pro';
   src: url('../fonts/TTNormsPro-Bold.woff2') format('woff2'),
      url('../fonts/TTNormsPro-Bold.woff') format('woff');
   font-weight: bold;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'TT Norms Pro';
   src: url('../fonts/TTNormsPro-Regular.woff2') format('woff2'),
      url('../fonts/TTNormsPro-Regular.woff') format('woff');
   font-weight: normal;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'TT Norms Pro';
   src: url('../fonts/TTNormsPro-Medium.woff2') format('woff2'),
      url('../fonts/TTNormsPro-Medium.woff') format('woff');
   font-weight: 500;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'RF Dewi Expanded';
   src: url('../fonts/RFDewiExpanded-Regular.woff2') format('woff2'),
      url('../fonts/RFDewiExpanded-Regular.woff') format('woff');
   font-weight: normal;
   font-style: normal;
   font-display: swap;
}

/* --------- Specification --------- */
body {
   font-family: 'TT Norms Pro', sans-serif;
   color: #22232C;
   margin: 0;
   padding: 0;
   font-size: 16px;
   background: url(../img/fon.jpg) no-repeat center top/cover;
}

body.active {
   overflow: hidden;
}

body, html {
   height: 100%;
}

div, p, form, input, a, span, button, textarea, input {
   box-sizing: border-box;
}

ul, li {
   display: block;
   padding: 0;
   margin: 0;
}

p {
   margin: 0;
   font-weight: 400;
}

h1, h2, h3, h4, h5, h6 {
   margin: 0;
}

a, a:hover, a:active {
   text-decoration: none;
}

a, button, input {
   transition: all 0.5s ease;
}

a {
   color: inherit;
}

input {
   font-family: inherit;
   border-radius: 0;
   -webkit-appearance: button;
}

input, input:hover, input:focus, input:active,
button, button:hover, button:focus, button:active,
textarea, textarea:hover, textarea:focus, textarea:active {
   outline: none;
}

textarea {
   outline: none;
   resize: none;
   font-family: inherit;
   border: none;
   display: block;
}

main {
   flex: 1 1 auto;
}

.wrapper {
   min-height: 100%;
   display: flex;
   flex-direction: column;
}

.container {
   margin: 0 auto;
   max-width: 1180px;
   padding-left: 15px;
   padding-right: 15px;
}

.d-flex {
   display: flex;
}

.text-center {
   text-align: center;
}

.ibg {
   position: relative;
}

.ibg img, .ibg iframe {
   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
}

.ibg img {
   object-fit: cover;
}

img {
   width: 100%;
   display: block;
}

.btn {
   font-family: inherit;
   display: inline-block;
   text-align: center;
   cursor: pointer;
   border: none;
   background-color: transparent;
}

/* MOBILE MENU BUTTON */
.menu-btn {
   background-color: transparent;
   border: none;
   width: 45px;
   cursor: pointer;
   padding: 0;
   margin: -4px 0;
   z-index: 99999;
   transition: all 0.5s ease;
   display: block;
   position: relative;
}

.menu-btn .line {
   width: 100%;
   height: 5px;
   background-color: #000000;
   display: block;
   margin: 4px 0;
   -webkit-transition: all .5s ease;
   -o-transition: all .5s ease;
   transition: all .5s ease;
}

.menu-btn.active .line:first-child {
   -webkit-transform: rotate(-45deg);
   -ms-transform: rotate(-45deg);
   transform: rotate(-45deg);
   position: relative;
   top: 12px;
}

.menu-btn.active .line:nth-child(2) {
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
   margin-top: 8px;
   position: relative;
}

.menu-btn.active .line:nth-child(3) {
   opacity: 0;
}

.navigation__mobal-phone, .btn-burger, .mobal-menu, .btn-burger svg.active {
   display: none;
}


/* --------- Header --------- */
.header {
   padding: 17px 0 21px;
   border-bottom: 2px solid rgb(255 13 57 / 10%);
}

.navigation {
   align-items: center;
   justify-content: space-between;
}

.navigation__logo {
   width: 70px;
}

.navigation__menu {
   display: flex;
   align-items: center;
}

.navigation__menu li:not(:last-child) {
   margin-right: 36px;
}

.navigation__menu li a {
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 16px;
   color: #6c6d74;
}

.navigaion__contact a {
   display: block;
}

.navigation__contact-phone {
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 20px;
   margin-bottom: 6px;
   position: relative;
}

.navigation__contact-phone:before {
   content: '';
   position: absolute;
   width: 32px;
   height: 32px;
   border-radius: 4px;
   background: #FF0D39 url('../img/icons/phone.svg') no-repeat center center;
   right: 100%;
   top: 0;
   margin-right: 16px;
}

.navigation__contact-mail {
   color: #8a8b91;
}

/* --------- Hero --------- */
.hero {
   padding: 48px 0 69px;
}


.hero__title {
   font-family: 'RF Dewi Expanded', sans-serif;
   text-align: center;
   font-size: 72px;
   font-weight: 400;
   line-height: 120%;
   margin-bottom: 48px;
}

.hero__adv {
   max-width: 1020px;
   margin: 0 auto 53px;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-wrap: wrap;
}

.hero__adv li {
   font-size: 24px;
   padding: 10px 23px;
   border-radius: 17px;
   border: 2px solid #484848;
   margin: 10px 16px;
   color: #484848;
}

.hero__adv li:after {
   content: '+';
   display: inline-block;
   font-size: 28px;
   color: #22232C;
   margin-left: 32px;
}

.hero__btn {
   width: 360px;
   margin: auto;
   padding: 22px 0;
   color: #FFF;
   font-family: 'TT Norms Pro', sans-serif;
   font-size: 21px;
   font-weight: 500;
   text-transform: uppercase;
   border-radius: 12px;
   background: #22232C;
   display: flex;
   align-items: center;
   justify-content: center;
}

.hero__btn svg {
   width: 17px;
   height: 17px;
   margin-left: 15px;
}

/* --------- About --------- */
.about {
   padding-top: 69px;
   padding-bottom: 50px;
}

.about__top {
   border-radius: 32px;
   border: 2px solid #484848;
   background-color: #FFF;
   padding: 26px 60px;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 56px;
}

.about__top h2 {
   max-width: 250px;
   font-weight: 400;
   line-height: 119.5%;
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 67px;
}

.about__top p {
   max-width: 720px;
   font-size: 18px;
   line-height: 133%;
   letter-spacing: 0.54px;
}

.about__result {
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.about__result-item {
   text-align: center;
   max-width: 150px;
   width: 100%;
   position: relative;
}

.about__result-item.plus::before,
.about__result-item.from::before {
   position: absolute;
   color: #FF0D39;
   font-family: 'RF Dewi Expanded', sans-serif;
}

.about__result-item.plus::before {
   content: '+';
   top: -16px;
   right: 0;
   font-size: 36px;
}

.about__result-item.from::before {
   content: 'c';
   left: -25px;
   top: 15px;
   font-size: 22px;
}

.about__result-num {
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 44px;
   line-height: 91%;
   padding-bottom: 26px;
   border-bottom: 3px solid #484848;
   margin-bottom: 16px;
}

.about__result-text {
   line-height: 137%;
}

.about__result-icon {
   padding-bottom: 26px;
   margin-bottom: 16px;
   border-bottom: 3px solid #484848;
}

.about__result-icon img {
   width: 40px;
   height: 40px;
   margin: auto;
}

/* --------- Tariff --------- */
.tariff {
   padding: 50px 0 70px;
}

.tariff-wrapper {
   display: flex;
}

.tariff-wrapper__item {
   border-radius: 32px;
   position: relative;
   min-height: 580px;
   width: 36%;
   padding: 61px 40px;
   z-index: 1;
}

.tariff-wrapper__item:not(:first-child) {
   margin-left: -37px;
}

.tariff-wrapper__item h2 {
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 24px;
   margin-bottom: 18px;
   font-weight: 400;
}

.tariff-wrapper p {
   font-size: 18px;
   max-width: 216px;
   line-height: 133%;
}

.tariff-wrapper__image {
   position: absolute;
   bottom: 0;
   left: 0;
   z-index: -1;
   width: 100%;
   height: 100%;
}

.tariff-wrapper__image img {
   border-radius: 32px;
   height: 100%;
}

.tariff-wrapper__item_first {
   background-color: #EAE8E8;
}

.tariff-wrapper__item_second {
   background-color: #ffffff;
}

.tariff-wrapper__item_third {
   background-color: #FF0D39;
   color: #ffffff;
}

.tariff-wrapper__item_third .tariff-wrapper__image {
   width: 250px;
   height: 270px;
   left: 50%;
   transform: translateX(-50%);
   bottom: 40px;
}

/* --------- Services --------- */
.services {
   padding-top: 60px;
   padding-bottom: 60px;
}

.services-title {
   margin-bottom: 51px;
   text-align: center;
}

.services-wrapper {
   justify-content: space-between;
}

.services-wrapper__item {
   width: 48%;
   border-radius: 32px;
   border: 1px solid #22232C;
   background-color: #FFF;
   padding: 30px 35px 50px 48px;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
}

.services-wrapper__top {
   display: flex;
   align-items: center;
   margin-bottom: 23px;
}

.services-wrapper__num {
   color: #FF0D39;
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 58px;
   font-weight: 400;
   line-height: normal;
   text-transform: uppercase;
   margin-right: 32px;
}

.services-wrapper__title {
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 24px;
   font-weight: 400;
   line-height: 145%;
   text-transform: uppercase;
}

.services-wrapper__bottom p {
   font-size: 18px;
   line-height: 133%;
   letter-spacing: 0.54px;
   margin-bottom: 32px;
}

.services-wrapper__bottom ul {
   margin-bottom: 40px;
   min-height: 270px;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
}

.services-wrapper__bottom ul li {
   letter-spacing: 0.48px;
   padding-left: 45px;
   line-height: 20px;
   position: relative;
}

.services-wrapper__bottom ul li:not(:last-child) {
   margin-bottom: 16px;
}

.services-wrapper__bottom ul li:before {
   content: '';
   position: absolute;
   width: 16px;
   height: 16px;
   top: 50%;
   transform: translateY(-50%);
   left: 0;
   background: url('../img/icons/check.svg') no-repeat center center;
   border-radius: 3px;
}

.services-wrapper__btn {
   width: 256px;
}

.btn-red {
   color: #FFF;
   border-radius: 12px;
   background: #FF0D39;
   font-size: 14px;
   font-weight: 500;
   letter-spacing: 0.21px;
   text-transform: uppercase;
   padding: 18px 0;
   display: flex;
   align-items: center;
   justify-content: center;
}

.btn-red span {
   margin-right: 28px;
}

.btn-red img {
   width: 17.543px;
   display: inline-block;
}

.section-title {
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 48px;
   font-weight: 400;
   line-height: 130%;
}

/* --------- Projects --------- */
.projects {
   padding-top: 60px;
   padding-bottom: 140px;
}

.projects-title {
   margin-bottom: 40px;
}

.projects .projects-logo {
   margin-bottom: 70px;
}

.projects-logo .slick-dots li.slick-active button:before, .projects-logo .slick-dots li button:before {
   color: #FF0D39;
   font-size: 14px;
}

.projects-logo .slick-dots {
   bottom: -37px;
}

.projects-logo.slick-initialized .slick-slide {
   display: flex;
   gap: 10px;
   align-items: center;
   justify-content: center;
}

.projects-logo__item {
   width: 74px;
   height: 79px;
}

.projects-logo__item img {
   height: 100%;
   width: auto;
   object-fit: contain;
}

.projects-slider {
   width: 100%;
   max-width: 1040px;
}

.projects-slider .projects-slider__slide {
   border-radius: 32px;
   border: 1px solid #22232C;
   background-color: #FFF;
   padding: 35px 45px 30px;
}

.projects-slider__label {
   letter-spacing: 0.16px;
   margin-bottom: 25px;
}

.projects-slider__title {
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 24px;
   font-weight: 400;
   line-height: 145%;
   margin-bottom: 25px;
}

.projects-slider__industry {
   margin-bottom: 25px;
}

.projects-slider__h3 {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.18px;
   margin-bottom: 20px;
}

.projects-slider__industry-block {
   border-radius: 30px;
   background-color: #FF0D39;
   font-weight: 500;
   letter-spacing: 0.16px;
   height: 36px;
   line-height: 36px;
   display: inline-block;
   padding: 0 27px;
   color: #FFF;
}

.projects-slider__task {
   margin-bottom: 28px;
}

.projects-slider__task p {
   line-height: 137%;
}

.projects-slider__result {
   display: flex;
   align-items: center;
   margin-bottom: 30px;
}

.projects-slider__result-block:not(:last-child) {
   margin-right: 25px;
}

.projects-slider__result-block {
   width: 170px;
}

.projects-slider__result-num {
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 24px;
   font-weight: 400;
   padding-bottom: 12px;
   margin-bottom: 12px;
   position: relative;
}

.projects-slider__result-num:before {
   content: '';
   position: absolute;
   width: 32px;
   height: 2.011px;
   background-color: #FF0D39;
   bottom: 0;
   left: 0;
}

.projects-slider__btn {
   width: 275px;
}

.competencies-title {
   margin-bottom: 60px;
}

.slick-next, .slick-prev {
   width: 65.28px;
   height: 64px;
   border-radius: 65.28px;
   background-color: #FF0D39 !important;
   background-repeat: no-repeat !important;
   background-position: center center !important;
   z-index: 1;
   right: -110px;
   top: 50%;
   transform: translateY(-50%);
}

.slick-next {
   background-image: url('../img/icons/arrow-bottom.svg') !important;
}

.slick-prev {
   background-image: url('../img/icons/arrow-top.svg') !important;
}

.slick-next:before, .slick-prev:before {
   display: none;
}

.projects-slider .slick-prev {
   left: auto;
}

.projects-slider .slick-next {
   margin-top: 75px;
}

/* --------- Team --------- */

.team {
   padding: 150px 0 120px;
}

.team-wrap{
   display: flex;
   align-items: center;
}

.team-about {
   border-radius: 24px;
   padding: 46px 44px;
   background: #FFF;
   max-width: 518px;
   width: 100%;
}

.team-about__person  {
   display: flex;
   align-items: center;
   margin-bottom: 32px;
}

.team-about__person > img {
   width: 80px;
   margin-right: 30px;
   border-radius: 50%;
}

.team-about__block > h3 {
   color: #22232C;
   font-size: 18px;
   font-weight: 400;
   line-height: 130%;
   font-family: 'RF Dewi Expanded',sans-serif;
}

.team-about__block > span {
   color: #FF0D39;
   font-family: 'RF Dewi Expanded',sans-serif;
   font-size: 14px;
   font-weight: 800;
   line-height: 130%;
}

.team-about > p {
   color: #22232C;
   font-size: 18px;
   opacity: 0.9;
   line-height: 24px;
}

.team-about > p:not(:last-child) {
   margin-bottom: 30px;
}

.team-offer {
   max-width: 516px;
   width: 100%;
   margin-left: 52px;
}

.team-offer h2 {
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 48px;
   line-height: 130%;
   font-weight: 400;
}

.team-offer__list {
   margin: 48px 0 120px;
}

.team-offer__list li {
   padding: 11px 23px;
   font-size: 22px;
   opacity: 0.9;
   border-radius: 17px;
   border: 2px solid #484848;
   width: max-content;
   display: flex;
   align-items: center;
}

.team-offer__list li:not(:last-child) {
   margin-bottom: 20px;
}

.team-offer__list li:after {
   content: '+';
   display: inline-block;
   font-size: 28px;
   margin-left: 28px;
}

.team-offer__list li span {
   display: contents;
   font-size: 16px;
}


.team-offer__btn {
   width: 286px;
   padding: 22px 0;
   color: #FFF;
   font-family: 'TT Norms Pro', sans-serif;
   font-size: 16px;
   font-style: normal;
   font-weight: 500;
   line-height: normal;
   letter-spacing: 0.24px;
   text-transform: uppercase;
   border-radius: 12px;
   background: #22232C;
   display: flex;
   align-items: center;
   justify-content: center;
}

.team-offer__btn svg {
   margin-left: 28px;
}

/* --------- Contact --------- */


.contact {
   padding: 48px 0;
   background: #FFF;
}

.contact-wrap {
   display: flex;
   margin-top: 60px;
}

.contact-map {
   max-width: 330px;
   width: 100%;
}

.contact-map > h3, .contact-details > h3 {
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 24px;
   font-weight: 400;
   margin-bottom: 42px;
}

.contact-details {
   max-width: 690px;
   width: 100%;
   margin-left: auto;
}

.contact-details__list {
   display: flex;
   flex-wrap: wrap;
   gap: 50px 0;
}

.contact-details__list li {
   display: flex;
   align-items: center;
   width: 50%;
}

.contact-details__list li img {
   width: 25px;
   margin-right: 25px;
}

.contact-details__list li a {
   display: contents;
}

.contact-details__list li h4 {
    font-family: 'RF Dewi Expanded', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px; 
    display: contents;
    margin-bottom: 4px;
}

/* --------- Footer --------- */

.footer {
   padding: 30px 0 22px;
}

.footer-wrap {
   align-items: center;
   justify-content: space-between;
   display: flex;
}

.footer__left {
   max-width: 255px;
   width: 100%;
   font-size: 16px;
   font-weight: 400;
   line-height: 20px;
}

.footer-contact {
   max-width: 250px;
   width: 100%;
   display: flex;
}

.footer-contact__phone {
   text-align: right;
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 18px;
}

.footer-contact__email {
   text-align: right;
   font-size: 14px;
   opacity: 0.5;
   margin-top: 4px;
   display: block;
}

.footer-contact__link {
   margin-left: 16px;
}




/* ----------- Modal ----------- */

.modal-info {
   display: none;
   position: fixed;
   top: 0;
   left: 0;
   overflow: auto;
   width: 100%;
   height: 100%;
   background: #22232C;
   z-index: 30;
}

.modal-info.active {
   display: block;
}

.modal-info__block {
   height: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
}

.modal-info__card {
   max-width: 1140px;
   padding: 35px 64px;
   width: 100%;
   border-radius: 24px;
   position: relative;
   background: #EEEEEF;
}

.modal-info__card > p:not(:last-child) {
   margin-bottom: 15px;
}

.modal-about > h2 {
   color: #000;
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 24px;
   font-weight: 400;
   line-height: 119.5%;
   margin-top: 32px;
   margin-bottom: 36px;
}

.modal-about__list {
   max-width: 632px;
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   gap: 15px;
}

.modal-about__list li {
   width: 160px;
   border-radius: 16px;
   padding: 20px;
   background: #FFF;
   min-height: 240px;
}

.modal-about__list li > div {
   display: flex;
   flex-direction: column;
}

.modal-about__list li > div > svg {
   width: 51px;
   height: 60px;
}

.modal-about__list li > div h3 {
   color: #000;
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 16px;
   font-weight: 400;
   text-transform: uppercase;
   margin: 16px 0 0;
}

.modal-about__list li > p {
   color: #000;
   font-size: 14px;
   line-height: 20px;
   opacity: 0.75;
   margin-top: 12px;
}

.modal-about__list li:nth-child(4) {
   width: 230px;
   min-height: 148px;
}

.modal-about__list li:nth-child(4) > div, .modal-about__list li:nth-child(5) > div {
   flex-direction: inherit;
   gap: 0 12px;
   align-items: center;
}

.modal-about__list li:nth-child(5) {
   width: 307px;
   min-height: 148px;
}

.modal-about__wrap {
   display: flex;
}

.modal-about__block {
   border-radius: 16px;
   background: #B3B5CA;
   width: 353px;
   margin-left: auto;
   padding: 50px 24px;
}

.modal-about__block h2 {
   color: #FFF;
   font-family: 'RF Dewi Expanded', sans-serif;
   font-size: 24px;
   font-weight: 900;
   margin-bottom: 40px;
}

.modal-about__link a {
   width: 268px;
}

.modal-about__link a svg {
   margin-left: 10px;
}

.modal-about__link a:last-child {
   background: #fff;
   color: #000;
   margin-top: 23px;
}

.modal-info__exit {
   position: absolute;
   top: 20px;
   right: 10px;
   width: 40px;
   height: 40px;
   opacity: 0.6;
}