/* ============================================================
   客必得官网 · 暖色活力风覆盖层（2026-08-26 重设计 v2）
   加载在 style.css 之后。基调：活力暖橙 + 暖黄 + 米白（年轻化/亲和力）
   保留原布局类名，只覆盖颜色/质感/细节
   ============================================================ */

:root {
  --kbd-orange: #ff6b35;        /* 活力橙（主色） */
  --kbd-orange-deep: #e85d2a;   /* 深橙 */
  --kbd-orange-light: #ff9d73;  /* 浅橙 */
  --kbd-yellow: #ffb03a;        /* 暖黄（辅助） */
  --kbd-cream: #fff8f0;         /* 米白底 */
  --kbd-dark: #2d2a26;          /* 深棕黑（文字） */
  --kbd-gray: #8a857e;          /* 灰 */
  --kbd-round: 12px;            /* 圆角 */
  --kbd-shadow: 0 6px 24px rgba(255, 107, 53, 0.12);
}

/* ---------- 顶部导航 ---------- */
.header {
  background: linear-gradient(135deg, #fff8f0 0%, #fff 60%) !important;
  border-bottom: 2px solid rgba(255, 107, 53, 0.15) !important;
  box-shadow: 0 2px 12px rgba(255, 107, 53, 0.08);
}
.header .nav > li > a {
  color: var(--kbd-dark) !important;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 1px;
}
.header .nav > li:hover > a,
.header .nav > li.active > a {
  color: var(--kbd-orange) !important;
}
.header .nav > li > a::after {
  background: var(--kbd-orange) !important;
  height: 3px !important;
  border-radius: 3px;
}
.header .logo img {
  max-height: 52px !important;
}

/* ---------- 首页轮播 ---------- */
.banner .text .inner h4 {
  font-size: 40px !important;
  font-weight: 800;
  letter-spacing: 2px;
  color: #fff !important;
  text-shadow: 0 2px 24px rgba(232, 93, 42, 0.55);
}
.banner .text .inner p {
  color: #fff8f0 !important;
  font-size: 18px;
  letter-spacing: 1px;
}
.banner .text .inner a {
  background: linear-gradient(135deg, var(--kbd-orange), var(--kbd-yellow)) !important;
  border: none !important;
  color: #fff !important;
  font-weight: 700;
  letter-spacing: 2px;
  padding: 12px 36px !important;
  border-radius: 50px !important;
  box-shadow: 0 6px 20px rgba(255, 107, 53, 0.4);
  transition: transform .3s;
}
.banner .text .inner a:hover {
  transform: translateY(-3px) scale(1.03);
}

/* ---------- 全局区块标题 ---------- */
.section-title strong {
  color: var(--kbd-dark) !important;
  font-size: 30px !important;
  font-weight: 800;
  letter-spacing: 2px;
}
.section-title strong span {
  color: var(--kbd-orange) !important;
}
.section-title p {
  color: var(--kbd-gray) !important;
  font-size: 15px;
}
.section-title::after {
  background: linear-gradient(90deg, var(--kbd-orange), var(--kbd-yellow)) !important;
  height: 4px !important;
  border-radius: 4px;
  width: 60px !important;
}

/* ---------- 卡片列表（产品/案例） ---------- */
.list-1 li {
  border-radius: var(--kbd-round) !important;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
  transition: transform .35s, box-shadow .35s;
}
.list-1 li .text .inner h4 {
  color: var(--kbd-dark) !important;
  font-size: 17px !important;
  font-weight: 700;
}
.list-1 li:hover {
  transform: translateY(-6px);
  box-shadow: var(--kbd-shadow) !important;
}
.list-1 li:hover .text .inner h4 {
  color: var(--kbd-orange) !important;
}
.list-1 li a .img-cover span {
  transition: transform .6s ease;
}
.list-1 li:hover a .img-cover span {
  transform: scale(1.06);
}

/* ---------- 数据墙 ---------- */
.in-total {
  background: linear-gradient(135deg, var(--kbd-orange-deep) 0%, var(--kbd-orange) 55%, var(--kbd-yellow) 130%) !important;
  padding: 44px 0 !important;
  border-radius: 0;
}
.in-total li span {
  color: #fff !important;
  font-size: 46px !important;
  font-weight: 900;
  text-shadow: 0 2px 12px rgba(0,0,0,0.18);
}
.in-total li p {
  color: #fff8f0 !important;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 1px;
}

/* ---------- 服务/新闻列表 ---------- */
.list-2 li .text h4 {
  color: var(--kbd-dark) !important;
  font-weight: 700;
}
.list-2 li:hover .text h4 {
  color: var(--kbd-orange) !important;
}
.list-2 li .date strong {
  color: var(--kbd-orange) !important;
  font-weight: 800;
}
.list-2 li {
  border-radius: var(--kbd-round) !important;
  padding: 10px;
  transition: background .3s;
}
.list-2 li:hover {
  background: var(--kbd-cream) !important;
}

/* ---------- 内页横幅 ---------- */
.banner-sub {
  position: relative;
}
.banner-sub::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(rgba(232, 93, 42, 0.45), rgba(232, 93, 42, 0.35));
}
.banner-sub .inner {
  color: #fff !important;
  font-weight: 800;
  letter-spacing: 3px;
  font-size: 28px !important;
  text-shadow: 0 2px 14px rgba(232, 93, 42, 0.5);
}

/* ---------- 底部 ---------- */
.footer {
  background: var(--kbd-dark) !important;
  border-top: 4px solid var(--kbd-orange) !important;
}
.footer dl dt {
  color: var(--kbd-yellow) !important;
  font-weight: 700;
  letter-spacing: 2px;
}
.footer dl dd a {
  color: #b8b2aa !important;
}
.footer dl dd a:hover {
  color: var(--kbd-orange-light) !important;
}
.footer .lx .tel {
  color: var(--kbd-yellow) !important;
  font-weight: 800;
}
.footer-copy {
  background: #211f1c !important;
}
.footer-copy p {
  color: #9a948c !important;
}

/* ---------- CTA 区 ---------- */
.in-ready h4 {
  color: var(--kbd-dark) !important;
  font-weight: 800;
  letter-spacing: 2px;
}
.in-ready .btn a {
  background: linear-gradient(135deg, var(--kbd-orange), var(--kbd-yellow)) !important;
  color: #fff !important;
  font-weight: 700;
  border-radius: 50px !important;
  letter-spacing: 2px;
  box-shadow: 0 6px 18px rgba(255, 107, 53, 0.35);
}
.in-ready .btn a:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(255, 107, 53, 0.45);
}

/* ---------- 移动端导航 ---------- */
.sp_nav-box {
  background: #fff !important;
}
.sp_nav-box ul li a {
  color: var(--kbd-dark) !important;
  font-weight: 600;
}
.sp_nav-box .in-ready {
  background: var(--kbd-cream) !important;
}

/* ---------- 其他细节 ---------- */
.position {
  color: var(--kbd-gray) !important;
}
.position a { color: var(--kbd-orange) !important; }
.lanmu-title {
  color: var(--kbd-dark) !important;
  font-weight: 800;
  letter-spacing: 2px;
}
.lanmu-title::before {
  background: var(--kbd-orange) !important;
}
.btn-more, .more-link, .view-more {
  border-color: var(--kbd-orange) !important;
  color: var(--kbd-orange) !important;
  border-radius: 50px !important;
  font-weight: 600;
}
.btn-more:hover, .more-link:hover {
  background: var(--kbd-orange) !important;
  color: #fff !important;
}

/* ---------- 高亮/强调 ---------- */
.section-title strong em,
.in-desc h4,
.about-2 h4,
.content-case-title h4 {
  color: var(--kbd-orange) !important;
}

/* ---------- 顶部栏目标签（常见问题/技术支持/在线问答） ---------- */
.h-lanmu {
  border-bottom: 2px solid #f0e8dc !important;
}
.h-lanmu li a {
  color: var(--kbd-dark) !important;
  font-weight: 600;
  border-radius: 8px 8px 0 0 !important;
  padding: 10px 22px !important;
}
.h-lanmu li.active a,
.h-lanmu li a:hover {
  background: linear-gradient(135deg, var(--kbd-orange), var(--kbd-yellow)) !important;
  color: #fff !important;
  font-weight: 700;
}
/* 内页小栏目列表 */
.v-lanmu li a {
  color: var(--kbd-dark) !important;
}
.v-lanmu li.active a,
.v-lanmu li a:hover {
  color: var(--kbd-orange) !important;
  border-color: var(--kbd-orange) !important;
}
