/* ================================================================
override.css — 君科华元官网视觉升级（重建版）
================================================================ */
/* 滚动条永远占位，避免不同页面间滚动条出/隐导致视口宽度变化、
让 transform: translateX(-50%) 居中的 nav 横向跳一下 */
html { scrollbar-gutter: stable !important; overflow-y: scroll !important; }
/* ============== 1. 全局变量 ============== */
:root {
--emerald-50: #ecfdf5;
--emerald-100: #d1fae5;
--emerald-200: #a7f3d0;
--emerald-300: #6ee7b7;
--emerald-400: #34d399;
--emerald-500: #10b981;
--emerald-600: #059669;
--emerald-700: #047857;
--emerald-800: #065f46;
--emerald-900: #064e3b;
--gray-50: #f9fafb;
--gray-100: #f3f4f6;
--gray-200: #e5e7eb;
--gray-300: #d1d5db;
--gray-400: #9ca3af;
--gray-500: #6b7280;
--gray-600: #4b5563;
--gray-700: #374151;
--gray-800: #1f2937;
--gray-900: #111827;
--header-gray: #1a1f2e;
}
/* ============== 2. 全局基础 ============== */
html { scroll-behavior: smooth; }
body {
background: #eef1f5 !important;
font-family: 'Noto Sans SC', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
color: var(--gray-900);
-webkit-font-smoothing: antialiased;
margin: 0 auto;
max-width: 100%;
box-shadow: none;
}
a { text-decoration: none; }
/* ============== 3. 导航栏 — 品牌绿背景 ============== */
.sticky-nav {
position: fixed !important;
top: 0;
left: 0 !important;
right: auto !important;
/* 用 100vw 而不是 100% —— 100% 受 scrollbar-gutter:stable 影响会比视口窄
17px 左右，导致最左侧出现 1~2px 漏缝；100vw 强制贴到视口左边界 */
width: 100vw !important;
max-width: 100vw !important;
z-index: 9999;
background: linear-gradient(180deg, rgba(31, 147, 85, 0.32) 0%, rgba(23, 130, 70, 0.32) 100%) !important;
backdrop-filter: blur(20px) saturate(180%);
-webkit-backdrop-filter: blur(20px) saturate(180%);
box-shadow: 0 1px 0 rgba(255,255,255,0.08), 0 8px 30px rgba(0,0,0,0.06) !important;
border-bottom: 1px solid rgba(255,255,255,0.06) !important;
height: 75px;
/* 只动 color/filter/shadow —— 千万别 transition 整个 background，
否则 background-position / background-size 也会被插值，
视觉上就是底图在滑动 */
transition: background-color 0.4s ease, backdrop-filter 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
-webkit-font-smoothing: antialiased;
}
.sticky-nav .top { height: 75px; overflow: visible; }
.sticky-nav .top .logo { overflow: visible !important; }
.sticky-nav .top .logo img { height: 48px; max-height: 48px; }
.sticky-nav.menu_fixed {
background: linear-gradient(180deg, rgba(31, 147, 85, 0.45) 0%, rgba(23, 130, 70, 0.45) 100%) !important;
backdrop-filter: blur(24px) saturate(200%);
-webkit-backdrop-filter: blur(24px) saturate(200%);
box-shadow: 0 2px 18px rgba(0,0,0,0.10) !important;
/* 最小化处理：仅去掉 nav.css 里 @keyframes sticky 1s 的滑入动画
—— 这是用户滚动跨过 100px 时 logo 视觉位置抖动的根因；
其它 padding/height/margin 一律不动，保留原本调好的 logo 位置 */
animation: none !important;
}
/* ============================================================
防背景位移核心补丁：jquery-index.js 在滚过 200px 时给 .sticky-nav
追加了 `animated fadeInDown` 两个 animate.css 类——它会触发一个
translate3d(0,0,0) 的动画并以 fill-mode: both 保留终态。用户
滚回顶部、JS 移除这两个类时，transform 从 translate3d 回到 none，
GPU 合成层被销毁、栅格化模式切换，背景图的亚像素位置会发生肉眼
可见的整体漂移。
解决：对所有 .sticky-nav 状态强制禁用 animation + transform，
让背景始终用同一种栅格化方式渲染，杜绝任何切换型抖动。
============================================================ */
.sticky-nav,
.sticky-nav.menu_fixed,
.sticky-nav.animated,
.sticky-nav.fadeInDown,
.sticky-nav.menu_fixed.animated,
.sticky-nav.menu_fixed.fadeInDown,
.sticky-nav.menu_fixed.animated.fadeInDown,
.sticky-nav.animated.fadeInDown {
animation: none !important;
-webkit-animation: none !important;
animation-name: none !important;
animation-duration: 0s !important;
animation-fill-mode: none !important;
transform: none !important;
-webkit-transform: none !important;
will-change: auto !important;
}
/* =========================
导航栏 —— 五页色调渐变
Home（明亮+大桥） → About（中等磨砂） → Pipeline（深+大桥） → News / Careers（最深祖母绿）
========================= */
/* 首页 —— 明亮明翠绿 + 大桥（最年轻、最开放） */
body.is-home .sticky-nav:not(.menu_fixed) {
background:
linear-gradient(180deg, rgba(28, 130, 72, 0.74) 0%, rgba(20, 110, 58, 0.78) 100%),
url('/static/images/nav-bridge-bg.jpg') center 35% / cover no-repeat !important;
backdrop-filter: blur(2px) saturate(118%) !important;
-webkit-backdrop-filter: blur(2px) saturate(118%) !important;
box-shadow: 0 1px 0 rgba(255,255,255,0.14), 0 10px 32px rgba(0,0,0,0.16) !important;
}
body.is-home .sticky-nav.menu_fixed {
background:
linear-gradient(180deg, rgba(20, 110, 58, 0.84) 0%, rgba(15, 95, 50, 0.88) 100%),
url('/static/images/nav-bridge-bg.jpg') center 35% / cover no-repeat !important;
backdrop-filter: blur(2px) saturate(120%) !important;
-webkit-backdrop-filter: blur(2px) saturate(120%) !important;
box-shadow: 0 2px 18px rgba(0,0,0,0.18) !important;
}
/* 非首页统一导航 —— 大桥底图 + 满覆盖绿罩（罩层与底图同尺寸 cover）
注意：去掉底部 1px 白色 border/box-shadow，避免导航与 hero 之间出现白色细缝
兜底色：bg-color 设为绿罩主色，杜绝最左侧 1~2px 漏缝（fixed + scrollbar-gutter
组合可能产生的亚像素缝隙） */
body:not(.is-home) .sticky-nav,
body:not(.is-home) .sticky-nav:not(.menu_fixed),
body:not(.is-home) .sticky-nav.menu_fixed {
background-color: #2e8845 !important;
background-image:
linear-gradient(rgba(46, 136, 69, 0.96), rgba(46, 136, 69, 0.96)),
url('/static/images/nav-band-bg.jpg') !important;
/* 图横向放大 16px、整体左移 8px —— 让左右各预留 8px 安全余量，
彻底消除最左侧亚像素漏缝 */
background-size: calc(100vw + 16px) 100%, calc(100vw + 16px) 100% !important;
background-position: -8px 0, -8px 0 !important;
background-repeat: no-repeat, no-repeat !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
box-shadow: 0 10px 32px rgba(0,0,0,0.16) !important;
border-bottom: 0 !important;
}
/* 管线页导航 —— 图横向放大 16px、整体左移 8px，左右各 8px 安全余量 */
body.page-pipeline .sticky-nav,
body.page-pipeline .sticky-nav:not(.menu_fixed),
body.page-pipeline .sticky-nav.menu_fixed {
background-color: #3b8066 !important;
background-image: url('/static/images/nav-pipeline-bg.jpg?v=20260522slim') !important;
background-size: calc(100vw + 16px) 100% !important;
background-position: -8px 0 !important;
background-repeat: no-repeat !important;
border: none !important;
box-shadow: none !important;
padding: 0 !important;
}
/* 管线"产品详情"页导航 —— 比 Pipeline 列表深一档，从顶到底渐变收到 hero 顶部色 #2c6843，
nav→hero 无缝衔接；保留极弱大桥轮廓维持系列感 */
body.page-pipeline.page-yanfa-detail .sticky-nav,
body.page-pipeline.page-yanfa-detail .sticky-nav:not(.menu_fixed),
body.page-pipeline.page-yanfa-detail .sticky-nav.menu_fixed {
background:
linear-gradient(180deg, rgba(56, 130, 80, 0.86) 0%, rgba(44, 104, 67, 0.96) 100%),
url('/static/images/nav-pipeline-bg.jpg?v=20260522slim') center center / cover no-repeat !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
box-shadow: 0 6px 22px rgba(0, 0, 0, 0.18) !important;
}
/* 新闻 / 新闻详情页导航 —— 图横向放大 16px、整体左移 8px */
body.page-news .sticky-nav,
body.page-news .sticky-nav:not(.menu_fixed),
body.page-news .sticky-nav.menu_fixed,
body.page-news-detail .sticky-nav,
body.page-news-detail .sticky-nav:not(.menu_fixed),
body.page-news-detail .sticky-nav.menu_fixed {
background-color: #88a2bc !important;
background-image: url('/static/images/nav-news-bg.jpg?v=20260522slim') !important;
background-size: calc(100vw + 16px) 100% !important;
background-position: -8px 0 !important;
background-repeat: no-repeat !important;
border: none !important;
box-shadow: none !important;
padding: 0 !important;
}
/* 撤掉之前的 ::before mask 渐隐版本 */
body.page-news .sticky-nav::before,
body.page-news-detail .sticky-nav::before {
content: none !important;
}
/* news hero 顶部 ::after 起点改透明，避免暗化顶部使透出的天空色不一致 */
.page-news .ny-banner::after,
.page-news-detail .ny-banner::after {
background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.10) 30%, rgba(0,0,0,0.20) 65%, rgba(0,0,0,0.28) 100%) !important;
}
/* 加入我们页导航 —— 图横向放大 16px、整体左移 8px */
body.page-careers .sticky-nav,
body.page-careers .sticky-nav:not(.menu_fixed),
body.page-careers .sticky-nav.menu_fixed {
background-color: #c97c43 !important;
background-image: url('/static/images/nav-careers-orange-bridge.jpg?v=20260522slim') !important;
background-size: calc(100vw + 16px) 100% !important;
background-position: -8px 0 !important;
background-repeat: no-repeat !important;
border: none !important;
box-shadow: none !important;
padding: 0 !important;
}
/* 关于华元页导航 —— 图横向放大 16px、整体左移 8px */
body.page-about .sticky-nav,
body.page-about .sticky-nav:not(.menu_fixed),
body.page-about .sticky-nav.menu_fixed {
background-color: #a3b5c8 !important;
background-image: url('/static/images/nav-about-bg.jpg?v=20260522slim') !important;
background-size: calc(100vw + 16px) 100% !important;
background-position: -8px 0 !important;
background-repeat: no-repeat !important;
border: none !important;
box-shadow: none !important;
padding: 0 !important;
}
/* ============== 4. 横版Logo（球 + 文字分离） ============== */
.sticky-nav .top .logo {
width: auto !important;
min-width: 280px;
flex-shrink: 0;
}
.logo-h {
display: flex !important;
align-items: center !important;
}
.logo-h a,
.logo-h .logo-split,
.sticky-nav .top .logo a.logo-split {
display: inline-flex !important;
align-items: center !important;
gap: 14px !important;
text-decoration: none !important;
line-height: 1 !important;
}
.sticky-nav .top .logo img.logo-nav-sphere,
.logo-h img.logo-nav-sphere {
height: 72px !important;
max-height: 72px !important;
width: 72px !important;
max-width: 72px !important;
display: block !important;
filter: drop-shadow(0 2px 6px rgba(0,0,0,0.20));
flex-shrink: 0 !important;
object-fit: contain;
}
.logo-h .logo-nav-text,
.sticky-nav .top .logo .logo-nav-text {
font-family: 'Inter', 'Noto Sans SC', -apple-system, sans-serif !important;
font-size: 28px !important;
font-weight: 800 !important;
letter-spacing: 0.10em !important;
color: #ffffff !important;
line-height: 1 !important;
white-space: nowrap !important;
text-shadow: 0 1px 3px rgba(0,0,0,0.25);
display: inline-block;
}
/* 主 logo（合成版 logo-nav-new1.png）— 全局统一锁死 96px */
html body .sticky-nav .top .logo img,
html body .sticky-nav .top .logo img.logo-nav-img,
html body .logo-h .logo-nav-img,
html body .sticky-nav.menu_fixed .top .logo img,
html body .sticky-nav.menu_fixed .top .logo img.logo-nav-img,
html body .sticky-nav.menu_fixed .logo-h .logo-nav-img,
html body.is-home .sticky-nav .top .logo img,
html body.is-home .sticky-nav .top .logo img.logo-nav-img,
html body.is-home .sticky-nav.menu_fixed .top .logo img,
html body.page-pipeline .sticky-nav .top .logo img,
html body.page-pipeline .sticky-nav .top .logo img.logo-nav-img,
html body.page-pipeline .sticky-nav.menu_fixed .top .logo img,
html body.page-about .sticky-nav .top .logo img,
html body.page-news .sticky-nav .top .logo img,
html body.page-careers .sticky-nav .top .logo img {
height: 52px !important;
max-height: 52px !important;
min-height: 52px !important;
width: auto !important;
max-width: none !important;
transform: none !important;
transition: none !important;
display: block !important;
filter: drop-shadow(0 1px 3px rgba(0,0,0,0.18)) !important;
object-fit: contain !important;
}
html body .sticky-nav .top .logo img:hover,
html body .sticky-nav.menu_fixed .top .logo img:hover {
transform: none !important;
}
/* ============== 5. 导航菜单（内页文字质感）============== */
.nav h3 a,
.nav .m h3 a {
font-size: 15px !important;
font-weight: 600 !important;
color: rgba(255, 255, 255, 0.90) !important;
padding: 8px 0;
position: relative;
letter-spacing: 0.06em !important;
/* 不再动 letter-spacing —— 防止 hover 时单项变宽推开兄弟项 */
transition: color 0.12s ease-out, text-shadow 0.18s ease-out;
/* 单道锐利暗阴影做对比读取，不叠 12px halo */
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55);
}
/* 顶部装饰条 - 完全去除 */
.nav h3 a::before,
.nav .active a::before,
.nav .m.active h3 a::before {
content: none !important;
display: none !important;
}
/* 底部下划线 - 紧贴文字（hover 响应快、跟手） */
.nav h3 a::after {
content: "";
display: block;
position: absolute;
bottom: 0;
left: 50%;
width: 0;
height: 2.5px;
background: linear-gradient(90deg, transparent 0%, #ffffff 50%, transparent 100%);
transform: translateX(-50%);
border-radius: 2px;
transition: width 0.18s cubic-bezier(0.22, 0.61, 0.36, 1), opacity 0.12s ease-out;
opacity: 0;
box-shadow: 0 0 12px rgba(255,255,255,0.5);
}
.nav h3 a:hover {
color: #ffffff !important;
/* 锁死 letter-spacing 与基态一致，hover 时宽度不变 → 兄弟项不会被推 */
letter-spacing: 0.06em !important;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55), 0 0 14px rgba(255, 255, 255, 0.20) !important;
}
.nav h3 a:hover::after { width: 80%; opacity: 1; }
/* 激活态：纯白 + 略带白光晕，呼应下划线 */
.nav .active a,
.nav li.active h3 a,
.nav .m.active h3 a {
background: transparent !important;
color: #ffffff !important;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55), 0 0 12px rgba(255, 255, 255, 0.18) !important;
}
.nav li.active h3 a::after,
.nav .m.active h3 a::after,
.nav .active h3 a::after {
width: 80%;
opacity: 1;
}
/* 首页与其他页统一，无单独覆盖 */
/* active states moved to nav section above */
/* ============== 导航点击/聚焦反馈 —— 去掉浏览器原生方框，改为科技感发光 ============== */
/* 1) 消除手机端点击灰底高亮 */
.sticky-nav,
.sticky-nav * {
-webkit-tap-highlight-color: transparent !important;
}
/* 2) 鼠标点击 / :focus / :active：彻底去掉原生 outline + 任何 box-shadow 方框 */
.sticky-nav a:focus,
.sticky-nav a:active,
.sticky-nav button:focus,
.sticky-nav button:active,
.sticky-nav .btn:focus,
.sticky-nav .btn:active,
.navBar a:focus,
.navBar a:active,
.nav h3 a:focus,
.nav h3 a:active,
.nav .m h3 a:focus,
.nav .m h3 a:active {
outline: none !important;
box-shadow: none !important;
background: transparent !important;
}
/* 3) 主菜单聚焦 / 点击 —— 用现有的发光下划线作为反馈，并给文字一道轻量 neon 光晕 */
.nav h3 a:focus,
.nav h3 a:focus-visible,
.nav .m h3 a:focus,
.nav .m h3 a:focus-visible {
outline: none !important;
box-shadow: none !important;
text-shadow:
0 0 10px rgba(255,255,255,0.55),
0 0 18px rgba(255,255,255,0.22),
0 1px 3px rgba(0,0,0,0.35) !important;
}
.nav h3 a:focus::after,
.nav h3 a:focus-visible::after,
.nav .m h3 a:focus::after,
.nav .m h3 a:focus-visible::after {
width: 80% !important;
opacity: 1 !important;
}
/* 4) 右侧语言切换 / 搜索按钮：键盘聚焦时给细发光环（鼠标点击不显示） */
.sticky-nav .top-r a:focus-visible,
.sticky-nav .top-r button:focus-visible,
.sticky-nav .lang-globe-btn:focus-visible,
.sticky-nav .lang-option:focus-visible,
.sticky-nav .top-ss .btn:focus-visible {
outline: none !important;
box-shadow:
0 0 0 1px rgba(255,255,255,0.5),
0 0 12px rgba(255,255,255,0.32) !important;
border-radius: 6px;
}
/* Nav now has solid green background — text stays white on all pages.
The previous .is-home / .page-pipeline white-bg overrides have been removed. */
/* Nav layout — Grid 三栏严格固定，所有页面绝对一致 */
.sticky-nav .top {
display: grid !important;
grid-template-columns: 240px 1fr 240px !important;
align-items: center !important;
position: relative !important;
gap: 0 !important;
width: 100% !important;
}
/* Logo 列：固定 240px + 左内边距让 logo 不贴边（对齐首页大 logo 的视觉位置） */
.sticky-nav .top .logo {
width: 240px !important;
min-width: 240px !important;
max-width: 240px !important;
grid-column: 1 !important;
justify-self: start !important;
position: relative !important;
padding-left: 30px !important;
box-sizing: border-box !important;
}
/* Nav 列：菜单整体左移 10px（之前 -15，向右微调 5px） */
.sticky-nav .top .navBar {
grid-column: unset !important;
position: absolute !important;
left: 50% !important;
top: 50% !important;
/* 偏移补偿：让第 3 项（Pipeline / 研发管线）与球体中线重合。
-5px（在 -22 偏左 与 +12 偏右 之间取中）。CN 和 EN 同步。 */
transform: translate(calc(-50% - 5px), -50%) !important;
width: auto !important;
max-width: none !important;
background: transparent !important;
display: flex !important;
justify-content: center !important;
align-items: center !important;
z-index: 2 !important;
}
/* 中英文导航完全同步：相同的 -5px 偏移 */
html[lang="zh-CN"] .sticky-nav .top .navBar {
transform: translate(calc(-50% - 5px), -50%) !important;
}
.sticky-nav .top .navBar .nav {
width: auto !important;
display: flex !important;
justify-content: center !important;
align-items: center !important;
}
/* 右侧 240px：与左 logo 对称，让菜单真正居中页面 + 右侧内边距让 中|EN|🔍 向左缩进 */
.sticky-nav .top .top-r {
grid-column: 3 !important;
width: 240px !important;
min-width: 240px !important;
max-width: 240px !important;
justify-self: end !important;
display: flex !important;
align-items: center !important;
justify-content: flex-end !important;
padding-right: 60px !important;
box-sizing: border-box !important;
}
.navBar .nav {
display: flex !important;
justify-content: center !important;
align-items: center !important;
width: auto !important;
/* 整体收紧一档，仍保留适度呼吸 */
gap: clamp(28px, 3.6vw, 64px) !important;
margin: 0 !important;
}
/* 每项 min-width：中英文每个按钮宽度看齐，整体跨度一致，
第 3 项（Pipeline / 研发管线）自然落在 navBar 几何中心 */
.nav .m { display: inline-block; height: 75px; line-height: 75px; position: relative; padding: 0; margin: 0; flex: 0 0 auto !important; width: auto !important; min-width: clamp(78px, 6.4vw, 104px) !important; text-align: center; }
.nav .m h3 { margin: 0 !important; white-space: nowrap; height: 75px; line-height: 75px; display: flex; align-items: center; justify-content: center; }
.nav h3 a { padding: 0 4px !important; display: inline-block; white-space: nowrap; font-size: 15px !important; }
/* 隐藏 CONTACT 导航项（{pboot:nav} 最后一项） */
.navBar .nav .m:last-child,
.sjj_nav > ul > li:last-child { display: none !important; }
/* ============== 6. 搜索和语言切换 ============== */
.top-r { display: flex; align-items: center; gap: 12px; }
.lang-switch {
display: flex;
align-items: center;
gap: 8px;
}
.lang-globe-btn {
display: inline-flex;
align-items: center;
justify-content: center;
text-decoration: none !important;
cursor: pointer;
line-height: 1;
}
.lang-globe-icon {
width: 22px;
height: 22px;
color: rgba(255,255,255,0.6);
transition: color 0.2s;
}
.lang-globe-btn:hover .lang-globe-icon { color: #fff; }
.lang-options {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 13px;
font-weight: 600;
letter-spacing: 0.02em;
}
.lang-option {
color: rgba(255,255,255,0.6);
text-decoration: none !important;
transition: color 0.18s ease;
padding: 2px 1px;
}
.lang-option:hover { color: #fff; }
.lang-option-active { color: #fff; }
.lang-sep {
color: rgba(255,255,255,0.35);
user-select: none;
font-weight: 400;
}
.top-ss .btn { background: none !important; border: none !important; }
.top-ss .btn img { width: 20px; filter: brightness(0) invert(1); opacity: 0.6; }
.top-ss .btn:hover img { opacity: 1; }
/* ============== 7. 首页Hero ============== */
.idx-hero {
position: relative;
width: 100%;
/* 与其他内页 .ny-banner 同高，确保底部 Slogan 与其他页面 HERO 底部持平 */
height: 81vh !important;
min-height: 81vh !important;
max-height: 81vh !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
padding: 95px 0 0 !important;
box-sizing: border-box;
background:
/* 极淡的中心呼吸（不晕） */
radial-gradient(ellipse 75% 55% at 50% 52%, rgba(9, 106, 61, 0.022) 0%, transparent 60%),
/* 工程精度感的点阵纹理 —— 1px 点，34px 间距，alpha 0.045，几乎不可见但有"科学制图"质感 */
radial-gradient(circle at center, rgba(9, 106, 61, 0.045) 0.9px, transparent 1.4px) 0 0 / 34px 34px,
/* 顶部 / 底部柔和的边界感，分别淡入白色 */
linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 18%, rgba(255,255,255,0) 82%, rgba(255,255,255,1) 100%),
#ffffff !important;
overflow: hidden;
}
.idx-hero::before,
.idx-hero::after { content: none !important; display: none !important; }
.idx-hero-overlay { display: none !important; }
.idx-hero-pattern {
position: absolute;
inset: 0;
color: rgba(52,211,153,0.05);
pointer-events: none;
}
.idx-hero-pattern svg { width: 100%; height: 100%; }
.idx-hero-content {
position: relative;
z-index: 2;
display: flex;
align-items: center;
justify-content: space-between;
gap: 40px;
padding: 40px 0 60px;
}
/* Slide-1 style hero (homepage): centered logo + title */
.idx-hero-slide .idx-hero-content {
justify-content: center;
text-align: center;
padding: 0 !important;
}
.idx-slide {
width: 100%;
max-width: 760px;
margin: 0 auto;
text-align: center;
}
.idx-slide-logo {
display: block;
margin: 0 auto 18px;
width: clamp(110px, 11vw, 168px);
height: auto;
/* 球体下方一道极淡的绿色投影 + 顶部高光，让球"落"在页面而不悬浮 */
filter:
drop-shadow(0 6px 20px rgba(9, 106, 61, 0.18))
drop-shadow(0 2px 6px rgba(9, 106, 61, 0.12));
animation: heroLogoFloat 6s ease-in-out infinite;
}
/* 球体后的辐射晕环（位于背后，极淡） —— 在 .idx-slide 上用伪元素绘制 */
.idx-slide { position: relative; }
.idx-slide::before {
content: "";
position: absolute;
top: clamp(-30px, -2vw, -10px);
left: 50%;
transform: translateX(-50%);
width: clamp(280px, 32vw, 480px);
height: clamp(280px, 32vw, 480px);
background:
radial-gradient(circle, rgba(9, 106, 61, 0.07) 0%, rgba(9, 106, 61, 0.03) 35%, transparent 70%);
pointer-events: none;
z-index: -1;
border-radius: 50%;
}
@keyframes heroLogoFloat {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-6px); }
}
.idx-slide-title {
font-size: clamp(34px, 4.6vw, 60px);
font-weight: 800;
letter-spacing: 0.12em;
line-height: 1.05;
margin: 0 auto;
background: linear-gradient(135deg, #096a3d 0%, #2ea765 45%, #5a9132 100%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
text-shadow: 0 2px 14px rgba(9,106,61,0.10);
position: relative;
}
/* 标题下细金线 —— 高端编辑级分隔 */
.idx-slide-title::after {
content: "";
display: block;
width: 56px;
height: 1.2px;
background: linear-gradient(90deg, transparent 0%, rgba(9, 106, 61, 0.55) 50%, transparent 100%);
margin: 20px auto 0;
}
.idx-slide-accent { display: none !important; }
.idx-slide-accent::before,
.idx-slide-accent::after { display: none !important; }
.idx-slide-slogan {
position: relative;
display: block;
margin: 36px auto 0;
z-index: 3;
text-align: center;
font-size: clamp(18px, 2vw, 28px);
font-weight: 800;
color: #ffffff;
letter-spacing: 0.14em;
line-height: 1.4;
font-style: italic;
background: none;
text-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}
.idx-slide-slogan::before,
.idx-slide-slogan::after { content: none !important; display: none !important; }
.idx-slide-copyright {
position: absolute;
right: clamp(16px, 2vw, 36px);
bottom: clamp(10px, 1.5vh, 22px);
z-index: 3;
font-size: 11px;
font-weight: 600;
letter-spacing: 0.16em;
color: rgba(255,255,255,0.85);
pointer-events: none;
}
.idx-hero-text { flex: 0 0 50%; max-width: 50%; }
.idx-hero-text h1 {
font-size: 52px;
font-weight: 700;
color: #0d5b2a;
margin: 0 0 20px;
text-shadow: none;
line-height: 1.15;
letter-spacing: 0.02em;
}
.idx-hero-text h2 {
font-size: 28px;
font-weight: 700;
color: #4f8a1f;
margin: 0 0 40px;
}
.idx-hero-btns { display: flex; gap: 16px; }
.idx-btn-primary {
display: inline-block;
padding: 16px 40px;
background: linear-gradient(135deg, var(--emerald-600), var(--emerald-500));
color: #fff !important;
border-radius: 8px;
font-size: 15px;
font-weight: 600;
transition: all 0.3s;
box-shadow: 0 4px 15px rgba(9,106,61,0.3);
}
.idx-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(9,106,61,0.4); }
.idx-btn-outline {
display: inline-block;
padding: 16px 40px;
border: 2px solid #096a3d;
color: #096a3d !important;
border-radius: 8px;
font-size: 15px;
font-weight: 600;
transition: all 0.3s;
background: rgba(255,255,255,0.6);
}
.idx-btn-outline:hover { border-color: #0d5b2a; color: #0d5b2a !important; background: #fff; }
.idx-hero-img {
width: 38%;
min-width: 380px;
position: relative;
display: flex;
align-items: flex-start;
justify-content: flex-end;
margin-top: -50px;
margin-right: -20px;
}
.idx-hero-img img {
width: 100%;
border-radius: 0;
box-shadow: none;
mask-image: radial-gradient(ellipse 68% 68% at center, rgba(0,0,0,1) 40%, rgba(0,0,0,0) 72%);
-webkit-mask-image: radial-gradient(ellipse 68% 68% at center, rgba(0,0,0,1) 40%, rgba(0,0,0,0) 72%);
}
/* ============== 8. 统计数字 ============== */
.idx-stats {
background: linear-gradient(180deg, #ffffff 0%, #fafbfc 60%, #f5f7f9 100%);
padding: 56px 0 48px;
border-bottom: 1px solid #eee;
position: relative;
}
.idx-stats::before {
content: "";
position: absolute;
inset: 0;
background-image:
radial-gradient(circle at 20% 50%, rgba(9,106,61,0.03) 0%, transparent 50%),
radial-gradient(circle at 80% 50%, rgba(9,106,61,0.02) 0%, transparent 50%);
pointer-events: none;
}
.idx-stats-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 0;
}
.idx-stat-item {
text-align: center;
padding: 20px;
position: relative;
}
.idx-stat-item:not(:last-child)::after {
content: "";
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
width: 1px;
height: 40px;
background: #eee;
}
.idx-stat-num {
font-size: 40px;
font-weight: 800;
color: #096a3d;
line-height: 1.1;
margin-bottom: 6px;
}
.idx-stat-label {
font-size: 14px;
color: #888;
}
/* ============== 9. 理念区 ============== */
.idx-philosophy {
background: linear-gradient(135deg, #f4f6f9 0%, #eaeef3 50%, #f0f2f6 100%);
padding: 80px 0;
text-align: center;
position: relative;
overflow: hidden;
color: #333;
}
.idx-philosophy::before {
content: "";
position: absolute;
inset: 0;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cpath d='M40 0L80 20V60L40 80L0 60V20Z' fill='none' stroke='rgba(9,106,61,0.05)' stroke-width='0.5'/%3E%3C/svg%3E");
background-size: 80px 80px;
pointer-events: none;
}
.idx-philosophy::after {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 600px;
height: 600px;
border: 1px solid rgba(9,106,61,0.06);
border-radius: 50%;
pointer-events: none;
box-shadow: 0 0 120px rgba(9,106,61,0.04) inset;
}
.idx-section-title {
font-size: 36px;
font-weight: 700;
color: var(--gray-800);
text-align: center;
position: relative;
display: block;
margin: 0;
}
.idx-section-title::after {
content: "";
display: block;
width: 40px;
height: 3px;
background: #096a3d;
margin: 12px auto 0;
border-radius: 2px;
}
/* Philosophy slogan */
.idx-philosophy-slogan {
font-size: 22px !important;
font-weight: 600 !important;
color: #096a3d !important;
letter-spacing: 0.05em !important;
margin-top: 20px !important;
cursor: pointer;
transition: all 0.3s;
}
.idx-philosophy-slogan:hover {
color: var(--emerald-700) !important;
transform: scale(1.02);
}
.idx-philosophy .idx-section-title {
color: #1a1a2e !important;
}
.idx-philosophy .idx-section-title::after {
background: #096a3d !important;
}
/* ============== 10. 首页管线区 ============== */
.idx-pipeline {
background: #fff;
padding: 44px 0 52px;
position: relative;
}
.idx-pipeline::before {
content: "";
position: absolute;
inset: 0;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cpath d='M50 0L100 25V75L50 100L0 75V25Z' fill='none' stroke='rgba(9,106,61,0.03)' stroke-width='0.5'/%3E%3C/svg%3E");
background-size: 100px 100px;
pointer-events: none;
}
.idx-pipeline .idx-section-title {
margin-bottom: 36px !important;
}
body.is-home .idx-pipeline .hy-pipeline-subtitle {
margin-top: 12px !important;
margin-bottom: 48px !important;
}
/* ============== 11. 最新动态 ============== */
.idx-news {
background: url(../images/news-bg2.webp) no-repeat center / cover, linear-gradient(135deg, #e8f5f0 0%, #dff0ea 50%, #e5f3ed 100%);
padding: 72px 0 80px;
position: relative;
overflow: hidden;
}
.idx-news::before {
display: none;
}
.idx-news::after {
display: none;
}
.idx-news-pattern {
position: absolute;
inset: 0;
pointer-events: none;
}
.idx-news-pattern svg { width: 100%; height: 100%; }
.idx-news .idx-section-title { color: #1a1a2e; }
.idx-news .idx-section-title::after { background: #096a3d; }
.idx-news-header { margin-bottom: 36px; text-align: center; }
.idx-news-cards {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 28px;
}
.idx-news-card-inner {
background: rgba(255,255,255,0.75);
border: 1px solid rgba(9,106,61,0.1);
border-radius: 16px;
overflow: hidden;
backdrop-filter: blur(12px);
transition: all 0.35s ease;
height: 100%;
position: relative;
box-shadow: 0 2px 16px rgba(0,0,0,0.06);
}
.idx-news-card-inner::before {
display: none;
}
.idx-news-card a { text-decoration: none; display: block; height: 100%; }
.idx-news-card-inner:hover {
background: rgba(255,255,255,0.9);
border-color: rgba(9,106,61,0.2);
transform: translateY(-6px);
box-shadow: 0 12px 32px rgba(0,0,0,0.1), 0 0 16px rgba(9,106,61,0.06);
}
.idx-news-card-bar {
height: 3px;
background: linear-gradient(90deg, #096a3d, #34d399);
position: relative;
overflow: hidden;
}
.idx-news-card-bar::after {
content: "";
position: absolute;
top: 0;
left: -100%;
width: 50%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.7), transparent);
animation: newsBarShimmer 3s ease-in-out infinite;
}
@keyframes newsBarShimmer {
0% { left: -100%; }
100% { left: 200%; }
}
.idx-news-card-body { padding: 28px; }
.idx-news-date {
font-size: 13px;
color: #888;
font-family: 'Inter', sans-serif;
letter-spacing: 0.03em;
}
.idx-news-card-title {
font-size: 17px;
font-weight: 600;
color: #1a1a2e;
line-height: 1.55;
margin: 12px 0;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.idx-news-card-desc {
font-size: 13.5px;
color: #666;
line-height: 1.75;
margin-bottom: 18px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.idx-news-more {
font-size: 13px;
color: #096a3d;
font-weight: 500;
transition: color 0.2s;
}
.idx-news-card-inner:hover .idx-news-more {
color: #065f46;
}
/* 去掉首页新闻卡 默认 focus/active 黑边框 + 移动端 tap 高亮，
用更优雅的"卡片轻微下沉 + 加深阴影"替代点击反馈 */
.idx-news-card a,
.idx-news-card a:link,
.idx-news-card a:visited,
.idx-news-card a:hover,
.idx-news-card a:focus,
.idx-news-card a:active,
.idx-news-card a:focus-visible {
outline: none !important;
outline-offset: 0 !important;
box-shadow: none !important;
border: none !important;
-webkit-tap-highlight-color: transparent !important;
-webkit-touch-callout: none !important;
}
/* 键盘 Tab 聚焦时，给卡片本体一个柔和绿色光晕（无障碍兼容，不丑） */
.idx-news-card a:focus-visible .idx-news-card-inner {
box-shadow:
0 0 0 2px rgba(9,106,61,0.35),
0 12px 32px rgba(0,0,0,0.10),
0 0 16px rgba(9,106,61,0.10) !important;
}
/* 鼠标点击按下瞬间的"按压"反馈，比黑边框高级得多 */
.idx-news-card a:active .idx-news-card-inner {
transform: translateY(-2px) scale(0.997) !important;
transition: transform 0.12s cubic-bezier(0.22,0.61,0.36,1) !important;
}
/* ============== 12. 首页响应式 ============== */
@media screen and (max-width:1200px) {
.idx-hero-content { flex-direction: column; text-align: center; padding: 120px 0 60px; }
.idx-hero-text h1 { font-size: 36px; }
.idx-hero-btns { justify-content: center; }
.idx-hero-img { width: 320px; }
.idx-stats-grid { grid-template-columns: repeat(2, 1fr); }
.idx-news-cards { grid-template-columns: 1fr; }
}
@media screen and (max-width:768px) {
.idx-hero-text h1 { font-size: 28px; }
.idx-hero-text h2 { font-size: 16px; }
.idx-hero-img { width: 260px; }
.idx-stat-num { font-size: 32px; }
}
/* ============== 13. 内页Banner ============== */
.ny-banner {
margin-top: 0 !important;
width: 100vw !important;
max-width: 100vw !important;
margin-left: calc(-50vw + 50%) !important;
background-color: #0a0e17;
background-size: cover !important;
background-position: center !important;
text-align: center !important;
position: relative;
overflow: hidden;
height: 81vh !important;
min-height: 0 !important;
max-height: none !important;
padding-top: 75px !important;
box-sizing: border-box !important;
}
.ny-banner::before {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(135deg, rgba(10,22,40,0.2) 0%, rgba(19,42,79,0.12) 50%, rgba(13,31,61,0.18) 100%);
z-index: 1;
}
.ny-banner .cont1400 {
position: relative;
z-index: 2;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 100%;
}
.ny-banner h2 {
color: #fff !important;
font-size: 48px !important;
font-weight: 700 !important;
text-shadow: 0 2px 10px rgba(0,0,0,0.3);
padding: 0 !important;
}
.ny-banner h2::after { display: none !important; }
.ny-banner p {
color: rgba(255,255,255,0.55) !important;
font-size: 17px !important;
font-weight: 300 !important;
letter-spacing: 0.18em !important;
margin-top: 14px !important;
text-shadow: 0 1px 6px rgba(0,0,0,0.4) !important;
}
/* 新闻页banner —— 图片移到 ::before 以便单独加增强滤镜（提饱和+对比度去雾），
文字（在 .cont1400 z-index:2 上层）不受影响 */
.page-news .ny-banner {
background-image: none !important;
background-color: #0a1430 !important;
height: 81vh !important;
max-height: none !important;
margin-bottom: 0 !important;
overflow: hidden;
}
.page-news .ny-banner::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
background: url('/static/images/hero-backgrounds/hero-news-bg.jpg?v=20260522darkfix') center / cover no-repeat !important;
filter: saturate(1.55) contrast(1.18) brightness(1.05) !important;
z-index: 0 !important;
}
/* 管线页banner */
.page-pipeline .ny-banner {
background-image: url(/static/images/hero-backgrounds/hero-pipeline-bg.webp) !important;
background-size: cover !important;
background-position: center !important;
}
.page-pipeline .ny-banner::before {
background: linear-gradient(135deg, rgba(10,22,40,0.18) 0%, rgba(19,42,79,0.1) 50%, rgba(13,31,61,0.15) 100%) !important;
}
/* 加入我们页banner —— 去除滤镜，图片保持原色 */
.page-careers .ny-banner {
background: url('/static/images/hero-backgrounds/hero-careers-bg.jpg?v=20260522slim') no-repeat center / cover !important;
background-image: url('/static/images/hero-backgrounds/hero-careers-bg.jpg?v=20260522slim') !important;
background-size: cover !important;
background-position: center !important;
}
.page-careers .ny-banner::before {
background: transparent !important;
}
/* News / Careers 标题 —— 用文字光晕（halo）保证可读性，不需要全图滤镜 */
.page-news .ny-banner h2,
.page-careers .ny-banner h2 {
font-weight: 800 !important;
letter-spacing: 0.04em !important;
text-shadow:
0 2px 18px rgba(0, 0, 0, 0.72),
0 1px 4px rgba(0, 0, 0, 0.55),
0 0 90px rgba(0, 0, 0, 0.45) !important;
position: relative;
display: inline-block;
}
/* 标题下方一条细金线，提升精致感 */
.page-news .ny-banner h2::after,
.page-careers .ny-banner h2::after {
content: "" !important;
display: block !important;
width: 56px !important;
height: 2px !important;
background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.85) 50%, transparent 100%) !important;
margin: 18px auto 0 !important;
position: static !important;
opacity: 0.92;
}
.page-news .ny-banner p,
.page-careers .ny-banner p {
color: rgba(255, 255, 255, 0.92) !important;
text-shadow:
0 2px 10px rgba(0, 0, 0, 0.65),
0 0 30px rgba(0, 0, 0, 0.4) !important;
}
/* 图片轻微放大动效（Ken Burns），让 hero 更有生命力 —— 完全不影响色调
注：新闻页已要求静止，从动画列表里摘掉 */
@keyframes heroKenBurns {
0% { transform: scale(1); }
100% { transform: scale(1.045); }
}
.page-careers .ny-banner {
animation: heroKenBurns 18s ease-out forwards;
transform-origin: 50% 55%;
}
.page-news .ny-banner,
.page-news-detail .ny-banner {
animation: none !important;
transform: none !important;
}
/* ============== Pipeline chart (shared: home + pipeline page) ============== */
.hy-pipeline-chart-section {
padding: 28px 0 44px;
background: #fff;
}
.hy-pipeline-subtitle {
text-align: center;
color: #3d4842;
font-size: clamp(13px, 1.05vw, 17px);
font-weight: 400;
line-height: 1.5;
margin: 0 auto 36px;
letter-spacing: 0.005em;
white-space: nowrap;
}
@media (max-width: 1000px) {
.hy-pipeline-subtitle {
white-space: normal;
font-size: 14px;
max-width: 720px;
line-height: 1.6;
}
}
/* Pipeline 页面 — Lead 段落版（位于流行率图与表格之间，作为视觉桥梁）
设计意图：与上方 "Global Unmet Need" 标题形成「主标题 → 引导文」的层次。
- 字号小一档（不与标题争夺权重）
- 字重 500（介于正文与标题之间）
- 颜色：muted gray-green，比标题的深绿淡一档
- 不再使用粗壮的左 ::before 装饰条，改为顶端居中一个极小的圆点 + 细线，作为静默的"段落锚点"
*/
/* 与 Global Unmet Need 形成「呼应配对」：
- Global Unmet Need ：渐变绿 + uppercase + 标题下方 56px 绿光柱
- Robust pipeline ：同源渐变绿 + 段落上方 56px 绿光柱（镜像）
两个模块共享同一道光柱作为"视觉勾连"，并通过尺寸 / 字距维持清晰层次 */
.page-pipeline .hy-pipeline-subtitle {
position: relative;
display: block;
font-family: 'Inter', 'Noto Sans SC', -apple-system, sans-serif !important;
background: linear-gradient(135deg, #0d6b3d 0%, #1f8a4f 55%, #2ea765 100%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
font-size: clamp(18px, 1.45vw, 26px);
font-weight: 700;
letter-spacing: 0.02em;
line-height: 1.55;
margin: 58px auto 60px;
padding: 30px 24px 0;
white-space: normal;
max-width: 1080px;
text-align: center;
}
/* 顶部 56px 绿光柱 —— 与 Global Unmet Need 下方的分隔线镜像 */
.page-pipeline .hy-pipeline-subtitle::before {
content: "" !important;
display: block !important;
position: absolute !important;
left: 50% !important;
top: 0 !important;
transform: translateX(-50%) !important;
width: 56px !important;
height: 2px !important;
margin: 0 !important;
border-radius: 2px !important;
background: linear-gradient(90deg, transparent 0%, #2ea765 50%, transparent 100%) !important;
box-shadow: 0 0 14px rgba(46,167,101,0.35) !important;
}
/* 不再使用 ::first-letter 编辑式放大 */
.page-pipeline .hy-pipeline-subtitle::first-letter {
color: inherit;
font-weight: inherit;
font-size: inherit;
}
@media (max-width: 1000px) {
.page-pipeline .hy-pipeline-subtitle {
font-size: 17px;
max-width: 760px;
line-height: 1.6;
margin: 44px auto 40px;
padding-top: 26px;
}
.page-pipeline .hy-pipeline-subtitle::before { width: 44px !important; }
}
/* On pipeline page (chart now standalone, no hero) — re-show subtitle */
.page-pipeline .hy-pipeline-subtitle { display: block; }
/* Standalone chart section — comfortable breathing room beyond the 84px fixed nav */
.hy-pipeline-chart-section--standalone {
padding-top: 24px;
padding-bottom: clamp(60px, 7vh, 90px);
}
/* Pipeline 流行率介绍区（位于管线图之上） */
.pipeline-prevalence-section {
padding: clamp(40px, 5vh, 64px) 0 clamp(48px, 6vh, 80px);
background: #ffffff;
}
/* 中文版：导语紧跟管线图，压缩 prevalence-section 上间距 */
html[lang="zh-CN"] .pipeline-prevalence-section {
padding-top: clamp(8px, 1.2vh, 18px) !important;
}
html[lang="zh-CN"] .pipeline-prevalence-head {
margin-bottom: 14px !important;
}
/* 导语与下方"全球未被满足的临床需求"标题之间增加一行行距 */
html[lang="zh-CN"] .pipeline-prevalence-lead {
margin-bottom: 36px !important;
}
.pipeline-prevalence-head {
text-align: center;
max-width: 880px;
margin: 0 auto 20px;
padding: 0 24px;
}
.pipeline-prevalence-eyebrow {
display: inline-block;
font-size: 12px;
font-weight: 700;
letter-spacing: 0.22em;
text-transform: uppercase;
color: #2f9e5e;
margin-bottom: 14px;
}
/* 当 eyebrow 单独作为标题使用时，放大字号并使用绿色渐变（替代原来的 .pipeline-prevalence-title） */
.pipeline-prevalence-eyebrow--lead {
display: block;
position: relative;
font-family: 'Inter', 'Noto Sans SC', -apple-system, sans-serif;
font-size: clamp(30px, 3.4vw, 48px);
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
line-height: 1.18;
margin: 0 auto 28px;
padding-bottom: 22px;
background: linear-gradient(135deg, #096a3d 0%, #2ea765 50%, #5a9132 100%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
}
/* 标题下方一道细绿色分隔线 —— 引导视线向下到流行率图 */
.pipeline-prevalence-eyebrow--lead::after {
content: "";
position: absolute;
left: 50%;
bottom: 0;
transform: translateX(-50%);
width: 56px;
height: 2px;
background: linear-gradient(90deg, transparent 0%, #2ea765 50%, transparent 100%);
border-radius: 2px;
box-shadow: 0 0 14px rgba(46,167,101,0.35);
}
/* 中文页面：字号略收，行高略紧 */
html[lang="zh-CN"] .pipeline-prevalence-eyebrow--lead,
body:lang(zh) .pipeline-prevalence-eyebrow--lead {
font-size: clamp(26px, 2.8vw, 40px);
letter-spacing: 0.10em;
text-transform: none;
}
.pipeline-prevalence-title {
font-size: clamp(28px, 3vw, 40px);
font-weight: 700;
letter-spacing: -0.005em;
line-height: 1.2;
margin: 0 0 14px;
background: linear-gradient(135deg, #096a3d 0%, #2ea765 50%, #5a9132 100%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
}
.pipeline-prevalence-sub {
font-size: clamp(14px, 1.15vw, 17px);
color: #5b6770;
line-height: 1.7;
margin: 0;
max-width: 720px;
margin-left: auto;
margin-right: auto;
}
/* 大标题前的引语：绿色、优雅，但无任何线条/下划线/分隔符装饰 */
.pipeline-prevalence-lead {
font-family: 'Inter', 'Noto Sans SC', -apple-system, 'Segoe UI', sans-serif;
font-size: clamp(18px, 1.8vw, 26px);
font-weight: 600;
color: #2f8a52;
line-height: 1.45;
letter-spacing: 0.01em;
text-align: center;
margin: 0 auto 44px; /* 与下方大标题之间留出一个空行视觉缓冲，强化破折号"埋伏笔→揭示"的过渡 */
max-width: 880px;
padding: 0 12px;
border: 0;
text-decoration: none;
}
.pipeline-prevalence-lead::before,
.pipeline-prevalence-lead::after { content: none !important; }
html[lang="zh-CN"] .pipeline-prevalence-lead,
body:lang(zh) .pipeline-prevalence-lead {
font-size: clamp(17px, 1.6vw, 24px);
letter-spacing: 0.02em;
}
.pipeline-prevalence-figure {
max-width: 1280px;
margin: 0 auto;
padding: 0 16px;
text-align: center;
}
.pipeline-prevalence-figure img {
display: block;
width: 100%;
height: auto;
border-radius: 0;
box-shadow: none;
/* 透明 PNG 与白色 section 自然融合，去掉硬投影避免「白色边框」感；
只保留极轻的整图柔光，让色块带显得有体积而不像贴纸 */
filter: drop-shadow(0 8px 22px rgba(13, 107, 61, 0.08));
}
@media (max-width: 768px) {
.pipeline-prevalence-section { padding-top: clamp(28px, 4vh, 44px); }
.pipeline-prevalence-head { margin-bottom: 24px; }
.page-pipeline .hy-pipeline-chart-section--standalone { padding-top: clamp(110px, 14vh, 160px); }
}
.page-pipeline .hy-pipeline-chart-section--standalone {
padding-top: clamp(140px, 14vh, 190px);
padding-bottom: clamp(36px, 4vh, 56px);
}
.hy-pipeline-card {
background: #fff;
border-radius: 14px;
box-shadow:
0 24px 60px rgba(15, 23, 42, 0.07),
0 4px 12px rgba(15, 23, 42, 0.03),
inset 0 1px 0 rgba(255, 255, 255, 0.9);
overflow: hidden;
border: 1px solid #eaecf0;
}
.hy-pipeline-table {
width: 100%;
border-collapse: collapse;
font-size: 13.5px;
color: #2d3a33;
table-layout: fixed;
}
.hy-pipeline-table thead th {
padding: 18px 8px;
background: linear-gradient(180deg, #f8fafc 0%, #f1f4f8 100%);
color: #1e293b;
font-weight: 600;
font-size: 13.5px;
letter-spacing: 0.04em;
text-align: center;
border-bottom: 1.5px solid #7eb138;
vertical-align: middle;
line-height: 1.35;
white-space: nowrap;
}
.hy-pipeline-table tbody td {
padding: 13px 8px;
vertical-align: middle;
border-bottom: 1px solid #f0f1f4;
text-align: center;
background: #fff;
transition: background 0.18s ease;
line-height: 1.35;
}
.hy-pipeline-table tbody tr:last-child td { border-bottom: none; }
/* Classic gray/white zebra striping */
.hy-pipeline-table tbody tr:nth-child(even) > td { background: #f8f9fb; }
.hy-pipeline-table tbody tr:hover td { background: #eef1f5 !important; }
.hy-pc-project { width: 13%; }
.hy-pc-indication { width: 17%; }
.hy-pc-target { width: 14%; }
.hy-pc-stage { width: 9.333%; }
.hy-cell-project {
font-weight: 700;
color: #3d7311;
font-size: 14.5px;
letter-spacing: 0.005em;
white-space: nowrap;
}
.hy-cell-indication {
color: #1f2937;
font-size: 13px;
font-weight: 500;
}
/* 标记为 nowrap 的 indication 单元格：所有断点强制不换行
（比如 "Postoperative Pain (oral)" 防止 ) 单独换行） */
.hy-cell-indication.hy-cell-indication--nowrap {
white-space: nowrap !important;
}
.hy-cell-target {
color: #475569;
font-size: 12.5px;
font-weight: 500;
}
.hy-cell-bar {
padding: 13px 0 !important;
position: relative;
background-image: linear-gradient(to right, #e6e8ec 1px, transparent 1px);
background-size: calc(100% / 6) 100%;
background-repeat: repeat-x;
background-position-x: -1px;
background-color: #fff;
border-left: 1px solid #e6e8ec;
text-align: left;
}
.hy-pipeline-table tbody tr:nth-child(even) > td.hy-cell-bar {
background-color: #f8f9fb;
}
.hy-bar {
display: block;
height: 20px;
border-radius: 10px;
width: calc(var(--end) / 6 * 100%);
min-width: 20px;
background:
linear-gradient(180deg, rgba(255,255,255,0.20) 0%, rgba(255,255,255,0.04) 50%, rgba(0,0,0,0.06) 100%),
linear-gradient(90deg, #3d7311 0%, #5fa024 55%, #7ab838 100%);
box-shadow:
0 2px 5px rgba(63, 115, 17, 0.30),
inset 0 1px 0 rgba(255, 255, 255, 0.30),
inset 0 -1px 1px rgba(0, 0, 0, 0.05);
transition: filter 0.2s ease;
}
.hy-pipeline-table tbody tr:hover .hy-bar { filter: brightness(1.07); }
.hy-grp-end td { border-bottom-color: #d2dec5 !important; }
/* ============== 中文版管线图字体优化 ==============
仅对 生效，英文版完全不受影响。
- 字体栈优先 PingFang / 微软雅黑 / 思源黑体
- 启用 OpenType 字距/比例约定，CJK 混排时更精致
- 字重区分层次（表头 700、项目名 700、正文 500），更有质感 */
html[lang="zh-CN"] .hy-pipeline-table {
font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Source Han Sans CN", "Source Han Sans SC", "Noto Sans SC", -apple-system, BlinkMacSystemFont, sans-serif !important;
text-rendering: optimizeLegibility !important;
font-feature-settings: "palt" 1, "kern" 1 !important;
-webkit-font-smoothing: antialiased !important;
-moz-osx-font-smoothing: grayscale !important;
}
/* 表头：克制的强 —— 适度字距、品牌绿、weight 600 与下方产品名呼应 */
html[lang="zh-CN"] .hy-pipeline-table thead th {
font-size: 16.5px !important;
font-weight: 600 !important;
letter-spacing: 0.04em !important;
color: #0c5132 !important;
text-transform: none !important;
}
/* 主列：产品名 —— 最强视觉权重，品牌深绿 */
html[lang="zh-CN"] .hy-cell-project {
font-size: 17px !important;
font-weight: 700 !important;
letter-spacing: 0.01em !important;
color: #0c5132 !important;
}
html[lang="zh-CN"] .hy-cell-project a {
color: #0c5132 !important;
}
/* 长拉丁项目名（Deubuprenorphine / Deurotundine）字号略收小、字距紧凑避免出列 */
html[lang="zh-CN"] .hy-cell-project.hy-cell-project--latin,
html[lang="zh-CN"] .hy-cell-project.hy-cell-project--latin a {
font-size: 14.5px !important;
letter-spacing: -0.02em !important;
font-family: "Inter", "PingFang SC", "Microsoft YaHei", sans-serif !important;
}
html[lang="zh-CN"] .page-pipeline .hy-cell-project.hy-cell-project--latin,
html[lang="zh-CN"] .page-pipeline .hy-cell-project.hy-cell-project--latin a {
font-size: 15.5px !important;
}
/* 次列：适应症 —— 中等权重 + 深色，与产品列拉开对比但保持可读 */
html[lang="zh-CN"] .hy-cell-indication {
font-size: 15px !important;
font-weight: 500 !important;
letter-spacing: 0.03em !important;
color: #1e293b !important;
line-height: 1.6 !important;
}
/* 辅列：作用机制 —— 最弱权重，浅灰，形成第三层级 */
html[lang="zh-CN"] .hy-cell-target {
font-size: 13.5px !important;
font-weight: 400 !important;
letter-spacing: 0.04em !important;
color: #64748b !important;
line-height: 1.65 !important;
}
/* 表格本身：行高/边距给汉字呼吸感 */
html[lang="zh-CN"] .hy-pipeline-table tbody td {
padding-top: 15px !important;
padding-bottom: 15px !important;
}
/* 个别 mechanism 单元格强制单行（如 HY-2147 的"小分子外周 κ 受体激动剂"）
字号大幅收缩 + 负字距，确保在所有页面 13% 列宽内不溢出 */
html[lang="zh-CN"] .hy-cell-target.hy-cell-target--nowrap {
white-space: nowrap !important;
font-size: 11px !important;
letter-spacing: -0.03em !important;
}
html[lang="zh-CN"] .page-pipeline .hy-cell-target.hy-cell-target--nowrap {
font-size: 11.5px !important;
letter-spacing: -0.03em !important;
}
/* 边界长度 cell（如 HY-2518 的"阿片受体四重激动剂"）—— 保持字号但强制不换行
防止单个"剂"字被挤到下一行 */
html[lang="zh-CN"] .hy-cell-target.hy-cell-target--keepline {
white-space: nowrap !important;
letter-spacing: 0.02em !important;
}
/* 显式控制换行的 cell 内部包一层 span，给行高更紧凑显示 */
html[lang="zh-CN"] .hy-pipeline-table tbody .hy-cell-balanced {
display: inline-block;
line-height: 1.4;
}
html[lang="zh-CN"] .hy-pipeline-table thead th {
padding-top: 18px !important;
padding-bottom: 14px !important;
border-bottom: 2px solid #cbd5e1 !important;
}
/* 行间分隔线更柔和（淡灰） */
html[lang="zh-CN"] .hy-pipeline-table tbody td {
border-bottom-color: #eef0f3 !important;
}
/* 详情页 (.page-pipeline) 同步放大 */
html[lang="zh-CN"] .page-pipeline .hy-pipeline-table thead th {
font-size: 17.5px !important;
letter-spacing: 0.04em !important;
}
html[lang="zh-CN"] .page-pipeline .hy-cell-project {
font-size: 18.5px !important;
}
html[lang="zh-CN"] .page-pipeline .hy-cell-indication {
font-size: 16.5px !important;
}
html[lang="zh-CN"] .page-pipeline .hy-cell-target {
font-size: 14.5px !important;
}
@media (max-width: 1280px) {
.hy-pipeline-table { font-size: 12.5px; }
.hy-pipeline-table thead th { padding: 10px 5px; font-size: 12px; }
.hy-pipeline-table tbody td { padding: 8px 5px; }
.hy-cell-project { font-size: 13px; }
.hy-cell-indication { font-size: 12px; }
.hy-cell-target { font-size: 11.5px; }
.hy-bar { height: 16px; border-radius: 8px; }
/* CN 在该断点同步压一档，但仍比英文大 */
html[lang="zh-CN"] .hy-pipeline-table thead th { font-size: 13.5px !important; }
html[lang="zh-CN"] .hy-cell-project { font-size: 14.5px !important; }
html[lang="zh-CN"] .hy-cell-indication { font-size: 13.5px !important; }
html[lang="zh-CN"] .hy-cell-target { font-size: 13px !important; }
html[lang="zh-CN"] .page-pipeline .hy-pipeline-table thead th { font-size: 14.5px !important; }
html[lang="zh-CN"] .page-pipeline .hy-cell-project { font-size: 15.5px !important; }
html[lang="zh-CN"] .page-pipeline .hy-cell-indication { font-size: 14.5px !important; }
html[lang="zh-CN"] .page-pipeline .hy-cell-target { font-size: 13.5px !important; }
}
@media (max-width: 900px) {
.hy-pipeline-card { overflow-x: auto; }
.hy-pipeline-table { min-width: 900px; }
}
/* 手机横屏 / 小平板：放开"CMC 开发"和"IND 申报"两个表头的内联
white-space:nowrap 约束。table-layout:fixed + 9.167% 列宽 + nowrap
组合在 ~700–1100px 窗口下会让这两个表头溢出邻列，看起来像两个
"IND 申报/CMC 开发"重叠在一起。允许它们换到第二行就解决了。
同时把 letter-spacing 收小一档以争取额外空间。 */
@media (max-width: 1100px) {
.hy-pipeline-table thead th.hy-pc-stage,
.hy-pipeline-table thead th[style*="nowrap"] {
white-space: normal !important;
word-break: keep-all !important;
overflow-wrap: break-word !important;
line-height: 1.22 !important;
letter-spacing: 0.015em !important;
padding-left: 3px !important;
padding-right: 3px !important;
}
/* 正文单元格"出格"修正：
- 项目列：长拉丁名（Deubuprenorphine 16 字符）放开 nowrap，允许
在小写字母间断行；CJK 名照旧不断（HY-1608 之类靠连字符避免拆分）。
- 适应症列：长 CJK（"化疗诱导周围神经病变预防" 12 字 + "阿片使用障碍 + 疼痛" 含空格符号）
keep-all 让字符不在词内断，靠空格/符号或宽度上限自然换行。
- 作用机制列：长 CJK（"阿片受体四重激动剂" 9 字）允许换行，line-height 收紧。
- 三类正文一律 vertical-align: middle，让换行后的内容仍居中对齐表格水平基线。 */
.hy-pipeline-table tbody .hy-cell-project,
.hy-pipeline-table tbody .hy-cell-indication:not(.hy-cell-indication--nowrap),
.hy-pipeline-table tbody .hy-cell-target {
white-space: normal !important;
word-break: keep-all !important; /* CJK 不在词内断 */
overflow-wrap: anywhere !important; /* 但长拉丁名可断（Deu-buprenorphine） */
line-height: 1.3 !important;
vertical-align: middle !important;
padding-left: 5px !important;
padding-right: 5px !important;
}
.hy-pipeline-table tbody .hy-cell-project {
/* 项目名稍微再小一档，给 Deubuprenorphine 这种长名字留余地 */
font-size: 12.5px !important;
letter-spacing: 0 !important;
}
.hy-pipeline-table tbody .hy-cell-indication {
font-size: 11.5px !important;
}
.hy-pipeline-table tbody .hy-cell-target {
font-size: 11.5px !important;
}
}
/* Pipeline page is dedicated to the chart — scale up for visual presence */
/* (Padding handled by .hy-pipeline-chart-section--standalone above; this rule kept for non-standalone use only) */
.page-pipeline .hy-pipeline-chart-section:not(.hy-pipeline-chart-section--standalone) { padding: 48px 0 64px; }
.page-pipeline .hy-pipeline-card { border-radius: 14px; box-shadow: 0 10px 36px rgba(9, 106, 61, 0.10), 0 2px 6px rgba(0,0,0,0.04); }
.page-pipeline .hy-pipeline-table { font-size: 15px; }
.page-pipeline .hy-pipeline-table thead th { padding: 19px 6px; font-size: 13px; line-height: 1.3; }
.page-pipeline .hy-pipeline-table tbody td { padding: 18px 8px; }
.page-pipeline .hy-cell-project {
font-size: 15.5px;
white-space: normal !important;
word-break: break-word;
overflow-wrap: anywhere;
line-height: 1.25;
}
.page-pipeline .hy-pc-project { width: 16% !important; }
.page-pipeline .hy-pc-indication { width: 16% !important; }
.page-pipeline .hy-pc-target { width: 13% !important; }
.page-pipeline .hy-pc-stage { width: 9.167% !important; }
.page-pipeline .hy-cell-indication { font-size: 14.5px; }
.page-pipeline .hy-cell-target { font-size: 14px; }
.page-pipeline .hy-bar { height: 26px; border-radius: 13px; }
.page-pipeline .hy-cell-bar { padding: 18px 0 !important; }
@media (max-width: 1280px) {
.page-pipeline .hy-pipeline-table { font-size: 13.5px; }
.page-pipeline .hy-pipeline-table thead th { padding: 15px 6px; font-size: 13px; }
.page-pipeline .hy-pipeline-table tbody td { padding: 14px 6px; }
.page-pipeline .hy-cell-project { font-size: 13.5px; }
.page-pipeline .hy-cell-indication { font-size: 13px; }
.page-pipeline .hy-cell-target { font-size: 12.5px; }
.page-pipeline .hy-bar { height: 22px; border-radius: 11px; }
.page-pipeline .hy-cell-bar { padding: 14px 0 !important; }
}
/* 关于华元 — Golden Gate bridge hero
背景图放到 ::before 单独应用色温滤镜，渐变蒙层用 ::after，文字 .cont1400 (z-index:2) 不受影响 */
.about-hero-bridge {
background-image: none !important;
background-color: #0a0e17 !important;
/* Banner 高度与 News 页 HERO 一致 */
height: 81vh !important;
}
.about-hero-bridge::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
background: url(/static/images/hero-backgrounds/hero-about-bridge.jpg?v=20260526new) center center / 100% 100% no-repeat !important;
/* 模拟 5200K 色温 —— 相对 sRGB 默认 6500K 偏暖约 1300K：增黄红、抑制蓝色 */
filter: sepia(0.16) saturate(1.08) hue-rotate(-4deg) brightness(1.02) !important;
z-index: 0 !important;
}
.about-hero-bridge::after {
content: "" !important;
position: absolute !important;
inset: 0 !important;
background: linear-gradient(180deg, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0.18) 55%, rgba(0,0,0,0.28) 100%) !important;
z-index: 1 !important;
pointer-events: none !important;
}
/* 关于华元 hero 标题：HY MEDICINE 大字号，其余描述文字适中（缩小约 2 号） */
.about-hero-bridge .about-hero-headline {
font-size: clamp(20px, 2.05vw, 30px) !important;
font-weight: 500 !important;
line-height: 1.55 !important;
letter-spacing: 0.015em !important;
color: #fff !important;
text-shadow: 0 2px 14px rgba(0,0,0,0.55) !important;
margin: 0 !important;
padding: 0 16px !important;
max-width: none !important;
text-align: center !important;
text-transform: none !important;
}
.about-hero-bridge .about-hero-name {
display: inline-block;
font-size: clamp(36px, 4.4vw, 64px) !important;
font-weight: 800 !important;
letter-spacing: 0.055em !important;
margin-right: 10px !important;
margin-bottom: 28px !important;
text-shadow: 0 4px 24px rgba(0,0,0,0.5) !important;
vertical-align: baseline;
line-height: 1.1 !important;
}
/* 防止第一行（HY MEDICINE + 公司简介）在窄一些的桌面端拆行
line-height 收紧到 1.1，避免被里面 64px 的 HY MEDICINE 撑出大段下沿空白 */
.about-hero-bridge .about-hero-line1 {
display: block;
white-space: nowrap;
line-height: 1.1 !important;
}
/* 描述行（第2、3行）独立成块；保持第 1 行位置，加大间距让第 3 行向下靠近桥面 */
.about-hero-bridge .about-hero-sub {
display: block;
margin-top: 4px !important; /* 1→2 间距加大约 10px */
line-height: 1.4 !important;
}
.about-hero-bridge .about-hero-sub + .about-hero-sub {
margin-top: 30px !important; /* 2→3 间距加大约 10px，与 1→2 视觉等距 */
}
/* 兼容旧类名（CN 版仍在使用 .about-hero-line2 作为副标题） */
.about-hero-bridge .about-hero-line2 {
display: block;
margin-top: 30px !important;
line-height: 1.4 !important;
}
@media (max-width: 768px) {
.about-hero-bridge .about-hero-headline { font-size: 16px !important; line-height: 1.5 !important; }
.about-hero-bridge .about-hero-name { font-size: 30px !important; margin-right: 6px !important; }
.about-hero-bridge .about-hero-line1 { white-space: normal; }
.about-hero-bridge .about-hero-sub { margin-top: 4px !important; line-height: 1.5 !important; }
.about-hero-bridge .about-hero-line2 { margin-top: 4px !important; line-height: 1.5 !important; }
}
/* 关于华元 hero —— 标题位置：再下移约 30px（最大上抬量收到 -50px） */
.about-hero-bridge .cont1400 {
transform: translateY(clamp(-90px, -5.5vh, -50px)) !important;
}
@media (max-width: 768px) {
.about-hero-bridge .cont1400 { transform: translateY(-25px) !important; }
}
/* EN/CN 版本：文字整体下移到垂直居中（保留行间距） */
html[lang="en"] .about-hero-bridge .cont1400,
html[lang="zh-CN"] .about-hero-bridge .cont1400 {
transform: none !important;
}
/* ============== 14. 内页通用样式 ============== */
.ny-title { margin-bottom: 24px !important; text-align: center; }
.ny-title h2 {
margin-bottom: 0 !important;
font-size: 26px !important;
font-weight: 700 !important;
color: #111 !important;
position: relative;
display: inline-block;
}
.ny-title h2::after {
content: "";
display: block;
width: 36px;
height: 3px;
background: #096a3d;
margin: 10px auto 0;
border-radius: 2px;
}
/* 关于华元浅色 */
.ny-about { margin: 0 !important; padding: 48px 0 40px !important; background: #fff; }
.ny-tdjs-bj { padding: 40px 0 !important; background: #f5f6f8 !important; }
.ny-ry { padding: 36px 0 !important; background: #fff !important; }
.ny-about {
display: flex !important;
gap: 0;
align-items: stretch;
background: #fff;
border-radius: 14px;
overflow: hidden;
box-shadow: 0 2px 16px rgba(0,0,0,0.05);
}
.ny-about-l {
width: 56% !important;
padding: 32px 36px !important;
display: flex;
flex-direction: column;
justify-content: center;
}
.ny-about-l .h3 {
font-size: 28px !important;
color: #111 !important;
font-weight: 700 !important;
margin: 0 0 6px !important;
}
.ny-about-l .h3::after {
content: "";
display: block;
width: 36px;
height: 3px;
background: #096a3d;
border-radius: 2px;
margin-top: 10px;
margin-bottom: 16px;
}
.ny-about-l p {
font-size: 14px !important;
line-height: 1.8 !important;
color: #555 !important;
margin-bottom: 6px !important;
}
.ny-about-r {
width: 44% !important;
}
.ny-about-r figure {
border-radius: 0 !important;
overflow: hidden !important;
box-shadow: none !important;
height: 100% !important;
margin: 0 !important;
float: none !important;
}
.ny-about-r figure img {
width: 100% !important;
height: 100% !important;
object-fit: cover;
display: block;
}
/* 大事记卡片 */
.milestone-section {
padding: 48px 0;
background: #f5f6f8;
}
.milestone-card {
background: #fff;
border-radius: 12px;
padding: 24px 28px;
box-shadow: 0 1px 4px rgba(0,0,0,0.04);
border: 1px solid #eee;
}
.milestone-card-title {
font-size: 16px;
font-weight: 700;
color: #111;
padding-bottom: 10px;
margin-bottom: 12px;
border-bottom: 2px solid #096a3d;
display: inline-block;
}
.milestone-item {
display: flex;
align-items: flex-start;
gap: 16px;
padding: 8px 0;
border-bottom: 1px solid #f5f5f5;
}
.milestone-item:last-child { border-bottom: none; }
.milestone-date {
font-size: 13px;
font-weight: 700;
color: #096a3d;
white-space: nowrap;
min-width: 80px;
}
.milestone-text {
font-size: 14px;
line-height: 1.6;
color: #555;
}
/* 创始人徽章 */
.founder-badges { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.founder-badge {
display: inline-block;
padding: 2px 10px;
border-radius: 20px;
font-size: 11px;
font-weight: 600;
}
.badge-green {
background: var(--emerald-50);
color: #065f46;
border: 1px solid var(--emerald-200);
}
/* 创始人简历样式 */
.founder-section { margin-bottom: 18px; }
.founder-section:last-child { margin-bottom: 0; }
.founder-section-title {
font-size: 16px; font-weight: 600; color: #111;
margin: 0 0 6px; padding-left: 12px;
border-left: 3px solid #059669;
}
.ny-tdjs-zk-nr, .ny-tdjs-zk-nr p,
.founder-section > p,
.founder-achievements li,
.founder-drugs li { font-size: 15px !important; color: #333 !important; line-height: 1.8 !important; }
.founder-section > p { margin: 0; padding-left: 15px; }
.founder-achievements { list-style: none; padding: 0; margin: 0; }
.founder-achievements li {
margin-bottom: 6px; padding-left: 18px; position: relative;
}
.founder-achievements li::before {
content: ""; position: absolute; left: 3px; top: 11px;
width: 6px; height: 6px; border-radius: 50%; background: #059669;
}
.founder-achievements li strong { color: #111 !important; font-weight: 600; }
.founder-drugs { list-style: none; padding: 0; margin: 0; }
.founder-drugs li {
padding: 6px 0 6px 15px; border-bottom: 1px solid #f0f0f0;
}
.founder-drugs li:last-child { border-bottom: none; }
.drug-tag { font-weight: 600; color: #111 !important; margin-right: 6px; font-size: 15px !important; }
.drug-phase { color: #999 !important; margin-left: 4px; font-size: 14px !important; }
/* 弹窗尺寸与滚动 —— 锚定在导航下方，避免长内容时顶部被 80px 高的
sticky-nav 遮挡。只做"水平居中 + 顶部固定 100px"，不做垂直居中。
长内容靠内部 overflow-y 滚动。 */
.md-modal {
position: fixed !important;
top: 100px !important;
left: 50% !important;
right: auto !important;
bottom: auto !important;
margin: 0 !important;
width: 1080px !important;
max-width: calc(100vw - 80px) !important;
height: auto !important;
max-height: calc(100vh - 130px) !important; /* 顶 100 + 底 30 留白 */
transform: translateX(-50%) !important;
-webkit-transform: translateX(-50%) !important;
overflow-y: auto !important;
-webkit-overflow-scrolling: touch !important;
box-sizing: border-box !important;
background: #fff !important;
border-radius: 16px !important;
box-shadow: 0 16px 48px rgba(0,0,0,0.28) !important;
padding: 0 !important;
}
.md-modal .ny-tdjs-fff {
width: 100% !important;
max-width: none !important;
margin: 0 !important;
border-radius: 16px !important;
box-shadow: none !important;
position: relative !important;
background: transparent !important;
}
/* 旧右上 X 按钮 —— 完全隐藏（用户反馈太小太难按） */
html body .md-modal .ny-tdjs-zk-gb,
html body .md-modal .ny-tdjs-zk-gb.md-close {
display: none !important;
}
/* 关闭按钮所在"操作区行"—— 跟教授简介完全独立的一段
* 顶部有分隔线（border-top）+ 上下足够 padding，视觉上明确"另一个区块"
* 浅灰背景进一步强化与白色简介区的层级分离 */
html body .md-modal .founder-close-row {
display: block !important;
width: 100% !important;
margin: 0 !important;
padding: 28px 24px 32px !important;
border-top: 1px solid #e5e7eb !important;
background: #f9fafb !important;
text-align: center !important;
border-radius: 0 0 16px 16px !important;
}
/* 关闭按钮本体 —— 中性灰按钮，不抢眼，纯功能性
* 不用绿色（绿色是教授简介的强调色，会让按钮看着是"教授的一部分"）
* 中性灰底 + 深灰字 = 纯 UI 控件感，跟简介完全脱钩 */
html body .md-modal .founder-close-btn {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: auto !important;
min-width: 160px !important;
max-width: 280px !important;
margin: 0 auto !important;
padding: 12px 36px !important;
min-height: 44px !important; /* Apple HIG 最小触摸目标 */
font-size: 14px !important;
font-weight: 500 !important;
font-family: inherit !important;
color: #4b5563 !important;
background: #ffffff !important;
border: 1px solid #d1d5db !important;
border-radius: 24px !important;
letter-spacing: 0.06em !important;
cursor: pointer !important;
box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
text-align: center !important;
text-decoration: none !important;
outline: none !important;
-webkit-tap-highlight-color: transparent !important;
transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease !important;
}
html body .md-modal .founder-close-btn:hover {
background: #1f2937 !important;
color: #ffffff !important;
border-color: #1f2937 !important;
box-shadow: 0 4px 12px rgba(0,0,0,0.12) !important;
transform: translateY(-1px) !important;
}
html body .md-modal .founder-close-btn:active {
transform: scale(0.97) !important;
}
@media (max-width: 768px) {
html body .md-modal .founder-close-row {
padding: 22px 16px 26px !important;
}
html body .md-modal .founder-close-btn {
min-width: 180px !important;
padding: 14px 32px !important;
font-size: 15px !important;
min-height: 48px !important;
}
}
.ny-tdjs-zk-c { padding: 40px 48px !important; align-items: flex-start !important; gap: 36px !important; }
.ny-tdjs-zk-c .ny-tdjs-zk-l { width: 20% !important; }
.ny-tdjs-zk-c .ny-tdjs-zk-l p { display: none !important; }
.ny-tdjs-zk-c .ny-tdjs-zk-r { width: 76% !important; }
.ny-tdjs-zk-c .ny-tdjs-zk-r .ny-tdjs-zk-bt { margin-bottom: 20px !important; padding-bottom: 16px !important; border-bottom: 1px solid #eee !important; }
.ny-tdjs-zk-c .ny-tdjs-zk-r .ny-tdjs-zk-bt h3 { font-size: 28px !important; }
/* 职位列表样式 */
.ny-job { padding: 0 0 60px !important; }
.ny-job .ny-title { padding: 10px 0 0 !important; margin-bottom: 10px !important; }
.ny-job-bt { margin-bottom: 0 !important; }
.ny-job-bt ul { border-radius: 8px 8px 0 0 !important; margin-bottom: 0 !important; }
.job-list ul.list { border: none !important; border-radius: 0 !important; overflow: hidden !important; margin-top: 0 !important; }
.job-zk .job-bt { border-bottom: 1px solid #bbb !important; border-radius: 0 !important; }
.job-list ul.list li:last-child .job-zk .job-bt { border-bottom: 1px solid #bbb !important; }
/* 联系我们公司名 */
.ny-lx-nr h2 { white-space: nowrap !important; }
/* 联系面板 —— 取消 flex 垂直居中，改为顶部对齐 + 显式 padding。
panel/map 整体加高到 880px，给二维码 + 双行字幕足够空间；
用 border-box 把 padding 包进总高度，避免撞进 footer */
.ny-lx { height: 880px !important; }
.ny-lx-api #allmap1 { height: 880px !important; }
.ny-lx-l {
height: 880px !important;
box-sizing: border-box !important;
align-items: flex-start !important;
padding-top: 120px !important;
padding-bottom: 80px !important;
}
.ny-lx-nr figure { margin-top: 32px !important; margin-bottom: 0 !important; }
@media screen and (max-width: 1024px) {
.ny-lx { height: 820px !important; }
.ny-lx-api #allmap1 { height: 820px !important; }
.ny-lx-l { height: 820px !important; padding-top: 80px !important; padding-bottom: 60px !important; }
}
@media screen and (max-width: 768px) {
.ny-lx-l {
height: auto !important;
padding-top: 32px !important;
padding-bottom: 24px !important;
align-items: baseline !important;
}
.ny-lx-nr figure { margin-top: 24px !important; }
}
/* ===========================================================
HY-1608 Spotlight 板块 —— 管线页核心资产深度展示
设计语言：编辑级、克制、品牌绿、留白充足
=========================================================== */
.hy-spotlight {
padding: 80px 0 96px;
background:
radial-gradient(ellipse 60% 40% at 50% 0%, rgba(9, 106, 61, 0.035) 0%, transparent 60%),
linear-gradient(180deg, #fafdfb 0%, #ffffff 60%, #fafdfb 100%);
position: relative;
overflow: hidden;
}
.hy-spotlight::before {
content: "";
position: absolute;
top: 0; left: 0; right: 0;
height: 1px;
background: linear-gradient(90deg, transparent 0%, rgba(9,106,61,0.25) 50%, transparent 100%);
}
/* —— Header —— */
.hy-spot-header {
text-align: center;
margin-bottom: 72px;
max-width: 920px;
margin-left: auto;
margin-right: auto;
padding: 0 24px;
}
.hy-spot-tag {
display: inline-block;
padding: 7px 18px;
background: rgba(9, 106, 61, 0.08);
color: #096a3d;
border-radius: 999px;
font-size: 11.5px;
font-weight: 700;
letter-spacing: 0.18em;
text-transform: uppercase;
margin-bottom: 24px;
}
.hy-spot-title {
font-size: clamp(48px, 6.5vw, 88px);
font-weight: 800;
letter-spacing: -0.02em;
line-height: 1;
margin: 0 0 22px;
background: linear-gradient(135deg, #096a3d 0%, #2ea765 50%, #5a9132 100%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
}
.hy-spot-lede {
font-size: clamp(16px, 1.45vw, 21px);
font-weight: 400;
line-height: 1.55;
color: #3d4842;
letter-spacing: 0.005em;
margin: 0;
}
.hy-spot-lede em {
font-style: normal;
color: #096a3d;
font-weight: 700;
}
.hy-spot-lede strong {
font-weight: 700;
color: #0d4a26;
}
/* —— Block (Mechanism / Differentiation / Indications) —— */
.hy-spot-block {
margin-bottom: 56px;
padding: 0 0 40px;
border-bottom: 1px solid rgba(9, 106, 61, 0.10);
}
.hy-spot-block:last-of-type { margin-bottom: 32px; border-bottom: none; padding-bottom: 0; }
.hy-spot-block-head {
max-width: 100%;
margin: 0 0 28px;
text-align: left;
}
.hy1608-detail .hy-spot-block:first-of-type .hy-spot-block-head {
text-align: center;
margin-bottom: 8px;
}
.hy-spot-eyebrow {
display: inline-block;
font-size: 12px;
font-weight: 700;
letter-spacing: 0.22em;
color: #2f9e5e;
text-transform: uppercase;
margin-bottom: 14px;
}
.hy-spot-block-head h3 {
font-size: clamp(26px, 2.8vw, 36px);
font-weight: 700;
color: #0d4a26;
letter-spacing: -0.005em;
margin: 0 0 14px;
line-height: 1.2;
}
/* 段落引领句（在绿色标题条下方）—— 字号略加大，加粗一档；
左边缩到 22px = 与标题条内文字（h3 padding: 14px 22px）的首字对齐 */
.hy-spot-sub {
font-size: clamp(16px, 1.4vw, 20px);
color: #096a3d;
font-weight: 650;
line-height: 1.6;
margin: 16px 0 4px;
max-width: 100%;
text-align: left;
padding-left: 22px;
letter-spacing: 0.002em;
}
.hy-spot-sub em,
.hy-spot-sub strong {
font-style: normal;
color: #096a3d;
font-weight: 700;
}
/* —— MOA grid —— */
.hy-moa-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 16px;
max-width: 1200px;
margin: 0 auto;
}
.hy-moa-card {
background: #ffffff;
border: 1px solid #e6ede9;
border-radius: 16px;
padding: 28px 22px 26px;
text-align: center;
position: relative;
transition: transform 0.3s cubic-bezier(0.2,0.8,0.2,1), box-shadow 0.3s, border-color 0.3s;
}
.hy-moa-card::before {
content: "";
position: absolute;
top: 0; left: 50%;
transform: translateX(-50%);
width: 36px;
height: 3px;
background: linear-gradient(90deg, #096a3d 0%, #2f9e5e 100%);
border-radius: 0 0 3px 3px;
}
.hy-moa-card:hover {
transform: translateY(-4px);
box-shadow: 0 14px 36px rgba(9, 106, 61, 0.10);
border-color: #c7e1cf;
}
.hy-moa-card--accent {
background: linear-gradient(160deg, #ecf6ee 0%, #ffffff 60%);
border-color: #c7e1cf;
}
.hy-moa-receptor {
font-size: 56px;
font-weight: 800;
color: #096a3d;
line-height: 1;
font-family: 'Inter', 'Noto Sans SC', sans-serif;
margin: 4px 0 6px;
letter-spacing: -0.02em;
}
.hy-moa-type {
font-size: 12px;
font-weight: 700;
letter-spacing: 0.16em;
text-transform: uppercase;
color: #2f9e5e;
margin-bottom: 14px;
}
.hy-moa-card p {
font-size: 13.5px;
line-height: 1.65;
color: #4b5563;
margin: 0;
}
/* —— Stat grid —— */
.hy-stat-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
max-width: 1100px;
margin: 0 auto;
}
.hy-stat-card {
padding: 36px 30px 32px;
border-left: 3px solid #096a3d;
background: #ffffff;
transition: transform 0.3s, box-shadow 0.3s;
}
.hy-stat-card:hover {
transform: translateX(4px);
box-shadow: 0 12px 32px rgba(9, 106, 61, 0.08);
}
.hy-stat-num {
font-size: clamp(40px, 4.5vw, 60px);
font-weight: 800;
color: #096a3d;
line-height: 1;
letter-spacing: -0.02em;
margin-bottom: 6px;
}
.hy-stat-num span {
font-size: 0.55em;
color: #2f9e5e;
font-weight: 700;
margin-left: 2px;
}
.hy-stat-label {
font-size: 12px;
font-weight: 700;
letter-spacing: 0.18em;
text-transform: uppercase;
color: #2f9e5e;
margin-bottom: 16px;
}
.hy-stat-card p {
font-size: 14px;
line-height: 1.7;
color: #4b5563;
margin: 0;
}
/* —— Indication grid —— */
.hy-ind-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
max-width: 1200px;
margin: 0 auto;
}
.hy-ind-card {
background: #ffffff;
border: 1px solid #e6ede9;
border-radius: 14px;
padding: 30px 28px 28px;
position: relative;
overflow: hidden;
transition: transform 0.3s, box-shadow 0.3s, border-color 0.3s;
}
.hy-ind-card::before {
content: "";
position: absolute;
left: 0; top: 0; bottom: 0;
width: 4px;
background: linear-gradient(180deg, #096a3d 0%, #5fa024 100%);
}
.hy-ind-card:hover {
transform: translateY(-3px);
box-shadow: 0 14px 36px rgba(9, 106, 61, 0.10);
border-color: #c7e1cf;
}
.hy-ind-phase {
display: inline-block;
padding: 4px 12px;
background: rgba(9, 106, 61, 0.10);
color: #096a3d;
border-radius: 999px;
font-size: 11px;
font-weight: 700;
letter-spacing: 0.14em;
text-transform: uppercase;
margin-bottom: 14px;
}
.hy-ind-card h4 {
font-size: 20px;
font-weight: 700;
color: #0d4a26;
margin: 0 0 10px;
line-height: 1.3;
letter-spacing: -0.005em;
}
.hy-ind-card p {
font-size: 14px;
line-height: 1.7;
color: #4b5563;
margin: 0;
}
/* —— Footnote —— */
.hy-spot-footnote {
text-align: center;
max-width: 760px;
margin: 0 auto;
padding: 0 24px;
}
.hy-spot-footnote p {
font-size: 12px;
color: #9ca3af;
line-height: 1.7;
margin: 0;
font-style: italic;
letter-spacing: 0.01em;
}
/* ===========================================================
HY-1608 详情页 —— 图片、表格、病例、阶梯图、FST 网格
=========================================================== */
.hy1608-detail { padding: 0; }
.hy1608-detail .hy-spot-block { margin-bottom: 64px; }
/* HY-1608 详情页 —— h3 按 PPT 原图：绿色页眉条（模拟 PPT 顶部绿色 banner） */
.yf-detail-content .hy1608-detail .hy-spot-block-head h3:not(.hy1608-slogan),
.hy1608-detail .hy-spot-block-head h3:not(.hy1608-slogan) {
color: #ffffff !important;
font-weight: 700 !important;
font-size: clamp(17px, 1.55vw, 21px) !important;
border-bottom: none !important;
padding: 14px 22px !important;
margin: 0 0 22px !important;
letter-spacing: 0.005em !important;
line-height: 1.35 !important;
text-align: left !important;
background: linear-gradient(90deg, #096a3d 0%, #2f9e5e 100%) !important;
-webkit-text-fill-color: #ffffff !important;
border-radius: 6px !important;
white-space: normal !important;
overflow: visible !important;
word-break: break-word;
}
/* HY-1608 详情页 —— 顶部 intro 声明（紧贴 hero 下方，作为页面的引言） */
.hy1608-intro-statement {
text-align: center;
font-size: clamp(17px, 1.65vw, 22px);
font-weight: 500;
color: #0d4a26;
line-height: 1.55;
margin: 0 auto 48px;
max-width: 100%;
padding: 0 24px;
letter-spacing: 0.005em;
}
.hy1608-intro-statement strong {
color: #096a3d;
font-weight: 700;
}
/* HY-1608 详情页 —— Envisioning slogan：使命级 hero 短句（无装饰横线，单行不换行） */
.hy1608-detail .hy-spot-block-head h3.hy1608-slogan {
display: block;
font-size: clamp(24px, 2.6vw, 34px) !important;
font-weight: 800 !important;
font-style: italic !important;
color: #d97706 !important;
letter-spacing: 0.08em !important;
line-height: 1.3 !important;
text-align: center !important;
margin: 4px auto 18px !important;
padding: 0 !important;
text-shadow: 0 2px 14px rgba(217, 119, 6, 0.18);
background: none !important;
-webkit-text-fill-color: #d97706 !important;
border-bottom: none !important;
white-space: nowrap;
}
.hy1608-detail .hy-spot-block-head h3.hy1608-slogan::before,
.hy1608-detail .hy-spot-block-head h3.hy1608-slogan::after {
content: none !important;
display: none !important;
}
@media (max-width: 720px) {
.hy1608-detail .hy-spot-block-head h3.hy1608-slogan { white-space: normal; font-size: clamp(20px, 5vw, 26px) !important; }
}
/* HY-1608 详情页 —— Vision 引用块（slide 2 文字 → 绿色） */
.hy-quote-block {
max-width: 100%;
margin: 28px 0 0;
padding: 22px 28px;
background: linear-gradient(180deg, #fafdfb 0%, #ffffff 100%);
border: none;
border-radius: 14px;
box-shadow: 0 6px 22px rgba(9, 106, 61, 0.08);
}
.hy-quote-block p {
font-size: 18px;
line-height: 1.75;
color: #096a3d;
font-weight: 700;
margin: 0 0 14px;
}
.hy-quote-block p:last-child { margin-bottom: 0; }
/* 首句 "Opioids have long been ..." 要保持单行，字号自适应缩放
桌面 ~17px 能放下整句，移动端允许换行 */
.hy-quote-block p:first-child {
font-size: clamp(15px, 1.55vw, 18px);
white-space: nowrap;
overflow: visible;
}
@media (max-width: 900px) {
.hy-quote-block p:first-child {
white-space: normal;
font-size: 16px;
}
}
.hy-quote-block-flag {
margin-top: 22px !important;
padding-top: 22px;
border-top: 1px dashed #d8eadd;
font-size: 22px !important;
font-weight: 700 !important;
color: #d97706 !important;
font-style: italic;
letter-spacing: 0.01em;
text-align: center;
}
/* 单句声明卡 (slide 3) */
.hy-statement-card {
max-width: 100%;
margin: 28px 0 0;
padding: 44px 48px;
background: linear-gradient(135deg, #ecf6ee 0%, #ffffff 60%, #ecf6ee 100%);
border: 1px solid #c7e1cf;
border-radius: 18px;
text-align: center;
box-shadow: 0 8px 28px rgba(9, 106, 61, 0.08);
}
.hy-statement-card p {
font-size: clamp(18px, 1.6vw, 24px);
font-weight: 600;
color: #0d4a26;
line-height: 1.55;
margin: 0;
letter-spacing: 0.005em;
}
.hy-statement-card strong { color: #096a3d; font-weight: 800; }
/* 项目符号列表（PPT 的 ›/▸ 风格） —— Grid 布局保证 chevron 与第一行文字基线对齐 */
.hy-bullet-list {
max-width: 100%;
margin: 0;
}
.hy-bullet {
display: grid;
grid-template-columns: 22px 1fr;
column-gap: 8px;
align-items: baseline;
padding: 14px 0;
border-bottom: 1px dashed #e3eee7;
}
.hy-bullet:last-child { border-bottom: none; }
.hy-bullet::before {
content: "›";
grid-column: 1;
grid-row: 1;
color: #2f9e5e;
font-size: 18px;
font-weight: 800;
line-height: 1.75;
text-align: left;
}
.hy-bullet > * { grid-column: 2; }
.hy-bullet-label {
display: inline;
font-size: inherit;
font-weight: 700;
color: #096a3d;
letter-spacing: 0;
text-transform: none;
margin-right: 4px;
}
.hy-bullet p {
font-size: 15.5px;
line-height: 1.75;
color: #3d4842;
margin: 0 0 6px;
}
.hy-bullet p strong,
.hy-bullet-sub p strong { color: #096a3d; font-weight: 700; }
/* 二级子句（PPT 中"Robust analgesic efficacy:" 下方两句）—— 用绿色小 ›› 引导箭头，不再加左侧绿条 */
.hy-bullet p.hy-subhead {
position: relative;
font-size: 15.5px;
line-height: 1.75;
color: #3d4842;
font-weight: 500;
margin: 8px 0 0;
padding: 0 0 0 22px;
border-left: none;
background: none;
border-radius: 0;
}
.hy-bullet p.hy-subhead::before {
content: "›";
position: absolute;
left: 4px;
top: 0;
color: #2f9e5e;
font-size: 16px;
font-weight: 800;
line-height: 1.75;
}
.hy-bullet p.hy-subhead strong { color: #096a3d; font-weight: 700; }
.hy-bullet p:last-child { margin-bottom: 0; }
/* --inline 变体去掉左缩进，箭头与上方绿色标题条的左边缘左对齐 */
.hy-bullet--inline { padding: 8px 0; border-bottom: none; }
.hy-bullet--inline::before { top: 6px; }
.hy-bullet--inline p { color: #096a3d; font-weight: 600; }
/* 无箭头变体：保留缩进与样式，但隐藏顶层 › 箭头 */
.hy-bullet--no-arrow::before { content: none !important; }
/* "小节标题"变体：用于新闻正文等场景里 Development Strategy 这种本身就是小节标题的条目，
不带顶层 › 箭头、与上方正文左对齐；下方 .hy-bullet-sub 子项保留 › 缩进。 */
.hy-bullet.hy-bullet--heading {
display: block; /* 取消 grid 两栏缩进 */
padding: 18px 0 4px;
border-bottom: none;
}
.hy-bullet.hy-bullet--heading::before { content: none; }
.hy-bullet.hy-bullet--heading > p {
margin: 0 0 6px;
font-size: 16px;
line-height: 1.6;
color: #1f2a25;
}
.hy-bullet.hy-bullet--heading > p .hy-bullet-label {
font-weight: 700;
color: #1f2a25;
}
.hy-bullet.hy-bullet--heading > p strong { color: #096a3d; font-weight: 700; }
.hy-bullet.hy-bullet--heading .hy-bullet-sub {
margin-top: 6px;
padding-left: 12px; /* 子项相对标题有清晰缩进 */
}
.hy-bullet.hy-bullet--heading .hy-bullet-sub p { margin-top: 6px; }
.hy-bullet.hy-bullet--heading .hy-bullet-sub p:first-child { margin-top: 0; }
/* 部分章节整组绿色（如 slide 9 Chronic Pain：PPT 中 body 全部为绿色） */
.hy-bullet-list--green .hy-bullet p,
.hy-bullet-list--green .hy-bullet-sub p { color: #096a3d; font-weight: 600; }
.hy-bullet-list--green .hy-bullet-label,
.hy-bullet-list--green .hy-bullet-sub-key { color: #096a3d; font-weight: 700; }
.hy-bullet-sub {
margin-top: 8px;
padding: 0;
background: none;
border-left: none;
border-radius: 0;
}
/* 子项目符号 —— 字号与主项目（.hy-bullet p, 15.5px）统一，
chevron 也跟主项目（18px）一致，不再"大小不一" */
.hy-bullet-sub p {
position: relative;
font-size: 15.5px;
margin: 6px 0 0;
padding: 0 0 0 22px;
color: #096a3d;
font-weight: 700;
line-height: 1.75;
}
.hy-bullet-sub p::before {
content: "›";
position: absolute;
left: 4px;
top: 0;
color: #2f9e5e;
font-size: 18px;
font-weight: 800;
line-height: 1.75;
}
.hy-bullet-sub p:first-child { margin-top: 0; }
.hy-bullet-sub p:last-child { margin-bottom: 0; }
.hy-bullet-sub-key { color: #096a3d; font-weight: 700; }
/* 慢性痛三段箭头横向带 —— 还原 PPT slide 9 的大箭头进化叙事 */
.hy1608-arrow-bar {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 0;
max-width: 1100px;
margin: 32px auto 0;
position: relative;
}
.hy1608-arrow-step {
position: relative;
padding: 24px 26px 22px 38px;
background: #f8faf9;
border-top: 1px solid #e3eee7;
border-bottom: 1px solid #e3eee7;
text-align: center;
/* 用 clip-path 制作右侧箭头形状 */
clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 50%, calc(100% - 22px) 100%, 0 100%, 22px 50%);
margin-right: -22px;
}
.hy1608-arrow-step:first-child {
clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 50%, calc(100% - 22px) 100%, 0 100%);
padding-left: 26px;
}
.hy1608-arrow-step:last-child {
margin-right: 0;
}
.hy1608-arrow-step--neg { background: #fef2f2; }
.hy1608-arrow-step--mid { background: #fefbe8; }
.hy1608-arrow-step--pos { background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%); }
.hy1608-arrow-step-tag {
display: block;
font-size: 12px;
font-weight: 600;
color: #4b5563;
line-height: 1.45;
margin-bottom: 3px;
}
.hy1608-arrow-step-tag:first-of-type { margin-top: 4px; }
.hy1608-arrow-step-name {
font-size: 19px;
font-weight: 800;
color: #0d4a26;
margin: 14px 0 4px;
letter-spacing: -0.005em;
}
.hy1608-arrow-step--neg .hy1608-arrow-step-name { color: #b91c1c; }
.hy1608-arrow-step--mid .hy1608-arrow-step-name { color: #b45309; }
.hy1608-arrow-step--pos .hy1608-arrow-step-name { color: #096a3d; }
.hy1608-arrow-step-mech {
font-size: 13px;
color: #6b7280;
margin-bottom: 14px;
letter-spacing: 0.005em;
}
.hy1608-arrow-step-label {
display: inline-block;
padding: 5px 14px;
border-radius: 999px;
font-size: 11.5px;
font-weight: 700;
letter-spacing: 0.14em;
text-transform: uppercase;
}
.hy1608-arrow-step-label--neg { background: rgba(220, 38, 38, 0.14); color: #b91c1c; }
.hy1608-arrow-step-label--mid { background: rgba(217, 119, 6, 0.14); color: #b45309; }
.hy1608-arrow-step-label--pos { background: rgba(9, 106, 61, 0.18); color: #096a3d; }
.hy1608-arrow-refs {
text-align: center;
font-size: 11.5px;
color: #9ca3af;
margin: 18px auto 0;
max-width: 1100px;
font-style: italic;
letter-spacing: 0.01em;
}
@media (max-width: 880px) {
.hy1608-arrow-bar { grid-template-columns: 1fr; }
.hy1608-arrow-step {
clip-path: polygon(0 0, 100% 0, 100% calc(100% - 22px), 50% 100%, 0 calc(100% - 22px));
padding: 24px 26px 38px;
margin: 0 0 -22px 0;
}
.hy1608-arrow-step:first-child { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 22px), 50% 100%, 0 calc(100% - 22px)); }
.hy1608-arrow-step:last-child { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); margin-bottom: 0; padding-bottom: 22px; }
}
/* 图片容器 —— 无外框、无 padding，让图直接占据全宽 */
.hy1608-figure {
margin: 28px auto 0;
max-width: 100%;
background: transparent;
border: none;
border-radius: 0;
padding: 0;
text-align: center;
}
/* --wide 变体：突破 .yf-detail-content 的 56px 左右内边距，
图片真正"塞满"内容卡片的全宽，比之前显示大约 10% */
.hy1608-figure--wide {
max-width: none;
width: calc(100% + 112px);
margin-left: -56px;
margin-right: -56px;
}
@media (max-width: 1024px) {
.hy1608-figure--wide {
width: calc(100% + 64px);
margin-left: -32px;
margin-right: -32px;
}
}
@media (max-width: 768px) {
.hy1608-figure--wide {
width: 100%;
margin-left: 0;
margin-right: 0;
}
}
/* === HY-1608 产品页：单图微调（按图片文件名精确匹配） === */
/* fig-acute（急性疼痛三联图表）—— 与正文左右对齐（满铺内容卡片） */
.hy1608-figure--wide:has(img[src*="fig-acute"]) {
width: 100% !important;
max-width: 100% !important;
margin-left: auto !important;
margin-right: auto !important;
}
/* fig-trd（花瓣图 / Improving the Body, Not Just the Brain）——
figure 框恢复原始边界（不再额外向外凸出），内部 ![]()
放大 125%，
figure 用 overflow:hidden 把两侧多出来的留白边缘裁掉 */
.hy1608-figure--wide:has(img[src*="fig-trd"]) {
width: calc(100% + 300px) !important;
max-width: none !important;
margin-left: -150px !important;
margin-right: -150px !important;
overflow: hidden !important;
}
.hy1608-figure--wide:has(img[src*="fig-trd"]) img {
width: 125% !important;
max-width: none !important;
margin-left: -12.5% !important;
margin-right: -12.5% !important;
display: block;
}
@media (max-width: 1024px) {
.hy1608-figure--wide:has(img[src*="fig-acute"]) {
width: 100% !important;
max-width: 100% !important;
}
.hy1608-figure--wide:has(img[src*="fig-trd"]) {
width: calc(100% + 140px) !important;
margin-left: -70px !important;
margin-right: -70px !important;
}
}
@media (max-width: 768px) {
.hy1608-figure--wide:has(img[src*="fig-trd"]) {
width: 100% !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
.hy1608-figure--wide:has(img[src*="fig-trd"]) img {
/* 移动端不放大，避免裁掉关键内容 */
width: 100% !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
}
/* fig-4moa（4 MOAs in One Molecule）+ fig-nodep（No Dependence Liability）
— 比默认 --wide 再外溢约 ±54px，整体放大约 +12%。
不裁剪，整张图直接变大，不需要 overflow:hidden。 */
.hy1608-figure--wide:has(img[src*="fig-4moa"]),
.hy1608-figure--wide:has(img[src*="fig-nodep"]) {
width: calc(100% + 220px) !important;
max-width: none !important;
margin-left: -110px !important;
margin-right: -110px !important;
}
@media (max-width: 1024px) {
.hy1608-figure--wide:has(img[src*="fig-4moa"]),
.hy1608-figure--wide:has(img[src*="fig-nodep"]) {
width: calc(100% + 120px) !important;
margin-left: -60px !important;
margin-right: -60px !important;
}
}
@media (max-width: 768px) {
.hy1608-figure--wide:has(img[src*="fig-4moa"]),
.hy1608-figure--wide:has(img[src*="fig-nodep"]) {
width: 100% !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
}
.hy1608-figure--center { max-width: 100%; }
/* 原尺寸居中：用于本身比较小、不需要拉伸到全容器宽度的图（如 PK 曲线两联图） */
.hy1608-figure--natural { max-width: 100%; text-align: center; }
.hy1608-figure--natural img {
width: auto !important;
max-width: 100%;
display: block;
margin: 0 auto;
}
.hy1608-figure img {
width: 100%;
max-width: 100%;
height: auto;
display: block;
margin: 0 auto;
}
.hy1608-figure figcaption {
margin-top: 12px;
font-size: 12.5px;
line-height: 1.6;
color: #6b7280;
font-style: italic;
text-align: right;
letter-spacing: 0.005em;
}
.hy1608-figure figcaption strong {
font-style: normal;
color: #096a3d;
font-weight: 700;
}
/* 表格 */
.hy1608-table-wrap {
max-width: 880px;
margin: 32px auto 0;
}
.hy1608-table-title {
text-align: center;
font-size: 14px;
font-weight: 700;
color: #0d4a26;
letter-spacing: 0.02em;
margin: 0 0 14px;
text-transform: uppercase;
}
.hy1608-table {
width: 100%;
border-collapse: collapse;
background: #ffffff;
border: 1px solid #e6ede9;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 2px 8px rgba(9, 106, 61, 0.04);
}
.hy1608-table th {
background: linear-gradient(180deg, #f4fbf6 0%, #ecf6ee 100%);
color: #0d4a26;
font-weight: 700;
font-size: 13px;
letter-spacing: 0.04em;
padding: 14px 16px;
text-align: center;
border-bottom: 2px solid #c7e1cf;
}
.hy1608-table td {
padding: 12px 16px;
font-size: 13.5px;
color: #1f2937;
text-align: center;
border-bottom: 1px solid #f3f5f4;
}
.hy1608-table tbody tr:last-child td { border-bottom: none; }
.hy1608-table tbody tr:hover td { background: #fafdfb; }
.hy1608-table td:first-child { text-align: left; color: #374151; font-weight: 500; }
.hy1608-table-note {
margin: 12px 0 0;
font-size: 12px;
color: #9ca3af;
font-style: italic;
text-align: center;
}
/* 病例卡 */
.hy1608-cases-title {
text-align: center;
font-size: 15px;
font-weight: 700;
color: #0d4a26;
letter-spacing: 0.04em;
margin: 36px 0 18px;
text-transform: uppercase;
}
.hy1608-case-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 16px;
max-width: 1200px;
margin: 16px auto 0;
}
.hy1608-case-grid--three { grid-template-columns: repeat(3, 1fr); }
@media (min-width: 1100px) {
.hy1608-case-grid--three { grid-template-columns: repeat(3, 1fr); }
}
.hy1608-case {
background: #ffffff;
border: 1px solid #e6ede9;
border-radius: 12px;
padding: 22px 22px 20px;
transition: box-shadow 0.3s, transform 0.3s;
}
.hy1608-case:hover {
box-shadow: 0 10px 28px rgba(9, 106, 61, 0.08);
transform: translateY(-2px);
}
.hy1608-case-tag {
display: inline-block;
padding: 4px 12px;
background: rgba(9, 106, 61, 0.10);
color: #096a3d;
border-radius: 999px;
font-size: 11px;
font-weight: 700;
letter-spacing: 0.14em;
text-transform: uppercase;
margin-bottom: 12px;
}
.hy1608-case-pt {
font-size: 13px;
color: #4b5563;
line-height: 1.65;
margin: 0 0 10px;
}
.hy1608-case-outcome {
font-size: 13px;
color: #374151;
line-height: 1.65;
margin: 0;
padding-top: 10px;
border-top: 1px dashed #d8eadd;
}
.hy1608-case-outcome strong {
color: #096a3d;
font-weight: 700;
}
.hy1608-case-outcome em {
font-style: normal;
color: #2f9e5e;
font-weight: 600;
font-size: 12px;
letter-spacing: 0.01em;
}
/* 慢性痛阶梯图 —— 用箭头连接的"演化"叙事（参考 PPT 原图） */
.hy1608-ladder {
display: grid;
grid-template-columns: 1fr 48px 1fr 48px 1fr;
align-items: center;
gap: 0;
max-width: 1200px;
margin: 24px auto 0;
}
.hy1608-ladder-arrow {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
.hy1608-ladder-arrow svg {
width: 36px;
height: 36px;
color: #2f9e5e;
filter: drop-shadow(0 1px 2px rgba(9, 106, 61, 0.18));
}
.hy1608-ladder-step {
background: #ffffff;
border: 1px solid #e6ede9;
border-radius: 14px;
padding: 24px 20px 22px;
text-align: center;
position: relative;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
transition: transform 0.3s, box-shadow 0.3s, border-color 0.3s;
}
.hy1608-ladder-step--lead {
background: linear-gradient(160deg, #ecf6ee 0%, #ffffff 55%);
border-color: #c7e1cf;
box-shadow: 0 10px 32px rgba(9, 106, 61, 0.12);
}
.hy1608-ladder-step:hover { transform: translateY(-3px); }
.hy1608-ladder-label {
font-size: 17px;
font-weight: 700;
color: #0d4a26;
margin-bottom: 4px;
letter-spacing: -0.005em;
}
.hy1608-ladder-sub {
font-size: 12px;
color: #6b7280;
letter-spacing: 0.02em;
margin-bottom: 14px;
line-height: 1.4;
}
.hy1608-ladder-tag {
display: inline-block;
padding: 5px 14px;
border-radius: 999px;
font-size: 11px;
font-weight: 700;
letter-spacing: 0.14em;
text-transform: uppercase;
margin-bottom: 12px;
}
.hy1608-ladder-tag--neg { background: rgba(220, 38, 38, 0.10); color: #b91c1c; }
.hy1608-ladder-tag--mid { background: rgba(217, 119, 6, 0.10); color: #b45309; }
.hy1608-ladder-tag--pos { background: rgba(9, 106, 61, 0.12); color: #096a3d; }
.hy1608-ladder-step p {
font-size: 13px;
color: #4b5563;
line-height: 1.6;
margin: 0;
}
@media (max-width: 980px) {
.hy1608-ladder { grid-template-columns: 1fr; gap: 12px; }
.hy1608-ladder-arrow { transform: rotate(90deg); height: 36px; }
}
/* FST 两图并列 */
.hy1608-fst-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 24px;
max-width: 1100px;
margin: 24px auto 0;
}
.hy1608-fst-grid .hy1608-figure { margin: 0; padding: 20px; }
/* 内联脚注 */
.hy-spot-footnote-inline {
text-align: center;
font-size: 12px;
color: #9ca3af;
line-height: 1.7;
margin: 40px auto 0;
max-width: 760px;
font-style: italic;
letter-spacing: 0.01em;
padding: 0 24px;
}
/* 响应式 */
@media (max-width: 980px) {
.hy1608-case-grid { grid-template-columns: 1fr; }
.hy1608-ladder { grid-template-columns: 1fr; }
.hy1608-fst-grid { grid-template-columns: 1fr; }
.hy1608-table th, .hy1608-table td { padding: 10px 8px; font-size: 12px; }
}
/* —— Responsive —— */
@media (max-width: 980px) {
.hy-moa-grid { grid-template-columns: repeat(2, 1fr); }
.hy-stat-grid { grid-template-columns: 1fr; }
.hy-ind-grid { grid-template-columns: 1fr; }
.hy-spotlight { padding: 56px 0 64px; }
.hy-spot-block { margin-bottom: 56px; }
}
@media (max-width: 560px) {
.hy-moa-grid { grid-template-columns: 1fr; }
.hy-moa-receptor { font-size: 48px; }
}
/* News 页 tab 行右侧容器 —— 简化为右对齐胶囊按钮 */
.ny-xwindex-f .ny-xwindex-r {
width: auto !important;
display: flex !important;
justify-content: flex-end !important;
align-items: center !important;
}
/* News 页 tab 行右侧的 PDF 下载按钮 —— ghost / outline 风格，次要权重 */
.news-pdf-pill {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 7px 14px 7px 10px;
background: #ffffff;
color: #096a3d !important;
border: 1.5px solid #b9dcc4;
border-radius: 999px;
text-decoration: none !important;
font-size: 13px;
font-weight: 600;
letter-spacing: 0.01em;
box-shadow: none;
transition: border-color 0.2s, background 0.2s, color 0.2s;
white-space: nowrap;
}
.news-pdf-pill:hover {
border-color: #096a3d;
background: #f4fbf6;
}
.news-pdf-pill-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 22px;
height: 22px;
background: #f0f7f2;
color: #096a3d;
border-radius: 50%;
flex-shrink: 0;
}
.news-pdf-pill-text { color: #096a3d; }
.news-pdf-pill-meta {
font-size: 11px;
font-weight: 500;
letter-spacing: 0.04em;
color: #6b7280;
}
.news-pdf-pill-arrow {
display: inline-flex;
align-items: center;
justify-content: center;
color: #096a3d;
opacity: 0.7;
transition: opacity 0.2s, transform 0.3s cubic-bezier(0.2,0.8,0.2,1);
}
.news-pdf-pill:hover .news-pdf-pill-arrow { opacity: 1; transform: translateY(1px); }
@media (max-width: 768px) {
.news-pdf-pill { padding: 6px 12px 6px 8px; font-size: 12px; gap: 6px; }
.news-pdf-pill-icon { width: 20px; height: 20px; }
.news-pdf-pill-meta { display: none; }
}
/* PDF 下载卡片基础样式 */
.news-pdf-card {
display: flex;
align-items: center;
gap: 22px;
padding: 22px 26px;
background:
radial-gradient(ellipse 140% 80% at 50% 0%, #f4fbf6 0%, #ffffff 70%),
#ffffff;
border: 1px solid #e3eee7;
border-radius: 16px;
box-shadow: 0 4px 14px rgba(9, 106, 61, 0.04), 0 1px 2px rgba(0,0,0,0.03);
text-decoration: none !important;
color: inherit !important;
transition: transform 0.28s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.28s, border-color 0.28s;
position: relative;
overflow: hidden;
}
.news-pdf-card::before {
content: "";
position: absolute;
left: 0; top: 0; right: 0;
height: 3px;
background: linear-gradient(90deg, #096a3d 0%, #2f9e5e 50%, #5fa024 100%);
opacity: 0.95;
}
.news-pdf-card::after {
content: "";
position: absolute;
right: -30px; top: -30px;
width: 120px; height: 120px;
background: radial-gradient(circle, rgba(47, 158, 94, 0.10) 0%, transparent 65%);
pointer-events: none;
}
.news-pdf-card:hover {
transform: translateY(-3px);
box-shadow: 0 16px 40px rgba(9, 106, 61, 0.14), 0 2px 6px rgba(0,0,0,0.04);
border-color: #c7e1cf;
}
.news-pdf-icon {
flex-shrink: 0;
width: 64px;
height: 64px;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, #096a3d 0%, #2f9e5e 100%);
color: #fff;
border-radius: 14px;
box-shadow: 0 6px 16px rgba(9, 106, 61, 0.26), inset 0 1px 0 rgba(255,255,255,0.18);
position: relative;
z-index: 1;
}
.news-pdf-body { flex: 1; min-width: 0; position: relative; z-index: 1; }
.news-pdf-body h3 {
margin: 0 0 6px;
font-size: 19px;
font-weight: 700;
color: #0d4a26;
letter-spacing: 0.005em;
line-height: 1.3;
}
.news-pdf-body p {
margin: 0 0 8px;
font-size: 13.5px;
color: #5b6770;
line-height: 1.6;
}
.news-pdf-meta {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 12px;
color: #88929b;
letter-spacing: 0.04em;
text-transform: uppercase;
font-weight: 600;
}
.news-pdf-cta {
flex-shrink: 0;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 12px 24px;
background: linear-gradient(135deg, #096a3d 0%, #2f9e5e 100%);
color: #fff !important;
border-radius: 999px;
font-size: 14px;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
box-shadow: 0 6px 16px rgba(9, 106, 61, 0.28);
position: relative;
z-index: 1;
transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.news-pdf-card:hover .news-pdf-cta {
box-shadow: 0 10px 24px rgba(9, 106, 61, 0.36);
}
.news-pdf-card:hover .news-pdf-cta svg { transform: translateY(2px); }
.news-pdf-cta svg { transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1); }
@media (max-width: 768px) {
.news-pdf-card { flex-direction: column; align-items: flex-start; padding: 22px; }
.news-pdf-cta { align-self: stretch; }
}
/* PDF 卡 —— 垂直排版（用于侧栏） */
.news-pdf-card-vertical {
flex-direction: column !important;
align-items: stretch !important;
gap: 0 !important;
padding: 0 !important;
background: #ffffff;
}
.news-pdf-card-vertical .news-pdf-icon {
width: 48px;
height: 48px;
align-self: flex-start;
margin: 20px 18px 12px;
border-radius: 11px;
}
.news-pdf-card-vertical .news-pdf-icon svg { width: 24px; height: 24px; }
.news-pdf-card-vertical .news-pdf-body {
padding: 0 18px 14px;
border-bottom: 1px dashed #e3eee7;
margin-bottom: 14px;
}
.news-pdf-card-vertical .news-pdf-body h3 {
font-size: 15.5px;
margin-bottom: 8px;
line-height: 1.35;
}
.news-pdf-card-vertical .news-pdf-body p {
font-size: 12.5px;
line-height: 1.6;
margin-bottom: 10px;
color: #6b7280;
}
.news-pdf-card-vertical .news-pdf-meta {
font-size: 10px;
color: #a4adb6;
letter-spacing: 0.06em;
}
.news-pdf-card-vertical .news-pdf-cta {
align-self: stretch;
justify-content: center;
margin: 0 18px 20px;
padding: 10px 14px;
font-size: 12px;
letter-spacing: 0.12em;
}
@media (max-width: 980px) {
/* 在窄屏栈式布局下，恢复水平卡片样式 */
.news-side-col .news-pdf-card-vertical {
flex-direction: row !important;
align-items: center !important;
padding: 22px 28px !important;
gap: 22px !important;
}
.news-side-col .news-pdf-card-vertical .news-pdf-icon {
width: 64px; height: 64px; margin: 0;
}
.news-side-col .news-pdf-card-vertical .news-pdf-body {
padding: 0; border-bottom: none; margin-bottom: 0;
}
.news-side-col .news-pdf-card-vertical .news-pdf-cta {
align-self: auto; margin: 0; padding: 12px 24px;
}
}
@media (max-width: 768px) {
.news-side-col .news-pdf-card-vertical {
flex-direction: column !important;
align-items: flex-start !important;
}
.news-side-col .news-pdf-card-vertical .news-pdf-cta { align-self: stretch; justify-content: center; }
}
/* Careers 页地图区域 — 高度 580px，紧凑些 */
.page-careers .ny-lx { height: 580px !important; margin-top: 24px !important; margin-bottom: 60px !important; }
.page-careers .ny-lx-api #allmap1 { height: 580px !important; }
.page-careers .ny-lx-l {
height: 580px !important;
box-sizing: border-box !important;
align-items: flex-start !important;
padding-top: 50px !important;
padding-bottom: 40px !important;
}
@media screen and (max-width: 1024px) {
.page-careers .ny-lx, .page-careers .ny-lx-api #allmap1, .page-careers .ny-lx-l { height: 560px !important; }
.page-careers .ny-lx-l { padding-top: 40px !important; padding-bottom: 32px !important; }
}
@media screen and (max-width: 768px) {
.page-careers .ny-lx-l { height: auto !important; padding-top: 32px !important; padding-bottom: 24px !important; align-items: baseline !important; }
}
/* 创始人弹窗 */
.ny-tdjs-fff { border-radius: 16px !important; }
/* 创始人swiper隐藏，flex居中 */
.ny-tdjs-bj .swiper-button-next,
.ny-tdjs-bj .swiper-button-prev,
.ny-tdjs-bj .swiper-pagination { display: none !important; }
.ny-tdjs-bj .swiper-wrapper { display: flex; justify-content: center; }
.ny-tdjs-bj .ny-tdjs { padding: 0 !important; }
.ny-tdjs-bj .swiper-father { padding: 0 !important; }
.ny-tdjs-bj .swiper-slide {
width: auto !important;
flex-shrink: 0;
margin: 0 20px;
}
/* ============== 15. 新闻列表卡片 —— 丝滑科技交互 ============== */
.in-news .notice .tab-pal ul li {
background: #fff !important;
border-radius: 12px !important;
border: 1px solid #ebeef2 !important;
border-left: 3px solid transparent !important;
margin-bottom: 16px !important;
padding: 24px 28px !important;
box-shadow: 0 1px 2px rgba(0,0,0,0.02), 0 1px 8px rgba(0,0,0,0.02) !important;
transition: transform .4s cubic-bezier(0.22,0.61,0.36,1), box-shadow .4s cubic-bezier(0.22,0.61,0.36,1), border-color .3s ease !important;
will-change: transform;
}
.in-news .notice .tab-pal ul li:hover {
border-left-color: #096a3d !important;
transform: translateY(-2px);
box-shadow:
0 1px 2px rgba(0,0,0,0.02),
0 12px 28px rgba(9,106,61,0.07),
0 4px 12px rgba(0,0,0,0.04) !important;
}
.in-news .notice .tab-pal ul li:active {
transform: translateY(-1px) scale(0.997);
box-shadow:
0 1px 2px rgba(0,0,0,0.03),
0 6px 16px rgba(9,106,61,0.1) !important;
transition-duration: .12s !important;
}
/* 去掉新闻卡链接的浏览器原生方框 */
.in-news .notice .tab-pal ul li,
.in-news .notice .tab-pal ul li a,
.in-news .notice .tab-pal ul li * {
-webkit-tap-highlight-color: transparent !important;
}
.in-news .notice .tab-pal ul li a:focus,
.in-news .notice .tab-pal ul li a:active {
outline: none !important;
box-shadow: none !important;
}
.in-news .notice .tab-pal ul li a:focus-visible {
outline: none !important;
}
/* 键盘聚焦时整张卡发淡绿光 + 边框转绿（替代原生方框） */
.in-news .notice .tab-pal ul li:has(a:focus-visible),
.in-news .notice .tab-pal ul li a:focus-visible {
outline: none !important;
}
.in-news .notice .tab-pal ul li:focus-within {
border-color: rgba(9,106,61,0.4) !important;
border-left-color: #096a3d !important;
box-shadow:
0 0 0 3px rgba(9,106,61,0.08),
0 8px 24px rgba(9,106,61,0.08) !important;
}
.in-news .notice .in-news-div .in-news-time {
width: 80px !important;
text-align: center !important;
flex-shrink: 0;
}
.in-news .notice .in-news-div .in-news-time p {
font-size: 28px !important;
line-height: 1.1 !important;
margin-bottom: 4px !important;
color: #096a3d !important;
font-weight: 700 !important;
}
.in-news .notice .in-news-div .in-news-time span {
font-size: 13px !important;
color: #999 !important;
}
.in-news .notice .in-news-div .in-news-text {
width: calc(100% - 100px) !important;
padding-left: 24px !important;
border-left: 1px solid #eee;
}
.in-news .notice .in-news-div .in-news-text h3 {
font-size: 15.5px !important;
font-weight: 600 !important;
color: #222 !important;
margin: 0 0 10px !important;
line-height: 1.55 !important;
/* 覆盖 style.css 的单行截断（white-space:nowrap + text-overflow:ellipsis），允许最多 2 行展示完整标题 */
white-space: normal !important;
text-overflow: clip !important;
display: -webkit-box !important;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden !important;
word-break: break-word;
}
.in-news .notice .in-news-div .in-news-text p {
font-size: 13px !important;
color: #888 !important;
line-height: 1.7 !important;
margin-bottom: 12px !important;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.in-news .notice .in-news-div .in-news-text span {
font-size: 13px !important;
color: #096a3d !important;
font-weight: 500;
}
/* 分页器 */
.paging {
display: flex !important;
justify-content: center !important;
align-items: center !important;
margin: 32px 0 56px !important;
gap: 6px;
flex-wrap: wrap;
}
.paging span {
display: inline-flex;
align-items: center;
justify-content: center;
margin: 0;
padding: 0;
line-height: 1;
vertical-align: middle;
}
.paging span a,
.paging span b,
.paging .page-num,
.paging .page-num-current {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 38px;
height: 38px;
padding: 0 12px;
border-radius: 8px;
font-size: 14px;
font-weight: 500;
line-height: 38px;
box-sizing: border-box;
vertical-align: middle;
text-decoration: none;
transition: all 0.2s;
}
.paging span a {
background: #fff;
color: #555;
border: 1px solid #ddd;
}
.paging span a:hover {
background: #096a3d;
color: #fff;
border-color: #096a3d;
}
.paging span b,
.paging .page-num-current {
background: #096a3d;
color: #fff;
border: 1px solid #096a3d;
}
.paging .page-status {
font-size: 13px;
color: #999;
margin-right: 8px;
height: 38px;
line-height: 38px;
}
.paging .page-numbar {
display: inline-flex;
align-items: center;
gap: 6px;
}
.paging span.page-pre a,
.paging span.page-next a {
font-size: 0 !important;
color: transparent !important;
background: #096a3d !important;
border-color: #096a3d !important;
overflow: hidden !important;
}
.paging span.page-pre a::before,
.paging span.page-next a::before {
font-size: 16px !important;
color: #fff !important;
font-weight: 700;
}
.paging span.page-pre a::before { content: "‹"; }
.paging span.page-next a::before { content: "›"; }
/* ============== 16. 页脚 ============== */
.footer {
background: url(../images/footer-bg.webp) no-repeat center / cover, linear-gradient(180deg, #080d16 0%, #0a1222 40%, #0d1a30 100%) !important;
color: rgba(255,255,255,0.65) !important;
padding: 20px 0 0 !important;
position: relative !important;
overflow: clip;
}
.footer-stars { position: absolute; inset: 0; pointer-events: none; }
.stars-layer {
position: absolute;
inset: 0;
background-repeat: repeat;
}
.stars-sm {
background-image:
radial-gradient(1px 1px at 5% 15%, rgba(255,255,255,0.4) 50%, transparent 50%),
radial-gradient(1px 1px at 12% 45%, rgba(255,255,255,0.3) 50%, transparent 50%),
radial-gradient(1px 1px at 22% 80%, rgba(255,255,255,0.25) 50%, transparent 50%),
radial-gradient(1px 1px at 35% 25%, rgba(255,255,255,0.35) 50%, transparent 50%),
radial-gradient(1px 1px at 48% 65%, rgba(255,255,255,0.2) 50%, transparent 50%),
radial-gradient(1px 1px at 62% 10%, rgba(255,255,255,0.3) 50%, transparent 50%),
radial-gradient(1px 1px at 75% 55%, rgba(255,255,255,0.25) 50%, transparent 50%),
radial-gradient(1px 1px at 88% 35%, rgba(255,255,255,0.35) 50%, transparent 50%),
radial-gradient(1px 1px at 95% 75%, rgba(255,255,255,0.2) 50%, transparent 50%),
radial-gradient(1px 1px at 42% 90%, rgba(255,255,255,0.3) 50%, transparent 50%);
animation: starTwinkle 4s ease-in-out infinite;
}
.stars-md {
background-image:
radial-gradient(1.5px 1.5px at 8% 35%, rgba(255,255,255,0.4) 50%, transparent 50%),
radial-gradient(1.5px 1.5px at 25% 70%, rgba(255,255,255,0.35) 50%, transparent 50%),
radial-gradient(1.5px 1.5px at 45% 20%, rgba(255,255,255,0.3) 50%, transparent 50%),
radial-gradient(1.5px 1.5px at 58% 85%, rgba(255,255,255,0.4) 50%, transparent 50%),
radial-gradient(1.5px 1.5px at 72% 45%, rgba(255,255,255,0.3) 50%, transparent 50%),
radial-gradient(1.5px 1.5px at 90% 15%, rgba(255,255,255,0.35) 50%, transparent 50%),
radial-gradient(1.5px 1.5px at 38% 55%, rgba(255,255,255,0.25) 50%, transparent 50%);
animation: starTwinkle 5s ease-in-out infinite 1s;
}
.stars-lg {
background-image:
radial-gradient(2px 2px at 15% 25%, rgba(52,211,153,0.5) 50%, transparent 50%),
radial-gradient(2px 2px at 50% 40%, rgba(255,255,255,0.45) 50%, transparent 50%),
radial-gradient(2px 2px at 82% 65%, rgba(52,211,153,0.4) 50%, transparent 50%),
radial-gradient(2.5px 2.5px at 30% 80%, rgba(255,255,255,0.35) 50%, transparent 50%),
radial-gradient(2px 2px at 68% 12%, rgba(255,255,255,0.4) 50%, transparent 50%);
animation: starTwinkle 6s ease-in-out infinite 2s;
}
@keyframes starTwinkle { 0%,100% { opacity: 0.4; } 50% { opacity: 1; } }
.footer-deco { position: absolute; inset: 0; pointer-events: none; }
.footer-glow {
position: absolute;
border-radius: 50%;
filter: blur(60px);
}
.footer-glow-1 { width: 400px; height: 400px; background: rgba(9,106,61,0.1); top: -120px; right: 10%; }
.footer-glow-2 { width: 300px; height: 300px; background: rgba(59,130,246,0.06); bottom: 15%; left: 5%; }
.footer-line { display: none; }
.footer-line-1 { display: none; }
.footer-line-2 { display: none; }
.footer-ring {
position: absolute;
border: 1px solid rgba(52,211,153,0.06);
border-radius: 50%;
}
.footer-ring-1 { width: 400px; height: 400px; top: -200px; right: -100px; }
.footer-ring-2 { width: 250px; height: 250px; bottom: -100px; left: -50px; }
/* Footer full-width + content layout */
.footer {
width: 100vw !important;
margin-left: calc(-50vw + 50%) !important;
}
.footer > .cont1400 {
position: relative;
z-index: 1;
width: 1200px !important;
max-width: calc(100% - 60px) !important;
margin: 0 auto !important;
padding: 0 !important;
}
.foot-grid {
display: flex !important;
justify-content: space-between !important;
padding-bottom: 10px !important;
border-bottom: none !important;
}
.foot-col { flex-shrink: 0; }
.foot-col-brand { width: 240px; }
.foot-col:nth-child(2) { width: 120px; }
.foot-col:nth-child(3) { width: 120px; }
.foot-col:nth-child(4) { width: 380px; }
.foot-logo { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.foot-logo-icon { height: 40px !important; width: auto !important; }
.foot-logo-text { height: 38px !important; width: auto !important; filter: invert(1); }
/* 页脚 slogan ——克制：小字号、淡色、轻字重、宽字距
max-width 约束整段宽度，使描述行 wrap 后落在 italic 行的左右边界内（右侧留少量空隙） */
.foot-slogan {
font-size: 11.5px !important;
color: rgba(255, 255, 255, 0.50) !important;
line-height: 1.75 !important;
margin-top: 12px !important;
letter-spacing: 0.04em !important;
font-weight: 300 !important;
font-family: 'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, sans-serif !important;
max-width: 240px !important;
}
.foot-slogan span { font-size: inherit !important; letter-spacing: inherit !important; }
.foot-slogan span[style*="italic"] {
font-style: italic !important;
color: rgba(255, 255, 255, 0.72) !important;
letter-spacing: 0.05em !important;
margin-bottom: 0.9em !important;
font-weight: 400 !important;
}
.foot-col-title {
font-size: 15px !important; font-weight: 600 !important; color: #fff !important;
margin-bottom: 20px !important; white-space: nowrap !important;
border-bottom: none !important; padding-bottom: 0 !important; display: inline-block;
}
.foot-link {
display: block !important; font-size: 13px !important;
color: rgba(255,255,255,0.5) !important; margin-bottom: 14px !important; line-height: 1 !important;
transition: color 0.2s !important; white-space: nowrap !important;
}
.foot-link:hover { color: var(--emerald-400) !important; }
/* 不可点击的占位项（如 HY-2147），与可点击项视觉一致但无 hover/cursor 反馈 */
.foot-link--static, .foot-link--static:hover {
cursor: default !important;
color: rgba(255,255,255,0.5) !important;
}
.foot-contact { font-size: 13px !important; color: rgba(255,255,255,0.5) !important; margin-bottom: 12px !important; line-height: 1.5 !important; white-space: normal !important; }
.foot-ewm { display: flex; gap: 12px; margin-top: 14px; }
.foot-ewm .dropdown { position: relative; }
.foot-ewm .dropdown span { display: block; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.08); cursor: pointer; }
.foot-ewm .dropdown span:hover { background: rgba(255,255,255,0.15); }
.foot-ewm .dropdown .dropdown-content { display: none; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); margin-bottom: 8px; background: #fff; padding: 8px; border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,0.2); }
.foot-ewm .dropdown:hover .dropdown-content { display: block; }
.foot-ewm .dropdown .dropdown-content {
display: none; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%);
margin-bottom: 10px; background: rgba(20,30,50,0.95); border: 1px solid rgba(255,255,255,0.12);
padding: 0; border-radius: 10px; box-shadow: 0 8px 28px rgba(0,0,0,0.35);
backdrop-filter: blur(8px); width: auto !important; overflow: visible !important;
}
.foot-ewm .dropdown .dropdown-content::after {
content: ""; position: absolute; bottom: -6px; left: 50%; transform: translateX(-50%) rotate(45deg);
width: 10px; height: 10px; background: rgba(20,30,50,0.95); border-right: 1px solid rgba(255,255,255,0.12);
border-bottom: 1px solid rgba(255,255,255,0.12);
}
.foot-ewm .dropdown:hover .dropdown-content { display: block !important; }
.foot-ewm .dropdown .dropdown-content img {
width: 130px !important; height: 130px !important; margin: 0 !important;
display: block; border-radius: 8px; padding: 10px;
}
.foot-ewm .dropdown .dropdown-phone {
padding: 12px 20px; white-space: nowrap; text-align: center;
}
.foot-ewm .dropdown .dropdown-phone p {
margin: 0; font-size: 14px; color: rgba(255,255,255,0.85); font-weight: 500; letter-spacing: 0.5px;
}
.foot-ewm .dropdown .dropdown-phone .phone-icon {
display: none;
}
.foot-ewm .dropdown1:hover .dropdown-content { display: none !important; }
.foot-ewm .dropdown a { display: block; color: inherit; text-decoration: none; }
/* 去掉页脚图标/链接点击时的边框、轮廓和移动端高亮 */
.foot-ewm .dropdown,
.foot-ewm .dropdown *,
.foot-ewm .dropdown a,
.foot-ewm .dropdown span,
.foot-col a,
.foot-link {
-webkit-tap-highlight-color: transparent !important;
outline: none !important;
}
.foot-ewm .dropdown a:focus,
.foot-ewm .dropdown a:active,
.foot-ewm .dropdown span:focus,
.foot-ewm .dropdown span:active,
.foot-col a:focus,
.foot-col a:active,
.foot-link:focus,
.foot-link:active {
outline: none !important;
box-shadow: none !important;
border-color: transparent !important;
}
.foot-bq {
position: relative; z-index: 1;
display: flex !important; justify-content: space-between !important; align-items: center !important;
padding: 12px 0 16px !important; margin-top: 0 !important; font-size: 12px !important; color: rgba(255,255,255,0.3) !important;
border-top: none !important;
}
.foot-bq p { margin: 0 !important; }
.foot-bq a { color: rgba(255,255,255,0.35) !important; margin: 0 6px; }
.foot-bq a:hover { color: rgba(255,255,255,0.6) !important; }
.foot-nav { border-bottom: none !important; }
/* ============== 17. 右侧悬浮 ============== */
.ycxf {
background: var(--gray-800) !important;
border-radius: 12px !important;
}
/* ============== 18. 手机端响应式 ============== */
@media screen and (max-width:1200px) {
.sticky-nav .top .logo img { height: 56px; max-height: 56px; }
.banner-con { margin-top: 0 !important; }
.ny-banner { margin-top: 0 !important; }
}
@media screen and (max-width:1024px) {
.ny-banner { height: 70vh !important; max-height: none !important; }
/* 平板：保留四列横向 flex（不切 grid），按比例分配宽度 */
.foot-grid { display: flex !important; flex-wrap: nowrap !important; gap: 16px !important; padding-bottom: 16px !important; }
.foot-grid .foot-col,
.foot-grid .foot-col-brand,
.foot-grid .foot-col:nth-child(2),
.foot-grid .foot-col:nth-child(3),
.foot-grid .foot-col:nth-child(4) { width: auto !important; flex-shrink: 1 !important; }
.foot-col-brand { flex: 0 1 26% !important; }
.foot-col:nth-child(2) { flex: 0 1 16% !important; }
.foot-col:nth-child(3) { flex: 0 1 22% !important; }
.foot-col:nth-child(4) { flex: 0 1 36% !important; }
.foot-bq { padding: 16px 0 20px !important; }
}
@media screen and (max-width:768px) {
body { max-width: 100% !important; box-shadow: none !important; margin: 0 !important; padding-top: 0 !important; }
.sticky-nav { max-width: 100%; }
/* ========================================================
新闻页"无休止剧烈抖动"修复 — 根因有三层叠加：
1. `.ny-banner` 用 height:70vh —— iOS 滚动时地址栏伸缩，vh 实时
变化导致 banner 高度跳变，下方内容跟着上下窜
2. `.page-news .ny-banner` 还套了 18s Ken Burns scale 动画 —— 每
次 vh 变化时 transform 也会重新栅格化，放大跳变感
3. `.wow.fadeInUp` 元素若被 wow.js 重新检测，进入/离开视口时
反复触发 fadeInUp 动画，叠加上面两个变量就成了无止境抖动
解决：手机端 banner 改成 min-height（只长不缩），关掉 Ken Burns，
锁死所有 animate.css 动画在终态不可重播。
======================================================== */
.ny-banner {
height: auto !important;
min-height: 60vh !important; /* 只长不缩，地址栏伸缩不再改高 */
max-height: none !important;
/* 关键：用 dvh 让初始值随设备而定，但 min-height 保底，永不抖动 */
}
@supports (height: 100dvh) {
.ny-banner { min-height: 60dvh !important; }
}
/* 关掉 Ken Burns（手机端没必要这种动效，反而引入抖动风险） */
.page-news .ny-banner,
.page-careers .ny-banner,
body.page-about .ny-banner {
animation: none !important;
-webkit-animation: none !important;
transform: none !important;
-webkit-transform: none !important;
}
/* 锁死 wow.js + animate.css 动画——只播一次，且永远停在终态 */
.wow,
.animated,
.fadeInUp,
.fadeInDown,
.fadeInLeft,
.fadeInRight,
.wow.animated.fadeInUp {
animation-iteration-count: 1 !important;
animation-fill-mode: both !important;
-webkit-animation-iteration-count: 1 !important;
-webkit-animation-fill-mode: both !important;
}
/* 新闻卡片：手机端去掉 hover 效果——iOS 上 :hover 会"粘"在最后一次
点击的元素上，滚动时下一张卡又触发 :hover，transform 反复切换 = 抖 */
.in-news .notice .tab-pal ul li {
transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
will-change: auto !important;
transform: none !important;
}
.in-news .notice .tab-pal ul li:hover {
transform: none !important;
}
.ny-banner h2 { font-size: 32px !important; }
.ny-banner p { font-size: 18px !important; }
.ny-about { display: block !important; }
.ny-about-l, .ny-about-r { width: 100% !important; }
/* 手机：保持四列横向，整体缩比 */
.foot-grid { display: flex !important; flex-wrap: nowrap !important; gap: 10px !important; padding-bottom: 12px !important; }
.foot-col-brand { flex: 0 1 26% !important; }
.foot-col:nth-child(2) { flex: 0 1 16% !important; }
.foot-col:nth-child(3) { flex: 0 1 22% !important; }
.foot-col:nth-child(4) { flex: 0 1 36% !important; }
.foot-logo { margin-bottom: 10px !important; gap: 4px !important; }
.foot-logo-icon { height: 24px !important; }
.foot-logo-text { height: 22px !important; }
.foot-slogan { margin-top: 8px !important; font-size: 9px !important; line-height: 1.5 !important; max-width: 100% !important; letter-spacing: 0.02em !important; }
.foot-col-title { font-size: 12px !important; margin-bottom: 10px !important; white-space: normal !important; }
.foot-grid .foot-col > .foot-col-title { margin-bottom: 10px !important; }
.foot-link { font-size: 11px !important; margin-bottom: 8px !important; white-space: normal !important; }
.foot-contact { font-size: 10px !important; margin-bottom: 6px !important; line-height: 1.4 !important; }
.foot-ewm { margin-top: 8px !important; gap: 8px !important; }
.foot-ewm .dropdown span { width: 28px !important; height: 28px !important; }
}
@media screen and (max-width:640px) {
.ny-banner h2 { font-size: 28px !important; }
}
/* ============== 19. 新闻首推/分类导航 ============== */
.ny-xwindex { background: #f7f8fa !important; padding: 0 !important; margin: 0 !important; }
.ny-xwindex:empty,
.ny-xwindex:not(:has(.swiper-slide)) { display: none !important; }
.page-news .ny-xwindex-bt,
.page-news .ny-xw-lb { margin-top: 0 !important; }
.ny-xwindex-bt { background: #fff !important; border-bottom: 1px solid #eee !important; border-top: none !important; }
.ny-xwindex-f { padding: 20px 0 !important; }
.ny-xwindex-f .ny-xwindex-l ul li { margin-right: 36px !important; }
.ny-xwindex-f .ny-xwindex-l ul li a {
font-size: 17px !important;
color: #1f2937 !important;
font-weight: 600;
padding-bottom: 6px;
border-bottom: 2.5px solid transparent;
letter-spacing: 0.01em;
transition: all 0.2s;
}
.ny-xwindex-f .ny-xwindex-l ul li a:hover,
.ny-xwindex-f .ny-xwindex-l ul li.active a {
color: #096a3d !important;
border-bottom-color: #096a3d;
}
/* News 筛选标签 —— 干掉原生方框，hover/active 加丝滑 underline + 文字微光 */
.ny-xwindex-f .ny-xwindex-l ul li a {
outline: none !important;
-webkit-tap-highlight-color: transparent !important;
transition: color .25s, border-color .35s cubic-bezier(0.22,0.61,0.36,1), text-shadow .25s !important;
}
.ny-xwindex-f .ny-xwindex-l ul li a:focus,
.ny-xwindex-f .ny-xwindex-l ul li a:active {
outline: none !important;
box-shadow: none !important;
}
.ny-xwindex-f .ny-xwindex-l ul li a:hover {
text-shadow: 0 0 12px rgba(9,106,61,0.28);
}
.ny-xwindex-f .ny-xwindex-l ul li a:focus-visible {
outline: none !important;
text-shadow: 0 0 12px rgba(9,106,61,0.4);
}
/* ============== 20. 研发管线详情页 ============== */
/* Hero —— Pipeline 主题深绿，多层径向高光给出"有内容"的层次，避免大面积纯色 */
.yf-detail-hero {
position: relative;
padding: 150px 0 70px;
text-align: center;
overflow: hidden;
background:
/* 顶部一道细微暖光，跟绿色导航底沿过渡更自然 */
radial-gradient(ellipse 95% 35% at 50% 0%, rgba(140, 200, 160, 0.18) 0%, transparent 70%),
/* 右上偏暖绿光晕 */
radial-gradient(circle 600px at 80% 25%, rgba(74, 174, 110, 0.22) 0%, transparent 55%),
/* 左下偏冷绿光晕 */
radial-gradient(circle 500px at 15% 80%, rgba(34, 122, 78, 0.20) 0%, transparent 55%),
/* 底部 vignette 让标题更聚焦 */
radial-gradient(ellipse 120% 80% at 50% 110%, rgba(8, 35, 20, 0.45) 0%, transparent 60%),
/* 主背景：从中绿向深森林绿过渡 */
linear-gradient(168deg, #2c6843 0%, #235636 38%, #194529 70%, #133b22 100%);
}
.yf-detail-hero-bg {
position: absolute;
inset: 0;
background:
radial-gradient(ellipse at 70% 20%, rgba(5,150,105,0.12) 0%, transparent 55%),
radial-gradient(ellipse at 20% 80%, rgba(52,211,153,0.06) 0%, transparent 50%);
pointer-events: none;
}
.yf-detail-hero-bg::before {
content: "";
position: absolute;
top: -60%; right: -20%;
width: 600px; height: 600px;
border: 1px solid rgba(52,211,153,0.06);
border-radius: 50%;
}
.yf-detail-hero-bg::after {
content: "";
position: absolute;
bottom: -40%; left: -10%;
width: 400px; height: 400px;
border: 1px solid rgba(52,211,153,0.04);
border-radius: 50%;
}
.yf-detail-hero-inner {
position: relative;
z-index: 1;
}
.yf-detail-badge {
display: inline-block;
padding: 8px 22px;
background: rgba(52, 211, 153, 0.10);
border: 1px solid rgba(110, 231, 183, 0.45);
border-radius: 999px;
color: #a7f3d0;
font-size: 13.5px;
font-weight: 600;
letter-spacing: 0.12em;
text-transform: uppercase;
margin-bottom: 24px;
backdrop-filter: blur(6px);
-webkit-backdrop-filter: blur(6px);
box-shadow: 0 4px 18px rgba(0, 0, 0, 0.18), inset 0 0 0 1px rgba(255,255,255,0.04);
}
/* 防御：ext_zy 字段为空时不显示空气泡 */
.yf-detail-badge:empty { display: none !important; }
.yf-detail-title {
font-size: clamp(36px, 4.2vw, 56px);
font-weight: 800;
color: #ffffff;
margin: 0;
letter-spacing: 0.04em;
line-height: 1.1;
text-shadow: 0 4px 24px rgba(0, 0, 0, 0.35), 0 1px 2px rgba(0, 0, 0, 0.25);
}
.yf-detail-subtitle {
font-size: clamp(14px, 1.2vw, 19px);
font-weight: 400;
color: rgba(220, 252, 231, 0.92);
margin: 20px auto 0;
line-height: 1.6;
letter-spacing: 0.01em;
max-width: 880px;
padding: 0 16px;
text-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
white-space: nowrap;
overflow: hidden;
text-overflow: clip;
}
@media screen and (max-width: 900px) {
.yf-detail-subtitle {
white-space: normal;
overflow: visible;
font-size: 14px;
letter-spacing: 0.01em;
}
}
.yf-detail-subtitle:empty { display: none; }
.yf-detail-slogan {
position: relative;
display: inline-block;
font-size: clamp(17px, 1.6vw, 22px);
font-weight: 500;
font-style: italic;
color: #f5d990;
margin: 28px auto 0;
line-height: 1.3;
letter-spacing: 0.08em;
padding: 0;
text-shadow: 0 2px 14px rgba(0, 0, 0, 0.35);
}
/* 去掉 Envisioning a World Free of Pain 左右两侧的小金色横线装饰 */
.yf-detail-slogan::before,
.yf-detail-slogan::after {
content: none !important;
display: none !important;
}
.yf-detail-divider {
width: 72px;
height: 2px;
background: linear-gradient(90deg, transparent 0%, rgba(167, 243, 208, 0.85) 50%, transparent 100%);
margin: 28px auto 0;
border-radius: 0;
box-shadow: 0 0 12px rgba(110, 231, 183, 0.35);
}
/* 详情页：去掉 nav 底部那条白色 seam（在深绿 hero 上太刺眼） */
body.page-pipeline .sticky-nav {
box-shadow: 0 8px 28px rgba(0, 0, 0, 0.20) !important;
border-bottom: 1px solid rgba(13, 50, 28, 0.50) !important;
}
/* Body */
.yf-detail-body {
background: #f7f8fa;
padding: 40px 0 60px;
}
.yf-detail-back-wrap {
max-width: 1280px;
margin: 32px auto 0;
text-align: left;
}
.yf-detail-back-btn {
display: inline-block;
padding: 10px 28px;
background: #096a3d;
color: #fff !important;
border-radius: 8px;
font-size: 14px;
font-weight: 500;
transition: all 0.3s;
}
.yf-detail-back-btn:hover {
background: #07572f;
transform: translateX(-4px);
}
/* 顶部返回按钮 —— 内容卡片上方的轻量幽灵样式，不抢戏 */
.yf-detail-back-wrap--top {
max-width: 1280px;
margin: 0 auto 18px;
padding: 0;
text-align: left;
}
.yf-detail-back-btn--ghost {
background: transparent !important;
color: #096a3d !important;
border: 1px solid rgba(13, 107, 61, 0.25);
padding: 8px 18px;
font-size: 13.5px;
border-radius: 999px;
letter-spacing: 0.02em;
}
.yf-detail-back-btn--ghost:hover {
background: rgba(13, 107, 61, 0.08) !important;
border-color: rgba(13, 107, 61, 0.5);
color: #07572f !important;
}
.yf-detail-content {
max-width: 1280px;
margin: 0 auto;
background: #fff;
border-radius: 16px;
box-shadow: 0 4px 24px rgba(0,0,0,0.06);
padding: 48px 56px;
line-height: 1.9;
font-size: 15px;
color: #333;
}
.yf-detail-content h2,
.yf-detail-content h3 {
color: #096a3d;
font-weight: 700;
margin: 36px 0 16px;
padding-bottom: 10px;
border-bottom: 2px solid #f0f0f0;
}
.yf-detail-content h2:first-child,
.yf-detail-content h3:first-child { margin-top: 0; }
.yf-detail-content h2 { font-size: 22px; }
.yf-detail-content h3 { font-size: 18px; }
.yf-detail-content p { margin: 12px 0; }
.yf-detail-content ul,
.yf-detail-content ol { padding-left: 20px; margin: 12px 0; }
.yf-detail-content li {
position: relative;
padding: 6px 0 6px 8px;
border-bottom: 1px solid #f5f5f5;
}
.yf-detail-content li:last-child { border-bottom: none; }
.yf-detail-content img {
max-width: 100%;
height: auto;
border-radius: 8px;
margin: 16px auto;
}
.yf-detail-content table {
width: 100%;
border-collapse: collapse;
margin: 20px 0;
border-radius: 8px;
overflow: hidden;
}
.yf-detail-content table th {
background: #096a3d;
color: #fff;
padding: 12px 16px;
text-align: left;
font-weight: 600;
}
.yf-detail-content table td {
padding: 12px 16px;
border-bottom: 1px solid #f0f0f0;
}
.yf-detail-content table tr:hover td { background: #f9fafb; }
.yf-detail-content strong { color: #111; }
.yf-detail-content blockquote {
margin: 20px 0;
padding: 16px 24px;
background: linear-gradient(135deg, #f0fdf4, #ecfdf5);
border-left: 4px solid #096a3d;
border-radius: 0 8px 8px 0;
color: #065f46;
font-style: italic;
}
/* Legacy support */
.yf-xq-bt {
background: linear-gradient(135deg, #0a1628 0%, #132a4f 55%, #0d1f3d 100%) !important;
padding: 120px 0 48px !important;
text-align: center;
}
.yf-xq-bt h2 { color: #fff !important; font-size: 32px !important; font-weight: 700 !important; }
.yf-xq-nr {
background: #fff !important;
padding: 48px 0 !important;
}
.yf-xq-nr .cont1400 { max-width: 800px !important; }
/* ============== 21. 加入我们 ============== */
.ny-job-bt {
background: linear-gradient(135deg, #096a3d, #059669) !important;
color: #fff !important;
}
/* ============== 22. 新闻详情旧样式 ============== */
.ny-xwxq { padding-top: 100px !important; }
.ny-xw-bt {
text-align: center !important;
padding: 40px 0 32px !important;
border-bottom: 1px solid #eee !important;
}
.ny-xw-bt h3 {
font-size: 26px !important;
font-weight: 700 !important;
color: #111 !important;
max-width: 700px;
margin: 0 auto 12px !important;
}
.ny-xw-bt span { font-size: 13px !important; color: #999 !important; }
.ny-xwnr { background: #fff !important; padding: 40px 0 60px !important; }
.ny-xwnr .ny-xwnr-c { display: flex; gap: 40px; }
.ny-xwnr .ny-xq-l { flex: 1; max-width: 760px; }
.ny-xq-nr { font-size: 15px !important; line-height: 1.9 !important; color: #333 !important; }
.ny-xq-nr p { margin-bottom: 16px; }
.ny-xq-nr img { max-width: 100%; height: auto; border-radius: 8px; margin: 16px 0; }
.ny-xq-btn { margin-top: 40px !important; padding-top: 24px !important; border-top: 1px solid #eee !important; }
.ny-xq-btn .btn-div { font-size: 14px !important; color: #666 !important; margin-bottom: 8px; }
.ny-xq-btn .btn-div a { color: #333 !important; }
.ny-xq-btn .btn-div a:hover { color: #096a3d !important; }
.xq-btn-r a { display: inline-block; padding: 8px 24px; background: #096a3d; color: #fff !important; border-radius: 6px; font-size: 13px; }
.ny-xq-r { background: #f9fafb !important; border-radius: 12px !important; padding: 24px !important; border: 1px solid #eee; width: 280px; flex-shrink: 0; position: sticky; top: 90px; }
.ny-xq-r-h3 h3 { font-size: 16px !important; font-weight: 600 !important; color: #222 !important; margin-bottom: 16px !important; padding-bottom: 12px !important; border-bottom: 2px solid #096a3d !important; display: inline-block; }
.ny-xq-r ul li { padding: 10px 0 !important; border-bottom: 1px solid #f0f0f0 !important; }
.ny-xq-r ul li:last-child { border-bottom: none !important; }
.ny-xq-r ul li a h3 { font-size: 14px !important; font-weight: 500 !important; color: #333 !important; line-height: 1.5 !important; margin: 0 !important; }
.ny-xq-r ul li a:hover h3 { color: #096a3d !important; }
.ny-xq-r ul li a span { font-size: 12px !important; color: #aaa !important; margin-top: 4px; display: block; }
/* 响应式 */
@media screen and (max-width:768px) {
.in-news .notice .in-news-div { flex-direction: column; }
.in-news .notice .in-news-div .in-news-time { width: 100% !important; text-align: left !important; margin-bottom: 8px; }
.in-news .notice .in-news-div .in-news-text { width: 100% !important; padding-left: 0 !important; border-left: none !important; }
.ny-xw-bt h3 { font-size: 20px !important; }
.ny-xwnr .ny-xwnr-c { flex-direction: column; }
.ny-xwnr .ny-xq-l, .ny-xwnr .ny-xq-r { width: 100% !important; }
}
/* ========== 关于华元页 — body.page-about 高优先级 ========== */
body.page-about .cont1400 {
width: 100% !important;
max-width: 1060px !important;
margin-left: auto !important;
margin-right: auto !important;
padding-left: 20px !important;
padding-right: 20px !important;
}
body.page-about .footer .cont1400 {
max-width: 1400px !important;
}
body.page-about .ny-banner {
height: 81vh !important;
max-height: none !important;
background-size: cover !important;
background-position: center center !important;
}
/* 新闻/新闻详情/加入我们：高特异性锁死与关于华元同高，保证 HERO 底部位置在所有断点一致 */
body.page-news .ny-banner,
body.page-news-detail .ny-banner,
body.page-careers .ny-banner {
height: 81vh !important;
min-height: 0 !important;
max-height: none !important;
background-size: cover !important;
background-position: center center !important;
}
body.page-about .ny-about {
display: block !important;
border-radius: 0 !important;
box-shadow: none !important;
background: transparent !important;
margin: 0 !important;
padding: 0 !important;
overflow: visible !important;
height: auto !important;
}
body.page-about .ny-about-r { display: none !important; }
body.page-about .ny-about-l {
width: 100% !important;
max-width: 980px !important;
margin: 0 auto !important;
padding: 40px 8px 56px !important;
display: block !important;
height: auto !important;
}
body.page-about .ny-about-l .h3 {
font-size: 24px !important;
font-weight: 700 !important;
color: #111 !important;
margin: 0 0 22px !important;
padding-bottom: 12px !important;
position: relative !important;
}
body.page-about .ny-about-l .h3::after {
margin-top: 12px !important;
margin-bottom: 0 !important;
width: 44px !important;
height: 3px !important;
}
body.page-about .ny-about-l p {
font-size: 15.5px !important;
line-height: 2 !important;
color: #374151 !important;
text-align: left !important;
margin-bottom: 18px !important;
display: block !important;
-webkit-line-clamp: unset !important;
overflow: visible !important;
max-height: none !important;
}
body.page-about .ny-about-l p:last-child {
margin-bottom: 0 !important;
}
/* 中文段首空 2 格（仅中文页面，英文 About 不缩进） */
html[lang="zh-CN"] body.page-about .ny-about-l p {
text-indent: 2em !important;
}
body.page-about .ny-title {
padding: 20px 0 8px !important;
margin-bottom: 0 !important;
}
body.page-about .ny-title h2 {
font-size: 22px !important;
padding-bottom: 8px !important;
margin-bottom: 0 !important;
}
body.page-about .ny-tdjs-bj {
padding: 40px 0 24px !important;
margin-top: 16px !important;
}
body.page-about .ny-tdjs-bj .ny-title {
padding: 12px 0 4px !important;
margin-bottom: 0 !important;
}
.founder-hint {
display: block;
margin-top: 8px;
font-size: 12px;
color: #bbb;
letter-spacing: 0.04em;
transition: color 0.25s;
}
body.page-about .ny-tdjs-bj a.md-trigger { display: block; transition: transform 0.3s ease; }
body.page-about .ny-tdjs-bj a.md-trigger:hover { transform: translateY(-4px); }
body.page-about .ny-tdjs-bj a.md-trigger:hover .founder-hint { color: #096a3d; }
/* 创始人单卡块：居中独立展示，FOUNDER 标签独立一行在名字上方 */
.founder-feature {
display: flex;
justify-content: center;
padding: 4px 0 28px;
}
.founder-feature .founder-card {
text-align: center;
width: 300px;
}
.founder-card-label {
display: block;
margin: 14px 0 4px;
font-size: 12px;
font-weight: 700;
letter-spacing: 0.22em;
color: #096a3d;
text-transform: uppercase;
}
/* 研发团队 - 单行无缝跑马灯（自渲染 + 拖拽） */
/* 三段式布局：左按钮 | viewport（裁剪 + 拖拽） | 右按钮 */
.team-marquee {
position: relative;
display: flex;
align-items: center;
gap: 8px;
padding: 12px 0 16px;
/* 关于页 cont1400 被锁到 1060 + 左右 20px padding；用负 margin 把按钮 bleed 到 cont1400 外 */
margin-left: -20px;
margin-right: -20px;
user-select: none;
-webkit-user-select: none;
}
/* 桌面端：按视口宽度分档负 margin，按钮逐步贴近视口两侧（不会溢出产生横向滚动条） */
@media (min-width: 1180px) {
body.page-about .team-marquee {
margin-left: -50px;
margin-right: -50px;
gap: 14px;
}
}
@media (min-width: 1280px) {
body.page-about .team-marquee {
margin-left: -90px;
margin-right: -90px;
gap: 18px;
}
}
@media (min-width: 1440px) {
body.page-about .team-marquee {
margin-left: -130px;
margin-right: -130px;
gap: 24px;
}
}
.team-marquee .team-marquee-viewport {
flex: 1 1 auto;
min-width: 0; /* flex 子项允许收缩到比内容小 */
overflow: hidden; /* 隐藏滚动条 + 裁剪溢出 */
padding: 8px 0; /* 留垂直空间，避免 hover 时卡片上抬被裁切 */
cursor: grab;
}
.team-marquee.is-grabbing .team-marquee-viewport { cursor: grabbing; }
.team-marquee .team-track {
display: flex;
align-items: flex-start;
gap: 32px;
will-change: transform;
width: max-content;
}
.team-marquee .team-card {
flex: 0 0 220px;
width: 220px;
text-align: center;
-webkit-user-drag: none;
}
.team-marquee .team-card img { -webkit-user-drag: none; pointer-events: none; }
.team-marquee .team-card a { display: block; }
/* 左右导航按钮 - 在轨道外侧独立列，不再叠加在卡片上 */
.team-marquee .marquee-nav {
position: static;
flex: 0 0 56px;
width: 56px;
height: 56px;
padding: 0;
border: 1px solid #cfdbd4;
border-radius: 50%;
background: linear-gradient(180deg, #ffffff 0%, #f4f8f6 100%);
color: #096a3d;
font-size: 34px;
line-height: 1;
font-weight: 600;
font-family: Arial, "Helvetica Neue", "PingFang SC", sans-serif;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 3px 12px rgba(9, 106, 61, 0.08), inset 0 0 0 1px rgba(255,255,255,0.6);
transition: background 0.2s, color 0.2s, transform 0.2s, box-shadow 0.2s, border-color 0.2s;
align-self: center;
}
.team-marquee .marquee-nav > * { margin-top: -2px; } /* 视觉居中微调（‹/› 字形偏下） */
.team-marquee .marquee-nav:hover {
background: linear-gradient(180deg, #0b7d48 0%, #096a3d 100%);
color: #fff;
border-color: #096a3d;
transform: scale(1.08);
box-shadow: 0 6px 18px rgba(9, 106, 61, 0.3);
}
.team-marquee .marquee-nav:active { transform: scale(0.96); }
.team-marquee .marquee-nav:focus-visible { outline: 2px solid #096a3d; outline-offset: 3px; }
@media (max-width: 900px) {
.team-marquee { gap: 4px; margin: 0 -12px; }
.team-marquee .team-track { gap: 24px; }
.team-marquee .team-card { flex: 0 0 200px; width: 200px; }
.team-marquee .marquee-nav { flex: 0 0 48px; width: 48px; height: 48px; font-size: 28px; }
}
@media (max-width: 600px) {
.team-marquee { gap: 2px; padding: 8px 0 12px; margin: 0 -8px; }
.team-marquee .team-track { gap: 20px; }
.team-marquee .team-card { flex: 0 0 180px; width: 180px; }
.team-marquee .marquee-nav { flex: 0 0 40px; width: 40px; height: 40px; font-size: 24px; }
}
/* 保留旧的 .founder-grid 样式，万一别处还在用 */
.founder-grid {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
gap: 36px 40px;
padding: 4px 0 12px;
}
.founder-grid .founder-card {
text-align: center;
flex: 0 0 240px;
max-width: 240px;
}
.founder-card-name {
margin: 16px 0 4px;
font-size: 18px;
font-weight: 600;
color: #333;
}
.founder-card-role {
display: block;
font-size: 13px;
color: #096a3d;
letter-spacing: 0.02em;
white-space: nowrap;
}
.founder-card-role-long {
font-size: 11.5px;
letter-spacing: 0;
}
/* 静态模式：卡片数 ≤ 5 时不滚动，居中显示，隐藏左右按钮 */
.team-marquee.team-marquee-static .team-track {
width: 100%;
justify-content: center;
}
.team-marquee.team-marquee-static .marquee-nav { display: none; }
.team-marquee.team-marquee-static .team-marquee-viewport { cursor: default; }
@media (max-width: 900px) {
.founder-grid {
gap: 28px 24px;
}
.founder-grid .founder-card {
flex: 0 0 220px;
max-width: 220px;
}
.founder-grid .founder-spacer { display: none; }
}
@media (max-width: 600px) {
.founder-grid {
gap: 24px;
}
.founder-grid .founder-card {
flex: 0 0 80%;
max-width: 80%;
}
}
body.page-about .ny-ry {
padding: 16px 0 0 !important;
margin-bottom: 0 !important;
}
body.page-about .ny-ry .ny-title { margin-bottom: 4px !important; padding-bottom: 4px !important; }
body.page-about .ny-ry .ny-tdjs { padding-top: 0 !important; margin-top: 0 !important; }
body.page-about .ny-ry .swiper-father { padding-top: 0 !important; }
body.page-about .ny-ry .swiper-slide figure { height: 150px !important; padding: 6px !important; }
body.page-about .ny-ry .swiper-slide p { padding: 4px 8px 6px !important; font-size: 12px !important; }
body.page-about .ny-ry .swiper-button-next,
body.page-about .ny-ry .swiper-button-prev {
width: 34px !important; height: 34px !important; background: #fff !important;
border-radius: 50% !important; box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
}
body.page-about .ny-ry .swiper-button-next::after,
body.page-about .ny-ry .swiper-button-prev::after { font-size: 13px !important; color: #555 !important; font-weight: 700 !important; }
body.page-about .ny-ry .swiper-button-next:hover,
body.page-about .ny-ry .swiper-button-prev:hover { background: #096a3d !important; }
body.page-about .ny-ry .swiper-button-next:hover::after,
body.page-about .ny-ry .swiper-button-prev:hover::after { color: #fff !important; }
body.page-about .ny-ry .swiper-pagination-bullet { background: #ccc !important; opacity: 1 !important; width: 8px !important; height: 8px !important; }
body.page-about .ny-ry .swiper-pagination-bullet-active { background: #096a3d !important; width: 20px !important; border-radius: 4px !important; }
body.page-about .milestone-section { padding: 40px 0 24px !important; margin-top: 0 !important; background: #fff !important; }
body.page-about .milestone-section .cont1400 { max-width: 1200px !important; }
body.page-about .milestone-section .ny-title { margin-bottom: 0 !important; padding-bottom: 4px !important; padding-top: 0 !important; margin-top: 0 !important; }
body.page-about .milestone-row {
display: flex !important; gap: 20px !important; margin-top: 12px !important; align-items: flex-start !important;
}
/* 两栏卡片硬编码同高 —— 物理对齐,不再依赖 JS */
body.page-about .milestone-row > .col-sm-6:first-child .milestone-card {
overflow: hidden !important;
}
body.page-about .milestone-row > .col-sm-6:last-child .milestone-card {
overflow-y: auto !important;
position: relative !important;
}
/* 右卡底部内侧白色渐变,盖住任何半截露头,边框保留 */
body.page-about .milestone-row > .col-sm-6:last-child .milestone-card::after {
content: '';
position: absolute;
left: 0;
right: 10px; /* 让出滚动条宽度 */
bottom: 0;
height: 22px;
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 70%);
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
pointer-events: none;
z-index: 2;
}
body.page-about .milestone-row > .col-sm-6 {
flex: 1 1 50% !important; width: 50% !important; max-width: 50% !important;
padding: 0 !important; float: none !important;
}
body.page-about .milestone-row {
position: relative !important;
}
body.page-about .milestone-card {
height: 290px !important; min-height: 290px !important; max-height: 290px !important;
padding: 16px 22px !important; border-radius: 10px !important;
box-sizing: border-box !important;
}
/* Right card (研究进展): match left card height, scroll inside */
body.page-about .milestone-row > .col-sm-6:last-child .milestone-card {
max-height: none;
overflow-y: auto;
scrollbar-width: thin;
scrollbar-color: #ccc transparent;
}
body.page-about .milestone-row > .col-sm-6:last-child .milestone-card::-webkit-scrollbar { width: 4px; }
body.page-about .milestone-row > .col-sm-6:last-child .milestone-card::-webkit-scrollbar-thumb { background: #ccc; border-radius: 2px; }
body.page-about .milestone-row > .col-sm-6:last-child .milestone-card::-webkit-scrollbar-track { background: transparent; }
body.page-about .milestone-card-title { font-size: 15px !important; margin-bottom: 8px !important; }
body.page-about .milestone-item { padding: 6px 0 !important; gap: 12px !important; }
body.page-about .milestone-date { font-size: 13px !important; min-width: 80px !important; }
body.page-about .milestone-text { font-size: 13px !important; line-height: 1.5 !important; }
body.page-about .milestone-text p { margin: 0 !important; font-size: 13px !important; }
/* 时间线两栏对齐策略:
1) 所有条目固定 min-height,使左右两栏每行 Y 坐标一致(行级对齐);
2) 左栏(Key Milestones)以自然高度决定整行可视高度;
3) 右栏(Research Progress)条目超出时在卡片内部纵向滚动;
4) JS 把右卡 height/max-height 同步为左卡实际高度(measure left, apply to right). */
body.page-about .milestone-card > .milestone-item {
min-height: 52px !important;
display: flex !important;
align-items: center !important;
box-sizing: border-box !important;
}
body.page-about .milestone-row > .col-sm-6:last-child .milestone-card {
overflow-y: auto !important;
scrollbar-width: thin;
scrollbar-color: #b5b5b5 transparent;
}
body.page-about .milestone-row > .col-sm-6:last-child .milestone-card::-webkit-scrollbar { width: 6px; }
body.page-about .milestone-row > .col-sm-6:last-child .milestone-card::-webkit-scrollbar-thumb { background: #b5b5b5; border-radius: 3px; }
body.page-about .milestone-row > .col-sm-6:last-child .milestone-card::-webkit-scrollbar-track { background: transparent; }
/* ============== 新闻详情页 Hero + 正文 ============== */
/* Hero 改为干净的白底社论风 —— 让"大桥导航 → 白底标题 → 浅灰内容卡"形成平滑过渡 */
.news-detail-hero {
background: #ffffff;
padding: 100px 0 40px;
position: relative;
overflow: hidden;
border-bottom: 1px solid #ebeef2;
}
.news-detail-hero::before {
content: "";
position: absolute;
top: -180px; right: -120px;
width: 420px; height: 420px;
background: radial-gradient(circle, rgba(9, 106, 61, 0.06) 0%, transparent 70%);
border-radius: 50%;
pointer-events: none;
}
/* hero-inner 跟下方 .news-detail-article 左对齐：cont1400 默认 1400 宽 + 60px padding-left，
标题首字与正文首字垂直对齐（.news-detail-article padding:56px 60px） */
.news-detail-hero-inner {
position: relative;
z-index: 1;
max-width: none !important;
padding-left: 60px !important;
padding-right: 60px !important;
box-sizing: border-box !important;
}
@media screen and (max-width: 768px) {
.news-detail-hero-inner { padding-left: 20px !important; padding-right: 20px !important; }
}
.news-detail-breadcrumb { font-size: 13px; color: #9aa3b2; margin-bottom: 24px; letter-spacing: 0.02em; }
.news-detail-breadcrumb a { color: #64748b !important; transition: color .2s; }
.news-detail-breadcrumb a:hover { color: #096a3d !important; }
.news-detail-title {
font-size: clamp(18px, 1.8vw, 28px) !important;
font-weight: 700 !important;
color: #0f172a !important;
line-height: 1.35 !important;
margin: 0 0 20px !important;
letter-spacing: -0.005em;
/* 详情页标题必须完整显示——移除原 nowrap+overflow+ellipsis 强制单行 */
white-space: normal !important;
overflow: visible !important;
text-overflow: clip !important;
word-break: break-word !important;
-webkit-line-clamp: unset !important;
display: block !important;
}
.news-detail-meta { display: flex; align-items: center; gap: 20px; font-size: 13px; color: #94a3b8; }
.news-detail-date { display: flex; align-items: center; gap: 6px; }
.news-detail-date svg { opacity: 0.7; color: #94a3b8; }
.news-detail-source { position: relative; padding-left: 20px; }
.news-detail-source::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 12px; background: #cbd5e1; }
/* 详情页 body 背景与文章卡片 —— 提升高级/质感 */
.news-detail-body {
background: #fafbfc;
padding: 40px 0 80px;
}
.news-detail-layout { display: flex; gap: 40px; align-items: flex-start; }
.news-detail-article {
flex: 1; min-width: 0;
background: #ffffff;
border-radius: 6px;
padding: 56px 60px;
border: 1px solid rgba(0,0,0,0.05);
/* 3 层叠加阴影：紧贴轮廓 + 中焦氛围 + 远焦 ambient，呈现"纸张浮起"质感 */
box-shadow:
0 1px 2px rgba(0,0,0,0.025),
0 8px 28px rgba(15,23,42,0.05),
0 24px 64px rgba(15,23,42,0.04);
/* 字体渲染优化：连字、断字、抗锯齿 */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
}
.news-detail-content { max-width: 740px !important; }
/* 上一篇 / 下一篇 + 返回列表 —— 网格对齐，标签固定列宽，标题在右列上下成行 */
.news-detail-nav {
margin-top: 36px;
padding-top: 24px;
border-top: 1px solid #ebeef2;
display: block;
}
/* 双栏卡片：上一篇 | 下一篇 —— 整卡可点 + 丝滑 hover */
.news-detail-nav-links {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 14px;
margin-bottom: 20px;
}
@media (max-width: 640px) {
.news-detail-nav-links { grid-template-columns: 1fr; }
}
.news-detail-nav-item {
display: block !important;
position: relative;
padding: 16px 18px;
background: #fff;
border: 1px solid #ebeef2;
border-radius: 8px;
cursor: pointer;
/* 不要 overflow:hidden —— 否则会把绝对定位在卡片下方的 tooltip 裁掉 */
margin: 0 !important;
font-size: 13px;
color: #096a3d;
transition:
transform .35s cubic-bezier(0.22,0.61,0.36,1),
border-color .3s ease,
box-shadow .35s cubic-bezier(0.22,0.61,0.36,1),
background-color .25s ease;
-webkit-tap-highlight-color: transparent;
will-change: transform;
}
.news-detail-nav-item:hover {
transform: translateY(-2px);
border-color: rgba(9,106,61,0.4);
background: #fbfdfb;
box-shadow:
0 1px 2px rgba(0,0,0,0.02),
0 8px 22px rgba(9,106,61,0.08);
}
.news-detail-nav-item:active {
transform: translateY(-1px) scale(0.997);
transition-duration: .12s;
box-shadow: 0 4px 12px rgba(9,106,61,0.1);
}
/* hover 时右下角浮出箭头（科技感细节） */
.news-detail-nav-item::after {
content: "→";
position: absolute;
right: 18px;
bottom: 14px;
font-size: 16px;
color: #096a3d;
opacity: 0;
transform: translateX(-6px);
transition: opacity .3s, transform .35s cubic-bezier(0.22,0.61,0.36,1);
pointer-events: none;
}
.news-detail-nav-item:hover::after {
opacity: 1;
transform: translateX(0);
}
.news-detail-nav-item a {
color: #1c1e22 !important;
font-size: 14px !important;
font-weight: 500 !important;
line-height: 1.55 !important;
text-decoration: none !important;
display: -webkit-box !important;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
word-break: break-word;
max-width: calc(100% - 24px);
transition: color .25s ease;
}
/* hover 仅变色，不撑大卡片 —— 完整标题改由 tooltip 显示，避免挤压布局 */
.news-detail-nav-item:hover a {
color: #096a3d !important;
}
/* 干掉链接和卡片所有的原生 focus 黑框 + tap-highlight */
.news-detail-nav-item,
.news-detail-nav-item *,
.news-detail-nav-item a {
-webkit-tap-highlight-color: transparent !important;
}
.news-detail-nav-item a:focus,
.news-detail-nav-item a:active,
.news-detail-nav-item a:focus-visible,
.news-detail-nav-item:focus,
.news-detail-nav-item:active,
.news-detail-nav-item:focus-visible {
outline: none !important;
box-shadow: none !important;
}
/* 键盘 a11y：focus-within 时整卡发淡绿光（取代方框） */
.news-detail-nav-item:focus-within {
border-color: rgba(9,106,61,0.5) !important;
box-shadow:
0 0 0 3px rgba(9,106,61,0.08),
0 8px 22px rgba(9,106,61,0.08) !important;
}
/* === 完整标题 tooltip：绝对定位 + dark glass，不撑布局 === */
.news-detail-nav-tooltip {
position: absolute;
top: calc(100% + 10px);
left: 50%;
transform: translateX(-50%) translateY(-6px);
background: rgba(15, 23, 42, 0.94);
color: #fff;
padding: 11px 16px;
border-radius: 8px;
font-size: 13px;
font-weight: 500;
line-height: 1.55;
white-space: normal;
width: max-content;
max-width: min(360px, calc(100vw - 40px));
opacity: 0;
visibility: hidden;
pointer-events: none;
z-index: 30;
box-shadow:
0 4px 12px rgba(0,0,0,0.12),
0 16px 36px rgba(0,0,0,0.18);
-webkit-backdrop-filter: blur(10px) saturate(160%);
backdrop-filter: blur(10px) saturate(160%);
/* 鼠标一进入即开始动画，去掉延迟；保留 0.4s 缓动保持平滑 */
transition:
opacity .4s ease,
transform .45s cubic-bezier(0.22,0.61,0.36,1),
visibility 0s linear .45s;
}
/* 顶部小三角指示器，指向卡片 */
.news-detail-nav-tooltip::before {
content: "";
position: absolute;
top: -6px;
left: 50%;
transform: translateX(-50%);
width: 0; height: 0;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 6px solid rgba(15, 23, 42, 0.94);
}
.news-detail-nav-item:hover .news-detail-nav-tooltip {
opacity: 1;
visibility: visible;
transform: translateX(-50%) translateY(0);
transition:
opacity .4s ease,
transform .45s cubic-bezier(0.22,0.61,0.36,1),
visibility 0s linear 0s;
}
.news-detail-back {
display: inline-flex;
float: right;
padding: 7px 18px !important;
background: transparent !important;
color: #555 !important;
border: 1px solid #d4d8df !important;
border-radius: 4px !important;
font-size: 13px !important;
font-weight: 500 !important;
transition: color .2s, border-color .2s;
}
.news-detail-back:hover {
border-color: #096a3d !important;
color: #096a3d !important;
background: transparent !important;
}
/* 清掉浮动 */
.news-detail-nav::after { content: ""; display: block; clear: both; }
.news-detail-sidebar { width: 280px; flex-shrink: 0; position: sticky; top: 80px; }
.news-detail-sidebar-card { background: #fff; border-radius: 14px; padding: 24px; border: 1px solid #eee; }
/* 侧栏标题：去掉绿色 underline，改为细灰描边 */
.news-detail-sidebar-title { font-size: 15px; font-weight: 600; color: #111; margin: 0 0 16px; padding-bottom: 10px; border-bottom: 1px solid #ebeef2; display: block; }
.news-detail-related { list-style: none; margin: 0; padding: 0; }
.news-detail-related li { padding: 12px 0; border-bottom: 1px solid #f0f0f0; }
.news-detail-related li:last-child { border-bottom: none; }
.news-detail-related li a { display: block; text-decoration: none; }
.news-detail-related li a h4 { font-size: 13.5px; font-weight: 500; color: #333; line-height: 1.55; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.news-detail-related li a:hover h4 { color: #096a3d; }
.news-detail-related li a span { font-size: 12px; color: #bbb; margin-top: 4px; display: block; }
/* 去掉 Related Articles 列表 的默认 focus/active 黑边框 + 移动端 tap 高亮 */
.news-detail-related li a,
.news-detail-related li a:link,
.news-detail-related li a:visited,
.news-detail-related li a:hover,
.news-detail-related li a:focus,
.news-detail-related li a:active,
.news-detail-related li a:focus-visible {
outline: none !important;
outline-offset: 0 !important;
box-shadow: none !important;
border: none !important;
-webkit-tap-highlight-color: transparent !important;
-webkit-touch-callout: none !important;
}
/* 键盘 Tab 聚焦时给标题加柔和绿色提示，鼠标用户无感 */
.news-detail-related li a:focus-visible h4 {
color: #096a3d !important;
background: linear-gradient(90deg, rgba(9,106,61,0.06), transparent) !important;
padding-left: 4px !important;
margin-left: -4px !important;
border-radius: 4px !important;
}
.page-news-detail .ny-xwxq,
.page-news-detail .ny-xwnr { display: none !important; }
@media screen and (max-width:768px) {
.news-detail-hero { padding: 100px 0 40px; }
.news-detail-title { font-size: 24px !important; }
.news-detail-layout { flex-direction: column; }
.news-detail-sidebar { width: 100%; position: static; }
.news-detail-article { padding: 28px 22px; }
/* 正文移动端：紧凑但仍可读 */
.news-detail-content,
.news-detail-content p,
.news-detail-content span,
.news-detail-content div,
.news-detail-content li {
font-size: 15.5px !important;
line-height: 1.75 !important;
}
.news-detail-content > p:first-child { font-size: 16.5px !important; line-height: 1.7 !important; }
.news-detail-content h1 { font-size: 21px !important; }
.news-detail-content h2 { font-size: 18px !important; }
.news-detail-content h3 { font-size: 16px !important; }
.news-detail-content blockquote p { font-size: 15.5px !important; }
}
/* ============== 新闻详情正文 — 长文阅读，字号克制不压人 ============== */
/* --- 正文基础：16.5px / 行距 1.78 / 深炭灰 / 列宽 720 ——
长段不显笨重，单大段也能透气 --- */
.news-detail-content {
font-family: 'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Arial, sans-serif !important;
font-size: 16.5px !important;
line-height: 1.78 !important;
color: #1f2937 !important;
max-width: 720px !important;
letter-spacing: 0.005em !important;
font-style: normal !important;
font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "ss01" 1 !important;
text-rendering: optimizeLegibility !important;
-webkit-font-smoothing: antialiased !important;
-moz-osx-font-smoothing: grayscale !important;
}
.news-detail-content p,
.news-detail-content span,
.news-detail-content div,
.news-detail-content li,
.news-detail-content td,
.news-detail-content section {
font-family: inherit !important;
font-size: 16.5px !important;
line-height: 1.78 !important;
color: #1f2937 !important;
font-style: normal !important;
font-weight: 400 !important;
}
.news-detail-content p {
margin: 0 0 1.3em !important;
text-align: left !important;
hanging-punctuation: first last !important;
hyphens: auto !important;
overflow-wrap: anywhere !important;
}
/* 首段 lead：仅半档大，给"开篇"提示但不脱节 */
.news-detail-content > p:first-child,
.news-detail-content > blockquote:first-child + p {
font-size: 17.5px !important;
line-height: 1.72 !important;
color: #111827 !important;
font-weight: 400 !important;
letter-spacing: 0 !important;
margin-bottom: 1.2em !important;
}
/* --- 标题层级（缩到更克制的字号）--- */
.news-detail-content h1 {
font-size: 24px !important;
font-weight: 800 !important;
color: #0f172a !important;
line-height: 1.3 !important;
letter-spacing: -0.008em !important;
margin: 1.8em 0 0.55em !important;
}
.news-detail-content h2 {
font-size: 20px !important;
font-weight: 750 !important;
color: #0f172a !important;
line-height: 1.35 !important;
letter-spacing: -0.005em !important;
margin: 1.6em 0 0.5em !important;
}
.news-detail-content h3 {
font-size: 17px !important;
font-weight: 700 !important;
color: #111827 !important;
line-height: 1.45 !important;
letter-spacing: 0 !important;
margin: 1.6em 0 0.95em !important;
}
.news-detail-content h4,
.news-detail-content h5,
.news-detail-content h6 {
font-size: 15.5px !important;
font-weight: 700 !important;
color: #111827 !important;
line-height: 1.5 !important;
letter-spacing: 0 !important;
margin: 1.3em 0 0.4em !important;
text-transform: none !important;
}
/* 首个标题：相邻段落前的标题不要太大 top margin */
.news-detail-content > h1:first-child,
.news-detail-content > h2:first-child,
.news-detail-content > h3:first-child { margin-top: 0 !important; }
/* --- 加粗：字重 + 深色，但比标题克制 --- */
.news-detail-content strong,
.news-detail-content b {
font-weight: 650 !important;
color: #0f172a !important;
}
/* --- 引用块：跟普通段落完全一致，没有左侧绿条、没有背景 --- */
.news-detail-content blockquote {
border: none !important;
border-left: none !important;
padding: 0 !important;
margin: 0 0 1.25em !important;
background: none !important;
border-radius: 0 !important;
}
.news-detail-content blockquote p,
.news-detail-content blockquote * {
font-style: normal !important;
color: #1f2937 !important;
font-size: 16.5px !important;
line-height: 1.78 !important;
text-align: left !important;
font-weight: 400 !important;
}
.news-detail-content blockquote p { margin: 0 0 1.3em !important; }
.news-detail-content blockquote p:last-child { margin-bottom: 0 !important; }
/* --- 分隔线：简单细线，不要花字 --- */
.news-detail-content hr {
border: none !important;
height: 1px !important;
background: #e5e7eb !important;
margin: 24px 0 !important;
}
.news-detail-content hr::after { content: none !important; }
/* --- 链接 --- */
.news-detail-content a {
color: #096a3d !important;
text-decoration: underline !important;
text-decoration-color: rgba(9,106,61,0.35) !important;
text-underline-offset: 2px;
border-bottom: none !important;
padding-bottom: 0;
}
.news-detail-content a:hover {
color: #07572f !important;
text-decoration-color: #07572f !important;
}
/* --- 图片 --- */
.news-detail-content img {
max-width: 100% !important;
height: auto !important;
border-radius: 4px !important;
margin: 18px auto !important;
display: block !important;
box-shadow: none !important;
}
/* --- 宽图（图表类）---
策略：默认 85% 宽度居中显示；
细分：efficacy 图表（带 链接）稍微缩小到 78%；
mechanism 花瓣图（无 ）放大到 95%；
移动端恢复 100% */
.news-detail-content .news-figure-wide {
width: 85% !important;
max-width: 85% !important;
margin: 32px auto !important;
padding: 0 !important;
background: transparent !important;
border: none !important;
text-align: center !important;
}
/* 含可点击放大链接的图（efficacy 图表）——与正文左右对齐 */
.news-detail-content .news-figure-wide:has(a) {
width: 100% !important;
max-width: 100% !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
/* 不带链接的图（mechanism 花瓣图）——稍微收一点，且去掉白底/阴影/圆角 */
.news-detail-content .news-figure-wide:not(:has(a)) {
width: 88% !important;
max-width: 88% !important;
margin-left: auto !important;
margin-right: auto !important;
background: transparent !important;
border: none !important;
box-shadow: none !important;
}
.news-detail-content .news-figure-wide:not(:has(a)) img {
box-shadow: none !important;
border-radius: 0 !important;
background: transparent !important;
}
@media (max-width: 767px) {
.news-detail-content .news-figure-wide,
.news-detail-content .news-figure-wide:has(a),
.news-detail-content .news-figure-wide:not(:has(a)) {
width: 100% !important;
max-width: 100% !important;
margin: 24px 0 !important;
}
}
.news-detail-content .news-figure-wide a {
display: block !important;
cursor: zoom-in !important;
text-decoration: none !important;
border: none !important;
border-bottom: none !important;
color: inherit !important;
}
.news-detail-content .news-figure-wide img {
width: 100% !important;
max-width: 100% !important;
height: auto !important;
display: block !important;
margin: 0 auto !important;
border-radius: 6px !important;
box-shadow: 0 4px 18px rgba(15,23,42,0.08), 0 1px 3px rgba(15,23,42,0.05) !important;
transition: transform 0.35s cubic-bezier(0.22,0.61,0.36,1),
box-shadow 0.35s cubic-bezier(0.22,0.61,0.36,1) !important;
}
.news-detail-content .news-figure-wide a:hover img {
transform: translateY(-2px) !important;
box-shadow: 0 12px 32px rgba(15,23,42,0.14), 0 2px 6px rgba(15,23,42,0.08) !important;
}
.news-detail-content .news-figure-wide figcaption {
font-size: 12px !important;
color: #6b7280 !important;
font-style: italic !important;
margin: 10px 4px 0 0 !important;
text-align: right !important;
letter-spacing: 0.01em !important;
line-height: 1.5 !important;
}
.news-detail-content .news-figure-wide .news-figure-hint {
display: inline-block;
font-size: 11px !important;
font-style: normal !important;
color: #9aa3af !important;
margin-right: 10px !important;
letter-spacing: 0.02em !important;
}
/* --- 列表：与正文同字号同行距，绿色微项目符 --- */
.news-detail-content ul,
.news-detail-content ol {
padding-left: 28px !important;
margin: 1em 0 1.25em !important;
}
.news-detail-content li {
margin-bottom: 0.4em !important;
line-height: 1.78 !important;
color: #1f2937 !important;
font-size: 16.5px !important;
padding-left: 4px !important;
}
.news-detail-content ul li::marker { color: #096a3d !important; }
.news-detail-content ol li::marker { color: #096a3d !important; font-weight: 600 !important; }
/* --- 表格：克制描边 + 略大字号 --- */
.news-detail-content table {
width: 100%;
border-collapse: collapse;
margin: 1.4em 0;
font-size: 16px;
}
.news-detail-content table th {
background: #f6f7f9 !important;
color: #0f172a !important;
font-weight: 650 !important;
padding: 12px 16px;
font-size: 15.5px;
border-bottom: 2px solid #096a3d !important;
text-align: left;
letter-spacing: 0.01em;
}
.news-detail-content table td {
padding: 12px 16px;
font-size: 16px;
border-bottom: 1px solid #eef0f3 !important;
color: #2a3441;
line-height: 1.65;
}
/* --- 文章内 section --- */
.news-detail-content section { margin: 12px 0; }
/* --- 文末 END：去绿色短条，仅留中性灰文字 --- */
.news-detail-end { text-align: center !important; padding: 36px 0 4px !important; }
.news-detail-end::before { content: none !important; }
.news-detail-end span { font-size: 12px !important; color: #bbb !important; letter-spacing: 0.3em !important; text-transform: uppercase; }
/* --- 上下篇 label：放在标题上方的小绿大写字标签（卡片式样） --- */
.news-detail-nav-label {
display: block !important;
font-size: 11px !important;
color: #096a3d !important;
background: none !important;
padding: 0 !important;
border-radius: 0 !important;
margin: 0 0 6px !important;
font-weight: 700 !important;
white-space: nowrap;
letter-spacing: 0.12em;
text-transform: uppercase;
}
/* --- 侧边栏卡片：去掉顶部绿色短条 --- */
.news-detail-sidebar-card { position: relative; }
.news-detail-sidebar-card::before { content: none !important; }
/* ============== 新闻列表页去空白 ============== */
.ny-xw-lb { margin-top: 0 !important; }
.ny-xwindex-bt { padding: 0 !important; }
.ny-xwindex-f { padding: 14px 0 !important; }
.in-news { padding: 10px 0 40px !important; }
.in-news .notice { margin-top: 0 !important; }
.in-news .notice .tab-bd .tab-pal ul { margin-top: 0 !important; }
/* ============== 研发管线页卡片 ============== */
.pipeline-list-section { padding: 48px 0 72px; background: #f7f8fa; }
.pipeline-card { margin-bottom: 20px; }
.pipeline-card-inner {
display: flex; align-items: center; justify-content: space-between;
padding: 20px 36px 32px; background: #fff;
border: 1px solid rgba(0,0,0,0.05); border-left: 4px solid #096a3d;
border-radius: 14px; text-decoration: none !important;
transition:
transform .45s cubic-bezier(0.22,0.61,0.36,1),
box-shadow .45s cubic-bezier(0.22,0.61,0.36,1),
border-left-color .3s ease;
position: relative; overflow: hidden;
box-shadow: 0 1px 2px rgba(0,0,0,0.02), 0 1px 8px rgba(0,0,0,0.02);
outline: none !important;
-webkit-tap-highlight-color: transparent !important;
will-change: transform;
}
.pipeline-card-inner::after {
content: ""; position: absolute; top: 0; left: -100%;
width: 60%; height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.5), transparent);
transition: left 0.7s cubic-bezier(0.22,0.61,0.36,1); pointer-events: none;
}
.pipeline-card-inner:hover::after { left: 120%; }
.pipeline-card-inner:hover {
transform: translateY(-3px);
border-left-color: #34d399 !important;
box-shadow:
0 1px 2px rgba(0,0,0,0.02),
0 14px 36px rgba(9,106,61,0.12),
0 4px 12px rgba(0,0,0,0.04);
}
.pipeline-card-inner:active {
transform: translateY(-1px) scale(0.997);
box-shadow:
0 1px 2px rgba(0,0,0,0.03),
0 6px 18px rgba(9,106,61,0.14);
transition-duration: .14s;
}
.pipeline-card-inner:focus,
.pipeline-card-inner:focus-visible {
outline: none !important;
}
.pipeline-card-inner:focus-visible {
border-color: rgba(9,106,61,0.4) !important;
box-shadow:
0 0 0 3px rgba(9,106,61,0.08),
0 10px 28px rgba(9,106,61,0.1);
}
.pipeline-card-left { flex: 1; min-width: 0; }
.pipeline-card-badges { display: flex; gap: 8px; margin-bottom: 10px; margin-left: 0; flex-wrap: wrap; }
.pipeline-badge { display: inline-block; padding: 4px 12px; border-radius: 20px; font-size: 12px; font-weight: 600; }
.pipeline-badge-green { background: linear-gradient(135deg, #ecfdf5, #d1fae5); color: #065f46; border: 1px solid #a7f3d0; }
.pipeline-card-name { font-size: 22px; font-weight: 700; color: #111; margin: 0 0 8px; transition: color 0.25s; }
.pipeline-card-inner:hover .pipeline-card-name { color: #096a3d; }
.pipeline-card-desc { font-size: 14.5px; line-height: 1.6; color: #475569; margin: 0; max-width: 600px; }
.pipeline-card-right { margin-left: 40px; flex-shrink: 0; }
.pipeline-card-btn {
padding: 10px 28px; border: 1.5px solid #d1d5db; border-radius: 24px;
color: #555; font-size: 13px; font-weight: 500; white-space: nowrap;
transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
background: transparent;
}
.pipeline-card-inner:hover .pipeline-card-btn {
border-color: #096a3d; color: #fff; background: #096a3d;
}
@media screen and (max-width:768px) {
.pipeline-card-inner { flex-direction: column; align-items: flex-start; padding: 20px; }
.pipeline-card-right { margin-left: 0; margin-top: 16px; width: 100%; }
.pipeline-card-btn { display: block; text-align: center; }
}
/* ============== 文章类型标签 ============== */
.article-type-tag { display: inline-block; padding: 4px 14px; border-radius: 4px; font-size: 12px; font-weight: 600; letter-spacing: 0.05em; margin-bottom: 24px; }
.article-tag-letter { background: #fef3c7; color: #92400e; }
.article-tag-interview { background: #dbeafe; color: #1e40af; }
.article-tag-speech { background: #ede9fe; color: #5b21b6; }
.article-tag-award { background: #fce7f3; color: #9d174d; }
.article-tag-alliance { background: #d1fae5; color: #065f46; }
.article-tag-clinical { background: #e0f2fe; color: #0369a1; }
.article-tag-milestone { background: #f0fdf4; color: #096a3d; }
.article-tag-funding { background: #fef9c3; color: #854d0e; }
.article-tag-brief { background: #f3f4f6; color: #374151; }
.article-clinical .clinical-summary { background: #f0f9ff; border: 1px solid #bae6fd; border-radius: 10px; padding: 16px 22px; margin-bottom: 20px; }
.article-clinical .clinical-summary p { margin: 0 !important; color: #0369a1 !important; font-weight: 500; }
.article-milestone .milestone-highlight { background: linear-gradient(135deg, #f0fdf4, #ecfdf5); border: 1px solid #bbf7d0; border-radius: 10px; padding: 16px 22px; margin-bottom: 20px; }
.article-milestone .milestone-highlight p { margin: 0 !important; color: #065f46 !important; font-weight: 500; }
.article-funding .funding-highlight { background: linear-gradient(135deg, #fefce8, #fef9c3); border: 1px solid #fde68a; border-radius: 10px; padding: 16px 22px; margin-bottom: 20px; }
.article-funding .funding-highlight p { margin: 0 !important; color: #854d0e !important; font-weight: 500; }
.article-interview .qa-number { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(135deg, #096a3d, #34d399); color: #fff; font-size: 16px; font-weight: 700; margin: 28px 0 12px; }
.article-interview .qa-question { background: #f0fdf4; border-left: 3px solid #096a3d; padding: 14px 20px; border-radius: 0 10px 10px 0; margin: 8px 0 16px; font-size: 15px; line-height: 1.7; color: #1a472a; }
.article-interview .qa-speaker { display: inline-block; background: #096a3d; color: #fff; padding: 4px 16px; border-radius: 4px; font-size: 13px; font-weight: 600; margin: 8px 0 12px; }
.article-award .award-highlight { background: linear-gradient(135deg, #fdf2f8, #fce7f3); border: 1px solid #fbcfe8; border-radius: 12px; padding: 20px 24px; margin-bottom: 24px; }
.article-letter .letter-signature { text-align: right !important; font-weight: 600 !important; color: #333 !important; margin-top: 36px !important; font-size: 16px !important; }
.article-letter .letter-date { text-align: right !important; color: #999 !important; font-size: 14px !important; }
/* Footer social icons */
.foot-ewm .dropdown1 span::before {
content: "";
display: block;
width: 100%;
height: 100%;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.5)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z'/%3E%3Cpolyline points='22,6 12,13 2,6'/%3E%3C/svg%3E");
background-size: 16px;
background-position: center;
background-repeat: no-repeat;
}
.foot-ewm .dropdown2 span::before {
content: "";
display: block;
width: 100%;
height: 100%;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.5)' stroke-width='1.5'%3E%3Cpath d='M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z'/%3E%3C/svg%3E");
background-size: 16px;
background-position: center;
background-repeat: no-repeat;
}
.foot-ewm .dropdown3 span::before {
content: "";
display: block;
width: 100%;
height: 100%;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.5)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
background-size: 16px;
background-position: center;
background-repeat: no-repeat;
}
/* News section "查看全部" link */
.idx-news-view-all {
text-align: center;
margin-top: 36px;
}
.idx-news-view-all a {
display: inline-block;
padding: 10px 36px;
border: 1.5px solid rgba(9,106,61,0.25);
color: #555 !important;
border-radius: 24px;
font-size: 14px;
font-weight: 500;
letter-spacing: 0.05em;
transition: all 0.3s;
}
.idx-news-view-all a:hover {
border-color: #096a3d;
color: #096a3d !important;
background: rgba(9,106,61,0.05);
}
/* News card glow on hover */
.idx-news-card-inner:hover .idx-news-card-bar {
box-shadow: 0 0 12px rgba(9,106,61,0.2);
}
.idx-news-card-inner:hover .idx-news-card-title {
color: #096a3d !important;
}
/* Footer social icon hover */
.foot-ewm .dropdown span {
transition: all 0.3s ease !important;
border: 1px solid rgba(255,255,255,0.08) !important;
}
.foot-ewm .dropdown span:hover {
background: rgba(52,211,153,0.15) !important;
border-color: rgba(52,211,153,0.3) !important;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}
.footer::before {
content: "";
position: absolute;
inset: 0;
background: rgba(0,0,0,0.45);
pointer-events: none;
z-index: 0;
}
/* News section title accent */
.idx-news .idx-section-title::after {
background: linear-gradient(90deg, #096a3d, #34d399) !important;
}
/* ============== 手机竖屏全面适配 ============== */
@media screen and (max-width:768px) {
/* --- 手机端导航栏固定定位，防止返回首页时logo与标题重叠 --- */
.sp_header {
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
background: linear-gradient(180deg, rgba(10,14,23,0.7) 0%, transparent 100%) !important;
z-index: 99999 !important;
}
/* --- Hero 区域 --- */
.idx-hero { min-height: 70vh !important; display: flex !important; align-items: center !important; }
.idx-hero-content { padding: 100px 20px 40px !important; }
.idx-hero-text { max-width: 100% !important; }
.idx-hero-text h1 { font-size: 26px !important; line-height: 1.3 !important; }
.idx-hero-text h2 { font-size: 15px !important; white-space: normal !important; margin-bottom: 24px !important; }
.idx-hero-btns {
flex-direction: row !important;
gap: 12px !important;
justify-content: center !important;
}
.idx-btn-primary,
.idx-btn-outline {
padding: 12px 24px !important;
font-size: 14px !important;
white-space: nowrap !important;
}
.idx-hero-img { width: 220px !important; margin-top: 20px !important; }
.idx-hero-overlay { background: rgba(10,14,23,0.65) !important; }
/* --- 统计数字 --- */
.idx-stats { padding: 40px 0 !important; }
.idx-stats-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 16px !important; }
.idx-stat-num { font-size: 28px !important; }
.idx-stat-label { font-size: 13px !important; }
/* --- 管线表格：允许横向滑动查看 --- */
.idx-pipeline { padding: 40px 0 !important; }
.idx-pipeline .cont1400 { padding: 0 12px !important; }
.idx-pipeline .cont1400 > .wow { overflow-x: auto !important; -webkit-overflow-scrolling: touch; border-radius: 8px !important; }
.idx-pipeline table { min-width: 600px; }
.idx-pipeline table th,
.idx-pipeline table td { padding: 10px 8px !important; font-size: 12px !important; }
.idx-pipeline .idx-section-title { font-size: 22px !important; }
/* --- 首页新闻资讯 --- */
.idx-news { padding: 40px 0 !important; }
.idx-news-cards { grid-template-columns: 1fr !important; gap: 16px !important; }
.idx-news-card-body { padding: 20px !important; }
.idx-news-card-title { font-size: 15px !important; }
.idx-news-card-desc { font-size: 13px !important; margin-bottom: 12px !important; }
.idx-news-view-all { margin-top: 20px !important; }
.idx-news-view-all a { font-size: 13px !important; padding: 8px 28px !important; }
/* --- 新闻列表页 --- */
.ny-xwindex { padding: 90px 0 40px !important; }
.ny-xwindex .swiper .swiper-slide .ny-xw-tj { padding: 16px !important; }
.ny-xwindex .swiper .swiper-slide .ny-xw-tj h3 { font-size: 16px !important; line-height: 1.5 !important; }
.ny-xwindex .swiper .swiper-slide .ny-xw-tj span { margin-top: 20px !important; padding-top: 12px !important; }
.ny-xwindex-f { padding: 16px 0 !important; }
.ny-xwindex-f .ny-xwindex-l ul li { margin-right: 16px !important; }
.ny-xwindex-f .ny-xwindex-l ul li a { font-size: 14px !important; }
.ny-xwindex-f .ny-xwindex-r form { height: 44px !important; line-height: 44px !important; }
.in-news .notice { margin-top: 20px !important; }
.in-news .notice .tab-pal ul li { padding: 16px !important; margin-bottom: 10px !important; }
.in-news .notice .in-news-div { flex-direction: column !important; }
.in-news .notice .in-news-div .in-news-time {
width: 100% !important;
text-align: left !important;
display: flex !important;
align-items: baseline !important;
gap: 8px !important;
margin-bottom: 8px !important;
}
.in-news .notice .in-news-div .in-news-time p {
font-size: 18px !important;
margin-bottom: 0 !important;
display: inline !important;
}
.in-news .notice .in-news-div .in-news-time span {
display: inline !important;
font-size: 13px !important;
}
.in-news .notice .in-news-div .in-news-text {
width: 100% !important;
padding-left: 0 !important;
border-left: none !important;
}
.in-news .notice .in-news-div .in-news-text h3 {
font-size: 15px !important;
margin: 0 0 6px !important;
}
.in-news .notice .in-news-div .in-news-text p {
font-size: 13px !important;
margin-bottom: 8px !important;
}
.in-news .notice .tab-hd { flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; }
.in-news .notice .tab-hd .tab-hd-h2 h2 { font-size: 22px !important; }
.in-news .notice .tab-hd .tab-nav li { font-size: 14px !important; margin-left: 0 !important; margin-right: 16px !important; }
/* --- 新闻详情页 --- */
.news-detail-hero { padding: 90px 16px 30px !important; }
.news-detail-title { font-size: 22px !important; line-height: 1.4 !important; }
.news-detail-meta { font-size: 13px !important; }
.news-detail-body { padding: 20px 0 !important; }
.news-detail-layout { flex-direction: column !important; gap: 20px !important; }
.news-detail-article { padding: 24px 16px !important; border-radius: 12px !important; }
.news-detail-content { font-size: 16px !important; line-height: 1.72 !important; }
.news-detail-content > p:first-child { font-size: 17px !important; }
.news-detail-content h3 { font-size: 18px !important; margin: 32px 0 10px !important; }
.news-detail-content h4 { font-size: 16px !important; margin: 24px 0 8px !important; }
.news-detail-content blockquote { margin: 24px 0 !important; padding: 2px 0 2px 18px !important; }
.news-detail-sidebar { width: 100% !important; position: static !important; }
.news-detail-sidebar-card { padding: 16px !important; }
.news-detail-nav { flex-direction: column !important; gap: 10px !important; }
.news-detail-nav a { font-size: 13px !important; }
/* --- 团队弹窗 手机端尺寸（比上一版宽 ~17%，更舒适）---
左右各留 50px 暗背景边距（vs 上版 70px）；375 iPhone 上模态从 235 → 275px。 */
.md-modal {
width: calc(100vw - 100px) !important;
max-width: calc(100vw - 100px) !important;
min-width: 260px !important;
max-height: 88vh !important;
border-radius: 12px !important;
}
.md-modal .ny-tdjs-fff {
border-radius: 12px !important;
}
/* （关闭按钮通用规则已移到 media query 之外，见下方上层规则） */
.ny-tdjs-zk-c {
flex-direction: column !important;
padding: 16px !important;
align-items: center !important;
}
.ny-tdjs-zk-c .ny-tdjs-zk-l {
width: 40% !important;
margin-bottom: 12px !important;
}
.ny-tdjs-zk-c .ny-tdjs-zk-r {
width: 100% !important;
}
.ny-tdjs-zk-c .ny-tdjs-zk-r .ny-tdjs-zk-bt {
flex-direction: column !important;
align-items: flex-start !important;
gap: 8px !important;
margin-bottom: 16px !important;
}
.ny-tdjs-zk-c .ny-tdjs-zk-r .ny-tdjs-zk-bt h3 {
font-size: 22px !important;
}
.ny-tdjs-zk-c .ny-tdjs-zk-r .ny-tdjs-zk-bt span,
.founder-badge {
font-size: 12px !important;
}
.ny-tdjs-zk-c .ny-tdjs-zk-nr p {
font-size: 14px !important;
line-height: 1.8 !important;
}
.ny-tdjs-zk-gb {
top: 10px !important;
right: 10px !important;
z-index: 10 !important;
}
/* --- 公司荣誉/团队 Swiper --- */
.ny-ry { margin-bottom: 40px !important; }
.ny-ry .swiper-slide figure { height: 150px !important; }
.ny-ry .swiper-slide p { font-size: 12px !important; padding: 6px 0 0 !important; }
.ny-ry .swiper-button-next,
.ny-ry .swiper-button-prev { display: none !important; }
.ny-ry .swiper-pagination { position: relative !important; margin-top: 10px !important; }
/* --- 大事记/里程碑 --- */
body.page-about .milestone-row {
flex-direction: column !important;
gap: 12px !important;
}
body.page-about .milestone-row > .col-sm-6 {
flex: 1 1 100% !important;
width: 100% !important;
max-width: 100% !important;
}
body.page-about .milestone-row > .col-sm-6:last-child .milestone-card {
height: auto !important;
min-height: auto !important;
max-height: 400px !important;
overflow-y: auto !important;
}
body.page-about .milestone-card { padding: 14px 16px !important; }
body.page-about .milestone-item { gap: 8px !important; }
body.page-about .milestone-date { min-width: 70px !important; font-size: 12px !important; }
body.page-about .milestone-text { font-size: 13px !important; }
/* --- 内页：导航栏 absolute 后防止内容被遮 --- */
.ny-banner { margin-top: 0 !important; }
.ny-xwindex { padding-top: 90px !important; }
/* --- 内页Banner --- */
.ny-banner { height: 50vh !important; min-height: 280px !important; }
.ny-banner h2 { font-size: 26px !important; }
.ny-banner p { font-size: 15px !important; }
/* --- 产品详情页 --- */
.yf-detail-hero { padding: 100px 0 40px !important; }
.yf-detail-title { font-size: 28px !important; }
.yf-detail-badge { font-size: 12px !important; padding: 4px 14px !important; }
.yf-detail-body { padding: 30px 0 40px !important; }
.yf-detail-content { padding: 24px 20px !important; border-radius: 12px !important; }
.yf-detail-content h2 { font-size: 19px !important; }
.yf-detail-content h3 { font-size: 16px !important; }
.yf-xq { margin-top: 0 !important; padding: 30px 0 !important; }
/* --- 关于我们页 --- */
body.page-about .ny-about { display: block !important; }
body.page-about .ny-about-l,
body.page-about .ny-about-r { width: 100% !important; }
body.page-about .ny-tdjs-bj { padding: 20px 0 !important; }
body.page-about .ny-tdjs-bj .swiper-slide { width: 140px !important; }
/* --- 页脚（竖屏 ≤640px 切 2×2 网格，2 行） --- */
.footer { padding: 14px 0 0 !important; }
.foot-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; column-gap: 16px !important; row-gap: 18px !important; padding-bottom: 14px !important; }
/* 取消横屏阶段定义的 flex 比例，让 grid 接管列宽 */
.foot-col-brand,
.foot-col:nth-child(2),
.foot-col:nth-child(3),
.foot-col:nth-child(4) { flex: initial !important; width: auto !important; }
.foot-logo-icon { height: 26px !important; }
.foot-logo-text { height: 24px !important; }
.foot-slogan { font-size: 10.5px !important; line-height: 1.55 !important; max-width: 100% !important; }
.foot-col-title { font-size: 13px !important; margin-bottom: 10px !important; }
.foot-link { font-size: 12px !important; margin-bottom: 8px !important; }
.foot-contact { font-size: 11px !important; margin-bottom: 6px !important; line-height: 1.4 !important; }
.foot-ewm .dropdown span { width: 30px !important; height: 30px !important; }
/* 版权栏：手机端强制单行，字号随视口宽度自适应缩，挤下所有合规文字 */
.foot-bq {
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
gap: 0 6px !important;
padding: 6px 4px 10px !important;
font-size: clamp(7px, 2.1vw, 10px) !important;
line-height: 1.3 !important;
opacity: 0.7 !important;
letter-spacing: -0.015em !important;
white-space: nowrap !important;
overflow: hidden !important;
}
.foot-bq p {
margin: 0 !important;
font-size: inherit !important;
color: rgba(255,255,255,0.32) !important;
white-space: nowrap !important;
display: inline-flex !important;
align-items: center !important;
gap: 0 4px !important;
}
.foot-bq a {
font-size: inherit !important;
color: rgba(255,255,255,0.32) !important;
margin: 0 2px !important;
white-space: nowrap !important;
}
/* --- 通用间距收紧 --- */
.cont1400 { padding: 0 16px !important; }
.idx-section-title { font-size: 22px !important; }
.ny-title h2 { font-size: 22px !important; }
/* --- 联系我们地图 --- */
#allmap1 { height: 250px !important; }
/* --- 研发管线内页 --- */
.ny-yf { padding: 20px 0 !important; }
/* --- 招聘页 --- */
.ny-job { padding: 20px 0 !important; }
}
@media screen and (max-width:480px) {
/* 超窄屏进一步优化 */
.idx-hero-text h1 { font-size: 20px !important; }
.idx-hero-text h2 { font-size: 14px !important; }
.idx-hero-btns {
flex-direction: column !important;
align-items: stretch !important;
}
.idx-btn-primary,
.idx-btn-outline {
text-align: center !important;
padding: 14px 20px !important;
}
.idx-stats-grid { grid-template-columns: repeat(2, 1fr) !important; }
.idx-stat-num { font-size: 24px !important; }
.ny-banner { height: 40vh !important; min-height: 240px !important; }
.ny-banner h2 { font-size: 22px !important; }
/* 弹窗：超窄屏照片隐藏 */
.ny-tdjs-zk-c .ny-tdjs-zk-l { display: none !important; }
.ny-tdjs-zk-c .ny-tdjs-zk-r { width: 100% !important; }
/* 产品详情页 */
.yf-detail-hero { padding: 90px 0 30px !important; }
.yf-detail-title { font-size: 24px !important; }
.yf-detail-content { padding: 20px 16px !important; }
}
/* ============================================================
首页 Hero — 装饰波浪 + 橙色 Slogan 叠加版（2026-05-20）
- 隐藏 .idx-hero-wave 装饰元素（保留 DOM 兼容性）
- 将绿色波浪图作为 .idx-slide-slogan 自身的背景，保证文字背景一定是绿色条带
- 内容（球体 + HY MEDICINE）整体上移，远离 slogan
============================================================ */
.idx-hero.idx-hero-slide {
position: relative;
/* 顶部留出导航空间，底部留出 slogan 条带空间 —— 内容在二者之间真正居中 */
padding: 130px 0 clamp(110px, 14vh, 160px) 0 !important;
justify-content: center !important;
overflow: hidden;
}
.idx-hero-slide .idx-hero-content {
position: relative;
z-index: 3;
/* 内容在 (nav, slogan) 之间垂直居中，slogan 用绝对定位覆盖在 padding-bottom 上 */
margin: 0 auto !important;
padding: 0 !important;
/* 视觉重心上移 ~5vh：让球体顶部与 nav 底部之间的留白和 HY MEDICINE 与 slogan 之间的留白更对称 */
transform: translateY(-5vh);
}
/* 球体收一点 + 标题字号上限收一点（更轻盈、更精致） */
.idx-hero-slide .idx-slide-logo {
width: clamp(96px, 8.4vw, 148px) !important;
margin: 0 auto 16px !important;
}
.idx-hero-slide .idx-slide-title {
font-size: clamp(32px, 3.6vw, 52px) !important;
letter-spacing: 0.18em !important;
}
/* 兼容：旧装饰节点不再使用 */
.idx-hero-wave { display: none !important; }
.idx-hero-slide .idx-slide-title::after { display: none !important; }
.idx-hero-slide .idx-slide-title {
background: linear-gradient(135deg, #0d6b3d 0%, #1f8a4f 55%, #2ea765 100%) !important;
-webkit-background-clip: text !important;
background-clip: text !important;
-webkit-text-fill-color: transparent !important;
letter-spacing: 0.16em !important;
text-shadow: 0 2px 12px rgba(9, 106, 61, 0.08) !important;
}
/* 球体略小、上提一点 */
.idx-hero-slide .idx-slide-logo {
margin: 0 auto 14px !important;
width: clamp(96px, 9vw, 140px) !important;
}
/* Slogan = 自带波浪背景的全宽条带（绝对吃满 hero 底部宽度） */
.idx-hero-slide .idx-slide-slogan {
position: absolute !important;
left: 0;
right: 0;
bottom: 0 !important;
margin: 0 !important;
z-index: 4;
/* 条带高度收窄到参考图比例（约 hero 的 15-18%） */
min-height: clamp(110px, 14vh, 160px);
display: flex !important;
align-items: center !important;
justify-content: center !important;
padding: 24px 24px 24px !important;
box-sizing: border-box;
text-align: center;
font-family: 'Inter', 'Noto Sans SC', -apple-system, sans-serif !important;
font-size: clamp(24px, 3.0vw, 46px) !important;
font-weight: 800 !important;
font-style: normal !important;
letter-spacing: 0.04em !important;
line-height: 1.2 !important;
color: #ffffff !important;
text-shadow:
0 1px 0 rgba(0, 0, 0, 0.28),
0 2px 14px rgba(0, 0, 0, 0.35),
0 0 1px rgba(0, 0, 0, 0.15) !important;
/* 关键：把绿色波浪图直接作为 slogan 的背景 */
background-image: url('/static/images/hero-wave-bottom.png') !important;
background-repeat: no-repeat !important;
background-position: center bottom !important;
background-size: 100% 100% !important;
}
@media (max-width: 1024px) {
.idx-hero-slide .idx-slide-slogan {
min-height: clamp(90px, 12vh, 130px);
font-size: clamp(20px, 3.4vw, 34px) !important;
padding: 20px 20px 20px !important;
}
.idx-hero-slide .idx-slide-logo { width: clamp(90px, 11vw, 128px) !important; }
}
@media (max-width: 640px) {
.idx-hero.idx-hero-slide { padding: 110px 0 0 !important; }
.idx-hero-slide .idx-slide-slogan {
min-height: 80px;
font-size: 18px !important;
letter-spacing: 0.02em !important;
padding: 16px 16px 16px !important;
}
.idx-hero-slide .idx-hero-content { margin-top: 0 !important; }
.idx-hero-slide .idx-slide-logo { width: 86px !important; }
}
/* ============================================================
首页 (is-home) 专属覆盖（2026-05-20 v2）
- 导航：白底 / 绿字 / 不显示左侧 LOGO
- Slogan：浅绿条带 + 大桥背景 + 白字 + 右下 © HY MEDICINE 水印
============================================================ */
/* ---- 1) 首页导航：大桥底图 + 满覆盖绿罩（#2E8845 96%），隐藏 LOGO ---- */
body.is-home .sticky-nav,
body.is-home .sticky-nav:not(.menu_fixed),
body.is-home .sticky-nav.menu_fixed {
background:
linear-gradient(rgba(46, 136, 69, 0.96), rgba(46, 136, 69, 0.96)),
url('/static/images/nav-band-bg.jpg') center center / cover no-repeat !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
border-bottom: 1px solid rgba(255,255,255,0.10) !important;
box-shadow: 0 1px 0 rgba(255,255,255,0.10), 0 10px 32px rgba(0,0,0,0.16) !important;
}
/* 首页 LOGO 隐藏（保留占位） */
body.is-home .sticky-nav .top .logo,
body.is-home .sticky-nav .top .logo a,
body.is-home .sticky-nav .top .logo img { visibility: hidden !important; }
/* 首页菜单字体改为白色（绿色满覆盖罩底） */
body.is-home .nav h3 a,
body.is-home .nav .m h3 a {
color: #ffffff !important;
text-shadow: 0 1px 3px rgba(0,0,0,0.25) !important;
}
body.is-home .nav h3 a:hover,
body.is-home .nav .active a,
body.is-home .nav li.active h3 a,
body.is-home .nav .m.active h3 a {
color: #ffffff !important;
}
/* 悬停下划线改白色发光 */
body.is-home .nav h3 a::after {
background: linear-gradient(90deg, transparent 0%, #ffffff 50%, transparent 100%) !important;
box-shadow: 0 0 12px rgba(255,255,255,0.45) !important;
}
/* 首页右侧语言切换 + 搜索图标改白色 */
body.is-home .lang-globe-icon { color: rgba(255,255,255,0.85) !important; }
body.is-home .lang-globe-btn:hover .lang-globe-icon { color: #ffffff !important; }
body.is-home .lang-option { color: rgba(255,255,255,0.80) !important; }
body.is-home .lang-option:hover,
body.is-home .lang-option-active { color: #ffffff !important; }
body.is-home .lang-sep { color: rgba(255,255,255,0.45) !important; }
body.is-home .top-ss .btn img {
filter: brightness(0) invert(1) !important;
-webkit-filter: brightness(0) invert(1) !important;
opacity: 0.85 !important;
}
body.is-home .top-ss .btn:hover img { opacity: 1 !important; }
/* ---- 2) Hero Slogan：大桥背景 + 品牌绿 #60AF3D @ 62% 不透明覆盖 + 水印 ---- */
.idx-hero-slide .idx-slide-slogan {
/* 品牌绿 #60AF3D (96,175,61)，透明度 38% → alpha 0.62，单色平铺 */
background-image:
linear-gradient(180deg, rgba(96, 175, 61, 0.62) 0%, rgba(96, 175, 61, 0.62) 100%),
url('/static/images/hero-bridge-band.jpg') !important;
background-blend-mode: normal, normal !important;
background-repeat: no-repeat, no-repeat !important;
background-position: center center, center center !important;
background-size: 100% 100%, 100% 100% !important;
/* 顶部清晰白色发丝线作硬边界 */
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.55),
inset 0 -1px 0 rgba(0,0,0,0.20) !important;
border-top: 1px solid rgba(255,255,255,0.90) !important;
position: absolute !important;
-webkit-mask-image: none !important;
mask-image: none !important;
}
/* 右下 © HY MEDICINE 水印 */
.idx-hero-slide .idx-slide-slogan::after {
content: "\00A9 HY MEDICINE";
position: absolute;
right: clamp(16px, 2vw, 36px);
bottom: clamp(8px, 1.4vh, 16px);
font-family: 'Inter', 'Noto Sans SC', -apple-system, sans-serif;
font-size: clamp(10px, 0.85vw, 13px);
font-weight: 600;
font-style: normal;
letter-spacing: 0.14em;
color: rgba(255, 255, 255, 0.88);
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
pointer-events: none;
z-index: 5;
}
/* 移动端水印位置稍微往里收 */
@media (max-width: 640px) {
.idx-hero-slide .idx-slide-slogan::after {
right: 12px;
bottom: 6px;
font-size: 9px;
letter-spacing: 0.10em;
}
}
/* ============================================================
产品详情页内容防御性样式（2026-05-21）
------------------------------------------------------------
修复 .wow.fadeInUp.animated 在 PCMS 渲染 Deubuprenorphine /
Deurotundine 等新建条目时偶发不显示的问题：强制 opacity:1。
.hy-subhead 独立使用（不在 .hy-bullet 容器内）时的样式。
============================================================ */
.yf-detail-content,
.yf-detail-content.wow,
.yf-detail-content.wow.fadeInUp {
visibility: visible !important;
opacity: 1 !important;
transform: none !important;
animation: none !important;
}
/* .hy-subhead 在 .hy-bullet 外单独使用时（HY-2216 slide 5 引导句）
PPT 原文：绿色 加粗，无任何装饰 */
.hy1608-detail > section > p.hy-subhead,
.hy1608-detail .hy-spot-block > p.hy-subhead {
font-size: 16px;
line-height: 1.65;
color: #096a3d;
font-weight: 700;
margin: 32px 0 6px;
padding: 0;
border: none;
background: none;
}
/* 章节内的"引子段落"（slide 4 / slide 10 顶部那段引导文）
PPT 原文：纯文字，绿色加粗，无左侧装饰条 */
.hy-lead-text {
font-size: 15.5px;
line-height: 1.75;
color: #096a3d;
font-weight: 700;
margin: 18px 0 6px;
padding: 0;
border: none;
background: none;
}
/* ============================================================
首页 (is-home) — 导航透明 + 深绿菜单字 + Slogan 高度对齐导航 (2026-05-21)
覆盖前面 line 76-92 / line 4286-4332 的旧规则
============================================================ */
/* 1a) 首页导航 - 顶部时透明（无描边/阴影）
bg-position / bg-size 提前对齐到 menu_fixed 的 -8px / calc(100vw+16px) 100%，
这样从透明切到大桥底图时不会因为这两个值不同而产生平移/缩放动画 */
body.is-home .sticky-nav,
body.is-home .sticky-nav:not(.menu_fixed) {
background-color: transparent !important;
background-image: none !important;
background-size: calc(100vw + 16px) 100% !important;
background-position: -8px 0 !important;
background-repeat: no-repeat !important;
border-bottom: none !important;
box-shadow: none !important;
/* 只动 color/shadow/border，绝不 transition 整个 background 简写 */
transition: background-color 0.5s ease, box-shadow 0.5s ease, border-color 0.5s ease !important;
}
/* 1b) 首页导航 - 下滑后渐变为 Pipeline 风格（绿色大桥底图）
图横向放大 16px、整体左移 8px，与其它内页 nav 统一处理 */
body.is-home .sticky-nav.menu_fixed {
background-color: #3b8066 !important;
background-image: url('/static/images/nav-pipeline-bg.jpg?v=20260522slim') !important;
background-size: calc(100vw + 16px) 100% !important;
background-position: -8px 0 !important;
background-repeat: no-repeat !important;
box-shadow: 0 8px 28px rgba(0, 0, 0, 0.20) !important;
border-bottom: 1px solid rgba(13, 50, 28, 0.50) !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
}
/* 2a) 菜单文字 - 顶部时深品牌绿 + 白色光晕 */
body.is-home .nav h3 a,
body.is-home .nav .m h3 a {
color: #0d5b2a !important;
text-shadow: 0 1px 0 rgba(255,255,255,0.45), 0 0 2px rgba(255,255,255,0.55) !important;
transition: color 0.45s ease, text-shadow 0.45s ease !important;
}
body.is-home .nav h3 a:hover,
body.is-home .nav .active a,
body.is-home .nav li.active h3 a,
body.is-home .nav .m.active h3 a {
color: #0a4d24 !important;
}
body.is-home .nav h3 a::after {
background: linear-gradient(90deg, transparent 0%, #0d5b2a 50%, transparent 100%) !important;
box-shadow: 0 0 8px rgba(13,91,42,0.35) !important;
transition: background 0.45s ease, box-shadow 0.45s ease !important;
}
/* 2b) 菜单文字 - 下滑后白色（Pipeline 配色） */
body.is-home .sticky-nav.menu_fixed .nav h3 a,
body.is-home .sticky-nav.menu_fixed .nav .m h3 a {
color: #ffffff !important;
text-shadow: 0 1px 2px rgba(0,0,0,0.20) !important;
}
body.is-home .sticky-nav.menu_fixed .nav h3 a:hover,
body.is-home .sticky-nav.menu_fixed .nav .active a,
body.is-home .sticky-nav.menu_fixed .nav li.active h3 a,
body.is-home .sticky-nav.menu_fixed .nav .m.active h3 a {
color: #ffffff !important;
}
body.is-home .sticky-nav.menu_fixed .nav h3 a::after {
background: linear-gradient(90deg, transparent 0%, #ffffff 50%, transparent 100%) !important;
box-shadow: 0 0 10px rgba(255,255,255,0.45) !important;
}
/* 3a) 右侧语言切换 + 搜索图标 - 顶部时深绿 */
body.is-home .lang-globe-icon { color: #0d5b2a !important; transition: color 0.45s ease !important; }
body.is-home .lang-globe-btn:hover .lang-globe-icon { color: #0a4d24 !important; }
body.is-home .lang-option { color: #0d5b2a !important; transition: color 0.45s ease !important; }
body.is-home .lang-option:hover,
body.is-home .lang-option-active { color: #0a4d24 !important; }
body.is-home .lang-sep { color: rgba(13,91,42,0.55) !important; transition: color 0.45s ease !important; }
body.is-home .top-ss .btn img {
/* 把搜索图标白底反相后再用 hue-rotate 转成深绿（#0d5b2a） */
filter: brightness(0) saturate(100%) invert(22%) sepia(60%) saturate(620%) hue-rotate(94deg) brightness(95%) contrast(95%) !important;
-webkit-filter: brightness(0) saturate(100%) invert(22%) sepia(60%) saturate(620%) hue-rotate(94deg) brightness(95%) contrast(95%) !important;
opacity: 0.9 !important;
transition: filter 0.45s ease, opacity 0.45s ease !important;
}
body.is-home .top-ss .btn:hover img { opacity: 1 !important; }
/* 3b) 右侧语言切换 + 搜索图标 - 下滑后白色 */
body.is-home .sticky-nav.menu_fixed .lang-globe-icon,
body.is-home .sticky-nav.menu_fixed .lang-option,
body.is-home .sticky-nav.menu_fixed .lang-option:hover,
body.is-home .sticky-nav.menu_fixed .lang-option-active { color: #ffffff !important; }
body.is-home .sticky-nav.menu_fixed .lang-sep { color: rgba(255,255,255,0.45) !important; }
body.is-home .sticky-nav.menu_fixed .top-ss .btn img {
filter: brightness(0) invert(1) !important;
-webkit-filter: brightness(0) invert(1) !important;
opacity: 0.85 !important;
}
body.is-home .sticky-nav.menu_fixed .top-ss .btn:hover img { opacity: 1 !important; }
/* 4) Slogan 条带：Calibri 字体（86px 条带，与导航视觉等高：75 height + 1 border + 10px 下投阴影晕染）*/
html body.is-home .idx-hero.idx-hero-slide .idx-slide-slogan,
html body .idx-hero.idx-hero-slide .idx-slide-slogan,
.idx-hero-slide .idx-slide-slogan {
min-height: 86px !important;
height: 86px !important;
max-height: 86px !important;
padding: 0 24px !important;
/* Calibri 字体栈 —— Calibri (Microsoft) / Carlito (开源同度量替代) / Segoe UI 兜底 */
font-family: 'Calibri', 'Carlito', 'Segoe UI', 'Helvetica Neue', 'Microsoft YaHei', sans-serif !important;
font-style: normal !important;
font-weight: 700 !important;
font-size: clamp(20px, 2.2vw, 34px) !important;
letter-spacing: 0.01em !important;
line-height: 1.1 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
@media (max-width: 1024px) {
html body.is-home .idx-hero.idx-hero-slide .idx-slide-slogan,
html body .idx-hero.idx-hero-slide .idx-slide-slogan,
.idx-hero-slide .idx-slide-slogan {
min-height: 80px !important;
height: 80px !important;
max-height: 80px !important;
font-size: clamp(18px, 2.8vw, 28px) !important;
padding: 0 20px !important;
}
}
@media (max-width: 640px) {
html body.is-home .idx-hero.idx-hero-slide .idx-slide-slogan,
html body .idx-hero.idx-hero-slide .idx-slide-slogan,
.idx-hero-slide .idx-slide-slogan {
min-height: 70px !important;
height: 70px !important;
max-height: 70px !important;
font-size: 18px !important;
padding: 0 14px !important;
}
}
/* 5) 首页中心 LOGO + HY MEDICINE 文字整体居中（取消上移；居中在导航和下方色带中间） */
html body .idx-hero.idx-hero-slide .idx-hero-content .idx-slide {
transform: translateY(0) !important;
}
@media (max-width: 1024px) {
html body .idx-hero.idx-hero-slide .idx-hero-content .idx-slide {
transform: translateY(0) !important;
}
}
@media (max-width: 640px) {
html body .idx-hero.idx-hero-slide .idx-hero-content .idx-slide {
transform: translateY(0) !important;
}
}
/* ============================================================
所有页面（含首页）导航在下拉 (.menu_fixed) 时快速渐变为半透明，
颜色按各自页面主题（不强求统一）
- About / News：淡蓝
- Careers：淡橘红
- Home / Pipeline：淡品牌绿
============================================================ */
.sticky-nav,
.sticky-nav::before {
/* 关键：transition 只能列 background-color，不能写 background 简写，
也不能列 background-image —— 一旦写 background/background-image，
浏览器会把 background-position 和 background-size 也插值，
就会看到底图在 menu_fixed 切换时左右滑/缩放 */
transition: background-color 0.18s ease,
backdrop-filter 0.18s ease, -webkit-backdrop-filter 0.18s ease,
box-shadow 0.18s ease, border-color 0.18s ease,
opacity 0.18s ease, color 0.18s ease !important;
}
/* === 首页：滑动后淡品牌绿半透明 + 文字白色 === */
html body.is-home .sticky-nav.menu_fixed {
background: rgba(96, 175, 61, 0.28) !important;
background-image: none !important;
backdrop-filter: blur(14px) saturate(170%) !important;
-webkit-backdrop-filter: blur(14px) saturate(170%) !important;
box-shadow: 0 4px 16px rgba(0,0,0,0.08) !important;
border-bottom: 1px solid rgba(255,255,255,0.20) !important;
}
html body.is-home .sticky-nav.menu_fixed .nav h3 a,
html body.is-home .sticky-nav.menu_fixed .nav .m h3 a,
html body.is-home .sticky-nav.menu_fixed .nav h3 a:hover,
html body.is-home .sticky-nav.menu_fixed .nav .active a,
html body.is-home .sticky-nav.menu_fixed .nav li.active h3 a,
html body.is-home .sticky-nav.menu_fixed .nav .m.active h3 a {
color: #ffffff !important;
text-shadow: 0 1px 3px rgba(0,0,0,0.25) !important;
}
html body.is-home .sticky-nav.menu_fixed .nav h3 a::after {
background: linear-gradient(90deg, transparent 0%, #ffffff 50%, transparent 100%) !important;
box-shadow: 0 0 10px rgba(255,255,255,0.45) !important;
}
html body.is-home .sticky-nav.menu_fixed .lang-globe-icon,
html body.is-home .sticky-nav.menu_fixed .lang-option,
html body.is-home .sticky-nav.menu_fixed .lang-option-active { color: #ffffff !important; }
html body.is-home .sticky-nav.menu_fixed .lang-sep { color: rgba(255,255,255,0.45) !important; }
html body.is-home .sticky-nav.menu_fixed .top-ss .btn img {
filter: brightness(0) invert(1) !important;
-webkit-filter: brightness(0) invert(1) !important;
opacity: 0.9 !important;
}
/* === About：滑动后淡海雾蓝（呼应金门大桥背景的天空 + 海水） === */
html body.page-about .sticky-nav.menu_fixed {
background: rgba(108, 162, 210, 0.32) !important;
background-image: none !important;
backdrop-filter: blur(14px) saturate(160%) !important;
-webkit-backdrop-filter: blur(14px) saturate(160%) !important;
box-shadow: 0 4px 16px rgba(0,0,0,0.10) !important;
border-bottom: 1px solid rgba(255,255,255,0.14) !important;
}
/* === Pipeline + 产品详情：淡品牌绿半透明（深一档） === */
html body.page-pipeline .sticky-nav.menu_fixed,
html body.page-pipeline.page-yanfa-detail .sticky-nav.menu_fixed {
background: rgba(48, 130, 75, 0.32) !important;
background-image: none !important;
backdrop-filter: blur(14px) saturate(160%) !important;
-webkit-backdrop-filter: blur(14px) saturate(160%) !important;
box-shadow: 0 4px 16px rgba(0,0,0,0.12) !important;
border-bottom: 1px solid rgba(255,255,255,0.12) !important;
}
/* === News + 新闻详情：淡天空蓝（同步其他页面，新闻图淡出由 ::before opacity 控制） === */
html body.page-news .sticky-nav.menu_fixed,
html body.page-news-detail .sticky-nav.menu_fixed {
background: rgba(120, 175, 230, 0.34) !important;
background-image: none !important;
backdrop-filter: blur(14px) saturate(160%) !important;
-webkit-backdrop-filter: blur(14px) saturate(160%) !important;
box-shadow: 0 4px 16px rgba(0,0,0,0.12) !important;
border-bottom: 1px solid rgba(255,255,255,0.14) !important;
}
/* News / News-Detail 的 nav 背景实际放在 ::before 大桥图上，需要随滑动淡出
让上面 background 的淡蓝半透明可以正常显示 */
html body.page-news .sticky-nav.menu_fixed::before,
html body.page-news-detail .sticky-nav.menu_fixed::before {
opacity: 0 !important;
}
/* === Careers：滑动后淡橘红（呼应"橙色大桥"导航底图） === */
html body.page-careers .sticky-nav.menu_fixed {
background: rgba(238, 142, 85, 0.32) !important;
background-image: none !important;
backdrop-filter: blur(14px) saturate(160%) !important;
-webkit-backdrop-filter: blur(14px) saturate(160%) !important;
box-shadow: 0 4px 16px rgba(0,0,0,0.12) !important;
border-bottom: 1px solid rgba(255,255,255,0.14) !important;
}
/* ============================================================
2026-05-22 响应式补丁
- .cont1560：kehu.html 在用但原 CSS 没定义；给个与 .cont1400 一致的居中容器
- 招聘列表 .ny-job-bt / .job-bt：5 列固定 20% 在手机上太挤，竖排成卡片
============================================================ */
.cont1560 { width: 1400px; max-width: calc(100% - 40px); margin: 0 auto; }
@media screen and (max-width: 1400px) { .cont1560 { width: 85%; max-width: 85%; } }
@media screen and (max-width: 768px) { .cont1560 { width: 100%; max-width: 100%; padding: 0 16px; box-sizing: border-box; } }
@media (max-width: 640px) {
/* 隐藏 5 列表头（移动端无法对齐） */
.ny-job-bt { display: none !important; }
/* 每条岗位竖排成卡片 */
.job-zk .job-bt {
flex-direction: column !important;
align-items: flex-start !important;
height: auto !important;
padding: 14px 16px !important;
gap: 4px !important;
}
.job-zk .job-bt span {
width: 100% !important;
padding-left: 0 !important;
line-height: 1.6 !important;
font-size: 13px !important;
}
.job-zk .job-bt span:first-child {
font-size: 16px !important;
font-weight: 600 !important;
color: #096a3d !important;
margin-bottom: 4px !important;
}
.job-zk .job-bt span:last-child {
margin-top: 6px !important;
font-size: 12px !important;
color: #096a3d !important;
align-self: flex-end !important;
width: auto !important;
}
}
/* ============================================================
2026-05-22 PART 2: 横屏导航 + 紧凑布局
- nav.css 切换点已降到 767px，让 iPad 横屏 / iPhone 横屏（≥768px）显示完整桌面导航
- 在 768-1199px 区间内，对 sticky-nav 做收紧，让 5 项菜单 + logo + 语言/搜索能塞下
============================================================ */
/* 兜底硬规则：任何视口宽度 ≥ 768px 都强制显示桌面 nav、隐藏手机汉堡。
即使浏览器还在用旧的 nav.css（断点 1200px），这条规则也能盖过去 */
@media screen and (min-width: 768px) {
html body .sticky-nav { display: block !important; }
html body .sp_header,
html body .sjj_nav { display: none !important; }
}
@media screen and (max-width: 1199px) and (min-width: 768px) {
/* 把两侧固定列从 240px 缩到 170px，左右内边距也收紧 */
.sticky-nav .top {
grid-template-columns: 170px 1fr 170px !important;
}
.sticky-nav .top .logo {
width: 170px !important;
min-width: 170px !important;
max-width: 170px !important;
padding-left: 14px !important;
}
.sticky-nav .top .top-r {
width: 170px !important;
min-width: 170px !important;
max-width: 170px !important;
padding-right: 14px !important;
}
/* logo 图也略缩，避免顶部太挤 */
.sticky-nav .top .logo img,
.sticky-nav.menu_fixed .top .logo img {
height: 42px !important;
max-height: 42px !important;
}
/* 中文版补偿偏移取消（在窄屏下 +18px 会把第 5 项推出去） */
html[lang="zh-CN"] .sticky-nav .top .navBar,
.sticky-nav .top .navBar {
transform: translate(-50%, -50%) !important;
}
/* 菜单字体和间距收紧 */
.sticky-nav .navBar .nav h3 a {
font-size: 14px !important;
padding: 6px 8px !important;
letter-spacing: 0 !important;
}
.sticky-nav .navBar .nav .m {
width: auto !important;
}
/* 搜索按钮也缩小一圈 */
.sticky-nav .top-ss .dropdown .btn {
width: 36px !important;
height: 36px !important;
}
}
/* === [2026-05-22] 标题完整显示（不截断）=== */
/* 仅用于"新闻列表页"和"详情页 sidebar"——首页卡片保持 2 行截断以维持原板块高度 */
.in-news .notice .in-news-div .in-news-text h3,
.news-detail-nav-item a,
.news-detail-related li a h4 {
display: block !important;
-webkit-line-clamp: unset !important;
overflow: visible !important;
white-space: normal !important;
text-overflow: clip !important;
word-break: break-word !important;
max-width: none !important;
}
/* === [2026-05-22] 首页新闻卡片：Read More 对齐到卡片底部（Flexbox 推到底）=== */
.idx-news-cards { align-items: stretch !important; }
.idx-news-card-inner {
display: flex !important;
flex-direction: column !important;
}
.idx-news-card-body {
display: flex !important;
flex-direction: column !important;
flex: 1 1 auto !important;
}
.idx-news-more {
margin-top: auto !important;
}
/* === [2026-05-22] Pipeline 管线图：项目名可点击跳详情页 === */
.hy-cell-project a {
color: inherit !important;
text-decoration: none !important;
cursor: pointer;
transition: color 0.2s ease;
}
.hy-cell-project a:hover {
color: #096a3d !important;
}
/* 去掉点击 / focus 时的方框边框 + 移动端 tap 高亮 */
.hy-cell-project a,
.hy-cell-project a:link,
.hy-cell-project a:visited,
.hy-cell-project a:hover,
.hy-cell-project a:focus,
.hy-cell-project a:active,
.hy-cell-project a:focus-visible {
outline: none !important;
outline-offset: 0 !important;
box-shadow: none !important;
border: none !important;
-webkit-tap-highlight-color: transparent !important;
-webkit-touch-callout: none !important;
}
/* === [2026-05-22] HY-1608 产品详情页：fig-* 系列图缩小到 70%（NRS 图 fig-acute 保留原大小）=== */
.yf-detail-content img[src*="/hy1608/fig-"]:not([src*="fig-acute"]) {
max-width: 70% !important;
height: auto !important;
display: block !important;
margin: 0 auto !important;
}
/* ============================================================
[2026-05-25] 首页 Hero slogan —— 3 段配色滚动
pane-1 绿（首页主色） / pane-2 蓝（新闻资讯导航色） / pane-3 橙（加入我们导航色）
12s 一周期，每段 4s（3.5s 显示 + 0.5s 过渡）。球体不动。
============================================================ */
/* 父容器去掉自带背景，由 pane 自己提供；加 overflow hidden 让滑出的 pane 被裁切 */
html body.is-home .idx-hero.idx-hero-slide .idx-slide-slogan.idx-slide-slogan--rotator,
.idx-hero-slide .idx-slide-slogan.idx-slide-slogan--rotator {
background: none !important;
background-image: none !important;
overflow: hidden !important;
}
/* 三个 pane 叠加铺满容器 */
.idx-slide-slogan--rotator .idx-slogan-pane {
position: absolute;
inset: 0;
display: flex !important;
align-items: center;
justify-content: center;
text-align: center;
color: #ffffff;
text-shadow: 0 1px 8px rgba(0, 0, 0, 0.20);
padding: 0 24px;
box-sizing: border-box;
white-space: nowrap;
overflow: hidden;
opacity: 1;
will-change: transform;
pointer-events: none;
z-index: 1;
font-weight: 700;
letter-spacing: 0.01em;
line-height: 1.15;
}
/* 中英文字体 + 字号（条带 80px，字号缩一档保持视觉协调）*/
.idx-slide-slogan--rotator .lang-en {
font-family: 'Calibri', 'Carlito', 'Segoe UI', 'Helvetica Neue', 'Microsoft YaHei', sans-serif;
font-size: clamp(18px, 2.1vw, 32px);
}
.idx-slide-slogan--rotator .lang-cn {
font-family: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
font-size: clamp(20px, 2.4vw, 34px);
}
/* pane-1 绿色（hero-bridge-band 大桥 + 品牌绿罩 0.50，桥图随条带等比例压缩）*/
.idx-slide-slogan--rotator .pane-1 {
background-color: #60af3d;
background-image:
linear-gradient(180deg, rgba(96,175,61,0.50) 0%, rgba(96,175,61,0.50) 100%),
url('/static/images/hero-bridge-band.jpg');
background-blend-mode: normal, normal;
background-repeat: no-repeat, no-repeat;
background-position: center center, center center;
background-size: 100% 100%, 100% 100%;
animation: heroSloganPane1 24s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
/* pane-2 蓝色（color blend 染色，桥图随条带等比例压缩）*/
.idx-slide-slogan--rotator .pane-2 {
background-color: #88a2bc;
background-image:
linear-gradient(180deg, #88a2bc 0%, #88a2bc 100%),
url('/static/images/hero-bridge-band.jpg');
background-blend-mode: color, normal;
background-repeat: no-repeat, no-repeat;
background-position: center center, center center;
background-size: 100% 100%, 100% 100%;
animation: heroSloganPane2 24s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
/* pane-3 橙色（color blend 染色 + Careers 实采样视觉色 #b37543，桥图随条带等比例压缩）*/
.idx-slide-slogan--rotator .pane-3 {
background-color: #b37543;
background-image:
linear-gradient(180deg, #b37543 0%, #b37543 100%),
url('/static/images/hero-bridge-band.jpg');
background-blend-mode: color, normal;
background-repeat: no-repeat, no-repeat;
background-position: center center, center center;
background-size: 100% 100%, 100% 100%;
animation: heroSloganPane3 24s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
/* 切换动画：色带 + 文字捆绑整体横向滑动（origincell 风格）
pane 滑出 -100% 后用 step-end 瞬变到 100%（右侧外等待），
下一段就能从右紧贴滑入，没有空白缝隙
百分比设计：每相 33.33%，其中 hold 26.67% + slide 6.67%
→ 24s 周期下 hold ≈ 6.4s、slide ≈ 1.6s（与原 15s 周期 slide ≈ 1.65s 基本一致，
不再因放慢周期而连带让滑动过场变慢） */
@keyframes heroSloganPane1 {
0%, 26.67% { transform: translateX(0); } /* 显示居中 hold */
33.33% { transform: translateX(-100%); animation-timing-function: step-end; } /* 滑出左 → step-end hold */
93.33% { transform: translateX(100%); animation-timing-function: cubic-bezier(0.4,0,0.2,1); } /* 瞬移到右外，准备滑入 */
100% { transform: translateX(0); } /* 滑入到居中 */
}
@keyframes heroSloganPane2 {
0%, 26.67% { transform: translateX(100%); } /* 在右外等 */
33.33%, 60% { transform: translateX(0); } /* 滑入并显示 hold */
66.67% { transform: translateX(-100%); animation-timing-function: step-end; } /* 滑出左 → step-end hold */
100% { transform: translateX(100%); } /* 瞬变到右外（下轮 0% 衔接） */
}
@keyframes heroSloganPane3 {
0%, 60% { transform: translateX(100%); } /* 在右外等 */
66.67%, 93.33% { transform: translateX(0); } /* 滑入并显示 hold */
100% { transform: translateX(-100%); } /* 滑出左外（下轮 0% 直接跳回 100%，屏幕外不可见） */
}
/* 文字层不再独立动画，跟随 pane 一起滑 */
.idx-slide-slogan--rotator .idx-slogan-text {
display: inline-block;
}
/* hover 反馈：仅文字加聚光发光（不暂停切换，滚动持续不被打断） */
.idx-slide-slogan.idx-slide-slogan--rotator { cursor: pointer; }
.idx-slide-slogan--rotator .idx-slogan-text {
transition: text-shadow 0.4s ease;
}
.idx-slide-slogan.idx-slide-slogan--rotator:hover .idx-slogan-text {
text-shadow: 0 0 24px rgba(255, 255, 255, 0.75),
0 0 8px rgba(255, 255, 255, 0.50),
0 2px 12px rgba(0, 0, 0, 0.30);
}
/* 移动端字号收一档 */
@media (max-width: 1024px) {
.idx-slide-slogan--rotator .lang-en { font-size: clamp(15px, 2.2vw, 26px); }
.idx-slide-slogan--rotator .lang-cn { font-size: clamp(17px, 2.5vw, 28px); }
}
@media (max-width: 640px) {
.idx-slide-slogan--rotator .lang-en { font-size: 14px; white-space: normal; line-height: 1.25; }
.idx-slide-slogan--rotator .lang-cn { font-size: 15px; white-space: normal; line-height: 1.3; }
}
/* 减少动效：只显示 pane-1，不滚动 */
@media (prefers-reduced-motion: reduce) {
.idx-slide-slogan--rotator .idx-slogan-pane { animation: none !important; transform: translateX(100%) !important; }
.idx-slide-slogan--rotator .pane-1 { transform: translateX(0) !important; }
}
/* --- 学术三线表 news-table-academic：纯黑三线，去掉绿色描边/行分隔/默认 margin
字号比正文（16.5px）小一档 → 13px，行高同步收紧 --- */
.news-detail-content table.news-table-academic {
margin: 0 !important;
font-size: 13px !important;
}
.news-detail-content table.news-table-academic thead tr {
border-top: 2px solid #000 !important;
border-bottom: 1px solid #000 !important;
}
.news-detail-content table.news-table-academic th {
background: transparent !important;
color: #111 !important;
border-bottom: 1px solid #000 !important;
font-size: 13px !important;
line-height: 1.45 !important;
}
.news-detail-content table.news-table-academic td {
border-bottom: none !important;
font-size: 13px !important;
line-height: 1.5 !important;
}
/* 第一列（行标签）锁定不换行：避免 "LS mean difference from placebo" 这类长 label 折行 */
.news-detail-content table.news-table-academic tbody tr td:first-child,
.news-detail-content table.news-table-academic thead tr th:first-child {
white-space: nowrap !important;
}
.news-detail-content table.news-table-academic tbody tr:last-child td {
border-bottom: 2px solid #000 !important;
}
.news-detail-content table.news-table-academic tr:hover td {
background: transparent !important;
}
/* th/td 内部的 span（用于 nowrap 包裹）：继承父单元格字体/字重/字号，避免被全局 span 规则降级为 400 细体 */
.news-detail-content table.news-table-academic th span,
.news-detail-content table.news-table-academic td span {
font-family: inherit !important;
font-weight: inherit !important;
font-size: inherit !important;
color: inherit !important;
line-height: inherit !important;
}
/* 三线表下方的斜体注释（"All p-values are based on comparison to placebo."）—— 比表格再小一档 */
.news-detail-content p.news-table-caption,
.news-detail-content p.news-table-caption em {
font-size: 11.5px !important;
line-height: 1.5 !important;
color: #666 !important;
}
/* --- 新闻正文里的小绿箭头列表（沿用管线 hy-bullet 的 › 风格） --- */
.news-detail-content ul.news-arrow-list {
list-style: none !important;
padding-left: 0 !important;
margin: 10px 0 !important;
}
.news-detail-content ul.news-arrow-list li {
position: relative !important;
padding: 4px 0 4px 22px !important;
margin: 0 !important;
list-style: none !important;
}
.news-detail-content ul.news-arrow-list li::marker { content: none !important; }
.news-detail-content ul.news-arrow-list li::before {
content: "›";
position: absolute;
left: 4px;
top: 0;
color: #2f9e5e;
font-weight: 800;
font-size: 18px;
line-height: 1.85;
}
.news-detail-content ul.news-arrow-list li strong {
color: #096a3d !important;
font-weight: 700 !important;
}
/* 首页 LOGO 标题（HY MEDICINE / 君科华元）触摸反馈：仅颜色变化（变亮 + 饱和） */
.idx-hero-slide .idx-slide-title {
display: inline-block;
transition: filter 0.3s ease;
}
.idx-hero-slide .idx-slide-title:hover {
filter: brightness(1.15) saturate(1.20);
}
/* 球体 LOGO hover 反馈 —— 跟标题保持一致（scale + drop-shadow），
用 individual transform property `scale` 避开 heroLogoFloat 的 transform 占用 */
.idx-hero-slide .idx-slide-logo {
scale: 1;
transition: scale 0.3s ease, filter 0.3s ease;
}
.idx-hero-slide .idx-slide-logo:hover {
scale: 1.008;
filter:
drop-shadow(0 6px 20px rgba(9, 106, 61, 0.18))
drop-shadow(0 2px 6px rgba(9, 106, 61, 0.12))
drop-shadow(0 3px 6px rgba(9, 106, 61, 0.08)) !important;
}
/* ============================================================
[2026-05-26] 主页 HERO 顶部浅天蓝渐变底色
——撤掉之前贴在球体后面的"蓝色晕染圆盘"（晕乎乎不美观），
改为整个 HERO 顶部一层极淡的天空蓝→白 的垂直渐变。
视觉是"天空感"，LOGO 自然落在过渡区，不会出现可见的形状边界。
============================================================ */
html body.is-home .idx-hero.idx-hero-slide .idx-slide::before {
/* 还原为不可见（不再用伪元素做底色，改用 HERO 自身的垂直渐变） */
background: none !important;
display: none !important;
}
/* HERO 整体叠加：顶部浅天蓝（向下淡出至白），形成"天空感"底色
v3 精修：9 个 stops 让过渡奶油般顺滑；色温微调更"清晨天空"；fade 延伸到 100% 消除地平线 */
html body.is-home .idx-hero.idx-hero-slide {
background:
/* 极淡的中心呼吸 */
radial-gradient(ellipse 75% 55% at 50% 52%, rgba(9, 106, 61, 0.022) 0%, transparent 60%),
/* 工程精度感的点阵纹理 */
radial-gradient(circle at center, rgba(9, 106, 61, 0.045) 0.9px, transparent 1.4px) 0 0 / 34px 34px,
/* 顶部浅天蓝→中部→透明 的精修垂直渐变（9 stops，奶油顺滑无色带）—— 还原上一版色调 rgb(190,220,240) */
linear-gradient(
180deg,
rgba(190, 220, 240, 0.55) 0%,
rgba(195, 223, 242, 0.48) 8%,
rgba(202, 227, 244, 0.40) 18%,
rgba(210, 232, 246, 0.31) 30%,
rgba(218, 236, 248, 0.22) 42%,
rgba(226, 240, 249, 0.14) 56%,
rgba(235, 244, 251, 0.08) 70%,
rgba(245, 250, 252, 0.03) 86%,
transparent 100%
),
/* 顶部/底部白色边界（顶部降到 0.22 让蓝色更纯净） */
linear-gradient(180deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0) 22%, rgba(255,255,255,0) 82%, rgba(255,255,255,1) 100%),
#ffffff !important;
}
/* ============================================================
[2026-05-27] 手机竖屏专项修复（全部在 @media 内，不影响桌面）
覆盖：
1. 首页 slogan 横幅在 ≤640px 上换行/挤压
2. R&D Team marquee 在 ≤600px 横向溢出 → 改 2 列网格
3. About hero 第一行（30px 名字 + 16px 副句）≤640px 撑爆
4. Modal 顶距 ≤768px 由 100px 收紧到 50px
5. 横幅 81vh / 70vh 在不支持 dvh 的旧 iOS 补 vh fallback + 兜底 min-height
6. 加入我们页 leaflet 地图 ≤640px 高度 250px → 340px
7. 新闻表格 ≤768px 关闭 overflow-wrap:anywhere/hyphens，禁止字母/括号被
硬拆到下一行；同时给表格本身 overflow-x:auto 兜底
8. 语言切换按钮 ≤768px 命中区 ≥44×44
============================================================ */
/* --- 5 · 横幅 vh fallback（先写一次，覆盖所有 .ny-banner 81vh / 70vh 场景） --- */
@supports not (height: 1dvh) {
body.page-about .ny-banner,
body.page-news .ny-banner,
body.page-news-detail .ny-banner,
body.page-careers .ny-banner {
min-height: 480px;
}
}
@media screen and (max-width: 768px) {
/* --- 4 · Modal 顶距收紧 --- */
.md-modal {
top: 50px !important;
}
/* --- 7 · 新闻表格：禁止字母/括号被硬断到下一行 ---
全局 .news-detail-content p { overflow-wrap: anywhere; hyphens: auto }
在窄屏 td/th 上是个坑：会把 "HY-1608" 拆成 "HY-" / "1608"，把 "(0.06" 的
"(" 单独换行。这里全部 reset 成"按词边界自然换行"。 */
.news-detail-content table.news-table-academic,
.news-detail-content table.news-table-academic th,
.news-detail-content table.news-table-academic td {
overflow-wrap: normal !important;
word-break: normal !important;
hyphens: manual !important;
-webkit-hyphens: manual !important;
font-size: 12px !important;
line-height: 1.45 !important;
padding: 6px 5px !important;
}
/* 表头/首列允许在词边界换行，但仍不再硬拆字母 */
.news-detail-content table.news-table-academic th {
white-space: normal !important;
}
.news-detail-content table.news-table-academic tbody tr td:first-child,
.news-detail-content table.news-table-academic thead tr th:first-child {
white-space: normal !important;
}
/* 实在塞不下：让表格自身可横向滚动（不让整页跟着滚） */
.news-detail-content table.news-table-academic {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
/* 表格里有 nowrap span 时仍生效（不要被上面的规则废掉） */
.news-detail-content table.news-table-academic span[style*="nowrap"],
.news-detail-content table.news-table-academic span.nowrap {
white-space: nowrap !important;
}
/* --- 8 · 语言切换按钮 ≥44px 命中区 --- */
.lang-globe-btn {
min-width: 44px !important;
min-height: 44px !important;
padding: 0 10px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
}
/* --- 3 · About hero 头部排版（≤768 已 unwrap，再向下兜底） --- */
.about-hero-bridge .about-hero-name {
font-size: 22px !important;
}
.about-hero-bridge .about-hero-line1 {
font-size: 15px !important;
line-height: 1.45 !important;
}
.about-hero-bridge .about-hero-sub {
font-size: 13px !important;
line-height: 1.45 !important;
}
}
/* --- 6 · 加入我们页地图：≤640 从 250px 提升到 340px --- */
@media screen and (max-width: 640px) {
#allmap1, #allmap, .ny-lx-r > div[id^="allmap"] {
height: 340px !important;
min-height: 340px !important;
}
/* --- 1 · 首页 slogan 在 ≤640 不再固定 70px 高度，允许自适应 --- */
.idx-slide-slogan,
.idx-slide-slogan--rotator {
height: auto !important;
min-height: 70px !important;
padding: 12px 16px !important;
}
.idx-slide-slogan--rotator .lang-cn,
.idx-slide-slogan--rotator .lang-en {
font-size: 13px !important;
line-height: 1.45 !important;
white-space: normal !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
}
/* --- 3 续 · 更窄屏（iPhone SE 等）把公司名再缩一档，避免 wrap 第二行 --- */
.about-hero-bridge .about-hero-name {
font-size: 20px !important;
}
.about-hero-bridge .about-hero-line1 {
font-size: 14px !important;
}
}
/* --- 2 · R&D Team marquee 在 ≤600px 改 2 列网格，杜绝横向溢出 --- */
@media screen and (max-width: 600px) {
/* staticMode 已经把跑马灯居中、隐藏左右按钮。这里把 track 改成 2 列网格。 */
.team-marquee.team-marquee-static .team-track {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 22px 14px !important;
width: 100% !important;
transform: none !important; /* 取消 JS 写入的 translate3d */
justify-content: stretch !important;
}
.team-marquee.team-marquee-static .team-card {
flex: 0 0 auto !important;
width: 100% !important;
max-width: 100% !important;
}
.team-marquee.team-marquee-static .team-card figure {
margin: 0 auto !important;
}
/* viewport 在网格模式下不需要再裁切 / 拖拽 */
.team-marquee.team-marquee-static .team-marquee-viewport {
overflow: visible !important;
cursor: default !important;
}
}