:root{
  --navy: #1c2b39;
  --orange: #f5820e;
  --teal: #1f5d5b;
  --maroon: #4a2436;
  --wood: #d8b183;
  --cream: #f7ede4;
  --muted: #7a7a7a;
}

*{ font-family: 'Poppins', sans-serif; }

body{ color:#333; }

a{ text-decoration:none; }

/* ===== Topbar ===== */
.topbar{
  background: #2b2b2b;
  color:#ddd;
  font-size: .85rem;
  padding: 10px 0;
}
.topbar .social-icons a{
  color:#ddd;
  margin-right: 14px;
  font-size: .8rem;
}
.topbar span{ margin-left: 20px; color:#ddd; }
.topbar i{ color: var(--orange); margin-right:4px; }
.btn-call{
  background: var(--orange);
  color:#fff !important;
  padding: 8px 18px;
  border-radius: 3px;
  font-weight:600;
  font-size:.8rem;
  margin-left: 20px;
}

/* ===== Navbar ===== */
.main-nav{ padding: 14px 0; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.logo-mark{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;height:42px;
  border-radius:50%;
  background: linear-gradient(135deg,#2196d4,#c0392b);
  color:#fff;
  font-weight:800;
  font-size:1.3rem;
  margin-right:10px;
}
.logo-text{
  font-weight:800;
  font-size:1.3rem;
  color: #1f5d5b;
  vertical-align:middle;
  line-height:1.1;
}
.logo-text small{
  display:block;
  font-size:.6rem;
  font-weight:500;
  color: var(--orange);
  letter-spacing:1px;
}
.navbar-nav .nav-link{
  color:#333;
  font-size:.85rem;
  letter-spacing:.5px;
  position:relative;
  padding-bottom: 8px !important;
}
.navbar-nav .nav-link.active,
.navbar-nav .nav-link:hover{ color: var(--orange); }
.navbar-nav .nav-link.active::after{
  content:"";
  position:absolute;
  bottom:0; left:0;
  width:100%; height:2px;
  background: var(--orange);
}

/* ===== Reusable "photo" placeholder art =====
   Recreates the wood-panel / stall look with CSS gradients
   instead of using real photography. */
.stall-art{
  background:
    repeating-linear-gradient(
      90deg,
      var(--wood) 0px, var(--wood) 46px,
      var(--maroon) 46px, var(--maroon) 78px
    );
  position:relative;
  overflow:hidden;
}
.stall-art::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height:14%;
  background: linear-gradient(#c9c9c9,#efefef);
}
.stall-art::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:18%;
  background: linear-gradient(#e9e2d8,#cfc6b8);
}

/* ===== Hero ===== */
.hero-banner{
  height: 460px;
  overflow:hidden;
}
.hero-art{ width:100%; height:100%; }

/* ===== Section titles ===== */
.section-title{
  font-weight:800;
  color: var(--teal);
  position:relative;
  padding-bottom: 14px;
}
.section-title::after{
  content:"";
  position:absolute;
  left:0; bottom:0;
  width:46px; height:3px;
  background: var(--orange);
}

.feature-row h3{ color:#222; }

.btn-readmore{
  background:#efe7de;
  color:#6b5b4f;
  border-radius: 3px;
  font-size:.75rem;
  padding: 8px 20px;
  border:none;
}
.btn-readmore:hover{ background: var(--orange); color:#fff; }

/* ===== Product cards ===== */
.product-card{
  border: 1px solid #eee;
  border-radius: 8px;
}
.share-icons a{
  color:#333;
  margin-left:6px;
}

/* ===== Diamond feature (right sidebar) ===== */
.diamond-wrap{
  display:flex;
  justify-content:center;
  padding: 20px 0;
}
.diamond{
  width: 260px;
  height: 260px;
  transform: rotate(45deg);
  border: 4px solid var(--orange);
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,.15);
}
.diamond.stall-art{
  background-size: 200% 200%;
}

/* ===== Gallery circles ===== */
.gallery-circle{
  width: 110px;
  height: 110px;
  border-radius: 50%;
  border: 4px solid #fff;
  box-shadow: 0 2px 10px rgba(0,0,0,.08);
}


/* ===== Footer ===== */
.footer-dark{
  background: #3a3a3a;
  color: #ccc;
}
.footer-icon{
  width:60px; height:60px;
  border-radius:50%;
  background: #e8540c;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.4rem;
  margin: 0 auto;
}
.footer-heading{
  color: var(--orange);
  font-weight:700;
  margin-bottom: 18px;
}
.footer-links li{ margin-bottom:10px; }
.footer-links a{
  color:#ccc;
  font-size:.9rem;
}
.footer-links a:hover{ color: var(--orange); }
.footer-links li::before{
  content:"›  ";
  color: var(--orange);
}
.newsletter-input{
  border-radius: 20px 0 0 20px !important;
  border:none;
}
.btn-signup{
  background: var(--orange);
  color:#fff;
  border-radius: 0 20px 20px 0 !important;
  font-weight:600;
  padding: 0 20px;
}

.bottom-bar{
  background: var(--orange);
  color:#fff;
  font-size:.85rem;
}
.bottom-bar a{ color:#fff; text-decoration: underline; }

.back-to-top{
  position: fixed;
  right: 20px; bottom: 20px;
  width: 42px; height:42px;
  background: var(--orange);
  color:#fff;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow: 0 4px 12px rgba(0,0,0,.2);
}

/* ===== Responsive ===== */
@media (max-width: 991.98px){
  .hero-banner{ height: 300px; }
  .diamond{ width: 200px; height:200px; }
}