/* ==========================================================================
   featured-products.css — হোমপেজ "Featured Products" (customProductSettings)
   --------------------------------------------------------------------------
   আগে এই সেকশনটা fp-newarr-* ক্লাস পুনর্ব্যবহার করে "নতুন আসা পণ্য"-এর
   হুবহু কপি হিসেবে দেখাতো (একই স্ক্রলযোগ্য কার্ড-সারি) — ফলে ভিজ্যুয়ালি
   আলাদা কোনো সেকশন মনে হতো না। এই ফাইলটা fp-featured-* নামে সম্পূর্ণ নতুন,
   স্বতন্ত্র ক্লাসসেট দিচ্ছে:

       - বাঁ পাশে একটা লম্বা প্রোমো ব্যানার (ঐচ্ছিক)
       - ডান পাশে রেসপন্সিভ গ্রিড (স্ক্রল-ক্যারোসেল না — Flash Sale ও
         New Arrivals দুটোই স্ক্রলযোগ্য সারি, তাই ইচ্ছাকৃতভাবে গ্রিড রাখা
         হয়েছে যাতে চোখে আলাদা লাগে)
       - সোনালি/অ্যাম্বার অ্যাকসেন্ট বর্ডার ও "Featured" রিবন ব্যাজ, যাতে
         Flash Sale-এর লাল/কমলা থিম বা New Arrivals-এর প্লেইন সাদা কার্ড
         থেকে সহজেই আলাদা বোঝা যায়

   বাইরের লেআউট/স্পেসিং fp-wrap প্যাটার্নের সাথে মিলিয়ে রাখা হয়েছে
   (max-width:1400px), যাতে বাকি হোমপেজের সাথে সারিবদ্ধ থাকে। এই ফাইলে
   কোনো এক্সিস্টিং ক্লাস ওভাররাইড করা হয়নি — সব নতুন নামস্পেস।
   ========================================================================== */

.fp-featured-wrap{
  max-width:1400px;
  margin:18px auto 0;
  padding:0 20px;
}

.fp-featured-inner{
  position:relative;
  background:linear-gradient(180deg, #fffaf0 0%, var(--paper, #fff) 55%);
  border:1px solid var(--line, #eef0ef);
  border-top:3px solid var(--accent-gold, #d9a441);
  border-radius:14px;
  padding:20px 22px 24px;
  overflow:hidden;
}

.fp-featured-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:16px;
}

.fp-featured-head-left{
  display:flex;
  align-items:center;
  gap:10px;
}

.fp-featured-ribbon{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.03em;
  color:#7a4e05;
  background:#fbe6b8;
  border:1px solid #eccb84;
  border-radius:20px;
  padding:4px 11px;
  white-space:nowrap;
}

.fp-featured-head h2{
  font-family:'Baloo Da 2',sans-serif;
  font-size:19px;
  margin:0;
  color:var(--ink, #222);
}

.fp-featured-viewall{
  font-size:12.5px;
  font-weight:700;
  color:#8a5a08;
  border:1.5px solid #d9a441;
  border-radius:8px;
  padding:7px 18px;
  text-decoration:none;
  white-space:nowrap;
  transition:background .15s,color .15s;
}
.fp-featured-viewall:hover{ background:#d9a441; color:#fff; }

.fp-featured-body{
  display:flex;
  align-items:stretch;
  gap:20px;
}

.fp-featured-banner{
  flex:0 0 240px;
  width:240px;
  border-radius:10px;
  overflow:hidden;
  display:block;
  position:relative;
}
.fp-featured-banner img{
  width:100%;
  height:100%;
  min-height:260px;
  object-fit:cover;
  display:block;
}

.fp-featured-grid{
  flex:1 1 auto;
  min-width:0;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:16px;
}
.fp-featured-body.no-banner .fp-featured-grid{
  grid-template-columns:repeat(5, 1fr);
}

.fp-featured-card{
  background:var(--paper, #fff);
  border:1px solid var(--line, #eef0ef);
  border-radius:10px;
  overflow:hidden;
  text-decoration:none;
  color:var(--ink, #222);
  display:flex;
  flex-direction:column;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.fp-featured-card:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 18px rgba(0,0,0,.08);
  border-color:#d9a441;
}

.fp-featured-card-img{
  width:100%;
  aspect-ratio:1/1;
  background:#fafbfa center/contain no-repeat;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:30px;
  color:#c3ccc5;
  position:relative;
  border-bottom:1px solid var(--line, #eef0ef);
}

.fp-featured-badge{
  position:absolute;
  top:8px;
  left:8px;
  font-size:10.5px;
  font-weight:800;
  color:#7a4e05;
  background:#fbe6b8;
  border:1px solid #eccb84;
  border-radius:6px;
  padding:2px 7px;
}

.fp-featured-card-body{ padding:10px 11px 12px; display:flex; flex-direction:column; gap:5px; }
.fp-featured-card-name{
  font-size:12.5px; line-height:1.35; height:2.7em; overflow:hidden;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
}
.fp-featured-card-brand{ font-size:11.5px; color:var(--ink-soft, #7a8a80); }
.fp-featured-price-row{ display:flex; align-items:baseline; gap:7px; flex-wrap:wrap; }
.fp-featured-price{ font-size:14.5px; font-weight:700; color:#8a5a08; }
.fp-featured-price-old{ font-size:11.5px; color:var(--ink-soft, #7a8a80); text-decoration:line-through; }

@media (max-width:1100px){
  .fp-featured-grid{ grid-template-columns:repeat(3, 1fr); }
  .fp-featured-body.no-banner .fp-featured-grid{ grid-template-columns:repeat(4, 1fr); }
}
@media (max-width:820px){
  .fp-featured-body{ flex-direction:column; }
  .fp-featured-banner{ flex-basis:auto; width:100%; }
  .fp-featured-banner img{ min-height:150px; max-height:180px; }
  .fp-featured-grid{ grid-template-columns:repeat(3, 1fr); }
}
@media (max-width:600px){
  .fp-featured-inner{ padding:16px 14px 18px; }
  .fp-featured-grid{ grid-template-columns:repeat(2, 1fr); }
  .fp-featured-body.no-banner .fp-featured-grid{ grid-template-columns:repeat(2, 1fr); }
}