:root{
  --card-bg:#ffffff;
  --image-gradient-start:#F9FAFB;
  --image-gradient-end:#ffffff;
  --filter-border:#F3F4F6;
  --card-border:#F3F4F6;
  --card-border-hover:rgba(16,117,205,0.3);
  --wattage-bg-start:#E7F1FB;
  --wattage-bg-end:#D4E7F7;
  --title-color:#0B4678;
  --title-hover-color:#1075CD;
  --model-color:#6B7280;
  --product-desc-color:#4B5563;
  --price-label-color:#6B7280;
  --price-color:#FF0000;
  --button-gradient-start:#1075CD;
  --button-gradient-end:#0B4678;
  --best-seller-gradient-start:#FF0000;
  --best-seller-gradient-end:#CC0000;
}

.featured-section{ background:#F5F7FA; padding:4rem 0; }
.featured-inner{ max-width:1400px; margin:0 auto; padding:0 1rem; }
.featured-header{ display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:1.25rem; }
.featured-kicker{ display:inline-block; font-size:0.75rem; font-weight:700; color:#1075CD; letter-spacing:0.12em; margin-bottom:0.5rem; text-transform:uppercase; }
.featured-heading{ margin:0; font-size:1.875rem; line-height:1.05; color:#0B4678; }
.featured-link{ display:none; align-items:center; gap:0.5rem; color:#1075CD; font-weight:700; text-decoration:none; }
.featured-link .arrow{ margin-left:6px; }

.featured-grid{ display:grid; grid-template-columns:1fr; gap:1.2rem; margin-top:1.5rem; }
.featured-mobile-link{ display:block; text-align:center; margin-top:1.5rem; }
.featured-mobile-link a{ color:#1075CD; font-weight:700; text-decoration:none; }

.featured-grid .card, .featured-grid .card-link{ background:var(--card-bg); border-radius:0.5rem; overflow:hidden; border:1px solid var(--card-border); transition:all 300ms ease; position:relative; display:flex; flex-direction:column; height:auto; max-height:none; cursor:pointer; color:inherit; text-decoration:none; }
.featured-grid .card:hover, .featured-grid .card-link:hover{ box-shadow:0 10px 20px -5px rgba(0,0,0,0.15); border-color:var(--card-border-hover); transform:translateY(-2px); }

.featured-grid .card .media{ position:relative; overflow:hidden; background:linear-gradient(to bottom right,var(--image-gradient-start),var(--image-gradient-end)); height:200px; width:100%; flex-shrink:0; }
.featured-grid .card .media img{ width:100%; height:100%; object-fit:cover; transition:transform 700ms ease; }
.featured-grid .card:hover .media img{ transform:scale(1.1); }
.featured-grid .card .media .overlay{ position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,0.1),transparent); opacity:0; transition:opacity 500ms ease; }
.featured-grid .card:hover .media .overlay{ opacity:1; }

.featured-grid .badge{ position:absolute; top:0.4rem; left:0.4rem; z-index:10; background:linear-gradient(to right,var(--best-seller-gradient-start),var(--best-seller-gradient-end)); color:#fff; font-size:0.6rem; font-weight:700; padding:0.25rem 0.6rem; border-radius:9999px; box-shadow:0 4px 8px -2px rgba(0,0,0,0.12); display:flex; align-items:center; gap:0.2rem; }
.featured-grid .badge.discount-badge{ background:linear-gradient(135deg,#FF6B35,#FF8C42); top:0.4rem; left:0.4rem; right:auto; border-radius:0.3rem; padding:0.3rem 0.5rem; font-size:0.65rem; font-weight:800; }

.featured-grid .card-body{ padding:0.75rem; display:flex; flex-direction:column; flex:1; }
.featured-grid .card-body .card-header{ display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:0.5rem; }
.featured-grid .card-body h3{ font-size:1rem; font-weight:700; color:var(--title-color); margin:0 0 0.25rem; transition:color 300ms ease; }
.featured-grid .card:hover h3{ color:var(--title-hover-color); }
.featured-grid .card-body p.model{ font-size:0.7rem; font-weight:500; color:var(--model-color); margin:0; }
.featured-grid .watt{ background:linear-gradient(to bottom right,var(--wattage-bg-start),var(--wattage-bg-end)); color:var(--title-color); font-size:0.75rem; font-weight:700; padding:0.375rem 0.625rem; border-radius:0.5rem; border:1px solid rgba(16,117,205,0.2); }

.featured-grid .card-body .desc{ font-size:0.75rem; color:var(--product-desc-color); margin-bottom:0.75rem; line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

.featured-grid .card-footer{ display:flex; align-items:center; justify-content:space-between; padding-top:0.75rem; border-top:1px solid var(--filter-border); margin-top:auto; }
.featured-grid .price-small{ font-size:0.7rem; color:var(--price-label-color); margin-bottom:0.125rem; }
.featured-grid .price{ font-size:1rem; font-weight:700; color:var(--price-color); margin:0; }
.featured-grid .compare{ font-size:0.75rem; color:var(--price-label-color); margin:0; line-height:1.2; display:flex; align-items:center; gap:0.4rem; }
.featured-grid .compare s{ opacity:.6; }
.featured-grid .discount-tag{ background:#f56565; color:#fff; font-size:0.65rem; font-weight:700; padding:0.15rem 0.4rem; border-radius:9999px; }
.featured-grid .btn-view{ background:linear-gradient(to right,var(--button-gradient-start),var(--button-gradient-end)); color:#fff; padding:0.5rem 1rem; border-radius:0.5rem; font-size:0.825rem; font-weight:700; transition:all 300ms ease; box-shadow:0 8px 12px -3px rgba(16,117,205,0.25); text-decoration:none; display:inline-block; }
.featured-grid .btn-view:hover{ background:linear-gradient(to right,var(--button-gradient-end),var(--button-gradient-start)); box-shadow:0 16px 20px -5px rgba(16,117,205,0.3); transform:scale(1.03); }

.featured-grid .card-footer{ display:flex; align-items:center; justify-content:space-between; padding-top:0.75rem; border-top:1px solid var(--filter-border); }

@media (min-width:640px){
  .featured-grid{ grid-template-columns:repeat(2,1fr); }
  .featured-link{ display:inline-flex; }
  .featured-mobile-link{ display:none; }
}
@media (min-width:1024px){
  .featured-grid{ grid-template-columns:repeat(4,1fr); gap:1.3rem; }
  .featured-heading{ font-size:2.5rem; }
}