/* ============================================================
   WSTPARTS 设计优化补丁 (2026-07-25)
   目标：① 轮播图更突出（调亮遮罩+满亮度+文字阴影）② 整站区块间距/背景统一
   仅覆盖，不改动 app.css / responsive.css。
   可逆：删除 index.php 中 /css/design-opt.css 的 <link> 即完全回退。
   ============================================================ */

/* ---------- 1. 轮播图：让 banner 图像真正显出来（修复“轮播缺失”观感）---------- */
/* 原遮罩 rgba(0,0,0,.55~.15) 过重，图片被压成“黑块”。调亮到 .42~.08，图像清晰可见 */
.carousel-slide::after{
  background:linear-gradient(135deg,rgba(0,0,0,.42) 0%,rgba(0,0,0,.22) 55%,rgba(0,0,0,.08) 100%) !important;
}
/* 取消内联 0.85 透明度压暗，图像满亮度；并强制铺满容器无黑边 */
.carousel-slide img{opacity:1 !important;position:absolute !important;width:100% !important;height:100% !important;object-fit:cover !important;}
/* 文字加阴影，亮图上仍清晰可读 */
.carousel-title{text-shadow:0 2px 14px rgba(0,0,0,.55) !important;letter-spacing:.5px;}
.carousel-subtitle{text-shadow:0 1px 10px rgba(0,0,0,.5) !important;color:rgba(255,255,255,.92) !important;}
/* 控制按钮/指示器改用品牌琥珀，更明显 */
.carousel-btn{background:rgba(245,166,35,.32) !important;border-color:rgba(245,166,35,.6) !important;}
.carousel-btn:hover{background:rgba(245,166,35,.85) !important;}
.carousel-indicator.active{box-shadow:0 0 0 2px rgba(255,255,255,.45);}

/* ---------- 2. 整站区块统一节奏（仅桌面端；移动端交给 responsive.css）---------- */
@media (min-width:993px){
  /* 轮播更大更满：加高容器 + slide/img 撑满，修复“轮播图显示小了” */
  .carousel-container{height:680px !important;min-height:600px !important;}
  .carousel-slide{height:100% !important;min-height:100% !important;}
  .categories-section,
  .products-section,
  .news-section{
    background:#fff !important;
    padding:60px 0 !important;
    margin:0 !important;          /* 消除通用 section 混乱 margin 级联 */
  }
  .stats-section{
    background:linear-gradient(135deg,#1a1a1a 0%,#2d2d2d 100%) !important;
    padding:56px 0 !important;
    margin:0 !important;
  }
  .section-header{margin-bottom:40px !important;}
  .section-title{font-size:clamp(1.6rem,3vw,2rem) !important;}
}

/* ---------- 3. 产品卡占位符：从“破损灰块”改为有意为之的品牌占位 ---------- */
/* 热销产品暂未同步图片，原灰块显得“空/错乱”。改为琥珀浅色空状态，看着是设计而非故障 */
.hp-img-wrap{background:linear-gradient(135deg,#fafafa 0%,#f0f0f0 100%) !important;}
.hp-img-placeholder{
  background:linear-gradient(135deg,#fff7e6 0%,#fdeccb 100%) !important;
  border-radius:8px 8px 0 0;
}
.hp-img-placeholder img{opacity:.22 !important;filter:grayscale(1);}
