/*
Theme Name: 开树生物官网 kaitree Bio
Theme URI: https://kaishubio.com
Description: 杭州开树生物科技有限公司官网主题（品牌：开树生物 kaitree Bio / 产品品牌 Velyfe）。蓝绿色调，含首页、关于我们、产品中心、技术讲解、成功案例、科研实力、联系我们 7 个页面模板。由豆包按公司框架文档制作。
Version: 1.0.0
Author: kaitree Bio
Author URI: https://kaishubio.com
Text Domain: kaishu-bio
Requires at least: 5.0
Tested up to: 6.5
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* ========== 基础 ========== */
:root {
  --teal: #0E9F9B;
  --teal-dark: #0B6E6E;
  --deep: #0A5C72;
  --grad: linear-gradient(135deg, #0A5C72 0%, #0E9F9B 100%);
  --bg-soft: #F4FAF9;
  --ink: #15383A;
  --ink-soft: #55706F;
  --line: #DDEDEC;
  --white: #ffffff;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  color: var(--ink);
  background: var(--white);
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden; /* 防止手机端装饰元素溢出产生横向滚动条 */
}
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; transition: color .2s; }
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.section { padding: 72px 0; }
.section-soft { background: var(--bg-soft); }
.text-center { text-align: center; }
.section-title { font-size: 32px; font-weight: 700; color: var(--ink); text-align: center; margin-bottom: 10px; }
.section-sub { text-align: center; color: var(--ink-soft); margin-bottom: 44px; font-size: 16px; }
.btn {
  display: inline-block; padding: 12px 30px; border-radius: 40px;
  background: var(--grad); color: #fff; font-size: 15px; font-weight: 600;
  border: none; cursor: pointer; transition: transform .2s, box-shadow .2s;
}
.btn:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(14,159,155,.35); }
.btn-outline { background: transparent; border: 1.5px solid rgba(255,255,255,.85); }
.btn-outline:hover { background: rgba(255,255,255,.15); }

/* ========== 顶部导航 ========== */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: linear-gradient(90deg, #ffffff 0%, #f0fafb 45%, #e0f3f4 100%);
  box-shadow: 0 2px 14px rgba(10,90,100,.14);
}
.site-header .container { display: flex; align-items: center; justify-content: space-between; height: 82px; }
.brand { display: flex; align-items: center; gap: 14px; color: #0A5C72; }
.brand img { height: 60px; width: auto; }
.brand-logo { height: 52px; width: auto; }
/* 导航中间：一排不同品种猫狗群像剪影（坐的、跑的、打闹的、玩的，沾满中间）；浅底上压成深青色线描 */
.nav-crew { flex: 1; min-width: 0; height: 56px; object-fit: contain; opacity: .5; margin: 0 14px; pointer-events: none; filter: brightness(0) opacity(.55); }
.brand .brand-name { font-size: 24px; font-weight: 700; letter-spacing: 1px; }
.brand .brand-name small { display: block; font-size: 12px; font-weight: 400; letter-spacing: 2px; opacity: .85; }
.main-nav ul { display: flex; gap: 28px; list-style: none; }
.main-nav a { color: #0A5C72; font-size: 15px; padding: 6px 0; border-bottom: 2px solid transparent; font-weight: 500; }
.main-nav a:hover, .main-nav .current-menu-item > a { border-bottom-color: #0D9488; color: #0D9488; }
.nav-toggle { display: none; background: none; border: none; color: #0A5C72; font-size: 26px; cursor: pointer; }

/* ========== Hero 横幅 ========== */
.hero {
  background:
    radial-gradient(1100px 520px at 82% 18%, rgba(90,210,230,.28), transparent 62%),
    radial-gradient(760px 480px at 8% 92%, rgba(50,150,190,.22), transparent 60%),
    linear-gradient(135deg, #0E7C8C 0%, #0A5C72 48%, #083F57 100%);
  color: #fff; padding: 84px 24px 70px;
  position: relative; overflow: hidden;
}
.hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px 130px),
    repeating-linear-gradient(0deg, rgba(255,255,255,.045) 0 1px, transparent 1px 130px);
}
.hero::after {
  content: ""; position: absolute; border-radius: 50%;
  border: 2px solid rgba(255,255,255,.16); width: 420px; height: 420px;
  right: -140px; bottom: -180px;
}
.hero .hero-bubbles { position: absolute; inset: 0; opacity: .5; pointer-events: none; }

/* Hero 左右分栏（方案二：左文字右宠物照片） */
.hero-split { text-align: left; }
.hero-inner { display: flex; align-items: center; justify-content: space-between; gap: 56px; position: relative; }
.hero-text { flex: 1.05; }
.hero-text h1 { font-size: 46px; font-weight: 800; letter-spacing: 4px; margin-bottom: 18px; line-height: 1.25; }
.hero-text .hero-sub { font-size: 16.5px; max-width: 560px; opacity: .95; margin: 0 0 34px; }
.hero-tagline { font-size: 18px; line-height: 1.8; opacity: .95; margin: 0 0 30px; letter-spacing: 1px; }
.hero-text .hero-actions { display: flex; gap: 16px; flex-wrap: wrap; }
.hero-badge { display: inline-block; background: rgba(255,255,255,.2); border-radius: 999px; padding: 8px 20px; font-size: 14px; letter-spacing: 1px; margin-bottom: 20px; }
/* Hero：整幅 16:9 长图完整展示，高度由图片比例决定；任意宽度下整图等比缩放、元素位置与桌面完全一致 */
.hero-full { position: relative; padding: 0; width: 100%; aspect-ratio: 16 / 9; background-size: 100% 100%; background-position: center; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; }
/* 桌面端：hero 占满一屏（屏幕高-导航），狗猫贴底即可完整落在可视区内 */
@media (min-width: 901px) {
  .hero-full { aspect-ratio: auto; height: calc(100vh - 82px); min-height: 560px; background-size: cover; background-position: center; }
}
.hero-full-inner { position: relative; z-index: 2; }
.hero-full h1 { font-size: clamp(18px, 2.6vw, 42px); font-weight: 800; letter-spacing: clamp(1px, 0.5vw, 8px); margin-bottom: clamp(8px, 1vw, 20px); color: #0a4d5e; text-shadow: 0 0 20px #fff, 0 0 40px #fff; }
.hero-full-sub { font-size: clamp(14px, 1.8vw, 34px); letter-spacing: clamp(1px, 0.25vw, 3px); margin-bottom: clamp(6px, 0.8vw, 14px); color: #0d7a8a; text-shadow: 0 0 12px #fff, 0 0 24px #fff; }
.hero-full-tags { font-size: clamp(12px, 1.35vw, 24px); font-weight: 700; letter-spacing: 1px; color: #0a5c72; text-shadow: 0 0 10px rgba(255,255,255,.8); }
.hero-media { flex: 1; max-width: 540px; position: relative; }
.hero-media img { width: 100%; border-radius: 26px; box-shadow: 0 30px 70px rgba(0,40,50,.4); border: 3px solid rgba(255,255,255,.28); }

/* Hero 底部功能入口（一排胶囊按钮） */
.hero-feats { display: flex; gap: 14px; margin-top: 40px; flex-wrap: wrap; position: relative; }
.hero-feats a {
  background: rgba(255,255,255,.13); border: 1px solid rgba(255,255,255,.32);
  padding: 10px 24px; border-radius: 30px; color: #fff; font-size: 14px;
  letter-spacing: 1px; backdrop-filter: blur(4px); transition: .25s;
}
.hero-feats a:hover { background: rgba(255,255,255,.28); transform: translateY(-2px); }

/* ========== 标题圆润粗体（阿里巴巴普惠体 Black，免费商用） ========== */
@font-face {
  font-family: 'PuHui';
  src: url('assets/fonts/puhui-black.woff2') format('woff2');
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}

/* ========== Hero 例图直用版（一体背景 + 两行超粗大字 + 底部入口排） ========== */
.hero-photo {
  position: relative; overflow: hidden; min-height: 960px;
  display: flex; align-items: center;
  background:
    linear-gradient(90deg, rgba(6,58,72,.6) 0%, rgba(6,58,72,.3) 24%, rgba(6,58,72,.08) 42%, transparent 48%),
    url('assets/hero-example.jpg') center / cover no-repeat;
}
.hero-photo::before, .hero-photo::after { display: none; }
.hero-photo .hero-cat {
  position: absolute; right: 0; bottom: 0; height: 100%; width: auto;
  z-index: 1; pointer-events: none;
  filter: drop-shadow(0 24px 40px rgba(0,30,48,.4)) drop-shadow(0 6px 14px rgba(0,30,48,.28));
}
.hero-photo .hero-inner { position: relative; z-index: 2; width: 100%; padding: 0 0 0 190px; }
.hero-photo .hero-text { max-width: 980px; }
.hero-photo .hero-text h1 {
  font-family: 'PuHui', "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  font-size: 124px; font-weight: 900; letter-spacing: 6px; line-height: 1.12;
  color: #fff; margin: 0;
  text-shadow: 0 6px 34px rgba(0,35,50,.65), 0 2px 8px rgba(0,35,50,.5);
}
.hero-photo .hero-text h1.h1-2 { margin-top: 4px; }
.hero-photo .hero-actions { display: flex; gap: 20px; flex-wrap: wrap; margin-top: 52px; }
.hero-photo .btn {
  display: inline-block; padding: 18px 80px; border-radius: 999px;
  background: #21b8d8; color: #fff; font-size: 17px; font-weight: 700;
  letter-spacing: 2px; box-shadow: 0 6px 22px rgba(20,120,150,.45);
  transition: transform .2s, box-shadow .2s;
}
.hero-photo .btn:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(20,120,150,.55); }
.hero-photo .btn-outline { background: transparent; border: 2px solid rgba(255,255,255,.8); }
.hero-photo .btn-outline:hover { background: rgba(255,255,255,.15); }
.hero-photo .hero-feats {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 3;
  display: flex; justify-content: center; align-items: center; gap: 14px; flex-wrap: wrap;
  padding: 18px 24px;
  background: rgba(5,45,58,.55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.hero-photo .hero-feats a {
  color: #fff; text-decoration: none; display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 24px; border-radius: 999px;
  background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2);
  font-size: 15px; letter-spacing: 1px;
  transition: background .2s;
}
.hero-photo .hero-feats a:hover { background: rgba(255,255,255,.26); }
.hero-photo .hero-feats .dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: linear-gradient(135deg, #6fe3f5, #2fb6d8);
  box-shadow: 0 0 8px rgba(111,227,245,.8);
}

/* 旧版居中 Hero 兼容 */
.hero.center { text-align: center; }
.hero.center h1 { font-size: 52px; letter-spacing: 6px; margin-bottom: 18px; }
.hero.center .hero-sub { margin: 0 auto 34px; }
.hero.center .hero-tags { display: flex; justify-content: center; gap: 16px; margin-bottom: 38px; flex-wrap: wrap; position: relative; }
.hero.center .hero-tags span { background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.35); padding: 8px 22px; border-radius: 30px; font-size: 14px; }
.hero.center .hero-actions { justify-content: center; }

/* ========== 板块通用卡片 ========== */
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.card {
  background: #fff; border: 1px solid var(--line); border-radius: 16px;
  padding: 28px; transition: transform .25s, box-shadow .25s;
}
.card:hover { transform: translateY(-5px); box-shadow: 0 16px 36px rgba(10,90,100,.10); }
.card .card-icon { width: 64px; height: 64px; border-radius: 18px; background: var(--bg-soft); display: flex; align-items: center; justify-content: center; font-size: 28px; margin-bottom: 18px; }
.card h3 { font-size: 19px; margin-bottom: 10px; color: var(--ink); }
.card p { color: var(--ink-soft); font-size: 14.5px; }

/* 首页数据条 */
.home-stats { background: #fff; border-bottom: 1px solid var(--line); padding: 28px 0; }
.home-stats .container { display: flex; justify-content: center; gap: 60px; flex-wrap: wrap; }
.home-stat { text-align: center; }
.home-stat b { font-size: 36px; font-weight: 800; color: var(--teal-dark); display: block; line-height: 1.2; }
.home-stat span { color: var(--ink-soft); font-size: 13px; }

/* 联系CTA背景图 */
.cta-banner { position: relative; padding: 80px 0; text-align: center; color: #fff; overflow: hidden; }
.cta-banner::before { content:''; position:absolute; inset:0; background: linear-gradient(135deg, rgba(8,40,50,.85), rgba(13,80,95,.8)); z-index: 1; }
.cta-banner > .container { position: relative; z-index: 2; }
.cta-banner .cta-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }

/* 数据条 */
.stat-row { display: flex; justify-content: space-between; max-width: 900px; margin: 36px auto 0; gap: 16px; flex-wrap: wrap; }
.stat { flex: 1; min-width: 150px; text-align: center; }
.stat b { font-size: 40px; font-weight: 800; color: var(--teal-dark); display: block; line-height: 1.2; }
.stat span { color: var(--ink-soft); font-size: 14px; }

/* 产品卡片 */
.product-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.product-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; transition: transform .25s, box-shadow .25s; }
.product-card:hover { transform: translateY(-5px); box-shadow: 0 16px 36px rgba(10,90,100,.12); }
.product-card .pc-scene { height: 170px; overflow: hidden; position: relative; }
.product-card .pc-scene img { width: 100%; height: 100%; object-fit: cover; display: block; }
.product-card .pc-img { height: 130px; background: #fff; display: flex; align-items: center; justify-content: center; margin-top: -24px; position: relative; z-index: 2; border-radius: 16px 16px 0 0; }
.product-card .pc-img img { max-height: 110px; max-width: 82%; object-fit: contain; }
.product-card .pc-body { padding: 22px; }
.product-card h3 { font-size: 18px; margin-bottom: 8px; }
.product-card p { font-size: 13.5px; color: var(--ink-soft); }

/* 案例对比 */
.case-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }

/* 案例大卡片（横向交替布局） */
.case-big { position: relative; display: grid; grid-template-columns: 1fr 1fr; background: #fff; border-radius: 18px; overflow: hidden; box-shadow: 0 8px 30px rgba(10,90,100,.08); margin-bottom: 36px; }
.case-big.reverse { direction: rtl; }
.case-big.reverse > * { direction: ltr; }
.case-big .cb-num { position: absolute; top: 8px; right: 24px; font-size: 72px; font-weight: 900; color: var(--teal); opacity: .12; z-index: 0; line-height: 1; font-family: Arial, sans-serif; }
.case-big.reverse .cb-num { right: auto; left: 24px; }
.case-big .cb-img { position: relative; z-index: 1; background: #f4f6f6; display: flex; align-items: center; justify-content: center; padding: 24px; min-height: 300px; }
.case-big .cb-pair { display: flex; gap: 14px; width: 100%; align-items: stretch; }
.case-big .cb-pair figure { margin: 0; position: relative; flex: 1; min-width: 0; display: flex; align-items: center; justify-content: center; background: #fff; border-radius: 10px; padding: 12px; }
.case-big .cb-pair img { width: 100%; height: auto; max-height: 420px; object-fit: contain; display: block; border-radius: 8px; cursor: zoom-in; }
.case-big .cb-single { margin: 0; position: relative; width: 100%; }
.case-big .cb-single img { width: 100%; height: auto; max-height: 300px; object-fit: contain; display: block; cursor: zoom-in; }
.case-big figcaption { position: absolute; left: 8px; top: 8px; background: rgba(10,60,70,.7); color: #fff; font-size: 12px; padding: 2px 10px; border-radius: 12px; z-index: 2; }
.case-big .cb-text { padding: 36px 44px; display: flex; flex-direction: column; justify-content: center; position: relative; z-index: 1; }
.case-big .cb-text h3 { font-size: 24px; margin-bottom: 14px; color: var(--ink); }
.case-big .cb-text p { font-size: 15px; line-height: 1.85; color: var(--ink-soft); }
@media (max-width: 768px) {
  .case-big { grid-template-columns: 1fr; }
  .case-big.reverse { direction: ltr; }
  /* 对比图保持左右并排（各占一半），避免上下堆叠导致页面过长 */
  .case-big .cb-pair { flex-direction: row; }
  .case-big .cb-img { min-height: 200px; padding: 12px; }
  .case-big .cb-pair img { max-height: 260px; }
  .case-big .cb-single img { max-height: 220px; }
  .case-big .cb-text { padding: 22px 20px; }
  .case-big .cb-text h3 { font-size: 19px; }
  .case-big .cb-num { font-size: 48px; top: 4px; right: 14px; }
}

/* 首页案例小卡片 */
.case-card .cc-img { display: flex; gap: 10px; padding: 12px; background: #f4f6f6; align-items: stretch; }
.case-card .cc-img figure { margin: 0; position: relative; flex: 1; min-width: 0; display: flex; align-items: center; justify-content: center; background: #fff; border-radius: 10px; padding: 8px; }
.case-card .cc-img img { width: 100%; height: auto; max-height: 240px; object-fit: contain; display: block; border-radius: 8px; cursor: zoom-in; }
.case-card .cc-img.single figure { display: block; padding: 0; background: none; }
.case-card .cc-img.single img { max-height: 300px; }
.case-card .cc-img figcaption { position: absolute; left: 8px; top: 8px; background: rgba(10,60,70,.75); color: #fff; font-size: 12px; padding: 2px 10px; border-radius: 12px; }
.case-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
.case-card .cc-body { padding: 18px 22px; }
.case-card h3 { font-size: 17px; margin-bottom: 6px; }
.case-card p { font-size: 13.5px; color: var(--ink-soft); }

/* 灯箱 */
.lightbox { position: fixed; inset: 0; background: rgba(5,20,25,.92); z-index: 99999; display: none; align-items: center; justify-content: center; cursor: zoom-out; }
.lightbox.open { display: flex; }
.lightbox img { max-width: 94vw; max-height: 86vh; object-fit: contain; border-radius: 10px; box-shadow: 0 24px 80px rgba(0,0,0,.6); }
.lightbox .lb-cap { position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%); color: #fff; font-size: 14px; background: rgba(0,0,0,.55); padding: 8px 20px; border-radius: 20px; white-space: nowrap; }

/* 表格 */
.table-wrap { overflow-x: auto; margin: 20px 0; border-radius: 14px; border: 1px solid var(--line); }
table.cmp { width: 100%; border-collapse: collapse; min-width: 640px; font-size: 14px; }
table.cmp th { background: var(--grad); color: #fff; padding: 14px 16px; text-align: left; font-weight: 600; }
table.cmp th:first-child { border-radius: 0; }
table.cmp td { padding: 13px 16px; border-top: 1px solid var(--line); vertical-align: top; }
table.cmp td:first-child { background: var(--bg-soft); font-weight: 600; width: 140px; }
table.cmp tr:hover td { background: #F0FAF8; }
table.cmp tr:hover td:first-child { background: #E7F5F2; }
.tag-ok { color: var(--teal-dark); font-weight: 700; }
.tag-mid { color: #B07A1E; font-weight: 700; }
.tag-risk { color: #C0443A; font-weight: 700; }

/* 技术板块（左右分栏：左宠物图 + 右技术卡片） */
.tech-split-section { background: #fff; padding: 80px 0; }
.tech-split { display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; align-items: center; max-width: 1060px; margin: 30px auto 0; }
.tech-split-img { border-radius: 20px; overflow: hidden; box-shadow: 0 20px 50px rgba(10,90,100,.15); }
.tech-split-img img { width: 100%; height: 500px; object-fit: cover; display: block; }
/* DNA动画 */
/* DNA动画 */
.dna-stage { width: 100%; height: 520px; border-radius: 20px; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; }
.dna-svg { width: 140px; height: 420px; position: relative; z-index: 1; transform: rotate(-8deg); animation: dnaFloat 4s ease-in-out infinite; filter: drop-shadow(0 4px 14px rgba(10,90,100,.35)); }
@keyframes dnaFloat { 0%,100%{ transform: translateY(0) rotate(-8deg); } 50%{ transform: translateY(-14px) rotate(-8deg); } }
/* 纳米囊泡小球 */
.dna-vesicle { position: absolute; border-radius: 50%; background: radial-gradient(circle at 32% 30%, rgba(33,184,216,.85), rgba(13,148,136,.55) 60%, rgba(13,148,136,.25)); box-shadow: 0 2px 10px rgba(13,148,136,.35), inset 0 0 5px rgba(255,255,255,.35); animation: vesicleFloat 6s ease-in-out infinite; z-index: 2; }
@keyframes vesicleFloat { 0%,100%{ transform: translateY(0) scale(1); } 50%{ transform: translateY(-16px) scale(1.08); } }
/* 微粒子 */
.dna-dot { position: absolute; border-radius: 50%; background: rgba(13,148,136,.55); animation: dotTwinkle 2.6s ease-in-out infinite; }
@keyframes dotTwinkle { 0%,100%{ opacity:.15; transform: scale(.8); } 50%{ opacity:.95; transform: scale(1.25); } }
/* 小标签 */
.dna-tag { position: absolute; font-size: 11px; color: var(--teal-dark); border: 1px solid rgba(13,148,136,.45); border-radius: 10px; padding: 3px 10px; background: rgba(13,148,136,.08); z-index: 2; letter-spacing: 1px; font-weight: 600; }
.tech-split-cards { display: flex; flex-direction: column; gap: 16px; }
.ts-card { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 24px 28px; display: flex; gap: 18px; align-items: flex-start; transition: all .3s; }
.ts-card:hover { transform: translateX(8px); box-shadow: 0 10px 30px rgba(10,90,100,.1); border-color: var(--teal); }
.ts-card .ts-num { font-size: 34px; font-weight: 900; color: var(--teal); opacity: .22; line-height: 1; flex-shrink: 0; font-family: Arial, sans-serif; transition: all .35s; }
.ts-card:hover .ts-num { opacity: 1; color: var(--teal-dark); transform: scale(1.08); }
.ts-card h4 { font-size: 18px; margin-bottom: 6px; color: var(--ink); }
.ts-card p { font-size: 13.5px; line-height: 1.7; color: var(--ink-soft); margin: 0; }
@media (max-width: 900px) {
  .tech-split { grid-template-columns: 1fr; gap: 30px; }
  .tech-split-img img { height: 360px; }
}

/* 列表 */
.check-list { list-style: none; }
.check-list li { padding: 6px 0 6px 26px; position: relative; color: var(--ink-soft); }
.check-list li::before { content: "✓"; position: absolute; left: 0; color: var(--teal); font-weight: 700; }

/* 合规声明 */
.compliance {
  background: var(--bg-soft); border-left: 4px solid var(--teal);
  padding: 18px 22px; border-radius: 0 12px 12px 0; font-size: 13px; color: var(--ink-soft); margin: 32px 0;
}
.compliance b { color: var(--teal-dark); }

/* 页脚 */
.site-footer { position: relative; z-index: 5; background: #073F4E; color: rgba(255,255,255,.82); padding: 48px 0 30px; font-size: 14px; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 36px; margin-bottom: 30px; }
.site-footer h4 { color: #fff; font-size: 16px; margin-bottom: 14px; }
.site-footer ul { list-style: none; }
.site-footer li { margin-bottom: 8px; }
.site-footer a:hover { color: #fff; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.15); padding-top: 20px; text-align: center; font-size: 12.5px; color: rgba(255,255,255,.55); }
/* 页脚二维码 + 社交圆图标 */
.qr-box { margin-top: 16px; }
.qr-pop { width: 128px; height: 128px; object-fit: cover; border-radius: 10px; background: #fff; padding: 6px; cursor: zoom-in; transition: transform .2s, box-shadow .2s; }
.qr-pop:hover { transform: scale(1.06); box-shadow: 0 8px 24px rgba(0,0,0,.35); }
.qr-tip { font-size: 12.5px; margin-top: 8px; opacity: .75; }
.qr-social { display: flex; gap: 16px; margin-top: 18px; }
.qr-item { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.qr-label { font-size: 12.5px; opacity: .75; }
/* 点击弹出的方形二维码小方块 */
.qr-pop { display: none; position: absolute; bottom: calc(100% + 10px); left: 50%; transform: translateX(-50%); z-index: 50; }
.qr-pop img { width: 110px; height: 110px; object-fit: contain; background: #fff; padding: 6px; border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,.35); display: block; }
.qr-item:hover .qr-pop, .qr-item:focus-within .qr-pop { display: block; }
.qr-circle { width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(255,255,255,.35); display: flex; align-items: center; justify-content: center; font-size: 13px; color: #fff; text-decoration: none; transition: all .2s; cursor: pointer; }
.qr-circle:hover { background: rgba(255,255,255,.16); transform: translateY(-2px); }

/* ========== 宠物元素装饰 ========== */
.paw-divider { text-align: center; font-size: 26px; letter-spacing: 14px; color: var(--teal); margin: -8px 0 30px; opacity: .75; }

/* 追逐叙事装饰带：首页追得最远，越往后越近，联系我们追到 */
.chase { position: absolute; bottom: 10px; left: 0; right: 0; height: 58px; pointer-events: none; z-index: 1; }
.chase .chase-prey { position: absolute; left: 12%; bottom: 0; height: 42px; width: auto; opacity: .85; }
.chase .chase-runner { position: absolute; left: var(--chase-left, 78%); bottom: 0; height: 50px; width: auto; opacity: .85; transform: scaleX(-1); }
.chase .chase-ball { position: absolute; left: 12%; bottom: 4px; width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,.85); box-shadow: 0 0 0 4px rgba(255,255,255,.22), 0 4px 10px rgba(0,0,0,.12); }
.chase .chase-caption { position: absolute; right: 14%; bottom: 4px; font-size: 12px; color: rgba(255,255,255,.55); letter-spacing: 1px; }
@media (max-width: 768px) {
  .chase { height: 42px; }
  .chase .chase-prey { height: 30px; }
  .chase .chase-runner { height: 36px; }
  .chase .chase-ball { width: 26px; height: 26px; bottom: 2px; }
  .chase .chase-caption { display: none; }
}

/* 关于页：公司简介左右分栏 + 研发环境画廊（内联样式改为 class，补全响应式） */
.about-split { display: grid; grid-template-columns: 1.4fr 1fr; gap: 36px; align-items: center; max-width: 1000px; margin: 0 auto; }
.about-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; max-width: 960px; margin: 0 auto; }
.about-gallery .ag-wide { grid-column: span 2; }
@media (max-width: 768px) {
  .about-split { grid-template-columns: 1fr; gap: 24px; }
  .about-gallery { grid-template-columns: 1fr 1fr; gap: 12px; }
  .about-gallery img { height: 140px !important; }
}

/* 页面头部 */
.page-hero { background: var(--grad); color: #fff; padding: 56px 24px; text-align: center; position: relative; overflow: hidden; }
/* 各子页专属整幅横幅剪影装饰（和内容相关） */
.page-hero .hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; opacity: .18; pointer-events: none; }
.page-hero h1 { font-size: 34px; letter-spacing: 3px; margin-bottom: 8px; position: relative; z-index: 1; }
.page-hero p { opacity: .9; font-size: 15px; position: relative; z-index: 1; }
.page-hero .hero-deco { position: absolute; bottom: -30px; opacity: .15; pointer-events: none; }
.page-hero .hero-deco.cat { left: -20px; width: 240px; transform: rotate(6deg); }
.page-hero .hero-deco.dog { right: -20px; width: 260px; transform: scaleX(-1) rotate(-6deg); }
@media (max-width: 768px) {
  .page-hero { padding: 40px 24px; }
  .page-hero .hero-deco.cat { width: 150px; }
  .page-hero .hero-deco.dog { width: 160px; }
}

/* 联系信息 */
.contact-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.contact-card { text-align: center; padding: 34px 20px; }
.contact-card .card-icon { margin: 0 auto 16px; }
.contact-card h3 { font-size: 17px; margin-bottom: 8px; }
.contact-card p { color: var(--ink-soft); font-size: 15px; }

/* ========== 响应式 ========== */
@media (max-width: 960px) {
  .grid-4, .product-cards, .contact-cards { grid-template-columns: repeat(2, 1fr); }
  .grid-3, .case-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .nav-toggle { display: block; }
  .nav-chase { display: none; }
  .nav-crew { display: none; }
  .main-nav { position: fixed; top: 82px; left: 0; right: 0; background: #0A5C72; display: none; padding: 12px 24px 20px; }
  .main-nav.open { display: block; }
  .main-nav ul { flex-direction: column; gap: 14px; }
  .main-nav a { color: rgba(255,255,255,.92); }
  .main-nav a:hover, .main-nav .current-menu-item > a { border-bottom-color: #fff; color: #fff; }
  .hero { padding: 56px 24px 64px; }
  .hero-inner { flex-direction: column; gap: 32px; }
  .hero-media { order: -1; max-width: 100%; }
  .hero-text h1 { font-size: 32px; letter-spacing: 3px; }
  .hero-photo { min-height: 620px; }
  .hero-photo .hero-inner { padding: 0 0 0 24px; }
  .hero-photo .hero-text h1 { font-size: 52px; letter-spacing: 6px; }
  .hero-photo .hero-actions { margin-top: 28px; }
  .hero-photo .hero-feats { gap: 8px; padding: 12px 10px; }
  .hero-photo .hero-feats a { padding: 9px 14px; font-size: 13px; }
  .grid-2 { grid-template-columns: 1fr; }
  .grid-4, .product-cards { grid-template-columns: 1fr 1fr; }
  .grid-3, .case-grid, .contact-cards { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .section { padding: 52px 0; }
  .section-title { font-size: 26px; }
}
.hero-pet { position: absolute; left: 4%; bottom: 0; width: 320px; z-index: 1; pointer-events: none; }
.hero-cat-pet { left: 200px !important; width: 240px !important; bottom: 0 !important; }
.hero-full h1 { font-size: clamp(22px, 3.4vw, 58px) !important; }

.hero-full .hero-actions { display:flex; gap:clamp(10px, 1.4vw, 24px); justify-content:center; margin-top:clamp(10px, 1.6vw, 28px); }
.hero-full .btn { padding: clamp(8px, 0.9vw, 16px) clamp(22px, 2.6vw, 48px); font-size: clamp(13px, 1vw, 18px); border-radius: 999px; }
.hero-full-inner { padding-left: 8%; text-align: left; }




.hero-full .btn-outline { background: #0d7a8a !important; color: #fff !important; border-color: #0d7a8a !important; }
.hero-full-inner { display: inline-block; }
.hero-full .btn-outline { background: #f59e0b !important; border-color: #f59e0b !important; color: #fff !important; }




.home-pet { position: absolute; right: 0; bottom: 0; height: 50%; z-index: 2; pointer-events: none; }

@media (max-width: 900px) {
  .site-header { padding: 0 12px !important; min-height: 25px !important; }
  .brand-logo { max-height: 50px !important; width: auto !important; }
  .hero-full { aspect-ratio: 16 / 9; }
  .hero-full-inner { text-align: center !important; padding: 40px 8px 0 !important; max-width: 100%; width: 100%; }
  .hero-full h1 { font-size: 13px !important; letter-spacing: 0 !important; white-space: nowrap !important; line-height: 1.2; }
  .hero-full-sub { font-size: 10px !important; }
  .hero-full-tags { font-size: 4px !important; margin-bottom: 18px !important; }
  .hero-pet-tag { font-size: 5px !important; letter-spacing: 1px !important; margin: 0 0 4px !important; }
  .hero-full h1 { margin-bottom: 2px !important; line-height: 1.1; }
  .hero-full-sub { margin-bottom: 2px !important; line-height: 1.1; }
  .hero-full-tags { margin-bottom: 2px !important; line-height: 1.1; }
  .hero-full .btn { padding: 2px 6px !important; font-size: 8px !important; min-width: 60px !important; text-align: center !important; }
  .home-pet { height: 40% !important; }
  .home-birds { bottom: 31% !important; right: 18% !important; width: 8% !important; }
  
}

.pet-badge { position: absolute; right: 32%; bottom: 30px; z-index: 3; background: rgba(255,255,255,.9); color: #0d7a8a; font-weight: 700; font-size: 16px; padding: 10px 22px; border-radius: 999px; letter-spacing: 2px; box-shadow: 0 4px 16px rgba(0,60,80,.2); }

/* ========== 手机端响应式（参考觅投克风格） ========== */
@media (max-width: 720px) {
  /* Hero 手机端布局统一由上方 max-width:900px 断点管理 */

  /* 数据条：与桌面一致 5 列一行，仅缩小字号 */
  .home-stats { padding: 20px 0; }
  .home-stats .container { display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; justify-items: center; }
  .home-stat b { font-size: 13px; }
  .home-stat span { font-size: 9px; }

  /* 浙大团队：单列，图全宽在上、文字在下（与原始版一致） */
  .grid-2 { grid-template-columns: 1fr; gap: 18px; align-items: center; }
  .grid-2 > div { min-width: 0; }
  .grid-2 img[style*="height:380px"] { height: 200px !important; }
  .grid-2 img[style*="height:140px"] { height: 110px !important; }
  .section-title { font-size: 18px; }
  .section-sub { font-size: 13px; margin-bottom: 22px; }
  .check-list { font-size: 12px; }
  .stat-row { justify-content: flex-start !important; gap: 18px; flex-wrap: nowrap; }
  .stat { min-width: 0; }
  .stat b { font-size: 16px; }
  .stat span { font-size: 10px; }

  /* 产品：与桌面一致 2 列（桌面 4 列），仅缩小卡片尺寸 */
  .product-cards { grid-template-columns: 1fr 1fr; gap: 12px; }
  .product-card { border-radius: 12px; }
  .product-card .pc-scene { height: 120px; }
  .product-card .pc-img { height: 72px; margin-top: -14px; }
  .product-card .pc-img img { max-height: 60px; }
  .pc-body { padding: 10px 10px 14px; }
  .pc-body h3 { font-size: 14px; margin-bottom: 5px; }
  .pc-body p { font-size: 11px; }

  /* 技术：左右变上下（tech-split 为 grid，900px 断点已设为 1 列，这里仅收紧间距） */
  .tech-split { gap: 28px; }
  .dna-stage { min-height: 280px; }
  .dna-svg { height: 240px; }
  .ts-card { padding: 16px; }
  .ts-num { font-size: 26px; }
  .ts-card h4 { font-size: 15px; }
  .ts-card p { font-size: 13px; }

  /* 案例：3列变1列 */
  .case-grid { grid-template-columns: 1fr; gap: 24px; }
  .cc-img figure img { height: 180px; }
  .cc-body h3 { font-size: 16px; }
  .cc-body p { font-size: 13px; }

  /* CTA */
  .cta-banner { padding: 44px 20px; }
  .cta-banner h2 { font-size: 22px !important; }
  .cta-banner p { font-size: 14px; }

  /* 通用 */
  .section { padding: 48px 0; }
  .container { padding: 0 18px; }
  .paw-divider { font-size: 20px; letter-spacing: 10px; }
}

/* 手机端：对比表格从“横向滚动”改为“卡片式堆叠”，内容全部可见、无需横滑 */
@media (max-width: 767px) {
  .table-wrap { overflow: visible; border: none; margin: 0; }
  table.cmp, table.cmp tbody, table.cmp tr, table.cmp td { display: block; width: 100%; min-width: 0; }
  table.cmp thead { display: none; }
  table.cmp tr {
    margin-bottom: 14px;
    border: 1px solid var(--line);
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
  }
  table.cmp td { border-top: 1px solid var(--line); padding: 10px 14px; font-size: 13.5px; }
  table.cmp td:first-child { border-top: none; background: var(--bg-soft); font-weight: 700; width: auto; }
  /* 给每个对比项补上列名标签，避免表头隐藏后对不上号 */
  table.cmp td:nth-child(2)::before { content: "干细胞纳米囊泡（NVs）"; display: block; font-size: 11px; color: var(--teal-dark); font-weight: 700; margin-bottom: 2px; }
  table.cmp td:nth-child(3)::before { content: "天然外泌体（Exosomes）"; display: block; font-size: 11px; color: #B07A1E; font-weight: 700; margin-bottom: 2px; }
  table.cmp td:nth-child(4)::before { content: "完整间充质干细胞（MSCs）"; display: block; font-size: 11px; color: #C0443A; font-weight: 700; margin-bottom: 2px; }
}


/* ===== 公司动态 / 新闻列表 ===== */
.news-list{max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:18px;}
.news-item{display:flex;gap:26px;background:#fff;border:1px solid #e8f1f3;border-radius:16px;padding:24px 28px;transition:box-shadow .25s,transform .25s;}
.news-item:hover{box-shadow:0 10px 30px rgba(14,159,155,.12);transform:translateY(-2px);}
.news-date{flex:0 0 92px;color:#0e9f9b;font-weight:700;font-size:15px;line-height:1.45;}
.news-body h3{margin:0 0 8px;font-size:19px;line-height:1.4;}
.news-body h3 a{color:#0d2b33;text-decoration:none;}
.news-body h3 a:hover{color:#0e9f9b;}
.news-body p{color:#5b7480;font-size:14.5px;margin:0 0 10px;line-height:1.7;}
.news-more{color:#0e9f9b;font-size:14px;font-weight:600;text-decoration:none;}
.news-pager{margin-top:34px;text-align:center;}
.news-pager .page-numbers{display:inline-block;padding:6px 14px;margin:0 3px;border-radius:8px;border:1px solid #d7e7ea;color:#0e9f9b;text-decoration:none;}
.news-pager .current{background:#0e9f9b;color:#fff;border-color:#0e9f9b;}
@media(max-width:720px){
  .news-item{flex-direction:column;gap:8px;padding:18px 20px;}
  .news-date{flex:none;font-size:14px;}
  .news-body h3{font-size:17px;}
}


/* ===== 导航子菜单下拉 ===== */
.main-nav .menu-item-has-children{position:relative;}
.main-nav .sub-menu{display:none;position:absolute;top:100%;left:0;background:#fff;min-width:150px;list-style:none;padding:8px 0;margin:0;border-radius:0 0 12px 12px;box-shadow:0 10px 28px rgba(10,92,114,.16);z-index:60;flex-direction:column;gap:0;}
.main-nav .sub-menu li{width:100%;}
.main-nav .sub-menu a{display:block;padding:9px 20px;font-size:14px;border-bottom:none !important;white-space:nowrap;line-height:1.4;}
.main-nav .sub-menu a:hover{background:#eef7f8;color:#0D9488;}
.main-nav .menu-item-has-children:hover > .sub-menu,
.main-nav .menu-item-has-children:focus-within > .sub-menu{display:flex;}
/* hover 桥接，鼠标从主项移到下拉不断开 */

.main-nav .menu-item-has-children::after{content:'';position:absolute;top:100%;left:0;right:0;height:10px;}
.main-nav .menu-item-has-children > a{position:relative;}
.main-nav .menu-item-has-children > a::after{content:'\25BE';position:absolute;right:-11px;top:50%;transform:translateY(-50%);font-size:10px;opacity:.65;}
@media(max-width:900px){
  .main-nav .sub-menu{display:block !important;position:static;box-shadow:none;background:transparent;padding:0 0 0 16px;min-width:0;}
  .main-nav .sub-menu a{color:rgba(255,255,255,.85);padding:5px 0;font-size:14px;}
  .main-nav .sub-menu a:hover{background:transparent;color:#fff;}
  .main-nav .menu-item-has-children > a::after{display:none;}
}
.main-nav .menu-item-has-children.sub-open > .sub-menu{display:flex !important;}


/* ===== 公司资讯 3列卡片 ===== */
.news-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;max-width:1120px;margin:0 auto;}
.news-card{background:#fff;border:1px solid #e8f1f3;border-radius:18px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .25s,transform .25s;}
.news-card:hover{box-shadow:0 14px 34px rgba(14,159,155,.15);transform:translateY(-4px);}
.news-card .thumb-link{display:block;overflow:hidden;}
.news-card .thumb{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;background:#dff0f1;transition:transform .35s;}
.news-card:hover .thumb{transform:scale(1.04);}
.news-card .nc-body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1;}
.news-card .nc-date{color:#8aa5ad;font-size:13px;letter-spacing:.5px;}
.news-card h3{font-size:17px;margin:10px 0 8px;line-height:1.45;font-weight:700;}
.news-card h3 a{color:#0d2b33;text-decoration:none;}
.news-card h3 a:hover{color:#0e9f9b;}
.news-card p{color:#5b7480;font-size:14px;line-height:1.75;flex:1;margin:0 0 16px;}
.news-card .nc-more{color:#0e9f9b;font-weight:600;font-size:14px;text-decoration:none;}
.news-pager{margin-top:36px;text-align:center;}
.news-pager .page-numbers{display:inline-block;padding:7px 15px;margin:0 3px;border-radius:8px;border:1px solid #d7e7ea;color:#0e9f9b;text-decoration:none;}
.news-pager .current{background:#0e9f9b;color:#fff;border-color:#0e9f9b;}
@media(max-width:900px){.news-cards{grid-template-columns:repeat(2,1fr);gap:18px;}}
@media(max-width:600px){.news-cards{grid-template-columns:1fr;}}


/* 首页飞鸟与乌龟装饰 */
.home-birds{position:absolute;bottom:40%;right:20%;width:6.5%;z-index:3;pointer-events:none;opacity:.95;}
.home-turtle{position:absolute;bottom:-4%;right:35%;width:9%;z-index:2;pointer-events:none;}
@media(max-width:768px){
  /* 手机端完全继承桌面样式，不做特殊覆盖 */
}


/* ===== 技术对比表：主打列（干细胞纳米囊泡）高亮 ===== */
table.cmp th:nth-child(2){
  background:#0e9f9b !important;
  color:#fff;
  position:relative;
}
table.cmp td:nth-child(2){
  background:#E9F8F6 !important;
  border-left:2px solid #0e9f9b;
  border-right:2px solid #0e9f9b;
}
table.cmp th:nth-child(2)::after{
  content:"推荐";
  position:absolute;
  top:6px;
  right:8px;
  background:#fff;
  color:#0e9f9b;
  font-size:11px;
  font-weight:700;
  padding:2px 8px;
  border-radius:10px;
}
.tag-ok{ color:#0e9f9b !important; font-weight:800; }
table.cmp tr:hover td:nth-child(2){ background:#D6F2EE !important; }
@media(max-width:768px){
  table.cmp td:nth-child(2){
    background:#E9F8F6 !important;
    border-left:none;
    border-right:none;
    border-top:3px solid #0e9f9b;
    border-bottom:3px solid #0e9f9b;
  }
}


/* 其他列 tag 颜色调淡，不抢主打列 */
.tag-mid{ color:#9A8A6A !important; font-weight:600 !important; }
.tag-risk{ color:#B08580 !important; font-weight:600 !important; }
/* 其他两列单元格文字也淡一点 */
table.cmp td:nth-child(3),
table.cmp td:nth-child(4){
  color:#6B7B82;
}
table.cmp td:nth-child(3) .tag-mid,
table.cmp td:nth-child(4) .tag-risk{ font-weight:700; }


/* 技术对比表：主打列彻底突出，其他列全灰 */
.tag-ok{
  display:inline-block;
  background:#0e9f9b;
  color:#fff !important;
  padding:2px 10px;
  border-radius:10px;
  font-weight:700 !important;
  font-size:13px;
}
.tag-mid{
  color:#8a9aa2 !important;
  font-weight:500 !important;
  background:transparent !important;
}
.tag-risk{
  color:#8a9aa2 !important;
  font-weight:500 !important;
  background:transparent !important;
}
/* 其他两列整列文字淡灰 */
table.cmp td:nth-child(3),
table.cmp td:nth-child(4){
  color:#9aa8af !important;
}
table.cmp td:nth-child(3) .tag-mid,
table.cmp td:nth-child(4) .tag-risk{ color:#7a8a92 !important; }


/* 产品卡片图放大 */
.product-card .pc-img{ height: 160px; }
.product-card .pc-img img{ max-height: 145px; max-width: 95%; }