/* Sidebar Tabs */
    .nav-pills .nav-link {
      border-radius: 0;
      color: #000;
      font-weight: 500;
      font-size: 1rem;
      padding: 12px 15px;
      border-left: 4px solid transparent;
      transition: all 0.3s ease;
    }
    .nav-pills .nav-link.active {
      background-color: #ffe9e9;
      border-left: 4px solid #d32f2f;
      color: #000;
      font-weight: 600;
    }

    /* Gem Cards */
    .gem-card {
      border-radius: 15px;
      overflow: hidden;
      text-align: center;
      padding: 15px;
      transition: 0.3s;
      opacity: 0;
      transform: translateY(20px);
      animation: fadeUp 0.6s ease forwards;
    }
    .gem-card a{
      text-decoration: none;
      color: rgb(101 101 101);
    }
    @keyframes fadeUp {
      from { opacity: 0; transform: translateY(20px); }
      to { opacity: 1; transform: translateY(0); }
    }

    .gem-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);
    }

    .gem-img {
      width: 100%;
      aspect-ratio: 1 / 1;
      object-fit: contain;
      border-radius: 12px;
      background: linear-gradient(to bottom right, #f7f7f7, #ececec);
      padding: 15px;
    }

    .gem-title {
      margin-top: 10px;
      font-weight: 600;
      font-size: 0.95rem;
    }

    .gem-subtitle {
      font-size: 0.9rem;
      color: #666;
    }

    /* Responsive Layout */
    @media (max-width: 767px) {
      .nav-pills {
        flex-direction: row !important;
        justify-content: center;
      }

      .nav-pills .nav-link {
        border-left: none !important;
        border-bottom: 3px solid transparent;
      }

      .nav-pills .nav-link.active {
        border-bottom: 3px solid #d32f2f;
      }
    }

    /* Fade Animation */
    .tab-pane {
      opacity: 0;
      transition: opacity 0.5s ease-in-out;
    }
    .tab-pane.show.active {
      opacity: 1;
    }