/* ==========================================================================
   APHA web — 专家信息库公开详情页 (电脑版官网) 样式
   Version: 20261102d  (bump on every change!)
   v20261102d hero 个人简介·亮点总结 (方案 ../ConferenceShow/docs/ExpertSummary_Hero_Intro_Plan_20261103.html):
     - .ei-hero-summary 浅白半透明段落, 3 行 line-clamp 截断, 溢出才显示「展开/收起」胶囊按钮
     - 焦点环 / 200ms 过渡 / reduced-motion 降级; 仅 AuditStatus=1 且非空渲染
   v20261102c 照片强化 (方案 ../ConferenceShow/docs/ExpertHome_ExpertLibrary_Merge_Plan_20261102.html §11):
     - hero 照片 112→128px, 白环 5px + 双层阴影; 可点击放大 (Viewer 灯箱), 右下放大镜角标导引,
       cursor:zoom-in, hover/focus 微放大 200ms, focus-visible 焦点环, reduced-motion 降级
     - 板块内容图 .ei-d-img 104→116px, 间距 12px
   v20261102b 排版修复:
     - 统计条: 网格改用 site.css .ap-doc-stats-grid (原 .ei-stats-grid 无布局规则, 4 项纵向堆叠)
     - 分享条 .ei-share: 移入 hero 信息列内整行排布 (原为 hero flex 直接子项被挤成 305px 小块)
     - 信息库主体不再 ap-reveal (数千 px 高区块在矮视口下 IO 永不触发, 内容恒 opacity:0)
   v20261102a 专家库页升级为完整专家主页:
     - hero: 评分徽章 ei-hero-rating / 专长标签 ei-hero-chips / 统计条 ei-stats / 分享海报 ei-share
     - 右目录分组化 (ei-toc-group: 信息库 + 更多), 动态/图片/视频/评价/预约/联系锚点
     - 新内容区块样式复用 site.css (ap-tl/ap-gallery/ap-videos/ap-form/ap-doc-contact 等), 本文件仅粘合
   v20261028a UI 重设计 (大厂标准, frontend-design 落地):
     - hero 头区: 深蓝渐变(与主导航同系)白字区 + 装饰弧 + 112px 照片 + 语言切换胶囊
     - 双栏布局: 左内容卡片流 + 右 sticky 目录(scrollspy 联动 .on 高亮)
     - 窄屏(<=1024px)折叠单栏, 顶部横滑锚点条接管(ei-anchors)
     - 板块卡片: 标题主色竖条 / rows 表格横滑防挤压 / items 卡片化 / 媒体 zoom-in
     - 内容块 ei-d-* DOM 来自共享渲染器 ExpertRender(与移动版共用, 不动)
   依赖: site.css 设计语言(ap-section/ap-container/ap-btn/ap-breadcrumb 等)
   ========================================================================== */

/* ---- 页面骨架 ---- */
.ei-page { padding-top: 18px; }
.ei-page .ap-container { max-width: 1180px; }

/* ---- 面包屑: SetBreadcrumb 默认输出白字 ap-breadcrumb(深底用), 本页白底容器内覆写为浅色版 ---- */
.ei-page .ap-breadcrumb { margin-bottom: 14px; padding-top: 0; }
.ei-page .ap-breadcrumb li { color: #94A3B8; }
.ei-page .ap-breadcrumb li + li::before { color: #CBD5E1; }
.ei-page .ap-breadcrumb a { color: #2A7AE5; }
.ei-page .ap-breadcrumb a:hover { color: #2169D3; }

/* ---- hero 头区 ---- */
.ei-hero {
    position: relative; overflow: hidden;
    display: flex; align-items: center; gap: 26px; flex-wrap: wrap;
    background: linear-gradient(120deg, #1A4FA8 0%, #2169D3 58%, #2A7AE5 100%);
    border-radius: 18px; padding: 30px 34px; margin-bottom: 20px;
    color: #fff;
    box-shadow: 0 12px 32px rgba(26, 79, 168, .28);
}
.ei-hero-deco {
    position: absolute; right: -80px; top: -110px; width: 320px; height: 320px;
    background: radial-gradient(circle at center, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 62%);
    border-radius: 50%; pointer-events: none;
}
.ei-hero-deco::after {
    content: ""; position: absolute; right: 56px; bottom: -150px;
    width: 220px; height: 220px; border-radius: 50%;
    border: 1px solid rgba(255,255,255,.16);
}
.ei-hero-photo { flex: none; position: relative; z-index: 1; }
/* v20261102c: 可放大照片容器 —— 128px 白环双层阴影, 悬停/焦点微放大, 右下角标 */
.ei-hero-photo-zoom {
    position: relative; display: block; width: 128px; height: 128px;
    border-radius: 50%; cursor: zoom-in; outline: none;
    transition: transform .2s ease;
}
.ei-hero-photo-zoom:hover, .ei-hero-photo-zoom:focus-visible { transform: scale(1.04); }
.ei-hero-photo-zoom:focus-visible { box-shadow: 0 0 0 4px rgba(255,255,255,.55); }
.ei-hero-photo img {
    display: block; width: 128px; height: 128px; border-radius: 50%; object-fit: cover;
    border: 5px solid rgba(255,255,255,.95);
    box-shadow: 0 10px 28px rgba(9, 30, 66, .42), 0 2px 6px rgba(9, 30, 66, .25);
}
.ei-hero-photo-badge {
    position: absolute; right: 2px; bottom: 2px;
    display: flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; border-radius: 50%;
    color: #1A4FA8; background: rgba(255,255,255,.96);
    border: 2px solid rgba(26,79,168,.12);
    box-shadow: 0 3px 10px rgba(9, 30, 66, .3);
    transition: background-color .2s, transform .2s;
}
.ei-hero-photo-zoom:hover .ei-hero-photo-badge { background: #fff; transform: scale(1.08); }
.ei-hero-photo--ph {
    display: flex; align-items: center; justify-content: center;
    width: 128px; height: 128px; border-radius: 50%;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 48px; font-weight: 700; color: #1A4FA8;
    background: rgba(255,255,255,.92);
    border: 5px solid rgba(255,255,255,.55);
}
.ei-hero-info { flex: 1; min-width: 240px; position: relative; z-index: 1; }
.ei-hero-eyebrow {
    display: inline-block; font-size: 12px; letter-spacing: .14em; text-transform: uppercase;
    color: rgba(255,255,255,.82); background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 20px; padding: 4px 12px; margin-bottom: 10px;
}
.ei-hero-info h1 {
    font-family: Georgia, "SimSun", serif;
    font-size: 30px; line-height: 1.25; font-weight: 700; color: #fff; margin: 0;
}
.ei-hero-pos { font-size: 15px; color: rgba(255,255,255,.88); margin-top: 6px; }
.ei-hero-meta { margin-top: 12px; display: flex; gap: 8px; flex-wrap: wrap; }
.ei-hero-chip {
    font-size: 12px; color: #fff; background: rgba(255,255,255,.16);
    border-radius: 6px; padding: 4px 10px;
}
.ei-hero-actions { flex: none; display: flex; flex-direction: column; gap: 10px; align-items: stretch; position: relative; z-index: 1; }
.ei-hero-actions .ap-btn { white-space: nowrap; }
.ei-lang {
    display: flex; align-self: flex-end;
    background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.28);
    border-radius: 20px; overflow: hidden;
}
.ei-lang a {
    font-size: 13px; color: rgba(255,255,255,.85); text-decoration: none;
    padding: 6px 16px; transition: background .15s;
}
.ei-lang a + a { border-left: 1px solid rgba(255,255,255,.28); }
.ei-lang a.on { background: #fff; color: #1A4FA8; font-weight: 700; }

/* ---- 窄屏横滑锚点条 (桌面隐藏) ---- */
.ei-anchors {
    display: none;
    gap: 8px; margin-bottom: 16px;
    overflow-x: auto; -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
}
.ei-anchors .ei-anchor { flex: none; }

/* ---- 英文回退提示 ---- */
.ei-fallback {
    display: flex; align-items: center; gap: 8px;
    background: #FCF7E8; color: #92600A; font-size: 13px;
    border: 1px solid #F0E3C4; border-radius: 10px;
    padding: 10px 16px; margin-bottom: 16px;
}
.ei-fallback-ico { font-style: normal; flex: none; }

/* ---- 双栏布局 ---- */
.ei-layout {
    display: grid; grid-template-columns: minmax(0, 1fr) 264px; gap: 30px;
    align-items: start;
}
.ei-main { min-width: 0; }

/* ---- 右侧 sticky 目录 ---- */
.ei-toc-col { position: sticky; top: 76px; }
.ei-toc {
    background: #fff; border: 1px solid #E7ECF3; border-radius: 14px;
    padding: 18px 14px 14px;
    box-shadow: 0 2px 10px rgba(15, 40, 80, .05);
}
.ei-toc-title {
    font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
    color: #94A3B8; padding: 0 8px 10px;
}
.ei-toc-list { display: flex; flex-direction: column; gap: 2px; }
.ei-toc .ei-anchor {
    display: block; font-size: 13.5px; line-height: 1.45; color: #4B5563;
    text-decoration: none; padding: 7px 10px; border-radius: 8px;
    border-left: 3px solid transparent;
    transition: background .12s, color .12s, border-color .12s;
    word-break: break-word;
}
.ei-toc .ei-anchor:hover { background: #F3F6FA; color: #1F2937; }
.ei-toc .ei-anchor.on {
    background: #EAF1FB; color: #2169D3; font-weight: 700;
    border-left-color: #2A7AE5;
}
.ei-toc-top {
    display: block; width: 100%; margin-top: 12px;
    font-size: 13px; color: #2A7AE5; background: #F3F6FA;
    border: 0; border-radius: 8px; padding: 9px 10px; cursor: pointer;
    transition: background .12s;
}
.ei-toc-top:hover { background: #EAF1FB; }

/* ---------------- 内容块 (渲染器 ei-d-* 类, 仅视觉层) ---------------- */
.ei-doc { max-width: none; }
.ei-doc .ei-d-sec {
    background: #fff; border: 1px solid #E7ECF3; border-radius: 14px;
    padding: 24px 28px; margin-bottom: 18px;
    box-shadow: 0 2px 10px rgba(15, 40, 80, .05);
    transition: box-shadow .18s ease, transform .18s ease;
}
.ei-doc .ei-d-sec:hover {
    box-shadow: 0 10px 26px rgba(15, 40, 80, .1);
    transform: translateY(-2px);
}
.ei-d-title {
    font-family: Georgia, "SimSun", serif;
    font-size: 20px; font-weight: 700; color: #1F2937;
    border-left: 4px solid #2A7AE5;
    padding-left: 12px; padding-bottom: 10px; margin-bottom: 16px;
    border-bottom: 1px solid #EEF1F6;
}
.ei-d-group { margin: 16px 0 8px; }
.ei-d-gtitle {
    font-size: 15px; font-weight: 700; color: #334155;
    border-left: 3px solid #2A7AE5; background: #F3F6FA;
    padding: 7px 13px; border-radius: 0 8px 8px 0; margin-bottom: 10px;
}

/* kv */
.ei-d-kv {
    display: flex; padding: 9px 0; border-bottom: 1px dashed #F1F4F8; font-size: 14px;
}
.ei-d-kv:last-child { border-bottom: 0; }
.ei-d-k { flex: none; width: 220px; color: #64748B; }
.ei-d-v { flex: 1; color: #1F2937; word-break: break-word; }

/* rows 记录表: 行内最小宽触发容器横滑, 防多列挤压 */
.ei-d-rows {
    margin: 12px 0; border: 1px solid #EEF1F6; border-radius: 10px;
    overflow-x: auto; -webkit-overflow-scrolling: touch;
}
.ei-d-rrow { display: flex; border-bottom: 1px solid #F1F4F8; min-width: 620px; }
.ei-d-rrow:last-child { border-bottom: 0; }
.ei-d-rcell {
    flex: 1; padding: 11px 14px; font-size: 13px; color: #1F2937;
    border-right: 1px solid #F1F4F8; word-break: break-word; min-width: 0;
}
.ei-d-rcell:last-child { border-right: 0; }
.ei-d-rhead { background: #F6F8FB; }
.ei-d-rhead .ei-d-rcell { font-weight: 600; color: #475569; }
.ei-d-rrow:not(.ei-d-rhead):hover { background: #FAFCFE; }
.ei-d-dim { color: #C4CBD6; font-style: normal; }
.ei-d-rmedia { padding: 0 14px 12px; min-width: 600px; }

/* items 条目: 卡片化 */
.ei-d-item {
    background: #FAFBFD; border: 1px solid #F0F3F8; border-radius: 10px;
    padding: 14px 16px; margin: 10px 0;
    transition: border-color .15s, box-shadow .15s;
}
.ei-d-item:hover { border-color: #D8E6FA; box-shadow: 0 3px 12px rgba(42, 122, 229, .08); }
.ei-d-ititle { font-size: 15px; font-weight: 700; color: #1F2937; margin-bottom: 6px; }
.ei-d-ibody { font-size: 14px; color: #374151; line-height: 1.85; word-break: break-word; }
.ei-d-text { font-size: 14px; color: #374151; line-height: 1.85; word-break: break-word; }

/* 媒体 */
.ei-d-imgs { display: flex; flex-wrap: wrap; gap: 12px; margin: 12px 0 2px; }
.ei-d-img {
    width: 116px; height: 116px; object-fit: cover;
    border-radius: 10px; border: 1px solid #E7ECF3;
    cursor: zoom-in;
    transition: transform .15s ease, box-shadow .15s ease;
}
.ei-d-img:hover { transform: scale(1.04); box-shadow: 0 6px 18px rgba(15, 40, 80, .16); }
.ei-d-links { display: flex; flex-direction: column; gap: 5px; margin-top: 8px; }
.ei-d-link {
    font-size: 13px; color: #2A7AE5; text-decoration: none; word-break: break-all;
}
.ei-d-link:hover { text-decoration: underline; }

/* ---- 响应式: <=1024px 折叠单栏, 横滑锚点条接管 ---- */
@media (max-width: 1024px) {
    .ei-layout { grid-template-columns: 1fr; gap: 0; }
    .ei-toc-col { display: none; }
    .ei-anchors {
        display: flex;
        position: sticky; top: 60px; z-index: 30;
        background: rgba(255,255,255,.96);
        box-shadow: 0 2px 10px rgba(15, 40, 80, .07);
        padding: 10px 14px; margin: 0 -14px 16px;
        border-radius: 0;
    }
    .ei-anchors .ei-anchor {
        font-size: 13px; color: #4B5563; background: #F3F6FA;
        border-radius: 20px; padding: 6px 14px; text-decoration: none;
    }
    .ei-anchors .ei-anchor.on { color: #fff; background: #2A7AE5; font-weight: 700; }
}
@media (max-width: 720px) {
    .ei-hero { padding: 22px 18px; gap: 16px; }
    .ei-hero-info h1 { font-size: 24px; }
    .ei-hero-photo img, .ei-hero-photo--ph, .ei-hero-photo-zoom { width: 96px; height: 96px; }
    .ei-hero-photo--ph { font-size: 36px; }
    .ei-hero-photo-badge { width: 28px; height: 28px; }
    .ei-hero-actions { flex-direction: row; align-items: center; width: 100%; }
    .ei-lang { margin-left: auto; }
    .ei-doc .ei-d-sec { padding: 18px 16px; }
    .ei-d-k { width: 110px; }
    .ei-d-rrow { min-width: 520px; }
    .ei-d-rmedia { min-width: 500px; }
}

/* ==========================================================================
   v20261102a 完整专家主页增量
   ========================================================================== */

/* ---- hero 个人简介·亮点总结 (v20261102d) ---- */
.ei-hero-summary { position: relative; z-index: 1; margin-top: 12px; max-width: 760px; }
.ei-hero-summary-text {
    margin: 0; font-size: 14.5px; line-height: 1.75; color: rgba(255,255,255,.92);
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
    word-break: break-word;
}
.ei-hero-summary.is-open .ei-hero-summary-text { display: block; -webkit-line-clamp: unset; overflow: visible; }
.ei-hero-summary-more {
    display: inline-flex; align-items: center; margin-top: 8px; min-height: 32px; padding: 0 14px;
    font-size: 12.5px; color: #fff; background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.28); border-radius: 16px; cursor: pointer;
    transition: background-color .2s;
}
.ei-hero-summary-more:hover { background: rgba(255,255,255,.24); }
.ei-hero-summary-more:focus-visible { outline: 3px solid rgba(255,255,255,.55); outline-offset: 1px; }

/* ---- hero 评分徽章 (深蓝底白字胶囊) ---- */
.ei-hero-rating {
    display: inline-flex; align-items: center; gap: 8px; margin-top: 10px;
    font-size: 13.5px; color: #fff;
    background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    border-radius: 18px; padding: 5px 13px;
}
.ei-hero-rating .ap-stars { color: #FFD166; letter-spacing: 2px; }

/* ---- hero 专长标签 (深蓝底下的 ap-chip 覆写) ---- */
.ei-hero-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; position: relative; z-index: 1; }
.ei-hero-chips .ap-chip {
    font-size: 12.5px; color: rgba(255,255,255,.94);
    background: rgba(255,255,255,.13); border: 1px solid rgba(255,255,255,.22);
    border-radius: 14px; padding: 3px 11px;
}

/* ---- hero 分享海报条 (v20261102b: 位于 .ei-hero-info 内, 整行; 覆盖 share.css 的上下边线为浅白) ---- */
.ei-share {
    width: 100%; margin: 14px 0 0; padding: 12px 0 0;
    border-top: 1px solid rgba(255,255,255,.18); border-bottom: 0;
    position: relative; z-index: 1;
}
.ei-share .ap-share-label { color: rgba(255,255,255,.75); }
.ei-share .ap-share-btn {
    color: #fff; background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.24);
}
.ei-share .ap-share-btn:hover { background: rgba(255,255,255,.22); }

/* ---- 统计条 (白卡; 网格由 site.css .ap-doc-stats-grid 提供 4 列/≤900px 2 列, 本处只给卡片外观) ---- */
.ei-stats { margin: 0 0 20px; }
.ei-stats .ap-doc-stats-grid {
    background: #fff; border: 1px solid #E7ECF3; border-radius: 16px;
    box-shadow: 0 2px 10px rgba(15, 40, 80, .05);
    padding: 6px 16px;
}

/* ---- 右目录分组标签 + "更多"锚点 ---- */
.ei-toc-group {
    font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
    color: #94A3B8; padding: 10px 8px 5px;
}
.ei-toc-group:first-of-type { padding-top: 0; }
.ei-toc .ei-anchor--x { color: #2A7AE5; }
.ei-toc .ei-anchor--x::before { content: "·"; margin-right: 6px; color: #94A3B8; }
.ei-anchors .ei-anchor--x { color: #2A7AE5; }

/* ---- 内容区块进入动画降级 ---- */
@media (prefers-reduced-motion: reduce) {
    .ei-share .ap-share-btn, .ei-hero-rating, .ei-hero-chips .ap-chip { transition: none; }
    .ei-hero-photo-zoom, .ei-hero-photo-zoom .ei-hero-photo-badge, .ei-hero-summary-more { transition: none; }
    .ei-hero-photo-zoom:hover, .ei-hero-photo-zoom:focus-visible { transform: none; }
}