/* Start:/local/templates/html/assets/components-template/projects/style.css?1741252936501*/
.projects-layout {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 2.4rem; }
  .projects-layout > .project-card {
    height: 49.2rem; }
    .projects-layout > .project-card--full-w {
      grid-column: span 2; }
    @media (max-width: 767px) {
      .projects-layout > .project-card {
        height: 94rem; } }
  @media (max-width: 1023px) {
    .projects-layout {
      gap: 12px; } }
  @media (max-width: 767px) {
    .projects-layout {
      grid-template-columns: 1fr 1fr; } }

/* End */


/* Start:/local/templates/html/assets/components-template/mixin__project-card/style.css?17482570361853*/
.project-card {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 10px;
  transition: all 0.3s ease;
  overflow: hidden; }
  @media (max-width: 1023px) {
    .project-card {
      border-radius: 6px; } }
  @media (min-width: 1024px) {
    .project-card:hover {
      cursor: pointer; }
      .project-card:hover:after,
      .project-card:hover .project-card__title {
        opacity: 1; } }
  .project-card:after {
    position: absolute;
    content: "";
    top: 70%;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    background: linear-gradient(0deg, #020024 0%, black 2%, rgba(0, 212, 255, 0) 100%);
    transition: all 0.3s ease; }
  .project-card__title {
    position: absolute;
    left: 3rem;
    bottom: 3rem;
    color: #fff;
    opacity: 0;
    transition: all 0.3s ease;
    z-index: 10; }
  .project-card__watermark.lazy-img-wrap {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    opacity: 0.3;
    width: 15rem;
    filter: brightness(0%) invert(1); }
    .project-card__watermark.lazy-img-wrap img {
      max-width: 100%;
      max-height: 100%; }
    @media (max-width: 1023px) {
      .project-card__watermark.lazy-img-wrap {
        width: 100px;
        right: 15px;
        bottom: 15px; } }
  .project-card__icon {
    position: absolute;
    top: 2rem;
    right: 2rem;
    fill: #fff; }
    @media (max-width: 1023px) {
      .project-card__icon {
        top: 10px;
        right: 10px; } }
  .project-card__image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 10px;
    overflow: hidden; }
    .project-card__image img {
      width: 100%;
      height: 100%;
      object-fit: cover; }
  @media (min-width: 1024px) {
    .project-card:hover {
      cursor: pointer;
      box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.25); } }

/* End */


/* Start:/local/templates/html/assets/components-template/modal-project/style.css?17412529366115*/
@charset "UTF-8";
.modal-project {
  height: 100%; }
  .modal-project .modal-dialog {
    max-width: 1500px; }
  .modal-project .modal-content {
    max-height: 90vh;
    height: 100vh; }
    @media (max-width: 1023px) {
      .modal-project .modal-content {
        height: auto;
        max-height: none; } }
    @media (max-width: 1023px) {
      .modal-project .modal-content--v2 {
        margin: auto 0; } }
  .modal-project__inner {
    display: grid;
    grid-template-columns: 6fr 5fr;
    gap: 5rem;
    height: 100%; }
    .modal-project__inner--v2 {
      display: flex;
      flex-direction: column-reverse;
      gap: 2rem; }
      .modal-project__inner--v2 .modal-project__left {
        flex: 1; }
      .modal-project__inner--v2 .modal-project__overflow {
        display: none; }
      @media (max-width: 1023px) {
        .modal-project__inner--v2 {
          flex-direction: column-reverse; } }
    @media (max-width: 1023px) {
      .modal-project__inner {
        flex-direction: column;
        display: flex;
        gap: 30px; } }
  .modal-project__left {
    position: relative;
    display: flex; }
  .modal-project__right {
    display: flex;
    flex-direction: column; }
  .modal-project__overflow {
    flex-grow: 1;
    position: relative; }
    .modal-project__overflow:after {
      position: absolute;
      content: "";
      bottom: 0;
      left: 0;
      right: 2rem;
      height: 5rem;
      background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 100%);
      pointer-events: none; }
  .modal-project__scroll {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: auto;
    padding-right: 2rem;
    padding-bottom: 5rem; }
    .modal-project__scroll::-webkit-scrollbar {
      width: 5px;
      /* ширина для вертикального скролла */
      height: 5px;
      /* высота для горизонтального скролла */
      border-radius: 0px;
      background-color: #f5f5f5; }
    .modal-project__scroll::-webkit-scrollbar-thumb {
      background-color: #BDBDBD;
      border-radius: 10em; }
      .modal-project__scroll::-webkit-scrollbar-thumb:hover {
        background-color: #828282; }
    @media (max-width: 1023px) {
      .modal-project__scroll {
        position: static; } }
  .modal-project__image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center; }
  .modal-project__test {
    display: inline-block;
    max-width: 100%;
    max-height: 100%; }
  .modal-project__title {
    margin-bottom: 1.6rem; }
    @media (max-width: 1023px) {
      .modal-project__title {
        margin-bottom: 20px; } }
  .modal-project__photos {
    width: 100%;
    display: flex; }
    .modal-project__photos .splide {
      width: 100%;
      display: flex;
      flex-direction: column; }
    .modal-project__photos .splide__track {
      flex-grow: 1; }
    .modal-project__photos .splide__slide {
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative; }
      @media (max-width: 1023px) {
        .modal-project__photos .splide__slide {
          padding-bottom: 65%; } }
      .modal-project__photos .splide__slide img {
        max-width: 100%;
        max-height: 100%; }
  .modal-project__slider {
    position: relative; }
    .modal-project__slider:after {
      position: absolute;
      content: "";
      top: 0;
      bottom: 0;
      right: 0;
      background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #fff 100%);
      width: 24.6rem;
      pointer-events: none;
      opacity: 0;
      transition: all 0.3s ease; }
    .modal-project__slider:not(.reached-end):after {
      position: absolute;
      content: "";
      opacity: 1; }
    @media (min-width: 1200px) {
      .modal-project__slider .splide__track {
        padding: 1rem 0;
        margin: -1rem 0; } }
  .modal-project__products {
    margin-bottom: 4rem; }
    @media (max-width: 1023px) {
      .modal-project__products {
        margin-bottom: 30px; } }
  .modal-project__subtitle {
    color: #6F7682;
    margin-bottom: 1.3rem; }
    @media (max-width: 1023px) {
      .modal-project__subtitle {
        margin-bottom: 10px; } }

.modal-project-mini-card {
  border: 1px solid #F2F2F2;
  padding: 0.9rem;
  border-radius: 6px;
  height: 100%;
  display: flex;
  flex-direction: column;
  -webkit-transition: all ease .3s;
  -moz-transition: all ease .3s;
  -ms-transition: all ease .3s;
  -o-transition: all ease .3s;
  transition: all ease .3s; }
  @media (min-width: 1200px) {
    .modal-project-mini-card {
      cursor: pointer; }
      .modal-project-mini-card:hover {
        border-color: #9d9797; } }
  @media (max-width: 1023px) {
    .modal-project-mini-card {
      padding: 8px; } }
  .modal-project-mini-card__image-wrap {
    padding-bottom: 65%;
    position: relative;
    margin-bottom: 1.3rem; }
    @media (max-width: 1023px) {
      .modal-project-mini-card__image-wrap {
        margin-bottom: 12px; } }
  .modal-project-mini-card__title {
    margin-bottom: 1.5rem;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden; }
    @media (max-width: 1023px) {
      .modal-project-mini-card__title {
        margin-bottom: 10px; } }
  .modal-project-mini-card__image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center; }
    .modal-project-mini-card__image img {
      max-width: 100%;
      max-height: 100%; }
  .modal-project-mini-card__footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto; }
    @media (max-width: 1023px) {
      .modal-project-mini-card__footer .icon {
        width: 18px;
        height: 18px; } }
  .modal-project-mini-card__prices {
    display: flex;
    flex-direction: column; }
  .modal-project-mini-card__price-old {
    color: #6F7682;
    text-decoration: line-through; }

/* End */
/* /local/templates/html/assets/components-template/projects/style.css?1741252936501 */
/* /local/templates/html/assets/components-template/mixin__project-card/style.css?17482570361853 */
/* /local/templates/html/assets/components-template/modal-project/style.css?17412529366115 */