:root{
		  --brand: #2e8b57; /* green */
		  --accent: #ff6b6b; /* red accent */
		  --muted-bg: #f7f6f3;
		  --card-radius: 12px;
	}

	html, body { 
	font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; 
	background: var(--muted-bg); 
	scroll-behavior: smooth;
	font-size:95%;
	color:#757575;
	}
	
	h1, h2, h3, h4, h5, h6 {font-weight:600; color:#303030; }

	.navbar-brand img{ height:40px; }
	a {text-decoration:none;}
	/* HERO */
	.hero {
      background-image: url('https://images.unsplash.com/photo-1544025162-d76694265947?q=80&w=1600&auto=format&fit=crop&ixlib=rb-4.0.3&s='); /* replace with your hero */
      background-size: cover;
      background-position: center;
      color: white;
      position: relative;
      border-radius: 0 0 20px 20px;
      border-radius: 20px;
      overflow: hidden;
    }
	.hero::after {
      content: "";
      position: absolute; inset: 0;
      background: linear-gradient(180deg, rgba(0,0,0,0.45) 10%, rgba(0,0,0,0.55) 90%);
    }
    .hero .container { position: relative; z-index: 2; padding: 6rem 0; }
    .hero h1 { font-weight: 800; letter-spacing: -1px; font-size: clamp(2rem, 3.6vw, 3.6rem); }
    .search-box { margin-top: 1.4rem; }
    .search-input { border-radius: 50px; box-shadow: 0 6px 18px rgba(0,0,0,0.18); }

    /* categories */
    .category-card { border-radius: 12px; overflow: hidden; position: relative; min-height:110px; }
    .category-card .overlay { position:absolute; inset:0; background: linear-gradient(0deg, rgba(0,0,0,0.18), rgba(0,0,0,0.0)); display:flex; align-items:flex-end; padding:12px; color:white; }
    .category-card img{ object-fit:cover; width:100%; height:100%; transform:scale(1.05); transition: transform .3s ease; }
    .category-card:hover img{ transform:scale(1.12); }



	/* cards */
	/*
	.biz-card {
	  position: relative;
	  overflow: hidden;
	  border-radius: 8px;
	  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
	  background: #fff;
	}

	.biz-card img {
	  height: 180px;     
	  width: 100%;
	  object-fit: cover; 
	}

	.biz-card img.card-img-top {
	  width: 100%;
	  height: 160px;
	  object-fit: cover;
	}
	*/




    /* CTA banner */
    .cta-banner {
      background-image: linear-gradient(90deg, rgba(46,139,87,0.95), rgba(255,107,107,0.95));
	  background:rgba(46,139,87,0.95);
      color: #fff; border-radius: 14px; padding:30px 20px;
    }

    /* footer */
    footer { font-size: .95rem; background:#0e0f10; color:#d6d6d6; padding:40px 0; }
    footer a { color: #fff; text-decoration: none; }
    .pill { border-radius: 999px; padding:6px 12px; background: rgba(255,255,255,0.06); display:inline-block; }

	section {padding:2.5% 0;}


	/* category-card */
	.category-card {
	  position: relative;
	  border-radius: 12px;
	  overflow: hidden;
	}
	.category-card img {
	  width: 100%;
	  height: 140px;
	  object-fit: cover;
	  display: block;
	  border-radius: 12px;
	}
	.category-card .overlay {
	  position: absolute;
	  bottom: 0;
	  left: 0;
	  right: 0;
	  background: rgba(0,0,0,0.5);
	  color: #fff;
	  padding: 6px 8px;
	  font-size: 0.85rem;
	}
	.category-card .overlay .fw-bold {
	  font-size: 0.95rem;
	}


	/* card slider */
	.transition {
	transition: transform 0.5s ease;
	}
	.biz-card {
    flex: 0 0 250px; /* fixed card width */
    border: 1px solid #eee;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
	}
	.biz-card img {
    height: 160px;
    object-fit: cover;
    width: 100%;
	}

	/* browse by category */

	.fixed-cover {
	  height: 200px;
	  object-fit: cover;
	}
	.pill {
	  padding: 5px 12px;
	  border: 1px solid #ddd;
	  border-radius: 20px;
	  cursor: pointer;
	  font-size: 14px;
	  text-decoration: none;
	  color: #333;
	}
	.pill.active, .pill:hover {
	  background: #dc3545;
	  color: #fff;
	  border-color: #dc3545;
	}

	.h5 {font-weight:600;}



    /* small tweaks */
    @media (max-width: 767px){
		html, body {font-size:90%;} 	
		.hero {border-radius: 0px;}
		.hero .container{ padding:2.5rem 0; }
		.search-box .input-group .form-select{ display:none; }
    }