  /* ========== Horizontal scroll container ========== */
  .portfolio-rail {
    display: flex;
    gap: 1.5rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 1rem;              /* breathing room under cards */
  }
  .portfolio-rail::-webkit-scrollbar {
    height: 8px;
  }
  .portfolio-rail::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.15);
    border-radius: 4px;
  }

  /* ========== Card appearance ========== */
  .portfolio-card {
    flex: 0 0 clamp(260px, 45vw, 310px); /* responsive width */
    scroll-snap-align: start;
    border: none;
    border-radius: 1rem;
    backdrop-filter: blur(6px);
    background: rgba(242, 244, 248, 1); /* light glass */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }
  @media (prefers-color-scheme: dark) {
    .portfolio-card {
      background: rgba(30, 32, 35, 0.55); /* dark glass */
    }
  }
  .portfolio-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 20px rgba(0, 0, 0, 0.15);
  }

  .portfolio-card img {
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
    height: 140px;
    object-fit: cover;
  }

  .portfolio-card .btn {
    width: 100%;
  }

  /* ---------- Hide scrollbar (all major browsers) ---------- */
.portfolio-rail {
    scrollbar-width: none;          /* Firefox */
  }
  .portfolio-rail::-webkit-scrollbar {
    display: none;                  /* Chrome, Safari, Edge */
  }