.logo-img {
  height: 50px;
  width: auto;
  max-width: 240px;
  display: block;
}
/* ==========================================================================
   广东固莱新材料科技有限公司 - 主样式
   1:1 还原固莱官网视觉规范
   ========================================================================== */

/* ---------- 设计变量 ---------- */
:root {
  /* 配色 */
  --c-blue:        #122488;
  --c-blue-2:      #1D2088;
  --c-blue-3:      #172A88;
  --c-blue-link:   #0B55B5;
  --c-blue-mid:    #224682;
  --c-blue-hover:  #2B6BBE;
  --c-yellow:      #FEF322;
  --c-yellow-2:    #FFF367;
  --c-yellow-h:    #EEE300;
  --c-red-info:    #53A5EC;

  --c-text-1: #1A1A1A;
  --c-text-2: #333333;
  --c-text-3: #666666;
  --c-text-4: #808080;
  --c-text-5: #999999;
  --c-text-6: #777777;

  --c-line-1: #EEEEEE;
  --c-line-2: #DCDCDC;
  --c-line-3: #D2D2D2;

  --c-bg-1: #FFFFFF;
  --c-bg-2: #F2F2F3;
  --c-bg-3: #F7F7F7;
  --c-bg-4: #F8F8F8;

  /* 尺寸 */
  --container: 1258px;
  --head-h: 110px;
  --menu-h: 70px;

  /* 字号 */
  --fs-12: 12px;
  --fs-13: 13px;
  --fs-14: 14px;
  --fs-15: 15px;
  --fs-16: 16px;
  --fs-18: 18px;
  --fs-22: 22px;
  --fs-24: 24px;
  --fs-30: 30px;
  --fs-46: 46px;
  --fs-48: 48px;
  --fs-52: 52px;
  --fs-58: 58px;
  --fs-66: 66px;

  /* 圆角 */
  --r-sm: 3px;
  --r-md: 10px;
  --r-pill: 28px;

  /* 阴影 */
  --sh-card: 0 0 20px rgba(30,40,60,0.15);
  --sh-search: 3px 4px 10px 0 rgba(0,0,0,0.06);

  /* 字体 */
  --font-base: "Microsoft YaHei", "PingFang SC", "Source Han Sans CN",
               "思源黑体 CN", "Helvetica Neue", Arial, sans-serif;
  --font-num: "DIN", "DIN Alternate", "Arial Narrow", Arial, sans-serif;
}

/* ---------- 基础 ---------- */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font-base);
  font-size: var(--fs-14);
  line-height: 1.7;
  color: var(--c-text-2);
  background: #fff;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; vertical-align: top; }
a { color: var(--c-text-2); text-decoration: none; transition: color .25s; }
a:hover { color: var(--c-blue); }
ul, li, ol { list-style: none; margin: 0; padding: 0; }
h1, h2, h3, h4, h5 { margin: 0; font-weight: bold; }
em, i { font-style: normal; }
button, input, textarea, select { font-family: inherit; outline: none; }
.clearfix::after { content: ""; display: block; clear: both; }
.content { width: var(--container); margin: 0 auto; }
.center { text-align: center; }
.hide { display: none !important; }

/* ---------- 头部 + 菜单 单排布局（白底） ---------- */
.logo-img {
  height: 50px;
  width: auto;
  max-width: 240px;
  display: block;
}
.head-wrap {
  background: #fff;
  position: relative;
  z-index: 100;
  color: var(--c-text-2);
  border-bottom: 2px solid var(--c-blue);
}
.head {
  display: flex;
  align-items: center;
  height: 70px;
  gap: 0;
}
.logo {
  display: flex;
  align-items: center;
  gap: 4px;
  text-decoration: none;
  color: inherit;
  flex-shrink: 0;
  padding-right: 18px;
}
.logo-mark-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.logo-circle {
  position: relative;
  width: 44px; height: 44px;
  background: var(--c-blue);
  border: 2px solid var(--c-blue);
  border-radius: 50%;
  box-shadow: 0 1px 4px rgba(18,36,136,.18);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.logo-x {
  width: 80%;
  height: 80%;
}
.logo-trademark {
  position: absolute;
  top: -3px;
  right: -4px;
  font-size: 9px;
  color: #fff;
  font-weight: normal;
  font-family: Arial, sans-serif;
  font-style: normal;
  background: var(--c-blue);
  border-radius: 50%;
  width: 13px; height: 13px;
  line-height: 13px;
  text-align: center;
  box-shadow: 0 0 0 2px #fff;
}
.logo-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.1;
}
.logo-text strong {
  font-size: 19px;
  font-weight: bold;
  color: var(--c-blue);
  letter-spacing: 2px;
  font-family: "Microsoft YaHei", sans-serif;
}
.logo-text em {
  font-size: 7px;
  font-style: italic;
  color: var(--c-blue);
  letter-spacing: 1px;
  margin-top: 2px;
  opacity: .75;
}
.logo-title-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.logo-title {
  font-size: 22px;
  font-weight: 900;
  color: var(--c-blue);
  letter-spacing: 1px;
  line-height: 1;
  font-style: italic;
  text-shadow:
    -1px -1px 0 #fff,
     1px -1px 0 #fff,
    -1px  1px 0 #fff,
     1px  1px  0 #fff,
     0 2px 4px rgba(18,36,136,.15);
}
.logo-sub {
  display: flex; flex-direction: column;
  padding-left: 4px;
  border-left: 1px dashed #ddd;
  font-size: 10px; line-height: 1.5;
  color: #666;
  flex-shrink: 0;
}
.logo-sub i { font-style: normal; color: #666; }
.logo-sub em { font-style: normal; color: var(--c-blue); font-weight: bold; }

/* 菜单（与头部同一行 白底深字） */
.menu {
  flex: 1;
  display: flex;
  align-items: stretch;
  min-width: 0;
}
.menu ul {
  display: flex;
  align-items: stretch;
  justify-content: flex-end;
  gap: 8px;
  width: 100%;
  padding-right: 8px;
}
.menu li { flex: 0 0 auto; }
.menu li a {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #333;
  font-size: 13px;
  font-weight: normal;
  letter-spacing: 0;
  position: relative;
  transition: color .25s;
  white-space: nowrap;
  padding: 0;
}
.menu li a em {
  display: inline-block;
  position: relative;
  padding-bottom: 8px;
  color: var(--c-text-2);
}
.menu li a em::after {
  content: "";
  position: absolute;
  left: 50%; bottom: -6px;
  transform: translateX(-50%);
  width: 0; height: 3px;
  background: var(--c-yellow);
  transition: width .3s;
}
.menu li a:hover em::after,
.menu li.cur a em::after { width: 80%; }
.menu li a:hover em,
.menu li.cur a em { color: var(--c-blue); font-weight: bold; }

/* 右侧 */
.hea-rig {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #333;
  flex-shrink: 0;
  padding-left: 18px;
  border-left: 1px solid #eee;
}
.hea-fz select {
  border: 1px solid #ccc;
  background: #fff;
  color: #333;
  height: 26px; padding: 0 8px; font-size: 12px;
  border-radius: 3px; cursor: pointer;
}
.hea-fz select option { color: #333; background: #fff; }
.hea-lx { display: flex; gap: 6px; }
.hea-lx .ic {
  width: 24px; height: 24px; border-radius: 50%;
  display: inline-flex;
  background-size: 14px 14px; background-position: center; background-repeat: no-repeat;
  transition: transform .25s, opacity .25s; cursor: pointer; text-decoration: none;
}
.hea-lx .ic:hover { transform: scale(1.1); opacity: .85; }
.ic-wx {
  background-color: #1aad19;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M9 4C4.5 4 1 7.1 1 11c0 2 1 3.8 2.7 5L3 18l3-1c1 .3 2 .5 3 .5h.5c-.3-.7-.5-1.5-.5-2.3C 6 11.4 9.4 8.5 13.5 8.5h.5C13.4 6 11.4 4 9 4zM6 8.5c-.6 0-1-.4-1-1s.4-1 1-1 1 .4 1 1-.4 1-1 1zm6 0c-.6 0-1-.4-1-1s.4-1 1-1 1 .4 1 1-.4 1-1 1zM22 15c0-3.3-3.1-6-7-6s-7 2.7-7 6 3.1 6 7 6c.8 0 1.6-.1 2.3-.3L20 21l-.6-1.8C20.9 18 22 16.6 22 15zm-9-1.5c-.4 0-.8-.4-.8-.8s.4-.8.8-.8.8.4.8.8-.4.8-.8.8zm5 0c-.4 0-.8-.4-.8-.8s.4-.8.8-.8.8.4.8.8-.4.8-.8.8z'/></svg>");
}
.ic-wb {
  background-color: #ff9933;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M10 12c-3.3 0-6 2-6 4.5S6.7 21 10 21s6-2 6-4.5S13.3 12 10 12zm-1 6c-1.1 0-2-.7-2-1.5s.9-1.5 2-1.5 2 .7 2 1.5-.9 1.5-2 1.5zm9-9c.5 0 1-.4 1-1 0-2-2-3.5-4-3.5-.5 0-1 .4-1 1 0 .5.4 1 1 1 1 0 2 .6 2 1.5 0 .6.5 1 1 1z'/></svg>");
}
.ic-tel {
  background-color: #1296db;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M20 15.5c-1.2 0-2.5-.2-3.6-.6-.3-.1-.7 0-1 .2l-2.2 2.2c-2.8-1.4-5.1-3.8-6.6-6.6l2.2-2.2c.3-.3.4-.7.2-1-.3-1.1-.5-2.4-.5-3.6 0-.5-.5-1-1-1H4c-.5 0-1 .5-1 1 0 8.8 7.2 16 16 16 .5 0 1-.5 1-1v-3.5c0-.5-.5-.9-1-.9z'/></svg>");
}

.hea-tel {
  display: flex; flex-direction: column; align-items: flex-end; line-height: 1.15;
  padding-left: 12px;
  border-left: 1px dashed #ddd;
  margin-left: 2px;
}
.hea-tel small {
  font-size: 9px; color: #888;
  margin-bottom: 3px; letter-spacing: 1px;
}
.hea-tel b {
  font-family: var(--font-num);
  font-size: 16px; color: var(--c-blue); font-weight: bold;
  letter-spacing: 1px;
}

/* ---------- 首屏 hero 轮播 ---------- */
.hero {
  position: relative;
  width: 100%;
  height: 580px;
  background: #f0f0f0;
  overflow: hidden;
}
.hero .swiper {
  width: 100%; height: 100%;
  position: relative;
}
.hero .slide {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background-size: cover; background-position: center;
  opacity: 0; transition: opacity .8s;
}
.hero .slide.active { opacity: 1; }
.hero .slide-1 { background-color: #122488; }
.hero .slide-1 .slide-content {
  color: #fff; text-align: center;
  max-width: 800px;
}
.hero .slide-1 .slide-content h1,
.hero .slide-1 .slide-content h2 {
  font-size: 60px; color: var(--c-yellow); margin-bottom: 24px;
  text-shadow: 0 4px 12px rgba(0,0,0,.4);
  letter-spacing: 4px;
  font-weight: 700;
}
.hero .slide-1 .slide-content p {
  font-size: 22px; color: rgba(255,255,255,.9); margin-bottom: 40px;
}
.hero .slide-1 .slide-content .cta {
  display: inline-block; padding: 16px 48px;
  background: var(--c-yellow); color: var(--c-blue);
  font-size: 18px; border-radius: var(--r-pill);
  font-weight: bold;
}
.hero .slide-2 { background-color: #FEF322; }
.hero .slide-2 .slide-content { color: var(--c-blue); text-align: center; }
.hero .slide-2 .slide-content h2 { font-size: 56px; }
.hero .slide-2 .slide-content .cta {
  background: var(--c-blue); color: var(--c-yellow);
  display: inline-block; padding: 16px 48px;
  border-radius: var(--r-pill); font-size: 18px;
}
.hero .slide-3 { background-color: #122488; }
.hero .slide-3 .slide-content { color: #fff; text-align: center; }
.hero .slide-3 .slide-content h2 { font-size: 48px; }
.hero .slide-3 .slide-content .cta {
  background: var(--c-yellow); color: var(--c-blue);
  display: inline-block; padding: 16px 48px;
  border-radius: var(--r-pill); font-size: 18px;
}
.hero .arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 48px; height: 80px;
  background: rgba(0,0,0,.3);
  color: #fff; cursor: pointer; z-index: 5;
  display: flex; align-items: center; justify-content: center;
  font-size: 30px;
  transition: background .25s;
}
.hero .arrow:hover { background: rgba(0,0,0,.5); }
.hero .arrow.prev { left: 30px; }
.hero .arrow.next { right: 30px; }
.hero .dots {
  position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%);
  display: flex; gap: 8px; z-index: 5;
}
.hero .dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: rgba(255,255,255,.4); cursor: pointer;
}
.hero .dot.active { background: var(--c-yellow); width: 30px; border-radius: 5px; }

/* ---------- 搜索条 ---------- */
.search-bar {
  height: 66px;
  background: #fff;
  box-shadow: var(--sh-search);
  position: relative;
  z-index: 200;
}
.search-bar .content { display: flex; align-items: center; height: 100%; justify-content: space-between; }
.search-bar .hot {
  display: flex; align-items: center; gap: 24px;
  color: var(--c-text-3); font-size: 14px;
}
.search-bar .hot .label::before {
  content: ""; display: inline-block;
  width: 18px; height: 20px;
  background: var(--c-blue);
  vertical-align: middle; margin-right: 8px;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M15.5 14h-.8l-.3-.3a6.5 6.5 0 1 0-.7.7l.3.3v.8L18 20l2-2-4.5-4zM10 14a4 4 0 1 1 0-8 4 4 0 0 1 0 8z'/></svg>") center/contain no-repeat;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M15.5 14h-.8l-.3-.3a6.5 6.5 0 1 0-.7.7l.3.3v.8L18 20l2-2-4.5-4zM10 14a4 4 0 1 1 0-8 4 4 0 0 1 0 8z'/></svg>") center/contain no-repeat;
}
.search-bar .hot a { color: var(--c-text-3); }
.search-bar .hot a:hover { color: var(--c-blue); }
.search-bar .sou {
  width: 300px; height: 40px;
  border: 1px solid var(--c-line-1);
  border-radius: 20px;
  display: flex;
}
.search-bar .sou input.txt {
  flex: 1; padding: 0 19px;
  background: transparent; border: 0;
  font-size: 14px; color: var(--c-text-5);
}
.search-bar .sou input.btn {
  width: 46px;
  background: var(--c-blue) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='white' d='M15.5 14h-.8l-.3-.3a6.5 6.5 0 1 0-.7.7l.3.3v.8L18 20l2-2-4.5-4zM10 14a4 4 0 1 1 0-8 4 4 0 0 1 0 8z'/></svg>") center/24px no-repeat;
  border: 0; cursor: pointer; border-radius: 0 20px 20px 0;
}

/* ---------- 产品专区 ---------- */
.section { padding: 60px 0; }
.section-head {
  text-align: center; margin-bottom: 40px;
}
.section-head h2 {
  font-size: var(--fs-52);
  color: var(--c-text-2);
  margin-bottom: 14px;
  letter-spacing: 2px;
}
.section-head h2 span { display: block; line-height: 1.2; }
.section-head em {
  display: block;
  font-size: var(--fs-18);
  color: var(--c-text-3);
  font-weight: normal;
  line-height: 1.5;
  margin-bottom: 12px;
}
.section-head i {
  display: block; width: 28px; height: 2px;
  background: var(--c-blue-link); margin: 0 auto;
}

.section.dark { background: var(--c-bg-2); }
.section.gray { background: #f8f8f8; }

.product-section {
  background: linear-gradient(180deg, #fafafa 0%, #fff 100%);
}
.product-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px 35px;
}
.product-card {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: var(--r-sm);
  background: #f5f5f5;
  transition: transform .4s;
}
.product-card .pc-cover {
  position: relative; overflow: hidden;
  aspect-ratio: 388/220;
  background: linear-gradient(135deg, #122488 0%, #2B6BBE 100%);
}
.product-card .pc-cover svg { width: 100%; height: 100%; display: block; }
.product-card .pc-cover::before,
.product-card .pc-cover::after,
.product-card::before,
.product-card::after {
  content: "";
  position: absolute;
  background: var(--c-yellow);
  z-index: 5;
  transition: all .5s;
}
.product-card::before { top: 0; left: 0; width: 0; height: 2px; }
.product-card::after  { top: 0; left: 0; width: 2px; height: 0; }
.product-card .pc-cover::before { bottom: 0; right: 0; width: 0; height: 2px; }
.product-card .pc-cover::after  { bottom: 0; right: 0; width: 2px; height: 0; }
.product-card:hover::before { width: 100%; }
.product-card:hover::after  { height: 100%; }
.product-card:hover .pc-cover::before { width: 100%; }
.product-card:hover .pc-cover::after  { height: 100%; }
.product-card .pc-cover img,
.product-card .pc-cover svg { transition: transform 1s; }
.product-card:hover .pc-cover img,
.product-card:hover .pc-cover svg { transform: scale(1.08); }
.product-card .pc-info {
  position: absolute; left: 0; top: 50px;
  padding-left: 36px;
  z-index: 10;
  transition: all .5s;
}
.product-card .pc-info h4 em {
  display: block;
  font-size: 24px; color: #fff;
  font-weight: normal; line-height: 1.4;
  margin-bottom: 4px;
}
.product-card .pc-info h4 i {
  display: block;
  font-size: 14px; color: rgba(255,255,255,.7);
  font-weight: normal;
}
.product-card:hover .pc-info {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23FEF322' d='M22 16h-6v6h-4v-6H6v-4h6V6h4v6h6z'/></svg>") no-repeat right top;
  padding-right: 60px;
}
.product-cta { text-align: center; margin-top: 30px; }
.btn-pill {
  display: inline-block;
  min-width: 200px; height: 56px;
  line-height: 56px;
  padding: 0 30px;
  border-radius: var(--r-pill);
  font-size: 16px; font-weight: bold;
  margin: 0 10px;
  transition: all .25s;
  cursor: pointer; border: 0;
}
.btn-pill.btn-yellow { background: var(--c-yellow); color: #000; }
.btn-pill.btn-yellow:hover { background: var(--c-yellow-h); }
.btn-pill.btn-blue { background: var(--c-blue-2); color: #fff; }
.btn-pill.btn-blue:hover { background: var(--c-blue); }
.btn-pill.btn-ghost { background: transparent; color: var(--c-blue); border: 2px solid var(--c-blue); }
.btn-pill.btn-ghost:hover { background: var(--c-blue); color: #fff; }
.btn-pill .arr { display: inline-block; width: 18px; height: 18px; vertical-align: middle; margin-left: 10px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M14.7 6.3l-1.4 1.4 4.3 4.3H4v2h13.6l-4.3 4.3 1.4 1.4L21 12z'/></svg>") center/contain no-repeat;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M14.7 6.3l-1.4 1.4 4.3 4.3H4v2h13.6l-4.3 4.3 1.4 1.4L21 12z'/></svg>") center/contain no-repeat;
}

/* ---------- 装修辅材介绍 + 数据看板 ---------- */
.about-section {
  height: auto;
  background: linear-gradient(135deg, #f5f7fb 0%, #e8eef9 100%);
  padding: 80px 0 60px;
  position: relative;
}
.about-section::before {
  content: "";
  position: absolute; inset: 0;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><circle cx='20' cy='20' r='30' fill='%23122488' fill-opacity='.04'/><circle cx='80' cy='80' r='40' fill='%23122488' fill-opacity='.05'/></svg>") no-repeat;
  background-size: 50%;
  pointer-events: none;
}
.about-top { display: flex; align-items: stretch; gap: 50px; position: relative; z-index: 2; }
.about-left {
  flex: 0 0 460px;
  position: relative;
  aspect-ratio: 460/430;
}
.about-left .board { width: 100%; height: 100%; border-radius: var(--r-md); overflow: hidden;
  background: linear-gradient(135deg, #122488 0%, #2B6BBE 100%);
}
.about-left .board svg { width: 100%; height: 100%; }
.about-left .badge {
  position: absolute; right: -110px; top: 30px;
  width: 210px; height: 280px;
  background: var(--c-yellow);
  border-radius: var(--r-md);
  display: flex; align-items: center; justify-content: center;
  text-align: center;
  font-family: var(--font-base);
  font-size: 22px; color: var(--c-blue);
  font-weight: bold; line-height: 1.6;
  box-shadow: var(--sh-card);
  transform: rotate(5deg);
}
.about-left .badge::before {
  content: "辅材专家";
  display: block;
  font-size: 32px;
  color: var(--c-blue-2);
  margin-bottom: 12px;
  letter-spacing: 4px;
}
.about-left .badge::after {
  content: "";
  display: block;
  position: absolute;
  width: 30px; height: 30px;
  background: var(--c-blue);
  border-radius: 50%;
  bottom: -10px; right: -10px;
}
.about-right { flex: 1; }
.about-right h4 {
  display: flex; align-items: center; gap: 24px;
  margin-bottom: 24px;
}
.about-right h4 span {
  font-size: 42px;
  color: var(--c-text-1);
  font-style: italic;
  font-weight: bold;
  letter-spacing: 2px;
}
.about-right h4 i {
  width: 46px; height: 4px;
  background: var(--c-text-4);
  display: inline-block;
}
.about-right .desc {
  font-size: var(--fs-15);
  color: var(--c-text-3);
  line-height: 1.95;
  margin-bottom: 28px;
}
.about-right .actions {
  display: flex; align-items: flex-start;
  gap: 24px;
}
.about-right .actions .left-cta {
  display: flex; flex-direction: column; gap: 16px;
  margin-top: 30px;
}
.about-right .actions .left-cta a {
  display: block; width: 220px; height: 46px;
  line-height: 46px; text-align: center;
  background: var(--c-blue);
  color: var(--c-yellow);
  font-size: 18px;
  border-radius: var(--r-md);
  font-weight: bold;
}
.about-right .actions .left-cta a:hover { background: var(--c-blue-2); }
.about-right .actions .zhibo {
  flex: 1; padding: 16px 20px;
  border-left: 2px solid var(--c-line-1);
  margin-top: 30px;
}
.about-right .actions .zhibo h5 {
  font-size: 20px; color: #233550;
  font-weight: normal; margin-bottom: 8px;
}
.about-right .actions .zhibo span {
  font-size: 14px; color: var(--c-blue-link); font-weight: bold;
}
.about-right .actions .qrcode {
  width: 130px; height: 130px;
  background: #fff;
  padding: 8px;
  border: 1px solid var(--c-line-1);
  position: relative;
  cursor: pointer;
}
.about-right .actions .qrcode img { width: 100%; }

/* 数据看板 */
.stats-row {
  margin-top: 70px;
  background: #fff;
  border-radius: var(--r-md);
  padding: 36px 20px;
  box-shadow: var(--sh-card);
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0;
  position: relative;
  z-index: 2;
}
.stats-row .stat {
  text-align: center;
  border-right: 1px solid var(--c-line-1);
  transition: all .3s;
  padding: 10px 0;
}
.stats-row .stat:last-child { border-right: 0; }
.stats-row .stat .num {
  font-family: var(--font-num);
  font-size: 48px;
  font-weight: bold;
  color: var(--c-text-1);
  line-height: 1;
  letter-spacing: -1px;
}
.stats-row .stat .num .unit {
  font-size: 18px;
  font-weight: normal;
  margin-left: 2px;
}
.stats-row .stat .lab {
  font-size: 15px;
  color: var(--c-text-1);
  margin-top: 12px;
}
.stats-row .stat:hover .num,
.stats-row .stat:hover .lab { color: var(--c-blue); }

/* ---------- 核心优势 ---------- */
.super-section { padding: 90px 0 100px; }
.super-grid { display: grid; grid-template-columns: 510px 670px; gap: 78px; align-items: stretch; }
.super-nav .item {
  padding: 20px 0;
  border-top: 1px solid var(--c-line-3);
  display: flex; gap: 14px;
  cursor: pointer;
  transition: all .3s;
}
.super-nav .item:first-child { border-top: 0; }
.super-nav .item .ic {
  flex: 0 0 34px; height: 36px;
  background: var(--c-blue);
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 2L4 5v6c0 5 3.5 9.5 8 11 4.5-1.5 8-6 8-11V5l-8-3z'/></svg>") center/contain no-repeat;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 2L4 5v6c0 5 3.5 9.5 8 11 4.5-1.5 8-6 8-11V5l-8-3z'/></svg>") center/contain no-repeat;
}
.super-nav .item h4 {
  font-size: 20px; color: var(--c-text-4);
  line-height: 36px; font-weight: bold;
  transition: color .3s;
}
.super-nav .item p {
  max-height: 0; overflow: hidden;
  font-size: 14px; color: var(--c-text-3);
  line-height: 1.8;
  transition: max-height .4s;
}
.super-nav .item.cur { padding: 32px 0; }
.super-nav .item.cur .ic { background: var(--c-blue); }
.super-nav .item.cur h4 { color: var(--c-text-1); }
.super-nav .item.cur p { max-height: 100px; }

.super-content {
  position: relative;
  height: 460px;
}
.super-slide {
  position: absolute; inset: 0;
  opacity: 0; pointer-events: none;
  transition: opacity .4s;
}
.super-slide.active { opacity: 1; pointer-events: auto; }
.super-slide .pic {
  width: 100%; height: 280px;
  border-radius: var(--r-sm);
  overflow: hidden;
  background: #f0f0f0;
}
.super-slide .pic svg { width: 100%; height: 100%; }
.super-slide .info {
  margin-top: 0;
  padding: 20px 30px;
  background: rgba(0,0,0,.7);
  display: flex; gap: 16px;
  position: absolute; left: 0; bottom: 0;
  width: 100%; box-sizing: border-box;
  color: #fff;
}
.super-slide .info .idx {
  font-family: var(--font-num);
  font-size: 60px; color: #fff;
  line-height: 1;
}
.super-slide .info .txt h4 {
  font-size: 22px; margin-bottom: 8px;
  color: #fff;
}
.super-slide .info .txt p {
  font-size: 14px; color: #fff; line-height: 1.7;
}

/* ---------- 8 大扶持 ---------- */
.zcbj-section {
  background: linear-gradient(180deg, #122488 0%, #1D2088 100%);
  padding: 80px 0;
  color: #fff;
}
.zcbj-section .section-head h2 { color: #fff; }
.zcbj-section .section-head em { color: rgba(255,255,255,.85); }
.zcbj-section .section-head i { background: #fff; }
.zcbj-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}
.zcbj-item {
  padding: 28px 24px;
  text-align: center;
  position: relative;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'><path fill='%23ffffff' fill-opacity='.04' d='M0 0h80v80h-80z M30 50l20-20 30 30-20 20z'/></svg>") right bottom no-repeat;
  background-size: 50%;
  border: 2px solid transparent;
  transition: all .3s;
}
.zcbj-item:nth-child(4n) { background: none; }
.zcbj-item .ic-big {
  width: 135px; height: 145px;
  margin: 0 auto 24px;
  display: flex; align-items: center; justify-content: center;
}
.zcbj-item .ic-big svg { width: 100%; height: 100%; }
.zcbj-item h4 {
  font-size: 22px; color: #fff; margin-bottom: 12px;
}
.zcbj-item p {
  font-size: 14px; color: #fff;
  line-height: 1.7;
  width: 88%; margin: 0 auto;
}
.zcbj-item:hover {
  background: rgba(46,73,200,.5);
  border: 2px solid rgba(120,140,228,.5);
  padding: 14px 10px 0;
  transform: translateY(-2px);
}
.zcbj-item:hover .ic-big { transform: scale(1.05); }

/* ---------- 加盟流程 / 条件 ---------- */
.jm-section { padding: 70px 0 90px; }
.jm-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
}
.jm-card {
  background: #fff;
  box-shadow: var(--sh-card);
  padding: 32px 50px 36px;
  border-radius: var(--r-sm);
  position: relative;
}
.jm-card h4 {
  font-size: 28px; color: var(--c-text-2);
  margin-bottom: 24px;
  text-align: center;
}
.jm-card .vid {
  width: 100%; height: 260px;
  border-radius: var(--r-sm);
  overflow: hidden;
  background: linear-gradient(135deg, #122488 0%, #2B6BBE 100%);
  margin-bottom: 24px;
}
.jm-card .vid svg { width: 100%; height: 100%; }
.jm-flow {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  padding-top: 8px;
}
.jm-flow li {
  text-align: center;
  position: relative;
  padding: 0 8px;
}
.jm-flow li::after {
  content: "";
  position: absolute;
  right: -16px; top: 22px;
  width: 32px; height: 1px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 1'><line x1='0' y1='0.5' x2='32' y2='0.5' stroke='%23224682' stroke-dasharray='3 2'/></svg>") repeat-x;
}
.jm-flow li:last-child::after { display: none; }
.jm-flow li i {
  display: inline-block;
  width: 43px; height: 49px;
  line-height: 49px;
  text-align: center;
  font-family: Arial;
  font-size: 16px; font-weight: bold;
  color: var(--c-blue-mid);
  background: #f0f3fa url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 43 49'><circle cx='21.5' cy='24.5' r='22' fill='%23122488'/></svg>") center/contain no-repeat;
}
.jm-flow li em {
  display: block;
  font-size: 14px; color: var(--c-text-2);
  font-weight: bold;
  line-height: 1.5;
  margin-top: 8px;
}
.jm-cond { padding-top: 16px; }
.jm-cond li {
  height: 38px; line-height: 38px;
  padding-left: 28px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='%23EEE300' stroke='%23122488' stroke-width='1.5' d='M2 8l3 3 9-9'/></svg>") left center/14px no-repeat;
  font-size: 15px; color: var(--c-text-2);
  font-weight: bold;
}
.jm-cta {
  text-align: center;
  margin-top: 40px;
}

/* ---------- 资质荣誉 ---------- */
.honor-section {
  background: linear-gradient(180deg, #f8f9fc 0%, #fff 100%);
  padding: 70px 0 80px;
}
.honor-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0 30px;
  margin-top: 60px;
}
.honor-grid li {
  font-size: 16px; color: #343434;
  padding-left: 32px;
  line-height: 2;
  display: flex; align-items: center; gap: 8px;
}
.honor-icon {
  width: 18px; height: 18px;
  display: inline-flex; flex-shrink: 0;
}
.honor-icon img { width: 100%; height: 100%; object-fit: contain; }

/* ---------- 客户见证 ---------- */
.case-section {
  background: var(--c-bg-2);
  padding: 70px 0 80px;
}
.case-slider { position: relative; }
.case-slide {
  display: none;
  grid-template-columns: 470px 1fr;
  gap: 30px;
  background: #fff;
  border-radius: var(--r-md);
  overflow: hidden;
}
.case-slide.active { display: grid; }
.case-slide .pic {
  height: 100%; min-height: 320px;
  background: linear-gradient(135deg, #122488 0%, #2B6BBE 100%);
}
.case-slide .pic svg { width: 100%; height: 100%; }
.case-slide .info {
  padding: 30px 40px;
}
.case-slide .info h4 {
  font-size: 22px;
  margin-bottom: 12px;
}
.case-slide .info h4 a { color: var(--c-text-2); }
.case-slide .info p {
  font-size: 14px; color: var(--c-text-3);
  line-height: 1.8;
  margin-bottom: 24px;
}
.case-slide .info .more {
  display: inline-block;
  padding-right: 36px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23333' d='M14.7 6.3l-1.4 1.4 4.3 4.3H4v2h13.6l-4.3 4.3 1.4 1.4L21 12z'/></svg>") right center/24px no-repeat;
  font-size: 16px; color: var(--c-text-2);
  font-weight: bold;
}
.case-slide.active .info .more { color: var(--c-blue-hover); background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%232B6BBE' d='M14.7 6.3l-1.4 1.4 4.3 4.3H4v2h13.6l-4.3 4.3 1.4 1.4L21 12z'/></svg>"); }
.case-arrow {
  position: absolute; top: 0; width: 50px; height: 100%;
  background: var(--c-bg-2);
  cursor: pointer; z-index: 5;
  display: flex; align-items: center; justify-content: center;
  color: var(--c-text-3); font-size: 24px;
}
.case-arrow.prev { left: 0; }
.case-arrow.next { right: 0; }

/* ---------- 新闻 ---------- */
.news-section {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><rect fill='%23f5f7fb' width='100' height='100'/><circle cx='80' cy='80' r='40' fill='%23fafafa'/></svg>") no-repeat;
  padding: 90px 0 80px;
}
.news-grid { display: grid; grid-template-columns: 530px 600px; gap: 30px; }
.news-block .head {
  display: flex; align-items: center; justify-content: space-between;
  height: 50px; margin-bottom: 16px;
  border-bottom: 2px solid var(--c-line-2);
}
.news-block .head h3 {
  font-size: 22px; color: var(--c-text-2);
  position: relative; padding-left: 20px;
}
.news-block .head h3::before {
  content: "";
  position: absolute; left: 0; top: 4px;
  width: 6px; height: 22px;
  background: var(--c-blue);
  border-radius: 3px;
}
.news-block .head .more { font-size: 13px; color: var(--c-text-4); }
.news-block .head .more:hover { color: var(--c-blue); }

.news-cover-card {
  background: #fff;
  border-radius: var(--r-md);
  overflow: hidden;
  box-shadow: var(--sh-card);
}
.news-cover-card .pic {
  height: 250px;
  background: linear-gradient(135deg, #122488 0%, #2B6BBE 100%);
  position: relative;
}
.news-cover-card .pic svg { width: 100%; height: 100%; }
.news-cover-card .pic .date {
  position: absolute; right: 0; bottom: 0;
  background: var(--c-red-info);
  color: #fff;
  width: 90px; height: 50px; line-height: 50px;
  text-align: center;
  font-family: var(--font-num);
  font-weight: bold;
}
.news-cover-card .info {
  padding: 24px 30px;
}
.news-cover-card .info h4 a {
  font-size: 18px; color: #000; font-weight: bold;
}
.news-cover-card .info p {
  font-size: 14px; color: var(--c-text-6);
  line-height: 1.7; margin-top: 12px;
}

.news-list-card {
  display: flex; gap: 16px;
  background: #fff;
  border-radius: var(--r-sm);
  margin-bottom: 14px;
  padding: 12px;
  transition: background .3s;
}
.news-list-card:hover { background: #fafafa; }
.news-list-card .pic {
  flex: 0 0 197px;
  height: 110px;
  background: linear-gradient(135deg, #122488 0%, #2B6BBE 100%);
  border-radius: var(--r-sm);
  overflow: hidden;
  position: relative;
}
.news-list-card .pic svg { width: 100%; height: 100%; }
.news-list-card .pic .date {
  position: absolute; right: 0; bottom: 0;
  background: var(--c-red-info);
  color: #fff;
  width: 80px; height: 30px; line-height: 30px;
  text-align: center;
  font-family: var(--font-num);
  font-size: 12px; font-weight: bold;
}
.news-list-card .info { flex: 1; padding-top: 6px; }
.news-list-card .info h4 a {
  font-size: 16px; color: var(--c-text-2);
  font-weight: normal;
}
.news-list-card .info p {
  font-size: 13px; color: var(--c-text-6);
  line-height: 1.6; margin-top: 6px;
}

.news-ul {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--c-line-2);
  margin-bottom: 14px;
}
.news-ul li {
  display: flex; justify-content: space-between; align-items: center;
  height: 30px; font-size: 14px;
}
.news-ul li em { color: var(--c-text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 20px; }
.news-ul li em a { color: var(--c-text-2); }
.news-ul li em a:hover { color: var(--c-blue); }
.news-ul li i { color: var(--c-text-3); font-size: 12px; }

.news-bot ul {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 6px 30px;
  margin-top: 12px;
}
.news-bot li {
  display: flex; align-items: center; gap: 6px;
  font-size: 14px; color: var(--c-text-2);
  height: 30px;
  white-space: nowrap; overflow: hidden;
}
.news-bot li::before {
  content: "›"; color: var(--c-blue); font-weight: bold;
}

/* ---------- 底部 CTA 表单 ---------- */
.bdbj {
  background: linear-gradient(135deg, rgba(18,36,136,.85) 0%, rgba(29,32,136,.85) 100%),
              url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><rect fill='%2307106b' width='100' height='100'/><g fill='%23ffffff' fill-opacity='.05'><circle cx='20' cy='20' r='2'/><circle cx='80' cy='80' r='3'/><circle cx='50' cy='50' r='2'/></g></svg>");
  background-size: cover, 200px;
  padding: 90px 0;
  position: relative;
}
.bd-wrap {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 80px;
  align-items: center;
}
.bd-left h4 span {
  display: block; font-size: 28px; color: #fff; font-weight: bold;
  line-height: 1.2;
}
.bd-left h4 em {
  display: block; font-size: 14px; color: rgba(255,255,255,.85);
  letter-spacing: 2px; margin: 4px 0 12px;
}
.bd-left h4 i {
  display: block; width: 68px; height: 1px; background: rgba(255,255,255,.5);
  margin-bottom: 24px;
}
.bd-left b {
  display: inline-block;
  font-size: 24px; color: #fff; font-weight: bold;
  padding-right: 56px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23FEF322' d='M14.7 6.3l-1.4 1.4 4.3 4.3H4v2h13.6l-4.3 4.3 1.4 1.4L21 12z'/></svg>") right center/40px no-repeat;
  line-height: 40px;
}
.form ul { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 9px; }
.form ul li {
  display: flex; align-items: center;
  height: 41px;
  background: rgba(255,255,255,.85);
  border: 1px solid #fff;
  padding: 0 12px;
}
.form ul li label {
  width: 80px; font-size: 14px; color: #000;
  text-align: center; flex-shrink: 0;
  border-right: 1px solid rgba(0,0,0,.08);
  padding-right: 10px;
}
.form ul li input,
.form ul li textarea {
  flex: 1; border: 0; background: transparent;
  font-size: 14px; color: #000; padding-left: 10px;
}
.form ul li textarea { resize: vertical; min-height: 60px; line-height: 1.6; }
.form .submit {
  height: 41px;
  position: relative;
}
.form .form-btn-submit {
  width: 100%; height: 41px;
  background: var(--c-yellow-2);
  color: var(--c-text-2);
  font-size: 16px; font-weight: bold;
  border: 0; cursor: pointer;
  transition: background .25s;
}
.form .form-btn-submit:hover { background: var(--c-yellow); }
.bd-tel {
  margin-top: 14px;
  padding-left: 60px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23FEF322' d='M20 15.5c-1.2 0-2.5-.2-3.6-.6-.3-.1-.7 0-1 .2l-2.2 2.2c-2.8-1.4-5.1-3.8-6.6-6.6l2.2-2.2c.3-.3.4-.7.2-1-.3-1.1-.5-2.4-.5-3.6 0-.5-.5-1-1-1H4c-.5 0-1 .5-1 1 0 8.8 7.2 16 16 16 .5 0 1-.5 1-1v-3.5c0-.5-.5-.9-1-.9z'/></svg>") left center/40px no-repeat;
}
.bd-tel span { display: block; font-size: 13px; color: rgba(255,255,255,.6); }
.bd-tel p { font-size: 28px; color: #fff; font-weight: bold; line-height: 1.4; }

/* ---------- 页脚 ---------- */
.footer { background: #1a1d2e; color: #c8cad4; padding-top: 50px; }
.foot-top { display: grid; grid-template-columns: repeat(4, 1fr) 1.3fr; gap: 30px; padding-bottom: 40px; }
.foot-col h5 { font-size: 16px; color: #fff; margin-bottom: 20px; position: relative; padding-left: 12px; }
.foot-col h5::before { content: ""; position: absolute; left: 0; top: 4px; width: 4px; height: 14px; background: var(--c-yellow); }
.foot-col a {
  display: block; font-size: 13px; color: #c8cad4;
  line-height: 2; transition: color .25s;
}
.foot-col a:hover { color: var(--c-yellow); }
.foot-contact p { font-size: 13px; line-height: 1.8; margin: 0 0 8px; }
.foot-contact p b { color: var(--c-yellow); font-size: 18px; font-weight: bold; }
.foot-bot { border-top: 1px solid rgba(255,255,255,.08); padding: 18px 0; text-align: center; }
.foot-bot p { font-size: 12px; color: #888a96; margin: 0; }

/* ---------- 列表页通用 ---------- */
.banner-inner {
  height: 240px;
  background: linear-gradient(135deg, #122488 0%, #1D2088 100%);
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  position: relative; overflow: hidden;
}
.banner-inner::before {
  content: "";
  position: absolute; inset: 0;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 80'><circle cx='20' cy='20' r='40' fill='%23ffffff' fill-opacity='.05'/><circle cx='180' cy='60' r='60' fill='%23ffffff' fill-opacity='.05'/></svg>") no-repeat;
  background-size: 100%;
  pointer-events: none;
}
.banner-inner h1,
.banner-inner .banner-title {
  font-size: 42px;
  text-align: center;
  position: relative;
  display: block;
  font-weight: 700;
}
.banner-inner .crumb {
  position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%);
  font-size: 13px;
}
.banner-inner .crumb a { color: rgba(255,255,255,.7); }
.banner-inner .crumb a:hover { color: #fff; }
.banner-inner .crumb span { color: var(--c-yellow); }

.page-pad { padding: 50px 0; }
.row-flex { display: flex; gap: 30px; }
.sidebar {
  flex: 0 0 220px;
}
.sidebar h4 {
  height: 60px; line-height: 60px;
  background: var(--c-blue); color: #fff;
  font-size: 18px; text-align: center;
}
.sidebar ul li a {
  display: block; padding: 14px 18px;
  font-size: 15px; color: var(--c-text-2);
  border-bottom: 1px solid var(--c-line-1);
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='%23122488' d='M6 4l4 4-4 4z'/></svg>") 180px center/12px no-repeat;
  transition: all .25s;
}
.sidebar ul li a:hover,
.sidebar ul li.cur a {
  background-color: var(--c-bg-3);
  background-position: 165px center;
  color: var(--c-blue);
  padding-left: 24px;
}
.main-col { flex: 1; min-width: 0; }
.cat-tabs {
  display: flex; gap: 12px;
  margin-bottom: 24px;
  border-bottom: 2px solid var(--c-line-2);
}
.cat-tabs a {
  padding: 10px 20px;
  font-size: 14px; color: var(--c-text-3);
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
}
.cat-tabs a.cur {
  color: var(--c-blue);
  border-bottom-color: var(--c-blue);
  font-weight: bold;
}
.product-grid-list {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.product-grid-list .product-card .pc-cover { aspect-ratio: 280/200; }
.pagination {
  display: flex; justify-content: center; gap: 6px;
  margin-top: 40px;
}
.pagination a {
  min-width: 36px; height: 36px; line-height: 36px;
  text-align: center; border: 1px solid var(--c-line-2);
  font-size: 13px;
}
.pagination a:hover, .pagination a.cur {
  background: var(--c-blue); color: #fff; border-color: var(--c-blue);
}

/* ---------- 文章详情 ---------- */
.article-detail {
  background: #fff;
  padding: 40px;
  border-radius: var(--r-sm);
  box-shadow: var(--sh-card);
}
.article-detail h1 {
  font-size: 28px; color: var(--c-text-1);
  text-align: center;
  margin-bottom: 18px;
}
.article-detail .meta {
  text-align: center; color: var(--c-text-5);
  font-size: 13px; margin-bottom: 30px;
  border-bottom: 1px dashed var(--c-line-1);
  padding-bottom: 16px;
}
.article-detail .content {
  font-size: 15px; line-height: 2;
  color: var(--c-text-2);
}
.article-detail .content p {
  margin: 0 0 16px;
}

/* ---------- 表单页 ---------- */
.contact-form-wrap {
  background: #fff;
  padding: 60px;
  border-radius: var(--r-md);
  box-shadow: var(--sh-card);
  max-width: 720px;
  margin: 0 auto;
}
.contact-form-wrap h2 {
  font-size: 32px; text-align: center;
  margin-bottom: 12px;
}
.contact-form-wrap .sub {
  text-align: center; color: var(--c-text-3);
  font-size: 15px; margin-bottom: 36px;
}
.contact-form-wrap form {
  display: grid; gap: 18px;
}
.contact-form-wrap .row {
  display: grid; grid-template-columns: 100px 1fr;
  align-items: center; gap: 16px;
}
.contact-form-wrap .row label { font-size: 15px; color: var(--c-text-2); }
.contact-form-wrap .row label::after { content: " *"; color: #e22; }
.contact-form-wrap .row.no-req label::after { content: ""; }
.contact-form-wrap .row input,
.contact-form-wrap .row textarea {
  height: 44px; padding: 0 14px;
  border: 1px solid var(--c-line-1);
  font-size: 15px;
  background: #fafafa;
  transition: border-color .25s;
}
.contact-form-wrap .row input:focus,
.contact-form-wrap .row textarea:focus {
  border-color: var(--c-blue); background: #fff;
}
.contact-form-wrap .row textarea { height: 120px; padding: 12px 14px; resize: vertical; }
.contact-form-wrap button {
  width: 200px; height: 50px;
  background: var(--c-blue);
  color: #fff; border: 0; cursor: pointer;
  font-size: 16px; font-weight: bold;
  margin: 8px auto 0;
  border-radius: var(--r-md);
  transition: background .25s;
}
.contact-form-wrap button:hover { background: var(--c-blue-2); }

/* ---------- 后台 ---------- */
.admin-layout { display: flex; min-height: 100vh; background: var(--c-bg-2); }
.admin-side {
  flex: 0 0 220px;
  background: var(--c-blue-2);
  color: #fff;
  padding: 20px 0;
}
.admin-side .brand {
  font-size: 18px; font-weight: bold;
  text-align: center; padding: 0 20px 24px;
  border-bottom: 1px solid rgba(255,255,255,.1);
  margin-bottom: 14px;
}
.admin-side .brand .badge { color: var(--c-yellow); }
.admin-side ul li a {
  display: block; padding: 12px 24px;
  color: rgba(255,255,255,.8);
  border-left: 3px solid transparent;
}
.admin-side ul li a:hover,
.admin-side ul li.cur a {
  background: rgba(0,0,0,.15);
  color: #fff;
  border-left-color: var(--c-yellow);
}
.admin-main { flex: 1; padding: 20px 24px; }
.admin-top {
  background: #fff; padding: 14px 20px;
  border-radius: var(--r-sm);
  margin-bottom: 20px;
  display: flex; justify-content: space-between; align-items: center;
}
.admin-top h2 { font-size: 18px; color: var(--c-text-2); }
.admin-top .user { color: var(--c-text-3); font-size: 14px; }
.admin-top .user b { color: var(--c-blue); margin-right: 8px; }
.admin-card {
  background: #fff; border-radius: var(--r-sm);
  padding: 20px; box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.admin-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.admin-table th, .admin-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--c-line-1);
  text-align: left;
}
.admin-table th { background: var(--c-bg-3); color: var(--c-text-2); font-weight: bold; }
.admin-table .actions a {
  margin-right: 8px; color: var(--c-blue);
}
.admin-table .actions .del { color: #e22; }
.admin-stat-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 16px; margin-bottom: 24px;
}
.admin-stat {
  background: #fff; padding: 20px;
  border-radius: var(--r-sm);
  display: flex; justify-content: space-between; align-items: center;
}
.admin-stat .lab { color: var(--c-text-3); font-size: 14px; }
.admin-stat .num { font-family: var(--font-num); font-size: 30px; color: var(--c-blue); font-weight: bold; }
.admin-stat .ic {
  width: 50px; height: 50px;
  background: var(--c-blue);
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M3 13h8V3H3v10zm0 8h8v-6H3v6zm10 0h8V11h-8v10zm0-18v6h8V3h-8z'/></svg>") center/contain no-repeat;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M3 13h8V3H3v10zm0 8h8v-6H3v6zm10 0h8V11h-8v10zm0-18v6h8V3h-8z'/></svg>") center/contain no-repeat;
  opacity: .2;
}

/* 登录 */
.login-page {
  min-height: 100vh;
  background: linear-gradient(135deg, #122488 0%, #1D2088 100%);
  display: flex; align-items: center; justify-content: center;
}
.login-card {
  background: #fff;
  width: 380px;
  padding: 40px;
  box-shadow: 0 20px 60px rgba(0,0,0,.3);
  border-radius: var(--r-md);
}
.login-card h2 { text-align: center; font-size: 24px; color: var(--c-blue); margin-bottom: 8px; }
.login-card .sub { text-align: center; color: var(--c-text-5); font-size: 13px; margin-bottom: 30px; }
.login-card .form-row { margin-bottom: 16px; }
.login-card .form-row input {
  width: 100%; height: 44px;
  border: 1px solid var(--c-line-1);
  background: #fafafa;
  padding: 0 14px;
  font-size: 15px;
}
.login-card .form-row input:focus { border-color: var(--c-blue); background: #fff; }
.login-card button {
  width: 100%; height: 46px;
  background: var(--c-blue);
  color: #fff; border: 0; cursor: pointer;
  font-size: 16px; font-weight: bold;
  border-radius: var(--r-sm);
}
.login-card button:hover { background: var(--c-blue-2); }
.login-card .err { color: #e22; font-size: 13px; text-align: center; margin-bottom: 12px; display: none; }
.login-card .err.show { display: block; }

/* ---------- Toast ---------- */
.toast {
  position: fixed; top: 30px; left: 50%;
  transform: translateX(-50%) translateY(-20px);
  padding: 12px 24px;
  background: rgba(0,0,0,.85); color: #fff;
  font-size: 14px;
  border-radius: var(--r-md);
  opacity: 0; pointer-events: none;
  transition: all .3s;
  z-index: 9999;
  max-width: 480px;
}
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.toast.ok { background: #1a8a3a; }
.toast.err { background: #c0392b; }

/* ---------- 入场动画 ---------- */
.fade-up {
  opacity: 0; transform: translateY(30px);
  transition: opacity .8s, transform .8s;
}
.fade-up.in {
  opacity: 1; transform: translateY(0);
}

/* ---------- 响应式 ---------- */
@media (max-width: 1280px) {
  .content { width: 96%; }
  .about-left { flex-basis: 380px; }
  .about-left .badge { right: -60px; }
  .super-grid { grid-template-columns: 380px 1fr; gap: 30px; }
}
@media (max-width: 980px) {
  .about-top { flex-direction: column; }
  .about-left { flex: 1 1 auto; width: 100%; max-width: 460px; margin: 0 auto; }
  .about-left .badge { display: none; }
  .stats-row { grid-template-columns: repeat(3, 1fr); }
  .product-grid { grid-template-columns: repeat(2, 1fr); }
  .super-grid { grid-template-columns: 1fr; }
  .jm-grid { grid-template-columns: 1fr; }
  .zcbj-grid { grid-template-columns: repeat(2, 1fr); }
  .news-grid { grid-template-columns: 1fr; }
  .bd-wrap { grid-template-columns: 1fr; }
  .foot-top { grid-template-columns: repeat(2, 1fr); }
  .head { flex-direction: column; height: auto; padding: 16px 0; gap: 16px; }
  .menu ul { overflow-x: auto; }
  .hero { height: 380px; }
  .hero .slide-1 .slide-content h2 { font-size: 32px; }
  .row-flex { flex-direction: column; }
  .sidebar { flex: 1 1 auto; width: 100%; }
}
@media (max-width: 640px) {
  .stats-row { grid-template-columns: repeat(2, 1fr); }
  .product-grid { grid-template-columns: 1fr; }
  .zcbj-grid { grid-template-columns: 1fr; }
  .jm-flow { grid-template-columns: repeat(2, 1fr); }
  .foot-top { grid-template-columns: 1fr; }
  .form ul { grid-template-columns: 1fr; }
  .section-head h2 { font-size: 32px; }
}