/* ============================================================
   华商城 · 顶级布局精修 (2026-10-21)
   ① 容器加宽 ② 导航防溢出 ③ 区块呼吸节奏 ④ 网格密度 ⑤ Hero 冲击力
   载入位置：</body> 前（全站最后一张样式表，!important 兜底）
   ============================================================ */

/* ① 容器加宽：桌面 1200→1360，超宽屏 1440（原 1200 栅格偏窄显旧） */
@media (min-width: 1200px) {
  .container { max-width: 1360px !important; }
}
@media (min-width: 1600px) {
  .container { max-width: 1440px !important; }
}

/* ② 顶部导航：901–1280 隐藏冗余汉堡（全量导航仍在显示），收紧搜索/登录注册/间距 */
@media (min-width: 901px) and (max-width: 1280px) {
  .nav-toggle { display: none !important; }
  .topbar-user .btn-outline { max-width: 88px !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
@media (min-width: 901px) {
  .topbar-inner { gap: 10px !important; }
  .topbar-search { min-width: 96px !important; }
  .topbar-user { gap: 6px !important; }
  .topbar-user .btn-sm { padding: 5px 12px !important; }
}

/* ③ 主题区块纵向呼吸节奏：主区块统一 96px（原 64–88 参差 → 对齐最顶级节奏），紧凑横幅 64px */
@media (min-width: 901px) {
  .circle-entry,
  .eco-global,
  .ms-sec,
  .story-section,
  .join-banner,
  .compliance { margin-top: 96px !important; }
  .compliance { margin-bottom: 0 !important; }
  /* hero 后第一个区块（中华商道）收紧到 64px：hero 自带背景收口，不需要满格 96px */
  .ym-creed { margin-top: 64px !important; }
  /* 紧凑横幅（盲盒福袋 / 智慧学堂）64px 呼吸 */
  .home-blindbox { margin-top: 64px !important; }
  .ha-banner { margin-top: 64px !important; }
}

/* ④ 网格密度：商品/券保持 4 列（卡更宽），间距 18→22px */
@media (min-width: 901px) {
  .product-grid { grid-template-columns: repeat(4, 1fr) !important; gap: 22px !important; }
  .coupon-grid { grid-template-columns: repeat(4, 1fr) !important; gap: 22px !important; }
}

/* ⑤ Hero 冲击力：高度 540→620，标题 64→68（68 为「全球华商数字家园」8 字不换行的上限），
   深金棕渐变（浅底可读）+ 熔金流光（secShimmer 亮带扫过） */
@media (min-width: 901px) {
  .hero { min-height: 620px !important; }
  .hero-title {
    font-size: 68px !important;
    letter-spacing: 0.02em !important;
    line-height: 1.15 !important;
    background: linear-gradient(100deg, #5E4213 0%, #9A7228 28%, #E2B86C 46%, #F5DFA8 50%, #E2B86C 54%, #9A7228 72%, #5E4213 100%) !important;
    background-size: 220% 100% !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    animation: heroReveal .85s cubic-bezier(.22,.61,.36,1) both .2s, secShimmer 5s linear 1s infinite !important;
    filter: drop-shadow(0 1px 0 rgba(255,255,255,.35)) drop-shadow(0 3px 10px rgba(90,60,15,.20)) !important;
  }
}