Luminous Color House — Homepage Template
:root{
--green-deep:#2E7D32;
--green-dark:#1B5E20;
--brown-warm:#8D6E63;
--gold:#D4A017;
--bg-off:#FAF9F6;
--text-charcoal:#2B2B2B;
--white:#FFFFFF;
--radius:10px;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{
font-family:'Inter',sans-serif;
color:var(--text-charcoal);
background:var(--bg-off);
line-height:1.5;
}
h1,h2,h3{font-family:'Playfair Display',serif;font-weight:700;}
.price,.btn{font-family:'Poppins',sans-serif;}
a{text-decoration:none;color:inherit;}
img,.ph-img{display:block;width:100%;}
.ph-img{
background:linear-gradient(135deg,#e8e2d5,#d9cfae);
display:flex;align-items:center;justify-content:center;
color:#8a8060;font-size:.8rem;font-family:'Inter',sans-serif;
}
.container{max-width:1200px;margin:0 auto;padding:0 24px;}
.btn{
display:inline-block;padding:12px 28px;border-radius:var(--radius);
background:var(--green-deep);color:#fff;font-weight:600;font-size:.95rem;
border:none;cursor:pointer;transition:background .2s ease;
}
.btn:hover{background:var(--gold);color:var(--text-charcoal);}
.btn.outline{background:transparent;border:2px solid var(--white);color:var(--white);}
.btn.outline:hover{background:var(--white);color:var(--green-deep);}
/* Color-window divider — brand signature element */
.color-window{
display:flex;height:8px;width:100%;
}
.color-window span{flex:1;}
.color-window span:nth-child(1){background:var(--green-deep);}
.color-window span:nth-child(2){background:var(--gold);}
.color-window span:nth-child(3){background:var(--brown-warm);}
.color-window span:nth-child(4){background:#A63A2E;}
.color-window span:nth-child(5){background:#4E6E58;}
/* Announcement bar */
.announce{
background:var(--green-dark);color:#fff;font-size:.8rem;
padding:8px 0;
}
.announce .container{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;}
/* Header */
header.main-header{background:var(--white);border-bottom:1px solid #eee;}
.header-row{display:flex;align-items:center;justify-content:space-between;padding:18px 0;gap:20px;}
.logo{font-family:'Playfair Display',serif;font-size:1.5rem;font-weight:700;color:var(--green-deep);white-space:nowrap;}
.logo small{display:block;font-family:'Inter',sans-serif;font-size:.6rem;font-weight:400;color:var(--brown-warm);letter-spacing:.03em;}
.search-bar{flex:1;max-width:480px;display:flex;}
.search-bar input{
flex:1;border:1px solid #ddd;border-right:none;padding:10px 14px;border-radius:var(--radius) 0 0 var(--radius);font-family:'Inter',sans-serif;
}
.search-bar button{
background:var(--green-deep);color:#fff;border:none;padding:0 18px;border-radius:0 var(--radius) var(--radius) 0;cursor:pointer;
}
.header-icons{display:flex;gap:18px;font-size:1.2rem;align-items:center;}
.header-icons a{position:relative;}
.badge{
position:absolute;top:-8px;right:-10px;background:var(--gold);color:#fff;
font-size:.6rem;font-family:'Inter',sans-serif;border-radius:50%;
width:16px;height:16px;display:flex;align-items:center;justify-content:center;
}
/* Nav */
nav.main-nav{background:var(--bg-off);border-bottom:1px solid #eee;}
.nav-list{display:flex;gap:28px;list-style:none;padding:12px 0;font-weight:500;font-size:.9rem;flex-wrap:wrap;}
.nav-list a:hover{color:var(--green-deep);}
/* Hero */
.hero{position:relative;background:linear-gradient(120deg,#e9e2cf,#cfd9c8);padding:90px 0;text-align:center;overflow:hidden;}
.hero .container{position:relative;z-index:2;}
.hero h1{font-size:2.6rem;color:var(--green-dark);margin-bottom:14px;}
.hero p{font-size:1.1rem;color:var(--brown-warm);margin-bottom:28px;}
.hero .btn-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}
/* Section generic */
section{padding:56px 0;}
.section-title{text-align:center;margin-bottom:36px;}
.section-title h2{font-size:1.9rem;color:var(--green-dark);}
.section-title p{color:var(--brown-warm);font-size:.95rem;margin-top:6px;}
/* Shop by category */
.cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.cat-card{
background:var(--white);border-radius:var(--radius);padding:24px 10px;text-align:center;
box-shadow:0 2px 8px rgba(0,0,0,.05);transition:transform .2s ease;
}
.cat-card:hover{transform:translateY(-4px);}
.cat-card .emoji{font-size:2rem;margin-bottom:8px;}
.cat-card span{font-weight:500;font-size:.9rem;}
/* Product grid */
.prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.prod-card{
background:var(--white);border-radius:var(--radius);overflow:hidden;
box-shadow:0 2px 8px rgba(0,0,0,.05);position:relative;
}
.prod-card .ph-img{height:160px;}
.prod-card .wish{
position:absolute;top:10px;right:10px;background:#fff;border-radius:50%;
width:32px;height:32px;display:flex;align-items:center;justify-content:center;
box-shadow:0 1px 4px rgba(0,0,0,.15);
}
.prod-info{padding:14px;}
.stars{color:var(--gold);font-size:.85rem;margin-bottom:4px;}
.prod-name{font-weight:600;font-size:.95rem;margin-bottom:2px;}
.prod-meta{font-size:.75rem;color:var(--brown-warm);margin-bottom:8px;}
.prod-price{font-weight:600;color:var(--green-deep);font-size:1rem;}
.prod-add{
margin-top:10px;width:100%;padding:8px;border-radius:var(--radius);
background:var(--green-deep);color:#fff;border:none;font-weight:500;font-size:.85rem;cursor:pointer;
}
.prod-add:hover{background:var(--gold);color:var(--text-charcoal);}
/* Why choose us */
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center;}
.why-item .emoji{font-size:2.2rem;margin-bottom:10px;}
.why-item h3{font-size:1.05rem;margin-bottom:6px;color:var(--green-dark);}
.why-item p{font-size:.85rem;color:var(--brown-warm);}
/* Lifestyle banner */
.lifestyle-banner{
background:var(--green-deep);color:#fff;text-align:center;padding:70px 0;
}
.lifestyle-banner h2{color:#fff;font-size:2rem;margin-bottom:12px;}
.lifestyle-banner p{margin-bottom:24px;opacity:.9;}
/* Reviews */
.review-slider{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.review-card{background:var(--white);border-radius:var(--radius);padding:20px;box-shadow:0 2px 8px rgba(0,0,0,.05);}
.review-card .stars{margin-bottom:8px;}
.review-card p{font-size:.9rem;margin-bottom:10px;}
.review-name{font-weight:600;font-size:.85rem;}
/* Newsletter */
.newsletter{background:var(--brown-warm);color:#fff;text-align:center;padding:56px 0;}
.newsletter h2{color:#fff;font-size:1.8rem;margin-bottom:8px;}
.newsletter form{display:flex;justify-content:center;gap:10px;margin-top:20px;flex-wrap:wrap;}
.newsletter input{padding:12px 16px;border-radius:var(--radius);border:none;min-width:260px;}
/* Footer */
footer{background:var(--green-dark);color:#e9e9e0;padding:50px 0 20px;}
.footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-bottom:30px;}
.footer-grid h4{color:#fff;font-family:'Poppins',sans-serif;font-size:1rem;margin-bottom:14px;}
.footer-grid ul{list-style:none;}
.footer-grid li{margin-bottom:8px;font-size:.85rem;opacity:.85;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.15);padding-top:18px;text-align:center;font-size:.8rem;opacity:.7;}
/* Mobile bottom nav */
.mobile-nav{
display:none;position:fixed;bottom:0;left:0;right:0;background:#fff;
border-top:1px solid #eee;padding:8px 0;z-index:50;
box-shadow:0 -2px 8px rgba(0,0,0,.06);
}
.mobile-nav .container{display:flex;justify-content:space-between;}
.mobile-nav a{text-align:center;font-size:.65rem;color:var(--brown-warm);}
.mobile-nav .emoji{display:block;font-size:1.2rem;}
.floating-whatsapp{
display:none;position:fixed;bottom:70px;right:16px;background:#25D366;
width:52px;height:52px;border-radius:50%;align-items:center;justify-content:center;
font-size:1.5rem;box-shadow:0 3px 10px rgba(0,0,0,.2);z-index:51;
}
/* Responsive */
@media (max-width:900px){
.cat-grid,.prod-grid,.why-grid,.review-slider,.footer-grid{grid-template-columns:repeat(2,1fr);}
.search-bar{display:none;}
.nav-list{gap:16px;font-size:.85rem;}
}
@media (max-width:600px){
.cat-grid,.prod-grid{grid-template-columns:repeat(2,1fr);}
.why-grid,.review-slider,.footer-grid{grid-template-columns:1fr;}
.hero h1{font-size:1.9rem;}
body{padding-bottom:60px;}
.mobile-nav{display:block;}
.floating-whatsapp{display:flex;}
.announce .container{justify-content:center;text-align:center;}
}
🚚 Free Delivery over ৳2000
📞 Call / WhatsApp: +880 1XXX-XXXXXX
📦 Track Order
EN | বাংলা
Premium Imported Healthy Foods
Fresh • Authentic • Delivered Across Bangladesh
Shop by Category
Handpicked staples for a healthier everyday
Best Sellers
Loved by our regular customers
Product photo
❤️
★★★★★
California Almonds
USA • 500g
৳650
Product photo
❤️
★★★★★
Pure Sundarban Honey
Bangladesh • 1kg
৳950
Product photo
❤️
★★★★☆
Kashmiri Walnuts
India • 500g
৳780
Product photo
❤️
★★★★★
Premium Garam Masala
Bangladesh • 250g
৳320
Why Choose Us
🚚
Fast Delivery
Across Dhaka & nationwide
🌎
Imported Quality
Sourced from trusted origins
💳
Secure Payment
COD, bKash, Nagad, bank transfer
⭐
Premium Support
We're here on WhatsApp anytime
Buy Premium Foods at Wholesale Prices
Bulk pricing for businesses, retailers & resellers
Visit Wholesale Shop
Customer Reviews
★★★★★
"Best quality almonds I've found in Bangladesh. Fresh and well packed."
— Farhana R.
★★★★★
"Honey is 100% pure, kids love it. Delivery was quick too."
— Tanvir A.
★★★★☆
"Great for wholesale — ordered for my shop, prices are fair."
— Kamal H.
Get 10% Off Your First Order
Subscribe for healthy recipes, offers & new arrivals
💬