/* Masonry на CSS: колонки + запрет разрыва */
  .masonry {
    column-count: 1;
    column-gap: 1rem;
  }
  @media (min-width: 576px) { .masonry { column-count: 2; } }
  @media (min-width: 992px) { .masonry { column-count: 3; } }

  .masonry-item {
    break-inside: avoid;
    margin-bottom: 1rem;
  }

  /* Карточка работы */
  .work-card {
    position: relative;
    display: block;
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 10px 28px rgba(3,7,18,.08);
    transition: transform .25s ease, box-shadow .25s ease;
  }
  .work-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 36px rgba(3,7,18,.12);
  }

  .work-thumb {
    width: 100%;
    height: 320px;
    object-fit: cover;
    display: block;
  }

  /* оверлей */
  .work-card::after{
    content:"";
    position:absolute; inset:0;
    background: linear-gradient(180deg,rgba(0,0,0,.00) 30%, rgba(0,0,0,.45) 100%);
    opacity:.0; transition: opacity .25s ease;
  }
  .work-card:hover::after{ opacity:1; }

  .work-meta{
    position:absolute; left:12px; right:12px; bottom:12px;
    display:flex; align-items:center; justify-content:space-between; gap:.5rem;
    color:#fff; z-index:2;
  }
  .work-title{ font-weight:700; text-shadow:0 2px 10px rgba(0,0,0,.5); }
  .badge.bg-success{
    background-color:#16a34a !important;
  }

  /* Pills */
  #worksFilters .nav-link{
    border:1px solid rgba(22,163,74,.28);
    color:#16a34a;
    background:#f0fdf4;
  }
  #worksFilters .nav-link.active{
    color:#fff; background:#16a34a; border-color:#16a34a;
  }