/* ===== 一键报修入口（2026-11-07 上线） =====
   引用位置：site.js layout 头部 /css/baoxiu-entry.css
   覆盖：顶部按钮、首页 hero/CTA/扫码区、栏目左侧栏、联系方式表格 */

:root { --bx-red: #e03a1f; --bx-red-dark: #c22c13; }

/* ---- 顶部「一键报修」按钮 ---- */
.bx-open {
  display: inline-flex; align-items: center; gap: 6px; padding: 8px 15px;
  border-radius: 999px; background: linear-gradient(135deg, var(--bx-red), var(--bx-red-dark));
  color: #fff; font-size: 14px; font-weight: 700; letter-spacing: 1px;
  box-shadow: 0 4px 14px rgba(224, 58, 31, .32); white-space: nowrap;
  transition: transform .15s, box-shadow .15s;
}
.bx-open:hover { background: linear-gradient(135deg, #c93318, #a82509); transform: translateY(-1px); box-shadow: 0 8px 20px rgba(224, 58, 31, .4); }
.bx-open:active { transform: scale(.97); }
.bx-open .bx-ico { font-size: 14px; line-height: 1; }

/* ---- 首页 hero / CTA 大按钮 ---- */
.hp-btn-bx {
  background: linear-gradient(92deg, #e8452c, #ff6a3d); color: #fff;
  box-shadow: 0 10px 28px rgba(232, 69, 44, .32);
}
.hp-btn-bx:hover { transform: translateY(-3px); box-shadow: 0 16px 38px rgba(232, 69, 44, .45); }

.hp-cta-btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; position: relative; }
.hp-cta-qr {
  display: inline-flex; align-items: center; gap: 12px; margin-top: 20px; position: relative;
  color: #cfe0f5; font-size: 13px; font-weight: 700; line-height: 1.7;
}
.hp-cta-qr img { width: 92px; height: 92px; border-radius: 8px; background: #fff; padding: 4px; display: block; }
.hp-cta-qr:hover img { box-shadow: 0 0 0 3px rgba(255, 255, 255, .25); }

/* ---- 首页底部扫码区「报修」卡 ---- */
.hp-qr-bx { border-color: rgba(232, 69, 44, .42); }
.hp-qr-bx:hover { background: #fff5f1; }
.hp-qr-bx img { border: 1px solid rgba(232, 69, 44, .22); }

/* ---- 栏目左侧「在线报修」卡 ---- */
.side-baoxiu {
  margin-bottom: 16px; padding: 16px; font-size: 14px;
  background: linear-gradient(180deg, #fff8f5, #fff);
  border: 1px solid #ffd9cd; border-top: 3px solid var(--bx-red);
}
.side-baoxiu h3 { font-size: 15px; color: var(--bx-red-dark); margin-bottom: 4px; }
.side-baoxiu .bx-tip { color: #6b7686; font-size: 12.5px; line-height: 1.7; margin: 0 0 10px; }
.side-baoxiu .bx-go {
  display: block; text-align: center; padding: 10px 0; border-radius: 6px;
  background: linear-gradient(135deg, var(--bx-red), var(--bx-red-dark));
  color: #fff; font-weight: 700; letter-spacing: 1px;
  box-shadow: 0 4px 12px rgba(224, 58, 31, .25);
}
.side-baoxiu .bx-go:hover { background: linear-gradient(135deg, #c93318, #a82509); opacity: 1; }
.side-qr-bx { border-color: #ffd9cd; }
.side-qr-bx:hover { background: #fff5f1; }
.side-qr-bx span em { display: block; font-style: normal; font-weight: 400; font-size: 12px; color: #8a94a3; }

/* ---- 联系方式表格「在线报修」行 ---- */
.bx-cell .bx-link {
  display: inline-flex; align-items: center; gap: 5px; padding: 8px 18px; border-radius: 8px;
  background: linear-gradient(135deg, var(--bx-red), var(--bx-red-dark)); color: #fff;
  font-weight: 700; font-size: 14px; vertical-align: middle; white-space: nowrap;
  box-shadow: 0 4px 12px rgba(224, 58, 31, .25);
}
.bx-cell .bx-link:hover { background: linear-gradient(135deg, #c93318, #a82509); }
.bx-cell-qr { display: inline-flex; align-items: center; gap: 8px; margin-left: 14px; vertical-align: middle; }
.bx-cell-qr img { width: 64px; height: 64px; border: 1px solid var(--border); border-radius: 6px; background: #fff; display: block; }
.bx-cell-qr em { font-style: normal; font-size: 12px; color: var(--muted); }
.bx-note { display: block; font-style: normal; font-size: 12.5px; color: #8a94a3; margin-top: 8px; }

/* ---- 响应式 ---- */
@media (max-width: 768px) {
  .bx-open { padding: 7px 11px; font-size: 13px; }
  .hp-cta-btns .hp-btn { width: 100%; }
  .hp-cta-qr { display: none; }
  .bx-cell .bx-link { width: 100%; justify-content: center; margin-bottom: 10px; }
  .bx-cell-qr { margin-left: 0; }
}
@media (max-width: 420px) {
  .bx-open .bx-txt { font-size: 12.5px; letter-spacing: 0; }
  .bx-open { padding: 7px 9px; }
}

/* ===== 手机端头部重排（2026-11-07）=====
   修复：手机上头部内容溢出把菜单键挤出屏幕。
   新结构（≤520px）：第1行 logo+菜单键 / 第2行 三个快捷按钮等分 / 第3行 搜索框 */
@media (max-width: 520px) {
  .header-inner { padding: 10px 12px 8px; row-gap: 9px; }
  .logo { order: 1; flex: 1 1 auto; min-width: 0; gap: 8px; }
  .logo-img { height: 34px; }
  .nav-toggle {
    order: 2; flex: 0 0 auto; display: block;
    padding: 8px 4px 8px 12px; margin-left: auto;
  }
  .nav-toggle span { width: 22px; margin: 4px 0; }
  .header-contact { order: 3; flex: 1 1 100%; gap: 8px; }
  .header-contact > a, .header-contact > button {
    flex: 1 1 0; justify-content: center; text-align: center;
    padding: 8px 2px; font-size: 13px; letter-spacing: 0;
  }
  .header-contact .hotline { display: none; }
  .header-search { order: 4; flex: 1 1 100%; margin: 0; }
  .header-search input { height: 38px; padding: 0 88px 0 14px; }
}
@media (max-width: 360px) {
  .header-contact > a, .header-contact > button { font-size: 12px; }
  .bx-open .bx-ico, .kf-open, .wx-open { font-size: 12px; }
}

/* ===== 首页新闻栏溢出修复：grid 子项允许收缩，长标题不再撑破页面 ===== */
.hp-newscol { min-width: 0; }
