

/* Start:/bitrix/templates/fineartbox/components/bitrix/news/catalog/bitrix/news.list/.default/style.css?17701896073329*/
.fab-filters {
        position: sticky;
        top: var(--header-height);
        display: grid;
        gap: 1rem;
        background-color: var(--color-white);
        z-index: 10;
      }
      @media (min-width: 768px) {
        .fab-filters {
          position: static;
          grid-template-columns: repeat(2, 1fr);
          gap: 1.5rem;
        }
      }
      @media (min-width: 992px) {
        .fab-filters {
          grid-template-columns: repeat(3, 1fr);
          gap: 2rem;
        }
      }
      .fab-portfolio-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: var(--global-gap);
      }
      @media (min-width: 992px) {
        .fab-portfolio-grid {
          grid-template-columns: repeat(3, 1fr);
        }
      }
      @media (min-width: 1200px) {
        .fab-portfolio-grid {
          grid-template-columns: repeat(12, 1fr);
        }
        .fab-portfolio-grid > :is(a, div) {
          grid-area: auto/span var(--desktop-columns);
        }
      }
      .fab-portfolio-grid > :is(a, div) {
        border: 1px solid var(--color-gray-1);
        overflow: hidden;
      }
      .fab-portfolio-grid a {
        display: block;
      }
      .fab-portfolio-grid div {
        display: flex;
        clip-path: polygon(
          100% 0,
          100% calc(100% - 30px),
          calc(100% - 30px) 100%,
          0 100%,
          0 0
        );
      }
  .fab-portfolio-grid img {
  object-fit: cover;
  }
      .fab-portfolio-grid img:hover {
        transform: scale(1.15);
      }
      .portfolio-box-text {
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: clamp(0.5rem, -0.3803rem + 3.7559vw, 3rem);
        background-color: var(--color-orange);
        color: var(--color-white);
        row-gap: 0.75rem;
      }
      .portfolio-box-text h3 {
        font-size: 1.5rem;
      }



      .product-input {
    position: relative;
    display: flex;
    align-items: center;
    gap: 1rem;
    background-color: var(--color-gray-1);
    border-bottom: 1px solid var(--color-gray-2);
    padding: 0.7em!important;
}
.product-input button {
    appearance: none;
    border: none;
    outline: none;
    cursor: pointer;
}
.product-input-value {
    flex: 1;
    appearance: none;
    background: transparent;
    border: none;
    outline: none;
}
.product-input-dropdown {
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    border-top: 1px solid var(--color-gray-2);
    max-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    transition: ease 0.3s;
    z-index: 1;
}
.product-input-dropdown.open {
    max-height: var(--max-height-dropdown);
}
.product-input-dropdown-value {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 1rem;
    background-color: var(--color-gray-1);
    padding: 0.7em!important;
    transition: ease 0.3s;
}
.product-input-dropdown-value:hover {
    background-color: var(--color-gray-5);
    color: #fff;
}
.product-input-button-open-dropdown {
    margin-left: auto!important;
}
.product-input-button-preview svg {
    transform: rotate(90deg);
}
.product-input-button-next svg {
    transform: rotate(-90deg);
}
:is(.product-input-button-preview, .product-input-button-next)[disabled] {
    opacity: 0.5;
}
/* End */
/* /bitrix/templates/fineartbox/components/bitrix/news/catalog/bitrix/news.list/.default/style.css?17701896073329 */
