/* roulang page: index */
:root {
  --ky-primary: #0E7C73;
  --ky-primary-deep: #0B5D58;
  --ky-secondary: #E89A2B;
  --ky-secondary-hover: #D98B1E;
  --ky-bg: #F7F7F2;
  --ky-card-bg: #FFFFFF;
  --ky-text: #1E2B2E;
  --ky-text-weak: #6B777A;
  --ky-border: #DDE3E1;
  --ky-radius: 12px;
  --ky-radius-lg: 16px;
  --ky-shadow: 0 1px 2px rgba(20,45,48,.06), 0 4px 12px rgba(20,45,48,.05);
  --ky-shadow-hover: 0 6px 18px rgba(20,45,48,.10);
  --ky-trans: all .25s ease;
  --ky-space-xl: 96px;
  --ky-space-lg: 72px;
  --ky-space-md: 48px;
  --ky-space-sm: 28px;
  --ky-font: "PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","Inter",sans-serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--ky-font);
  background-color: var(--ky-bg);
  color: var(--ky-text);
  font-size: 16px;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--ky-primary); text-decoration: none; transition: var(--ky-trans); }
a:hover { color: var(--ky-primary-deep); text-decoration: underline; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 3px solid rgba(232,154,43,.5);
  outline-offset: 2px;
}
h1, h2, h3, h4, h5 { font-weight: 700; line-height: 1.35; color: var(--ky-text); }
.container { max-width: 1280px; margin: 0 auto; padding: 0 24px; }
.section-padding { padding: var(--ky-space-lg) 0; }
@media (max-width:1023px) { .section-padding { padding: var(--ky-space-md) 0; } }
@media (max-width:520px) { .section-padding { padding: 36px 0; } }

/* 自定义滚动条 */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #eef0ec; }
::-webkit-scrollbar-thumb { background: #9fb5b1; border-radius: 4px; }

/* Header & Nav */
.site-header {
  position: sticky; top: 0; z-index: 200;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(221,227,225,.6);
  transition: box-shadow .3s ease;
}
.site-header.scrolled { box-shadow: 0 2px 15px rgba(20,45,48,.05); }
.header-inner {
  display: flex; align-items: center; justify-content: space-between;
  min-height: 74px; gap: 20px;
}
.brand {
  display: flex; align-items: center; gap: 10px;
  flex-shrink: 0;
}
.brand-mark {
  width: 38px; height: 38px;
  background: var(--ky-primary);
  border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 19px;
  box-shadow: 0 2px 8px rgba(14,124,115,.25);
}
.brand-name { font-size: 20px; font-weight: 700; color: var(--ky-text); letter-spacing: .3px; white-space: nowrap; }
.brand-name em { font-style: normal; color: #A8B0AE; font-weight: 500; font-size: 16px; }
.main-nav { display: flex; align-items: center; gap: 8px; }
.main-nav a {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 8px 16px; border-radius: 8px;
  font-size: 15px; font-weight: 500; color: #3D4A4C;
  transition: var(--ky-trans); position: relative;
}
.main-nav a:hover { color: var(--ky-primary); background: rgba(14,124,115,.07); text-decoration: none; }
.main-nav a.active { color: var(--ky-primary); font-weight: 600; }
.main-nav a.active::after {
  content: ""; position: absolute; bottom: 2px; left: 50%; transform: translateX(-50%);
  width: 20px; height: 3px; border-radius: 2px; background: var(--ky-primary);
}
.nav-right { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.search-wrap { position: relative; }
.search-toggle {
  width: 40px; height: 40px; border-radius: 10px; border: 1px solid var(--ky-border);
  background: #fff; color: var(--ky-text); cursor: pointer; font-size: 15px;
  display: flex; align-items: center; justify-content: center;
  transition: var(--ky-trans);
}
.search-toggle:hover { border-color: var(--ky-primary); color: var(--ky-primary); }
.search-panel {
  position: absolute; right: 0; top: calc(100% + 10px);
  background: #fff; border: 1px solid var(--ky-border); border-radius: var(--ky-radius);
  box-shadow: var(--ky-shadow-hover); padding: 16px; width: 340px; display: none; z-index: 30;
}
.search-panel.open { display: block; animation: fadeInUp .25s ease; }
@keyframes fadeInUp { from{ opacity:0; transform: translateY(8px);} to{opacity:1; transform: translateY(0);} }
.search-form { display: flex; gap: 8px; }
.search-form input[type="text"] {
  flex: 1; border: 1px solid var(--ky-border); border-radius: 8px;
  padding: 9px 14px; font-size: 14px; font-family: var(--ky-font);
  transition: border-color .2s;
}
.search-form input[type="text"]:focus { border-color: var(--ky-primary); outline: none; }
.btn-login {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 14px; border-radius: 8px; font-size: 14px; font-weight: 500;
  color: var(--ky-text); border: 1px solid var(--ky-border);
  background: #fff; transition: var(--ky-trans); white-space: nowrap;
}
.btn-login:hover { border-color: var(--ky-primary); color: var(--ky-primary); text-decoration: none; transform: translateY(-1px); }
.btn-cta {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--ky-secondary); color: #262018;
  padding: 10px 22px; border-radius: 8px;
  font-size: 14px; font-weight: 600; border: none; cursor: pointer;
  transition: var(--ky-trans); white-space: nowrap;
}
.btn-cta:hover { background: var(--ky-secondary-hover); color: #262018; transform: translateY(-2px); box-shadow: 0 4px 14px rgba(232,154,43,.3); text-decoration: none; }
.hamburger { display: none; width: 40px; height: 40px; border: 1px solid var(--ky-border); border-radius: 10px; background: #fff; cursor: pointer; font-size: 18px; align-items: center; justify-content: center; color: var(--ky-text); }
.hamburger:hover { border-color: var(--ky-primary); color: var(--ky-primary); }
.mobile-drawer {
  display: none; background: #fff; border-top: 1px solid var(--ky-border);
  padding: 20px 0 26px; box-shadow: 0 8px 20px rgba(20,45,48,.04);
}
.mobile-drawer.active { display: block; }
.mobile-drawer-inner { display: flex; flex-direction: column; gap: 16px; }
.mobile-drawer a.mob-link {
  display: flex; align-items: center; gap: 12px; padding: 12px 8px;
  border-radius: 8px; font-size: 16px; font-weight: 500; color: var(--ky-text);
}
.mobile-drawer a.mob-link:hover { background: rgba(14,124,115,.06); color: var(--ky-primary); text-decoration: none; }
.mobile-drawer-btn-group { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 6px; }

/* Hero */
.hero-section {
  margin: 0 auto;
  position: relative;
  background-image: url('/assets/images/backpic/back-1.png');
  background-size: cover;
  background-position: center;
}
.hero-section::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(110deg, rgba(247,247,242,.98) 35%, rgba(247,247,242,.78) 100%);
  pointer-events: none;
}
.hero-wrap { position: relative; z-index: 2; padding: 88px 0 70px; }
.hero-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 60px; align-items: center; }
.hero-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(14,124,115,.1); border: 1px solid rgba(14,124,115,.2);
  color: var(--ky-primary-deep); font-size: 13px; font-weight: 600;
  padding: 6px 16px; border-radius: 40px; margin-bottom: 20px;
}
.hero-badge i { font-size: 12px; }
.hero-title {
  font-size: 46px; line-height: 1.3; font-weight: 700;
  color: var(--ky-text); letter-spacing: 1px;
  margin-bottom: 18px;
}
.hero-title span { color: var(--ky-primary); }
.hero-subtitle { font-size: 17px; line-height: 1.9; color: #455458; max-width: 560px; margin-bottom: 30px; }
.hero-btn-group { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 40px; }
.btn-primary {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--ky-secondary); color: #262018;
  padding: 13px 28px; border-radius: 8px; font-size: 16px; font-weight: 600;
  border: none; cursor: pointer; transition: var(--ky-trans);
}
.btn-primary:hover { background: var(--ky-secondary-hover); color: #262018; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(232,154,43,.3); text-decoration: none; }
.btn-secondary {
  display: inline-flex; align-items: center; gap: 8px;
  border: 1.5px solid var(--ky-primary); color: var(--ky-primary);
  padding: 11px 26px; border-radius: 8px; font-size: 16px; font-weight: 500;
  background: transparent; cursor: pointer; transition: var(--ky-trans);
}
.btn-secondary:hover { background: rgba(14,124,115,.08); color: var(--ky-primary-deep); transform: translateY(-2px); text-decoration: none; }
.hero-trust {
  display: flex; align-items: center; flex-wrap: wrap; gap: 10px 20px;
  font-size: 13px; color: var(--ky-text-weak);
}
.trust-item { display: inline-flex; align-items: center; gap: 6px; }
.trust-item i { color: var(--ky-primary); font-size: 12px; }
.hero-visual { position: relative; }
.hero-img-wrap {
  border-radius: var(--ky-radius-lg); overflow: hidden;
  box-shadow: 0 8px 32px rgba(20,45,48,.12);
  position: relative;
}
.hero-img-wrap img { width: 100%; height: 420px; object-fit: cover; }
.hero-card-float {
  position: absolute; bottom: 22px; left: -22px;
  background: #fff; border-radius: 14px; padding: 18px 22px;
  box-shadow: var(--ky-shadow-hover); display: flex; align-items: center; gap: 14px;
  border: 1px solid rgba(221,227,225,.7);
}
.float-icon {
  width: 42px; height: 42px; border-radius: 50%;
  background: rgba(14,124,115,.12); color: var(--ky-primary);
  display: flex; align-items: center; justify-content: center; font-size: 18px;
}
.float-num { font-size: 22px; font-weight: 700; color: var(--ky-text); line-height: 1.2; }
.float-label { font-size: 13px; color: var(--ky-text-weak); line-height: 1.4; }

/* 通用 section-header */
.section-head { margin-bottom: var(--ky-space-md); }
.section-tag {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 600; color: var(--ky-primary);
  background: rgba(14,124,115,.08); border-radius: 40px;
  padding: 5px 16px; margin-bottom: 12px;
}
.section-title { font-size: 34px; line-height: 1.35; margin-bottom: 8px; color: var(--ky-text); }
.section-desc { font-size: 16px; color: #5B686B; max-width: 620px; }

/* 产品分组 */
.products-section { background: #fff; }
.products-layout { display: grid; grid-template-columns: 320px 1fr; gap: 48px; }
.product-tabs { display: flex; flex-direction: column; gap: 6px; }
.product-tab-btn {
  display: flex; align-items: center; gap: 14px;
  padding: 16px 20px; border-radius: 10px;
  border: 1px solid transparent; background: #F1F3F0;
  cursor: pointer; text-align: left; transition: var(--ky-trans);
  font-family: var(--ky-font); font-size: 15px;
}
.product-tab-btn .p-icon {
  width: 36px; height: 36px; border-radius: 8px;
  background: rgba(14,124,115,.1); color: var(--ky-primary);
  display: flex; align-items: center; justify-content: center; font-size: 15px;
  flex-shrink: 0;
}
.product-tab-btn .p-name { font-weight: 600; color: var(--ky-text); }
.product-tab-btn .p-detail { display: block; font-size: 12px; color: var(--ky-text-weak); font-weight: 400; line-height: 1.4; margin-top: 2px; }
.product-tab-btn.active { background: var(--ky-primary); border-color: var(--ky-primary); }
.product-tab-btn.active .p-name { color: #fff; }
.product-tab-btn.active .p-detail { color: rgba(255,255,255,.78); }
.product-tab-btn.active .p-icon { background: rgba(255,255,255,.15); color: #fff; }
.product-pans { background: #F7F8F5; border-radius: var(--ky-radius); overflow: hidden; }
.product-panel { display: none; }
.product-panel.active { display: block; animation: fadeIn .35s ease; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.panel-img { width: 100%; height: 240px; object-fit: cover; }
.panel-body { padding: 34px 32px; }
.panel-body h3 { font-size: 22px; margin-bottom: 8px; }
.panel-body h4 { font-size: 16px; margin-bottom: 4px; }
.panel-body p { color: #5B686B; font-size: 15px; margin-bottom: 14px; }
.panel-list { list-style: none; padding: 0; margin: 0 0 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 20px; }
.panel-list li { position: relative; padding-left: 22px; font-size: 14px; color: #465356; }
.panel-list li::before { content: "\f058"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; left: 0; top: 1px; color: var(--ky-primary); font-size: 12px; }
.link-more { display: inline-flex; align-items: center; gap: 6px; color: var(--ky-primary); font-weight: 600; font-size: 15px; }
.link-more:hover { gap: 10px; }

/* 使用场景 */
.scenes-section { background: linear-gradient(180deg, #F7F7F2 0%, #EAF2EE 100%); position: relative; }
.scene-pattern-deco { position: absolute; top: 0; right: 0; width: 320px; height: 320px; opacity: .05; pointer-events: none; }
.section-title.light, .section-desc.light { color: #fff; }
.scene-grid { display: flex; flex-direction: column; gap: 20px; }
.scene-row {
  display: flex; flex-direction: column; gap: 26px;
}
.scene-block {
  background: #ffffff; border-radius: var(--ky-radius);
  padding: 30px 34px;
  border-left: 4px solid var(--ky-primary);
  box-shadow: var(--ky-shadow);
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 32px;
  transition: var(--ky-trans);
}
.scene-block:hover { box-shadow: var(--ky-shadow-hover); transform: translateY(-2px); }
.scene-titles { display: flex; align-items: center; gap: 14px; margin-bottom: 8px; }
.scene-icon {
  width: 44px; height: 44px; border-radius: 10px;
  background: rgba(14,124,115,.1); color: var(--ky-primary);
  display: flex; align-items: center; justify-content: center; font-size: 19px;
  flex-shrink: 0;
}
.scene-block h3 { font-size: 20px; color: var(--ky-text); }
.scene-block p { color: #5B686B; font-size: 15px; margin-bottom: 4px; max-width: 760px; }
.tab-2-col { display: grid; grid-template-columns: 1.2fr .8fr; gap: 28px; align-items: center; margin-bottom: 28px; }
.scene-img { border-radius: var(--ky-radius); object-fit: cover; height: 100%; width: 100%; min-height: 200px; }
.scene-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.scene-chips span {
  font-size: 13px; background: #eef2ee; border: 1px solid #dae6df;
  color: #3d5149; padding: 3px 14px; border-radius: 40px;
}
.ss-list { margin-top: 12px; }
@media(max-width:900px) {
  .scene-block { flex-direction: column; gap: 14px; }
  .component-toggle { width: 100%; }
}

/* 成功案例 */
.cases-section { background: #fff; }
.case-main { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; background: #f6f8f4; border-radius: var(--ky-radius-lg); overflow: hidden; margin-bottom: 28px; }
.case-main-img { width: 100%; height: 100%; object-fit: cover; min-height: 260px; }
.case-main-body { padding: 44px; display: flex; flex-direction: column; justify-content: center; }
.case-sub-label { font-size: 13px; font-weight: 600; color: var(--ky-primary); margin-bottom: 6px; letter-spacing: 1px; }
.case-main-body h3 { font-size: 26px; margin-bottom: 12px; }
.case-main-body p { color: #5B686B; margin-bottom: 22px; font-size: 15px; line-height: 1.85; }
.case-stats { display: flex; gap: 12px; flex-wrap: wrap; }
.stat-item { flex: 1; background: #fff; border-radius: 10px; padding: 14px 10px; text-align: center; box-shadow: 0 1px 3px rgba(0,0,0,.03); }
.stat-num { font-size: 29px; font-weight: 700; color: var(--ky-primary); line-height: 1.4; margin-bottom: 2px; }
.stat-name { font-size: 12px; color: var(--ky-text-weak); }
.case-mini { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.case-mini-item { display: flex; gap: 17px; background: #fafaf7; border-radius: var(--ky-radius); padding: 20px; transition: var(--ky-trans); border: 1px solid var(--ky-border); }
.case-mini-item:hover { box-shadow: var(--ky-shadow); background: #ffffff; }
.case-mini-item::after { content: "→"; font-size: 17px; color: var(--ky-primary); align-self: center; font-weight: 600; }
.case-mini-imgbox { flex-shrink: 0; }
.case-mini-imgbox img { width: 74px; height: 74px; object-fit: cover; border-radius: 8px; }
.case-mini-body h4 { font-size: 15px; margin-bottom: 6px; color: #2A373A; }
.case-mini-body p { font-size: 13px; color: var(--ky-text-weak); line-height: 1.5; }
.case-mini-tag { display: inline-block; font-size: 11px; background: #F0E8D8; color: #ad7c31; padding: 2px 8px; border-radius: 4px; margin-top: 4px; }

/* 规格 / 报价 */
.pricing-wrap { background: #fff; border-radius: var(--ky-radius-lg); overflow: hidden; border: 1px solid var(--ky-border); }
.spec-table { width: 100%; display: table; }
.spec-table-row { display: table-row; border-bottom: 1px solid #f0f0eb; }
.spec-table-row:hover { background: #f9fbf8; }
.spec-table-head { display: table-header-group; background: #0B5D58; color: #fff; }
.spec-table-head .col { color: #fff; font-weight: 600; }
.col { display: table-cell; padding: 14px 12px; font-size: 14px; vertical-align: middle; }
.col.c-pid { font-weight: 600; color: var(--ky-primary-deep); }
.col.price { color: var(--ky-text); font-weight: 600; box-sizing: border-box; }
.col-btn { display: table-cell; padding: 12px; width: 100px; }
.c-tag { display: inline-flex; font-size: 10px !important; padding: 2px 10px; border-radius: 30px; font-weight: 600; background: #f2e6d2; color: #785719; white-space: nowrap; }
.c-tag-green { display: inline-flex; font-size: 10px !important; padding: 2px 10px; border-radius: 30px; font-weight: 600; background: rgba(14,124,115,.12); color: #0B5D58; white-space: nowrap; }
.table-scroll { overflow-x: auto; }
.small-btn {
  display: inline-flex; background: #f5f6f2; border: 1px solid var(--ky-border);
  color: var(--ky-text); padding: 4px 12px; border-radius: 5px;
  font-size: 12px !important; cursor: pointer; transition: var(--ky-trans);
}
.small-btn:hover { background: var(--ky-primary); color: #fff; border-color: var(--ky-primary); }
.price-left { background: #fafbf9; border-bottom: 1px solid var(--ky-border); }
.step-sub-title { font-size: 20px; font-weight: 700; margin-bottom: 10px; }

/* CMS 列表区 */
.news-section { background: #f0f1ed; }
.news-stack { display: grid; grid-template-columns: .86fr 1.14fr; gap: 30px; align-items: start; }
.news-panel-top { background: #fff; border-radius: var(--ky-radius); overflow: hidden; box-shadow: var(--ky-shadow); position: relative; height: 100%; min-height: 200px; }
.news-top-img { width: 100%; height: 220px; object-fit: cover; }
.news-top-body { padding: 18px 20px; }
.news-cat {
  font-size: 12px; background: rgba(14,124,115,.12); display: inline-block;
  padding: 2px 11px; border-radius: 4px; color: var(--ky-primary-deep);
  font-weight: 500; margin-bottom: 8px;
}
.news-title { font-size: 20px; margin-bottom: 8px; line-height: 1.5; }
.news-title a { display: block; color: inherit; text-decoration: none; }
.news-title a:hover { color: var(--ky-primary); }
.news-summary { color: var(--ky-text-weak); font-size: 14px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.news-row-list { display: block; }
.news-row-item {
  display: block; padding: 16px 0; border-bottom: 1px solid #F0F2EF;
  transition: var(--ky-trans);
}
.news-row-item:hover { padding-left: 6px; }
.news-row-link { display: flex; gap: 14px; align-items: center; }
.news-row-badge { font-size: 12px; }
.news-row-title { display: block; font-size: 16px; font-weight: 500; color: var(--ky-text); transition: var(--ky-trans); margin-bottom: 3px; }
a:hover .news-row-title { color: var(--ky-primary); }
.news-row-meta { display: flex; gap: 14px; color: var(--ky-text-weak); font-size: 13px; align-items: center; }
.news-more { text-align: right; margin-top: 28px; background-color: transparent; }
.btn-light-brown {
  display: inline-flex; align-items: center; gap: 6px;
  background: transparent; border: 1.5px solid var(--ky-primary);
  color: var(--ky-primary-deep); padding: 10px 20px; border-radius: 8px;
  font-weight: 500; transition: var(--ky-trans); font-size: 14px;
}
.btn-light-brown:hover { background: var(--ky-primary); color: #fff; box-shadow: 0 4px 12px rgba(14,124,115,.25); }

/* FAQ */
.faq-acc { max-width: 830px; margin: 0 auto; }
.faq-item { margin-bottom: 12px; border: 1px solid var(--ky-border); border-radius: 10px; background: #fff; overflow: hidden; transition: var(--ky-trans); }
.faq-item.open { border-color: rgba(14,124,115,.3); }
.faq-title {
  background: #FFFFFF; width: 100%; text-align: left; padding: 14px 24px;
  border: px solid transparent;
  border: none;
  font-family: var(--ky-font); font-size: 16px; font-weight: 600;
  cursor: pointer; color: var(--ky-text);
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  transition: var(--ky-trans);
}
.faq-item.open .faq-title { background: #f2faf8; color: var(--ky-primary-deep); }
.faq-title i { transition: transform .3s; color: var(--ky-primary); }
.faq-item.open .faq-title i { transform: rotate(180deg); }
.faq-content { padding: 0; max-height: 0; opacity: 0; overflow: hidden; font-size: 14px; color: var(--ky-text-weak); transition: all .35s ease; }
.faq-item.open .faq-content { padding: 0 24px 18px 24px; max-height: 420px; opacity: 1; line-height: 1.9; }

/* CTA 区 */
.bottom-cta {
  background: var(--ky-primary-deep);
  background-image: url('/assets/images/backpic/back-3.png');
  background-size: cover;
  background-position: center;
  position: relative;
  border-radius: 22px;
  padding: 58px 54px;
  display: flex; align-items: center; justify-content: space-between; gap: 30px;
}
.bottom-cta::before { content: ""; position: absolute; inset: 0; background: rgba(11,93,88,.92); border-radius: 22px; pointer-events: none; }
.bottom-cta > * { position: relative; z-index: 3; }
.bottom-cta h4 { color: #ffffff; font-size: 26px; letter-spacing: .4px; margin-bottom: 10px; font-weight: 700; }
.bottom-cta p { color: rgba(255,255,255,.78); font-size: 15px; max-width: 650px; }
.cta-btn-group { display: flex; gap: 10px; flex-wrap: wrap; }
.btn-dark {
  background: var(--ky-secondary); display: inline-flex; color: #262018;
  padding: 12px 24px; border-radius: 8px; font-weight: 600; font-size: 15px;
  transition: var(--ky-trans);
}
.btn-dark:hover { background: var(--ky-secondary-hover); color: #262018; transform: translateY(-1px); text-decoration: none; }
.btn-lineout { display: inline-flex; color: #fff; padding: 11px 22px; border-radius: 8px; font-weight: 500; border: 1px solid rgba(255,255,255,.25); background: transparent; transition: var(--ky-trans); font-size: 15px; }
.btn-lineout:hover { border-color: #ffffff; background: rgba(255,255,255,.07); color: #fff; text-decoration: none; }

/* Footer */
.site-footer {
  background: #0B5D58; color: #c7dfdb;
  padding: 60px 0 0; margin-top: 80px;
}
.footer-grid { display: grid; grid-template-columns: 1.6fr 1.2fr 1.2fr 1.2fr; gap: 30px; margin-bottom: 36px; }
.footer-brand-title { font-size: 21px; font-weight: 700; color: #ffffff; display: flex; align-items: center; gap: 7px; margin-bottom: 14px; }
.footer-brand-title i { color: var(--ky-secondary); font-size: 19px; }
.footer-brand-title .light-text { font-weight: 400; color: #86b5ae; font-size: 15px; }
.footer-desc { font-size: 14px; line-height: 1.9; color: #BCD7D2; margin-bottom: 14px; max-width: 320px; }
.footer-tags { display: flex; flex-wrap: wrap; gap: 6px 10px; font-size: 12px; }
.footer-tags a { color: #A0C1BB; }
.footer-tags a:hover { color: #fff; }
.footer-title { color: #ffffff; font-size: 17px; margin-bottom: 16px; font-weight: 600; }
.footer-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 7px; }
.footer-list li a { color: #AFCAC5; font-size: 14px; }
.footer-list li a:hover { color: var(--ky-secondary); }
.footer-contact-list { display: flex; flex-direction: column; gap: 10px; }
.footer-contact-list li { display: flex; align-items: center; gap: 9px; font-size: 14px; color: #AFCAC5; }
.footer-contact-list li i { color: var(--ky-secondary); width: 15px; }
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,.12);
  padding: 18px 0;
  font-size: 13px; color: #8EBBB4;
}
.footer-bottom-inner { display: flex; justify-content: space-between; gap: 10px; }
.footer-bottom a { color: #8EBBB4; }
.footer-bottom a:hover { color: #fff; }

/* 文章页样式 */
.page-article { padding: 50px 0; }
.breadcrumb { font-size: 14px; margin-bottom: 27px; color: var(--ky-text-weak); display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.breadcrumb a { color: var(--ky-primary); }
.breadcrumb i { color: var(--ky-border); font-size: 10px; }
.breadcrumb .sep{ margin: 0 4px; }
.article-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.article-wrapper { display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 40px; align-items: start; }
.article-main { background: #fff; border-radius: var(--ky-radius-lg); padding: 36px 42px; box-shadow: var(--ky-shadow); }
.article-he-title { font-size: 31px; line-height: 1.5; color: var(--ky-text); margin-bottom: 18px; font-weight: 700; }
.article-meta { display: flex; gap: 12px; color: var(--ky-text-weak); font-size: 14px; align-items:center; padding-bottom: 22px; border-bottom: 1px solid var(--ky-border); margin-bottom: 30px; flex-wrap: wrap; }
.article-meta span { display: inline-flex; align-items: center; gap: 5px; }
.article-meta a { color: var(--ky-primary); }
.article-content { color: #2E3B3E; font-size: 16px; line-height: 1.95; }
.article-content h2 { font-size: 24px; margin-top: 32px; margin-bottom: 14px; }
.article-content h3 { font-size: 20px; margin-top: 24px; margin-bottom: 10px; }
.article-content p { margin-bottom: 18px; }
.article-content blockquote { border-left: 4px solid var(--ky-primary); padding: 10px 18px; background: #f7faf8; margin-bottom: 20px; color: #4a5c5f; border-radius: 0 8px 8px 0; }
.article-content hr { border:none; height:1px; background: var(--ky-border); margin:36px 0; }
.article-content ul { margin: 0 0 18px 24px; }
.article-content li { margin-bottom: 8px; padding-left: 2px; }
.art-prev-next { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 50px; }
.art-pn {
  display: flex; align-items: center; gap: 12px; border: 1px solid var(--ky-border);
  border-radius: 8px; padding: 14px; background: #fafaf6; font-size: 13px; transition: var(--ky-trans);
}
.art-pn:hover { border-color: var(--ky-primary); background: #fff; box-shadow: var(--ky-shadow); text-decoration: none; }
.art-pn .pn-txt { color: var(--ky-text-weak); white-space: nowrap; }
.art-pn .pn-title { color: var(--ky-text); font-weight: 500; }
.related-items { margin-top: 30px; padding: 20px 14px; background: #ffffff; border-radius: var(--ky-radius); }
.related-items h4 { margin-bottom: 15px; }
.article-sidebar { display: flex; flex-direction: column; gap: 24px; position: sticky; top: 96px; }
.sidebar-block { background: #fff; padding: 25px; border-radius: var(--ky-radius); box-shadow: var(--ky-shadow); }
.sidebar-block.e-card{ background:  #0B5D58; color:#fff; }
.sidebar-block h4 { font-size: 21px;padding-bottom: 20px; margin-bottom: 10px; position: relative;  color: #fff; font-weight: 500; }
.sidebar-block h4:after{ content:"": ; display:block;height:2px;width:28px; margin-top:8px; background:#fff;opacity:.6; }
.sidebar-block .side-card-header { font-size: 17px; font-weight: 700; margin-bottom: 13px; color: var(--ky-text); }
.sidebar-block .side-card-header:after { content: ""; display:block; height:2px; width:38px; margin-top:8px; background: var(--ky-primary); }
.sidebar-block .sidebar-text { font-size: 15px; color: var(--ky-text-weak); line-height: 1.7; margin-bottom: 15px; }
.sidebar-contact-btn { display: block; width: 100%; text-align: center; background: var(--ky-secondary); color: #262018; padding: 10px 12px; border-radius: 8px; font-weight: 600; font-size: 15px; }
.sidebar-contact-btn:hover { background: var(--ky-secondary-hover);color: #262018;}
.side-nav { padding: 5px 0 }
.side-nav-items { list-style: none;  margin: 0; display: flex; flex-direction: column; gap: 10px; }
.side-nav-items li a { color: var(--ky-text); font-size: 15px; }
.side-nav-items li a:hover{color: var(--ky-primary); }
.side-nav-items li i { color: var(--ky-primary); margin-right: 6px; }
@media(max-width:1100px) {
  .product-tabs { flex-direction: row; flex-wrap: wrap; }
  .product-layout { grid-template-columns: 1fr; }
  .article-wrapper { grid-template-columns: minmax(0,1fr) 320px; }
  .article-main { padding: 28px 24px; }
}
@media(max-width:900px) {
  .header-inner { min-height: 70px; flex-wrap: wrap; }
  .main-nav { display: none; }
  .nav-right .btn-login, .nav-right .btn-cta { display: none; }
  .hamburger { display: inline-flex; }
  .mobile-drawer.active { display: block; }
  .search-wrap { display: none}
  .hero-grid { grid-template-columns: 1fr; gap: 30px; }
  .hero-title { font-size: 38px;}
  .products-layout { grid-template-columns: 1fr; }
  .case-main, .case-main-m { grid-template-columns: 1fr; }
  .case-main-img { min-height: 200px; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .article-main { padding: 24px 18px; }
  .article-wrapper { grid-template-columns: minmax(0,1fr); }
  .article-sidebar { position: static; flex-direction: row; flex-wrap: wrap; align-items: stretch; }
  .sidebar-block { flex: 1 0 220px }
  .brand-name em, .site-logo { display: none; }
  .nav-right .hamburger { display:inline-flex; }
  .pricing-table-scroll-wrap { overflow-x: auto; }
}
@media(max-width:767px) {
  .container { padding: 0 18px; }
  .nav-right .auth-link, .nav-right .btn-cta { display: none; }
  .case-main-body { padding: 28px 24px; }
  .case-mini { grid-template-columns: 1fr; }
  .news-stack { grid-template-columns: 1fr; gap: 20px; }
  .cta-block { flex-direction: column; text-align: left; }
  .col { display: table-cell; padding: 8px; font-size:13px; }
  .hero-title { font-size: 32px; line-height: 1.4; }
  .section-title { font-size: 26px; }
  .card-body h3{ font-size: 18px}
  .mobile-drawer a.mob-link{ }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 22px; }
}
@media(max-width:560px) {
  .footer-grid { grid-template-columns: 1fr; }
  .hero-wrap { padding: 60px 0; }
  .footer-contact { align-items: flex-start }
  .col-btn { display: none; }
  .table-scroll { width: 100%; }
  .case-main-body { padding: 22px 18px; }
  .bottom-cta { padding: 34px 24px; flex-wrap: wrap; }
  .bottom-cta h4 { font-size: 22px; }
  .btn-primary, .btn-secondary { width: 100%; justify-content: center; }
  .hero-img-wrap img { height: 280px; }
  .pricing-wrap table { min-width: 650px; }
  .nav-right .btn-cta { display: none; }
}
/* 保护 */
.wrap-hr, .no-border { border-bottom: none; }
.news-summary { -webkit-line-clamp: 2; }

/* roulang page: category1 */
:root{
  --ky-primary:#0E7C73;
  --ky-deep:#0B5D58;
  --ky-dark:#064A46;
  --ky-primary-light:rgba(14,124,115,.14);
  --ky-secondary:#E89A2B;
  --ky-secondary-hover:#D98B1E;
  --ky-bg:#F7F7F2;
  --ky-white:#FFFFFF;
  --ky-ink:#1E2B2E;
  --ky-muted:#6B777A;
  --ky-line:#DDE3E1;
  --radius:12px;
  --radius-lg:16px;
  --font-cn:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
  --shadow-xs:0 1px 2px rgba(20,45,48,.04),0 2px 6px rgba(20,45,48,.04);
  --shadow-card:0 1px 2px rgba(20,45,48,.06),0 4px 12px rgba(20,45,48,.05);
  --shadow-hover:0 6px 18px rgba(20,45,48,.10);
  --transition:.22s ease;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--font-cn);
  font-size:16px;
  line-height:1.8;
  background:var(--ky-white);
  color:var(--ky-ink);
  -webkit-font-smoothing:antialiased;
}
body.mobile-open{overflow:hidden}
ul,ol{list-style:none;margin:0;padding:0}
a{color:inherit;text-decoration:none;transition:color var(--transition),border-color var(--transition),background var(--transition)}
img{max-width:100%;height:auto;display:block;border:0}
button,input,textarea,select{font-family:inherit;font-size:inherit;outline:none}
button{border:0;cursor:pointer;background:none}
.container{max-width:1280px;margin:0 auto;padding:0 28px}
.skip-link{position:fixed;left:16px;top:-70px;z-index:9999;background:var(--ky-deep);color:#fff;padding:10px 16px;border-radius:8px;transition:top var(--transition)}
.skip-link:focus{top:16px}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{
  outline:3px solid rgba(232,154,43,.55);
  outline-offset:3px;
  border-radius:4px;
}
::placeholder{color:#9AA5A6;opacity:1}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--ky-bg)}
::-webkit-scrollbar-thumb{background:#93A5A3;border-radius:10px;border:2px solid var(--ky-bg)}
::-webkit-scrollbar-thumb:hover{background:var(--ky-primary)}
:target{scroll-margin-top:110px}
h1,h2,h3,h4{line-height:1.35;margin:0;font-weight:700}
p{margin:0 0 1rem}
.site-header{
  position:sticky;top:0;z-index:300;
  background:rgba(255,255,255,.96);
  border-bottom:1px solid transparent;
  box-shadow:0 1px 0 rgba(30,43,46,.04);
}
.site-header.is-scrolled{border-bottom-color:var(--ky-line);box-shadow:0 4px 16px rgba(20,45,48,.04)}
.header-inner{display:flex;align-items:center;gap:.75rem;min-height:76px}
.brand{display:inline-flex;align-items:center;gap:.7rem;margin-right:.4rem}
.brand-mark{
  width:42px;height:42px;border-radius:11px;
  background:var(--ky-primary);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:20px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 4px 8px rgba(14,124,115,.16);
}
.brand-text{display:flex;align-items:baseline;gap:3px;white-space:nowrap}
.brand-name{font-size:21px;font-weight:800;letter-spacing:.4px;color:var(--ky-ink)}
.brand-name small{font-size:13px;font-weight:500;color:var(--ky-muted);margin-left:3px;letter-spacing:.2px}
.main-nav{flex:1;display:flex;align-items:center;justify-content:center;gap:.2rem}
.main-nav a{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.72rem .9rem;border-radius:8px;
  font-size:15.5px;font-weight:500;color:#3A4A4C;white-space:nowrap;
}
.main-nav a i{color:var(--ky-primary);font-size:15px;opacity:.85}
.main-nav a:hover{background:rgba(14,124,115,.1);color:var(--ky-deep)}
.main-nav a.active{
  background:transparent;color:var(--ky-deep);font-weight:700;
  box-shadow:inset 0 -2px 0 var(--ky-primary);
}
.header-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.header-search{
  display:flex;align-items:center;gap:0;
  background:var(--ky-bg);border:1px solid var(--ky-line);
  border-radius:9px;padding:0 4px 0 12px;transition:border-color var(--transition),box-shadow var(--transition);
}
.header-search:focus-within{border-color:var(--ky-primary);box-shadow:0 0 0 3px rgba(14,124,115,.12)}
.header-search input{width:142px;border:0;background:transparent;height:38px;font-size:14px;color:var(--ky-ink)}
.header-search button{width:34px;height:34px;border-radius:8px;color:var(--ky-deep);font-size:15px;transition:background var(--transition)}
.header-search button:hover{background:rgba(14,124,115,.12)}
.header-btn{
  height:40px;padding:0 16px;border-radius:9px;
  background:var(--ky-secondary);color:#262018;
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:14.5px;font-weight:700;white-space:nowrap;
  transition:background var(--transition),transform var(--transition),box-shadow var(--transition);
}
.header-btn i{font-size:13px}
.header-btn:hover{background:var(--ky-secondary-hover);transform:translateY(-1px);box-shadow:0 8px 16px rgba(217,139,30,.22)}
.nav-toggle{display:none;width:42px;height:42px;border:1px solid var(--ky-line);border-radius:10px;color:var(--ky-deep);font-size:18px;align-items:center;justify-content:center;background:#fff;transition:all var(--transition)}
.nav-toggle:hover{background:rgba(14,124,115,.08)}
.mobile-drawer{
  position:fixed;top:0;right:-300px;width:300px;max-width:86vw;height:100vh;
  background:#fff;z-index:500;box-shadow:-10px 0 30px rgba(11,36,41,.18);
  display:flex;flex-direction:column;padding:26px 24px;gap:6px;transition:right var(--transition);
}
.mobile-drawer.open{right:0}
.mobile-drawer-backdrop{position:fixed;inset:0;background:rgba(11,36,41,.38);z-index:490;backdrop-filter:blur(1px);opacity:0;visibility:hidden;transition:all .25s}
.mobile-drawer-backdrop.show{opacity:1;visibility:visible}
.drawer-close{align-self:flex-end;width:36px;height:36px;border-radius:8px;background:var(--ky-bg);color:var(--ky-deep);font-size:16px;display:flex;align-items:center;justify-content:center}
.mobile-drawer .drawer-brand{display:flex;align-items:center;gap:10px;padding:8px 2px 16px;font-weight:800;color:var(--ky-ink)}
.mobile-drawer .drawer-brand i{color:var(--ky-primary)}
.mobile-drawer a{
  padding:12px 14px;border-radius:10px;display:flex;align-items:center;gap:12px;
  color:var(--ky-ink);font-weight:500;font-size:16px;
}
.mobile-drawer a:hover{background:var(--ky-bg);color:var(--ky-primary)}
.mobile-drawer a.active{background:rgba(14,124,115,.12);color:var(--ky-deep);font-weight:700}
.mobile-drawer .drawer-cta{margin-top:auto;background:var(--ky-secondary);color:#262018;justify-content:center;font-weight:800}
.page-hero{
  position:relative;padding:64px 0 70px;overflow:hidden;
  background:
    radial-gradient(circle at 82% 22%,rgba(14,124,115,.12),transparent 32%),
    linear-gradient(136deg,#F3F6F1 0%,#ECF4EF 100%);
}
.page-hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url('/assets/images/backpic/back-1.png');
  background-size:820px auto;background-position:90% 18%;opacity:.28;mix-blend-mode:multiply;
}
.page-hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(14,124,115,.65) 1px,transparent 1px);
  background-size:22px 22px;opacity:.05;mask-image:linear-gradient(to bottom,transparent,#000);
}
.page-hero .container{position:relative;z-index:2}
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;font-size:14px;color:var(--ky-muted);margin-bottom:1.2rem}
.breadcrumb a{color:var(--ky-muted);padding:2px 0}
.breadcrumb a:hover{color:var(--ky-primary);text-decoration:underline}
.hero-title{max-width:780px;font-size:45px;line-height:1.28;letter-spacing:.4px;color:var(--ky-deep);margin-bottom:18px}
.hero-title span{position:relative;color:var(--ky-primary)}
.hero-title span::after{content:"";position:absolute;left:0;right:0;bottom:5px;height:10px;background:rgba(232,154,43,.24);z-index:-1;border-radius:4px}
.hero-intro{max-width:720px;font-size:17px;line-height:2;color:#42585A;margin-bottom:26px}
.hero-intro strong{color:var(--ky-deep);font-weight:700}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:26px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  padding:.8rem 1.55rem;border-radius:9px;font-size:15.5px;font-weight:700;line-height:1.3;
  transition:all var(--transition);border:1px solid transparent;white-space:nowrap;
}
.btn-primary{background:var(--ky-secondary);color:#262018;box-shadow:0 4px 12px rgba(232,154,43,.22)}
.btn-primary:hover{background:var(--ky-secondary-hover);color:#1F1812;transform:translateY(-2px);box-shadow:0 10px 22px rgba(217,139,30,.26)}
.btn-outline{background:transparent;color:var(--ky-deep);border-color:var(--ky-primary)}
.btn-outline:hover{background:rgba(14,124,115,.12);border-color:var(--ky-deep);color:var(--ky-deep);transform:translateY(-2px)}
.btn-green{background:var(--ky-primary);color:#fff}
.btn-green:hover{background:var(--ky-deep);transform:translateY(-2px);box-shadow:0 10px 20px rgba(11,93,88,.2)}
.hero-tags{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:14px;color:var(--ky-muted);margin-top:2px}
.hero-tags span{position:relative}
.hero-tags i{color:var(--ky-primary);margin-right:5px;font-size:12px}
.hero-visual{position:relative}
.hero-figure{position:relative;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-hover);background:#E3ECE6}
.hero-figure img{width:100%;aspect-ratio:4/3;object-fit:cover}
.hero-figure .float-chip{
  position:absolute;left:14px;bottom:14px;background:rgba(255,255,255,.96);
  backdrop-filter:blur(8px);border-radius:12px;padding:14px 16px;box-shadow:var(--shadow-hover);
  display:flex;align-items:center;gap:12px;
}
.hero-figure .chip-icon{width:36px;height:36px;border-radius:9px;background:rgba(14,124,115,.14);color:var(--ky-primary);display:flex;align-items:center;justify-content:center;font-size:16px}
.hero-figure .chip-text{font-size:13px;line-height:1.45;color:var(--ky-muted)}
.hero-figure .chip-text strong{font-size:14px;color:var(--ky-ink);font-weight:700}
.stat-band{background:var(--ky-deep);position:relative;overflow:hidden;color:#fff}
.stat-band::before{content:"";position:absolute;inset:0;background-image:url('/assets/images/backpic/back-3.png');background-size:960px auto;background-position:center;opacity:.12}
.stat-band .container{position:relative;padding:42px 28px;z-index:1}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.stat-item{position:relative;text-align:left;padding-left:26px}
.stat-item::before{content:"";position:absolute;left:0;top:14px;width:8px;height:26px;border-radius:4px;background:var(--ky-secondary)}
.stat-item .stat-num{font-size:35px;font-weight:800;line-height:1.2;letter-spacing:.5px;color:#fff}
.stat-item .stat-num small{font-size:17px;font-weight:600;color:#BFE0D7;margin-left:4px}
.stat-item .stat-label{font-size:14px;color:rgba(255,255,255,.78);margin-top:11px}
.section{padding:96px 0}
.section.bg-light{background:var(--ky-bg)}
.section-head{max-width:840px;margin-bottom:52px}
.section-kicker{display:inline-flex;align-items:center;gap:.4rem;font-size:14px;font-weight:700;letter-spacing:.3px;color:var(--ky-primary);background:rgba(14,124,115,.1);padding:6px 14px;border-radius:999px;margin-bottom:16px}
.section-kicker i{font-size:12px}
.section-title{font-size:34px;color:var(--ky-ink);letter-spacing:.3px;margin-bottom:14px}
.section-title em{font-style:normal;color:var(--ky-primary)}
.section-lead{font-size:17px;line-height:2;color:var(--ky-muted);max-width:820px}
.catalog-layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:32px;align-items:start}
.catalog-side{
  background:#fff;border:1px solid var(--ky-line);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);padding:22px;position:sticky;top:102px;
}
.catalog-side-head{display:flex;align-items:center;gap:10px;padding-bottom:14px;margin-bottom:12px;border-bottom:1px solid var(--ky-line)}
.catalog-side-head i{width:32px;height:32px;border-radius:8px;background:var(--ky-primary);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:14px}
.catalog-side-head h3{font-size:17px;color:var(--ky-ink)}
.catalog-list li+li{border-top:1px solid #EEF1EF}
.catalog-list a{
  display:flex;align-items:center;gap:12px;padding:12px 8px;border-radius:8px;
  color:#3D4D50;font-size:15px;font-weight:600;line-height:1.5;
}
.catalog-list a .seq{font-size:12px;font-weight:700;color:var(--ky-secondary);font-family:"Inter",sans-serif}
.catalog-list a .arrow{margin-left:auto;font-size:13px;color:#B4BEBC;transition:transform var(--transition)}
.catalog-list a:hover{background:var(--ky-bg);color:var(--ky-primary)}
.catalog-list a.active{background:rgba(14,124,115,.12);color:var(--ky-deep)}
.side-more{margin-top:20px;border-top:1px solid var(--ky-line);padding-top:18px}
.side-more a{display:flex;align-items:center;gap:10px;font-size:14.5px;font-weight:700;color:var(--ky-deep);background:rgba(232,154,43,.12);padding:11px 14px;border-radius:10px;transition:all var(--transition)}
.side-more a:hover{background:rgba(232,154,43,.2);transform:translateX(3px)}
.catalog-main{
  background:#fff;border:1px solid var(--ky-line);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);overflow:hidden;
}
.catalog-hero-panel{
  display:grid;grid-template-columns:1.1fr .9fr;align-items:center;
}
.catalog-panel{display:none;padding:38px}
.catalog-panel:first-child{display:grid}
.cat-panel-title{font-size:23px;margin-bottom:12px;color:var(--ky-deep);letter-spacing:.2px}
.cat-panel-lead{font-size:15.5px;line-height:1.9;color:var(--ky-muted);margin-bottom:24px}
.cat-ul{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}
.cat-ul li{display:flex;gap:8px;align-items:flex-start;font-size:14.5px;line-height:1.6;color:#445B5D}
.cat-ul i{color:var(--ky-primary);margin-top:5px;font-size:13px}
.cat-badge{display:inline-flex;align-items:center;gap:6px;background:var(--ky-primary-light);color:var(--ky-deep);font-size:13px;font-weight:700;border-radius:7px;padding:5px 11px;margin-bottom:14px}
.catalog-panel-img{height:100%;min-height:240px;position:relative;overflow:hidden;background:#EDF2EE}
.catalog-panel-img img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.cat-shadow{box-shadow:inset 0 0 40px rgba(11,93,88,.06)}
.table-scroll{overflow-x:auto;border-radius:var(--radius);box-shadow:var(--shadow-xs)}
.ky-table{width:100%;min-width:820px;border-collapse:collapse;background:#fff;font-size:14.5px}
.ky-table caption{caption-side:bottom;text-align:left;padding:12px 6px;font-size:13px;color:var(--ky-muted)}
.ky-table th,.ky-table td{padding:15px 18px;text-align:left;vertical-align:middle;border-bottom:1px solid #EDF1EF}
.ky-table thead th{background:var(--ky-deep);color:#fff;font-weight:600;font-size:14px;letter-spacing:.2px}
.ky-table tbody tr:hover{background:#F9FBF9}
.ky-table .table-tag{display:inline-block;font-size:12px;padding:2px 9px;border-radius:999px;background:rgba(14,124,115,.12);color:var(--ky-deep);font-weight:700}
.ky-table .table-tag.hot{background:rgba(232,154,43,.16);color:#9A5A0F}
.ky-table .tag-label{font-size:13px;color:var(--ky-muted);display:flex;gap:6px;flex-wrap:wrap}
.serve-panel{display:grid;grid-template-columns:.9fr 1.1fr;border-radius:var(--radius-lg);overflow:hidden;background:#fff;box-shadow:var(--shadow-card);border:1px solid var(--ky-line)}
.serve-media{min-height:330px;position:relative;background:#E8EFE9}
.serve-media img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.serve-media::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(11,93,88,.16),transparent 55%)}
.serve-list{padding:40px 42px;display:flex;flex-direction:column;justify-content:center;gap:0}
.serve-list .section-kicker{margin-bottom:8px}
.serve-list h3{font-size:26px;margin-bottom:14px}
.serve-list .serve-sub{color:var(--ky-muted);font-size:15px;margin-bottom:20px}
.serve-feature{display:flex;gap:14px;padding:12px 0;align-items:flex-start;border-bottom:1px dashed #E9EEEC}
.serve-feature:last-child{border-bottom:0}
.serve-feature i{width:40px;height:40px;flex:0 0 auto;background:rgba(14,124,115,.12);color:var(--ky-primary);border-radius:11px;display:inline-flex;align-items:center;justify-content:center;font-size:16px}
.serve-feature .service-text strong{font-size:16px;display:block;color:var(--ky-ink)}
.serve-feature .service-text p{margin:4px 0 0;font-size:13.5px;color:var(--ky-muted);line-height:1.75}
.process-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;position:relative}
.process-grid::before{content:"";position:absolute;left:8%;right:8%;top:34px;height:2px;background:repeating-linear-gradient(90deg,var(--ky-primary) 0 8px,transparent 8px 16px);opacity:.45}
.step-item{background:#fff;border:1px solid var(--ky-line);border-radius:var(--radius);box-shadow:var(--shadow-xs);padding:22px 18px;text-align:center;position:relative}
.step-item .step-num{
  width:52px;height:52px;margin:0 auto 16px;background:var(--ky-deep);color:#fff;
  border-radius:16px;display:flex;align-items:center;justify-content:center;
  font-size:18px;font-weight:800;position:relative;z-index:2;border:4px solid #fff;box-shadow:0 4px 10px rgba(11,93,88,.22);
}
.step-item h4{font-size:16.5px;margin-bottom:8px;color:var(--ky-ink)}
.step-item p{font-size:13.5px;color:var(--ky-muted);line-height:1.7;margin:0}
.bridge-band{
  position:relative;overflow:hidden;background:#E9F2EE;
  border-top:1px solid #DDE9E3;border-bottom:1px solid #DDE9E3;
}
.bridge-band::before{content:"";position:absolute;inset:0;background-image:url('/assets/images/backpic/back-2.png');background-size:700px auto;background-position:80% center;opacity:.18}
.bridge-inner{position:relative;display:grid;grid-template-columns:1.4fr .6fr;align-items:center;gap:40px;padding:70px 0}
.bridge-copy .section-title{font-size:30px}
.bridge-copy p{color:#536B6D;font-size:16px;max-width:640px;margin-bottom:0}
.bridge-copy ul{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:18px}
.bridge-copy li{font-size:14px;color:var(--ky-deep);display:flex;align-items:center;gap:7px}
.bridge-copy li i{color:var(--ky-secondary);font-size:11px}
.bridge-cta{text-align:right}
.faq-wrap{max-width:1050px;margin:0 auto}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.faq-item{background:#fff;border:1px solid var(--ky-line);border-radius:var(--radius);box-shadow:var(--shadow-xs);transition:box-shadow var(--transition),border-color var(--transition)}
.faq-item:hover{box-shadow:var(--shadow-card);border-color:#C7D7D2}
.faq-item summary{
  cursor:pointer;list-style:none;padding:20px 22px;font-size:16px;font-weight:700;
  color:var(--ky-ink);display:flex;align-items:center;gap:12px;line-height:1.6;user-select:none;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::before{content:"";flex:0 0 28px;width:28px;height:28px;border-radius:8px;background:rgba(14,124,115,.12);color:var(--ky-primary);display:inline-flex;align-items:center;justify-content:center;font-size:13px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%230E7C73' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H12M12 5v14'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center}
.faq-item[open] summary::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%230E7C73' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E")}
.faq-item summary:hover{color:var(--ky-primary)}
.faq-item .faq-answer{padding:0 24px 22px 62px;font-size:15px;color:var(--ky-muted);line-height:1.95}
.faq-item .faq-answer strong{color:var(--ky-deep)}
.lead-section{background:linear-gradient(135deg,var(--ky-deep),var(--ky-dark));color:#fff;position:relative;overflow:hidden}
.lead-section::before{content:"";position:absolute;inset:0;background-image:url('/assets/images/backpic/back-3.png');background-size:900px auto;opacity:.1}
.lead-section::after{content:"";position:absolute;right:-60px;bottom:-60px;width:300px;height:300px;border-radius:50%;background:rgba(255,255,255,.07)}
.lead-inner{position:relative;display:grid;grid-template-columns:1fr .95fr;gap:50px;padding:92px 0;align-items:center}
.lead-copy h2{font-size:32px;line-height:1.45;margin-bottom:14px}
.lead-copy p{color:rgba(255,255,255,.82);font-size:16.5px;margin-bottom:12px;max-width:540px}
.lead-points{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:20px}
.lead-points li{color:#EAF3EF;font-size:14px;display:flex;align-items:center;gap:8px}
.lead-points li i{color:var(--ky-secondary);font-size:12px}
.lead-form{background:#fff;color:var(--ky-ink);border-radius:18px;padding:32px;box-shadow:0 24px 60px rgba(6,35,36,.25)}
.lead-form h3{font-size:20px;margin-bottom:6px;color:var(--ky-ink)}
.lead-form .form-tip{font-size:13.5px;color:var(--ky-muted);margin-bottom:20px}
.lead-form input,.lead-form textarea{
  width:100%;border:1px solid var(--ky-line);border-radius:9px;
  padding:11px 13px;margin-bottom:12px;font-size:14.5px;color:var(--ky-ink);
  background:#FBFBFA;transition:border-color var(--transition),box-shadow var(--transition);
}
.lead-form input:focus,.lead-form textarea:focus{border-color:var(--ky-primary);background:#fff;box-shadow:0 0 0 3px rgba(14,124,115,.1)}
.lead-form textarea{min-height:84px;resize:vertical}
.lead-form .btn{width:100%;padding:.95rem}
.lead-form .btn:hover{transform:translateY(-2px)}
.lead-form .form-note{font-size:12px;color:#9AA5A6;display:flex;align-items:center;gap:6px;margin-top:8px}
.lead-form .form-note i{font-size:13px}
.site-footer{background:var(--ky-deep);color:#E2EEEA;padding-top:72px}
.footer-grid{display:grid;grid-template-columns:1.5fr .7fr .7fr 1fr;gap:34px;padding-bottom:40px}
.footer-brand-title{display:flex;align-items:center;gap:8px;font-size:24px;font-weight:800;color:#fff;margin-bottom:14px}
.footer-brand-title i{font-size:19px;color:#7CCFC2}
.light-text{color:rgba(255,255,255,.58);font-size:12px;font-weight:400}
.footer-desc{font-size:14.5px;line-height:2;color:rgba(255,255,255,.72);margin-bottom:20px;max-width:420px}
.footer-tags{display:flex;flex-wrap:wrap;gap:8px}
.footer-tags a{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.12);padding:4px 12px;border-radius:999px;font-size:12.5px;color:#E8F2EE;transition:all var(--transition)}
.footer-tags a:hover{background:#fff;color:var(--ky-deep)}
.footer-title{font-size:15px;font-weight:700;color:#fff;margin-bottom:15px;letter-spacing:.2px}
.footer-list{display:flex;flex-direction:column;gap:9px}
.footer-list a,.footer-contact-list li{font-size:14px;color:rgba(255,255,255,.7);line-height:1.7}
.footer-list a:hover{color:var(--ky-secondary);transform:translateX(3px);display:inline-block}
.footer-contact-list li{display:flex;align-items:flex-start;gap:9px;font-size:14px;margin-bottom:9px;color:rgba(255,255,255,.75)}
.footer-contact-list i{margin-top:5px;color:#8FD3C5;width:16px;text-align:center}
.footer-bottom{border-top:1px solid rgba(255,255,255,.15)}
.footer-bottom-inner{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;align-items:center;padding:20px 0;font-size:13px;color:rgba(255,255,255,.5)}
.footer-bottom-inner p{margin:0}
@media(max-width:1200px){
  .header-search input{width:92px}
  .main-nav a{padding:.68rem .64rem;font-size:14.5px}
  .header-btn{padding:0 13px;font-size:13.5px}
  .page-hero{padding:58px 0 62px}
  .hero-title{font-size:40px}
}
@media(max-width:1024px){
  .header-search{display:none}
  .main-nav{display:none}
  .header-actions{gap:8px}
  .nav-toggle{display:inline-flex;margin-left:2px}
  .header-btn{display:none}
  .hero-actions .btn{display:none}
  .hero-actions .btn-outline{display:inline-flex}
  .page-hero .grid-x{align-items:flex-start}
  .hero-title{font-size:37px}
  .section{padding:76px 0}
  .catalog-layout{grid-template-columns:1fr;gap:24px}
  .catalog-side{position:static}
  .serve-panel{grid-template-columns:1fr}
  .process-grid{grid-template-columns:repeat(3,1fr);gap:16px}
  .process-grid::before{display:none}
  .serve-list{padding:28px}
  .stat-grid{grid-template-columns:repeat(2,1fr);gap:1.6rem 1rem}
  .bridge-inner{grid-template-columns:1fr;gap:18px;padding:60px 0}
  .bridge-cta{text-align:left}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-desc{max-width:100%}
}
@media(max-width:768px){
  .container{padding:0 20px}
  .header-inner{min-height:66px}
  .brand-name{font-size:19px}
  .brand-mark{width:38px;height:38px;font-size:17px}
  .section{padding:60px 0}
  .page-hero{padding:48px 0 52px}
  .page-hero .grid-x{row-gap:28px}
  .hero-title{font-size:32px}
  .hero-intro{font-size:16px}
  .section-title{font-size:27px}
  .catalog-hero-panel{grid-template-columns:1fr}
  .catalog-panel-img{min-height:220px;order:-1;position:relative;height:auto}
  .catalog-panel-img img{position:static;height:auto}
  .catalog-panel{padding:28px}
  .faq-grid{grid-template-columns:1fr}
  .stat-band .container{padding:36px 20px}
  .stat-grid{grid-template-columns:1fr 1fr}
  .stat-item .stat-num{font-size:30px}
  .lead-inner{grid-template-columns:1fr;padding:70px 0 84px;gap:34px}
  .footer-grid{grid-template-columns:1fr;gap:28px}
}
@media(max-width:520px){
  .container{padding:0 16px}
  .header-actions .header-user{display:none}
  .process-grid{grid-template-columns:1fr 1fr}
  .hero-actions{gap:10px}
  .hero-title{font-size:28px}
  .hero-figure .float-chip{left:10px;right:10px;bottom:10px}
  .stat-grid{grid-template-columns:1fr;padding-left:10px}
  .stat-item{padding-left:20px}
  .stat-item::before{height:20px;top:13px;width:6px}
  .catalog-ul,.cat-ul{grid-template-columns:1fr}
  .table-scroll{margin-right:-16px}
  .ky-table th,.ky-table td{padding:12px 10px;font-size:13.5px;min-width:140px}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom-inner{flex-direction:column;align-items:flex-start}
}

/* roulang page: article */
:root{
    --ky-primary:#0E7C73;
    --ky-primary-dark:#0B5D58;
    --ky-primary-deeper:#083f3b;
    --ky-secondary:#E89A2B;
    --ky-secondary-hover:#D98B1E;
    --ky-bg:#F7F7F2;
    --ky-card:#FFFFFF;
    --ky-ink:#1E2B2E;
    --ky-muted:#6B777A;
    --ky-line:#DDE3E1;
    --ky-radius:12px;
    --ky-radius-lg:16px;
    --ky-shadow-sm:0 1px 2px rgba(20,45,48,.06),0 4px 12px rgba(20,45,48,.05);
    --ky-shadow-hover:0 6px 18px rgba(20,45,48,.10);
    --ky-space:96px;
    --ky-font:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","HarmonyOS Sans SC",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    font-family:var(--ky-font);
    font-size:16px;
    line-height:1.8;
    color:var(--ky-ink);
    background:var(--ky-bg);
    -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:var(--ky-ink);text-decoration:none;transition:color .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease}
a:hover{color:var(--ky-primary)}
a:focus-visible{outline:3px solid rgba(14,124,115,.35);outline-offset:2px;border-radius:4px}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(14,124,115,.35);outline-offset:2px}
h1,h2,h3,h4{line-height:1.35;margin:0 0 .45em}
p{margin:0 0 1rem}
ul,ol{margin:0 0 1.25rem;padding-left:1.4rem}
.grid-x{display:flex;flex-wrap:wrap}
.grid-x>.cell{flex:0 0 100%;max-width:100%}
@media (min-width:1024px){
    .grid-x>.cell.large-8{flex:0 0 66.6667%;max-width:66.6667%}
    .grid-x>.cell.large-4{flex:0 0 33.3333%;max-width:33.3333%}
}
.grid-container{max-width:1280px;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}
.container{max-width:1280px;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}
.btn{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    font-weight:600;font-size:15px;line-height:1.2;
    padding:12px 22px;border-radius:8px;border:1px solid transparent;
    cursor:pointer;transition:all .2s ease;white-space:nowrap;
}
.btn svg,.btn i{font-size:15px}
.btn-primary{background:var(--ky-secondary);color:#262018;border-color:var(--ky-secondary)}
.btn-primary:hover{background:var(--ky-secondary-hover);color:#1E2B2E;border-color:var(--ky-secondary-hover);transform:translateY(-1px);box-shadow:var(--ky-shadow-hover)}
.btn-secondary{background:transparent;color:var(--ky-primary);border-color:var(--ky-primary)}
.btn-secondary:hover{background:rgba(14,124,115,.08);color:var(--ky-primary-dark);border-color:var(--ky-primary);transform:translateY(-1px)}
.btn-ghost{background:transparent;border-color:#d4dcda;color:var(--ky-ink)}
.btn-ghost:hover{border-color:var(--ky-primary);color:var(--ky-primary);transform:translateY(-1px)}
.btn-lg{font-size:17px;padding:14px 30px}
.btn-sm{font-size:14px;padding:10px 16px}
.btn .fa-arrow-right{margin-left:2px}
.site-header{
    position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);
    border-bottom:1px solid rgba(221,227,225,.75);box-shadow:0 1px 0 rgba(255,255,255,.8);
}
.header-inner{
    max-width:1360px;margin:0 auto;padding:0 24px;min-height:72px;
    display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px;
}
.brand{display:inline-flex;align-items:center;gap:10px;color:var(--ky-ink)}
.brand:hover{color:var(--ky-ink)}
.brandIcon{
    width:38px;height:38px;border-radius:10px;background:var(--ky-primary);color:#fff;
    display:inline-flex;align-items:center;justify-content:center;font-size:18px;flex:0 0 auto;
}
.brandWord{font-size:21px;font-weight:800;letter-spacing:.02em;line-height:1.2}
.brandWord small{font-size:14px;font-weight:600;color:#7a8a85;margin-left:2px;letter-spacing:.06em}
.main-nav{display:flex;justify-content:center;align-items:center;gap:2px}
.main-nav a{
    padding:9px 12px;font-size:15px;font-weight:500;color:var(--ky-ink);border-radius:8px;
    position:relative;white-space:nowrap;line-height:1.3;display:inline-flex;align-items:center;gap:5px;
}
.main-nav a i{font-size:13px;opacity:.9}
.main-nav a:hover{color:var(--ky-primary);background:rgba(14,124,115,.05)}
.main-nav a.active{color:var(--ky-primary-dark);font-weight:700}
.main-nav a.active::after{
    content:"";position:absolute;height:3px;width:22px;border-radius:2px;background:var(--ky-primary);left:50%;transform:translateX(-50%);bottom:1px;
}
.header-actions{display:flex;align-items:center;gap:10px;justify-content:flex-end}
.header-search{
    display:flex;align-items:center;background:#Eef1ef;border:1px solid #E2E8E5;border-radius:24px;
    height:36px;padding:0 8px 0 12px;font-size:14px;gap:6px;min-width:0;
}
.header-search i{color:var(--ky-muted);font-size:13px}
.header-search input{
    border:0;background:transparent;outline:0;font-size:14px;width:120px;color:var(--ky-ink);font-family:inherit;padding:0;
}
.header-search input::placeholder{color:#939d9a}
.header-search input:focus{outline:none;box-shadow:none}
.header-actions .btn-small{padding:9px 16px;font-size:14px}
.burger{
    display:none;width:40px;height:40px;border-radius:8px;border:1px solid var(--ky-line);
    background:#fff;color:var(--ky-ink);font-size:18px;cursor:pointer;align-items:center;justify-content:center;
}
.burger:hover{color:var(--ky-primary);border-color:var(--ky-primary)}
.mobile-drawer,.drawer-backdrop{display:none}
.articlePageHead{
    position:relative;padding:48px 0 32px;
    background:
        linear-gradient(180deg,rgba(247,247,242,.94) 0%,rgba(255,255,255,.98) 100%),
        url('/assets/images/backpic/back-1.png') center/cover;
    border-bottom:1px solid var(--ky-line);
}
.breadcrumbs{display:flex;flex-wrap:wrap;gap:7px;align-items:center;font-size:14px;color:var(--ky-muted);margin:0 0 20px}
.breadcrumbs a{color:var(--ky-muted)}
.breadcrumbs a:hover{color:var(--ky-primary)}
.breadcrumbs i{font-size:11px;color:#bbc4c1;margin:0 3px}
.breadcrumbs span{color:var(--ky-ink);max-width:440px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.articleTagLine{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.tagPill{
    display:inline-flex;align-items:center;background:rgba(14,124,115,.10);color:var(--ky-primary-dark);
    border-radius:999px;padding:5px 12px;font-size:13px;font-weight:600;letter-spacing:.02em;
}
.tagPill i{margin-right:5px;font-size:12px}
.tagStatic{font-size:13px;color:var(--ky-muted);display:inline-flex;align-items:center;gap:5px}
.articleTitle{
    font-size:42px;font-weight:800;line-height:1.22;color:var(--ky-ink);margin:0 0 18px;letter-spacing:-.01em;
    max-width:1000px;
}
.articleTitle .articleTitleOrg{
    display:block;font-size:15px;font-weight:600;letter-spacing:.12em;color:var(--ky-primary);margin-top:14px;
}
.articleMetaRow{display:flex;flex-wrap:wrap;gap:18px;margin-top:8px;color:var(--ky-muted);font-size:14px;align-items:center}
.articleMetaItem{display:inline-flex;align-items:center;gap:6px}
.articleMetaItem i{font-size:13px;color:var(--ky-primary)}
.articleMetaItem strong{color:var(--ky-ink);font-weight:600}
.articleLayout{padding:64px 0 18px}
.articleSideGap,.articleSide{padding:0 16px}
.articleCardBg{
    background:var(--ky-card);border:1px solid rgba(221,227,225,.9);border-radius:var(--ky-radius-lg);
    box-shadow:var(--ky-shadow-sm);
}
.articleBodyCard{padding:clamp(26px,5vw,60px)}
.articleBody{font-size:17px;line-height:1.95;color:#26373a}
.articleBody h2,.articleBody h3,.articleBody h4{color:var(--ky-ink);line-height:1.4}
.articleBody h2{font-size:27px;margin:2em 0 .85em;padding-left:14px;border-left:4px solid var(--ky-primary)}
.articleBody h3{font-size:21px;margin:1.8em 0 .7em}
.articleBody h4{font-size:17px;margin:1.4em 0 .4em}
.articleBody p{margin:0 0 1.3em;color:#2b3d40}
.articleBody ul{list-style:none;padding:0;margin:0 0 1.4em}
.articleBody ul li{position:relative;padding-left:24px;margin-bottom:8px;line-height:1.85}
.articleBody ul li::before{
    content:"";position:absolute;left:4px;top:12px;width:8px;height:8px;border-radius:50%;
    background:var(--ky-primary);opacity:.8;
}
.articleBody img{border-radius:14px;margin:1.7em auto;box-shadow:var(--ky-shadow-sm)}
.articleBody blockquote{
    margin:1.9em 0;padding:18px 24px;border-left:5px solid var(--ky-primary);background:rgba(14,124,115,.06);
    border-radius:0 10px 10px 0;color:#33464a;font-size:16px;line-height:1.9;
}
.articleBody blockquote p:last-child{margin-bottom:0}
.articleBody pre{
    background:#1e2b2e;color:#edf5ef;border-radius:12px;padding:18px 22px;margin:1.5em 0;overflow:auto;
    font-size:14px;font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;line-height:1.7;
}
.articleBody table{width:100%;border-collapse:collapse;margin:1.6em 0;border:1px solid var(--ky-line);border-radius:10px;overflow:hidden}
.articleBody th{background:var(--ky-primary-dark);color:#fff;font-weight:600;text-align:left;padding:11px 14px}
.articleBody td{border-top:1px solid var(--ky-line);padding:10px 14px;vertical-align:top}
.articleBody tr:nth-child(even) td{background:#fbfbf8}
.articleBody a{color:var(--ky-primary-dark)}
.articleBody a:hover{text-decoration:underline}
.articleBottomLink{
    display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:0 0 6px;
}
.articleBottomTool{
    display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding-top:24px;margin-top:30px;
    border-top:1px solid var(--ky-line);
}
.sidebarSection{
    background:var(--ky-card);border-radius:var(--ky-radius-lg);padding:28px 24px;
    box-shadow:var(--ky-shadow-sm);border:1px solid rgba(221,227,225,.9);margin-bottom:24px;
}
.sidebarSection h3{font-size:19px;font-weight:700;color:var(--ky-ink);display:flex;align-items:center;gap:8px;padding-bottom:12px;border-bottom:1px solid var(--ky-line);margin-bottom:16px}
.sidebarSection h3 i{color:var(--ky-primary);font-size:16px}
.sidebarSection p{font-size:15px;color:var(--ky-muted);line-height:1.85}
.sidebarLink{display:inline-block;margin-top:10px;font-weight:600;font-size:14px;color:var(--ky-primary)}
.sidebarLink:hover{color:var(--ky-primary-dark);text-decoration:underline}
.sidebarImageWrap{border-radius:11px;overflow:hidden;margin-bottom:16px}
.sidebarImageWrap img{width:100%;height:150px;object-fit:cover;background:var(--ky-line)}
.sideItemTags{display:flex;flex-wrap:wrap;gap:8px}
.sideItemTags a{
    font-size:13px;background:#eef3f1;color:var(--ky-ink);padding:4px 10px;border-radius:6px;line-height:1.5;border:1px solid transparent;
}
.sideItemTags a:hover{background:rgba(14,124,115,.1);color:var(--ky-primary-dark)}
.sideBomCard{background:var(--ky-primary-dark);border:0;color:#e7f3f0}
.sideBomCard h3{color:#fff;border-bottom:1px solid rgba(255,255,255,.22)}
.sideBomCard h3 i{color:#F2C57B}
.sideBomCard p{color:#d6e6e1}
.sideBomCard .btn{background:var(--ky-secondary);color:#262018;border-color:var(--ky-secondary);width:100%;margin-top:6px}
.sideBomCard .btn:hover{background:var(--ky-secondary-hover);color:#1E2B2E}
.alsoReadingWrap{
    display:flex;align-items:stretch;gap:0;overflow:hidden;border-radius:var(--ky-radius-lg);
    background:var(--ky-card);border:1px solid rgba(221,227,225,.9);box-shadow:var(--ky-shadow-sm);margin-top:30px;
}
.alsoReadingText{padding:30px 30px;flex:1}
.alsoEyebrow{display:inline-flex;align-items:center;gap:7px;color:var(--ky-primary);font-size:13px;font-weight:700;letter-spacing:.08em;margin-bottom:10px}
.alsoReadingText h2{font-size:23px;color:var(--ky-ink);line-height:1.4;margin-bottom:12px}
.alsoReadingText p{color:var(--ky-muted);font-size:15px;margin-bottom:20px}
.alsoReadingImage{flex:0 0 300px;position:relative;min-height:220px}
.alsoReadingImage img{width:100%;height:100%;object-fit:cover;background:#d9e2df;position:absolute;inset:0}
.notFoundWrap{padding:90px 24px;text-align:center;max-width:680px;margin:0 auto}
.notFoundWrap .notFoundIcon{width:90px;height:90px;border-radius:26px;background:rgba(14,124,115,.12);color:var(--ky-primary);display:flex;align-items:center;justify-content:center;margin:0 auto 26px;font-size:38px}
.notFoundWrap h1{font-size:36px;font-weight:800;margin-bottom:14px}
.notFoundWrap p{color:var(--ky-muted);font-size:17px;margin-bottom:28px}
.ctaBand{
    position:relative;margin-top:86px;padding:76px 0;color:#eef7f2;overflow:hidden;
    background:linear-gradient(120deg,rgba(13,63,60,.96),rgba(11,93,88,.93)),url('/assets/images/backpic/back-2.png') center/cover;
}
.ctaBandInner{display:flex;align-items:center;justify-content:space-between;gap:34px}
.ctaBandText h2{font-size:30px;color:#fff;margin-bottom:10px}
.ctaBandText p{color:#cfe2dd;font-size:16px;max-width:680px;margin-bottom:0}
.ctaBandAction{flex:0 0 auto}
.ctaBandAction .btn{background:var(--ky-secondary);color:#262018}
.ctaBandAction .btn:hover{background:var(--ky-secondary-hover);color:#1E2B2E;border-color:var(--ky-secondary-hover)}
.site-footer{background:var(--ky-primary-dark);color:#e8f1ee;padding-top:70px;font-size:15px}
.site-footer a{color:#cfe1dc}
.site-footer a:hover{color:#fff}
.footer-grid{display:grid;grid-template-columns:2.1fr 1fr 1fr 1.2fr;gap:42px;padding-bottom:52px}
.footer-brand-title{display:flex;align-items:center;gap:9px;font-size:20px;font-weight:800;color:#fff;line-height:1.3}
.footer-brand-title i{color:#F2C57B;font-size:20px}
.footer-brand-title small{font-weight:400;color:#a5c7c0;font-size:13px}
.footer-desc{color:#b6d4cc;margin-top:16px;line-height:1.9;font-size:15px}
.footer-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.footer-tags a{
    background:rgba(255,255,255,.08);padding:5px 12px;border-radius:999px;font-size:13px;color:#d8ece6;
    transition:all .2s;
}
.footer-tags a:hover{background:rgba(255,255,255,.18);color:#fff}
.footer-title{font-size:16px;font-weight:700;color:#fff;margin-bottom:18px;letter-spacing:.03em}
.footer-list{list-style:none;padding:0;margin:0}
.footer-list li{margin-bottom:10px}
.footer-list a{color:#b6d4cc}
.footer-list a:hover{color:#fff;padding-left:2px}
.footer-contact-list{list-style:none;padding:0;margin:0}
.footer-contact-list li{display:flex;align-items:flex-start;gap:10px;margin-bottom:14px;color:#cfdfda;line-height:1.6}
.footer-contact-list i{color:#F2C57B;margin-top:5px;font-size:13px;width:16px;text-align:center}
.footer-bottom{border-top:1px solid rgba(255,255,255,.13);padding:22px 0}
.footer-bottom-inner{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px;color:#93bab1}
.footer-bottom-inner p{margin:0}
@media (max-width:1180px){
    .main-nav a{padding:9px 8px;font-size:14px}
    .header-inner{gap:10px;grid-template-columns:auto 1fr auto}
}
@media (max-width:1024px){
    .main-nav{display:none}
    .header-inner{grid-template-columns:auto 1fr auto}
    .header-actions{gap:8px}
    .header-search input{width:100px}
    .burger{display:inline-flex}
    .mobile-drawer{
        position:fixed;z-index:1200;top:0;right:0;height:100%;width:min(80vw,340px);background:#fff;
        box-shadow:-10px 0 30px rgba(20,45,48,.15);transform:translateX(100%);transition:transform .3s ease;display:block;padding:22px;
        overflow-y:auto;
    }
    .mobile-drawer.is-open{transform:translateX(0);display:block}
    .drawer-backdrop{
        position:fixed;inset:0;background:rgba(16,38,42,.45);z-index:1100;display:block;opacity:0;visibility:hidden;transition:all .3s;
    }
    .drawer-backdrop.is-visible{opacity:1;visibility:visible}
    .drawer-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid var(--ky-line);margin-bottom:14px}
    .drawer-top strong{font-size:19px;color:var(--ky-ink)}
    .drawer-close{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;background:#f0f3f1;color:var(--ky-ink);border:0;border-radius:8px;cursor:pointer}
    .drawer-close:hover{color:var(--ky-primary)}
    .drawer-nav a{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 4px;border-bottom:1px solid #eff1ee;font-size:16px;color:var(--ky-ink);font-weight:500}
    .drawer-nav a.active{color:var(--ky-primary)}
    .drawer-contact{margin-top:26px;background:#f2f6f3;border-radius:12px;padding:18px}
    .drawer-contact p{font-size:13px;color:var(--ky-muted);margin-bottom:8px}
    .drawer-contact a{color:var(--ky-primary-dark);font-weight:600}
}
@media (max-width:768px){
    .header-inner{padding:0 16px;min-height:64px}
    .brandWord{font-size:19px}
    .header-actions .btn-primary span{display:none}
    .articlePageHead{padding:34px 0 26px}
    .articleTitle{font-size:30px}
    .articleBodyCard{padding:24px 20px}
    .articleBody{font-size:16px;line-height:1.9}
    .articleBody h2{font-size:22px}
    .ctaBand{margin-top:58px;padding:56px 0}
    .ctaBandInner{flex-direction:column;gap:24px;text-align:left}
    .ctaBandAction .btn{width:100%;justify-content:center}
    .site-footer{padding-top:50px}
    .footer-grid{grid-template-columns:1fr 1fr;gap:32px 22px;padding-bottom:34px}
    .footer-bottom-inner{flex-direction:column;align-items:flex-start;gap:6px}
    .alsoReadingImage{flex-basis:170px}
    .alsoReadingText h2{font-size:20px}
}
@media (max-width:520px){
    .articleLayout{padding:36px 0 8px}
    .header-search{display:none}
    .footer-grid{grid-template-columns:1fr}
    .alsoReading{flex-direction:column}
    .alsoReadingImage{flex:0 0 auto;min-height:150px;position:relative;width:100%}
    .alsoReadingImage img{position:relative;height:160px}
    .articleMetaRow{gap:10px 18px}
    .articleBottomTool,.articleBottomLink{flex-direction:column;align-items:stretch}
}

/* roulang page: category2 */
:root{
  --ky-primary:#0E7C73;
  --ky-primary-dark:#0B5D58;
  --ky-secondary:#E89A2B;
  --ky-secondary-deep:#D98B1E;
  --ky-bg:#F7F7F2;
  --ky-white:#ffffff;
  --ky-ink:#1E2B2E;
  --ky-muted:#6B777A;
  --ky-line:#DDE3E1;
  --ky-tint:#EFF5F0;
  --ky-soft:#E4EFEB;
  --radius:12px;
  --radius-lg:16px;
  --shadow:0 1px 2px rgba(20,45,48,.06),0 4px 12px rgba(20,45,48,.05);
  --shadow-hover:0 6px 18px rgba(20,45,48,.10);
  --font-sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--font-sans);
  font-size:16px;
  line-height:1.8;
  color:var(--ky-ink);
  background:var(--ky-bg);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6{
  color:var(--ky-ink);
  font-weight:700;
  line-height:1.35;
  margin:0 0 16px;
}
p{margin:0 0 16px}
a{
  color:var(--ky-primary);
  text-decoration:none;
  transition:color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
a:hover,a:focus-visible{color:var(--ky-primary-dark)}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{
  outline:3px solid rgba(14,124,115,.35);
  outline-offset:2px;
}
img{max-width:100%;display:block;border:0}
ul,ol{margin:0;padding:0;list-style:none}
button,input,select,textarea{
  font-family:var(--font-sans);
  font-size:100%;
}
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button{display:none}
.container{
  width:100%;
  max-width:1280px;
  margin:0 auto;
  padding:0 28px;
}
.section-block{padding:96px 0}
.section-white{background:var(--ky-white)}
.section-tint{background:var(--ky-tint)}
.section-head{
  max-width:860px;
  margin-bottom:48px;
}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center}
.section-head h2{
  font-size:34px;
  color:var(--ky-primary-dark);
  margin:8px 0 18px;
}
.section-head p{font-size:18px;color:var(--ky-muted)}
.section-lead{
  max-width:900px;
  margin:0 0 24px;
  color:var(--ky-muted);
  font-size:17px;
}
.kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  font-weight:700;
  letter-spacing:.08em;
  color:var(--ky-primary);
  background:rgba(14,124,115,.08);
  border:1px solid rgba(14,124,115,.12);
  border-radius:30px;
  padding:5px 14px;
  line-height:1.4;
  margin-bottom:8px;
}
.kicker .dot{
  width:6px;height:6px;border-radius:50%;background:var(--ky-primary);
}
.text-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:700;
  color:var(--ky-primary);
  margin-top:8px;
}
.text-link i{
  transition:transform .2s ease;
}
.text-link:hover i{transform:translateX(4px)}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius:8px;
  font-weight:700;
  font-size:15px;
  line-height:1.2;
  padding:12px 24px;
  border:1px solid transparent;
  cursor:pointer;
  transition:background .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.btn i{font-size:14px}
.btn-amber{
  background:var(--ky-secondary);
  color:#262018;
  border-color:var(--ky-secondary);
  box-shadow:0 4px 12px rgba(232,154,43,.18);
}
.btn-amber:hover{
  background:var(--ky-secondary-deep);
  color:#262018;
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(232,154,43,.24);
}
.btn-outline{
  background:transparent;
  color:var(--ky-primary-dark);
  border-color:rgba(14,124,115,.45);
}
.btn-outline:hover{
  background:rgba(14,124,115,.08);
  color:var(--ky-primary-dark);
  transform:translateY(-1px);
}
.btn-outline-light{
  background:rgba(255,255,255,.06);
  color:#ffffff;
  border-color:rgba(255,255,255,.55);
}
.btn-outline-light:hover{
  background:rgba(255,255,255,.14);
  color:#ffffff;
}
.btn-lg{padding:15px 30px;font-size:16px}
/* header */
.site-header{
  position:sticky;
  top:0;
  z-index:100;
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(1.2) blur(10px);
  border-bottom:1px solid rgba(221,227,225,.9);
  box-shadow:0 1px 0 rgba(20,45,48,.02);
}
.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:76px;
  gap:18px;
}
.brand-lockup{flex-shrink:0}
.brand-logo{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--ky-ink);
}
.brand-logo:hover{color:var(--ky-ink)}
.logo-mark{
  width:38px;height:38px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--ky-primary);
  color:#fff;
  border-radius:9px;
  font-size:18px;
  box-shadow:0 4px 10px rgba(14,124,115,.2);
}
.brand-text{
  font-size:20px;
  font-weight:800;
  color:var(--ky-ink);
  letter-spacing:.02em;
}
.brand-text small{
  font-size:13px;
  font-weight:400;
  color:#98A4A2;
  margin-left:2px;
  letter-spacing:.05em;
}
.main-nav{
  display:flex;
  align-items:center;
  gap:2px;
  flex-shrink:0;
  margin:0 auto;
}
.main-nav a{
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:#334246;
  font-size:15px;
  font-weight:600;
  border-radius:8px;
  padding:9px 13px;
  position:relative;
  white-space:nowrap;
}
.main-nav a i{
  font-size:13px;
  color:var(--ky-primary);
  opacity:.85;
}
.main-nav a:hover{
  color:var(--ky-primary-dark);
  background:rgba(14,124,115,.06);
}
.main-nav a.active{
  color:var(--ky-primary-dark);
}
.main-nav a.active::after{
  content:"";
  position:absolute;
  left:13px;right:13px;bottom:2px;
  height:3px;
  border-radius:4px;
  background:var(--ky-secondary);
}
.header-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-shrink:0;
  margin-right:-8px;
}
.header-search{
  display:flex;
  align-items:center;
  background:#F2F5F2;
  border:1px solid var(--ky-line);
  border-radius:30px;
  padding:0 4px 0 14px;
  overflow:hidden;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.header-search:focus-within{
  border-color:rgba(14,124,115,.45);
  box-shadow:0 0 0 4px rgba(14,124,115,.08);
}
.header-search input{
  width:132px;
  border:0;
  background:transparent;
  color:var(--ky-ink);
  padding:8px 8px;
  font-size:14px;
  outline:0;
}
.header-search button{
  border:0;
  width:32px;height:32px;
  border-radius:50%;
  background:var(--ky-primary);
  color:#fff;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
.header-search button:hover{background:var(--ky-primary-dark)}
.login-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--ky-muted);
  font-size:14px;
  font-weight:600;
  padding:8px 10px;
  border-radius:8px;
  white-space:nowrap;
}
.login-link:hover{
  color:var(--ky-primary-dark);
  background:rgba(14,124,115,.06);
}
.btn-header{
  white-space:nowrap;
}
.mobile-search-btn{
  display:none;
  width:38px;height:38px;
  border-radius:9px;
  border:1px solid var(--ky-line);
  background:#fff;
  color:var(--ky-ink);
  align-items:center;
  justify-content:center;
  font-size:15px;
  cursor:pointer;
}
.mobile-search-btn:hover{border-color:var(--ky-primary);color:var(--ky-primary)}
.nav-toggle{
  display:none;
  width:38px;height:38px;
  border-radius:9px;
  border:1px solid var(--ky-line);
  background:#fff;
  color:var(--ky-ink);
  align-items:center;
  justify-content:center;
  font-size:17px;
  cursor:pointer;
}
.nav-toggle:hover{border-color:var(--ky-primary);color:var(--ky-primary)}
.mobile-search-box{
  display:none;
}
/* hero */
.hero-panel{
  position:relative;
  background:linear-gradient(112deg, rgba(247,247,242,.97), rgba(235,246,242,.93)), url('/assets/images/backpic/back-1.png') center/cover no-repeat;
  border-bottom:1px solid rgba(221,227,225,.65);
  padding:108px 0 78px;
  overflow:hidden;
}
.hero-panel::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:radial-gradient(rgba(14,124,115,.14) 1px, transparent 1px);
  background-size:28px 28px;
  opacity:.18;
  mask-image:linear-gradient(90deg,transparent 20%,#000);
}
.hero-grid{position:relative;z-index:2}
.hero-copy{
  padding:20px 0;
}
.hero-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--ky-primary-dark);
  background:#fff;
  border:1px solid rgba(14,124,115,.16);
  box-shadow:var(--shadow);
  border-radius:40px;
  padding:6px 15px;
  font-size:14px;
  font-weight:600;
  margin-bottom:18px;
}
.hero-chip .chip-dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--ky-secondary);
  box-shadow:0 0 0 4px rgba(232,154,43,.16);
}
.hero-title{
  font-size:46px;
  line-height:1.25;
  font-weight:800;
  color:var(--ky-ink);
  margin:0 0 22px;
  letter-spacing:.01em;
  max-width:680px;
}
.hero-title .brand-block{
  color:var(--ky-primary-dark);
  position:relative;
  display:inline-block;
}
.hero-lead{
  font-size:18px;
  line-height:1.9;
  color:#445455;
  max-width:620px;
  margin-bottom:30px;
}
.hero-cta{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-bottom:28px;
}
.hero-note{
  display:flex;
  flex-wrap:wrap;
  gap:12px 22px;
  color:var(--ky-muted);
  font-size:14px;
  margin-top:6px;
}
.hero-note span{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.hero-note i{
  color:var(--ky-primary);
  font-size:13px;
}
.hero-media{
  background:#ECF1ED;
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:0 18px 42px rgba(20,45,48,.12);
  border:1px solid rgba(221,227,225,.7);
  position:relative;
  transform:rotate(0.2deg);
}
.hero-media img{
  width:100%;
  height:410px;
  object-fit:cover;
}
.media-tag{
  position:absolute;
  left:14px;
  top:14px;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(8px);
  border-radius:30px;
  padding:7px 13px;
  font-size:13px;
  font-weight:700;
  color:var(--ky-primary-dark);
  box-shadow:0 4px 10px rgba(20,45,48,.08);
}
/* overview table */
.sector-wrap{
  background:#fff;
  border:1px solid var(--ky-line);
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow);
}
.table-scroll{overflow-x:auto}
.sector-table{
  width:100%;
  min-width:820px;
  border-collapse:collapse;
  margin:0;
  background:#fff;
}
.sector-table th{
  background:var(--ky-primary-dark);
  color:#fff;
  text-align:left;
  padding:16px 18px;
  font-size:15px;
  letter-spacing:.02em;
  white-space:nowrap;
}
.sector-table td{
  padding:16px 18px;
  border-bottom:1px solid var(--ky-line);
  color:#3A464B;
  vertical-align:top;
  background:#fff;
}
.sector-table tr:last-child td{border-bottom:0}
.sector-table .cell-title{
  font-weight:800;
  color:var(--ky-ink);
  display:block;
  margin-bottom:4px;
}
.sector-table .cell-desc{
  color:var(--ky-muted);
  font-size:14px;
}
.sector-table .cell-tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:rgba(14,124,115,.08);
  color:var(--ky-primary-dark);
  border-radius:6px;
  padding:3px 9px;
  font-size:13px;
  font-weight:700;
}
.sector-table tr:hover td{
  background:#F8FBF8;
}
/* scene blocks */
.scene-block{
  position:relative;
}
.scene-wrap{
  padding:12px 0;
}
.scene-media{
  background:#E8EFEA;
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow);
  min-height:320px;
  position:relative;
}
.scene-media img{
  width:100%;
  height:340px;
  object-fit:cover;
  transition:transform .5s ease;
}
.scene-media:hover img{
  transform:scale(1.02);
}
.scene-copy{
  padding:8px 6px;
}
.scene-index{
  display:inline-block;
  font-size:44px;
  line-height:1;
  font-weight:800;
  color:rgba(14,124,115,.14);
  letter-spacing:.02em;
  margin-bottom:8px;
}
.scene-copy .kicker{
  margin-top:-10px;
}
.scene-copy h3{
  font-size:29px;
  color:var(--ky-ink);
  line-height:1.4;
  margin:10px 0 18px;
}
.scene-copy p{
  color:var(--ky-muted);
  font-size:16px;
  margin-bottom:20px;
}
.feature-list{
  margin-bottom:22px;
}
.feature-list li{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:8px 0;
  border-bottom:1px dashed var(--ky-line);
}
.feature-list li:last-child{border-bottom:0}
.feature-list i{
  color:var(--ky-primary);
  margin-top:6px;
  font-size:13px;
  flex:none;
}
.feature-list strong{
  color:var(--ky-ink);
  font-weight:700;
  display:block;
}
.feature-list span{
  color:var(--ky-muted);
  font-size:15px;
}
.scene-more{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}
/* metric */
.metric-band{
  background:var(--ky-primary-dark);
  color:#fff;
  padding:64px 0;
  position:relative;
  overflow:hidden;
}
.metric-band::before{
  content:"";
  position:absolute;
  inset:0;
  background:url('/assets/images/backpic/back-3.png') center/cover no-repeat;
  opacity:.1;
}
.metric-band .container{position:relative;z-index:2}
.metric-band .metric-grid{
  display:flex;
  flex-wrap:wrap;
  gap:0;
}
.metric-band .metric-item{
  text-align:center;
  padding:20px 16px;
  position:relative;
}
.metric-band .cell + .cell .metric-item{
  border-left:1px solid rgba(255,255,255,.14);
}
.metric-num{
  display:block;
  font-size:44px;
  font-weight:800;
  line-height:1.15;
  color:#fff;
  letter-spacing:.01em;
  margin-bottom:6px;
}
.metric-num small{
  font-size:20px;
  font-weight:800;
  margin-left:2px;
}
.metric-label{
  color:rgba(255,255,255,.78);
  font-size:14px;
  letter-spacing:.04em;
}
.metric-desc{
  display:block;
  color:rgba(255,255,255,.6);
  font-size:13px;
  margin-top:8px;
  letter-spacing:.02em;
}
/* process */
.process-grid{
  margin-top:50px;
}
.process-step{
  position:relative;
  background:#fff;
  border:1px solid var(--ky-line);
  border-radius:var(--radius);
  padding:26px;
  height:100%;
  box-shadow:var(--shadow);
  transition:transform .25s ease, box-shadow .25s ease;
}
.process-step:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-hover);
}
.process-no{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  background:var(--ky-primary);
  color:#fff;
  font-weight:800;
  border-radius:30px;
  margin-bottom:18px;
  font-size:15px;
}
.process-step h3{
  font-size:19px;
  color:var(--ky-primary-dark);
  margin-bottom:10px;
}
.process-step p{
  color:var(--ky-muted);
  font-size:15px;
  margin:0;
}
/* faq */
.faq-wrap{
  max-width:960px;
  margin:0 auto;
}
.faq-item{
  background:#fff;
  border:1px solid var(--ky-line);
  border-radius:var(--radius);
  margin-bottom:14px;
  overflow:hidden;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.faq-item[open]{
  box-shadow:var(--shadow);
  border-color:rgba(14,124,115,.28);
}
.faq-item summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding:18px 20px;
  font-weight:700;
  color:var(--ky-ink);
  font-size:17px;
  line-height:1.6;
  position:relative;
  user-select:none;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--ky-primary-dark)}
.faq-item summary .faq-toggle{
  margin-left:auto;
  color:var(--ky-primary);
  font-size:14px;
  flex:none;
  transition:transform .25s ease;
}
.faq-item[open] summary .faq-toggle{
  transform:rotate(180deg);
}
.faq-no{
  flex:none;
  background:rgba(14,124,115,.08);
  color:var(--ky-primary-dark);
  border-radius:8px;
  font-size:13px;
  font-weight:800;
  padding:3px 10px;
  margin-top:3px;
}
.faq-answer{
  padding:0 22px 22px;
  padding-left:74px;
}
.faq-answer p{
  color:var(--ky-muted);
  margin:0;
}
/* cta band */
.cta-band{
  background:var(--ky-primary-dark);
  color:#fff;
  padding:80px 0;
  margin-top:0;
  position:relative;
  overflow:hidden;
}
.cta-band::after{
  content:"";
  position:absolute;
  inset:0;
  background:url('/assets/images/backpic/back-2.png') center/cover no-repeat;
  opacity:.12;
}
.cta-inner{
  position:relative;
  z-index:2;
  display:flex;
  gap:40px;
  align-items:center;
  justify-content:space-between;
}
.cta-copy{
  max-width:720px;
}
.cta-copy h2{
  color:#fff;
  font-size:34px;
  line-height:1.35;
  margin-bottom:14px;
}
.cta-copy p{
  color:rgba(255,255,255,.82);
  font-size:17px;
  margin:0;
}
.cta-actions{
  display:flex;
  flex-direction:column;
  gap:12px;
  flex:none;
}
.cta-note{
  color:rgba(255,255,255,.6);
  font-size:14px;
}
/* footer */
.site-footer{
  background:var(--ky-primary-dark);
  color:rgba(255,255,255,.82);
  padding:68px 0 0;
  font-size:15px;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1.2fr;
  gap:46px;
  padding-bottom:48px;
}
.footer-brand-title{
  font-size:21px;
  font-weight:800;
  color:#fff;
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:12px;
}
.footer-brand-title i{
  width:32px;height:32px;
  border-radius:9px;
  background:#fff;
  color:var(--ky-primary-dark);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
}
.footer-brand-title small{
  font-size:13px;
  color:rgba(255,255,255,.56);
  font-weight:400;
}
.footer-desc{
  color:rgba(255,255,255,.68);
  line-height:1.85;
  margin-bottom:18px;
}
.footer-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.footer-tags a{
  display:inline-flex;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  color:rgba(255,255,255,.82);
  border-radius:30px;
  font-size:13px;
  padding:4px 12px;
  line-height:1.6;
  transition:background .2s ease,color .2s ease;
}
.footer-tags a:hover{
  background:rgba(255,255,255,.16);
  color:#fff;
}
.footer-title{
  color:#fff;
  font-size:16px;
  font-weight:700;
  margin-bottom:16px;
}
.footer-list li{
  margin-bottom:9px;
}
.footer-list a,.footer-contact-list li{
  color:rgba(255,255,255,.68);
  transition:color .2s ease;
}
.footer-list a:hover{
  color:#fff;
}
.footer-contact-list li{
  display:flex;
  gap:10px;
  align-items:flex-start;
  margin-bottom:11px;
  line-height:1.7;
}
.footer-contact-list i{
  color:#8ED5C9;
  margin-top:5px;
  font-size:14px;
  width:16px;
}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.14);
  padding:18px 0;
}
.footer-bottom-inner{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:8px 20px;
}
.footer-bottom p{
  margin:0;
  color:rgba(255,255,255,.58);
  font-size:13px;
}
@media (max-width:1100px){
  .main-nav{gap:0}
  .main-nav a{padding:9px 10px;gap:5px}
  .login-link{display:none}
}
@media (max-width:1023px){
  .header-actions .header-search{display:none}
}
@media (max-width:920px){
  .header-inner{min-height:68px}
  .main-nav{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    flex-direction:column;
    align-items:stretch;
    background:rgba(255,255,255,.98);
    border-bottom:1px solid var(--ky-line);
    box-shadow:0 14px 28px rgba(20,45,48,.1);
    padding:10px 18px 16px;
    margin:0;
  }
  .main-nav.is-open{display:flex}
  .main-nav a{
    border-bottom:1px solid #EEF2EF;
    padding:12px 10px;
    border-radius:0;
  }
  .main-nav a:last-child{border-bottom:0}
  .main-nav a.active::after{
    bottom:6px;
  }
  .header-actions{
    gap:6px;
    margin-right:-4px;
  }
  .mobile-search-btn{
    display:inline-flex;
  }
  .nav-toggle{
    display:inline-flex;
  }
  .login-link{
    display:none;
  }
  .mobile-search-box{
    display:block;
    max-height:0;
    overflow:hidden;
    padding:0 18px;
    transition:max-height .3s ease,padding .3s ease;
    background:#fff;
    border-bottom:0 solid var(--ky-line);
  }
  .site-header.is-search-open .mobile-search-box{
    max-height:80px;
    padding-top:4px;
    padding-bottom:14px;
    border-bottom-width:1px;
  }
  .mobile-search-box form{
    display:flex;
    align-items:center;
    gap:8px;
    border:1px solid var(--ky-line);
    border-radius:30px;
    background:#F5F6F3;
    padding:4px 4px 4px 14px;
  }
  .mobile-search-box input{
    flex:1;
    border:0;
    background:transparent;
    min-width:0;
    outline:0;
    color:var(--ky-ink);
  }
  .mobile-search-box button{
    flex:none;
    border:0;
    background:var(--ky-primary);
    color:#fff;
    border-radius:30px;
    height:34px;
    padding:0 14px;
    cursor:pointer;
  }
}
@media (max-width:640px){
  .container{padding-left:18px;padding-right:18px}
  .section-block{padding:54px 0}
  .brand-text{font-size:18px}
  .logo-mark{width:34px;height:34px}
  .brand-logo{gap:8px}
  .btn-header{padding:10px 16px;font-size:14px}
  .btn-amber{padding:12px 18px}
  .hero-panel{padding:54px 0 40px}
  .hero-title{font-size:30px}
  .hero-lead{font-size:16px}
  .hero-media img{height:260px}
  .section-head h2{font-size:26px}
  .scene-copy h3{font-size:23px}
  .scene-media img{height:230px}
  .metric-band .cell{
    flex:0 0 100%;
    max-width:100%;
  }
  .metric-band .cell + .cell .metric-item{border-left:0}
  .metric-num{font-size:34px}
  .faq-answer{padding-left:22px}
  .cta-band{padding:54px 0}
  .cta-inner{flex-direction:column;align-items:flex-start}
  .cta-copy h2{font-size:27px}
  .footer-grid{
    grid-template-columns:1fr 1fr;
    gap:38px 22px;
    padding-bottom:34px;
  }
  .footer-grid>div:first-child{
    grid-column:span 2;
  }
}
@media (max-width:420px){
  .hero-cta{
    flex-direction:column;
    align-items:stretch;
  }
  .hero-cta .btn{
    width:100%;
  }
  .section-head p{font-size:16px}
  .footer-grid{
    grid-template-columns:1fr;
  }
  .footer-grid>div:first-child{
    grid-column:span 1;
  }
}