/* ============================================================
   九州莲创广告官网  PC 端主题样式
   主色：企业深蓝 #0F4C81   辅色：金 #C9A24B / 浅蓝 #E8F0F7
   说明：1:1 复刻老站栏目层级与模块；悬浮工具栏由 float-tool.js 注入
   ============================================================ */
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  color: #333; background: #fff; line-height: 1.7; font-size: 14px;
}
a { color: #0F4C81; text-decoration: none; }
a:hover { color: #C9A24B; }
img { max-width: 100%; display: block; }
.container { width: 1200px; margin: 0 auto; }
.clear { clear: both; }
.section { padding: 50px 0; }
.section-title { text-align: center; margin-bottom: 36px; }
.section-title h2 { font-size: 30px; color: #0F4C81; letter-spacing: 2px; }
.section-title h2::after {
  content: ""; display: block; width: 60px; height: 3px;
  background: #C9A24B; margin: 14px auto 0;
}
.section-title p { color: #999; margin-top: 10px; }

/* ---------- 顶部条 ---------- */
.topbar { background: #0F4C81; color: #fff; font-size: 15px; }
.topbar .container { display: flex; justify-content: space-between; align-items: center; height: 44px; }
.topbar a { color: #cfe2f3; }
.topbar .hot { color: #ffd9a0; font-weight: bold; font-size: 16px; }

/* ---------- 头部 LOGO + 导航 ---------- */
.header { background: #fff; border-bottom: 1px solid #eee; position: sticky; top: 0; z-index: 100; transition: box-shadow .2s; }
.header.scrolled { box-shadow: 0 4px 16px rgba(0,0,0,.10); }

/* 滚动揭示动画（模仿参考站 data-move-y 动态效果） */
.reveal { opacity: 0; transform: translateY(30px); transition: opacity .7s ease, transform .7s ease; }
.reveal.in { opacity: 1; transform: none; }

/* 移动端汉堡按钮 */
.nav-toggle { display: none; background: #f6f8fb; border: 1px solid rgba(16,36,59,.14); font-size: 0; line-height: 1; color: #10243b; cursor: pointer; padding: 9px; margin-left: auto; border-radius: 6px; width: 40px; height: 38px; box-sizing: border-box; }
.header .container { display: flex; align-items: center; height: 88px; }
.logo { display: flex; align-items: center; flex-shrink: 0; }
.logo img { display: block; height: 64px; width: auto; max-width: 260px; object-fit: contain; }
.logo .mark {
  width: 46px; height: 46px; border-radius: 50%;
  background: #0F4C81; color: #fff; font-size: 22px; font-weight: bold;
  display: flex; align-items: center; justify-content: center; margin-right: 12px;
}
.logo .name { font-size: 22px; font-weight: bold; color: #0F4C81; line-height: 1.2; }
.logo .sub { font-size: 12px; color: #888; }
.nav { margin-left: 0; }
.nav > ul { list-style: none; display: flex; }
.nav > ul > li { position: relative; }
.nav > ul > li > a {
  display: block; padding: 0 18px; height: 88px; line-height: 88px;
  color: #333; font-size: 16px; white-space: nowrap;
}
.nav > ul > li:hover > a, .nav > ul > li.active > a { color: #0F4C81; border-bottom: 3px solid #C9A24B; }
.nav .dropdown { display: none; position: absolute; top: 88px; left: 0; background: #fff;
  box-shadow: 0 4px 16px rgba(0,0,0,.12); min-width: 200px; z-index: 500; }
.nav > ul > li:hover .dropdown { display: block; }
.nav .dropdown a { display: block; padding: 12px 18px; border-bottom: 1px solid #f0f0f0; color: #555; }
.nav .dropdown a:hover { background: #f5f9fd; color: #0F4C81; }

/* ---------- 轮播 ---------- */
.banner { position: relative; height: 420px; overflow: hidden; background: #0F4C81; }
.banner-badge { position: absolute; top: 22px; left: 50%; transform: translateX(-50%); z-index: 10; background: rgba(255,255,255,0.95); padding: 10px 28px; border-radius: 10px; box-shadow: 0 6px 18px rgba(0,0,0,.12); }
.banner-badge img { display: block; height: 84px; width: auto; max-width: 240px; object-fit: contain; }
.banner .slide { position: absolute; inset: 0; display: none; align-items: center; justify-content: center;
  color: #fff; text-align: center; }
.banner .slide.active { display: flex; }
.banner .slide h1 { font-size: 44px; letter-spacing: 4px; }
.banner .slide p { font-size: 18px; margin-top: 16px; color: #d8e6f5; }
.banner .dots { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; }
.banner .dots span { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.5); cursor: pointer; }
.banner .dots span.on { background: #C9A24B; }
.b1 { background: url(/images/banner-jzl-1.jpg?v=20261006t50) center/cover; }
.b2 { background: url(/images/banner-jzl-2.jpg?v=20261006t50) center/cover; }
.b3 { background: url(/images/banner-jzl-3.jpg?v=20261006t50) center/cover; }

/* ---------- 卡片网格 ---------- */
.grid { display: grid; gap: 24px; }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
.card { background: #fff; border: 1px solid #eee; border-radius: 6px; overflow: hidden; transition: .2s; }
.card:hover { box-shadow: 0 6px 20px rgba(15,76,129,.15); transform: translateY(-3px); }
.card .pic { height: 200px; background: #e8f0f7 center/cover no-repeat; overflow: hidden; }
.card .pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.card .body { padding: 16px; }
.card .body h3 { font-size: 17px; color: #0F4C81; margin-bottom: 8px; }
.card .body p { color: #777; font-size: 13px; }
.card-link{display:block;color:inherit;text-decoration:none}
.card-link:hover{color:inherit}
.card .more-link{display:inline-block;margin-top:10px;color:#0F4C81;font-weight:600;font-size:13px}

/* ---------- 数据统计 ---------- */
.stats { background: #0F4C81; color: #fff; }
.stats .container { display: flex; justify-content: space-around; text-align: center; }
.stat .num { font-size: 40px; font-weight: bold; color: #C9A24B; }
.stat .lab { font-size: 15px; margin-top: 6px; color: #cfe2f3; }

/* ---------- 企业优势 ---------- */
.adv-item { display: flex; gap: 16px; align-items: flex-start; padding: 18px; border: 1px solid #eee; border-radius: 6px; }
.adv-item .ico { width: 48px; height: 48px; border-radius: 50%; background: #E8F0F7; color: #0F4C81;
  display: flex; align-items: center; justify-content: center; font-size: 22px; flex: 0 0 auto; }
.adv-item h3 { color: #0F4C81; margin-bottom: 6px; }

/* ---------- 新闻列表 ---------- */
.news-item { display: flex; gap: 16px; padding: 16px 0; border-bottom: 1px dashed #eee; }
.news-item .date { flex: 0 0 70px; text-align: center; color: #C9A24B; }
.news-item .date b { font-size: 26px; display: block; }
.news-item h3 { font-size: 16px; }
.news-item p { color: #888; font-size: 13px; margin-top: 4px; }

/* ---------- 客户墙 ---------- */
.clients { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.clients .c { height: 90px; background: #f5f9fd; border: 1px solid #eee; border-radius: 6px;
  display: flex; align-items: center; justify-content: center; color: #0F4C81; font-weight: bold; }

/* ---------- 底部留言 ---------- */
.footer-msg { background: #f6f9fd; padding: 50px 0; }
.footer-msg .section-title h2 { color: #0F4C81; }
.footer-msg .form-row input, .footer-msg .form-row textarea { background: #fff; }

/* ---------- 底部 ---------- */
.footer { background: #0c3a63; color: #b9cde0; margin-top: 0; }
.footer .container { display: flex; gap: 40px; padding: 40px 0; flex-wrap: wrap; }
.footer .col { flex: 1; min-width: 220px; }
.footer h4 { color: #fff; margin-bottom: 14px; font-size: 16px; }
.footer p { margin: 6px 0; font-size: 13px; }
.footer .copy { text-align: center; padding: 16px 0; border-top: 1px solid #16456f; font-size: 13px; color: #8fb0cf; }

/* ---------- 联系表单 ---------- */
.form-row { margin-bottom: 14px; }
.form-row input, .form-row textarea {
  width: 100%; padding: 10px 12px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px;
}
.btn {
  display: inline-block; padding: 11px 30px; background: #0F4C81; color: #fff;
  border: none; border-radius: 4px; cursor: pointer; font-size: 15px;
}
.btn:hover { background: #0c3a63; }
.btn-gold { background: #C9A24B; }
.btn-gold:hover { background: #b8902f; }

/* ---------- 服务详情页 ---------- */
.service-detail{padding-top:30px;padding-bottom:60px}
.service-detail .detail-header{text-align:left;margin-bottom:30px}
.service-detail .detail-header h2{font-size:32px;color:#0F4C81;letter-spacing:2px;margin-bottom:10px}
.service-detail .detail-header h2::after{content:"";display:block;width:60px;height:3px;background:#C9A24B;margin:14px 0 0}
.service-detail .detail-header p{color:#999;font-size:15px}
.service-detail-layout{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.service-detail-layout .detail-media{background:#f5f9fd;border-radius:8px;padding:20px;text-align:center}
.service-detail-layout .detail-media img{max-width:100%;height:auto;display:block;margin:0 auto}
.service-detail-layout .detail-body h3{color:#0F4C81;font-size:20px;margin-bottom:14px}
.service-detail-layout .detail-body p{color:#555;line-height:2;margin-bottom:14px}
.service-detail-layout .detail-body h4{color:#0F4C81;font-size:17px;margin:20px 0 12px}
.service-detail-layout .detail-body ul{list-style:none;color:#555;line-height:2;padding-left:0}
.service-detail-layout .detail-body li{position:relative;padding-left:18px}
.service-detail-layout .detail-body li::before{content:"";position:absolute;left:0;top:11px;width:7px;height:7px;border-radius:50%;background:#C9A24B}
.service-detail-actions{margin-top:30px;display:flex;gap:12px;flex-wrap:wrap}
@media (max-width:900px){
  .service-detail-layout{grid-template-columns:1fr;gap:24px}
  .service-detail .detail-header h2{font-size:26px}
}

/* ---------- 响应式 ---------- */
@media (max-width: 1200px) {
  .container { width: 100%; padding: 0 14px; }
  .nav-toggle { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 5px; }
  .nav { position: absolute; top: 100%; left: 0; right: 0; background: #fff; display: none; box-shadow: 0 8px 24px rgba(0,0,0,.12); }
  .nav.open { display: block; }
  .nav > ul { flex-direction: column; width: 100%; }
  .nav > ul > li { width: 100%; border-top: 1px solid #f0f0f0; }
  .nav > ul > li > a { padding: 14px 18px; height: auto; line-height: 1.4; }
  .nav .dropdown { position: static; box-shadow: none; display: none; padding: 0 0 8px; }
  .nav > ul > li.open > .dropdown { display: block; }
  .nav .dropdown a { padding: 8px 30px; font-size: 14px; }
  .header .container { height: 64px; justify-content: space-between; }
  .logo .name { font-size: 18px; }
  .banner { height: 240px; }
  .banner .slide h1 { font-size: 28px; }
  .grid-3, .grid-4 { grid-template-columns: 1fr 1fr; }
  .stats .container { flex-wrap: wrap; gap: 20px; }
  .clients { grid-template-columns: repeat(3, 1fr); }
  .section { padding: 30px 0; }
}

/* logo 增强(2026-08-17 by WorkBuddy):横版 logo + 业务副名 */
.logo{display:inline-flex;align-items:center;gap:14px;color:inherit;text-decoration:none;font-weight:normal}
.logo .logo-img{display:inline-flex;align-items:center;line-height:1}
.logo .logo-img img{display:block;height:64px;width:auto;max-width:320px}
.logo .logo-sub{font-size:12px;letter-spacing:.5px;border-left:1px solid rgba(127,127,127,.35);padding:2px 0 2px 14px;opacity:.78;line-height:1.4;white-space:nowrap;color:inherit}
.logo:visited{color:inherit}
/* 08 集团站 logo 略大 */
.logo .logo-img img[alt="九州莲创"]{height:70px}
@media (max-width:640px){
  .logo .logo-img img{height:52px}
  .logo .logo-sub{font-size:11px;border-left:none;padding-left:0;margin-top:2px}
  .logo{flex-direction:row}
}

/* ===== 头部统一放大（名称/电话/LOGO） ===== */
.topbar{font-size:15px !important}
.topbar .hot{font-size:19px !important;font-weight:bold !important}
.logo .name,.logo{font-size:27px !important;font-weight:bold !important}
.logo img,.header img.logo{max-height:78px !important;width:auto !important}
.nav>ul>li>a,.nav ul li a,.nav a{font-size:17px !important}

/* 文化传承 / 集团理念 卡片 */
.card.idea{text-align:center;padding:30px 22px}
.card.idea .idea-no{font-size:34px;font-weight:bold;color:#0F4C81;font-family:Arial,sans-serif;margin-bottom:8px;line-height:1}
.card.idea h3{font-size:19px;color:#0F4C81;margin-bottom:10px}
.card.idea p{font-size:14px;line-height:1.9;color:#555}

/* ===== 页面入场跳转(2026-09-02 三站统一) ===== */
html.is-loading body{opacity:0}
@keyframes page-in-bottom { from{transform:translateY(100%);opacity:0} to{transform:translateY(0);opacity:1} }
@keyframes page-in-top    { from{transform:translateY(-100%);opacity:0} to{transform:translateY(0);opacity:1} }
@keyframes page-in-left   { from{transform:translateX(-100%);opacity:0} to{transform:translateX(0);opacity:1} }
@keyframes page-in-right  { from{transform:translateX(100%);opacity:0} to{transform:translateX(0);opacity:1} }
.page-enter-bottom{animation:page-in-bottom .72s cubic-bezier(.16,1,.3,1) both}
.page-enter-top   {animation:page-in-top    .72s cubic-bezier(.16,1,.3,1) both}
.page-enter-left  {animation:page-in-left   .72s cubic-bezier(.16,1,.3,1) both}
.page-enter-right {animation:page-in-right  .72s cubic-bezier(.16,1,.3,1) both}
/* 兼容老浏览器 */
@media (prefers-reduced-motion: reduce){
  html.is-loading body{opacity:1}
  .page-enter-bottom,.page-enter-top,.page-enter-left,.page-enter-right{animation:none}
}

/* 联系我们下拉：线下网点 / 合伙人加入（通用，容器无关） */
li.has-dropdown{position:relative}
li.has-dropdown>a .caret{font-size:10px;margin-left:3px;opacity:.75}
li.has-dropdown>.dropdown{position:absolute;top:100%;left:0;min-width:185px;margin:0;padding:6px 0;list-style:none;background:#fff;border:1px solid #e7ecf2;box-shadow:0 8px 22px rgba(16,36,59,.14);z-index:1000;display:block;opacity:0;visibility:hidden;transition:.18s}
li.has-dropdown:hover>.dropdown{opacity:1;visibility:visible}
li.has-dropdown>.dropdown li{list-style:none}
li.has-dropdown>.dropdown li a{display:block;padding:10px 20px;white-space:nowrap;color:#10243b;font-size:14px}
li.has-dropdown>.dropdown li a:hover{background:#f5f9fd}

/* ===== 移动端底部栏 + 微信二维码弹窗（全站统一，配合 group-footer.js） ===== */
.mobile-bottom-bar{position:fixed;left:0;bottom:0;width:100%;display:none;align-items:center;justify-content:space-around;background:#10243b;z-index:100;box-shadow:0 -2px 10px rgba(0,0,0,.15)}
.mobile-bottom-bar .mb-item{flex:1;display:flex;flex-direction:column;align-items:center;padding:8px 0;color:#fff;text-decoration:none;font-size:12px}
.mobile-bottom-bar .mb-item span{font-size:18px;margin-bottom:2px}
@media(max-width:768px){.mobile-bottom-bar{display:flex}body{padding-bottom:56px}}
.wx-modal{position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:200;display:flex;align-items:center;justify-content:center;padding:16px}
.wx-modal-box{position:relative;background:#fff;border-radius:14px;padding:24px;text-align:center;max-width:300px;width:100%}
.wx-modal-box img{width:auto;height:auto;max-width:min(80vw,240px);max-height:60vh;object-fit:contain;border-radius:10px;display:block;margin:0 auto;background:#fff}
.wx-modal-box p{margin:10px 0 0;font-size:15px;color:#10243b;font-weight:600}
.wx-modal-close{position:absolute;top:8px;right:12px;font-size:24px;color:#999;cursor:pointer;line-height:1}
/* ===== 总部(09 集团总部)导航配色统一覆盖 2026-09-11 =====
   目标: 所有站点导航统一为 总部配色 —— 浅白底(#fff) + 深字(#10243b) + 浅金强调 rgba(201,162,75,.14)
   类目(菜单项)保持各站原样不变，仅改配色。 */
/* 1) 导航条容器: 浅白底 */
.nav, .navbar, .navbar-default, .navbr, .header_nav, .top_nav, #nav, #top_nav{background:#fff !important;}
.nav ul, .navbar-nav, .navbr ul, .header_nav ul, #nav ul{background:#fff !important;}
/* 2) 导航文字: 深字 + 透明底 */
.nav ul li a, .nav a,
.navbar-nav > li > a, .navbar-default .navbar-nav > li > a,
.navbr a, .header_nav a, #nav a, #nav ul li a,
.son-nav a, .left-nav a{
  color:#10243b !important; opacity:1 !important; background:transparent !important;
}
/* 3) 当前项/悬停: 浅金底 + 深字 */
.nav ul li a.cur, .nav ul li a:hover, .nav ul li.active > a, .nav ul li.active a,
.navbar-nav > li.active > a, .navbar-default .navbar-nav > .active > a, .navbar-nav > li > a:hover, .navbar-nav > li > a:focus,
.navbr a.cur, .navbr a:hover, .navbr li.active > a,
.header_nav a.cur, .header_nav a:hover, .header_nav li.active > a,
#nav a.cur, #nav a:hover, #nav li.active > a,
.son-nav a.cur, .son-nav a:hover, .left-nav a.cur, .left-nav a:hover, .left-nav li.active > a{
  background:rgba(201,162,75,.14) !important; color:#10243b !important;
}
/* 4) 下拉菜单: 白底深字 + 浅金悬停 */
.dropdown, .dropdown-menu, .nav_small, .navbar-nav .dropdown-menu, .navbar-nav .open .dropdown-menu{
  background:#fff !important; border:1px solid #e7ecf2 !important; box-shadow:0 8px 22px rgba(16,36,59,.14) !important;
}
.dropdown a, .dropdown li a, .dropdown-menu li a, .nav_small li a, .navbar-nav .dropdown-menu > li > a{
  color:#10243b !important; background:transparent !important;
}
.dropdown a:hover, .dropdown li a:hover, .dropdown a.cur, .dropdown li a.cur,
.dropdown-menu > li > a:hover, .dropdown-menu > .active > a, .nav_small li a:hover, .nav_small li a.cur,
.navbar-nav .dropdown-menu > li > a:hover{
  background:rgba(201,162,75,.14) !important; color:#10243b !important;
}
/* 5) 箭头 / 汉堡按钮 与总部一致 */
.caret{color:#10243b !important;}
.nav-toggle span, .navbar-toggle .icon-bar, .navbar-toggle .icon-bar{background:#10243b !important;}
.nav-toggle span{display:block;width:20px;height:2px;background:#10243b;border-radius:1px}
/* 6) 移动端: 白底面板深字 */
@media (max-width:900px){
  .nav > ul, .navbar-collapse, .navbar-collapse.in, .navbr ul, .header_nav ul, #nav ul{background:#fff !important;}
  .nav ul li a, .navbar-nav > li > a, .navbr a, .header_nav a, #nav a{color:#10243b !important; background:transparent !important;}
  .nav ul li a.cur, .nav ul li a:hover, .navbar-nav > li > a:hover, .navbar-nav > .active > a,
  .navbr a.cur, .header_nav a.cur, #nav a.cur{background:rgba(201,162,75,.14) !important;}
  .dropdown, .dropdown-menu, .nav_small{background:#f6f8fb !important; border:none !important;}
}

/* T21 20260921: 手机端 banner 徽标不再叠加 hero 文字 */
@media (max-width:640px){
  .banner-badge{position:static;transform:none;margin:0 auto 14px;padding:8px 18px;width:max-content;}
  .banner-badge img{height:60px;max-width:200px;}
}

/* === 九州莲创统一品牌字(20260925) === */
.logo.logo-stack{display:flex;flex-direction:column;align-items:center;text-decoration:none}
.logo-sub.jzl-brand{display:flex;flex-direction:column;justify-content:center;line-height:1.18;margin-top:6px;font-size:13px;font-weight:700;white-space:nowrap;letter-spacing:1px;color:#10243b}
.nav li.has-dropdown>.dropdown li a{display:block}

/* HDR6 页头规范+宽度统一 20260927 */
/* 1) 全站内容宽度统一 1200px 左右居中 */
.container,.wrap,.header-box,.page-con{width:100% !important;max-width:100% !important;margin-left:auto !important;margin-right:auto !important;box-sizing:border-box !important}
.banner .wrap{max-width:1200px !important}
/* T52 20261019 满屏自适应：大屏(≥1280)贴边留 24-56px 呼吸空间，移动端保持原 16px */
@media(min-width:1280px){.container,.wrap,.header-box,.page-con{padding-left:clamp(24px,2.6vw,56px) !important;padding-right:clamp(24px,2.6vw,56px) !important}}
.topbar>.container,.topbar .container{max-width:1200px !important}
/* 2) LOGO 下去掉品牌字/标语 */
.logo .logo-sub,.logo-sub.jzl-brand{display:none !important}
/* 3) LOGO 正常比例、完整显示(不裁切不拉伸) */
.logo,.logo.logo-stack{display:flex !important;flex-direction:row !important;align-items:center !important;justify-content:flex-start !important;flex-shrink:0 !important;gap:0 !important;overflow:visible !important}
.logo img,.header img.logo,.logo-img img,img.logo{display:block !important;height:auto !important;width:auto !important;max-height:64px !important;max-width:280px !important;object-fit:contain !important}
/* 4) 白色导航行上下居中、高度足够 */
header.top>.wrap,header.header>.container,.header-box{align-items:center !important;min-height:76px !important;height:auto !important;padding-top:8px !important;padding-bottom:8px !important}

.page-banner{background:linear-gradient(135deg,#0F4C81,#1B6FB5);background-color:#0F4C81;color:#fff;height:420px;display:flex;align-items:center;justify-content:center;text-align:center}
.page-banner h1{font-size:30px;margin:0 0 10px;font-weight:700;letter-spacing:2px}
.page-banner p{margin:0;color:#cfe2f3;font-size:15px}
@media(max-width:768px){.page-banner{height:240px}.page-banner h1{font-size:23px}}

/* 2026-10-07 首页幻灯 3 屏均为「文字版」（b1/b2/b3 各带 h1/p），原 .b1/.b2/.b3 背景为烤字设计图，
   与文字叠加重叠；去掉背景图，改由 .banner 品牌蓝底色承载文字 (站:www.322881.com) */
.banner .slide{background-image:none !important}