/* ============================================================
 * 1bgp.com 视觉优化补丁 (aesthetic-patch.css)
 * 用法：在 layout 模板 </head> 前引入，必须放在所有现有 CSS 之后：
 *   <link rel="stylesheet" href="/static/user/css/aesthetic-patch.css?v=1"/>
 * 特性：纯覆盖式规则，不改原文件，随时删除此引用即完全回滚。
 * 不涉及任何 JS / API / DOM 结构改动。
 * ============================================================ */

/* ---------- 1. 全局字号体系：消灭"缩着"的感觉 ---------- */
body {
  font-size: 14px;
}

/* 导航 11.5px -> 13.5px，高度 42px -> 46px */
.el-menu--horizontal.el-menu .el-menu-item,
.el-menu--horizontal.el-menu .el-sub-menu .el-sub-menu__title {
  font-size: 13.5px;
  height: 46px;
  line-height: 46px;
}

/* 全站最小字号保护：任何小于 11px 的文字提到 12px */
[style*="font-size:9.5px"], [style*="font-size:9.5px"] *,
[style*="font-size:10px"],  [style*="font-size:10px"] *,
[style*="font-size:10.5px"],[style*="font-size:10.5px"] * {
  font-size: 12px !important;
}

/* ---------- 2. Hero 区：撑起首屏第一眼 ---------- */
.mesimgo-hero {
  min-height: 340px;                 /* 220px -> 340px */
  border-radius: 20px;
  display: flex;
  align-items: center;
}
.mesimgo-hero-inner {
  padding: 48px 40px;                /* 24px 22px -> 48px 40px */
}
.mesimgo-hero-title {
  font-size: 44px;                   /* 38px -> 44px */
  letter-spacing: -0.3px;
  text-shadow: 0 1px 2px rgba(255, 255, 255, .6);
}
.mesimgo-hero-subtitle {
  font-size: 15px;                   /* 14px -> 15px */
  line-height: 26px;
}

/* ---------- 3. 价格：第一决策要素，视觉加权 ---------- */
.mesimgo-hot-head-price {
  font-size: 26px !important;        /* 18px -> 26px */
  letter-spacing: -0.5px;
}
.mesimgo-hot-head-price small {
  font-size: 13px;
  margin-left: 2px;
}

/* ---------- 4. Buy Now 按钮：转化入口要显眼 ---------- */
.mesimgo-hot-buy.el-button {
  height: 34px;                      /* 26px -> 34px */
  padding: 8px 20px;
  font-size: 13.5px;
  font-weight: 800;
  box-shadow: 0 4px 12px rgba(37, 99, 235, .25);
  transition: transform .15s ease, box-shadow .15s ease;
}
.mesimgo-hot-buy.el-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(37, 99, 235, .35);
}

/* ---------- 5. 卡片层次：静态更立体，动态更明显 ---------- */
.mesimgo-hot-card,
.card {
  box-shadow: 0 1px 3px rgba(15, 23, 42, .04);
  transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.mesimgo-hot-card:hover,
.card:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 32px rgba(2, 6, 23, .09);
  border-color: rgba(37, 99, 235, .30);
}

/* ---------- 6. 区块间距节奏 ---------- */
.mesimgo-hero {
  margin-top: 20px;                  /* 12px -> 20px */
}
[class*="mesimgo-"] section,
.mesimgo-section {
  margin-top: 64px;                  /* 统一大区块节奏 */
}

/* ---------- 7. 卖点勾选项：teal 强调色激活 ---------- */
/* 首页 "✓ 云服务器 + 物理服务器..." 这类优势行 */
.mesimgo-hero li, .mesimgo-hero .check-item {
  color: #0f766e;
  font-weight: 700;
}

/* ---------- 8. Hot Deals 特价标签（可选，按模板加 class） ----------
 * 模板里给 Hot Deals 标题旁加 <span class="deal-badge">限量特价</span>
 * 后，以下样式生效；不加则完全无影响。
 */
.deal-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  background: linear-gradient(135deg, #f97316, #ef4444);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .5px;
}

/* ============================================================
 * 上线后验证：
 * 1. 浏览器无痕窗口强刷 (Ctrl+F5)，确认字号/间距/按钮变化生效
 * 2. 手机端再过一遍（1440px 与 375px 两档）
 * 3. 若某条覆盖不生效，说明原选择器优先级更高，
 *    在本文件对应规则后加 !important 或提高选择器特异性即可
 * ============================================================ */