/* =========================================================
   carousel.css — Hero 5 张激光轮播（克制型 VI 激光）
   ========================================================= */

/* ===== Carousel 容器 · 圆角发光大面板 ===== */
.hero-carousel {
    position: relative;
    min-height: calc(100vh - 136px);
    margin: 88px 24px 48px;
    /* V8.9：上下内边距 100/96 → 44/48；面板高度改由视口决定。
       原来 padding 100px + hero-slides 的 padding-bottom 96px + 进度条位置，
       三层叠起来把面板撑到 1037px，视口才 900px → 首屏露不全、底部大块留白。
       现在：面板高度 = calc(100vh - 136px)（视口决定），内容在框内排布，
       1440×900 下首屏完整放下且不留大块空白。 */
    padding: 36px 0 40px;
    /* 面板高度：完全按内容撑开（height:auto，无 max-height）。
       · 内容装得下（1440×900 实测 589px）→ 面板 764px，首屏完整展示
       · 装不下（1024×768 矮笔记本）→ 面板自然变高、页面滚动，
         绝不裁切文字、也绝不缩字（V8.9 终版）。
       高度来源：.hero-slides 的 min-height = --hero-h = 内容高 + 8px。 */
    height: auto;
    display: flex;
    /* 顶部对齐 + 高度自适应：内容高于 min-height 时向下撑开，不裁切 CTA 按钮 */
    align-items: flex-start;
    height: auto;
    overflow: hidden;
    border-radius: 40px;
    background:
        radial-gradient(ellipse 70% 55% at 50% 0%, rgba(0, 229, 200, 0.10), transparent 62%),
        radial-gradient(ellipse 60% 50% at 100% 100%, rgba(139, 92, 246, 0.12), transparent 60%),
        radial-gradient(ellipse 50% 40% at 0% 80%, rgba(255, 77, 143, 0.08), transparent 65%),
        linear-gradient(155deg, #141B52 0%, #1B1270 50%, #241080 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow:
        0 0 60px rgba(139, 92, 246, 0.28),
        0 0 120px rgba(0, 229, 200, 0.14),
        0 30px 80px rgba(6, 10, 36, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 0 0 0 1px rgba(0, 229, 200, 0.04);
}
/* 顶部高光线 · 提示这是一个独立广告面板 */
.hero-carousel::before {
    content: '';
    position: absolute;
    top: 0; left: 6%; right: 6%;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(0, 229, 200, 0.6) 30%, rgba(139, 92, 246, 0.6) 70%, transparent 100%);
    box-shadow: 0 0 16px rgba(0, 229, 200, 0.4), 0 0 8px rgba(139, 92, 246, 0.3);
    z-index: 6;
    border-radius: 0 0 1px 1px;
}
/* 底部高光线 */
.hero-carousel::after {
    content: '';
    position: absolute;
    bottom: 0; left: 10%; right: 10%;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(139, 92, 246, 0.5) 50%, transparent 100%);
    box-shadow: 0 0 12px rgba(139, 92, 246, 0.35);
    z-index: 6;
    border-radius: 1px 1px 0 0;
}

.hero-slides {
    position: relative;
    width: 100%;
    /* height:auto：让 .hero-slide（absolute）的内容高能把容器撑开。
       min-height 用 CSS 变量：JS（js/carousel.js）实测**当前激活 slide**
       的内容高写入 --hero-h，保证 ① CTA 按钮不被进度条压住 ② 不多留空白。
       V8.9 修订：原来取 5 张里的最高值 → 最短的那张被硬撑高、底部空一大块。
       未测到时兜底 60vh。 */
    height: auto;
    min-height: var(--hero-h, 60vh) !important;
    /* 切页时高度平滑过渡，避免面板/内容跳动 */
    transition: min-height .45s var(--ease);
    /* 底部进度条预留改由 .hero-slide 的 inset 底部留位实现（这里不再重复留） */
}

/* 单张 slide：默认在右侧待命，激活时从右滑入，离开时向左滑出 */
/* 框内垂直居中 + 高度受面板约束（2026-11-05 · V8.8 → V8.9）
   V8.8 问题：内容高度（实测最高 739px）超出 .hero-slides 空间，
        顶对齐时往下溢 → CTA 按钮被 .hero-progress 进度条压住。
   V8.8 修法：align-items:flex-start + 容器 height:auto（按内容撑开），
        代价是面板被最高那张撑到 1037px，首屏露不全、底部空一大块。
   V8.9 修法：面板高度改由视口决定（.hero-carousel height/max-height），
        .hero-slide 用 inset:0 + align-items:center —— 内容在框内垂直居中，
        上下都留白而不是只在底部留白；同时内容超高时会自动缩（见下方缩放兜底）。 */
.hero-slide {
    position: absolute;
    /* 底部留位给进度条：--hero-pad-b（够高 84px / 矮视口 0px）。
       若用 inset:0，slide 会被撑满整个 slides 高度（含预留），
       内容区就少了预留 → 文字溢出被裁。 */
    inset: 0 0 var(--hero-pad-b, 84px) 0;
    display: flex;
    align-items: center;
    transform: translateX(100%);
    visibility: hidden;
    pointer-events: none;
    z-index: 1;
    will-change: transform;
}
@keyframes slide-in-right {
    from { transform: translateX(100%); visibility: visible; }
    to { transform: translateX(0); visibility: visible; }
}
@keyframes slide-out-left {
    from { transform: translateX(0); visibility: visible; }
    to { transform: translateX(-100%); visibility: visible; }
}
.hero-slide.is-active {
    visibility: visible;
    pointer-events: auto;
    z-index: 2;
    animation: slide-in-right .6s var(--ease) forwards;
}
.hero-slide.is-leaving {
    visibility: visible;
    z-index: 1;
    animation: slide-out-left .6s var(--ease) forwards;
}

/* slide 内部 grid 布局（与原 hero-grid 一致） */
.hero-slide-grid {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 80px;
    /* 两栏垂直居中：左栏文字与右栏图形视觉重心对齐 */
    align-items: center;
    width: 100%;
    max-width: var(--container);
    margin: 0 auto;
    padding: 0 32px;
    position: relative;
    z-index: 2;
    /* V8.9：grid 高度由内容决定（不跟随 .hero-slide 的 inset:0 撑开），
       这样 JS 量到的就是内容真实高，--hero-h 不会被父容器高度污染。 */
    align-self: start;
}

/* ===== 左侧文案 ===== */
.hero-slide-left { position: relative; max-width: 620px; }

/* ===== 右侧视觉 ===== */
.hero-slide-right {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    max-width: 560px;
    margin: 0 auto;
    /* V8.9：右栏图形比左栏文字矮时略微下移，让两侧视觉重心对齐，
       底部不再出现「图浮在上面」的错位感。 */
    transform: translateY(6px);
}
.hero-slide-right svg { width: 100%; height: 100%; overflow: visible; }

/* ===== 轮播图右侧动效字体（苹方-简） =====
   首选 PingFang SC（苹方-简，macOS/iOS 系统自带，CSS 引用不嵌入、零侵权）。
   Windows 无苹方 → 回退站酷小薇体子集（tianeti.woff2，31KB，SIL OFL 免费可商用），
   避免 Windows 访客退化成普通雅黑、风格断层。 */
@font-face {
    font-family: "TianETi";
    src: url("../assets/fonts/tianeti.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}
:root { --font-tiane: "PingFang SC", "TianETi", "Microsoft YaHei", sans-serif; }
.tiane, svg .tiane { font-family: var(--font-tiane); }

/* ===== 文字 cascade 淡入（每张激活时） ===== */
.hero-slide .stagger {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
}
.hero-slide.is-active .stagger {
    opacity: 1;
    transform: translateY(0);
}
.hero-slide.is-active .stagger-1 { transition-delay: 0.15s; }
.hero-slide.is-active .stagger-2 { transition-delay: 0.30s; }
.hero-slide.is-active .stagger-3 { transition-delay: 0.45s; }
.hero-slide.is-active .stagger-4 { transition-delay: 0.60s; }
.hero-slide.is-active .stagger-5 { transition-delay: 0.75s; }
.hero-slide.is-active .stagger-6 { transition-delay: 0.75s; }

/* ===== VI 激光层 · 克制型 ===== */

/* 横扫光束 */
.laser-sweep {
    position: absolute;
    top: 0; bottom: 0;
    left: -120px;
    width: 120px;
    pointer-events: none;
    z-index: 3;
    animation: laser-sweep 2.6s linear infinite;
    mix-blend-mode: screen;
}
.hero-slide:nth-child(2) .laser-sweep { animation-delay: -1s; }
.hero-slide:nth-child(3) .laser-sweep { animation-delay: -2s; }
.hero-slide:nth-child(4) .laser-sweep { animation-delay: -3s; }
.hero-slide:nth-child(5) .laser-sweep { animation-delay: -1.5s; }

@keyframes laser-sweep {
    0% { transform: translateX(0); opacity: 0; }
    10% { opacity: 1; }
    90% { opacity: 1; }
    100% { transform: translateX(calc(100vw + 240px)); opacity: 0; }
}

/* 对角斜扫（次要激光，每张只触发一次） */
.laser-diag {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 3;
    opacity: 0;
    animation: laser-diag 3.6s ease-in-out infinite;
    mix-blend-mode: screen;
}
.hero-slide:nth-child(1) .laser-diag { animation-delay: -0.5s; }
.hero-slide:nth-child(3) .laser-diag { animation-delay: -2.5s; }
.hero-slide:nth-child(5) .laser-diag { animation-delay: -4s; }

@keyframes laser-diag {
    0%, 100% { opacity: 0; transform: translate(0, 0); }
    10% { opacity: 0.85; }
    45% { opacity: 0.85; }
    55% { opacity: 0; transform: translate(-40vw, 40vh); }
}

/* 环形扫描（围绕右视图的几何中心） */
.radar-sweep {
    transform-origin: center;
    animation: radar-spin 3.8s linear infinite;
}
@keyframes radar-spin {
    to { transform: rotate(360deg); }
}

/* 节点连线 trace（描边动效） */
.laser-trace {
    stroke-dasharray: 40 220;
    stroke-dashoffset: 260;
    animation: trace 2.2s linear infinite;
}
.hero-slide:nth-child(2) .laser-trace { animation-delay: -0.5s; }
.hero-slide:nth-child(3) .laser-trace { animation-delay: -1s; }
.hero-slide:nth-child(4) .laser-trace { animation: trace 2.2s linear infinite; animation-delay: -1.5s; }
.hero-slide:nth-child(5) .laser-trace { animation-delay: -2s; }
@keyframes trace {
    0% { stroke-dashoffset: 260; }
    100% { stroke-dashoffset: 0; }
}

/* 节点脉冲（克制：低对比度） */
.laser-node {
    animation: node-pulse 1.6s ease-in-out infinite;
}
.hero-slide:nth-child(2) .laser-node { animation-delay: -0.3s; }
.hero-slide:nth-child(3) .laser-node { animation-delay: -0.6s; }
.hero-slide:nth-child(4) .laser-node { animation-delay: -0.9s; }
.hero-slide:nth-child(5) .laser-node { animation-delay: -1.2s; }
@keyframes node-pulse {
    0%, 100% { opacity: 0.4; }
    50% { opacity: 1; }
}

/* 切幻灯片时激光重启动画（避免跨 slide 视觉遗留） */
.hero-slide:not(.is-active):not(.is-leaving) .laser-sweep,
.hero-slide:not(.is-active):not(.is-leaving) .laser-diag,
.hero-slide:not(.is-active):not(.is-leaving) .laser-trace,
.hero-slide:not(.is-active):not(.is-leaving) .laser-node,
.hero-slide:not(.is-active):not(.is-leaving) .radar-sweep {
    animation-play-state: paused;
}

/* ===== slide 2 / 4 / 5 特殊布局：六边形、客户列表、数据高亮 ===== */

/* 六边形六业务板块（S2）—— 整个魔方用 SVG 一个 viewBox 画，比例绝对精确 */
.hex-modules {
    position: relative;
    width: 100%;
    max-width: 480px;
    height: 0;
    padding-bottom: 100%;       /* 撑出 width 等高的正方形 */
    margin: 0 auto;
}
.hex-svg {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    overflow: visible;
}
.hex-num { font-family: var(--font-tiane); font-size: 13px; fill: rgba(255,255,255,0.45); letter-spacing: 0.08em; }
.hex-icon { font-size: 22px; }
.hex-name { font-family: var(--font-tiane); font-weight: 600; fill: #fff; }
.hex-card rect { transition: stroke 0.3s ease, transform 0.3s ease; transform-origin: center; transform-box: fill-box; }
.hex-card:hover rect { stroke: rgba(0, 229, 200, 0.55); fill: rgba(255,255,255,0.1); }
/* 魔方连线：dasharray 适配线长 168，确保 6 条线始终可见 + 流光穿过 */
.hex-trace-group line {
    stroke-dasharray: 30 18;
    stroke-dashoffset: 0;
    animation: hex-trace 1.5s linear infinite;
}
@keyframes hex-trace {
    0% { stroke-dashoffset: 0; }
    100% { stroke-dashoffset: -48; }
}
.hex-trace-group line:nth-child(1) { animation-delay: 0s; }
.hex-trace-group line:nth-child(2) { animation-delay: -0.4s; }
.hex-trace-group line:nth-child(3) { animation-delay: -0.8s; }
.hex-trace-group line:nth-child(4) { animation-delay: -1.2s; }
.hex-trace-group line:nth-child(5) { animation-delay: -1.6s; }
.hex-trace-group line:nth-child(6) { animation-delay: -2.0s; }

/* 客户列表（S5） */
.client-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 16px;
}
.client-list .row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--bd-1);
    border-radius: 12px;
    transition: all 0.3s var(--ease);
}
.client-list .row:hover { border-color: rgba(0, 229, 200, 0.3); background: rgba(255, 255, 255, 0.06); }
.client-list .row .logo-mark {
    width: 36px; height: 36px;
    border-radius: 8px;
    background: var(--g-cyan-purple);
    display: flex; align-items: center; justify-content: center;
    font-size: 15px; font-weight: 700;
    flex-shrink: 0;
    font-family: var(--font-tiane);
}
.client-list .row .info { flex: 1; }
.client-list .row .info .name { font-size: 19px; font-weight: 600; font-family: var(--font-tiane); }
.client-list .row .info .industry { font-size: 14.5px; color: var(--text-4); letter-spacing: 0.06em; font-family: var(--font-tiane); }
.client-list .row .stat {
    font-family: var(--font-tiane);
    font-size: 19px;
    font-weight: 600;
    color: var(--c-cyan);
}

/* 数据高亮条 */
.highlight-stats {
    display: flex;
    gap: 24px;
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid var(--bd-1);
}
.highlight-stats .stat .v {
    font-family: ui-monospace, monospace;
    font-size: 28px;
    font-weight: 800;
    background: var(--g-cyan-purple);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    line-height: 1;
}
.highlight-stats .stat .l {
    font-size: 12px;
    color: var(--text-4);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-top: 8px;
}

/* ===== 响应式 ===== */
@media (max-width: 980px) {
    /* 顶部留白 88px → 116px：移动端导航实测高 94px，差 6px 会压住首行标题 */
    .hero-carousel { padding: 72px 0 80px; margin: 116px 16px 48px; border-radius: 28px; }
    /* 移动端改为顶部对齐：
       原来 .hero-slide 是 absolute + align-items:center，
       而内容高度（grid 1025px）远超容器（slide 506px），
       垂直居中会向上溢出 259px，把标题顶到导航底下。 */
    .hero-slide { align-items: flex-start; }
    .hero-slide-grid { grid-template-columns: 1fr; gap: 48px; align-items: start; }
    .hero-slide-left { max-width: 100%; }
    /* 移动端标题 40px：实测 44/42px 会排成三行（"级"字单独掉行），
       40px 起正好两行。桌面 80px / 手机 40px，两端都是两行。 */
    .h-hero { font-size: 40px; }

    /* 移动端：轮播容器改为「按内容自适应高度」并允许纵向滚动。
       原来容器固定 506px，但每屏内容实际 800~1300px（手机端左栏+右图竖排），
       内容被裁在容器里，底部金句条和按钮会压在轮播进度条下面看不见。
       → 容器高度交给 .hero-slides 的 min-height:auto，各屏按自身内容撑开。 */
    .hero-carousel {
        align-items: flex-start;
        height: auto;
    }
    .hero-slides {
        min-height: 0;
        height: auto;
        /* 手机端进度条是 absolute（bottom:24px），内容下方要留出它的高度，
           否则最后一行文字会被压住。桌面端的预留改由 .hero-slide 的 inset 底部
           留位实现，这里要单独补回来。 */
        padding-bottom: 72px;
    }
    .hero-slide {
        position: relative;
        inset: auto;
        display: none;
        min-height: 0;
    }
    .hero-slide.is-active {
        display: flex;
    }
    .hero-slide-right {
        margin-top: 8px;
    }
}

/* ============================================================
   V8.6 hero 标题「企业 AI 升级落地」窄屏适配（2026-11-05）
   背景：主标题加「落地」两字后，桌面 80px 下第一行 574px / 容器 595px
        （仅剩 21px 余量），窄屏 375px 更会折成三行。
   修法：① 窄屏收紧 .hero-slide-grid 的左右 padding（32px → 16px），
            把可视宽度还给标题；② 480px 以下标题降到 36px。
        桌面端保留 80px 大字（视觉冲击不打折）。
   ============================================================ */
@media (max-width: 480px) {
    .hero-slide-grid { padding-left: 16px; padding-right: 16px; }
    .h-hero { font-size: 36px; }
}
/* 极窄屏（iPhone SE2 320px）：36px 下「企业 AI 升级落地」仍会折成三行，
   再收一档到 32px + padding 12px，保证两行。 */
@media (max-width: 360px) {
    .hero-slide-grid { padding-left: 12px; padding-right: 12px; }
    .h-hero { font-size: 32px; }
}


/* ===== 手动轮播 · 底部 5 条进度条（自动 + 点击均可） ===== */
.hero-progress {
    position: absolute;
    bottom: 36px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 10;
    padding: 12px 18px;
    background: rgba(13, 27, 75, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 999px;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}
.hero-progress-bar {
    position: relative;
    width: 64px;
    height: 14px;
    background: transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    transition: width 0.3s var(--ease);
}
.hero-progress-bar::before {
    content: '';
    position: absolute;
    left: 0; right: 0;
    top: 50%;
    margin-top: -1.5px;
    height: 3px;
    background: rgba(255, 255, 255, 0.14);
    border-radius: 2px;
    transition: background 0.25s var(--ease);
}
.hero-progress-bar:hover::before { background: rgba(255, 255, 255, 0.25); }
.hero-progress-bar::after {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -1.5px;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, #00E5C8 0%, #8B5CF6 50%, #FF4D8F 100%);
    transform: scaleX(0);
    transform-origin: left;
    border-radius: 2px;
}
.hero-progress-bar.is-active {
    width: 84px;
}
.hero-progress-bar.is-active::before { background: rgba(255, 255, 255, 0.18); }
.hero-progress-bar.is-active::after {
    transform: scaleX(0);
    transform-origin: left;
    animation: progress-fill 4s linear forwards;
}
.hero-progress-bar.is-done::after {
    transform: scaleX(1);
    background: linear-gradient(90deg, #00E5C8, #8B5CF6);
    opacity: 0.65;
}
@keyframes progress-fill {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}

/* 进度条左侧的「N / 5」指示 */
.hero-progress-index {
    display: inline-flex;
    align-items: baseline;
    gap: 2px;
    margin-right: 14px;
    font-family: ui-monospace, monospace;
    font-size: 12px;
    letter-spacing: 0.1em;
    color: var(--text-3);
    flex-shrink: 0;
}
.hero-progress-index .cur {
    font-size: 18px;
    font-weight: 700;
    background: var(--g-cyan-purple);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    min-width: 18px;
    text-align: right;
    line-height: 1;
}
.hero-progress-index .sep { color: var(--text-4); margin: 0 2px; }
.hero-progress-index .total { color: var(--text-4); }

@media (max-width: 980px) {
    .hero-progress { bottom: 24px; padding: 10px 14px; gap: 8px; }
    .hero-progress-bar { width: 36px; }
    .hero-progress-bar.is-active { width: 56px; }
    .hero-progress-index { margin-right: 10px; font-size: 11px; }
    .hero-progress-index .cur { font-size: 15px; }
}
@media (max-width: 640px) {
    .hero-progress { gap: 6px; padding: 8px 12px; }
    .hero-progress-bar { width: 24px; }
    .hero-progress-bar.is-active { width: 40px; }
}
/* =========================================================
   V2 修正· 2026-10-08
   ① 移动端 100vh 会算上浏览器地址栏，导致轮播进度条被挤出视口 → 改用 100svh
   ② 锚点滚动补偿：固定导航高 105px，锚点目标需留出间距，否则标题被导航遮住
   ========================================================= */
@supports (height: 100svh) {
    .hero-carousel { min-height: calc(100svh - 136px); }
    .hero-slides { min-height: 60svh; }
}
/* 大屏兜底：超宽屏不无限拉高 */
@media (min-width: 1600px) {
    .hero-carousel { min-height: 820px; }
}
/* 锚点目标：固定导航补偿 */
[id] { scroll-margin-top: 120px; }

/* =========================================================
   六大板块辐射图 V2（重做：统一圆形节点 + 放射虚线 + 中心底座）
   ========================================================= */
.hex-svg { overflow: visible; }

/* 放射虚线：从中心边缘直出到节点边缘，不再穿过卡片 */
.hex-ray {
    stroke-dasharray: 5 6;
    animation: hex-ray-flow 0.9s linear infinite;
}
@keyframes hex-ray-flow {
    0%   { stroke-dashoffset: 0; opacity: .35; }
    50%  { opacity: .75; }
    100% { stroke-dashoffset: -44; opacity: .35; }
}

/* 中心底座：呼吸光晕 */
.hex-core circle {
    transform-box: fill-box;
    transform-origin: center;
    animation: hex-core-breathe 1.8s ease-in-out infinite;
}
@keyframes hex-core-breathe {
    0%, 100% { transform: scale(1);    opacity: 1; }
    50%      { transform: scale(1.045); opacity: .88; }
}
.hex-kicker { font-size: 11.5px; fill: rgba(255,255,255,.5); letter-spacing: .08em; }
.hex-core-name {
    font-family: var(--font-tiane); font-size: 19px; font-weight: 700; fill: #fff;
    text-shadow: 0 0 18px rgba(0,229,200,.55);
}

/* 六个板块节点：错峰入场 + hover 放大 */
.hex-node circle {
    transform-box: fill-box;
    transform-origin: center;
    transition: transform .3s var(--ease), stroke-opacity .3s var(--ease);
}
.hex-node text { pointer-events: none; }
.hex-node { cursor: default; }
.hex-node:hover circle {
    transform: scale(1.09);
    stroke-opacity: .95;
}
/* 字号由 SVG 元素上的 font-size 属性控制（CSS 里不再写 font-size，
   否则会覆盖属性值，导致长名按默认 13px 渲染、冲出圆圈） */
.hex-name {
    font-family: var(--font-tiane); font-weight: 600; fill: #fff;
}
.hex-tag {
    font-family: var(--font-tiane); font-size: 11.5px; font-weight: 600;
    opacity: .92; letter-spacing: .06em;
}
/* 节点按角度错峰入场 */
.hex-node { animation: hex-in .6s var(--ease) both; }
.hex-node:nth-of-type(1) { animation-delay: .05s; }
.hex-node:nth-of-type(2) { animation-delay: .12s; }
.hex-node:nth-of-type(3) { animation-delay: .19s; }
.hex-node:nth-of-type(4) { animation-delay: .26s; }
.hex-node:nth-of-type(5) { animation-delay: .33s; }
.hex-node:nth-of-type(6) { animation-delay: .40s; }
@keyframes hex-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* 动效提速：首屏激光/ 扫掠周期缩短（原 4.5s / 7s → 3s / 4.5s） */
.hero-slide .laser-sweep { animation-duration: 3s; }
.hero-slide .laser-diag  { animation-duration: 4.5s; }

/* ---------- 辐射图 V3：提亮 + 拉开间距 ---------- */
/* 圆形节点：填充更实、描边更亮、加内发光，深底上清晰可见 */
.hex-node circle {
    fill-opacity: 1;
    filter: drop-shadow(0 0 14px rgba(255, 255, 255, .10));
}

/* 板块名与副标拉开间距：原来 17px 太挤，改24px */
.hex-tag {
    font-size: 12.5px;
    font-weight: 700;
    opacity: 1;
    letter-spacing: .08em;
}
/* 两行名称的节点：副标再往下压一点，避免与第二行贴住 */
.hex-node text.hex-tag { transform: translateY(5px); }

/* 单行名称的节点：副标位置由 SVG y 控制，这里只调字重 */
.hex-name { font-weight: 600; }

/* 中心：底座文字间距也拉开 */
.hex-kicker { font-size: 12px; letter-spacing: .1em; }
.hex-core-name { font-size: 20px; }

/* 放射虚线更亮更密，速度感更强 */
.hex-ray {
    stroke-width: 1.4;
    stroke-dasharray: 4 4;
    animation: hex-ray-flow .9s linear infinite;
}
@keyframes hex-ray-flow {
    0%   { stroke-dashoffset: 0;   opacity: .5; }
    50%  { opacity: .95; }
    100% { stroke-dashoffset: -32; opacity: .5; }
}

/* ---------- 辐射图 V4：提亮 + 定字归位 ---------- */
/* 1) 副标取消 transform 位移（导致「定制」出圈），改由 SVG y 精确控制 */
.hex-node text.hex-tag { transform: none; }

/* 2) 整体提亮：所有节点圆加重发光 + 描边更亮 */
.hex-node circle {
    fill-opacity: 1;
    filter:
        drop-shadow(0 0 10px rgba(255,255,255,.16))
        drop-shadow(0 0 22px rgba(0,229,200,.16));
}

/* 3) 板块名与副标都提亮（原来白字偏灰） */
.hex-node .hex-name {
    fill: #FFFFFF;
    text-shadow: 0 0 14px rgba(0,0,0,.55);
}
.hex-node .hex-tag {
    text-shadow: 0 0 12px currentColor;
}

/* 4) 中心圆与文字提亮 */
.hex-core circle {
    filter: drop-shadow(0 0 18px rgba(0,229,200,.30));
}
.hex-kicker { fill: rgba(255,255,255,.72); }
.hex-core-name {
    fill: #FFFFFF;
    text-shadow: 0 0 22px rgba(0,229,200,.75);
}
/* 中心「企业自己的资产」也要亮 */
.hex-core .hex-kicker:last-of-type { fill: rgba(255,255,255,.66); }

/* 5) 放射虚线更亮 */
.hex-ray { stroke-opacity: .85; }

/* ---------- 中心字底光晕：一个大脑+ 七部门共用 ---------- */
.core-halo {
    transform-box: fill-box;
    transform-origin: center;
    animation: core-halo 2.4s ease-in-out infinite;
}
@keyframes core-halo {
    0%, 100% { opacity: .85; transform: scale(1); }
    50%      { opacity: 1;   transform: scale(1.06); }
}

/* 光晕收敛：scale 幅度减小，避免呼吸时扩出中心圆 */
.core-halo { animation: core-halo 2.4s ease-in-out infinite; }
@keyframes core-halo {
    0%, 100% { opacity: .82; transform: scale(1); }
    50%      { opacity: 1;   transform: scale(1.04); }
}





/* ============================================================
   V8.9 进度条与内容的分层（终版）
   核心问题：内容高的视口（如 1024×768 矮笔记本）装不下 Slide 03/04，
             进度条（absolute bottom:36）会压住内容底部。
   解法（不裁切、不缩字）：
   ① .hero-slide 底部留位用 CSS 变量 --hero-pad-b，随视口高度自适应：
        视口够高（≥820px）→ 84px（进度条浮在底部下方，不碰内容）
        视口矮          → 0（进度条叠在内容上层，但加了渐变遮罩，
                            内容从底下淡出，视觉上不冲突）
   ② .hero-progress 加一层从下往上的深色渐变背景，内容滚到底时自然隐没。
   ============================================================ */
/* 底部渐变遮罩：内容滚到进度条下面时自然隐没。
   只做很窄的一条（贴着进度条本体），不要铺开成大色块。 */
.hero-progress::before {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% + 64px);
    bottom: -20px; top: -22px;
    background: linear-gradient(to top, rgba(22, 18, 74, .55), rgba(22, 18, 74, 0));
    pointer-events: none;
    z-index: -1;
    filter: blur(6px);
}

:root { --hero-pad-b: 84px; }
@media (max-height: 820px) and (min-width: 981px) {
    /* 矮笔记本（1024×768 等）：可用内容区装不下 Slide 03/04（内容 541~668px，
       而视口只剩 ~460px），进度条浮在面板底部必然压住最后一行。
       修法（不裁切、不缩字）：
         ① 面板按内容撑开，页面自然滚动
         ② .hero-slide 底部不留位 → 内容完整
         ③ 进度条改为「固定在视口底部」：脱离面板的文档流，
            永远不覆盖内容，滚动时始终可见可点
       ≥820px 视口仍走「进度条浮在面板底部、首屏完整展示」的方案。 */
    :root { --hero-pad-b: 0px; }
    .hero-carousel {
        height: auto;
        padding-bottom: 36px;
    }
    .hero-progress {
        position: fixed;
        bottom: 24px;
        left: 50%;
        transform: translateX(-50%);
        z-index: 40;
    }
    .hero-progress::before {
        display: none;
    }
}

/* ============================================================
   solve-slide.css — Hero Slide 02「我们能帮你解决什么」
   2026-11-06 · 三类客户分层（中大企业 / 中小企业 / 个人）
   2026-11-07 · 修：上一行漏了注释收尾符号，导致下面整段 .solve-slide
                 规则被当成注释吞掉（浏览器不报错、只是静默失效），
                 副标题与三张卡片之间因此 0 间距 = 视觉挤成一团。
   ============================================================ */
.solve-slide {
    display: grid;
    grid-template-rows: auto 1fr;
    /* 标题区与三张卡片之间的呼吸空间：2026-11-07 由 22px 加到 40px，
       把三块内容整体往下推，别贴着副标题。 */
    gap: 40px;
    width: 100%;
    max-width: var(--container);
    margin: 0 auto;
    padding: 0 32px;
    position: relative;
    z-index: 2;
    align-self: start;
}

/* 顶部标题区 */
.solve-head { text-align: left; }
.solve-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 6px 18px;
    border-radius: var(--r-full);
    border: 1.5px solid rgba(0, 229, 200, .45);
    background: linear-gradient(120deg, rgba(0, 229, 200, .18) 0%, rgba(139, 92, 246, .16) 100%);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .04em;
    color: var(--text-1);
    margin-bottom: 20px;
}
.solve-kicker .dot {
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--c-cyan);
    box-shadow: 0 0 10px var(--c-cyan);
}
.solve-kicker .en { color: var(--c-cyan); font-size: 11.5px; letter-spacing: .12em; }
.solve-kicker .cn { color: var(--text-1); }
.solve-kicker .sep {
    width: 1px; height: 13px; background: rgba(255,255,255,.22);
}

.solve-title {
    font-size: clamp(28px, 2.9vw, 42px);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: .01em;
    color: #fff;
    margin: 0 0 14px;
}
.solve-title .hl { color: var(--c-cyan); }
.solve-sub {
    font-size: clamp(15px, 1.25vw, 17px);
    color: var(--text-2);
    line-height: 1.6;
    max-width: 1120px;
    margin: 0;
}
.solve-sub b { color: var(--text-1); font-weight: 700; }

/* 三张痛点卡 */
.solve-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    align-items: stretch;
}
.solve-card {
    position: relative;
    /* 2026-11-07：卡片内边距 18/19/17 → 22/21/19，三块内容不再挤成一坨 */
    padding: 22px 21px 19px;
    border-radius: var(--r-lg);
    background: linear-gradient(160deg, rgba(255,255,255,.055), rgba(255,255,255,.018));
    border: 1px solid var(--bd-1);
    border-top: 3px solid var(--c-cyan);
    overflow: hidden;
    transition: transform .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.solve-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 44px rgba(0, 0, 0, .38);
}
.solve-card::after {
    content: '';
    position: absolute;
    right: -40px; top: -40px;
    width: 150px; height: 150px;
    border-radius: 50%;
    background: radial-gradient(circle, var(--card-glow, rgba(0,229,200,.16)), transparent 68%);
    pointer-events: none;
}
.solve-card--c { border-top-color: #00E5C8; --card-glow: rgba(0,229,200,.18); }
.solve-card--p { border-top-color: #A78BFA; --card-glow: rgba(139,92,246,.20); }
.solve-card--k { border-top-color: #FF4D8F; --card-glow: rgba(255,77,143,.17); }

/* 编号 + 客户分层标签 同一行（编号在左） */
.solve-card-top {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
}

/* 客户分层标签：面向中大企业 / 中小企业 / 个人 */
.solve-who {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: .03em;
    white-space: nowrap;
}
.solve-card--c .solve-who { background: rgba(0,229,200,.14); color: #00E5C8; border: 1px solid rgba(0,229,200,.38); }
.solve-card--p .solve-who { background: rgba(139,92,246,.16); color: #C4A7FF; border: 1px solid rgba(139,92,246,.42); }
.solve-card--k .solve-who { background: rgba(255,77,143,.14); color: #FF8AB5; border: 1px solid rgba(255,77,143,.38); }

.solve-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px; height: 30px;
    border-radius: 50%;
    font-size: 14px;
    font-weight: 800;
    color: #06122E;
    flex: 0 0 auto;
    position: relative;
    z-index: 1;
}
.solve-card--c .solve-num { background: linear-gradient(135deg, #00E5C8, #5FF0DC); box-shadow: 0 0 18px rgba(0,229,200,.42); }
.solve-card--p .solve-num { background: linear-gradient(135deg, #8B5CF6, #C4A7FF); color: #fff; box-shadow: 0 0 18px rgba(139,92,246,.42); }
.solve-card--k .solve-num { background: linear-gradient(135deg, #FF4D8F, #FF8AB5); box-shadow: 0 0 18px rgba(255,77,143,.42); }

.solve-card h3 {
    margin: 0 0 9px;
    font-size: clamp(16.5px, 1.36vw, 19px);
    font-weight: 800;
    line-height: 1.45;
    color: #fff;
    position: relative;
    z-index: 1;
}
.solve-tag {
    display: block;
    font-size: 13.5px;
    font-weight: 700;
    margin-bottom: 11px;
    letter-spacing: .01em;
    position: relative;
    z-index: 1;
}
.solve-card--c .solve-tag { color: #00E5C8; }
.solve-card--p .solve-tag { color: #C4A7FF; }
.solve-card--k .solve-tag { color: #FF8AB5; }

.solve-card p {
    margin: 0;
    font-size: 13px;
    line-height: 1.72;
    color: var(--text-2);
    position: relative;
    z-index: 1;
}
.solve-card p b { color: #fff; font-weight: 700; }

/* 卡内底部小标签 */
.solve-card-foot {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
    padding-top: 14px;
    border-top: 1px solid rgba(255,255,255,.09);
    position: relative;
    z-index: 1;
}
.solve-card-foot span {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--text-3);
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.055);
    border: 1px solid rgba(255,255,255,.09);
}

/* 底部一行 CTA */
.solve-foot {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--bd-1);
}
.solve-foot-txt {
    font-size: 14.5px;
    color: var(--text-3);
}
.solve-foot-txt b { color: var(--c-cyan); font-weight: 700; }

@media (max-width: 980px) {
    .solve-grid { grid-template-columns: 1fr; gap: 14px; }
    .solve-card { padding: 20px 18px; }
}

/* 矮笔记本（1024×768 等，min-width 981 起）：进度条在这个高度区间是
   position:fixed 贴在视口底部的，会压住 Slide 02 卡片底部。
   窄桌面下卡片更窄、正文折行更多（6 行 vs 3 行），卡片更高，
   2026-11-07 在这里单独收紧间距，保证卡片底部不被进度条盖住。 */
@media (max-height: 820px) and (min-width: 981px) {
    .solve-slide { gap: 26px; }
    .solve-card { padding: 18px 18px 15px; }
    .solve-card-top { margin-bottom: 11px; }
    .solve-card h3 { margin-bottom: 7px; }
    .solve-tag { margin-bottom: 8px; }
    .solve-card p { line-height: 1.58; }
    .solve-card-foot { margin-top: 12px; padding-top: 11px; }
}