/* ==========================================================
   深圳市一秦咨询有限公司官网 · 展示型单页
   蓝色医疗科技风 · 参考 DNA/分子/网格地面视觉
   ========================================================== */

:root {
  --sky: #41b9ff;
  --blue: #1592dd;
  --blue-d: #0e6fb8;
  --deep: #0a4a86;
  --navy: #07304f;
  --ink: #0d2436;
  --mut: #5a7288;
  --line: #dcecf8;
  --soft: #f2f8fd;
  --white: #fff;
  --grad: linear-gradient(135deg, #2ab1f2 0%, #0d6cb5 100%);
  --grad-soft: linear-gradient(180deg, #f4faff 0%, #e9f4fd 100%);
  --radius: 18px;
  --shadow-sm: 0 6px 22px -10px rgba(14, 111, 184, 0.28);
  --shadow-md: 0 16px 40px -16px rgba(14, 111, 184, 0.38);
  --shadow-lg: 0 28px 60px -20px rgba(7, 48, 79, 0.45);
  --font: "PingFang SC", "Microsoft YaHei", "Source Han Sans SC", "Helvetica Neue", Arial, sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font);
  color: var(--ink);
  background: var(--white);
  line-height: 1.75;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }

.container { width: min(1180px, 92%); margin: 0 auto; }

/* 统一线性 SVG 图标 */
.ic {
  width: 1em; height: 1em;
  fill: none; stroke: currentColor;
  stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round;
  display: inline-block; vertical-align: -0.125em; flex: none;
}

/* 滚动渐入（JS 添加 .rv / .in） */
.rv { opacity: 0; transform: translateY(28px); transition: opacity .8s cubic-bezier(.2,.65,.25,1), transform .8s cubic-bezier(.2,.65,.25,1); transition-delay: var(--d, 0s); will-change: opacity, transform; }
.rv.in { opacity: 1; transform: none; }

/* ---------- 顶部滚动进度条 ---------- */
.scroll-progress {
  position: fixed; top: 0; left: 0; z-index: 300;
  height: 3px; width: 0;
  background: linear-gradient(90deg, var(--sky), var(--blue-d));
  box-shadow: 0 0 10px rgba(65, 185, 255, .8);
}

/* ---------- 导航 ---------- */
.nav { position: fixed; inset: 0 0 auto 0; z-index: 200; transition: background .35s ease, box-shadow .35s ease, backdrop-filter .35s ease; }
.nav-inner { width: min(1180px, 94%); margin: 0 auto; height: 74px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
/* 顶部导航透明时叠在蓝色横幅上，蓝色 logo 会发灰，故转为白色；
   滚动后导航变白底，再还原品牌原色 */
.brand-logo {
  height: 40px;
  filter: brightness(0) invert(1) drop-shadow(0 2px 8px rgba(7,48,79,.35));
  transition: transform .3s ease, filter .35s ease;
}
.nav.scrolled .brand-logo { filter: drop-shadow(0 2px 8px rgba(0,0,0,.18)); }
.brand:hover .brand-logo { transform: scale(1.04); }

.nav-links { display: flex; gap: 4px; }
.nav-links a {
  position: relative; padding: 9px 16px; border-radius: 999px;
  font-size: 15px; font-weight: 500; color: rgba(255,255,255,.92);
  transition: color .25s ease, background .25s ease;
}
.nav-links a::after {
  content: ""; position: absolute; left: 16px; right: 16px; bottom: 4px; height: 2px; border-radius: 2px;
  background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .3s ease;
}
.nav-links a:hover::after { transform: scaleX(1); }
.nav-links a.active { background: rgba(255,255,255,.16); color: #fff; }

.nav.scrolled { background: rgba(255,255,255,.88); backdrop-filter: blur(14px); box-shadow: 0 8px 30px -18px rgba(7,48,79,.5); }
.nav.scrolled .nav-links a { color: var(--ink); }
.nav.scrolled .nav-links a:hover { color: var(--blue-d); }
.nav.scrolled .nav-links a.active { background: var(--grad); color: #fff; box-shadow: var(--shadow-sm); }

.nav-toggle { display: none; background: none; border: 0; cursor: pointer; width: 42px; height: 42px; }
.nav-toggle span { display: block; width: 24px; height: 2px; margin: 5px auto; border-radius: 2px; background: #fff; transition: transform .3s ease, opacity .3s ease; }
.nav.scrolled .nav-toggle span { background: var(--ink); }
.nav-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2) { opacity: 0; }
.nav-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---------- Hero ---------- */
.hero { position: relative; min-height: 100vh; display: flex; align-items: center; overflow: hidden; color: #fff; padding: 130px 0 110px; }
.hero-bg {
  position: absolute; inset: 0; z-index: 0;
  background:
    radial-gradient(1100px 650px at 78% -8%, #66ccff 0%, transparent 55%),
    radial-gradient(900px 600px at -10% 110%, #0d5fa5 0%, transparent 60%),
    linear-gradient(158deg, #23a8ea 0%, #1478c4 48%, #0a4a86 100%);
}

/* 后台配置了首页背景图时启用：图片铺满 + 左侧压暗保证标题可读 */
.hero.has-bg-image .hero-bg {
  background-color: #1478c4;
  background-image: var(--hero-bg-image);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
/* 遮罩置于 hero 层级，图片与视频背景都能覆盖到 */
.hero.has-bg-image::before {
  content: "";
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(100deg,
    rgba(7, 48, 79, .74) 0%,
    rgba(10, 74, 134, .5) 34%,
    rgba(10, 74, 134, .16) 58%,
    rgba(10, 74, 134, 0) 78%);
}
/* 背景图自带 DNA 螺旋与透视网格，隐藏 CSS 版本避免重影 */
.hero.has-bg-image .hero-grid-floor,
.hero.has-bg-image .dna-helix { display: none; }
.hero.has-bg-image .hero-glow { opacity: .22; }

/* 背景为视频时铺满容器 */
.hero-bg-video {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; z-index: 0;
}
.hero-glow { position: absolute; border-radius: 50%; filter: blur(30px); opacity: .5; animation: blob 12s ease-in-out infinite alternate; }
.hero-glow.g1 { width: 480px; height: 480px; right: -60px; top: 40px; background: radial-gradient(circle, rgba(255,255,255,.5), transparent 65%); }
.hero-glow.g2 { width: 380px; height: 380px; left: 8%; bottom: -80px; background: radial-gradient(circle, rgba(102,204,255,.55), transparent 65%); animation-delay: -6s; }
@keyframes blob {
  0% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(-30px, 24px) scale(1.08); }
  100% { transform: translate(24px, -20px) scale(.96); }
}

/* 网格地面（参考图透视网格） */
.hero-grid-floor {
  position: absolute; left: -10%; right: -10%; bottom: -2%; height: 46%;
  background-image:
    linear-gradient(rgba(255,255,255,.22) 1.5px, transparent 1.5px),
    linear-gradient(90deg, rgba(255,255,255,.22) 1.5px, transparent 1.5px);
  background-size: 52px 52px;
  transform: perspective(620px) rotateX(63deg);
  transform-origin: bottom;
  -webkit-mask-image: linear-gradient(to top, #000 25%, transparent 92%);
  mask-image: linear-gradient(to top, #000 25%, transparent 92%);
  animation: gridMove 16s linear infinite;
}
@keyframes gridMove { from { background-position: 0 0, 0 0; } to { background-position: 0 52px, 0 0; } }

/* DNA 双螺旋 */
.dna-helix {
  position: absolute; right: 5.5%; top: 8%; width: 190px; opacity: .38;
  display: flex; flex-direction: column; gap: 26px;
  perspective: 700px;
}
.dna-helix span { position: relative; height: 3px; border-radius: 3px; background: linear-gradient(90deg, rgba(255,255,255,.15), rgba(255,255,255,.85), rgba(255,255,255,.15)); animation: twist 4.2s linear infinite; transform-style: preserve-3d; }
.dna-helix span::before, .dna-helix span::after {
  content: ""; position: absolute; top: 50%; width: 13px; height: 13px; border-radius: 50%;
  background: #eaf7ff; box-shadow: 0 0 12px rgba(255,255,255,.75); transform: translateY(-50%);
}
.dna-helix span::before { left: -6px; }
.dna-helix span::after { right: -6px; }
.dna-helix span:nth-child(1) { animation-delay: 0s; } .dna-helix span:nth-child(2) { animation-delay: -.42s; }
.dna-helix span:nth-child(3) { animation-delay: -.84s; } .dna-helix span:nth-child(4) { animation-delay: -1.26s; }
.dna-helix span:nth-child(5) { animation-delay: -1.68s; } .dna-helix span:nth-child(6) { animation-delay: -2.1s; }
.dna-helix span:nth-child(7) { animation-delay: -2.52s; } .dna-helix span:nth-child(8) { animation-delay: -2.94s; }
.dna-helix span:nth-child(9) { animation-delay: -3.36s; } .dna-helix span:nth-child(10) { animation-delay: -3.78s; }
@keyframes twist { from { transform: rotateY(0deg); } to { transform: rotateY(360deg); } }

.hero-layout { position: relative; z-index: 2; display: grid; grid-template-columns: 1.15fr .85fr; gap: 48px; align-items: center; }

.hero-tag {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 18px; border-radius: 999px; margin-bottom: 26px;
  background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.3);
  backdrop-filter: blur(6px);
  font-size: 13px; letter-spacing: 1.5px; font-weight: 500;
}
.pulse-dot { width: 9px; height: 9px; border-radius: 50%; background: #7fffb2; position: relative; flex: none; }
.pulse-dot::after { content: ""; position: absolute; inset: -5px; border-radius: 50%; border: 2px solid rgba(127,255,178,.7); animation: pulse 1.8s ease-out infinite; }
@keyframes pulse { 0% { transform: scale(.5); opacity: 1; } 100% { transform: scale(1.5); opacity: 0; } }

.hero-title { font-size: clamp(38px, 5.4vw, 64px); line-height: 1.16; font-weight: 800; letter-spacing: 1px; text-shadow: 0 4px 30px rgba(7,48,79,.3); }
.gradient-text {
  background: linear-gradient(92deg, #d9f2ff 0%, #ffffff 35%, #8fd8ff 70%, #d9f2ff 100%);
  background-size: 220% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: shimmer 5.5s linear infinite;
}
@keyframes shimmer { to { background-position: -220% 0; } }

.hero-sub { max-width: 580px; margin: 24px 0 34px; font-size: 17px; color: rgba(255,255,255,.94); }
.hero-sub strong { color: #fff; font-weight: 700; }

.hero-actions { display: flex; gap: 16px; flex-wrap: wrap; }
.btn {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 14px 30px; border-radius: 999px;
  font-weight: 600; font-size: 15.5px; cursor: pointer;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.btn .ic { font-size: 18px; transition: transform .25s ease; }
.btn:hover .ic { transform: translateX(4px); }
.btn-primary { background: #fff; color: var(--blue-d); box-shadow: 0 10px 30px -10px rgba(7,48,79,.55); }
.btn-primary:hover { transform: translateY(-3px); box-shadow: 0 18px 40px -12px rgba(7,48,79,.6); }
.btn-glass { border: 1.5px solid rgba(255,255,255,.65); color: #fff; background: rgba(255,255,255,.08); backdrop-filter: blur(4px); }
.btn-glass:hover { background: rgba(255,255,255,.2); transform: translateY(-3px); }

.hero-stats { display: flex; gap: 14px; margin-top: 52px; flex-wrap: wrap; }
.stat-card {
  padding: 16px 22px; border-radius: 16px; min-width: 150px;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.24);
  backdrop-filter: blur(8px);
  transition: transform .3s ease, background .3s ease;
}
.stat-card:hover { transform: translateY(-4px); background: rgba(255,255,255,.18); }
.stat-num { font-size: 24px; font-weight: 800; letter-spacing: .5px; }
.stat-label { font-size: 13px; color: rgba(255,255,255,.85); margin-top: 2px; }

/* Hero 右侧视觉 */
.hero-visual { position: relative; z-index: 2; }
.visual-wrapper { position: relative; transition: transform .3s ease; transform-style: preserve-3d; }
.hero-main-img {
  width: 100%; border-radius: 24px;
  box-shadow: 0 30px 70px -24px rgba(7,48,79,.65), 0 0 0 1px rgba(255,255,255,.25);
  animation: heroFloat 7s ease-in-out infinite;
}
@keyframes heroFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }

.floating-badge {
  position: absolute; display: flex; align-items: center; gap: 12px;
  padding: 13px 18px; border-radius: 16px;
  background: rgba(255,255,255,.94); color: var(--ink);
  box-shadow: var(--shadow-md); backdrop-filter: blur(8px);
  animation: badgeFloat 5.5s ease-in-out infinite;
}
.badge-top { top: 6%; left: -9%; }
.badge-bottom { bottom: 7%; right: -6%; animation-delay: -2.7s; }
@keyframes badgeFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
.badge-icon {
  width: 40px; height: 40px; border-radius: 12px; flex: none;
  display: flex; align-items: center; justify-content: center;
  background: var(--grad); color: #fff; font-size: 21px;
  box-shadow: 0 6px 16px -6px rgba(14,111,184,.6);
}
.floating-badge strong { display: block; font-size: 14.5px; line-height: 1.35; }
.floating-badge span:not(.badge-icon) { font-size: 12.5px; color: var(--mut); }

.scroll-cue { position: absolute; bottom: 96px; left: 50%; transform: translateX(-50%); z-index: 3; }
.mouse-wheel { display: block; width: 26px; height: 42px; border: 2px solid rgba(255,255,255,.75); border-radius: 14px; position: relative; }
.mouse-wheel::after { content: ""; position: absolute; top: 8px; left: 50%; transform: translateX(-50%); width: 4px; height: 9px; border-radius: 2px; background: #fff; animation: wheel 1.7s ease infinite; }
@keyframes wheel { 0% { opacity: 0; top: 7px; } 45% { opacity: 1; } 100% { opacity: 0; top: 22px; } }

.hero-wave { position: absolute; left: 0; right: 0; bottom: -1px; width: 100%; height: 90px; z-index: 2; }

/* ---------- 法规跑马灯 ---------- */
.trust-bar { background: #fff; padding: 34px 0 38px; border-bottom: 1px solid var(--line); }
.trust-head { text-align: center; margin-bottom: 18px; }
.trust-title { font-size: 14px; font-weight: 600; color: var(--mut); letter-spacing: 3px; }
.marquee { overflow: hidden; position: relative; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee-track { display: flex; gap: 14px; width: max-content; animation: marquee 26s linear infinite; }
.marquee:hover .marquee-track { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-50%); } }
.trust-item {
  flex: none; display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 22px; border-radius: 999px; font-size: 14.5px; font-weight: 500; color: var(--deep);
  background: var(--soft); border: 1px solid var(--line);
}
.trust-item::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--grad); }

/* ---------- 通用区块 ---------- */
.section { padding: 104px 0; }
.section-alt { background: var(--grad-soft); }
.section-head { text-align: center; max-width: 720px; margin: 0 auto 58px; }
.kicker { color: var(--blue); font-weight: 700; letter-spacing: 4px; font-size: 13px; }
.section-head h2 { font-size: clamp(28px, 3.8vw, 42px); font-weight: 800; margin-top: 10px; }
.section-head h2::after { content: ""; display: block; width: 56px; height: 4px; border-radius: 4px; background: var(--grad); margin: 18px auto 0; }
.section-desc { margin-top: 18px; color: var(--mut); font-size: 16px; }
.head-light .section-desc { color: rgba(255,255,255,.75); }
.head-light h2 { color: #fff; }
.head-light .kicker { color: var(--sky); }

/* ---------- 公司简介 ---------- */
.about-grid { display: block; }
.about-media-col { margin-top: 34px; }
.about-highlight-box {
  position: relative; padding: 6px 0 6px 26px; margin-bottom: 34px;
}
.about-highlight-box::before { content: ""; position: absolute; left: 0; top: 6px; bottom: 6px; width: 4px; border-radius: 4px; background: var(--grad); }
.about-highlight-box p { color: var(--mut); margin-bottom: 14px; font-size: 16px; }
.about-highlight-box p:last-child { margin-bottom: 0; }
.about-highlight-box strong { color: var(--deep); }
.lead-text { font-size: 18px !important; color: var(--ink) !important; }

.about-services-matrix { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.asm-item {
  padding: 20px 18px; border-radius: 16px; background: #fff;
  border: 1px solid var(--line); box-shadow: var(--shadow-sm);
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.asm-item:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: rgba(21,146,221,.35); }
.asm-icon {
  width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
  background: var(--soft); color: var(--blue-d); font-size: 22px; margin-bottom: 12px;
  transition: background .3s ease, color .3s ease, transform .3s ease;
}
.asm-item:hover .asm-icon { background: var(--grad); color: #fff; transform: scale(1.06) rotate(-4deg); }
.asm-item h4 { font-size: 15.5px; margin-bottom: 3px; }
.asm-item p { font-size: 13px; color: var(--mut); line-height: 1.55; }

.about-card-badge {
  position: absolute; left: 16px; right: 16px; bottom: 16px;
  padding: 14px 18px; border-radius: 14px;
  background: rgba(255,255,255,.92); backdrop-filter: blur(8px);
  box-shadow: var(--shadow-md);
}
.acb-title { display: block; font-weight: 700; color: var(--deep); font-size: 15px; }
.acb-desc { font-size: 13px; color: var(--mut); }

.about-stat-strip {
  display: grid; grid-template-columns: repeat(3, 1fr);
  border-radius: 18px; overflow: hidden; box-shadow: var(--shadow-md);
  background: var(--grad); color: #fff; text-align: center;
}
.strip-item { padding: 22px 10px; position: relative; }
.strip-item + .strip-item::before { content: ""; position: absolute; left: 0; top: 22%; bottom: 22%; width: 1px; background: rgba(255,255,255,.3); }
.strip-num { display: block; font-size: 26px; font-weight: 800; }
.strip-label { font-size: 13px; opacity: .88; }

/* ---------- 咨询服务 ---------- */
.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.service-card {
  position: relative; background: #fff; border-radius: var(--radius);
  padding: 28px 26px; border: 1px solid var(--line); box-shadow: var(--shadow-sm);
  transition: transform .3s ease, box-shadow .3s ease; overflow: hidden;
}
.service-card::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 4px;
  background: var(--grad); transform: scaleX(0); transform-origin: left; transition: transform .35s ease;
}
.service-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-md); }
.service-card:hover::before { transform: scaleX(1); }
.service-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.service-badge { font-size: 12.5px; font-weight: 600; color: var(--blue-d); background: var(--soft); border: 1px solid var(--line); padding: 4px 12px; border-radius: 999px; }
.service-num { font-size: 30px; font-weight: 800; color: #e3f1fc; line-height: 1; transition: color .3s ease; }
.service-card:hover .service-num { color: var(--sky); }
.service-icon {
  width: 54px; height: 54px; border-radius: 15px; display: flex; align-items: center; justify-content: center;
  background: var(--grad); color: #fff; font-size: 26px; margin-bottom: 16px;
  box-shadow: 0 10px 22px -8px rgba(14,111,184,.55);
  transition: transform .35s ease;
}
.service-card:hover .service-icon { transform: scale(1.08) rotate(-5deg); }
.service-card h3 { font-size: 18px; margin-bottom: 10px; }
.service-card > p, .card-wide-content > p { color: var(--mut); font-size: 14.5px; }
.service-features { margin-top: 16px; display: grid; gap: 7px; }
.service-features li { position: relative; padding-left: 22px; font-size: 13.5px; color: var(--ink); }
.service-features li::before {
  content: ""; position: absolute; left: 0; top: 7px; width: 12px; height: 12px; border-radius: 50%;
  background: var(--soft); border: 3px solid var(--blue);
}

.card-wide { grid-column: span 3; display: grid; grid-template-columns: auto 1fr; gap: 10px 26px; align-items: center; }
.card-wide .service-top { position: absolute; top: 22px; right: 24px; margin: 0; }
.card-wide .service-icon { margin: 0; width: 62px; height: 62px; font-size: 30px; }
.card-wide-content h3 { font-size: 20px; margin-bottom: 8px; }
.card-wide-tags { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.card-wide-tags span { font-size: 13px; font-weight: 500; color: var(--deep); background: var(--soft); border: 1px solid var(--line); padding: 6px 14px; border-radius: 999px; transition: background .25s ease, color .25s ease; }
.card-wide-tags span:hover { background: var(--grad); color: #fff; }

/* 服务流程 */
.process-banner {
  margin-top: 54px; padding: 44px 40px; border-radius: 24px; color: #fff;
  background:
    radial-gradient(600px 300px at 90% -20%, rgba(102,204,255,.4), transparent 60%),
    linear-gradient(135deg, #0f6cb4 0%, #083a66 100%);
  box-shadow: var(--shadow-lg);
}
.process-title { text-align: center; font-size: 22px; font-weight: 700; margin-bottom: 34px; }
.process-steps { display: flex; align-items: stretch; justify-content: space-between; gap: 8px; }
.step-item {
  flex: 1; text-align: center; padding: 18px 10px; border-radius: 16px;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18);
  transition: background .3s ease, transform .3s ease;
}
.step-item:hover { background: rgba(255,255,255,.16); transform: translateY(-4px); }
.step-index {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 50%; margin-bottom: 10px;
  background: #fff; color: var(--blue-d); font-weight: 800; font-size: 15px;
  box-shadow: 0 6px 16px -6px rgba(0,0,0,.4);
}
.step-item h4 { font-size: 15px; margin-bottom: 4px; }
.step-item p { font-size: 12.5px; color: rgba(255,255,255,.78); line-height: 1.5; }
.step-arrow { display: flex; align-items: center; color: rgba(255,255,255,.55); font-size: 20px; animation: nudge 1.6s ease-in-out infinite; }
@keyframes nudge { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(5px); } }

/* ---------- 核心优势（深色） ---------- */
.section-dark {
  position: relative; color: #fff;
  background:
    radial-gradient(800px 400px at 15% 0%, rgba(65,185,255,.22), transparent 60%),
    radial-gradient(700px 400px at 90% 100%, rgba(13,108,181,.35), transparent 60%),
    linear-gradient(160deg, #0b3a63 0%, #072645 100%);
  overflow: hidden;
}
.advantage-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.adv-card {
  padding: 30px 24px; border-radius: 20px;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(6px);
  transition: transform .3s ease, background .3s ease, border-color .3s ease;
}
.adv-card:hover { transform: translateY(-8px); background: rgba(255,255,255,.11); border-color: rgba(102,204,255,.5); }
.adv-icon {
  width: 52px; height: 52px; border-radius: 14px; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, rgba(65,185,255,.9), rgba(13,108,181,.9));
  color: #fff; font-size: 26px; margin-bottom: 18px;
  box-shadow: 0 10px 24px -8px rgba(0,0,0,.5);
}
.adv-card h3 { font-size: 17.5px; margin-bottom: 10px; }
.adv-card p { font-size: 14px; color: rgba(255,255,255,.78); }

/* ---------- 无界课堂 ---------- */
.classroom-title-row { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 10px; }
.classroom-brand-logo { height: 58px; border-radius: 12px; }
.classroom-title-row h2 { margin-top: 0 !important; }
.classroom-title-row h2::after { margin-top: 12px !important; }

.classroom-container { display: block; }
.classroom-items-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.cl-card {
  padding: 24px 22px; border-radius: 18px; background: #fff;
  border: 1px solid var(--line); box-shadow: var(--shadow-sm);
  transition: transform .3s ease, box-shadow .3s ease;
  display: flex; flex-direction: column;
}
.cl-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.cl-card-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; gap: 8px; }
.cl-badge { font-size: 12px; font-weight: 600; padding: 4px 12px; border-radius: 999px; }
.cl-green { background: #e6f9ef; color: #0e9c5a; }
.cl-blue { background: #e8f4fd; color: var(--blue-d); }
.cl-orange { background: #fff3e6; color: #d97b16; }
.cl-pink { background: #ffeef3; color: #d6336c; }
.cl-type { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--mut); font-weight: 500; }
.cl-type .ic { font-size: 16px; color: var(--blue); }
.cl-card h3 { font-size: 16.5px; margin-bottom: 8px; }
.cl-card p { font-size: 14px; color: var(--mut); }
.cl-highlight { background: linear-gradient(140deg, #1592dd 0%, #0a4a86 100%); border: 0; color: #fff; }
.cl-highlight h3 { color: #fff; }
.cl-highlight p { color: rgba(255,255,255,.9); }
.cl-highlight strong { font-size: 19px; color: #ffe27a; }
.cl-highlight .cl-type { color: rgba(255,255,255,.85); }
.cl-highlight .cl-type .ic { color: #ffe27a; }

/* ---------- 资源对接 ---------- */
.resources-layout { display: block; }
.res-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.res-item {
  padding: 26px 24px; border-radius: 18px; background: #fff;
  border: 1px solid var(--line); box-shadow: var(--shadow-sm);
  transition: transform .3s ease, box-shadow .3s ease;
}
.res-item:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.res-item-wide { grid-column: span 2; display: grid; grid-template-columns: auto 1fr; gap: 4px 24px; align-items: center; }
.res-item-wide h3 { grid-column: 2; }
.res-item-wide p { grid-column: 2; }
.res-item-wide .res-icon { grid-row: span 2; margin: 0; }
.res-icon {
  width: 52px; height: 52px; border-radius: 14px; display: flex; align-items: center; justify-content: center;
  background: var(--soft); color: var(--blue-d); font-size: 25px; margin-bottom: 14px;
  transition: background .3s ease, color .3s ease, transform .3s ease;
}
.res-item:hover .res-icon { background: var(--grad); color: #fff; transform: scale(1.07) rotate(-4deg); }
.res-item h3 { font-size: 16.5px; margin-bottom: 6px; }
.res-item p { font-size: 13.5px; color: var(--mut); }

/* ---------- 联系我们 ---------- */
.contact { background: linear-gradient(180deg, #fff 0%, #eaf4fd 100%); }
.contact-grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: 28px; align-items: stretch; }
.contact-info-card {
  background: #fff; border-radius: 24px; padding: 38px 36px;
  border: 1px solid var(--line); box-shadow: var(--shadow-md);
}
.contact-header h3 { font-size: 21px; }
.contact-header p { font-size: 14px; color: var(--mut); margin: 4px 0 8px; }
.ci-list { margin-top: 14px; }
.ci-item { display: flex; gap: 16px; align-items: center; padding: 15px 0; border-bottom: 1px dashed var(--line); }
.ci-item:last-child { border-bottom: 0; }
.ci-icon {
  width: 46px; height: 46px; border-radius: 13px; flex: none;
  display: flex; align-items: center; justify-content: center;
  background: var(--soft); color: var(--blue-d); font-size: 22px;
  transition: background .3s ease, color .3s ease;
}
.ci-item:hover .ci-icon { background: var(--grad); color: #fff; }
.ci-label { display: block; font-size: 12.5px; color: var(--mut); }
.ci-val { font-size: 16px; font-weight: 600; color: var(--ink); }
a.ci-link:hover { color: var(--blue-d); text-decoration: underline; }
.contact-cta-buttons { display: flex; gap: 14px; margin-top: 24px; flex-wrap: wrap; }
.btn-solid { background: var(--grad); color: #fff; box-shadow: var(--shadow-sm); }
.btn-solid:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.btn-outline { border: 1.5px solid var(--blue); color: var(--blue-d); }
.btn-outline:hover { background: var(--soft); transform: translateY(-3px); }
.btn-solid .ic, .btn-outline .ic { font-size: 17px; }

.contact-brand-card {
  border-radius: 24px; overflow: hidden; color: #fff;
  background:
    radial-gradient(500px 260px at 100% 0%, rgba(102,204,255,.4), transparent 60%),
    linear-gradient(150deg, #1592dd 0%, #0a4a86 100%);
  box-shadow: var(--shadow-lg);
  display: flex;
}
.brand-card-inner { padding: 40px 34px; display: flex; flex-direction: column; align-items: center; text-align: center; justify-content: center; gap: 6px; flex: 1; }
.brand-logo-holder { background: #fff; padding: 14px 20px; border-radius: 16px; margin-bottom: 14px; box-shadow: 0 12px 30px -12px rgba(0,0,0,.4); }
.contact-card-logo { width: 190px; }
.contact-brand-card h3 { font-size: 20px; }
.brand-card-slogan { font-size: 13.5px; color: rgba(255,255,255,.85); }
.brand-tags-pills { display: flex; gap: 10px; margin: 16px 0 22px; flex-wrap: wrap; justify-content: center; }
.brand-tags-pills span { font-size: 13px; padding: 6px 16px; border-radius: 999px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.3); }
.wechat-card-box {
  display: flex; gap: 14px; align-items: center; text-align: left;
  padding: 16px 18px; border-radius: 16px; width: 100%;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.22);
}
.wechat-icon {
  width: 44px; height: 44px; border-radius: 12px; flex: none;
  display: flex; align-items: center; justify-content: center;
  background: #fff; color: var(--blue-d); font-size: 22px;
}
.wechat-text strong { display: block; font-size: 14.5px; }
.wechat-text span { font-size: 12.5px; color: rgba(255,255,255,.82); line-height: 1.5; }

/* ---------- 页脚 ---------- */
.footer { background: var(--navy); color: #b9d4e8; padding: 64px 0 30px; }
.footer-top { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.3fr; gap: 36px; padding-bottom: 40px; border-bottom: 1px solid rgba(255,255,255,.12); }
.footer-logo { height: 40px; filter: brightness(0) invert(1); opacity: .95; }
.footer-desc { margin-top: 18px; font-size: 13.5px; line-height: 1.8; color: rgba(185,212,232,.85); }
.footer-col h4 { color: #fff; font-size: 15.5px; margin-bottom: 16px; }
.footer-col ul li { margin-bottom: 9px; font-size: 13.5px; }
.footer-col ul a { transition: color .25s ease, padding-left .25s ease; }
.footer-col ul a:hover { color: #fff; padding-left: 5px; }
.footer-contact li { color: rgba(185,212,232,.9); }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; padding-top: 24px; font-size: 13px; color: rgba(185,212,232,.7); }

/* ---------- 快捷浮钮 ---------- */
.floating-quick-bar {
  position: fixed; right: 22px; bottom: 30px; z-index: 150;
  display: flex; flex-direction: column; gap: 12px;
}
.fq-item {
  width: 48px; height: 48px; border-radius: 50%; border: 0; cursor: pointer;
  display: flex; align-items: center; justify-content: center; font-size: 21px;
  background: #fff; color: var(--blue-d); box-shadow: var(--shadow-md);
  transition: transform .25s ease, background .25s ease, color .25s ease, opacity .3s ease;
}
.fq-item:hover { transform: translateY(-4px); background: var(--grad); color: #fff; }
.back-to-top { opacity: 0; pointer-events: none; }
.back-to-top.show { opacity: 1; pointer-events: auto; }

/* ---------- 响应式 ---------- */
@media (max-width: 1080px) {
  .hero-layout { grid-template-columns: 1fr; gap: 56px; }
  .hero-visual { max-width: 560px; margin: 0 auto; }
  .badge-top { left: -2%; }
  .badge-bottom { right: -2%; }
  .dna-helix { opacity: .18; }
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .card-wide { grid-column: span 2; }
  .advantage-grid { grid-template-columns: repeat(2, 1fr); }
  .process-steps { flex-wrap: wrap; }
  .step-arrow { display: none; }
  .step-item { flex: 1 1 42%; }
}

@media (max-width: 900px) {
  .nav-toggle { display: block; }
  .nav-links {
    position: absolute; top: 74px; left: 0; right: 0;
    flex-direction: column; padding: 12px;
    background: rgba(255,255,255,.97); backdrop-filter: blur(12px);
    box-shadow: 0 20px 40px -20px rgba(7,48,79,.4);
    transform: translateY(-12px); opacity: 0; pointer-events: none;
    transition: opacity .3s ease, transform .3s ease;
  }
  .nav-links.open { opacity: 1; pointer-events: auto; transform: translateY(0); }
  .nav-links a { color: var(--ink) !important; padding: 13px 18px; border-radius: 12px; }
  .nav-links a.active { background: var(--grad) !important; color: #fff !important; }
  .about-grid, .contact-grid { grid-template-columns: 1fr; }
  .about-media-col { position: static; }
  .about-services-matrix { grid-template-columns: repeat(2, 1fr); }
  .classroom-items-grid { grid-template-columns: repeat(2, 1fr); }
  .res-grid { grid-template-columns: repeat(2, 1fr); }
  .res-item-wide { grid-column: span 2; }
  .footer-top { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 600px) {
  .section { padding: 72px 0; }
  .hero { padding: 110px 0 90px; }
  .hero-stats { gap: 10px; }
  .stat-card { min-width: calc(50% - 10px); flex: 1; padding-left: 14px; padding-right: 14px; }
  /* 窄屏下 NMPA·FDA·CE 这类长串会被卡片切掉，缩小字号并允许换行 */
  .stat-num { font-size: 19px; letter-spacing: 0; overflow-wrap: anywhere; }
  .stat-label { overflow-wrap: anywhere; }
  .services-grid, .advantage-grid, .classroom-items-grid, .res-grid, .about-services-matrix { grid-template-columns: 1fr; }
  .card-wide { grid-column: span 1; display: block; }
  .card-wide .service-icon { margin-bottom: 14px; }
  .res-item-wide { grid-column: span 1; }
  .step-item { flex: 1 1 100%; }
  .floating-badge { padding: 10px 14px; }
  .badge-icon { width: 34px; height: 34px; font-size: 18px; }
  .footer-top { grid-template-columns: 1fr; gap: 26px; }
  .footer-bottom { justify-content: center; text-align: center; }
  .scroll-cue { display: none; }
}

/* 动画偏好减弱 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  html { scroll-behavior: auto; }
  .rv { opacity: 1; transform: none; }
}