@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;700&display=swap");
:root {
  --primary: #DA3E08;
}

body {
  background-color: #181A1A;
  font-family: 'Open Sans', sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
  color: #D8D8D8;
}

header {
  position: relative;
  background-color: #181A1A;
  z-index: 10;
}

h1 {
  margin-bottom: 30px;
  font-size: 36px;
  line-height: 42px;
}

@media screen and (max-width: 768px) {
  h1 {
    font-size: 24px;
    line-height: 28px;
  }
}

h2 {
  font-weight: bold;
  font-size: 24px;
  line-height: 33px;
  color: #FFFFFF;
}

@media screen and (max-width: 768px) {
  h2 {
    font-size: 18px;
    line-height: 25px;
  }
}

a {
  color: #DA3E08;
}

a:hover {
  color: #FF8A61;
  text-decoration: none;
}

hr {
  border-bottom: 1px solid #293541;
  margin: 0;
}

.animate {
  opacity: 0;
}

.text-thin {
  font-weight: 300;
}

.hover-img {
  transition: all 500ms;
}

.hover-img:hover {
  transform: translateY(-10px);
}

.hello {
  display: inline-block;
  margin-bottom: 10px;
  font-weight: 300;
}

@media screen and (max-width: 768px) {
  .hello {
    margin-bottom: 20px;
  }
}

.header-logo {
  font-size: 14px;
  line-height: 19px;
}

.header-soc-link {
  text-decoration: none !important;
}

.header-soc-link:not(:last-child) {
  margin-right: 20px;
}

.main-wrap {
  margin-bottom: 40px;
}

@media screen and (max-width: 768px) {
  .main-wrap {
    margin-bottom: 30px;
  }
}

.keywords {
  margin-bottom: 7px;
}

.keyword {
  line-height: 27.5px;
}

.keyword:not(:last-child) {
  margin-right: 15px;
}

.conceps-wrap {
  margin-bottom: 60px;
}

@media screen and (max-width: 768px) {
  .conceps-wrap {
    margin-bottom: 30px;
  }
}

.fast-concepts-scroll {
  overflow-x: auto;
  padding: 0;
}

@media screen and (max-width: 768px) {
  .fast-concepts-scroll {
    padding-bottom: 15px;
  }
}

.fast-concepts {
  width: max-content;
  padding: 0 15px;
}

.fast-concepts__item {
  position: relative;
  display: inline-block;
  padding: 11px 80px 11px 10px;
  background: #181919;
  border: 1px solid #293541;
  box-sizing: border-box;
  box-shadow: 0px 13px 14px rgba(0, 0, 0, 0.25);
  color: #D8D8D8;
}

.fast-concepts__item:not(:last-child) {
  margin-right: 10px;
}

@media screen and (max-width: 768px) {
  .fast-concepts__item:not(:last-child) {
    margin-right: 5px;
  }
}

.fast-concepts__item img {
  position: absolute;
  right: 15px;
  top: 15px;
}

.portfolio-section img {
  max-width: 100%;
}

.company-wrap {
  margin-bottom: 50px;
}

@media screen and (max-width: 768px) {
  .company-wrap {
    margin-bottom: 30px;
  }
}

.company-title {
  position: relative;
  font-weight: bold;
  font-size: 24px;
  line-height: 33px;
  color: #FFF;
}

@media screen and (max-width: 768px) {
  .company-title {
    font-style: normal;
    font-weight: normal;
    font-size: 24px;
    line-height: 28px;
    color: #D8D8D8;
  }
}

.company-title_rocket:before {
  content: '';
  width: 26px;
  height: 26px;
  position: absolute;
  top: 3px;
  left: -40px;
  background-image: url("data:image/svg+xml,%3Csvg width='26' height='26' viewBox='0 0 26 26' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13 0C20.1797 0 26 5.82029 26 13C26.0048 16.4493 24.6367 19.7586 22.1976 22.1976C19.7586 24.6367 16.4493 26.0048 13 26C5.82029 26 0 20.1797 0 13C0 5.82029 5.82029 0 13 0ZM9.78592 21.1159C9.5884 21.3852 9.51658 21.6905 10.163 21.5648C11.9901 21.2122 13.6712 20.3248 14.9931 19.0151C15.6755 17.6512 16.2112 16.2186 16.5912 14.7416C19.6077 10.6118 21.0262 6.41012 20.1823 5.85349C19.3384 5.29686 15.4061 6.48194 11.2942 9.44465C9.81717 9.82459 8.38465 10.3603 7.02073 11.0427C5.7103 12.3405 4.81102 13.9954 4.43509 15.801C4.3094 16.4474 4.61465 16.3756 4.88399 16.1781L5.20719 15.9806C5.56195 15.6701 5.86603 15.3751 6.12429 15.1245C7.01635 14.259 7.36189 13.9237 7.36189 15.3162C7.22478 16.297 7.40072 17.2962 7.86465 18.1712C8.34945 18.6739 8.92404 18.6739 10.7196 18.6739C12.1152 18.6739 11.7753 19.021 10.9053 19.9092C10.656 20.1637 10.3632 20.4627 10.0553 20.8107L9.78592 21.1159Z' fill='%23DA3E08'/%3E%3Cpath d='M16.9994 11.0467C16.9912 11.5814 16.7675 12.0901 16.3789 12.4575C15.9903 12.825 15.4698 13.02 14.9355 12.9984C13.8338 12.9628 12.9685 12.0427 13.0009 10.941C13.0332 9.8394 13.9509 8.9716 15.0528 9.00071C16.1547 9.02982 17.0253 9.94486 16.9994 11.0467Z' fill='%23DA3E08'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
}

@media screen and (max-width: 768px) {
  .company-title_rocket:before {
    left: initial;
    right: 0;
  }
}

.company-title_tengri:before {
  content: '';
  width: 26px;
  height: 26px;
  position: absolute;
  top: 3px;
  left: -40px;
  background-image: url(../img/tengri.png);
  background-repeat: no-repeat;
  background-size: contain;
}

@media screen and (max-width: 768px) {
  .company-title_tengri:before {
    left: initial;
    right: 0;
  }
}

.company-title_grafica:before {
  content: '';
  width: 30px;
  height: 26px;
  position: absolute;
  top: 3px;
  left: -40px;
  background-image: url(../img/grafica.png);
  background-repeat: no-repeat;
  background-size: contain;
}

.company-title_aviata:before {
  content: '';
  width: 30px;
  height: 30px;
  position: absolute;
  top: 3px;
  left: -40px;
  background-image: url(../img/aviata.png);
  background-repeat: no-repeat;
  background-size: contain;
}

@media screen and (max-width: 768px) {
  .company-title_grafica:before {
    left: initial;
    right: 0;
  }
}

.company-years {
  display: inline-block;
  margin-bottom: 10px;
  font-size: 12px;
  line-height: 24px;
}

.company-position {
  font-weight: 300;
}

@media screen and (max-width: 768px) {
  .company-works-wrap {
    margin-left: -15px;
    margin-right: -15px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

.company-works {
  margin-top: 25px;
}

@media screen and (max-width: 768px) {
  .company-works {
    width: max-content;
    padding: 0 15px;
  }
}

.company-works li {
  display: flex;
  margin-bottom: 15px;
}

@media screen and (max-width: 768px) {
  .company-works li {
    display: inline-flex;
    margin-right: 50px;
    white-space: nowrap;
    line-height: 33px;
  }
}

.company-works li span {
  flex: 0 0 35px;
  font-weight: bold;
  font-size: 24px;
  line-height: 33px;
}

#rocket1 {
  position: absolute;
  top: 0;
  left: -25px;
}

@media screen and (max-width: 768px) {
  #rocket1 {
    display: none;
  }
}

footer {
  padding-bottom: 50px;
  font-size: 14px;
}