:root {
      --font: "Geist", "Geist Placeholder", sans-serif;
      --bg: #ffffff;
      --text: #111111;
      --muted: #666666;
      --accent3: #000000;
      --tag: #f0f0f0;
    }



    .showcase {
      max-width: 1200px;
      margin: 0 auto;
      background-color: #f1f1f1;
      padding: 20px;
      border-radius: 20px;
    }

    .showcase h2 {
      font-size: 2rem;
      margin-bottom: 30px;
      text-align: center;
    }

    .grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
      gap: 30px;
    }

    .template-card {
      border: 1px dotted #555555;
      border-radius: 10px;
      overflow: hidden;
      transition: box-shadow 0.3s ease;
      cursor: pointer;
    }

    .template-card:hover {
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
      background-color: #fff;
    }

    .template-image {
      overflow: hidden;
    }

    .template-image img {
      width: 100%;
      height: auto;
      display: block;
      transition: transform 0.4s ease;
    }

    .template-card:hover .template-image img {
      transform: scale(1.05);
    }

    .template-content {
      padding: 20px;
    }

    .template-title {
      font-size: 1.2rem;
      font-weight: 600;
      margin-bottom: 8px;
    }

    .template-price {
      font-weight: 500;
      color: var(--muted);
      margin-bottom: 12px;
    }

    .tags {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-bottom: 12px;
    }

    .tag {
      background: var(--tag);
      padding: 4px 10px;
      border-radius: 6px;
      font-size: 0.85rem;
      font-weight: 500;
      color: var(--muted);
    }

    .tools {
      font-size: 0.85rem;
      color: var(--muted);
    }

    .btn-showroom {
  display: inline-block;
  background-color: #2ecc71; /* Elegant green */
  color: #ffffff;
  padding: 12px 24px;
  border-radius: 6px;
  font-weight: 600;
  text-decoration: none;
  font-size: 1rem;
  transition: background-color 0.3s ease;
}

.btn-showroom:hover {
  background-color: #27ae60; /* Darker green on hover */
}