.design-hero {
  height: 54rem;
  padding-left: 8.6rem;
  display: grid;
  grid-template-columns: 55% 45%;
  justify-content: space-between;
  border-radius: 3rem;
  background: linear-gradient(270deg, #E5E5E5 0%, #F8F8F8 100%);
  overflow: hidden; }
  @media (max-width: 1023px) {
    .design-hero {
      padding-left: 30px;
      gap: 30px; } }
  @media (max-width: 767px) {
    .design-hero {
      padding: 0;
      height: auto;
      grid-template-columns: 100%; } }
  .design-hero__left {
    align-self: center;
    display: flex;
    flex-direction: column; }
    @media (max-width: 767px) {
      .design-hero__left {
        padding: 30px 14px 0; } }
  .design-hero__title {
    margin-bottom: 4rem; }
    @media (max-width: 1023px) {
      .design-hero__title {
        margin-bottom: 26px; } }
  .design-hero__links {
    display: flex;
    gap: 16px;
    flex-direction: column;
    margin-bottom: 30px; }
    @media (min-width: 1024px) {
      .design-hero__links {
        flex-direction: row;
        margin-bottom: 5rem;
        gap: 4rem; } }
  .design-hero__link {
    position: relative;
    padding-left: 3.2rem; }
    @media (max-width: 1023px) {
      .design-hero__link {
        padding-left: 32px; } }
    .design-hero__link:before {
      position: absolute;
      content: '';
      left: 0;
      top: .2rem;
      height: 2.4rem;
      width: 2.4rem;
      border-radius: .5rem;
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' rx='5' fill='url(%23paint0_linear_4692_65291)'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.29646 11.539C5.68894 11.1321 6.32209 11.1354 6.71065 11.5464L9.9226 14.944L17.2542 6.34955C17.6222 5.91824 18.2543 5.88094 18.6662 6.26625C19.0781 6.65155 19.1137 7.31355 18.7458 7.74486L9.9974 18L5.28935 13.0199C4.90079 12.6089 4.90397 11.9459 5.29646 11.539Z' fill='white'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_4692_65291' x1='5.74759e-08' y1='13.9286' x2='24' y2='13.9286' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23156864'/%3E%3Cstop offset='1' stop-color='%232EADA7'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A"); }
      @media (max-width: 1023px) {
        .design-hero__link:before {
          top: 1px;
          width: 24px;
          height: 24px;
          border-radius: 5px; } }
  .design-hero__btns {
    display: flex;
    gap: 2rem; }
    @media (max-width: 767px) {
      .design-hero__btns {
        flex-direction: column;
        gap: 12px; } }
    @media (max-width: 575px) {
      .design-hero__btns .btn {
        width: 100%; } }
  .design-hero__right {
    margin-left: -10rem; }
    @media (max-width: 767px) {
      .design-hero__right {
        margin-left: 0; } }
  .design-hero__img {
    height: 100%; }
    @media (max-width: 767px) {
      .design-hero__img {
        max-width: 360px;
        margin: 0 auto; } }
    .design-hero__img .lazy-img-wrap {
      width: 100%;
      height: 100%; }
      .design-hero__img .lazy-img-wrap img {
        width: 100%;
        height: 100%; }
  .design-hero--fully {
    grid-template-columns: 63rem auto; }
    @media (max-width: 1659px) {
      .design-hero--fully {
        height: 48rem; } }
    @media (max-width: 1023px) {
      .design-hero--fully {
        grid-template-columns: 100%;
        height: auto;
        background: #F8F8F8;
        padding-left: 0; } }
    @media (max-width: 1023px) {
      .design-hero--fully .design-hero__left {
        padding-left: 20px;
        padding-right: 20px; } }
    .design-hero--fully .design-hero__right {
      margin-left: 0; }
      @media (max-width: 1023px) {
        .design-hero--fully .design-hero__right {
          height: calc(min(65vw, 320px));
          position: relative; }
          .design-hero--fully .design-hero__right:before {
            content: ' ';
            position: absolute;
            z-index: 2;
            left: 0;
            right: 0;
            height: 100px;
            background: linear-gradient(to top, transparent, #FAFBFB); } }
    .design-hero--fully .design-hero__img {
      max-width: none; }
      .design-hero--fully .design-hero__img img {
        object-fit: cover; }
    @media (max-width: 1023px) {
      .design-hero--fully .design-hero__title {
        margin-bottom: 14px; } }
    .design-hero--fully .design-hero__title span {
      flex-wrap: wrap;
      color: #E74829; }
    .design-hero--fully .design-hero__descr {
      margin-bottom: 2rem; }
    .design-hero--fully .design-hero__links {
      display: grid;
      grid-template-columns: auto auto;
      gap: 1.8rem 3.4rem;
      max-width: 48rem; }
      @media (max-width: 1023px) {
        .design-hero--fully .design-hero__links {
          max-width: none; } }
      @media (max-width: 575px) {
        .design-hero--fully .design-hero__links {
          grid-template-columns: 100%;
          gap: 12px;
          margin-bottom: 20px; } }
    .design-hero--fully .design-hero__link:before {
      top: 0; }

.design-descr {
  max-width: 130rem;
  margin: 9rem auto;
  column-count: 2;
  column-gap: 5.6rem; }
  @media (max-width: 1023px) {
    .design-descr {
      margin: 56px auto;
      max-width: none; }
      .design-descr br {
        display: none; } }
  @media (max-width: 767px) {
    .design-descr {
      column-count: 1; }
      .design-descr.expand p {
        display: block !important; } }
  @media (min-width: 768px) {
    .design-descr__btn {
      display: none; } }

.design-cards {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 2.4rem;
  margin-top: 7.2rem; }
  @media (max-width: 1023px) {
    .design-cards {
      margin-top: 50px; } }
  @media (max-width: 767px) {
    .design-cards {
      gap: 44px;
      grid-template-columns: 100%; } }

.design-card {
  border-radius: .6rem;
  background: #FFF;
  box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.13);
  position: relative; }
  @media (max-width: 1023px) {
    .design-card {
      border-radius: 6px; } }
  .design-card__step {
    z-index: 2;
    position: absolute;
    width: 6.4rem;
    height: 6.4rem;
    left: 0;
    right: 0;
    margin: 0 auto;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff; }
    @media (max-width: 1023px) {
      .design-card__step {
        width: 48px;
        height: 48px; } }
    .design-card__step span {
      position: relative;
      z-index: 2; }
    .design-card__step .lazy-img-wrap {
      z-index: 1;
      position: absolute;
      inset: 0; }
      .design-card__step .lazy-img-wrap img {
        width: 100%;
        height: 100%;
        object-fit: contain; }
  .design-card__inner {
    padding: 2rem 2rem 2.4rem 2rem; }
    @media (max-width: 1023px) {
      .design-card__inner {
        padding: 14px; } }
  .design-card__img {
    padding-bottom: 73%;
    position: relative;
    margin-bottom: 2.4rem; }
    @media (max-width: 1023px) {
      .design-card__img {
        margin-bottom: 14px; } }
    .design-card__img .lazy-img-wrap {
      position: absolute;
      inset: 0; }
      .design-card__img .lazy-img-wrap img {
        width: 100%;
        height: 100%;
        object-fit: cover; }
  .design-card__text {
    margin-top: .6rem;
    color: #6F7682; }
    @media (max-width: 1023px) {
      .design-card__text {
        margin-top: 6px; } }

.design-comment,
.design-steps {
  background-color: #F8F8F8; }

.design-project {
  background: linear-gradient(180deg, #F8F8F8 0%, rgba(248, 248, 248, 0) 100%);
  padding-bottom: 5rem; }
  @media (max-width: 1023px) {
    .design-project {
      padding-bottom: 0; } }
  .design-project__slider {
    padding-bottom: 4rem; }
    @media (max-width: 1023px) {
      .design-project__slider {
        padding-bottom: 40px; } }
  .design-project .splide__arrows {
    top: 35%; }
    @media (max-width: 1023px) {
      .design-project .splide__arrows {
        top: 38%; } }