.portfolio img {
      max-width: 100%;
      width: 100%;
      background: #fff;
      padding: 0px;
      /* border: 1px solid #e0e0e0; */
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
      transition: transform 0.25s ease, box-shadow 0.25s ease;
  }

  img:hover {
    cursor: pointer;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.6);
    transition: box-shadow 0.3s ease;
    cursor: pointer;
  }

  body { font-family: Arial, Helvetica, sans-serif; margin:0; background:#fff; color:#222; }
  /* header logo */
  .site-header { text-align:center; padding:18px 10px; border-bottom:1px solid #eee; }
  .site-header img { max-height:64px; }

  /* main categories (top row) */
  .main-categories { display:flex; justify-content:center; gap:28px; padding:45px 10px; border-bottom:1px solid #ddd; align-items:center; flex-wrap:wrap; }
  .main-categories button {
    background:none; border:none; cursor:pointer; color:#888; font-size:15px; text-transform:uppercase; padding:6px 8px;
  }
  .main-categories button.active { color:#b33; font-weight:700; }

  .main-categories button + button::before { content:""; } /* spacing handled by gap */

  /* subcategories (second row) */
  .sub-categories { text-align:center; padding:12px 6px; border-bottom:1px solid #f0f0f0; }
  .sub-categories button {
    background:none; border:none; cursor:pointer; color:#444; font-size:13px; margin:0 10px; padding:6px 8px;
  }
  .sub-categories button.active { font-weight:700; color:#000; text-decoration:underline; }

  /* portfolio grid */
  .portfolio {
    max-width:1200px; 
    margin:24px auto; 
    padding:0 16px; 
    display:grid;
    grid-template-columns: repeat(auto-fill,minmax(250px,1fr)); 
    gap:10px;
  }
  .portfolio img.show { opacity:1; transform:scale(1); }
  .portfolio img.hide { display:none; }

  /* lightbox */
  .lightbox{ position:fixed; inset:0; display:none; background:rgba(0,0,0,.85); z-index:9999; align-items:center; justify-content:center; flex-direction:column; }
  .lightbox img { max-width:90%; max-height:72%; border-radius:8px; box-shadow:0 8px 30px rgba(0,0,0,.6); }
  .lightbox .caption { color:#fff; margin-top:12px; text-align:center; max-width:92%; }
  .lightbox .close{ position:absolute; right:28px; top:20px; font-size:34px; color:#fff; cursor:pointer; }
  .lightbox .arrow{ position:absolute; top:50%; transform:translateY(-50%); font-size:44px; color:#fff; cursor:pointer; user-select:none; padding:10px; }
  .lightbox .arrow.left{ left:16px; } .lightbox .arrow.right{ right:16px; }

  .no-results {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    color: #c62828; /* deep red */
    text-align: center;
    animation: fadeIn 0.4s ease-in-out;
  }

  .no-results-icon {
    font-size: 48px;
    margin-bottom: 10px;
  }

  .no-results-text {
    font-size: 22px;
    font-weight: bold;
  }

  .no-results-subtext {
    font-size: 14px;
    color: #888;
  }

  @keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
  }

  @media (max-width:520px){ .main-categories{gap:12px;} .sub-categories button{margin:0 6px;} }

.activeClass {
    color: red !important;
}
.main-categories-link{
  color: #000;
  text-decoration: none;
}