/* 
 * 富青会展云 - 设计系统
 * Neo-Tech Fusion 美学方向
 * 深邃科技感 + 东方商务稳重
 */

/* ==========================================
   CSS变量 - 设计令牌
   ========================================== */

:root {
    /* 色彩系统 */
    --color-bg-primary: #0a0a0f;
    --color-bg-secondary: #0f0f18;
    --color-bg-tertiary: #14141f;
    --color-bg-card: rgba(20, 20, 35, 0.7);
    --color-bg-glass: rgba(255, 255, 255, 0.03);

    /* 主色调 - 科技蓝 (专业与信任) */
    --color-primary: #4858ff;
    --color-primary-light: #6b7aff;
    --color-primary-dark: #3a47cc;
    --color-primary-glow: rgba(72, 88, 255, 0.35);

    /* 能力分类色：仅用于信息归类，不替代品牌主色 CTA */
    --color-capability-insight: #22d3ee;
    --color-capability-management: #6096ff;
    --color-capability-match: #9d72f6;
    --color-capability-decision: #f05f99;
    --rgb-capability-insight: 34, 211, 238;
    --rgb-capability-management: 96, 150, 255;
    --rgb-capability-match: 157, 114, 246;
    --rgb-capability-decision: 240, 95, 153;

    /* 辅助色 */
    --color-accent-cyan: #00d4ff;
    --color-accent-purple: #a855f7;
    --color-accent-green: #10b981;

    /* 文字色彩 */
    --color-text-primary: #ffffff;
    --color-text-secondary: rgba(255, 255, 255, 0.7);
    --color-text-muted: rgba(255, 255, 255, 0.5);
    --color-text-subtle: rgba(255, 255, 255, 0.3);

    /* 边框与分割线 */
    --color-border: rgba(255, 255, 255, 0.1);
    --color-border-hover: rgba(255, 255, 255, 0.2);

    /* 字体系统 */
    --font-display: 'Space Grotesk', 'Noto Sans SC', system-ui, sans-serif;
    --font-body: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', system-ui, sans-serif;
    --font-mono: 'JetBrains Mono', 'Fira Code', monospace;

    /* 字号比例 */
    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.5rem;
    --text-3xl: 1.875rem;
    --text-4xl: 2.25rem;
    --text-5xl: 3rem;
    --text-6xl: 3.75rem;
    --text-7xl: 4.5rem;

    /* 间距系统 (8px基准) */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;
    --space-24: 6rem;
    --space-32: 8rem;

    /* 圆角 */
    --radius-sm: 0.25rem;
    --radius-md: 0.5rem;
    --radius-lg: 0.75rem;
    --radius-xl: 1rem;
    --radius-2xl: 1.5rem;
    --radius-full: 9999px;

    /* 阴影 */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.4);
    --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.5);
    --shadow-glow: 0 0 40px var(--color-primary-glow);

    /* 过渡 */
    --transition-fast: 150ms ease;
    --transition-base: 250ms ease;
    --transition-slow: 350ms ease;
    --transition-slower: 500ms ease;

    /* 层级 */
    --z-dropdown: 100;
    --z-sticky: 200;
    --z-modal: 300;
    --z-toast: 400;

    /* 容器宽度 */
    --container-sm: 640px;
    --container-md: 768px;
    --container-lg: 1024px;
    --container-xl: 1280px;
    --container-2xl: 1440px;
}

/* ==========================================
   基础重置
   ========================================== */

*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-family: var(--font-body);
    font-size: var(--text-base);
    line-height: 1.6;
    color: var(--color-text-primary);
    background: var(--color-bg-primary);
    min-height: 100vh;
    overflow-x: hidden;
}

img,
video,
svg {
    display: block;
    max-width: 100%;
    height: auto;
}

a {
    color: inherit;
    text-decoration: none;
}

button {
    font-family: inherit;
    cursor: pointer;
    border: none;
    background: none;
}

ul,
ol {
    list-style: none;
}

/* ==========================================
   容器与布局
   ========================================== */

.container {
    width: 100%;
    max-width: var(--container-xl);
    margin: 0 auto;
    padding: 0 var(--space-6);
}

.container--narrow {
    max-width: var(--container-lg);
}

.container--wide {
    max-width: var(--container-2xl);
}

.section {
    padding: var(--space-24) 0;
    position: relative;
}

.section--hero {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: 80px;
}

/* Flex工具类 */
.flex {
    display: flex;
}

.flex-col {
    flex-direction: column;
}

.flex-wrap {
    flex-wrap: wrap;
}

.items-center {
    align-items: center;
}

.items-start {
    align-items: flex-start;
}

.items-end {
    align-items: flex-end;
}

.justify-center {
    justify-content: center;
}

.justify-between {
    justify-content: space-between;
}

.justify-around {
    justify-content: space-around;
}

.gap-2 {
    gap: var(--space-2);
}

.gap-4 {
    gap: var(--space-4);
}

.gap-6 {
    gap: var(--space-6);
}

.gap-8 {
    gap: var(--space-8);
}

/* Grid工具类 */
.grid {
    display: grid;
}

.grid-cols-1 {
    grid-template-columns: repeat(1, 1fr);
}

.grid-cols-2 {
    grid-template-columns: repeat(2, 1fr);
}

.grid-cols-3 {
    grid-template-columns: repeat(3, 1fr);
}

/* ==========================================
   导航栏
   ========================================== */

.navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: var(--z-sticky);
    padding: var(--space-4) 0;
    transition: background var(--transition-base), -webkit-backdrop-filter var(--transition-base), backdrop-filter var(--transition-base);
}

.navbar--scrolled {
    background: rgba(10, 10, 15, 0.9);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--color-border);
}

.navbar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.navbar__logo {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    font-family: var(--font-display);
    font-size: var(--text-xl);
    font-weight: 700;
}

.navbar__logo-icon {
    width: 40px;
    height: 40px;
}

.navbar__nav {
    display: flex;
    align-items: center;
    gap: var(--space-8);
}

.navbar__link {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    transition: color var(--transition-fast);
    position: relative;
}

.navbar__link::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--color-primary);
    transition: width var(--transition-base);
}

.navbar__link:hover {
    color: var(--color-text-primary);
}

.navbar__link:hover::after {
    width: 100%;
}

.navbar__product-menu {
    position: relative;
}

.navbar__product-menu details {
    position: relative;
}

.navbar__product-menu summary {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    list-style: none;
}

.navbar__product-menu summary::-webkit-details-marker {
    display: none;
}

.navbar__chevron {
    width: 6px;
    height: 6px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: translateY(-2px) rotate(45deg);
    transition: transform var(--transition-fast);
}

.navbar__product-menu details[open] .navbar__chevron {
    transform: translateY(1px) rotate(225deg);
}

.navbar__product-dropdown {
    position: absolute;
    top: calc(100% + 16px);
    left: -18px;
    z-index: calc(var(--z-sticky) + 1);
    width: 224px;
    margin: 0;
    padding: var(--space-2);
    list-style: none;
    border: 1px solid var(--color-border);
    border-radius: 12px;
    background: rgba(17, 17, 27, 0.96);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.28);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
}

.navbar__product-dropdown a {
    display: block;
    padding: 10px 12px;
    border-radius: 8px;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: 1.35;
    transition: color var(--transition-fast), background var(--transition-fast);
}

.navbar__product-dropdown a:hover,
.navbar__product-dropdown a:focus-visible {
    color: var(--color-text-primary);
    background: rgba(79, 70, 229, 0.14);
    outline: none;
}

.navbar__product-dropdown a.navbar__product-link--active {
    color: var(--color-primary);
    background: rgba(79, 70, 229, 0.08);
}

.navbar__product-menu--active .navbar__link {
    color: var(--color-primary);
}

.navbar__product-menu--active .navbar__link::after {
    width: 100%;
}

.navbar__actions {
    display: flex;
    align-items: center;
    gap: var(--space-4);
}

.language-toggle {
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    font-weight: 600;
    white-space: nowrap;
}

.language-toggle:hover {
    color: var(--color-primary);
}

.navbar__toggle {
    display: none;
    width: 32px;
    height: 32px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
}

.navbar__toggle span {
    display: block;
    width: 24px;
    height: 2px;
    background: var(--color-text-primary);
    transition: transform var(--transition-base), opacity var(--transition-base);
    transform-origin: center;
}

.navbar__toggle.active span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.navbar__toggle.active span:nth-child(2) {
    opacity: 0;
}

.navbar__toggle.active span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

/* ==========================================
   按钮系统
   ========================================== */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-6);
    font-size: var(--text-sm);
    font-weight: 600;
    border-radius: var(--radius-lg);
    transition: all var(--transition-base);
    position: relative;
    overflow: hidden;
}

.btn::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), transparent);
    opacity: 0;
    transition: opacity var(--transition-base);
}

.btn:hover::before {
    opacity: 1;
}

/* 主要按钮 */
.btn--primary {
    background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
    color: #ffffff;
    box-shadow: var(--shadow-md), 0 0 20px var(--color-primary-glow);
}

.btn--primary:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg), 0 0 30px var(--color-primary-glow);
}

/* 描边按钮 */
.btn--outline {
    background: transparent;
    color: var(--color-text-primary);
    border: 1px solid var(--color-border);
}

.btn--outline:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
    background: rgba(72, 88, 255, 0.1);
}

/* 大尺寸按钮 */
.btn--lg {
    padding: var(--space-4) var(--space-8);
    font-size: var(--text-base);
    border-radius: var(--radius-xl);
}

/* ==========================================
   Hero区域
   ========================================== */

.hero {
    position: relative;
    overflow: hidden;
}

.hero__canvas {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.hero__canvas canvas {
    width: 100% !important;
    height: 100% !important;
}

.hero__overlay {
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at center bottom, transparent 0%, var(--color-bg-primary) 70%);
    z-index: 1;
    pointer-events: none;
}

.hero__content {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 900px;
    margin: 0 auto;
}

/* Badge with glow effect */
.hero__badge {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background: var(--color-bg-glass);
    border: 1px solid rgba(72, 88, 255, 0.3);
    border-radius: var(--radius-full);
    font-size: var(--text-sm);
    color: var(--color-primary-light);
    margin-bottom: var(--space-6);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    box-shadow: 0 0 20px rgba(72, 88, 255, 0.2);
    animation: badge-glow 3s ease-in-out infinite;
}

@keyframes badge-glow {

    0%,
    100% {
        box-shadow: 0 0 20px rgba(72, 88, 255, 0.2);
    }

    50% {
        box-shadow: 0 0 30px rgba(72, 88, 255, 0.4);
    }
}

.hero__star {
    animation: star-pulse 2s infinite ease-in-out;
    transform-origin: center;
    color: var(--color-accent-cyan);
}

@keyframes star-pulse {

    0%,
    100% {
        opacity: 1;
        transform: scale(1) rotate(0deg);
    }

    50% {
        opacity: 0.7;
        transform: scale(0.9) rotate(15deg);
    }
}

/* Enhanced title with animated gradient */
.hero__title {
    font-family: var(--font-display);
    font-size: clamp(var(--text-4xl), 6vw, var(--text-7xl));
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: var(--space-6);
    background: linear-gradient(135deg,
            var(--color-text-primary) 0%,
            var(--color-primary-light) 50%,
            var(--color-accent-cyan) 100%);
    background-size: 200% 200%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: title-gradient 8s ease-in-out infinite;
}

@keyframes title-gradient {

    0%,
    100% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }
}

.hero__subtitle {
    font-size: var(--text-lg);
    color: var(--color-text-secondary);
    line-height: 1.7;
    margin-bottom: var(--space-10);
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

/* CTA with glow effect on primary button */
.hero__cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-4);
    flex-wrap: wrap;
}

.hero__cta .btn--primary {
    box-shadow: 0 0 30px rgba(72, 88, 255, 0.4);
    transition: all var(--transition-base);
}

.hero__cta .btn--primary:hover {
    box-shadow: 0 0 50px rgba(72, 88, 255, 0.6);
    transform: translateY(-2px);
}

/* Enhanced 信任栏 */
.trust-bar {
    margin-top: var(--space-16);
    padding-top: var(--space-8);
    border-top: 1px solid var(--color-border);
    position: relative;
}

.trust-bar::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translateX(-50%);
    width: 100px;
    height: 2px;
    background: linear-gradient(90deg, var(--color-primary), var(--color-accent-cyan));
    border-radius: 1px;
}

.trust-bar__label {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    text-align: center;
    margin-bottom: var(--space-6);
}

.trust-bar__label strong {
    color: var(--color-primary-light);
    font-weight: 700;
}

/* Marquee scrolling effect */
.trust-bar__marquee {
    position: relative;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, white 5%, white 95%, transparent);
    mask-image: linear-gradient(90deg, transparent, white 5%, white 95%, transparent);
}

.trust-bar__track {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    width: max-content;
    animation: marquee-scroll 60s linear infinite;
}

.trust-bar__track:hover {
    animation-play-state: paused;
}

@keyframes marquee-scroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

.trust-bar__item {
    flex-shrink: 0;
    position: relative;
    padding: var(--space-2) var(--space-4);
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    white-space: nowrap;
    transition: all var(--transition-base);
}

/* Dot separator */
.trust-bar__item::after {
    content: '•';
    position: absolute;
    right: calc(var(--space-3) * -1 - 0.25em);
    color: var(--color-primary);
    opacity: 0.5;
}

.trust-bar__item:hover {
    color: var(--color-primary-light);
}

/* ==========================================
   痛点卡片
   ========================================== */

/* Pain Points Background - Now Shared */

.pain-points::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(239, 68, 68, 0.3), transparent);
}

.pain-points .container {
    position: relative;
    z-index: 2;
}

.pain-points__header {
    text-align: center;
    margin-bottom: var(--space-16);
}

.pain-points__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6);
}

/* 行业痛点：场景与转变同时呈现，避免依赖翻转交互 */
.challenge-card {
    --challenge-rgb: 72, 88, 255;
    position: relative;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    min-height: 400px;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-2xl);
    background: var(--color-bg-card);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    transition: transform var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base);
}

.challenge-card--operations {
    --challenge-rgb: var(--rgb-capability-management);
}

.challenge-card--matching {
    --challenge-rgb: var(--rgb-capability-match);
}

.challenge-card--assets {
    --challenge-rgb: var(--rgb-capability-insight);
}

.challenge-card::before {
    display: none;
}

.challenge-card:hover {
    transform: translateY(-4px);
    border-color: rgba(var(--challenge-rgb), 0.54);
    box-shadow: 0 14px 28px rgba(3, 7, 18, 0.24), 0 0 16px rgba(var(--challenge-rgb), 0.1);
}

.challenge-card__problem {
    position: relative;
    z-index: 1;
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: var(--space-8);
    border-bottom: 1px solid rgba(var(--challenge-rgb), 0.22);
}

.challenge-card__number {
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    color: rgba(var(--challenge-rgb), 0.95);
}

.challenge-card__icon {
    display: grid;
    width: 52px;
    height: 52px;
    margin: var(--space-4) 0 var(--space-5);
    padding: 13px;
    place-items: center;
    border: 1px solid rgba(var(--challenge-rgb), 0.48);
    border-radius: var(--radius-xl);
    background: rgba(var(--challenge-rgb), 0.14);
    color: rgb(var(--challenge-rgb));
}

.challenge-card__icon svg {
    width: 100%;
    height: 100%;
}

.challenge-card h3,
.challenge-card h4 {
    margin: 0;
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--color-text-primary);
}

.challenge-card h3 {
    margin-top: var(--space-5);
    font-size: var(--text-xl);
    line-height: 1.45;
}

.challenge-card__problem p {
    margin: var(--space-3) 0 0;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: 1.8;
}

.challenge-card__answer {
    position: relative;
    z-index: 1;
    margin: auto 0 0;
    padding: var(--space-6) var(--space-8);
    background: rgba(255, 255, 255, 0.025);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.challenge-card__answer-label {
    display: block;
    margin-top: var(--space-4);
    padding-top: var(--space-3);
    border-top: 1px solid rgba(var(--challenge-rgb), 0.18);
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.9375rem;
    font-weight: 650;
    line-height: 1.45;
}

.challenge-card__answer-arrow {
    display: inline-block;
    width: 1.05em;
    height: 1.05em;
    margin-right: 0.42em;
    vertical-align: -0.14em;
    color: rgb(var(--challenge-rgb));
}

.challenge-card__answer h4 {
    display: inline-flex;
    margin-top: var(--space-3);
    padding: 0.28rem 0.55rem;
    border: 1px solid rgba(var(--challenge-rgb), 0.3);
    border-radius: 999px;
    background: rgba(var(--challenge-rgb), 0.1);
    color: rgba(var(--challenge-rgb), 0.96);
    font-size: var(--text-sm);
    line-height: 1.25;
}

.challenge-card__answer p {
    margin: var(--space-2) 0 0;
    color: rgba(255, 255, 255, 0.76);
    font-size: var(--text-sm);
    line-height: 1.7;
}

.pain-card {
    position: relative;
    height: 380px;
    perspective: 1000px;
    cursor: pointer;
}

.pain-card__inner {
    position: relative;
    width: 100%;
    height: 100%;
    transition: transform 0.6s;
    transform-style: preserve-3d;
}

.pain-card:hover .pain-card__inner {
    transform: rotateY(180deg);
}

.pain-card:hover .pain-card__front {
    box-shadow: 0 0 40px var(--color-primary-glow), 0 0 80px rgba(72, 88, 255, 0.15);
}

.pain-card:hover .pain-card__back {
    box-shadow: 0 0 40px var(--color-primary-glow), 0 0 80px rgba(72, 88, 255, 0.2);
}

.pain-card__front,
.pain-card__back {
    position: absolute;
    inset: 0;
    padding: var(--space-8);
    border-radius: var(--radius-2xl);
    backface-visibility: hidden;
    display: flex;
    flex-direction: column;
}

.pain-card__front {
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
}

.pain-card__back {
    background: linear-gradient(135deg, var(--color-bg-tertiary), var(--color-bg-card));
    border: 1px solid var(--color-primary);
    transform: rotateY(180deg);
    justify-content: center;
}

.pain-card__icon {
    width: 64px;
    height: 64px;
    margin-bottom: var(--space-6);
    padding: var(--space-4);
    background: var(--color-bg-glass);
    border-radius: var(--radius-xl);
    color: var(--color-primary);
}

.pain-card__icon svg {
    width: 100%;
    height: 100%;
}

.pain-card__label {
    font-size: var(--text-sm);
    color: var(--color-primary);
    font-weight: 600;
    margin-bottom: var(--space-2);
}

.pain-card__title {
    font-family: var(--font-display);
    font-size: var(--text-2xl);
    font-weight: 700;
    margin-bottom: var(--space-4);
}

.pain-card__desc {
    color: var(--color-text-secondary);
    line-height: 1.7;
}

.pain-card__solution {
    font-size: var(--text-base);
    color: var(--color-text-primary);
    line-height: 1.8;
    text-align: left;
}

.pain-card__solution strong {
    display: block;
    font-family: var(--font-display);
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--color-primary-light);
    margin-bottom: var(--space-3);
    text-align: center;
}

/* ==========================================
   解决方案金字塔
   ========================================== */

/* Shared Background for Pain Points and Stats */
.pain-points,
.stats {
    position: relative;
    background: var(--color-bg-secondary);
    overflow: hidden;
}

.pain-points::before,
.stats::before {
    display: none;
}

.parallax-bg {
    position: absolute;
    top: -20%;
    /* Extra height for scrolling */
    left: 0;
    width: 100%;
    height: 140%;
    background-image: url('https://image.chinafuturelink.com/attendees.jpg?imageView2/2/w/2000');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 0;
    will-change: transform;
}

.pain-points .parallax-bg {
    background-image: url('https://image.chinafuturelink.com/%E7%94%9F%E6%88%90%E5%B1%95%E4%BC%9A%E6%91%84%E5%BD%B1%E5%9B%BE.png?imageView2/2/w/2000');
}

/* Shared Mask Overlay */
.pain-points__mask,
.stats__mask {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
            rgba(10, 18, 36, 0.85) 0%,
            rgba(10, 18, 36, 0.9) 50%,
            rgba(10, 18, 36, 0.85) 100%);
    z-index: 1;
}

.solutions {
    position: relative;
    overflow: hidden;
}

.solutions__bg {
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at center, var(--color-bg-tertiary), var(--color-bg-primary));
    z-index: 0;
    overflow: hidden;
}

#solutions-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

/* 解决方案区背景 - 上升光束 */
.solutions::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    height: 100%;
    background: linear-gradient(to top, var(--color-primary), transparent);
    opacity: 0.2;
    z-index: 0;
}

.solutions::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, var(--color-primary-glow) 0%, transparent 70%);
    opacity: 0.15;
    z-index: 0;
}

.solutions__content {
    position: relative;
    z-index: 1;
}

.solutions__header {
    text-align: center;
    margin-bottom: var(--space-16);
}

.pyramid {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-6);
    max-width: 800px;
    margin: 0 auto;
}

.pyramid__layer {
    width: 100%;
    padding: var(--space-8);
    border-radius: var(--radius-2xl);
    text-align: center;
    transition: all var(--transition-base);
    position: relative;
    overflow: hidden;
}

.pyramid__layer::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(600px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
            rgba(255, 255, 255, 0.08),
            transparent 40%);
    opacity: 0;
    transition: opacity var(--transition-base);
    z-index: 1;
    pointer-events: none;
}

.pyramid__layer:hover::before {
    opacity: 1;
}

/* Hover Indicator - Top Right */
.pyramid__layer::after {
    content: '了解详情 →';
    position: absolute;
    top: var(--space-4);
    right: var(--space-4);
    padding: var(--space-2) var(--space-3);
    font-size: var(--text-xs);
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    background: rgba(0, 0, 0, 0.3);
    border-radius: var(--radius-full);
    opacity: 0;
    transform: translateX(10px);
    transition: opacity var(--transition-fast), transform var(--transition-fast);
    z-index: 10;
    pointer-events: none;
}

html[lang="en"] .pyramid__layer::after {
    content: 'Learn More →';
}

.pyramid__layer:hover::after {
    opacity: 1;
    transform: translateX(0);
}

.pyramid__layer:hover {
    transform: translateY(-4px);
    cursor: pointer;
}

.pyramid__layer--top {
    max-width: 55%;
    background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
    box-shadow: var(--shadow-glow), 0 20px 40px rgba(72, 88, 255, 0.3);
    z-index: 3;
}

.pyramid__layer--top:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: var(--shadow-glow), 0 30px 60px rgba(72, 88, 255, 0.4);
}

.pyramid__layer--top .pyramid__title,
.pyramid__layer--top .pyramid__desc,
.pyramid__layer--top .pyramid__tag {
    color: #ffffff;
}

.pyramid__layer--middle {
    max-width: 75%;
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.25), rgba(72, 88, 255, 0.08));
    border: 1px solid rgba(72, 88, 255, 0.4);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    z-index: 2;
}

.pyramid__layer--middle:hover {
    transform: translateY(-6px) scale(1.01);
    border-color: var(--color-primary);
    box-shadow: 0 0 30px var(--color-primary-glow);
}

.pyramid__layer--bottom {
    max-width: 95%;
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.08), var(--color-bg-card));
    border: 1px solid var(--color-border);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    z-index: 1;
}

.pyramid__layer--bottom:hover {
    transform: translateY(-4px);
    border-color: rgba(72, 88, 255, 0.5);
    box-shadow: 0 0 20px rgba(72, 88, 255, 0.15);
}

/* 层级连接线 */
.pyramid::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 2px;
    height: 80%;
    background: linear-gradient(to bottom, var(--color-primary), transparent);
    opacity: 0.2;
    z-index: 0;
}

.pyramid__tag {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--color-primary);
    margin-bottom: var(--space-2);
    padding: var(--space-1) var(--space-3);
    background: rgba(72, 88, 255, 0.1);
    border-radius: var(--radius-full);
}

.pyramid__layer--top .pyramid__tag {
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
}

.pyramid__title {
    font-family: var(--font-display);
    font-size: var(--text-2xl);
    font-weight: 700;
    margin-bottom: var(--space-3);
    transition: transform var(--transition-fast);
}

.pyramid__layer:hover .pyramid__title {
    transform: scale(1.02);
}

.pyramid__desc {
    color: var(--color-text-secondary);
    max-width: 500px;
    margin: 0 auto;
}

/* ==========================================
   首页四项核心能力
   ========================================== */

.core-capability-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-5);
    max-width: 1200px;
    margin: 0 auto;
}

.core-capability {
    --capability-tint: rgba(72, 88, 255, 0.16);
    --capability-glow: rgba(72, 88, 255, 0.22);
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 300px;
    padding: var(--space-8);
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-2xl);
    background: var(--color-bg-card);
    color: var(--color-text-primary);
    text-decoration: none;
    transition: transform var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base);
}

.core-capability::before {
    content: '';
    position: absolute;
    top: -70px;
    right: -50px;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    z-index: 0;
    background: radial-gradient(circle, var(--capability-glow), transparent 68%);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--transition-base);
}

.core-capability::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    border-radius: inherit;
    background: linear-gradient(145deg, var(--capability-tint), transparent 68%);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--transition-base);
}

.core-capability:hover {
    transform: translateY(-6px);
    border-color: rgba(72, 88, 255, 0.7);
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.32), 0 0 28px var(--color-primary-glow);
}

.core-capability:hover::before,
.core-capability:hover::after {
    opacity: 1;
}

.core-capability:focus-visible,
.scenario-overview__card:focus-visible {
    outline: 2px solid var(--color-primary-light);
    outline-offset: 4px;
}

.core-capability__eyebrow,
.core-capability__link {
    position: relative;
    z-index: 1;
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.core-capability__eyebrow {
    color: var(--color-primary-light);
}

.core-capability__icon {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin: var(--space-5) 0 var(--space-4);
    border: 1px solid rgba(72, 88, 255, 0.35);
    border-radius: 16px;
    background: rgba(72, 88, 255, 0.14);
    color: var(--color-primary-light);
}

.core-capability h3 {
    position: relative;
    z-index: 1;
    margin-bottom: var(--space-3);
    font-size: var(--text-xl);
    color: var(--color-text-primary);
}

.core-capability p {
    position: relative;
    z-index: 1;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: 1.75;
}

.core-capability__link {
    margin-top: auto;
    padding-top: var(--space-6);
    color: var(--color-primary-light);
    letter-spacing: 0;
    text-transform: none;
}

.core-capability--match {
    --capability-tint: rgba(var(--rgb-capability-match), 0.13);
    --capability-glow: rgba(var(--rgb-capability-match), 0.17);
}

.core-capability--infrastructure {
    --capability-tint: rgba(72, 88, 255, 0.11);
    --capability-glow: rgba(72, 88, 255, 0.15);
}

.core-capability--assets {
    --capability-tint: rgba(var(--rgb-capability-insight), 0.12);
    --capability-glow: rgba(var(--rgb-capability-insight), 0.16);
}

.core-capability--enrichment {
    --capability-tint: rgba(var(--rgb-capability-decision), 0.13);
    --capability-glow: rgba(var(--rgb-capability-decision), 0.16);
}

.core-capability--match .core-capability__icon { color: var(--color-capability-match); border-color: rgba(var(--rgb-capability-match), 0.38); background: rgba(var(--rgb-capability-match), 0.14); }
.core-capability--infrastructure .core-capability__icon { color: #818cf8; border-color: rgba(72, 88, 255, 0.32); background: rgba(72, 88, 255, 0.1); }
.core-capability--assets .core-capability__icon { color: var(--color-capability-insight); border-color: rgba(var(--rgb-capability-insight), 0.38); background: rgba(var(--rgb-capability-insight), 0.12); }
.core-capability--enrichment .core-capability__icon { color: var(--color-capability-decision); border-color: rgba(var(--rgb-capability-decision), 0.38); background: rgba(var(--rgb-capability-decision), 0.12); }

.core-capability--match .core-capability__eyebrow,
.core-capability--match .core-capability__link { color: var(--color-capability-match); }
.core-capability--infrastructure .core-capability__eyebrow,
.core-capability--infrastructure .core-capability__link { color: #818cf8; }
.core-capability--assets .core-capability__eyebrow,
.core-capability--assets .core-capability__link { color: var(--color-capability-insight); }
.core-capability--enrichment .core-capability__eyebrow,
.core-capability--enrichment .core-capability__link { color: var(--color-capability-decision); }

.core-capability--match:hover { border-color: rgba(var(--rgb-capability-match), 0.52); box-shadow: 0 14px 28px rgba(3, 7, 18, 0.24), 0 0 16px rgba(var(--rgb-capability-match), 0.1); }
.core-capability--infrastructure:hover { border-color: rgba(72, 88, 255, 0.6); box-shadow: 0 14px 28px rgba(3, 7, 18, 0.24), 0 0 16px rgba(72, 88, 255, 0.12); }
.core-capability--assets:hover { border-color: rgba(var(--rgb-capability-insight), 0.52); box-shadow: 0 14px 28px rgba(3, 7, 18, 0.24), 0 0 16px rgba(var(--rgb-capability-insight), 0.1); }
.core-capability--enrichment:hover { border-color: rgba(var(--rgb-capability-decision), 0.52); box-shadow: 0 14px 28px rgba(3, 7, 18, 0.24), 0 0 16px rgba(var(--rgb-capability-decision), 0.1); }

/* ==========================================
   数据背书
   ========================================== */

/* Stats Background - Now Shared */

/* 数据区背景 - 数据网格效果 */

.stats::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(0deg, transparent 49.5%, rgba(72, 88, 255, 0.03) 49.5%, rgba(72, 88, 255, 0.03) 50.5%, transparent 50.5%),
        linear-gradient(90deg, transparent 49.5%, rgba(72, 88, 255, 0.03) 49.5%, rgba(72, 88, 255, 0.03) 50.5%, transparent 50.5%);
    background-size: 100px 100px;
    animation: stats-grid-pulse 3s ease-in-out infinite;
    pointer-events: none;
    z-index: 2;
}

@keyframes stats-grid-pulse {

    0%,
    100% {
        opacity: 0.3;
    }

    50% {
        opacity: 0.6;
    }
}

.stats__map {
    position: absolute;
    inset: 0;
    opacity: 0.1;
    z-index: 0;
}

.stats__content {
    position: relative;
    z-index: 3;
}

.stats__header {
    text-align: center;
    margin-bottom: var(--space-16);
}

.stats__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-8);
}

.stat-card {
    text-align: center;
    padding: var(--space-8);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-2xl);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    transition: all var(--transition-base);
}

.stat-card:hover {
    border-color: var(--color-primary);
    box-shadow: 0 0 30px var(--color-primary-glow);
    transform: translateY(-4px);
}

.stat-card__number {
    font-family: var(--font-display);
    font-size: var(--text-5xl);
    font-weight: 700;
    color: var(--color-primary);
    line-height: 1;
    margin-bottom: var(--space-4);
}

.stat-card__label {
    font-size: var(--text-base);
    color: var(--color-text-secondary);
}

/* ==========================================
   AI能力图谱 Section
   ========================================== */

.ai-atlas {
    position: relative;
    overflow: hidden;
    background: var(--color-bg-primary);
}

.ai-atlas::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 60% 50% at 20% 20%, rgba(0, 242, 254, 0.06), transparent),
        radial-gradient(ellipse 50% 40% at 80% 30%, rgba(127, 0, 255, 0.06), transparent),
        radial-gradient(ellipse 40% 50% at 50% 80%, rgba(255, 0, 127, 0.04), transparent);
    pointer-events: none;
}

.ai-atlas .section-header {
    position: relative;
    z-index: 1;
}

.ai-atlas__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-6);
    margin-bottom: var(--space-12);
    position: relative;
    z-index: 1;
}

/* Card base */
.ai-atlas__card {
    position: relative;
    background: rgba(15, 23, 42, 0.4);
    /* Deep glass background */
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--radius-2xl);
    padding: var(--space-8);
    text-align: left;
    transition: all var(--transition-slow);
    overflow: hidden;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    display: flex;
    flex-direction: column;
}

.ai-atlas__card-bg {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity var(--transition-slow);
    pointer-events: none;
    z-index: 0;
}

.ai-atlas__card-content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.ai-atlas__card-header {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
}

.ai-atlas__icon {
    width: 56px;
    height: 56px;
    border-radius: var(--radius-xl);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform var(--transition-base);
    flex-shrink: 0;
}

.ai-atlas__title-group {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ai-atlas__name {
    font-family: var(--font-display);
    font-size: var(--text-xl);
    font-weight: 700;
    margin: 0;
    letter-spacing: 0.02em;
    color: var(--color-text-primary);
}

.ai-atlas__subtitle {
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    opacity: 0.7;
}

.ai-atlas__desc {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.ai-atlas__features {
    list-style: none;
    padding: 0;
    margin: 0;
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    padding-top: var(--space-5);
}

.ai-atlas__features li {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    display: flex;
    align-items: center;
    gap: var(--space-3);
    transition: color var(--transition-fast), transform var(--transition-fast);
}

.ai-atlas__feature-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
    opacity: 0.5;
    box-shadow: 0 0 10px currentColor;
    transition: opacity var(--transition-fast), transform var(--transition-fast);
}

/* Hover Effects */
.ai-atlas__card:hover {
    transform: translateY(-8px);
    border-color: rgba(255, 255, 255, 0.15);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
}

.ai-atlas__card:hover .ai-atlas__card-bg {
    opacity: 1;
}

.ai-atlas__card:hover .ai-atlas__icon {
    transform: scale(1.1) rotate(5deg);
}

.ai-atlas__card:hover .ai-atlas__features li {
    color: var(--color-text-primary);
    transform: translateX(4px);
}

.ai-atlas__card:hover .ai-atlas__feature-dot {
    opacity: 1;
    transform: scale(1.2);
}

/* ---- Theme: Insight (洞察) ---- */
.ai-atlas__card--insight .ai-atlas__card-bg {
    background: radial-gradient(circle at top right, rgba(0, 242, 254, 0.15), transparent 70%);
}

.ai-atlas__card--insight:hover {
    border-color: rgba(0, 242, 254, 0.3);
}

.ai-atlas__card--insight .ai-atlas__icon {
    color: #00F2FE;
    background: rgba(0, 242, 254, 0.1);
    box-shadow: inset 0 0 20px rgba(0, 242, 254, 0.1);
}

.ai-atlas__card--insight .ai-atlas__subtitle {
    color: #00F2FE;
}

.ai-atlas__card--insight .ai-atlas__feature-dot {
    color: #00F2FE;
}

/* ---- Theme: Management (管理) ---- */
.ai-atlas__card--management .ai-atlas__card-bg {
    background: radial-gradient(circle at top right, rgba(79, 172, 254, 0.15), transparent 70%);
}

.ai-atlas__card--management:hover {
    border-color: rgba(79, 172, 254, 0.3);
}

.ai-atlas__card--management .ai-atlas__icon {
    color: #4FACFE;
    background: rgba(79, 172, 254, 0.1);
    box-shadow: inset 0 0 20px rgba(79, 172, 254, 0.1);
}

.ai-atlas__card--management .ai-atlas__subtitle {
    color: #4FACFE;
}

.ai-atlas__card--management .ai-atlas__feature-dot {
    color: #4FACFE;
}

/* ---- Theme: Matchmaking (匹配) ---- */
.ai-atlas__card--matchmaking .ai-atlas__card-bg {
    background: radial-gradient(circle at top right, rgba(168, 85, 247, 0.15), transparent 70%);
}

.ai-atlas__card--matchmaking:hover {
    border-color: rgba(168, 85, 247, 0.3);
}

.ai-atlas__card--matchmaking .ai-atlas__icon {
    color: #a855f7;
    background: rgba(168, 85, 247, 0.1);
    box-shadow: inset 0 0 20px rgba(168, 85, 247, 0.1);
}

.ai-atlas__card--matchmaking .ai-atlas__subtitle {
    color: #a855f7;
}

.ai-atlas__card--matchmaking .ai-atlas__feature-dot {
    color: #a855f7;
}

/* ---- Theme: Decision (决策) ---- */
.ai-atlas__card--decision .ai-atlas__card-bg {
    background: radial-gradient(circle at top right, rgba(255, 0, 127, 0.15), transparent 70%);
}

.ai-atlas__card--decision:hover {
    border-color: rgba(255, 0, 127, 0.3);
}

.ai-atlas__card--decision .ai-atlas__icon {
    color: #FF007F;
    background: rgba(255, 0, 127, 0.1);
    box-shadow: inset 0 0 20px rgba(255, 0, 127, 0.1);
}

.ai-atlas__card--decision .ai-atlas__subtitle {
    color: #FF007F;
}

.ai-atlas__card--decision .ai-atlas__feature-dot {
    color: #FF007F;
}

/* 全景能力统一分类色：维持中性卡片，仅让信息层级承担颜色 */
.ai-atlas__card--insight { --atlas-rgb: var(--rgb-capability-insight); }
.ai-atlas__card--management { --atlas-rgb: var(--rgb-capability-management); }
.ai-atlas__card--matchmaking { --atlas-rgb: var(--rgb-capability-match); }
.ai-atlas__card--decision { --atlas-rgb: var(--rgb-capability-decision); }

.ai-atlas__card:hover {
    border-color: rgba(var(--atlas-rgb), 0.48);
    box-shadow: 0 16px 32px rgba(3, 7, 18, 0.3), 0 0 18px rgba(var(--atlas-rgb), 0.1);
}

.ai-atlas__card .ai-atlas__card-bg {
    background: radial-gradient(circle at top right, rgba(var(--atlas-rgb), 0.14), transparent 68%);
}

.ai-atlas__card .ai-atlas__icon {
    color: rgb(var(--atlas-rgb));
    background: rgba(var(--atlas-rgb), 0.13);
    box-shadow: inset 0 0 18px rgba(var(--atlas-rgb), 0.1);
}

.ai-atlas__card .ai-atlas__subtitle,
.ai-atlas__card .ai-atlas__feature-dot {
    color: rgb(var(--atlas-rgb));
}

/* Stats bar */
.ai-atlas__stats {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    margin-bottom: var(--space-10);
    position: relative;
    z-index: 1;
    flex-wrap: wrap;
}

.ai-atlas__stat {
    display: flex;
    align-items: baseline;
    gap: var(--space-1);
}

.ai-atlas__stat-number {
    font-family: var(--font-display);
    font-size: var(--text-3xl);
    font-weight: 700;
    background: linear-gradient(135deg, #00F2FE, #4FACFE, #a855f7, #FF007F);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.ai-atlas__stat-label {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

.ai-atlas__stat-divider {
    width: 1px;
    height: 24px;
    background: var(--color-border);
    margin: 0 var(--space-4);
}

.ai-atlas__evolving {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--color-accent-green);
    font-weight: 500;
}

.ai-atlas__evolving-dot {
    width: 6px;
    height: 6px;
    background: var(--color-accent-green);
    border-radius: 50%;
    animation: atlas-pulse 2s ease-in-out infinite;
}

@keyframes atlas-pulse {

    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: 0.3;
    }
}

/* CTA */
.ai-atlas__cta {
    text-align: center;
    position: relative;
    z-index: 1;
}

.ai-atlas__cta .btn {
    gap: var(--space-2);
}

.ai-atlas__cta .btn svg {
    transition: transform var(--transition-base);
}

.ai-atlas__cta .btn:hover svg {
    transform: translateX(4px);
}

/* Responsive */
@media (max-width: 1024px) {
    .ai-atlas__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .ai-atlas__stat-number {
        font-size: var(--text-2xl);
    }
}

@media (max-width: 768px) {
    .ai-atlas__grid {
        grid-template-columns: 1fr;
        gap: var(--space-4);
    }

    .ai-atlas__card {
        padding: var(--space-6) var(--space-5);
    }

    .ai-atlas__stats {
        flex-direction: column;
        gap: var(--space-4);
    }

    .ai-atlas__stat-divider {
        width: 40px;
        height: 1px;
        margin: 0;
    }

    .ai-atlas__stat-number {
        font-size: var(--text-2xl);
    }
}

/* ==========================================
   角色升级 Section
   ========================================== */

.role-upgrade {
    position: relative;
    background: linear-gradient(180deg, var(--color-bg-primary) 0%, var(--color-bg-secondary) 100%);
    overflow: hidden;
}

.role-upgrade::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 800px;
    height: 800px;
    background: radial-gradient(circle, var(--color-primary-glow) 0%, transparent 70%);
    transform: translate(-50%, -50%);
    opacity: 0.2;
    pointer-events: none;
}

.role-upgrade__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-8);
    margin-top: var(--space-12);
}

/* Role Card */
.role-card {
    --role-rgb: var(--rgb-capability-management);
    position: relative;
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-2xl);
    padding: var(--space-10);
    text-align: center;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    transition: all var(--transition-slow);
    overflow: hidden;
}

.role-card:nth-child(2) { --role-rgb: var(--rgb-capability-match); }
.role-card:nth-child(3) { --role-rgb: var(--rgb-capability-insight); }

.role-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: rgb(var(--role-rgb));
    opacity: 0;
    transition: opacity var(--transition-base);
}

.role-card:hover {
    border-color: rgba(var(--role-rgb), 0.52);
    transform: translateY(-8px);
    box-shadow: 0 16px 32px rgba(3, 7, 18, 0.3), 0 0 18px rgba(var(--role-rgb), 0.1);
}

.role-card:hover::before {
    opacity: 1;
}

/* Before/After States */
.role-card__before,
.role-card__after {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-2);
}

.role-card__before {
    opacity: 0.5;
    margin-bottom: 0;
}

.role-card__after {
    margin-bottom: var(--space-4);
}

/* Icons */
.role-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-xl);
    transition: all var(--transition-base);
}

.role-card__icon--before {
    width: 64px;
    height: 64px;
    background: rgba(255, 255, 255, 0.05);
    color: var(--color-text-muted);
}

.role-card__icon--after {
    width: 80px;
    height: 80px;
    color: #fff;
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.5);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05));
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.role-card__icon--data {
    color: rgb(var(--rgb-capability-management));
    background: rgba(var(--rgb-capability-management), 0.14);
    box-shadow: inset 0 0 18px rgba(var(--rgb-capability-management), 0.1);
}

.role-card__icon--connect {
    color: rgb(var(--rgb-capability-match));
    background: rgba(var(--rgb-capability-match), 0.14);
    box-shadow: inset 0 0 18px rgba(var(--rgb-capability-match), 0.1);
}

.role-card__icon--asset {
    color: rgb(var(--rgb-capability-insight));
    background: rgba(var(--rgb-capability-insight), 0.14);
    box-shadow: inset 0 0 18px rgba(var(--rgb-capability-insight), 0.1);
}

.role-card:hover .role-card__icon--after {
    transform: scale(1.1);
    box-shadow: inset 0 0 18px rgba(var(--role-rgb), 0.12), 0 0 16px rgba(var(--role-rgb), 0.12);
}

/* Titles */
.role-card__old-title {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    text-decoration: line-through;
    font-weight: 400;
}

.role-card__new-title {
    font-family: var(--font-display);
    font-size: var(--text-xl);
    font-weight: 700;
    color: rgb(var(--role-rgb));
    -webkit-text-fill-color: rgb(var(--role-rgb));
    transition: transform var(--transition-base);
}

.role-card:hover .role-card__new-title {
    transform: scale(1.05);
}

/* Arrow */
.role-card__arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: calc(-1 * var(--space-1)) 0 var(--space-2) 0;
    color: var(--color-accent-green);
}

.role-card__arrow svg {
    animation: arrowPulse 1.5s ease-in-out infinite;
}

@keyframes arrowPulse {

    0%,
    100% {
        transform: translateY(0);
        opacity: 0.7;
    }

    50% {
        transform: translateY(4px);
        opacity: 1;
    }
}

/* Description */
.role-card__desc {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: 1.8;
    margin-top: var(--space-4);
    padding-top: var(--space-4);
    border-top: 1px solid var(--color-border);
    transition: color var(--transition-base);
}

.role-card:hover .role-card__desc {
    color: var(--color-text-primary);
}

/* 角色升级：以左右对照呈现从旧角色到新角色的跃迁 */
.role-upgrade__grid {
    gap: var(--space-6);
}

.role-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 40px minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    min-height: 310px;
    padding: var(--space-8);
    text-align: left;
    background: linear-gradient(145deg, rgba(24, 31, 57, 0.88), rgba(15, 23, 42, 0.78));
}

.role-card::before {
    opacity: 0.5;
}

.role-card__before,
.role-card__after {
    gap: var(--space-3);
}

.role-card__before {
    grid-column: 1;
    margin: 0;
    opacity: 0.52;
}

.role-card__after {
    grid-column: 3;
    margin: 0;
}

.role-card__icon--before {
    width: 52px;
    height: 52px;
}

.role-card__icon--after {
    width: 68px;
    height: 68px;
}

.role-card__arrow {
    grid-column: 2;
    margin: 0;
    width: 32px;
    height: 32px;
    border: 1px solid rgba(72, 88, 255, 0.32);
    border-radius: 50%;
    background: rgba(72, 88, 255, 0.1);
    color: var(--color-primary-light);
}

.role-card__arrow svg {
    width: 18px;
    height: 18px;
    animation: none;
    transform: rotate(-90deg);
}

.role-card__old-title {
    text-decoration: none;
    line-height: 1.35;
}

.role-card__new-title {
    font-size: var(--text-lg);
    line-height: 1.35;
    text-align: center;
}

.role-card__desc {
    grid-column: 1 / -1;
    margin: var(--space-8) 0 0;
    padding-top: var(--space-5);
    text-align: center;
}

.role-card:hover .role-card__arrow {
    border-color: var(--color-primary-light);
    box-shadow: 0 0 18px var(--color-primary-glow);
}

/* Responsive */
@media (max-width: 1024px) {
    .role-upgrade__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .role-upgrade__grid {
        grid-template-columns: 1fr;
        gap: var(--space-6);
    }

    .role-card {
        padding: var(--space-8);
    }

    .role-card {
        min-height: 0;
        grid-template-columns: minmax(0, 1fr) 36px minmax(0, 1fr);
    }

    .role-card__icon--before {
        width: 46px;
        height: 46px;
    }

    .role-card__icon--after {
        width: 60px;
        height: 60px;
    }

    .role-card__new-title {
        font-size: var(--text-xl);
    }
}

/* ==========================================
   CTA区域
   ========================================== */

.cta-section {
    position: relative;
    background: linear-gradient(135deg, var(--color-bg-tertiary), var(--color-bg-primary));
    overflow: hidden;
    min-height: 400px;
    display: flex;
    align-items: center;
}

/* 动态背景容器 */
.cta-section__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

/* 流动光晕效果 */
.cta-section__glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.4;
}

.cta-section__glow--1 {
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, var(--color-primary) 0%, transparent 70%);
    top: -200px;
    left: -100px;
    animation: cta-glow-1 12s ease-in-out infinite;
}

.cta-section__glow--2 {
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, var(--color-accent-cyan) 0%, transparent 70%);
    bottom: -150px;
    right: -100px;
    animation: cta-glow-2 10s ease-in-out infinite;
}

@keyframes cta-glow-1 {

    0%,
    100% {
        transform: translate(0, 0) scale(1);
        opacity: 0.3;
    }

    33% {
        transform: translate(100px, 50px) scale(1.1);
        opacity: 0.5;
    }

    66% {
        transform: translate(50px, -30px) scale(0.9);
        opacity: 0.4;
    }
}

@keyframes cta-glow-2 {

    0%,
    100% {
        transform: translate(0, 0) scale(1);
        opacity: 0.25;
    }

    50% {
        transform: translate(-80px, -40px) scale(1.15);
        opacity: 0.45;
    }
}

/* 动态网格背景 */
.cta-section__grid {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(72, 88, 255, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(72, 88, 255, 0.03) 1px, transparent 1px);
    background-size: 60px 60px;
    animation: cta-grid-move 20s linear infinite;
}

@keyframes cta-grid-move {
    0% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(60px, 60px);
    }
}

/* 浮动粒子效果 */
.cta-section__particles {
    position: absolute;
    inset: 0;
}

.cta-section__particles span {
    position: absolute;
    width: 4px;
    height: 4px;
    background: var(--color-primary);
    border-radius: 50%;
    opacity: 0;
    animation: cta-particle-float 8s ease-in-out infinite;
}

.cta-section__particles span:nth-child(1) {
    left: 10%;
    top: 20%;
    animation-delay: 0s;
    animation-duration: 7s;
}

.cta-section__particles span:nth-child(2) {
    left: 20%;
    top: 80%;
    animation-delay: 1s;
    animation-duration: 9s;
}

.cta-section__particles span:nth-child(3) {
    left: 35%;
    top: 30%;
    animation-delay: 2s;
    animation-duration: 6s;
}

.cta-section__particles span:nth-child(4) {
    left: 50%;
    top: 70%;
    animation-delay: 0.5s;
    animation-duration: 8s;
}

.cta-section__particles span:nth-child(5) {
    left: 65%;
    top: 25%;
    animation-delay: 3s;
    animation-duration: 10s;
}

.cta-section__particles span:nth-child(6) {
    left: 75%;
    top: 85%;
    animation-delay: 1.5s;
    animation-duration: 7s;
}

.cta-section__particles span:nth-child(7) {
    left: 85%;
    top: 40%;
    animation-delay: 2.5s;
    animation-duration: 9s;
}

.cta-section__particles span:nth-child(8) {
    left: 90%;
    top: 60%;
    animation-delay: 0.8s;
    animation-duration: 6s;
}

.cta-section__particles span:nth-child(9) {
    left: 5%;
    top: 50%;
    animation-delay: 4s;
    animation-duration: 8s;
}

.cta-section__particles span:nth-child(10) {
    left: 45%;
    top: 15%;
    animation-delay: 3.5s;
    animation-duration: 11s;
}

@keyframes cta-particle-float {
    0% {
        transform: translateY(0) scale(0);
        opacity: 0;
    }

    10% {
        opacity: 0.8;
        transform: translateY(-10px) scale(1);
    }

    50% {
        opacity: 0.5;
        transform: translateY(-40px) scale(0.8);
    }

    90% {
        opacity: 0.8;
        transform: translateY(-80px) scale(1);
    }

    100% {
        transform: translateY(-100px) scale(0);
        opacity: 0;
    }
}

.cta-section__content {
    position: relative;
    z-index: 1;
    text-align: center;
    max-width: 700px;
    margin: 0 auto;
}

.cta-section__title {
    font-family: var(--font-display);
    font-size: var(--text-4xl);
    font-weight: 700;
    margin-bottom: var(--space-4);
}

.cta-section__desc {
    font-size: var(--text-lg);
    color: var(--color-text-secondary);
    margin-bottom: var(--space-8);
}

/* ==========================================
   页脚
   ========================================== */

.footer {
    background: var(--color-bg-primary);
    border-top: 1px solid var(--color-border);
    padding: var(--space-16) 0 var(--space-8);
}

.footer__grid {
    display: grid;
    grid-template-columns: 2fr repeat(3, 1fr);
    gap: var(--space-12);
    margin-bottom: var(--space-12);
}

.footer__brand {
    max-width: 300px;
}

.footer__logo {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    font-family: var(--font-display);
    font-size: var(--text-xl);
    font-weight: 700;
    margin-bottom: var(--space-4);
}

.footer__desc {
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    line-height: 1.7;
}

.footer__title {
    font-size: var(--text-sm);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--color-text-muted);
    margin-bottom: var(--space-6);
}

.footer__links {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.footer__link {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    transition: color var(--transition-fast);
}

.footer__link:hover {
    color: var(--color-primary);
}

.footer__bottom {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding-top: var(--space-8);
    border-top: 1px solid var(--color-border);
    flex-wrap: wrap;
    gap: var(--space-4);
}

.footer__legal {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.footer__copy {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

.footer__beian {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
}

.footer__beian-link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    font-size: var(--text-xs);
    color: var(--color-text-subtle);
    transition: color var(--transition-fast);
}

.footer__beian-icon {
    width: 16px;
    height: 16px;
    vertical-align: middle;
}

.footer__beian-link:hover {
    color: var(--color-text-secondary);
}

.footer__social {
    display: flex;
    gap: var(--space-4);
}

.footer__social-item {
    position: relative;
}

.footer__social-link {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-lg);
    background: var(--color-bg-glass);
    border: 1px solid var(--color-border);
    color: var(--color-text-secondary);
    transition: all var(--transition-fast);
}

/* 社交图标颜色控制 */
/* 默认状态：全部显示为白色 */
.footer__social-link svg path {
    fill: #ffffff;
    transition: fill var(--transition-base);
}

/* 微信：默认显示为白色，背景路径不再特殊处理 */
/* .footer__social-link--wechat svg path:first-child {
    fill: transparent;
} */

/* Hover状态：恢复原色 */

/* 微信 Hover */
.footer__social-link--wechat:hover svg path {
    fill: #66BB33;
    /* 绿色背景 */
}

/* 小红书 Hover */
.footer__social-link--xhs:hover svg path {
    fill: #FF0000;
    /* 红色内容 */
}

.footer__social-link:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
    background: rgba(72, 88, 255, 0.1);
}

.hero__cta--center {
    justify-content: center;
    margin-top: 2rem;
    display: flex;
}

/* 二维码弹出框 */
.footer__qrcode-popup {
    position: absolute;
    bottom: calc(100% + 12px);
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    visibility: hidden;
    transition: all var(--transition-base);
    z-index: var(--z-dropdown);
}

.footer__social-item:hover .footer__qrcode-popup {
    opacity: 1;
    visibility: visible;
}

.footer__qrcode-box {
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: var(--space-4);
    text-align: center;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    box-shadow: var(--shadow-xl);
    min-width: 140px;
}

.footer__qrcode-box::after {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 50%;
    transform: translateX(-50%);
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid var(--color-border);
}

.footer__qrcode-img {
    display: block;
    width: 100px;
    height: 100px;
    min-width: 100px;
    min-height: 100px;
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-2);
    object-fit: contain;
    background-color: #fff;
    margin-left: auto;
    margin-right: auto;
}

.footer__qrcode-box p {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    margin: 0;
}

/* ==========================================
   通用标题样式
   ========================================== */

.section-header {
    text-align: center;
    margin-bottom: var(--space-16);
}

.section-label {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--color-primary);
    margin-bottom: var(--space-4);
}

.section-title {
    font-family: var(--font-display);
    font-size: clamp(var(--text-3xl), 4vw, var(--text-5xl));
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: var(--space-4);
}

.section-desc {
    font-size: var(--text-lg);
    color: var(--color-text-secondary);
    max-width: 600px;
    margin: 0 auto;
}

/* ==========================================
   动画关键帧
   ========================================== */

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideInLeft {
    from {
        opacity: 0;
        transform: translateX(-30px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(30px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes pulse {

    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: 0.5;
    }
}

@keyframes float {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }
}

@keyframes countUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 动画工具类 */
.animate-fadeInUp {
    animation: fadeInUp 0.6s ease-out forwards;
}

.animate-fadeIn {
    animation: fadeIn 0.6s ease-out forwards;
}

.animate-delay-1 {
    animation-delay: 0.1s;
}

.animate-delay-2 {
    animation-delay: 0.2s;
}

.animate-delay-3 {
    animation-delay: 0.3s;
}

.animate-delay-4 {
    animation-delay: 0.4s;
}

/* ==========================================
   滚动触发动画
   ========================================== */

.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* ==========================================
   响应式设计
   ========================================== */

/* 平板 */
@media (max-width: 1024px) {
    .navbar__nav {
        display: none;
    }

    .navbar__actions {
        display: none;
    }

    .navbar__toggle {
        display: flex;
    }

    .pain-points__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .challenge-card {
        min-height: 380px;
    }

    .pain-card {
        height: 350px;
    }

    .stats__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .footer__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* 手机 */
@media (max-width: 768px) {
    :root {
        --space-24: 4rem;
        --space-16: 3rem;
    }

    .hero__title {
        font-size: var(--text-4xl);
    }

    .hero__cta {
        flex-direction: column;
        width: 100%;
    }

    .hero__cta .btn {
        width: 100%;
    }

    .pain-points__grid {
        grid-template-columns: 1fr;
    }

    .challenge-card {
        min-height: 0;
    }

    .challenge-card__problem {
        padding: var(--space-6);
    }

    .challenge-card__answer {
        padding: var(--space-5) var(--space-6);
    }

    .pain-card {
        height: 320px;
    }

    /* 移动端：禁用hover翻转，启用点击翻转 */
    .pain-card:hover .pain-card__inner {
        transform: none;
    }

    .pain-card:hover .pain-card__front,
    .pain-card:hover .pain-card__back {
        box-shadow: none;
    }

    /* 点击翻转状态 */
    .pain-card.is-flipped .pain-card__inner {
        transform: rotateY(180deg);
    }

    .pain-card.is-flipped .pain-card__front {
        box-shadow: 0 0 40px var(--color-primary-glow), 0 0 80px rgba(72, 88, 255, 0.15);
    }

    .pain-card.is-flipped .pain-card__back {
        box-shadow: 0 0 40px var(--color-primary-glow), 0 0 80px rgba(72, 88, 255, 0.2);
    }

    .pyramid__layer--top,
    .pyramid__layer--middle,
    .pyramid__layer--bottom {
        max-width: 100%;
    }

    .stats__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-4);
    }

    .stat-card {
        padding: var(--space-6);
    }

    .stat-card__number {
        font-size: var(--text-4xl);
    }

    .footer__grid {
        grid-template-columns: 1fr;
        gap: var(--space-8);
    }

    .footer__bottom {
        flex-direction: column;
        gap: var(--space-4);
        text-align: center;
    }
}

/* 小手机 */
@media (max-width: 480px) {
    .container {
        padding: 0 var(--space-4);
    }

    .stats__grid {
        grid-template-columns: 1fr;
    }

    .trust-bar__logos {
        gap: var(--space-8);
    }
}

/* ==========================================
   Logo滚动动画
   ========================================== */

.logo-scroll {
    overflow: hidden;
    position: relative;
}

.logo-scroll::before,
.logo-scroll::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100px;
    z-index: 2;
    pointer-events: none;
}

.logo-scroll::before {
    left: 0;
    background: linear-gradient(to right, var(--color-bg-secondary), transparent);
}

.logo-scroll::after {
    right: 0;
    background: linear-gradient(to left, var(--color-bg-secondary), transparent);
}

.logo-scroll__track {
    display: flex;
    animation: scroll 30s linear infinite;
}

.logo-scroll__track:hover {
    animation-play-state: paused;
}

@keyframes scroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

/* ==========================================
   玻璃态效果
   ========================================== */

.glass {
    background: var(--color-bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
}

.glass--dark {
    background: var(--color-bg-card);
}

/* ==========================================
   移动端导航菜单
   ========================================== */

.mobile-menu {
    position: fixed;
    inset: 0;
    background: rgba(10, 10, 20, 0.75);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    backdrop-filter: blur(20px) saturate(180%);
    z-index: calc(var(--z-sticky) - 1);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: var(--space-8);
    opacity: 0;
    visibility: hidden;
    transition: all var(--transition-base);
}

.mobile-menu.active {
    opacity: 1;
    visibility: visible;
}

.mobile-menu__link {
    font-size: var(--text-2xl);
    font-weight: 600;
    color: var(--color-text-secondary);
    transition: color var(--transition-fast);
}

.mobile-menu__link:hover {
    color: var(--color-primary);
}

.mobile-menu__product-menu {
    margin: 0;
    text-align: center;
}

.mobile-menu__product-menu summary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    cursor: pointer;
    list-style: none;
}

.mobile-menu__product-menu summary::-webkit-details-marker {
    display: none;
}

.mobile-menu__chevron {
    width: 8px;
    height: 8px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: translateY(-2px) rotate(45deg);
    transition: transform var(--transition-fast);
}

.mobile-menu__product-menu[open] .mobile-menu__chevron {
    transform: translateY(2px) rotate(225deg);
}

.mobile-menu__product-list {
    display: grid;
    gap: var(--space-3);
    padding-top: var(--space-4);
}

.mobile-menu__sublink {
    color: var(--color-text-secondary);
    font-size: var(--text-lg);
    font-weight: 500;
    transition: color var(--transition-fast);
}

.mobile-menu__sublink:hover,
.mobile-menu__sublink:focus-visible {
    color: var(--color-primary);
    outline: none;
}

/* Keep the locale switch separate from the primary mobile navigation. */
.mobile-menu .language-toggle {
    position: absolute;
    bottom: var(--space-8);
    font-size: var(--text-sm);
    font-weight: 500;
}

/* ==========================================
   AI匹配引擎页面样式
   ========================================== */

/* Section 1: AI Hero / 概念引入 */
.ai-hero {
    position: relative;
    min-height: 80vh;
    display: flex;
    align-items: center;
    padding-top: calc(var(--space-24) + 80px);
    /* 增加导航栏高度 */
    overflow: hidden;
}

.ai-hero__bg {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 80% 50% at 50% -20%, rgba(72, 88, 255, 0.15), transparent),
        radial-gradient(ellipse 60% 40% at 80% 100%, rgba(168, 85, 247, 0.1), transparent);
    z-index: 0;
}

.ai-hero__content {
    position: relative;
    z-index: 1;
}

.ai-hero__title {
    font-family: var(--font-display);
    font-size: clamp(var(--text-3xl), 5vw, var(--text-6xl));
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: var(--space-8);
}

.ai-hero__title .highlight {
    background: linear-gradient(135deg, var(--color-primary), var(--color-accent-cyan));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* 对比卡片 */
.compare-cards {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-6);
    margin-top: var(--space-12);
    flex-wrap: wrap;
}

.compare-card {
    position: relative;
    padding: var(--space-8);
    border-radius: var(--radius-2xl);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    text-align: center;
    width: 280px;
    transition: all var(--transition-base);
}

.compare-card:hover {
    transform: translateY(-8px);
    border-color: var(--color-border-hover);
}

.compare-card--old {
    opacity: 0.7;
}

.compare-card--old:hover {
    border-color: #ef4444;
    box-shadow: 0 0 30px rgba(239, 68, 68, 0.2);
}

.compare-card--new:hover {
    border-color: var(--color-accent-green);
    box-shadow: 0 0 30px rgba(16, 185, 129, 0.3);
}

.compare-card__badge {
    position: absolute;
    top: -12px;
    right: -12px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.compare-card__badge--fail {
    background: #ef4444;
    color: white;
}

.compare-card__badge--success {
    background: var(--color-accent-green);
    color: white;
}

.compare-card__icon {
    width: 80px;
    height: 80px;
    margin: 0 auto var(--space-4);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-muted);
}

.compare-card--new .compare-card__icon {
    color: var(--color-primary);
}

.compare-card__title {
    font-size: var(--text-xl);
    font-weight: 600;
    margin-bottom: var(--space-2);
}

.compare-card__desc {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

.compare-card__arrow {
    color: var(--color-primary);
    animation: pulse 2s ease-in-out infinite;
}

@keyframes pulse {

    0%,
    100% {
        opacity: 1;
        transform: translateX(0);
    }

    50% {
        opacity: 0.5;
        transform: translateX(10px);
    }
}

/* Section 2: 运作流程 */
.workflow {
    background: var(--color-bg-secondary);
}

.workflow__timeline {
    position: relative;
    padding: var(--space-16) 0;
}

.workflow__line {
    position: absolute;
    top: 50%;
    left: 10%;
    right: 10%;
    height: 4px;
    background: var(--color-border);
    border-radius: 2px;
    transform: translateY(-50%);
}

.workflow__progress {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, var(--color-primary), var(--color-accent-cyan));
    border-radius: 2px;
    transition: width 1s ease;
}

.workflow__steps {
    display: flex;
    justify-content: space-between;
    position: relative;
    z-index: 1;
}

.workflow__step {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: var(--space-6) var(--space-4);
    border-radius: var(--radius-2xl);
    background: transparent;
    transition: all var(--transition-base);
    cursor: pointer;
    position: relative;
}

/* hover时底部发光边框效果 */
.workflow__step::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color-primary), var(--color-accent-cyan));
    border-radius: 2px;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.workflow__step:hover::after {
    width: 80%;
}

.workflow__step:hover {
    background: rgba(72, 88, 255, 0.05);
}

.workflow__step-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: var(--color-bg-primary);
    border: 3px solid var(--color-border);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-muted);
    margin-bottom: var(--space-6);
    transition: all var(--transition-base);
}

.workflow__step:hover .workflow__step-icon,
.workflow__step.active .workflow__step-icon {
    border-color: var(--color-primary);
    color: var(--color-primary);
    box-shadow: 0 0 30px var(--color-primary-glow);
    transform: scale(1.1);
}

.workflow__step-content {
    max-width: 280px;
}

.workflow__step-num {
    display: inline-block;
    font-family: var(--font-display);
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-primary);
    margin-bottom: var(--space-2);
    transition: all var(--transition-base);
}

.workflow__step:hover .workflow__step-num {
    transform: scale(1.1);
}

.workflow__step-title {
    font-size: var(--text-xl);
    font-weight: 600;
    margin-bottom: var(--space-1);
    transition: all var(--transition-base);
}

.workflow__step:hover .workflow__step-title {
    color: var(--color-primary-light);
}

.workflow__step-subtitle {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    font-family: var(--font-display);
    margin-bottom: var(--space-3);
    transition: all var(--transition-base);
}

/* 描述默认显示但低透明度，hover时高亮 - 不改变高度 */
.workflow__step-desc {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    line-height: 1.6;
    opacity: 0.4;
    transition: all 0.3s ease;
}

.workflow__step:hover .workflow__step-desc {
    opacity: 1;
    color: var(--color-text-secondary);
}

/* 箭头指示器样式 - 简洁发光设计 */
.workflow__arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 50px;
    position: relative;
}

.workflow__arrow svg {
    display: none;
}

/* 使用纯CSS三角形箭头 - 无方形边界 */
.workflow__arrow::before {
    content: '';
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 12px solid var(--color-accent-cyan);
    filter: drop-shadow(0 0 6px var(--color-accent-cyan)) drop-shadow(0 0 12px rgba(0, 212, 255, 0.5));
    animation: arrowGlow 2s ease-in-out infinite;
}

.workflow__arrow::after {
    display: none;
}

@keyframes arrowGlow {

    0%,
    100% {
        opacity: 0.6;
        filter: drop-shadow(0 0 4px var(--color-accent-cyan)) drop-shadow(0 0 8px rgba(0, 212, 255, 0.3));
    }

    50% {
        opacity: 1;
        filter: drop-shadow(0 0 8px var(--color-accent-cyan)) drop-shadow(0 0 16px rgba(0, 212, 255, 0.6));
    }
}

/* 同色系渐进 - 从浅到深体现阶段递进 */

/* 阶段1：浅蓝 - 起始阶段 */
.workflow__step--stage1 .workflow__step-icon {
    border-color: rgba(107, 122, 255, 0.3);
}

.workflow__step--stage1:hover .workflow__step-icon,
.workflow__step--stage1.active .workflow__step-icon {
    border-color: #7b8aff;
    color: #7b8aff;
    box-shadow: 0 0 25px rgba(123, 138, 255, 0.35);
}

.workflow__step--stage1 .workflow__step-num {
    color: #7b8aff;
}

.workflow__step--stage1::after {
    background: linear-gradient(90deg, #7b8aff, rgba(123, 138, 255, 0.5));
}

.workflow__step--stage1:hover .workflow__step-title {
    color: #8b9aff;
}

/* 阶段2：标准蓝 - 核心阶段 */
.workflow__step--stage2 .workflow__step-icon {
    border-color: rgba(72, 88, 255, 0.3);
}

.workflow__step--stage2:hover .workflow__step-icon,
.workflow__step--stage2.active .workflow__step-icon {
    border-color: var(--color-primary);
    color: var(--color-primary);
    box-shadow: 0 0 30px var(--color-primary-glow);
}

.workflow__step--stage2 .workflow__step-num {
    color: var(--color-primary);
}

.workflow__step--stage2::after {
    background: linear-gradient(90deg, var(--color-primary), var(--color-primary-light));
}

.workflow__step--stage2:hover .workflow__step-title {
    color: var(--color-primary-light);
}

/* 阶段3：深蓝 - 终极阶段 */
.workflow__step--stage3 .workflow__step-icon {
    border-color: rgba(58, 71, 204, 0.4);
}

.workflow__step--stage3:hover .workflow__step-icon,
.workflow__step--stage3.active .workflow__step-icon {
    border-color: #3a47cc;
    color: #3a47cc;
    box-shadow: 0 0 35px rgba(58, 71, 204, 0.45);
}

.workflow__step--stage3 .workflow__step-num {
    color: #3a47cc;
}

.workflow__step--stage3::after {
    background: linear-gradient(90deg, #3a47cc, rgba(58, 71, 204, 0.6));
}

.workflow__step--stage3:hover .workflow__step-title {
    color: #4a57dc;
}

/* 客户任务分组：从任务目标组织 AI 匹配 */
.match-task-groups {
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, var(--color-bg-primary), var(--color-bg-secondary));
}

.match-task-groups__glow {
    position: absolute;
    top: 12%;
    left: 50%;
    width: min(960px, 90vw);
    height: 420px;
    transform: translateX(-50%);
    background: radial-gradient(ellipse, rgba(72, 88, 255, 0.14), transparent 68%);
    pointer-events: none;
}

.match-task-groups__content {
    position: relative;
    z-index: 1;
}

.match-task-groups__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-6);
}

.match-task-card {
    --task-rgb: var(--rgb-capability-match);
    position: relative;
    display: flex;
    min-height: 360px;
    flex-direction: column;
    padding: var(--space-8);
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-2xl);
    background: var(--color-bg-card);
    transition: transform var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base);
}

.match-task-card--meet {
    --task-rgb: var(--rgb-capability-match);
}

.match-task-card--follow-up {
    --task-rgb: var(--rgb-capability-decision);
}

.match-task-card--discover {
    --task-rgb: var(--rgb-capability-insight);
}

.match-task-card::before {
    display: none;
}

.match-task-card:hover {
    transform: translateY(-4px);
    border-color: rgba(var(--task-rgb), 0.52);
    box-shadow: 0 14px 28px rgba(3, 7, 18, 0.24), 0 0 16px rgba(var(--task-rgb), 0.1);
}

.match-task-card__topline,
.match-task-card__icon,
.match-task-card h3,
.match-task-card p,
.match-task-card__tags {
    position: relative;
    z-index: 1;
}

.match-task-card__topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: rgb(var(--task-rgb));
    font-family: var(--font-display);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
}

.match-task-card__status {
    padding: 0.28rem 0.55rem;
    border: 1px solid rgba(var(--task-rgb), 0.34);
    border-radius: 999px;
    background: rgba(var(--task-rgb), 0.1);
    font-family: var(--font-sans);
    font-size: 0.6875rem;
    letter-spacing: 0.04em;
}

.match-task-card__icon {
    display: grid;
    width: 56px;
    height: 56px;
    margin: var(--space-6) 0 var(--space-5);
    place-items: center;
    border: 1px solid rgba(var(--task-rgb), 0.45);
    border-radius: var(--radius-xl);
    background: rgba(var(--task-rgb), 0.12);
    color: rgb(var(--task-rgb));
}

.match-task-card h3 {
    margin: 0;
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-size: var(--text-xl);
    line-height: 1.45;
}

.match-task-card p {
    margin: var(--space-3) 0 0;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: 1.8;
}

.match-task-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-top: auto;
    padding-top: var(--space-6);
}

.match-task-card__tags span {
    padding: 0.3rem 0.55rem;
    border: 1px solid rgba(var(--task-rgb), 0.25);
    border-radius: 999px;
    background: rgba(var(--task-rgb), 0.08);
    color: rgba(255, 255, 255, 0.74);
    font-size: 0.6875rem;
    line-height: 1;
}

@media (max-width: 768px) {
    .match-task-groups__grid {
        grid-template-columns: 1fr;
    }

    .match-task-card {
        min-height: 0;
        padding: var(--space-6);
    }
}

/* Section 3: 核心功能矩阵 */
.features {
    position: relative;
    overflow: hidden;
}

.features__bg {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 50% 50% at 20% 20%, rgba(72, 88, 255, 0.08), transparent),
        radial-gradient(ellipse 50% 50% at 80% 80%, rgba(168, 85, 247, 0.06), transparent);
    z-index: 0;
}

.features__content {
    position: relative;
    z-index: 1;
}

.features__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6);
}

.feature-card {
    position: relative;
    padding: var(--space-8);
    border-radius: var(--radius-2xl);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    text-align: center;
    transition: all var(--transition-base);
    overflow: hidden;
}

.feature-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(400px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
            rgba(72, 88, 255, 0.1),
            transparent 40%);
    opacity: 0;
    transition: opacity var(--transition-base);
    z-index: 0;
    pointer-events: none;
}

.feature-card:hover::before {
    opacity: 1;
}

.feature-card:hover {
    transform: translateY(-6px);
    border-color: var(--color-primary);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3), 0 0 30px var(--color-primary-glow);
}

.feature-card__icon {
    position: relative;
    z-index: 1;
    width: 64px;
    height: 64px;
    margin: 0 auto var(--space-4);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary);
    background: rgba(72, 88, 255, 0.1);
    border-radius: var(--radius-xl);
    transition: all var(--transition-base);
}

.feature-card:hover .feature-card__icon {
    background: var(--color-primary);
    color: white;
    transform: scale(1.1);
}

.feature-card__title {
    position: relative;
    z-index: 1;
    font-size: var(--text-lg);
    font-weight: 600;
    margin-bottom: var(--space-2);
}

.feature-card__desc {
    position: relative;
    z-index: 1;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    transition: color var(--transition-base);
}

.feature-card:hover .feature-card__desc {
    color: var(--color-text-secondary);
}

/* 功能卡片颜色变体 - 视觉多样性 */

/* 青色变体 */
.feature-card--cyan .feature-card__icon {
    color: var(--color-accent-cyan);
    background: rgba(0, 212, 255, 0.1);
}

.feature-card--cyan:hover .feature-card__icon {
    background: var(--color-accent-cyan);
}

.feature-card--cyan:hover {
    border-color: var(--color-accent-cyan);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3), 0 0 30px rgba(0, 212, 255, 0.3);
}

.feature-card--cyan::before {
    background: radial-gradient(400px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
            rgba(0, 212, 255, 0.12),
            transparent 40%);
}

/* 蓝色变体 (默认) */
.feature-card--blue .feature-card__icon {
    color: var(--color-primary);
    background: rgba(72, 88, 255, 0.1);
}

.feature-card--blue:hover .feature-card__icon {
    background: var(--color-primary);
}

.feature-card--blue:hover {
    border-color: var(--color-primary);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3), 0 0 30px var(--color-primary-glow);
}

/* 靛蓝变体 */
.feature-card--indigo .feature-card__icon {
    color: #6366f1;
    background: rgba(99, 102, 241, 0.1);
}

.feature-card--indigo:hover .feature-card__icon {
    background: #6366f1;
}

.feature-card--indigo:hover {
    border-color: #6366f1;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3), 0 0 30px rgba(99, 102, 241, 0.3);
}

.feature-card--indigo::before {
    background: radial-gradient(400px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
            rgba(99, 102, 241, 0.12),
            transparent 40%);
}

/* 紫色变体 */
.feature-card--purple .feature-card__icon {
    color: var(--color-accent-purple);
    background: rgba(168, 85, 247, 0.1);
}

.feature-card--purple:hover .feature-card__icon {
    background: var(--color-accent-purple);
}

.feature-card--purple:hover {
    border-color: var(--color-accent-purple);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3), 0 0 30px rgba(168, 85, 247, 0.3);
}

.feature-card--purple::before {
    background: radial-gradient(400px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
            rgba(168, 85, 247, 0.12),
            transparent 40%);
}

/* AI 匹配引擎核心功能：以平台蓝为底，分类色说明能力侧重 */
.feature-card { --feature-rgb: 72, 88, 255; }
.feature-card--cyan { --feature-rgb: var(--rgb-capability-insight); }
.feature-card--blue { --feature-rgb: 72, 88, 255; }
.feature-card--indigo { --feature-rgb: var(--rgb-capability-management); }
.feature-card--purple { --feature-rgb: var(--rgb-capability-match); }

.feature-card::before {
    background: radial-gradient(400px circle at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(var(--feature-rgb), 0.13), transparent 40%);
}

.feature-card__icon {
    color: rgb(var(--feature-rgb));
    background: rgba(var(--feature-rgb), 0.13);
    border: 1px solid rgba(var(--feature-rgb), 0.24);
}

.feature-card:hover {
    border-color: rgba(var(--feature-rgb), 0.52);
    box-shadow: 0 14px 28px rgba(3, 7, 18, 0.28), 0 0 16px rgba(var(--feature-rgb), 0.1);
}

.feature-card:hover .feature-card__icon {
    color: rgb(var(--feature-rgb));
    background: rgba(var(--feature-rgb), 0.2);
}

/* Section 4: 价值承诺 */
.value {
    background: var(--color-bg-secondary);
}

.value__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-8);
}

.value-card {
    padding: var(--space-10);
    border-radius: var(--radius-2xl);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    text-align: center;
    transition: all var(--transition-base);
}

.value-card:hover {
    transform: translateY(-8px);
    border-color: var(--color-primary);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.value-card__header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
}

.value-card__icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary);
    background: rgba(72, 88, 255, 0.1);
    border-radius: var(--radius-lg);
}

.value-card__label {
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--color-text-muted);
}

.value-card__number {
    font-family: var(--font-display);
    font-size: clamp(var(--text-4xl), 6vw, var(--text-6xl));
    font-weight: 700;
    background: linear-gradient(135deg, #fbbf24, #f59e0b);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: var(--space-2);
}

.value-card__title {
    font-size: var(--text-xl);
    font-weight: 600;
    margin-bottom: var(--space-4);
}

.value-card__desc {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    line-height: 1.7;
}

/* 导航链接激活状态 */
.navbar__link--active {
    color: var(--color-primary) !important;
}

/* AI页面响应式 */
@media (max-width: 1024px) {
    .features__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .value__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .value-card:last-child {
        grid-column: 1 / -1;
        max-width: 400px;
        margin: 0 auto;
    }

    .workflow__line {
        display: none;
    }

    .workflow__steps {
        flex-direction: column;
        gap: var(--space-4);
    }

    .workflow__step {
        flex-direction: column;
        text-align: center;
        gap: var(--space-4);
        padding: var(--space-6);
    }

    .workflow__step-icon {
        width: 56px;
        height: 56px;
    }

    .workflow__step-content {
        max-width: none;
    }

    /* 移动端箭头向下 */
    .workflow__arrow {
        width: 100%;
        height: 40px;
        transform: rotate(90deg);
    }

    .workflow__arrow::before {
        animation: arrowGlowVertical 2s ease-in-out infinite;
    }

    @keyframes arrowGlowVertical {

        0%,
        100% {
            opacity: 0.6;
            filter: drop-shadow(0 0 4px var(--color-accent-cyan)) drop-shadow(0 0 8px rgba(0, 212, 255, 0.3));
        }

        50% {
            opacity: 1;
            filter: drop-shadow(0 0 8px var(--color-accent-cyan)) drop-shadow(0 0 16px rgba(0, 212, 255, 0.6));
        }
    }
}

/* ==========================================
   数字化基建页面样式
   ========================================== */

/* 时间轴概览 */
.infra-overview {
    background: var(--color-bg-secondary);
}

.timeline {
    position: relative;
    padding: var(--space-16) 0;
}

.timeline__track {
    position: absolute;
    top: 50%;
    left: 10%;
    right: 10%;
    height: 4px;
    background: var(--color-border);
    border-radius: 2px;
    transform: translateY(-50%);
}

.timeline__progress {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 33%;
    background: linear-gradient(90deg, var(--color-accent-cyan), var(--color-primary));
    border-radius: 2px;
    transition: width 0.5s ease;
}

.timeline__stages {
    display: flex;
    justify-content: space-between;
    position: relative;
    z-index: 1;
    padding: 0 5%;
}

.timeline__stage {
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    transition: all var(--transition-base);
}

.timeline__node {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: var(--color-bg-card);
    border: 3px solid var(--color-border);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all var(--transition-base);
    margin-bottom: var(--space-4);
}

.timeline__stage--active .timeline__node,
.timeline__stage:hover .timeline__node {
    border-color: var(--color-primary);
    box-shadow: 0 0 30px var(--color-primary-glow);
    transform: scale(1.1);
}

.timeline__icon {
    color: var(--color-text-muted);
    transition: color var(--transition-base);
}

.timeline__stage--active .timeline__icon,
.timeline__stage:hover .timeline__icon {
    color: var(--color-primary);
}

.timeline__label {
    font-size: var(--text-lg);
    font-weight: 600;
    color: var(--color-text-primary);
    margin-bottom: var(--space-1);
}

.timeline__subtitle {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

/* ==========================================
   基建模块架构图 (Infrastructure Modules)
   ========================================== */

.infra-modules {
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: var(--space-4);
    position: relative;
    margin-top: var(--space-12);
}

/* 模块卡片 */
.infra-module {
    position: relative;
    flex: 1;
    max-width: 320px;
    min-height: 320px;
    text-decoration: none;
    display: block;
}

.infra-module__border {
    position: absolute;
    inset: 0;
    border-radius: 16px;
    padding: 1px;
    background: linear-gradient(135deg,
            rgba(255, 255, 255, 0.1) 0%,
            rgba(255, 255, 255, 0.05) 50%,
            rgba(255, 255, 255, 0.02) 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    transition: all var(--transition-base);
}

.infra-module__glow {
    position: absolute;
    inset: -2px;
    border-radius: 18px;
    opacity: 0;
    transition: opacity var(--transition-base);
    pointer-events: none;
    z-index: -1;
}

.infra-module--pre .infra-module__glow {
    background: radial-gradient(ellipse at center, rgba(0, 212, 255, 0.3), transparent 70%);
}

.infra-module--during .infra-module__glow {
    background: radial-gradient(ellipse at center, rgba(72, 88, 255, 0.3), transparent 70%);
}

.infra-module--post .infra-module__glow {
    background: radial-gradient(ellipse at center, rgba(168, 85, 247, 0.3), transparent 70%);
}

.infra-module:hover .infra-module__glow {
    opacity: 1;
}

.infra-module__content {
    position: relative;
    height: 100%;
    padding: var(--space-8);
    border-radius: 16px;
    background: rgba(17, 24, 39, 0.8);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    transition: all var(--transition-base);
}

.infra-module:hover .infra-module__content {
    transform: translateY(-4px);
    background: rgba(17, 24, 39, 0.95);
}

.infra-module__icon {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--space-4);
    transition: all var(--transition-base);
}

.infra-module--pre .infra-module__icon {
    background: rgba(0, 212, 255, 0.1);
    color: var(--color-cyan);
}

.infra-module--during .infra-module__icon {
    background: rgba(72, 88, 255, 0.1);
    color: var(--color-primary);
}

.infra-module--post .infra-module__icon {
    background: rgba(168, 85, 247, 0.1);
    color: var(--color-purple);
}

.infra-module:hover .infra-module__icon {
    transform: scale(1.1);
}

.infra-module__tag {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    padding: 4px 12px;
    border-radius: 20px;
    margin-bottom: var(--space-3);
}

.infra-module--pre .infra-module__tag {
    background: rgba(0, 212, 255, 0.15);
    color: var(--color-cyan);
}

.infra-module--during .infra-module__tag {
    background: rgba(72, 88, 255, 0.15);
    color: var(--color-primary-light);
}

.infra-module--post .infra-module__tag {
    background: rgba(168, 85, 247, 0.15);
    color: var(--color-purple);
}

.infra-module__title {
    font-size: var(--text-2xl);
    font-weight: 700;
    color: var(--color-text-primary);
    margin-bottom: var(--space-1);
}

.infra-module__subtitle {
    font-size: var(--text-base);
    color: var(--color-text-secondary);
    margin-bottom: var(--space-4);
}

.infra-module__features {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-2);
    margin-top: auto;
}

.infra-module__features span {
    font-size: var(--text-xs);
    padding: 4px 10px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.05);
    color: var(--color-text-muted);
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: all var(--transition-base);
}

.infra-module:hover .infra-module__features span {
    background: rgba(255, 255, 255, 0.1);
    color: var(--color-text-secondary);
}

/* 连接线 */
.infra-connector {
    width: 60px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.infra-connector svg {
    width: 100%;
    height: 20px;
}

.infra-connector__arrow {
    position: absolute;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-muted);
    border: 1px solid rgba(255, 255, 255, 0.1);
    z-index: 10;
}

/* 数据流图例 */
.infra-flow-legend {
    display: flex;
    justify-content: center;
    gap: var(--space-8);
    margin-top: var(--space-10);
    padding-top: var(--space-6);
    border-top: 1px solid var(--color-border);
}

.infra-flow-legend__item {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

.infra-flow-legend__dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.infra-flow-legend__dot--cyan {
    background: var(--color-cyan);
    box-shadow: 0 0 8px var(--color-cyan);
}

.infra-flow-legend__dot--blue {
    background: var(--color-primary);
    box-shadow: 0 0 8px var(--color-primary);
}

.infra-flow-legend__dot--purple {
    background: var(--color-purple);
    box-shadow: 0 0 8px var(--color-purple);
}

/* 阶段区块 */
.infra-phase {
    position: relative;
    overflow: hidden;
}

.infra-phase__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.infra-phase--pre .infra-phase__bg {
    background: radial-gradient(ellipse 60% 40% at 20% 20%, rgba(0, 212, 255, 0.08), transparent);
}

.infra-phase--during .infra-phase__bg {
    background: radial-gradient(ellipse 60% 40% at 80% 30%, rgba(72, 88, 255, 0.08), transparent);
}

.infra-phase--post .infra-phase__bg {
    background: radial-gradient(ellipse 60% 40% at 50% 80%, rgba(168, 85, 247, 0.08), transparent);
}

/* 基建卡片网格 */
.infra-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-6);
    position: relative;
    z-index: 1;
}

.infra-grid--3 {
    grid-template-columns: repeat(3, 1fr);
}

.infra-grid--4 {
    grid-template-columns: repeat(4, 1fr);
}

/* 基建功能卡片 */
.infra-card {
    padding: var(--space-8);
    border-radius: var(--radius-2xl);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    transition: all var(--transition-base);
}

.infra-card--compact {
    padding: var(--space-6);
}

.infra-card:hover {
    transform: translateY(-4px);
    border-color: var(--color-primary);
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.2);
}

.infra-card__icon {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-xl);
    margin-bottom: var(--space-4);
    transition: all var(--transition-base);
}

.infra-card__icon--cyan {
    background: rgba(0, 212, 255, 0.1);
    color: var(--color-accent-cyan);
}

.infra-card__icon--blue {
    background: rgba(72, 88, 255, 0.1);
    color: var(--color-primary);
}

.infra-card__icon--indigo {
    background: rgba(99, 102, 241, 0.1);
    color: #6366f1;
}

.infra-card__icon--purple {
    background: rgba(168, 85, 247, 0.1);
    color: var(--color-accent-purple);
}

.infra-card:hover .infra-card__icon {
    transform: scale(1.1);
}

.infra-card:hover .infra-card__icon--cyan {
    box-shadow: 0 0 20px rgba(0, 212, 255, 0.4);
}

.infra-card:hover .infra-card__icon--blue {
    box-shadow: 0 0 20px var(--color-primary-glow);
}

.infra-card:hover .infra-card__icon--indigo {
    box-shadow: 0 0 20px rgba(99, 102, 241, 0.4);
}

.infra-card:hover .infra-card__icon--purple {
    box-shadow: 0 0 20px rgba(168, 85, 247, 0.4);
}

.infra-card__title {
    font-size: var(--text-lg);
    font-weight: 600;
    margin-bottom: var(--space-2);
}

.infra-card--compact .infra-card__title {
    font-size: var(--text-base);
}

.infra-card__desc {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    line-height: 1.6;
}

/* 功能分组 */
.infra-group {
    margin-bottom: var(--space-12);
}

.infra-group:last-child {
    margin-bottom: 0;
}

.infra-group__title {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    font-size: var(--text-xl);
    font-weight: 600;
    margin-bottom: var(--space-6);
    color: var(--color-text-primary);
}

.infra-group__title svg {
    color: var(--color-primary);
}

/* 安全保障区块 */
.infra-security {
    background: var(--color-bg-secondary);
    position: relative;
    overflow: hidden;
}

.infra-security__bg {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 40% 40% at 20% 80%, rgba(72, 88, 255, 0.06), transparent),
        radial-gradient(ellipse 40% 40% at 80% 20%, rgba(0, 212, 255, 0.06), transparent);
}

.security-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: var(--space-5);
    position: relative;
    z-index: 1;
}

.security-grid .security-card {
    width: 100%;
}

.security-card {
    display: flex;
    min-height: 230px;
    flex-direction: column;
    padding: var(--space-6);
    border-radius: var(--radius-xl);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    text-align: left;
    transition: transform var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base);
}

.security-card:hover {
    transform: translateY(-4px);
    border-color: var(--color-primary);
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.22);
}

.security-card__icon {
    width: 52px;
    height: 52px;
    margin: 0 0 var(--space-5);
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(72, 88, 255, 0.2);
    border-radius: var(--radius-lg);
    background: rgba(72, 88, 255, 0.1);
    color: var(--color-primary);
    transition: color var(--transition-base), background var(--transition-base);
}

.security-card__icon svg {
    width: 26px;
    height: 26px;
}

.security-card:hover .security-card__icon {
    background: rgba(72, 88, 255, 0.16);
    color: var(--color-primary-light);
}

.security-card__title {
    font-size: var(--text-base);
    font-weight: 600;
    margin-bottom: var(--space-3);
    line-height: 1.45;
}

.security-card__desc {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    line-height: 1.7;
}

@media (max-width: 1024px) {
    .security-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .security-grid .security-card:nth-child(5) {
        grid-column: 1 / -1;
        max-width: 400px;
        justify-self: center;
    }
}

/* CTA区块 */
.cta-section {
    background: var(--color-bg-primary);
}

.cta-box {
    padding: var(--space-16);
    border-radius: var(--radius-3xl);
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.15), rgba(168, 85, 247, 0.1));
    border: 1px solid rgba(72, 88, 255, 0.3);
    text-align: center;
}

.cta-box__title {
    font-size: var(--text-3xl);
    font-weight: 700;
    margin-bottom: var(--space-4);
}

.cta-box__desc {
    font-size: var(--text-lg);
    color: var(--color-text-secondary);
    margin-bottom: var(--space-8);
}

.cta-box__actions {
    display: flex;
    gap: var(--space-4);
    justify-content: center;
}

/* 标签颜色变体 */
.section-label--cyan {
    color: var(--color-accent-cyan);
}

.section-label--blue {
    color: var(--color-primary);
}

.section-label--purple {
    color: var(--color-accent-purple);
}

/* 文字颜色 */
.text-cyan {
    color: var(--color-accent-cyan);
}

.text-primary {
    color: var(--color-primary);
}

.text-purple {
    color: var(--color-accent-purple);
}

@media (max-width: 768px) {
    .compare-cards {
        flex-direction: column;
    }

    .compare-card__arrow {
        transform: rotate(90deg);
        animation: pulse-vertical 2s ease-in-out infinite;
    }

    @keyframes pulse-vertical {

        0%,
        100% {
            opacity: 1;
            transform: rotate(90deg) translateX(0);
        }

        50% {
            opacity: 0.5;
            transform: rotate(90deg) translateX(10px);
        }
    }

    .features__grid {
        grid-template-columns: 1fr;
    }

    .value__grid {
        grid-template-columns: 1fr;
    }

    .value-card:last-child {
        max-width: none;
    }

    /* 数字化基建移动端样式 */
    .timeline {
        overflow-x: auto;
        padding-bottom: var(--space-8);
    }

    .timeline__track {
        width: 200%;
        left: 0;
        right: 0;
    }

    .timeline__progress {
        width: 33%;
    }

    .timeline__stages {
        width: 200%;
    }

    .infra-grid,
    .infra-grid--3,
    .infra-grid--4,
    .security-grid {
        grid-template-columns: 1fr;
    }

    .infra-card {
        padding: var(--space-6);
    }

    .security-card__icon {
        width: 52px;
        height: 52px;
        padding: 0;
    }

    .security-grid .security-card:nth-child(5) {
        grid-column: auto;
        max-width: none;
    }

    /* 基建模块移动端样式 */
    .infra-modules {
        flex-direction: column;
        gap: var(--space-6);
    }

    .infra-module {
        max-width: none;
        min-height: 280px;
    }

    .infra-module__arrow {
        display: none;
    }

    .infra-connector {
        display: none;
    }

    .infra-flow-legend {
        flex-direction: column;
        align-items: center;
        gap: var(--space-4);
    }

    .cta-box {
        padding: var(--space-8) var(--space-4);
    }

    .cta-box__title {
        font-size: var(--text-2xl);
    }

    .cta-box__actions {
        flex-direction: column;
    }

    /* Footer移动端居中 */
    .footer__bottom {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: var(--space-6);
    }

    .footer__social {
        justify-content: center;
        width: 100%;
    }

    .footer__legal {
        align-items: center;
        text-align: center;
        width: 100%;
    }

    .footer__beian {
        justify-content: center;
    }
}

/* ==========================================
   数据资产页面样式
   ========================================== */

/* 核心理念 - 数据增长图表 */
.data-concept {
    position: relative;
}

.data-growth {
    max-width: 800px;
    margin: var(--space-12) auto 0;
}

.data-growth__chart {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: var(--space-4);
    height: 300px;
    padding: var(--space-8);
    /* background: var(--color-bg-card);
    border-radius: 16px;
    border: 1px solid var(--color-border); */
}

.data-growth__bar {
    flex: 1;
    max-width: 80px;
    height: calc(var(--height) * 1);
    background: linear-gradient(180deg, var(--color-accent-purple), var(--color-primary));
    border-radius: 8px 8px 0 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    padding-bottom: var(--space-3);
    position: relative;
    transition: all var(--transition-base);
}

.data-growth__bar:hover {
    transform: scaleY(1.05);
    transform-origin: bottom;
}

.data-growth__bar--active {
    background: linear-gradient(180deg, var(--color-accent-cyan), var(--color-primary));
    box-shadow: 0 0 30px rgba(0, 212, 255, 0.4);
}

.data-growth__label {
    font-size: var(--text-xs);
    color: var(--color-text-secondary);
    position: absolute;
    bottom: -28px;
    white-space: nowrap;
}

.data-growth__value {
    font-size: var(--text-xs);
    color: var(--color-accent-cyan);
    position: absolute;
    top: -30px;
    white-space: nowrap;
    font-weight: 600;
}

.data-growth__legend {
    display: flex;
    justify-content: center;
    gap: var(--space-6);
    margin-top: var(--space-10);
}

.data-growth__legend-item {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
}

.data-growth__dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.data-growth__dot--purple {
    background: linear-gradient(135deg, var(--color-accent-purple), var(--color-primary));
}

/* 数据中台 */
.data-foundation {
    position: relative;
    overflow: hidden;
}

.data-foundation__bg {
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 30% 50%, rgba(0, 212, 255, 0.08) 0%, transparent 50%);
    pointer-events: none;
}

.data-foundation__content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-12);
    align-items: center;
    margin-top: var(--space-12);
}

.data-foundation__text {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.data-foundation__item {
    display: flex;
    gap: var(--space-5);
    padding: var(--space-6);
    background: var(--color-bg-card);
    border-radius: 16px;
    border: 1px solid var(--color-border);
    transition: all var(--transition-base);
}

.data-foundation__item:hover {
    border-color: var(--color-accent-cyan);
    transform: translateX(8px);
}

.data-foundation__icon {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    background: rgba(0, 212, 255, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-accent-cyan);
    flex-shrink: 0;
}

.data-foundation__info h3 {
    font-size: var(--text-lg);
    font-weight: 600;
    color: var(--color-text-primary);
    margin-bottom: var(--space-2);
}

.data-foundation__info p {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.data-foundation__info strong {
    color: var(--color-accent-cyan);
}

/* 身份融合动画 */
.data-foundation__visual {
    display: flex;
    justify-content: center;
    align-items: center;
}

.identity-merge {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-8);
}

.identity-merge__sources {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.identity-merge__source {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-4);
    background: var(--color-bg-card);
    border-radius: 12px;
    border: 1px solid var(--color-border);
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    transition: all var(--transition-base);
}

.identity-merge__source--phone:hover {
    color: var(--color-accent-cyan);
    border-color: var(--color-accent-cyan);
}

.identity-merge__source--email:hover {
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.identity-merge__source--wechat:hover {
    color: var(--color-accent-green);
    border-color: var(--color-accent-green);
}

.identity-merge__lines {
    width: 140px;
    height: 100px;
}

.identity-merge__lines svg {
    width: 100%;
    height: 100%;
}

.identity-merge__avatar {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-2);
    position: relative;
}

.identity-merge__avatar-ring {
    position: absolute;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 2px solid var(--color-primary);
    opacity: 0.3;
    animation: pulse-ring 2s ease-out infinite;
}

@keyframes pulse-ring {
    0% {
        transform: scale(0.8);
        opacity: 0.6;
    }

    100% {
        transform: scale(1.4);
        opacity: 0;
    }
}

.identity-merge__avatar svg {
    width: 64px;
    height: 64px;
    padding: var(--space-4);
    background: linear-gradient(135deg, var(--color-primary), var(--color-accent-purple));
    border-radius: 50%;
    color: white;
}

.identity-merge__label {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-primary);
}

/* 数据资产中心 Dashboard */
.data-dashboard {
    position: relative;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr;
    gap: var(--space-6);
    margin-top: var(--space-12);
}

.dashboard-card {
    background: var(--color-bg-card);
    border-radius: 16px;
    border: 1px solid var(--color-border);
    padding: var(--space-6);
    transition: all var(--transition-base);
}

.dashboard-card:hover {
    border-color: var(--color-primary);
    transform: translateY(-4px);
}

.dashboard-card--large {
    grid-row: span 2;
}

.dashboard-card__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-4);
}

.dashboard-card__badge {
    font-size: var(--text-xs);
    padding: var(--space-1) var(--space-3);
    background: rgba(72, 88, 255, 0.2);
    color: var(--color-primary-light);
    border-radius: 20px;
}

.dashboard-card__icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--space-4);
}

.dashboard-card__icon--purple {
    background: rgba(168, 85, 247, 0.1);
    color: var(--color-accent-purple);
}

.dashboard-card__icon--cyan {
    background: rgba(0, 212, 255, 0.1);
    color: var(--color-accent-cyan);
}

.dashboard-card__title {
    font-size: var(--text-lg);
    font-weight: 600;
    color: var(--color-text-primary);
    margin-bottom: var(--space-2);
}

.dashboard-card__desc {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.dashboard-card__desc strong {
    color: var(--color-primary-light);
}

.dashboard-card__visual {
    margin-top: var(--space-6);
}

.dashboard-card__stats {
    display: flex;
    gap: var(--space-6);
}

.dashboard-card__stat {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.dashboard-card__stat-value {
    font-size: var(--text-2xl);
    font-weight: 700;
    font-family: var(--font-display);
    background: linear-gradient(135deg, var(--color-primary), var(--color-accent-cyan));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.dashboard-card__stat-label {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
}

/* AI资源洞察 */
.ai-insights {
    position: relative;
    overflow: hidden;
}

.ai-insights__bg {
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 50% 50%, rgba(72, 88, 255, 0.1) 0%, transparent 60%);
    pointer-events: none;
}

/* 放射式布局容器 */
.ai-insights__radial {
    position: relative;
    min-height: 600px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: var(--space-8);
}

/* 中心AI节点 */
.ai-hub {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-3);
}

.ai-hub__core {
    position: relative;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ai-hub__ring {
    position: absolute;
    border-radius: 50%;
    border: 2px solid;
    animation: ai-pulse 3s ease-in-out infinite;
}

.ai-hub__ring--1 {
    width: 100%;
    height: 100%;
    border-color: rgba(72, 88, 255, 0.3);
    animation-delay: 0s;
}

.ai-hub__ring--2 {
    width: 140%;
    height: 140%;
    border-color: rgba(0, 212, 255, 0.2);
    animation-delay: 0.5s;
}

.ai-hub__ring--3 {
    width: 180%;
    height: 180%;
    border-color: rgba(168, 85, 247, 0.1);
    animation-delay: 1s;
}

@keyframes ai-pulse {

    0%,
    100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.1);
        opacity: 0.6;
    }
}

.ai-hub__icon {
    position: relative;
    z-index: 2;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.9), rgba(0, 212, 255, 0.9));
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow:
        0 0 40px rgba(72, 88, 255, 0.5),
        0 0 80px rgba(0, 212, 255, 0.3);
    animation: ai-glow 2s ease-in-out infinite;
}

@keyframes ai-glow {

    0%,
    100% {
        box-shadow:
            0 0 40px rgba(72, 88, 255, 0.5),
            0 0 80px rgba(0, 212, 255, 0.3);
    }

    50% {
        box-shadow:
            0 0 60px rgba(72, 88, 255, 0.7),
            0 0 120px rgba(0, 212, 255, 0.5);
    }
}

.ai-hub__label {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* SVG连接线 */
.ai-connections {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 1;
}

.ai-connection-line {
    stroke-dasharray: 8 4;
    animation: dash-flow 1.5s linear infinite;
}

@keyframes dash-flow {
    to {
        stroke-dashoffset: -24;
    }
}

.ai-particle {
    filter: blur(1px);
}

/* 卡片样式 - 通用 */
.ai-insights__radial .insight-card {
    position: absolute;
    width: 220px;
    background: var(--color-bg-card);
    border-radius: 16px;
    border: 1px solid var(--color-border);
    padding: var(--space-6);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 5;
}

.ai-insights__radial .insight-card__glow {
    position: absolute;
    inset: -1px;
    border-radius: 17px;
    opacity: 0;
    transition: opacity 0.4s ease;
    z-index: -1;
}

.ai-insights__radial .insight-card:hover {
    /* transform: translateY(-4px) scale(1.02); - Removed to prevent overriding specific transforms */
    border-color: transparent;
}

.ai-insights__radial .insight-card:hover .insight-card__glow {
    opacity: 1;
}

.ai-particles-out {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 1;
}

/* 卡片位置 */
/* 
 * Elliptical Layout Optimization:
 * We stretch the horizontal axis to form an oval surround.
 * Top/Bottom cards are closer to center (vertical compression).
 * Side cards are pushed out (horizontal expansion).
 */


.insight-card--top {
    top: 0%;
    left: 50%;
    transform: translateX(-50%);
}

.insight-card--top:hover {
    transform: translateX(-50%) translateY(4px) scale(1.02);
}

.insight-card--bottom {
    bottom: 0%;
    left: 50%;
    transform: translateX(-50%);
}

.insight-card--bottom:hover {
    transform: translateX(-50%) translateY(-4px) scale(1.02);
}

/* 
 * Side cards: 
 * Push outward horizontally (Left 10%, Right 10%)
 * Spread vertically to form ellipse curve (Top 30%, Bottom 70%)
 */
.insight-card--left-top {
    left: 10%;
    top: 30%;
    transform: translateY(-50%);
}

.insight-card--left-top:hover {
    transform: translateY(-50%) translateX(4px) scale(1.02);
}

.insight-card--left-bottom {
    left: 10%;
    top: 70%;
    transform: translateY(-50%);
}

.insight-card--left-bottom:hover {
    transform: translateY(-50%) translateX(4px) scale(1.02);
}

.insight-card--right-top {
    right: 10%;
    top: 30%;
    transform: translateY(-50%);
}

.insight-card--right-top:hover {
    transform: translateY(-50%) translateX(-4px) scale(1.02);
}

.insight-card--right-bottom {
    right: 10%;
    top: 70%;
    transform: translateY(-50%);
}

.insight-card--right-bottom:hover {
    transform: translateY(-50%) translateX(-4px) scale(1.02);
}

/* Legacy Left/Right map to top positions for now or removed */
/* 图标颜色变体 */
.ai-insights__radial .insight-card__icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--space-4);
    transition: all 0.3s ease;
}


.insight-card__icon--blue {
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.2), rgba(72, 88, 255, 0.1));
    color: #4858ff;
}

.insight-card--top:hover .insight-card__icon--blue {
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.4), rgba(72, 88, 255, 0.2));
    box-shadow: 0 0 20px rgba(72, 88, 255, 0.3);
}

.insight-card--top .insight-card__glow {
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.3), transparent);
}

.insight-card__icon--cyan {
    background: linear-gradient(135deg, rgba(0, 212, 255, 0.2), rgba(0, 212, 255, 0.1));
    color: #00d4ff;
}

.insight-card--left-top:hover .insight-card__icon--cyan {
    background: linear-gradient(135deg, rgba(0, 212, 255, 0.4), rgba(0, 212, 255, 0.2));
    box-shadow: 0 0 20px rgba(0, 212, 255, 0.3);
}

.insight-card--left-top .insight-card__glow {
    background: linear-gradient(135deg, rgba(0, 212, 255, 0.3), transparent);
}

.insight-card__icon--purple {
    background: linear-gradient(135deg, rgba(168, 85, 247, 0.2), rgba(168, 85, 247, 0.1));
    color: #a855f7;
}

.insight-card--right-top:hover .insight-card__icon--purple {
    background: linear-gradient(135deg, rgba(168, 85, 247, 0.4), rgba(168, 85, 247, 0.2));
    box-shadow: 0 0 20px rgba(168, 85, 247, 0.3);
}

.insight-card--right-top .insight-card__glow {
    background: linear-gradient(135deg, rgba(168, 85, 247, 0.3), transparent);
}

.insight-card__icon--green {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.2), rgba(16, 185, 129, 0.1));
    color: #10b981;
}

.insight-card--bottom:hover .insight-card__icon--green {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.4), rgba(16, 185, 129, 0.2));
    box-shadow: 0 0 20px rgba(16, 185, 129, 0.3);
}

.insight-card--bottom .insight-card__glow {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.3), transparent);
}

/* Orange for Left Bottom */
.insight-card__icon--orange {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.2), rgba(245, 158, 11, 0.1));
    color: #f59e0b;
}

.insight-card--left-bottom:hover .insight-card__icon--orange {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.4), rgba(245, 158, 11, 0.2));
    box-shadow: 0 0 20px rgba(245, 158, 11, 0.3);
}

.insight-card--left-bottom .insight-card__glow {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.3), transparent);
}

/* Pink for Right Bottom */
.insight-card__icon--pink {
    background: linear-gradient(135deg, rgba(236, 72, 153, 0.2), rgba(236, 72, 153, 0.1));
    color: #ec4899;
}

.insight-card--right-bottom:hover .insight-card__icon--pink {
    background: linear-gradient(135deg, rgba(236, 72, 153, 0.4), rgba(236, 72, 153, 0.2));
    box-shadow: 0 0 20px rgba(236, 72, 153, 0.3);
}

.insight-card--right-bottom .insight-card__glow {
    background: linear-gradient(135deg, rgba(236, 72, 153, 0.3), transparent);
}

/* 卡片文字 */
.ai-insights__radial .insight-card__title {
    font-size: var(--text-lg);
    font-weight: 600;
    color: var(--color-text-primary);
    margin-bottom: var(--space-2);
}

.ai-insights__radial .insight-card__desc {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.ai-insights__radial .insight-card__desc strong {
    color: var(--color-primary-light);
}

/* 数据资产页响应式 */
@media (max-width: 768px) {
    .data-growth__chart {
        height: 200px;
        gap: var(--space-2);
        padding: var(--space-4);
    }

    .data-growth__bar {
        max-width: 50px;
    }

    .data-foundation__content {
        grid-template-columns: 1fr;
        gap: var(--space-8);
    }

    .identity-merge {
        flex-direction: column;
        padding: var(--space-4);
    }

    .identity-merge__sources {
        flex-direction: row;
    }

    .identity-merge__lines {
        transform: rotate(90deg);
        width: 100px;
        height: 60px;
    }

    .dashboard-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-card--large {
        grid-row: auto;
    }

    /* AI资源洞察响应式 */
    .ai-insights__radial {
        min-height: 0;
        display: flex;
        flex-direction: column;
        gap: var(--space-6);
        padding: var(--space-8) 0;
    }

    .ai-hub {
        position: relative;
        left: auto;
        top: auto;
        transform: none;
        order: -1;
        margin-bottom: var(--space-4);
    }

    .ai-hub__core {
        width: 100px;
        height: 100px;
    }

    .ai-hub__icon {
        width: 64px;
        height: 64px;
    }

    .ai-hub__ring--2 {
        width: 130%;
        height: 130%;
    }

    .ai-hub__ring--3 {
        width: 160%;
        height: 160%;
    }

    .ai-connections {
        display: none;
    }

    .ai-insights__radial .insight-card {
        position: relative;
        width: 100%;
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
        transform: none;
    }

    .insight-card--top,
    .insight-card--bottom,
    .insight-card--left,
    .insight-card--right {
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
        transform: none;
    }

    .insight-card--top:hover,
    .insight-card--bottom:hover,
    .insight-card--left:hover,
    .insight-card--right:hover {
        transform: translateY(-4px);
    }
}

/* ==========================================
   驾驶舱可视化样式
   ========================================== */

.cockpit-visual {
    margin-top: var(--space-12);
}

.cockpit-visual__container {
    background: linear-gradient(180deg, rgba(20, 20, 35, 0.6) 0%, rgba(72, 88, 255, 0.05) 100%);
    border-radius: 20px;
    border: 1px solid rgba(72, 88, 255, 0.2);
    padding: var(--space-6);
    overflow: hidden;
    position: relative;
}

.cockpit-visual__container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 200px;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--color-primary), transparent);
}

.cockpit-visual__svg {
    width: 100%;
    height: auto;
    display: block;
}

/* 功能卡片网格 */
.dashboard-features {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6);
    margin-top: var(--space-10);
}

.dashboard-feature {
    background: var(--color-bg-card);
    border-radius: 16px;
    border: 1px solid var(--color-border);
    padding: var(--space-6);
    text-align: center;
    transition: all var(--transition-base);
}

.dashboard-feature:hover {
    border-color: var(--color-primary);
    transform: translateY(-4px);
}

.dashboard-feature__icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.15), rgba(0, 212, 255, 0.1));
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary-light);
    margin: 0 auto var(--space-4);
}

.dashboard-feature__title {
    font-size: var(--text-lg);
    font-weight: 600;
    color: var(--color-text-primary);
    margin-bottom: var(--space-2);
}

.dashboard-feature__desc {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.dashboard-feature__desc strong {
    color: var(--color-primary-light);
}

/* 响应式 */
@media (max-width: 768px) {
    .cockpit-visual__container {
        padding: var(--space-3);
    }

    .dashboard-features {
        grid-template-columns: 1fr;
        gap: var(--space-4);
    }
}

/* ==========================================
   场景解决方案页面样式
   ========================================== */

.solutions-section {
    position: relative;
}

.solutions-section--legacy {
    display: none;
}

/* ==========================================
   五类场景解决方案长页
   ========================================== */

.solutions-page {
    overflow-x: clip;
}

.solutions-page .footer {
    overflow-x: clip;
}

.solutions-page .ai-hero__content {
    max-width: 1120px;
}

.solutions-page .ai-hero__title {
    max-width: 1060px;
    margin-right: auto;
    margin-left: auto;
}

.solution-anchor-shell {
    position: sticky;
    z-index: calc(var(--z-sticky) - 1);
    top: 72px;
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
    background: rgba(10, 10, 15, 0.9);
    backdrop-filter: blur(18px);
}

.solution-anchor-nav {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    max-width: 1200px;
    margin: 0 auto;
}

.solution-anchor-nav a {
    display: flex;
    min-height: 72px;
    padding: var(--space-3) var(--space-4);
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    border-right: 1px solid var(--color-border);
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    font-weight: 600;
    text-align: center;
    transition: color var(--transition-base), background var(--transition-base);
}

.solution-anchor-nav a:first-child {
    border-left: 1px solid var(--color-border);
}

.solution-anchor-nav a:hover,
.solution-anchor-nav a:focus-visible {
    background: rgba(72, 88, 255, 0.1);
    color: var(--color-text-primary);
}

.solution-anchor-nav a:focus-visible {
    outline: 2px solid var(--color-primary-light);
    outline-offset: -2px;
}

.solution-anchor-nav span {
    color: var(--color-primary-light);
    font-family: var(--font-display);
    font-size: var(--text-xs);
}

.solution-scene,
.solution-custom {
    scroll-margin-top: 152px;
}

.solution-scene {
    position: relative;
    overflow: hidden;
}

.solution-scene--alt {
    background: var(--color-bg-secondary);
}

.solution-scene::before {
    position: absolute;
    top: 18%;
    left: 50%;
    width: 880px;
    height: 440px;
    transform: translateX(-50%);
    background: radial-gradient(ellipse, rgba(72, 88, 255, 0.07), transparent 70%);
    content: '';
    pointer-events: none;
}

.solution-scene .container,
.solution-custom .container {
    position: relative;
    z-index: 1;
}

.solution-scene__header {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    column-gap: var(--space-8);
    max-width: 1040px;
    margin: 0 auto var(--space-12);
}

.solution-scene__index {
    grid-row: 1 / span 2;
    padding-top: 0.55em;
    color: var(--color-capability-decision);
    font-family: var(--font-display);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.12em;
}

.solution-scene__header h2 {
    margin: 0;
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-size: clamp(2rem, 4vw, 3.25rem);
    line-height: 1.15;
}

.solution-scene__header p {
    max-width: 760px;
    margin: var(--space-5) 0 0;
    color: var(--color-text-secondary);
    font-size: var(--text-lg);
    line-height: 1.8;
}

.solution-scene__layout {
    display: grid;
    grid-template-columns: minmax(0, 0.94fr) minmax(420px, 1.06fr);
    gap: var(--space-10);
    max-width: 1160px;
    margin: 0 auto;
    align-items: stretch;
}

.solution-scene__layout--reverse .solution-scene__visual,
.solution-scene__layout--reverse .solution-flow {
    grid-column: 1;
    grid-row: 1;
}

.solution-scene__layout--reverse .solution-scene__brief {
    grid-column: 2;
}

.solution-scene__brief,
.solution-scene__visual,
.solution-flow {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-2xl);
    background: rgba(20, 20, 35, 0.58);
}

.solution-scene__brief {
    display: grid;
    align-content: center;
    gap: var(--space-8);
    padding: var(--space-8);
}

.solution-scene__block h3,
.solution-scene__details h3 {
    margin: 0 0 var(--space-5);
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-size: var(--text-lg);
}

.solution-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.solution-chip-list span {
    padding: var(--space-2) var(--space-3);
    border: 1px solid rgba(72, 88, 255, 0.26);
    border-radius: var(--radius-full);
    background: rgba(72, 88, 255, 0.08);
    color: var(--color-primary-light);
    font-size: var(--text-xs);
}

.solution-need-list {
    display: grid;
    gap: var(--space-3);
}

.solution-need-list li {
    position: relative;
    padding-left: var(--space-5);
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: 1.7;
}

.solution-need-list li::before {
    position: absolute;
    top: 0.68em;
    left: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--color-capability-decision);
    content: '';
}

.solution-scene__visual {
    display: flex;
    min-height: 390px;
    padding: var(--space-8);
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.1), rgba(240, 95, 153, 0.045));
}

.solution-scene__visual .trade-visual-scene,
.solution-scene__visual .match-report {
    width: 100%;
}

.solution-scene__visual .visual-connector span {
    display: block;
    width: 1px;
    height: 32px;
    background: linear-gradient(var(--color-accent-green), var(--color-primary));
}

.solution-scene__visual .match-report__avatar {
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-weight: 700;
}

.solution-scene__details {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(280px, 0.75fr);
    gap: var(--space-5);
    max-width: 1160px;
    margin: var(--space-5) auto 0;
}

.solution-scene__details > div {
    padding: var(--space-8);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: var(--color-bg-card);
}

.solution-service-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-3);
}

.solution-service-list li {
    min-height: 88px;
    padding: var(--space-4);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, 0.022);
}

.solution-service-list strong,
.solution-service-list span {
    display: block;
}

.solution-service-list strong {
    color: var(--color-text-primary);
    font-size: var(--text-sm);
}

.solution-service-list span {
    margin-top: var(--space-2);
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    line-height: 1.6;
}

.solution-outcome-list {
    display: grid;
    gap: var(--space-2);
}

.solution-outcome-list li {
    position: relative;
    min-height: 50px;
    padding: 0.78rem var(--space-4) 0.78rem 2.45rem;
    border: 1px solid rgba(96, 150, 255, 0.16);
    border-radius: 9px;
    background: linear-gradient(90deg, rgba(72, 88, 255, 0.13), rgba(72, 88, 255, 0.035));
    color: rgba(235, 239, 255, 0.88);
    font-size: var(--text-sm);
    font-weight: 500;
    line-height: 1.65;
    transition: transform var(--transition-base), border-color var(--transition-base), background var(--transition-base);
}

.solution-outcome-list li::before {
    position: absolute;
    top: 50%;
    left: 0.72rem;
    display: grid;
    width: 0.42rem;
    height: 0.42rem;
    transform: translateY(-50%);
    place-items: center;
    border-radius: 50%;
    background: rgba(150, 165, 235, 0.72);
    box-shadow: 0 0 0 3px rgba(72, 88, 255, 0.07);
    content: '';
}

.solution-outcome-list li:hover {
    transform: translateX(3px);
    border-color: rgba(96, 150, 255, 0.38);
    background: linear-gradient(90deg, rgba(72, 88, 255, 0.2), rgba(72, 88, 255, 0.06));
}

.solution-scene__products {
    display: flex;
    max-width: 1160px;
    margin: var(--space-5) auto 0;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-3);
    color: var(--color-text-muted);
    font-size: var(--text-sm);
}

.solution-scene__products a {
    padding: var(--space-2) var(--space-4);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    color: var(--color-primary-light);
    transition: border-color var(--transition-base), background var(--transition-base);
}

.solution-scene__products a:hover,
.solution-scene__products a:focus-visible {
    border-color: var(--color-primary-light);
    background: rgba(72, 88, 255, 0.1);
}

.solution-flow {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-3);
    padding: var(--space-6);
    align-content: center;
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.1), rgba(240, 95, 153, 0.045));
}

.solution-flow li {
    min-height: 142px;
    padding: var(--space-5);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: rgba(10, 10, 15, 0.48);
}

.solution-flow span {
    color: var(--color-capability-decision);
    font-family: var(--font-display);
    font-size: var(--text-xs);
    font-weight: 700;
}

.solution-flow strong,
.solution-flow p {
    display: block;
}

.solution-flow strong {
    margin-top: var(--space-4);
    color: var(--color-text-primary);
    font-size: var(--text-base);
}

.solution-flow p {
    margin: var(--space-2) 0 0;
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    line-height: 1.6;
}

.solution-flow--five li:last-child {
    grid-column: 1 / -1;
}

.solution-custom {
    overflow: hidden;
    background: linear-gradient(180deg, var(--color-bg-secondary), var(--color-bg-primary));
}

.solution-custom__intro {
    max-width: 860px;
}

.solution-custom__intro .section-title,
.solution-custom__intro p {
    text-align: left;
}

.solution-custom__intro p {
    margin: var(--space-5) 0 var(--space-6);
    color: var(--color-text-secondary);
    font-size: var(--text-lg);
    line-height: 1.8;
}

.solution-custom__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-4);
    margin-top: var(--space-12);
}

.solution-custom__grid article {
    min-height: 220px;
    padding: var(--space-6);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: var(--color-bg-card);
}

.solution-custom__grid span {
    color: var(--color-capability-decision);
    font-family: var(--font-display);
    font-size: var(--text-xs);
    font-weight: 700;
}

.solution-custom__grid h3 {
    margin: var(--space-8) 0 var(--space-3);
    color: var(--color-text-primary);
    font-size: var(--text-xl);
}

.solution-custom__grid p {
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: 1.75;
}

.solution-custom__cta {
    display: flex;
    margin-top: var(--space-8);
    padding: var(--space-6) var(--space-8);
    align-items: center;
    justify-content: space-between;
    gap: var(--space-6);
    border: 1px solid rgba(72, 88, 255, 0.3);
    border-radius: var(--radius-xl);
    background: rgba(72, 88, 255, 0.065);
}

.solution-custom__cta p {
    margin: 0;
    color: var(--color-text-secondary);
}

@media (max-width: 1024px) {
    .solution-anchor-shell {
        top: 64px;
    }

    .solution-anchor-shell .container {
        overflow-x: auto;
        padding: 0;
        scrollbar-width: thin;
        scroll-snap-type: x proximity;
    }

    .solution-anchor-nav {
        grid-template-columns: repeat(5, max-content);
        min-width: max-content;
    }

    .solution-anchor-nav a {
        scroll-snap-align: start;
        white-space: nowrap;
    }

    .solution-scene,
    .solution-custom {
        scroll-margin-top: 138px;
    }

    .solution-scene__layout {
        grid-template-columns: minmax(0, 0.88fr) minmax(360px, 1.12fr);
    }

    .solution-scene__details {
        grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.65fr);
    }

    .solution-custom__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .solutions-page .ai-hero__title {
        font-size: clamp(2.2rem, 10vw, 3.4rem);
    }

    .solution-anchor-nav a {
        min-height: 62px;
    }

    .solution-scene__header {
        grid-template-columns: 1fr;
        row-gap: var(--space-3);
        margin-bottom: var(--space-8);
    }

    .solution-scene__index {
        grid-row: auto;
        padding-top: 0;
    }

    .solution-scene__header p {
        margin-top: var(--space-3);
        font-size: var(--text-base);
    }

    .solution-scene__layout,
    .solution-scene__details {
        grid-template-columns: 1fr;
        gap: var(--space-4);
    }

    .solution-scene__layout--reverse .solution-scene__visual,
    .solution-scene__layout--reverse .solution-flow,
    .solution-scene__layout--reverse .solution-scene__brief {
        grid-column: auto;
        grid-row: auto;
    }

    .solution-scene__brief,
    .solution-scene__visual,
    .solution-scene__details > div {
        padding: var(--space-6);
    }

    .solution-scene__visual {
        min-height: 330px;
    }

    .solution-scene__products {
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .solution-custom__intro .section-title {
        font-size: var(--text-3xl);
    }

    .solution-custom__cta {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .solution-service-list,
    .solution-flow,
    .solution-custom__grid {
        grid-template-columns: 1fr;
    }

    .solution-flow--five li:last-child {
        grid-column: auto;
    }

    .solution-flow li,
    .solution-custom__grid article {
        min-height: 0;
    }

    .solution-scene__visual.solution-visual--conference {
        gap: var(--space-5);
    }

    .solution-scene__products span:first-child {
        flex-basis: 100%;
    }

    .solution-custom__cta {
        padding: var(--space-6);
    }
}

@media (prefers-reduced-motion: reduce) {
    .solutions-page .visual-card--notification,
    .solutions-page .visual-card--gate::after,
    .solutions-page .match-report__line::after {
        animation: none;
    }
}

/* ==========================================
   首页场景入口
   ========================================== */

.scenario-overview {
    position: relative;
    overflow: hidden;
}

.scenario-overview::before {
    content: '';
    position: absolute;
    top: 10%;
    left: 50%;
    width: 720px;
    height: 360px;
    transform: translateX(-50%);
    background: radial-gradient(ellipse, rgba(72, 88, 255, 0.1), transparent 70%);
    pointer-events: none;
}

.scenario-overview .container {
    position: relative;
    z-index: 1;
}

.scenario-overview__grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: var(--space-5);
    max-width: 1200px;
    margin: 0 auto;
}

.scenario-overview__card {
    --scenario-accent: 72, 88, 255;
    grid-column: span 2;
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 238px;
    padding: var(--space-8);
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: rgba(15, 23, 42, 0.38);
    color: var(--color-text-primary);
    text-decoration: none;
    transition: transform var(--transition-base), border-color var(--transition-base), background var(--transition-base), box-shadow var(--transition-base);
}

.scenario-overview__card:nth-child(4) {
    grid-column: 2 / span 2;
}

.scenario-overview__card:nth-child(5) {
    grid-column: 4 / span 2;
}

.scenario-overview__card::after {
    content: '';
    position: absolute;
    right: -28px;
    bottom: -30px;
    width: 118px;
    height: 118px;
    border: 1px solid rgba(var(--scenario-accent), 0.28);
    border-radius: 50%;
    box-shadow: 0 0 0 22px rgba(var(--scenario-accent), 0.04), 0 0 0 44px rgba(var(--scenario-accent), 0.022);
}

.scenario-overview__card:hover {
    transform: translateY(-5px);
    border-color: rgba(var(--scenario-accent), 0.68);
    background: rgba(var(--scenario-accent), 0.12);
    box-shadow: 0 18px 38px rgba(15, 23, 42, 0.28), 0 0 16px rgba(var(--scenario-accent), 0.1);
}

.scenario-overview__number {
    margin-bottom: var(--space-6);
    color: var(--color-primary);
    font-family: var(--font-display);
    font-size: var(--text-sm);
    font-weight: 700;
    letter-spacing: 0.12em;
}

.scenario-overview__card h3 {
    margin-bottom: var(--space-3);
    font-size: var(--text-xl);
    color: var(--color-text-primary);
}

.scenario-overview__card p {
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: 1.75;
}

.scenario-overview__card > span:last-child {
    margin-top: auto;
    padding-top: var(--space-5);
    color: var(--color-primary);
    font-size: var(--text-sm);
    font-weight: 600;
}

/* ==========================================
   数据增强服务页
   ========================================== */
.data-enrichment-page .ai-hero__bg {
    background:
        radial-gradient(ellipse 46% 44% at 50% 34%, rgba(240, 95, 153, 0.1), transparent 72%),
        radial-gradient(ellipse 58% 48% at 68% 18%, rgba(72, 88, 255, 0.14), transparent 72%);
}

.enrichment-hero {
    overflow: hidden;
}

.enrichment-hero__orb {
    position: absolute;
    border: 1px solid rgba(240, 95, 153, 0.18);
    border-radius: 50%;
    pointer-events: none;
}

.enrichment-hero__orb--one {
    top: 26%;
    left: 15%;
    width: 180px;
    height: 180px;
    box-shadow: 0 0 0 36px rgba(240, 95, 153, 0.025), 0 0 0 72px rgba(72, 88, 255, 0.02);
}

.enrichment-hero__orb--two {
    right: 13%;
    bottom: 16%;
    width: 96px;
    height: 96px;
    border-color: rgba(72, 88, 255, 0.22);
    box-shadow: 0 0 0 24px rgba(72, 88, 255, 0.03);
}

.enrichment-transform {
    position: relative;
    overflow: hidden;
}

.enrichment-transform::before {
    position: absolute;
    top: 12%;
    left: 50%;
    width: 740px;
    height: 320px;
    transform: translateX(-50%);
    background: radial-gradient(ellipse, rgba(72, 88, 255, 0.09), transparent 70%);
    content: '';
    pointer-events: none;
}

.enrichment-transform .container,
.enrichment-compare .container,
.enrichment-engine .container,
.enrichment-scope .container,
.enrichment-process .container,
.enrichment-scenarios .container,
.enrichment-reasons .container {
    position: relative;
    z-index: 1;
}

.enrichment-transform__flow {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 54px minmax(0, 1.16fr) 54px minmax(0, 1fr);
    align-items: stretch;
    max-width: 1180px;
    margin: var(--space-12) auto 0;
}

.enrichment-transform__stage {
    min-height: 286px;
    padding: var(--space-8);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-2xl);
    background: rgba(15, 23, 42, 0.48);
}

.enrichment-transform__stage--active {
    border-color: rgba(240, 95, 153, 0.38);
    background: linear-gradient(145deg, rgba(240, 95, 153, 0.11), rgba(72, 88, 255, 0.06) 72%);
}

.enrichment-transform__stage-label,
.enrichment-scope__number,
.enrichment-scenario > span {
    display: inline-block;
    color: var(--color-primary-light);
    font-family: var(--font-display);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
}

.enrichment-transform__stage--active .enrichment-transform__stage-label {
    color: var(--color-capability-decision);
}

.enrichment-transform__stage-icon {
    display: grid;
    width: 52px;
    height: 52px;
    margin: var(--space-5) 0;
    place-items: center;
    border: 1px solid rgba(72, 88, 255, 0.34);
    border-radius: var(--radius-xl);
    background: rgba(72, 88, 255, 0.12);
    color: var(--color-primary-light);
}

.enrichment-transform__stage--active .enrichment-transform__stage-icon {
    border-color: rgba(240, 95, 153, 0.42);
    background: rgba(240, 95, 153, 0.13);
    color: var(--color-capability-decision);
}

.enrichment-transform__stage-icon svg {
    width: 28px;
    height: 28px;
}

.enrichment-transform__stage h3,
.enrichment-scope__item h3,
.enrichment-scenario h3,
.enrichment-process__item h3,
.enrichment-reasons h3 {
    margin: 0;
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-weight: 700;
}

.enrichment-transform__stage h3 {
    font-size: var(--text-xl);
}

.enrichment-transform__stage p,
.enrichment-scope__item p,
.enrichment-scenario p,
.enrichment-process__item p,
.enrichment-reasons p {
    margin: var(--space-3) 0 0;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: 1.8;
}

.enrichment-transform__connector {
    display: grid;
    place-items: center;
    color: rgba(72, 88, 255, 0.7);
}

.enrichment-transform__connector svg {
    width: 28px;
    height: 28px;
}

/* 数据增强前后对比：用企业档案字段变化作为核心视觉证据 */
.enrichment-compare {
    overflow: hidden;
    background: linear-gradient(180deg, var(--color-bg-primary), #0d1020 52%, var(--color-bg-primary));
}

.enrichment-compare__table {
    display: grid;
    grid-template-columns: minmax(0, 0.82fr) 140px minmax(0, 1.18fr);
    max-width: 1120px;
    margin: var(--space-12) auto 0;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-2xl);
    background: rgba(10, 10, 15, 0.64);
}

.enrichment-compare__head {
    min-height: 104px;
    padding: var(--space-6) var(--space-8);
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-size: var(--text-xl);
    font-weight: 700;
    line-height: 1.35;
}

.enrichment-compare__head span {
    display: block;
    margin-top: var(--space-2);
    color: var(--color-text-muted);
    font-family: var(--font-body);
    font-size: var(--text-sm);
    font-weight: 400;
}

.enrichment-compare__head--before {
    background: rgba(255, 255, 255, 0.015);
    color: rgba(255, 255, 255, 0.72);
}

.enrichment-compare__head--after {
    position: relative;
    overflow: hidden;
    border-left: 1px solid rgba(96, 150, 255, 0.38);
    background: linear-gradient(110deg, rgba(240, 95, 153, 0.2), rgba(72, 88, 255, 0.23));
    box-shadow: inset 3px 0 0 var(--color-primary-light), 0 0 36px rgba(72, 88, 255, 0.1);
}

.enrichment-compare__head--after::after {
    position: absolute;
    top: -70%;
    right: 14%;
    width: 140px;
    height: 220%;
    transform: rotate(28deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.11), transparent);
    content: '';
    pointer-events: none;
}

.enrichment-compare__axis,
.enrichment-compare__label {
    position: relative;
    display: grid;
    padding: var(--space-4);
    place-items: center;
    border-right: 1px solid var(--color-border);
    border-left: 1px solid var(--color-border);
    background: linear-gradient(180deg, rgba(72, 88, 255, 0.09), rgba(240, 95, 153, 0.07));
    color: var(--color-primary-light);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-align: center;
}

.enrichment-compare__axis {
    color: var(--color-primary-light);
}

.enrichment-compare__cell,
.enrichment-compare__label {
    min-height: 74px;
    border-top: 1px solid var(--color-border);
}

.enrichment-compare__cell {
    display: flex;
    align-items: center;
    padding: var(--space-5) var(--space-8);
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: 1.75;
}

.enrichment-compare__cell--before {
    background: rgba(255, 255, 255, 0.008);
    color: rgba(255, 255, 255, 0.42);
}

.enrichment-compare__cell--after {
    position: relative;
    padding-left: calc(var(--space-8) + 4px);
    border-left: 1px solid rgba(96, 150, 255, 0.23);
    background: linear-gradient(90deg, rgba(240, 95, 153, 0.07), rgba(72, 88, 255, 0.13));
    box-shadow: inset 3px 0 0 rgba(96, 150, 255, 0.72);
    color: rgba(255, 255, 255, 0.94);
    font-size: 0.9375rem;
    font-weight: 500;
}

.enrichment-compare__cell--after::before {
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-right: var(--space-3);
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--color-accent-cyan);
    box-shadow: 0 0 10px rgba(0, 212, 255, 0.8);
    content: '';
}

/* 引擎的可信度来自清晰、可说明的处理顺序 */
.enrichment-engine {
    position: relative;
}

.enrichment-engine::before {
    position: absolute;
    top: 20%;
    left: 50%;
    width: min(980px, 90vw);
    height: 400px;
    transform: translateX(-50%);
    background: radial-gradient(ellipse, rgba(240, 95, 153, 0.09), transparent 68%);
    content: '';
    pointer-events: none;
}

.enrichment-engine__flow {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: var(--space-3);
    max-width: 1200px;
    margin: var(--space-12) auto 0;
    counter-reset: engine-flow;
}

.enrichment-engine__flow li {
    position: relative;
    min-height: 212px;
    padding: var(--space-6);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: rgba(20, 20, 35, 0.76);
}

.enrichment-engine__flow li.enrichment-engine__step--facts,
.enrichment-engine__flow li.enrichment-engine__step--decision {
    border-color: rgba(240, 95, 153, 0.38);
    background: linear-gradient(155deg, rgba(240, 95, 153, 0.14), rgba(72, 88, 255, 0.1) 78%);
    box-shadow: 0 0 30px rgba(240, 95, 153, 0.06);
}

.enrichment-engine__flow li.enrichment-engine__step--decision {
    border-color: rgba(96, 150, 255, 0.46);
    background: linear-gradient(155deg, rgba(72, 88, 255, 0.17), rgba(240, 95, 153, 0.09) 78%);
}

.enrichment-engine__flow li:not(:last-child)::after {
    position: absolute;
    z-index: 2;
    top: 50%;
    right: -10px;
    width: 19px;
    height: 1px;
    background: var(--color-primary-light);
    box-shadow: 0 0 12px rgba(72, 88, 255, 0.7);
    content: '';
}

.enrichment-engine__flow li.enrichment-engine__step--facts::before {
    position: absolute;
    z-index: 3;
    top: 50%;
    right: -28px;
    padding: 2px 5px;
    transform: translateY(-50%);
    border: 1px solid rgba(240, 95, 153, 0.36);
    border-radius: 999px;
    background: #171326;
    color: #ff9ec6;
    content: '事实 → 判断';
    font-size: 0.56rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.enrichment-engine__flow span {
    display: block;
    margin-bottom: var(--space-6);
    color: var(--color-capability-decision);
    font-family: var(--font-display);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.1em;
}

.enrichment-engine__flow strong {
    display: block;
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-size: var(--text-lg);
    line-height: 1.42;
}

.enrichment-engine__flow p {
    margin: var(--space-4) 0 0;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: 1.75;
}

.enrichment-engine__flow small {
    display: block;
    margin-top: var(--space-5);
    color: #9faef1;
    font-size: 0.625rem;
    line-height: 1.45;
}

.enrichment-engine__flow li.enrichment-engine__step--facts small,
.enrichment-engine__flow li.enrichment-engine__step--decision small {
    color: #ffc2da;
}

.enrichment-engine__evidence {
    max-width: 1200px;
    margin: var(--space-8) auto 0;
}

.enrichment-engine__evidence-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: var(--space-8);
    margin-bottom: var(--space-5);
}

.enrichment-engine__eyebrow {
    display: block;
    margin-bottom: var(--space-2);
    color: var(--color-capability-decision);
    font-family: var(--font-display);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
}

.enrichment-engine__evidence-heading h3 {
    margin: 0;
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-size: var(--text-xl);
}

.enrichment-engine__evidence-heading > p {
    max-width: 360px;
    margin: 0;
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    line-height: 1.7;
    text-align: right;
}

.enrichment-engine__deliverables {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-4);
}

.enrichment-sample {
    min-height: 344px;
    overflow: hidden;
    border: 1px solid rgba(96, 150, 255, 0.25);
    border-radius: var(--radius-xl);
    background: linear-gradient(160deg, rgba(25, 30, 55, 0.92), rgba(12, 14, 26, 0.94));
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.16);
}

.enrichment-sample__bar {
    display: flex;
    align-items: center;
    gap: 5px;
    min-height: 35px;
    padding: 0 var(--space-4);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(5, 7, 15, 0.38);
}

.enrichment-sample__bar > span {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: rgba(171, 182, 220, 0.5);
}

.enrichment-sample__bar > span:first-child { background: #f05f99; }
.enrichment-sample__bar > span:nth-child(2) { background: #8f8dff; }

.enrichment-sample__bar b {
    margin-left: var(--space-2);
    color: var(--color-text-muted);
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.enrichment-sample__title-row {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    gap: var(--space-3);
    align-items: center;
    padding: var(--space-5) var(--space-5) var(--space-3);
}

.enrichment-sample__mark {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(240, 95, 153, 0.5), rgba(72, 88, 255, 0.6));
    color: #fff;
    font-size: var(--text-sm);
    font-weight: 700;
}

.enrichment-sample h3 {
    margin: 0;
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-size: var(--text-sm);
    line-height: 1.4;
}

.enrichment-sample__title-row p,
.enrichment-sample__source,
.enrichment-sample__note {
    margin: 3px 0 0;
    color: var(--color-text-muted);
    font-size: 0.625rem;
    line-height: 1.5;
}

.enrichment-sample__confidence {
    color: #63d9ff;
    font-family: var(--font-display);
    font-size: var(--text-xl);
    line-height: 1;
}

.enrichment-sample__confidence span { font-size: 0.65rem; }

.enrichment-sample__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0 var(--space-5) var(--space-4);
}

.enrichment-sample__tags span {
    padding: 3px 7px;
    border: 1px solid rgba(96, 150, 255, 0.26);
    border-radius: 999px;
    background: rgba(72, 88, 255, 0.1);
    color: #b9c8ff;
    font-size: 0.625rem;
}

.enrichment-sample__fields {
    display: grid;
    gap: 0;
    margin: 0 var(--space-5);
    border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.enrichment-sample__fields div {
    display: grid;
    grid-template-columns: 66px minmax(0, 1fr);
    gap: var(--space-2);
    padding: 8px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.enrichment-sample__fields dt { color: var(--color-text-muted); font-size: 0.625rem; }
.enrichment-sample__fields dd { margin: 0; color: #e0e6ff; font-size: 0.6875rem; line-height: 1.5; }
.enrichment-sample__fields i,
.enrichment-sample__note i { display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: #54dfbb; box-shadow: 0 0 8px rgba(84, 223, 187, 0.7); }
.enrichment-sample__source { padding: var(--space-3) var(--space-5); }

.enrichment-sample__list-head {
    display: grid;
    grid-template-columns: 1.22fr 0.84fr 0.8fr;
    gap: var(--space-2);
    padding: var(--space-4) var(--space-5) var(--space-2);
    color: var(--color-text-muted);
    font-size: 0.625rem;
}

.enrichment-sample__target-list { margin: 0; padding: 0 var(--space-5); list-style: none; }

.enrichment-sample__target-list li {
    display: grid;
    grid-template-columns: 1.22fr 0.84fr 0.8fr;
    gap: var(--space-2);
    align-items: center;
    min-height: 60px;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.enrichment-sample__target-list strong { display: block; overflow: hidden; color: #edf0ff; font-size: 0.6875rem; text-overflow: ellipsis; white-space: nowrap; }
.enrichment-sample__target-list span { display: block; margin-top: 3px; color: #b4a2e9; font-size: 0.6rem; }
.enrichment-sample__target-list p { margin: 0; color: #b7bed5; font-size: 0.6rem; line-height: 1.55; }
.enrichment-sample__target-list em { justify-self: start; padding: 3px 5px; border-radius: 5px; background: rgba(240, 95, 153, 0.12); color: #ffb6d2; font-size: 0.6rem; font-style: normal; white-space: nowrap; }
.enrichment-sample__note { margin: var(--space-3) var(--space-5); padding-top: var(--space-3); border-top: 1px solid rgba(255, 255, 255, 0.07); }

.enrichment-sample__map { display: grid; gap: 6px; padding: var(--space-4) var(--space-5) var(--space-3); }
.enrichment-sample__map-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); margin-bottom: 3px; color: var(--color-text-muted); font-size: 0.6rem; }
.enrichment-sample__map-heading strong { color: #ffb6d2; font-size: 0.6rem; font-weight: 600; white-space: nowrap; }
.enrichment-sample__node { display: grid; grid-template-columns: 42px minmax(0, 1fr); column-gap: 8px; align-items: center; width: 100%; padding: 7px 9px; border: 1px solid rgba(96, 150, 255, 0.25); border-radius: 8px; background: rgba(72, 88, 255, 0.11); }
.enrichment-sample__node > span { grid-row: span 2; padding: 3px 0; border-right: 1px solid rgba(150, 165, 235, 0.2); color: #a9b9f5; font-size: 0.5625rem; font-weight: 600; }
.enrichment-sample__node strong { color: #e5ebff; font-size: 0.6875rem; line-height: 1.3; }
.enrichment-sample__node small { display: block; color: #8f9bc6; font-size: 0.5625rem; line-height: 1.4; }
.enrichment-sample__node--core { border-color: rgba(240, 95, 153, 0.62); background: linear-gradient(90deg, rgba(240, 95, 153, 0.2), rgba(72, 88, 255, 0.18)); box-shadow: 0 0 18px rgba(240, 95, 153, 0.09); }
.enrichment-sample__node--core > span { color: #ffb6d2; border-color: rgba(240, 95, 153, 0.26); }
.enrichment-sample__map-arrow { height: 8px; color: #9aaaf1; font-size: 0.75rem; line-height: 8px; text-align: center; }
.enrichment-sample__opportunity { margin: 0 var(--space-5); padding: var(--space-3); border: 1px solid rgba(84, 223, 187, 0.2); border-radius: 8px; background: rgba(84, 223, 187, 0.055); }
.enrichment-sample__opportunity span { color: #7fe4c6; font-size: 0.625rem; font-weight: 600; }
.enrichment-sample__opportunity p { margin: 4px 0 0; color: #cad5d7; font-size: 0.625rem; line-height: 1.55; }
.enrichment-sample--map .enrichment-sample__source { padding-top: var(--space-3); }
}

.enrichment-scope {
    background: var(--color-bg-secondary);
}

.enrichment-scope__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-5);
    max-width: 1060px;
    margin: var(--space-12) auto 0;
}

.enrichment-scope__item {
    min-height: 304px;
    padding: var(--space-8);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: var(--color-bg-card);
    transition: transform var(--transition-base), border-color var(--transition-base), background var(--transition-base);
}

.enrichment-scope__item:hover {
    transform: translateY(-4px);
    border-color: rgba(240, 95, 153, 0.42);
    background: rgba(240, 95, 153, 0.06);
}

.enrichment-scope__number {
    margin-bottom: var(--space-5);
    color: var(--color-capability-decision);
}

.enrichment-scope__item h3 {
    font-size: var(--text-xl);
}

.enrichment-scope__item dl {
    display: grid;
    gap: var(--space-3);
    margin: var(--space-6) 0 0;
}

.enrichment-scope__item dl div {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: var(--space-3);
    align-items: baseline;
}

.enrichment-scope__item dt {
    color: var(--color-text-subtle);
    font-size: var(--text-xs);
    white-space: nowrap;
}

.enrichment-scope__item dd {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: 1.65;
}

.enrichment-process {
    position: relative;
}

.enrichment-journey {
    max-width: 1080px;
    margin: var(--space-12) auto 0;
}

.enrichment-journey__tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: var(--color-border);
}

.enrichment-journey__tab {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    min-height: 64px;
    padding: var(--space-4) var(--space-5);
    border: 0;
    background: var(--color-bg-card);
    color: var(--color-text-secondary);
    font: inherit;
    font-size: var(--text-sm);
    font-weight: 600;
    cursor: pointer;
    transition: background var(--transition-base), color var(--transition-base);
}

.enrichment-journey__tab span {
    color: var(--color-primary-light);
    font-family: var(--font-display);
    font-size: var(--text-xs);
    letter-spacing: 0.08em;
}

.enrichment-journey__tab:hover,
.enrichment-journey__tab.is-active {
    background: rgba(72, 88, 255, 0.13);
    color: var(--color-text-primary);
}

.enrichment-journey__tab.is-active {
    box-shadow: inset 0 -2px 0 var(--color-primary);
}

.enrichment-journey__tab:focus-visible {
    position: relative;
    z-index: 1;
    outline: 2px solid var(--color-primary-light);
    outline-offset: -2px;
}

.enrichment-journey__panels {
    margin-top: var(--space-5);
}

.enrichment-journey__panel {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(260px, 0.8fr);
    gap: var(--space-12);
    min-height: 260px;
    padding: var(--space-10);
    border: 1px solid rgba(72, 88, 255, 0.38);
    border-radius: var(--radius-xl);
    background: linear-gradient(120deg, rgba(72, 88, 255, 0.1), var(--color-bg-card) 48%);
    animation: enrichment-journey-in 280ms ease-out both;
}

.enrichment-journey__panel[hidden] {
    display: none;
}

@keyframes enrichment-journey-in {
    from {
        opacity: 0;
        transform: translateY(6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.enrichment-journey__eyebrow {
    display: block;
    margin-bottom: var(--space-4);
    color: var(--color-capability-decision);
    font-size: var(--text-sm);
    font-weight: 600;
}

.enrichment-journey__copy h3 {
    margin: 0;
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-size: var(--text-2xl);
    font-weight: 700;
    line-height: 1.35;
}

.enrichment-journey__copy p {
    max-width: 560px;
    margin: var(--space-5) 0 0;
    color: var(--color-text-secondary);
    font-size: var(--text-base);
    line-height: 1.8;
}

.enrichment-journey__list {
    display: grid;
    align-content: center;
    gap: var(--space-4);
    margin: 0;
    padding: var(--space-8) 0 var(--space-8) var(--space-10);
    border-left: 1px solid var(--color-border);
    list-style: none;
}

.enrichment-journey__list li {
    position: relative;
    padding-left: var(--space-4);
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: 1.6;
}

.enrichment-journey__list li::before {
    position: absolute;
    top: 0.58em;
    left: 0;
    width: 6px;
    height: 6px;
    border-radius: var(--radius-full);
    background: var(--color-primary-light);
    content: '';
}

.enrichment-scenarios {
    background: var(--color-bg-secondary);
}

.enrichment-scenarios__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 var(--space-12);
    max-width: 1080px;
    margin: var(--space-12) auto 0;
}

.enrichment-scenario {
    padding: var(--space-8) 0;
    border-top: 1px solid var(--color-border);
}

.enrichment-scenario:nth-last-child(-n + 2) {
    border-bottom: 1px solid var(--color-border);
}

.enrichment-scenario > span {
    color: var(--color-primary-light);
}

.enrichment-scenario h3 {
    margin-top: var(--space-4);
    font-size: var(--text-xl);
}

.enrichment-reasons {
    background: var(--color-bg-secondary);
}

.enrichment-reasons__list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: 1080px;
    margin: var(--space-12) auto 0;
}

.enrichment-reasons__list article {
    padding: var(--space-2) var(--space-8) var(--space-2) 0;
}

.enrichment-reasons__list article + article {
    padding-left: var(--space-8);
    border-left: 1px solid var(--color-border);
}

.enrichment-reasons h3 {
    font-size: var(--text-lg);
}

.enrichment-faq__content {
    max-width: 960px;
}

.enrichment-faq__list {
    margin-top: var(--space-10);
    border-top: 1px solid var(--color-border);
}

.enrichment-faq details {
    border-bottom: 1px solid var(--color-border);
}

.enrichment-faq summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-6);
    padding: var(--space-6) 0;
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-size: var(--text-lg);
    font-weight: 600;
    cursor: pointer;
    list-style: none;
}

.enrichment-faq summary::-webkit-details-marker {
    display: none;
}

.enrichment-faq summary span {
    flex: 0 0 auto;
    color: var(--color-capability-decision);
    font-family: var(--font-body);
    font-size: var(--text-2xl);
    font-weight: 400;
    transition: transform var(--transition-base);
}

.enrichment-faq details[open] summary span {
    transform: rotate(45deg);
}

.enrichment-faq details p {
    max-width: 760px;
    margin: 0;
    padding: 0 0 var(--space-6);
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: 1.8;
}

@media (max-width: 960px) {
    .enrichment-transform__flow {
        grid-template-columns: 1fr;
        gap: var(--space-4);
        max-width: 560px;
    }

    .enrichment-transform__connector {
        height: 36px;
        transform: rotate(90deg);
    }

    .enrichment-engine__flow {
        grid-template-columns: 1fr;
        max-width: 620px;
        gap: var(--space-3);
    }

    .enrichment-engine__flow li {
        min-height: 0;
        padding: var(--space-5) var(--space-6);
    }

    .enrichment-engine__flow li:not(:last-child)::after {
        top: auto;
        right: auto;
        bottom: -13px;
        left: 50%;
        width: 1px;
        height: 23px;
    }

    .enrichment-engine__flow li.enrichment-engine__step--facts::before {
        top: auto;
        right: auto;
        bottom: -25px;
        left: 50%;
        transform: translateX(-50%);
    }

    .enrichment-engine__flow span {
        margin-bottom: var(--space-3);
    }

    .enrichment-engine__evidence {
        max-width: 620px;
    }

    .enrichment-journey__panel {
        grid-template-columns: 1fr;
        gap: var(--space-8);
        padding: var(--space-8);
    }

    .enrichment-journey__list {
        padding: var(--space-8) 0 0 var(--space-10);
        border-top: 1px solid var(--color-border);
        border-left: 0;
    }
}

@media (max-width: 768px) {
    .enrichment-hero__orb--one {
        top: 18%;
        left: -16%;
        width: 140px;
        height: 140px;
    }

    .enrichment-hero__orb--two {
        right: -8%;
        bottom: 18%;
    }

    .enrichment-transform__stage {
        min-height: 0;
        padding: var(--space-6);
    }

    .enrichment-compare__table {
        grid-template-columns: minmax(0, 0.78fr) 90px minmax(0, 1.22fr);
        margin-top: var(--space-8);
        border-radius: var(--radius-xl);
    }

    .enrichment-compare__head {
        min-height: 92px;
        padding: var(--space-5);
        font-size: var(--text-lg);
    }

    .enrichment-compare__cell {
        min-height: 88px;
        padding: var(--space-4) var(--space-5);
        font-size: var(--text-xs);
    }

    .enrichment-compare__cell--after {
        padding-left: calc(var(--space-5) + 4px);
        font-size: var(--text-sm);
    }

    .enrichment-compare__axis,
    .enrichment-compare__label {
        padding: var(--space-3);
        font-size: 0.65rem;
    }

    .enrichment-engine__deliverables {
        grid-template-columns: 1fr;
    }

    .enrichment-engine__evidence-heading {
        display: block;
        margin-bottom: var(--space-4);
    }

    .enrichment-engine__evidence-heading h3 {
        font-size: var(--text-lg);
    }

    .enrichment-engine__evidence-heading > p {
        margin-top: var(--space-3);
        text-align: left;
    }

    .enrichment-sample {
        min-height: 0;
    }

    .enrichment-scope__grid,
    .enrichment-scenarios__grid {
        grid-template-columns: 1fr;
    }

    .enrichment-scope__grid {
        gap: var(--space-4);
    }

    .enrichment-scope__item {
        min-height: 0;
        padding: var(--space-6);
    }

    .enrichment-reasons__list {
        grid-template-columns: 1fr;
    }

    .enrichment-journey__tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .enrichment-journey__tab {
        min-height: 58px;
        padding: var(--space-3) var(--space-4);
    }

    .enrichment-journey__panel {
        min-height: 0;
        padding: var(--space-6);
    }

    .enrichment-journey__copy h3 {
        font-size: var(--text-xl);
    }

    .enrichment-journey__copy p {
        font-size: var(--text-sm);
    }

    .enrichment-journey__list {
        gap: var(--space-3);
        padding: var(--space-6) 0 0 var(--space-8);
    }

    .enrichment-scenario:nth-last-child(-n + 2) {
        border-bottom: 0;
    }

    .enrichment-scenario:last-child {
        border-bottom: 1px solid var(--color-border);
    }

    .enrichment-reasons__list article,
    .enrichment-reasons__list article + article {
        padding: var(--space-6) 0;
        border-top: 1px solid var(--color-border);
        border-left: 0;
    }

    .enrichment-reasons__list article:last-child {
        border-bottom: 1px solid var(--color-border);
    }

    .enrichment-faq summary {
        padding: var(--space-5) 0;
        font-size: var(--text-base);
    }
}

@media (max-width: 520px) {
    .enrichment-compare__table {
        grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
    }

    .enrichment-compare__axis,
    .enrichment-compare__label {
        display: none;
    }

    .enrichment-compare__head {
        min-height: 82px;
        padding: var(--space-4);
        font-size: var(--text-base);
    }

    .enrichment-compare__head span {
        font-size: 0.7rem;
    }

    .enrichment-compare__cell {
        min-height: 98px;
        padding: var(--space-4);
    }

    .enrichment-engine__flow li {
        padding: var(--space-5);
    }

    .enrichment-scope__item dl div {
        grid-template-columns: 62px minmax(0, 1fr);
        gap: var(--space-2);
    }
}

/* 选项卡导航 */
.solutions-tabs {
    display: flex;
    justify-content: center;
    gap: var(--space-4);
    margin-bottom: var(--space-10);
}

.solutions-tab {
    position: relative;
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-6);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    color: var(--color-text-secondary);
    font-size: var(--text-base);
    font-weight: 500;
    cursor: pointer;
    transition: all var(--transition-base);
    overflow: visible;
    z-index: 1;
}

.solutions-tab:hover {
    border-color: var(--color-primary);
    color: var(--color-text-primary);
}

/* 进度条 SVG 容器 */
.solutions-tab__border-svg {
    position: absolute;
    inset: -1px;
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    pointer-events: none;
    z-index: 10;
    border-radius: 12px;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.solutions-tab--active .solutions-tab__border-svg {
    opacity: 1;
}

.solutions-tab__border-svg rect {
    fill: none;
    stroke: url(#tabProgressGradient);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-dasharray: 100;
    stroke-dashoffset: 100;
    transform-origin: center;
    transition: none;
    /* JS Animation */
}

/* 隐藏默认边框，使用SVG边框代替激活状态 */
.solutions-tab--active {
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.2), rgba(0, 212, 255, 0.1));
    border-color: transparent;
    /* Hide default border when active */
    color: var(--color-text-primary);
}

.solutions-tab svg {
    opacity: 0.6;
    transition: opacity var(--transition-base);
}

.solutions-tab--active svg,
.solutions-tab:hover svg {
    opacity: 1;
}

/* 选项卡内容 */
.solutions-content {
    position: relative;
    min-height: 500px;
}

.solution-panel {
    display: none;
    opacity: 0;
    animation: fadeIn 0.4s ease forwards;
}

.solution-panel--active {
    display: block;
    opacity: 1;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.solution-panel__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-12);
    align-items: center;
}

.solution-panel__tag {
    display: inline-block;
    padding: var(--space-2) var(--space-4);
    background: rgba(72, 88, 255, 0.15);
    color: var(--color-primary-light);
    font-size: var(--text-sm);
    font-weight: 500;
    border-radius: 20px;
    margin-bottom: var(--space-4);
}

.solution-panel__title {
    font-size: var(--text-3xl);
    font-weight: 700;
    color: var(--color-text-primary);
    line-height: 1.3;
    margin-bottom: var(--space-4);
}

.solution-panel__pain {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    padding: var(--space-4);
    background: rgba(239, 68, 68, 0.1);
    border-radius: 8px;
    color: #ef4444;
    font-size: var(--text-sm);
    margin-bottom: var(--space-6);
}

.solution-panel__pain svg {
    flex-shrink: 0;
    margin-top: 2px;
}

/* 解决方案功能列表 */
.solution-features {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.solution-features--compact {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-4);
}

.solution-feature {
    display: flex;
    gap: var(--space-4);
    padding: var(--space-4);
    background: var(--color-bg-card);
    border-radius: 12px;
    border: 1px solid var(--color-border);
    transition: all var(--transition-base);
}

.solution-feature:hover {
    border-color: var(--color-primary);
}

.solution-feature--small {
    padding: var(--space-3);
}

.solution-feature__icon {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.15), rgba(0, 212, 255, 0.1));
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary-light);
    flex-shrink: 0;
}

.solution-feature--small .solution-feature__icon {
    width: 40px;
    height: 40px;
}

.solution-feature__content h4 {
    font-size: var(--text-base);
    font-weight: 600;
    color: var(--color-text-primary);
    margin-bottom: var(--space-1);
}

.solution-feature--small .solution-feature__content h4 {
    font-size: var(--text-sm);
}

.solution-feature__content p {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: 1.5;
}

.solution-feature--small .solution-feature__content p {
    font-size: var(--text-xs);
}

.solution-feature__content strong {
    color: var(--color-primary-light);
}

/* 可视化区域 */
.solution-panel__visual {
    display: flex;
    justify-content: center;
    align-items: center;
}

.solution-visual {
    position: relative;
    width: 100%;
    padding: var(--space-8);
}

/* 综合性展会可视化 */
.solution-visual--trade {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-4);
}

.trade-scene-svg {
    width: 100%;
    max-width: 400px;
    height: auto;
    filter: drop-shadow(0 0 20px rgba(72, 88, 255, 0.2));
}

.trade-scene-svg:hover .badge {
    animation: badge-float 2s ease-in-out infinite;
}

@keyframes badge-float {

    0%,
    100% {
        transform: translate(170px, 160px);
    }

    50% {
        transform: translate(170px, 155px);
    }
}

.visual-card {
    background: var(--color-bg-card);
    border-radius: 16px;
    border: 1px solid var(--color-border);
    overflow: hidden;
    max-width: 280px;
}

.visual-card--gate {
    margin-left: auto;
}

.visual-card--notification {
    margin-right: auto;
}

.visual-card__header {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    background: rgba(255, 255, 255, 0.03);
    border-bottom: 1px solid var(--color-border);
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
}

.visual-card__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.visual-card__dot--green {
    background: #10b981;
    box-shadow: 0 0 8px #10b981;
    animation: pulse-dot 2s ease-in-out infinite;
}

.visual-card__dot--dim {
    background: rgba(255, 255, 255, 0.2);
}

/* Scan Line Animation for Gate Card */
.visual-card--gate {
    position: relative;
    overflow: hidden;
}

.visual-card--gate::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg,
            transparent,
            rgba(16, 185, 129, 0.1),
            rgba(16, 185, 129, 0.3),
            rgba(16, 185, 129, 0.1),
            transparent);
    animation: scan-line 3s ease-in-out infinite;
}

@keyframes scan-line {
    0% {
        left: -100%;
    }

    50% {
        left: 100%;
    }

    100% {
        left: 100%;
    }
}

@keyframes pulse-dot {

    0%,
    100% {
        opacity: 1;
        box-shadow: 0 0 8px #10b981;
    }

    50% {
        opacity: 0.6;
        box-shadow: 0 0 16px #10b981;
    }
}

/* AI Notification Card Pulse */
.visual-card--notification {
    position: relative;
    animation: card-glow 3s ease-in-out infinite;
}

@keyframes card-glow {

    0%,
    100% {
        box-shadow: 0 0 0 rgba(72, 88, 255, 0);
    }

    50% {
        box-shadow: 0 0 20px rgba(72, 88, 255, 0.3);
    }
}

/* Visual Connector Animation */
.visual-connector {
    display: flex;
    justify-content: center;
    position: relative;
}

.visual-connector svg path {
    animation: dash-flow 1.5s linear infinite;
}

@keyframes dash-flow {
    0% {
        stroke-dashoffset: 0;
    }

    100% {
        stroke-dashoffset: -16;
    }
}

.visual-card__body {
    padding: var(--space-4);
    text-align: center;
}

.visual-card__status {
    display: block;
    color: #10b981;
    font-weight: 600;
    margin-top: var(--space-2);
}

.visual-card__time {
    display: block;
    color: var(--color-text-muted);
    font-size: var(--text-xs);
}

.visual-card__message {
    font-size: var(--text-sm);
    color: var(--color-text-primary);
    margin-bottom: var(--space-3);
}

.visual-card__matches {
    display: flex;
    gap: var(--space-2);
    justify-content: center;
}

.visual-card__match {
    padding: var(--space-1) var(--space-3);
    background: rgba(72, 88, 255, 0.2);
    color: var(--color-primary-light);
    font-size: var(--text-xs);
    border-radius: 12px;
}

/* 采购对接会可视化 - 匹配报告 */
.match-report {
    background: var(--color-bg-card);
    border-radius: 16px;
    border: 1px solid var(--color-border);
    overflow: hidden;
    max-width: 360px;
    margin: 0 auto;
}

.match-report__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-4);
    background: rgba(72, 88, 255, 0.1);
    border-bottom: 1px solid var(--color-border);
    font-weight: 600;
    color: var(--color-text-primary);
}

.match-report__badge {
    padding: var(--space-1) var(--space-2);
    background: linear-gradient(135deg, var(--color-primary), var(--color-accent-purple));
    color: white;
    font-size: var(--text-xs);
    font-weight: 500;
    border-radius: 6px;
}

.match-report__body {
    padding: var(--space-6);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
}

.match-report__party {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-2);
    text-align: center;
}

.match-report__avatar {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.match-report__party--buyer .match-report__avatar {
    background: rgba(0, 212, 255, 0.15);
    color: var(--color-accent-cyan);
}

.match-report__party--supplier .match-report__avatar {
    background: rgba(168, 85, 247, 0.15);
    color: var(--color-accent-purple);
}

.match-report__party span {
    font-size: var(--text-sm);
    color: var(--color-text-primary);
    font-weight: 500;
}

.match-report__label {
    font-size: var(--text-xs) !important;
    color: var(--color-text-muted) !important;
    font-weight: 400 !important;
}

.match-report__connection {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-2);
}

.match-report__line {
    width: 40px;
    height: 2px;
    background: linear-gradient(90deg, var(--color-accent-cyan), var(--color-accent-purple));
    position: relative;
    overflow: hidden;
}

.match-report__line::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.8), transparent);
    animation: line-shimmer 2s ease-in-out infinite;
}

@keyframes line-shimmer {
    0% {
        left: -100%;
    }

    100% {
        left: 100%;
    }
}

/* Matchmaking Score Pulse */
.match-report__score {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: var(--space-2) var(--space-3);
    background: rgba(16, 185, 129, 0.15);
    border-radius: 8px;
    animation: score-pulse 2s ease-in-out infinite;
}

@keyframes score-pulse {

    0%,
    100% {
        transform: scale(1);
        background: rgba(16, 185, 129, 0.15);
    }

    50% {
        transform: scale(1.05);
        background: rgba(16, 185, 129, 0.25);
    }
}

/* Duplicate removed - see line 4877 */

.match-report__score span {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
}

.match-report__score strong {
    font-size: var(--text-lg);
    color: #10b981;
    font-weight: 700;
}

.match-report__footer {
    display: flex;
    gap: var(--space-2);
    padding: var(--space-4);
    border-top: 1px solid var(--color-border);
    justify-content: center;
}

.match-report__tag {
    padding: var(--space-1) var(--space-3);
    background: rgba(72, 88, 255, 0.1);
    color: var(--color-primary-light);
    font-size: var(--text-xs);
    border-radius: 12px;
}

/* 采购对接会 SVG 插画样式 */
.solution-visual--match {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-4);
}

.match-scene-svg {
    width: 100%;
    max-width: 400px;
    height: auto;
    filter: drop-shadow(0 0 20px rgba(168, 85, 247, 0.15));
    pointer-events: none;
}

/* 行业峰会可视化 */
.solution-visual--conference {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-4);
}

.conference-scene-svg {
    width: 100%;
    max-width: 400px;
    height: auto;
    filter: drop-shadow(0 0 20px rgba(245, 158, 11, 0.15));
}

.conference-scene-svg:hover .vip-card {
    animation: vip-glow 1s ease-in-out infinite;
}

@keyframes vip-glow {

    0%,
    100% {
        filter: url(#stageGlow);
    }

    50% {
        filter: url(#stageGlow) brightness(1.2);
    }
}

.phone-mockup {
    background: var(--color-bg-card);
    border-radius: 20px;
    border: 1px solid var(--color-border);
    overflow: hidden;
    width: 160px;
    transition: transform var(--transition-base), box-shadow var(--transition-base);
    transform-style: preserve-3d;
}

.phone-mockup:hover {
    transform: perspective(600px) rotateY(-5deg) rotateX(3deg) translateY(-4px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.admin-view {
    background: var(--color-bg-card);
    border-radius: 16px;
    border: 1px solid var(--color-border);
    overflow: hidden;
    flex: 1;
    transition: transform var(--transition-base), box-shadow var(--transition-base);
}

.admin-view:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.2);
}

/* Seat Hover Effects */
.banquet-table__seat {
    transition: transform var(--transition-fast), background var(--transition-fast), box-shadow var(--transition-fast);
}

.banquet-table__seat:hover {
    transform: scale(1.2);
    background: var(--color-primary);
    box-shadow: 0 0 12px var(--color-primary-glow);
}

/* Seat Result Map Animation */
.seat-result__map svg circle {
    transition: all var(--transition-fast);
}

.seat-result__map:hover svg circle[fill="#4858ff"] {
    r: 6;
    filter: drop-shadow(0 0 8px var(--color-primary));
}

.phone-mockup__header {
    padding: var(--space-3);
    background: rgba(72, 88, 255, 0.1);
    text-align: center;
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-text-primary);
}

.phone-mockup__body {
    padding: var(--space-4);
}

.seat-result {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-bottom: var(--space-4);
}

.seat-result__icon {
    color: var(--color-primary-light);
}

.seat-result__info {
    display: flex;
    flex-direction: column;
}

.seat-result__label {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
}

.seat-result__value {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-text-primary);
}

.seat-result__map {
    background: rgba(72, 88, 255, 0.05);
    border-radius: 8px;
    padding: var(--space-2);
}

.seat-result__map svg {
    width: 100%;
    height: auto;
}

.admin-view {
    background: var(--color-bg-card);
    border-radius: 16px;
    border: 1px solid var(--color-border);
    overflow: hidden;
    flex: 1;
    max-width: 280px;
}

.admin-view__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-4);
    background: rgba(168, 85, 247, 0.1);
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-text-primary);
}

.admin-view__badge {
    padding: var(--space-1) var(--space-2);
    background: rgba(168, 85, 247, 0.3);
    color: var(--color-accent-purple);
    font-size: var(--text-xs);
    border-radius: 4px;
}

.admin-view__body {
    padding: var(--space-4);
}

.banquet-layout {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    align-items: center;
}

.banquet-table {
    display: flex;
    gap: var(--space-2);
}

.banquet-table--offset {
    margin-left: var(--space-4);
}

.banquet-table__seat {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(72, 88, 255, 0.2);
    border: 2px solid var(--color-primary);
    position: relative;
}

.banquet-table__seat::after {
    content: attr(data-name);
    position: absolute;
    bottom: -18px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 8px;
    color: var(--color-text-muted);
    white-space: nowrap;
}

/* 响应式 */
@media (max-width: 768px) {
    .core-capability-grid,
    .scenario-overview__grid {
        grid-template-columns: 1fr;
    }

    .scenario-overview__card,
    .scenario-overview__card:nth-child(4),
    .scenario-overview__card:nth-child(5) {
        grid-column: auto;
    }

    .core-capability {
        min-height: 250px;
    }

    .scenario-overview__card {
        min-height: 220px;
    }

    .solutions-tabs {
        flex-direction: column;
        gap: var(--space-2);
    }

    .solutions-tab {
        justify-content: center;
    }

    .solution-panel__inner {
        grid-template-columns: 1fr;
        gap: var(--space-8);
    }

    .solution-panel__title {
        font-size: var(--text-2xl);
    }

    .solution-features--compact {
        grid-template-columns: 1fr;
    }

    .solution-visual--conference {
        flex-direction: column;
        align-items: center;
    }

    .admin-view {
        max-width: 100%;
    }
}

/* ==========================================
   综合性展会可视化场景优化
   ========================================== */

.trade-visual-scene {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    width: 100%;
    max-width: 380px;
    margin: 0 auto;
}

.visual-card--wide {
    width: 100%;
    max-width: none;
}

.visual-card__status-group {
    display: flex;
    gap: 4px;
}

.visual-card__dot--dim {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
}

.visual-card__body--row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    text-align: left;
}

.gate-info {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.gate-info__text {
    display: flex;
    flex-direction: column;
}

.gate-info__status {
    color: #10b981;
    font-weight: 600;
    font-size: var(--text-sm);
}

.gate-info__time {
    color: var(--color-text-muted);
    font-size: var(--text-xs);
}

.gate-stats {
    display: flex;
    gap: var(--space-4);
}

.gate-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.gate-stat__value {
    font-size: var(--text-lg);
    font-weight: 700;
    color: var(--color-text-primary);
    font-family: var(--font-display);
}

.gate-stat__label {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
}

.visual-connector {
    display: flex;
    justify-content: center;
    padding: var(--space-2) 0;
}

.visual-card__badge {
    padding: 2px 8px;
    background: rgba(72, 88, 255, 0.2);
    color: var(--color-primary-light);
    font-size: var(--text-xs);
    border-radius: 10px;
    margin-left: auto;
}

.visual-card__message strong {
    color: var(--color-primary-light);
}

.visual-card__match--primary {
    background: rgba(72, 88, 255, 0.25);
    color: var(--color-primary-light);
}

.visual-card__match--success {
    background: rgba(16, 185, 129, 0.25);
    color: #10b981;
}

.visual-card__action {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    margin-top: var(--space-3);
    padding: var(--space-2) var(--space-4);
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.2), rgba(0, 212, 255, 0.1));
    border-radius: 8px;
    color: var(--color-primary-light);
    font-size: var(--text-sm);
    font-weight: 500;
    cursor: pointer;
    transition: all var(--transition-base);
}

.visual-card__action:hover {
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.3), rgba(0, 212, 255, 0.2));
}

@media (max-width: 768px) {
    .trade-visual-scene {
        max-width: 100%;
    }

    .visual-card__body--row {
        flex-direction: column;
        align-items: flex-start;
    }

    .gate-stats {
        width: 100%;
        justify-content: space-around;
    }
}

/* ==========================================
   关于我们页面样式
   ========================================== */

/* Section 1: 公司愿景 */
.about-vision {
    padding: var(--space-20) 0;
}

.vision-content {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.vision-badge {
    width: 80px;
    height: 80px;
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.2), rgba(0, 212, 255, 0.1));
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--space-8);
    color: var(--color-primary-light);
}

.vision-title {
    font-size: var(--text-3xl);
    font-weight: 700;
    color: var(--color-text-primary);
    line-height: 1.4;
    margin-bottom: var(--space-6);
}

.vision-desc {
    font-size: var(--text-lg);
    color: var(--color-text-secondary);
    line-height: 1.8;
}

/* Section 2: 团队基因 */
.about-team {
    background: linear-gradient(180deg, var(--color-bg-tertiary), var(--color-bg-primary));
}

.team-grid {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-6);
    margin-bottom: var(--space-12);
}

.team-card {
    flex: 1;
    max-width: 320px;
    background: var(--color-bg-card);
    border-radius: 20px;
    border: 1px solid var(--color-border);
    padding: var(--space-8);
    text-align: center;
    position: relative;
    transition: all var(--transition-base);
}

.team-card:hover {
    border-color: var(--color-primary);
    transform: translateY(-4px);
}

.team-card--industry {
    border-top: 3px solid var(--color-accent-purple);
}

.team-card--tech {
    border-top: 3px solid var(--color-accent-cyan);
}

.team-card__icon {
    width: 64px;
    height: 64px;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.15), rgba(0, 212, 255, 0.1));
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--space-4);
    color: var(--color-primary-light);
}

.team-card__tag {
    display: inline-block;
    padding: var(--space-1) var(--space-3);
    background: rgba(72, 88, 255, 0.2);
    color: var(--color-primary-light);
    font-size: var(--text-sm);
    font-weight: 600;
    border-radius: 20px;
    margin-bottom: var(--space-3);
}

.team-card__title {
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--color-text-primary);
    margin-bottom: var(--space-2);
}

.team-card__desc {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.team-card__plus {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--color-bg-card);
    border: 2px solid var(--color-border);
    color: var(--color-primary);
    flex-shrink: 0;
}

.team-quote {
    max-width: 600px;
    margin: 0 auto;
    text-align: center;
}

.team-quote blockquote {
    position: relative;
    padding: var(--space-6);
}

.team-quote blockquote svg {
    position: absolute;
    top: 0;
    left: 0;
}

.team-quote blockquote p {
    font-size: var(--text-2xl);
    font-weight: 600;
    color: var(--color-text-primary);
    font-style: italic;
    line-height: 1.5;
}

/* Section 3: 资质荣誉 */
.about-qualifications {
    padding: var(--space-20) 0;
}

.qualifications-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-6);
}

.qualification-category {
    background: var(--color-bg-card);
    border-radius: 16px;
    border: 1px solid var(--color-border);
    padding: var(--space-6);
    transition: all var(--transition-base);
}

.qualification-category:hover {
    border-color: var(--color-primary);
}

.qualification-category__header {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-bottom: var(--space-4);
    padding-bottom: var(--space-4);
    border-bottom: 1px solid var(--color-border);
    color: var(--color-primary-light);
}

.qualification-category__header h3 {
    font-size: var(--text-base);
    font-weight: 600;
    color: var(--color-text-primary);
}

.qualification-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.qualification-item {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: 1.5;
}

.qualification-item__icon {
    font-size: var(--text-base);
    flex-shrink: 0;
}

/* Section 4: 联系我们 */
.about-contact {
    background: linear-gradient(180deg, var(--color-bg-tertiary), var(--color-bg-primary));
    padding: var(--space-20) 0;
}

.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-12);
    align-items: center;
}

.contact-info {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.contact-info__item {
    display: flex;
    gap: var(--space-4);
}

.contact-info__icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(72, 88, 255, 0.15), rgba(0, 212, 255, 0.1));
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary-light);
    flex-shrink: 0;
}

.contact-info__content h4 {
    font-size: var(--text-base);
    font-weight: 600;
    color: var(--color-text-primary);
    margin-bottom: var(--space-1);
}

.contact-info__content p {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.contact-cta {
    background: var(--color-bg-card);
    border-radius: 24px;
    border: 1px solid var(--color-border);
    padding: var(--space-10);
    text-align: center;
}

.contact-cta__title {
    font-size: var(--text-2xl);
    font-weight: 700;
    color: var(--color-text-primary);
    margin-bottom: var(--space-3);
}

.contact-cta__desc {
    font-size: var(--text-base);
    color: var(--color-text-secondary);
    margin-bottom: var(--space-6);
}

.contact-cta .btn {
    margin-bottom: var(--space-6);
}

.contact-cta__features {
    display: flex;
    justify-content: center;
    gap: var(--space-6);
    flex-wrap: wrap;
}

.contact-cta__features span {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
}

.contact-cta__features svg {
    color: #10b981;
}

/* 响应式 */
@media (max-width: 1024px) {
    .qualifications-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .vision-title {
        font-size: var(--text-2xl);
    }

    .team-grid {
        flex-direction: column;
    }

    .team-card {
        max-width: 100%;
    }

    .team-card__plus {
        transform: rotate(90deg);
    }

    .team-quote blockquote p {
        font-size: var(--text-xl);
    }

    .qualifications-grid {
        grid-template-columns: 1fr;
    }

    .contact-grid {
        grid-template-columns: 1fr;
        gap: var(--space-8);
    }

    .contact-cta {
        padding: var(--space-6);
    }
}

/* ==========================================
   关于我们：品牌叙事与业务布局
   ========================================== */
.about-culture,
.about-business,
.about-capability {
    position: relative;
    overflow: hidden;
}

.about-culture {
    background:
        radial-gradient(circle at 15% 20%, rgba(72, 88, 255, 0.12), transparent 32%),
        var(--color-bg-primary);
}

.about-culture__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-5);
    margin-top: var(--space-12);
}

.about-culture__card {
    min-height: 250px;
    padding: var(--space-8);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: rgba(255, 255, 255, 0.025);
}

.about-culture__card > span,
.about-business__grid article > span,
.about-capability__card > span {
    color: var(--color-primary-light);
    font-family: var(--font-display);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
}

.about-culture__card h3 {
    margin: var(--space-4) 0 0;
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-size: var(--text-xl);
    line-height: 1.45;
}

.about-culture__card p,
.about-business__grid article p,
.about-capability__card p {
    margin: var(--space-4) 0 0;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: 1.8;
}

.about-culture__story {
    max-width: 840px;
    margin: var(--space-10) auto 0;
    color: var(--color-text-secondary);
    font-size: var(--text-lg);
    line-height: 1.9;
    text-align: center;
}

.about-business {
    background: var(--color-bg-secondary);
}

.about-business__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-5);
    max-width: 1040px;
    margin: var(--space-12) auto 0;
}

.about-business__grid article {
    min-height: 224px;
    padding: var(--space-8);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: var(--color-bg-card);
    transition: transform var(--transition-base), border-color var(--transition-base);
}

.about-business__grid article:hover {
    border-color: rgba(91, 104, 255, 0.6);
    transform: translateY(-4px);
}

.about-business__grid h3 {
    margin: var(--space-3) 0 0;
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-size: var(--text-xl);
}

.about-business__grid a {
    display: inline-flex;
    gap: var(--space-2);
    margin-top: var(--space-5);
    color: var(--color-primary-light);
    font-size: var(--text-sm);
    font-weight: 600;
}

.about-business__grid a:hover,
.about-business__grid a:focus-visible {
    color: var(--color-text-primary);
    outline: none;
}

.about-business__grid i {
    font-style: normal;
    transition: transform var(--transition-fast);
}

.about-business__grid a:hover i {
    transform: translateX(4px);
}

.about-capability {
    background:
        radial-gradient(circle at 22% 50%, rgba(91, 104, 255, 0.12), transparent 26%),
        radial-gradient(circle at 78% 50%, rgba(0, 212, 255, 0.1), transparent 26%),
        var(--color-bg-secondary);
}

.about-capability__diagram {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 180px minmax(0, 1fr);
    align-items: center;
    gap: var(--space-6);
    max-width: 1080px;
    margin: var(--space-12) auto 0;
}

.about-capability__diagram::before {
    position: absolute;
    top: 50%;
    right: 15%;
    left: 15%;
    height: 1px;
    background: linear-gradient(90deg, rgba(91, 104, 255, 0.12), rgba(91, 104, 255, 0.8), rgba(0, 212, 255, 0.12));
    content: '';
}

.about-capability__card {
    position: relative;
    z-index: 1;
    min-height: 240px;
    padding: var(--space-8);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: rgba(16, 17, 33, 0.88);
}

.about-capability__card--industry {
    box-shadow: inset 0 1px 0 rgba(91, 104, 255, 0.18);
}

.about-capability__card--technology {
    box-shadow: inset 0 1px 0 rgba(0, 212, 255, 0.18);
}

.about-capability__eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 var(--space-3);
    border: 1px solid rgba(91, 104, 255, 0.32);
    border-radius: var(--radius-full);
    color: var(--color-primary-light);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
}

.about-capability__card--technology .about-capability__eyebrow {
    border-color: rgba(0, 212, 255, 0.32);
    color: var(--color-cyan);
}

.about-capability__card h3 {
    margin: var(--space-3) 0 0;
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-size: var(--text-xl);
}

.about-capability__tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin: var(--space-6) 0 0;
    padding: 0;
    list-style: none;
}

.about-capability__tags li {
    padding: var(--space-1) var(--space-3);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-full);
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
}

.about-capability__core {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 156px;
    height: 156px;
    margin: 0 auto;
    border: 1px solid rgba(91, 104, 255, 0.58);
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, rgba(90, 104, 255, 0.34), rgba(10, 11, 22, 0.98) 68%);
    box-shadow: 0 0 0 14px rgba(91, 104, 255, 0.045), 0 0 50px rgba(91, 104, 255, 0.2);
    text-align: center;
}

.about-capability__core::before,
.about-capability__core::after {
    position: absolute;
    top: 50%;
    width: 18px;
    height: 1px;
    background: var(--color-primary-light);
    content: '';
}

.about-capability__core::before { right: 100%; }
.about-capability__core::after { left: 100%; }

.about-capability__core span {
    color: var(--color-primary-light);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.16em;
}

.about-capability__core strong {
    margin-top: var(--space-2);
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-size: var(--text-2xl);
    line-height: 1.05;
}

.about-capability__quote {
    position: relative;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: var(--space-5);
    max-width: 1080px;
    margin: var(--space-10) auto 0;
    padding: var(--space-5) 0;
    color: var(--color-text-primary);
    text-align: center;
}

.about-capability__quote::before,
.about-capability__quote::after {
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(91, 104, 255, 0.6));
    content: '';
}

.about-capability__quote::after { background: linear-gradient(90deg, rgba(0, 212, 255, 0.6), transparent); }

.about-capability__quote strong {
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-size: var(--text-xl);
    font-weight: 600;
    line-height: 1.6;
}

@media (max-width: 1024px) {
    .about-culture__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .about-culture__grid,
    .about-business__grid {
        grid-template-columns: 1fr;
        margin-top: var(--space-8);
    }

    .about-culture__card,
    .about-business__grid article {
        min-height: 0;
        padding: var(--space-6);
    }

    .about-capability__diagram {
        grid-template-columns: 1fr;
        gap: var(--space-5);
        margin-top: var(--space-8);
    }

    .about-capability__diagram::before,
    .about-capability__core::before,
    .about-capability__core::after {
        display: none;
    }

    .about-capability__card {
        min-height: 0;
        padding: var(--space-6);
    }

    .about-capability__core {
        width: 128px;
        height: 128px;
        grid-row: 2;
    }

    .about-capability__card--technology {
        grid-row: 3;
    }

    .about-culture__story {
        margin-top: var(--space-8);
        font-size: var(--text-base);
        text-align: left;
    }

    .about-capability__quote {
        display: block;
        margin-top: var(--space-8);
        padding: var(--space-5) 0;
    }

    .about-capability__quote::before,
    .about-capability__quote::after {
        display: none;
    }

    .about-capability__quote strong {
        display: block;
        font-size: var(--text-lg);
    }

}

/* ==========================================
   公司愿景背景装饰
   ========================================== */

.about-vision {
    position: relative;
    overflow: hidden;
}

.vision-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

/* 光晕效果 */
.vision-bg__glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(100px);
    opacity: 0.3;
}

.vision-bg__glow--1 {
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, var(--color-primary) 0%, transparent 70%);
    top: -150px;
    left: 10%;
    animation: vision-glow-float 15s ease-in-out infinite;
}

.vision-bg__glow--2 {
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, var(--color-accent-cyan) 0%, transparent 70%);
    bottom: -100px;
    right: 15%;
    animation: vision-glow-float 12s ease-in-out infinite reverse;
}

@keyframes vision-glow-float {

    0%,
    100% {
        transform: translate(0, 0) scale(1);
        opacity: 0.25;
    }

    50% {
        transform: translate(30px, -20px) scale(1.1);
        opacity: 0.4;
    }
}

/* 网格背景 */
.vision-bg__grid {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(72, 88, 255, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(72, 88, 255, 0.04) 1px, transparent 1px);
    background-size: 80px 80px;
    -webkit-mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, black 20%, transparent 70%);
    mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, black 20%, transparent 70%);
}

/* 轨道装饰 */
.vision-bg__orbit {
    position: absolute;
    border: 1px dashed rgba(72, 88, 255, 0.15);
    border-radius: 50%;
}

.vision-bg__orbit--1 {
    width: 600px;
    height: 600px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: orbit-rotate 40s linear infinite;
}

.vision-bg__orbit--2 {
    width: 400px;
    height: 400px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: orbit-rotate 25s linear infinite reverse;
}

.vision-bg__dot {
    position: absolute;
    width: 8px;
    height: 8px;
    background: var(--color-primary);
    border-radius: 50%;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 0 12px var(--color-primary);
}

@keyframes orbit-rotate {
    from {
        transform: translate(-50%, -50%) rotate(0deg);
    }

    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

/* 浮动粒子 */
.vision-bg__particles {
    position: absolute;
    inset: 0;
}

.vision-bg__particles span {
    position: absolute;
    width: 4px;
    height: 4px;
    background: var(--color-primary);
    border-radius: 50%;
    opacity: 0;
    animation: vision-particle-float 10s ease-in-out infinite;
}

.vision-bg__particles span:nth-child(1) {
    left: 15%;
    top: 30%;
    animation-delay: 0s;
}

.vision-bg__particles span:nth-child(2) {
    left: 80%;
    top: 25%;
    animation-delay: 2s;
}

.vision-bg__particles span:nth-child(3) {
    left: 25%;
    top: 70%;
    animation-delay: 4s;
}

.vision-bg__particles span:nth-child(4) {
    left: 70%;
    top: 65%;
    animation-delay: 6s;
}

.vision-bg__particles span:nth-child(5) {
    left: 50%;
    top: 20%;
    animation-delay: 8s;
}

@keyframes vision-particle-float {

    0%,
    100% {
        opacity: 0;
        transform: translateY(0) scale(0);
    }

    20% {
        opacity: 0.6;
        transform: translateY(-20px) scale(1);
    }

    80% {
        opacity: 0.6;
        transform: translateY(-60px) scale(1);
    }
}

/* 确保内容在装饰层之上 */
.vision-content {
    position: relative;
    z-index: 1;
}

/* ==========================================
   定价页面样式
   ========================================== */

.pricing-section {
    padding: var(--space-12) 0 var(--space-20);
}

.pricing-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-6);
    align-items: stretch;
}

.pricing-card {
    background: var(--color-bg-card);
    border-radius: 20px;
    border: 1px solid var(--color-border);
    padding: var(--space-8);
    display: flex;
    flex-direction: column;
    position: relative;
    transition: all var(--transition-base);
}

.pricing-card:hover {
    border-color: var(--color-primary);
    transform: translateY(-4px);
}

.pricing-card__header {
    margin-bottom: var(--space-6);
}

.pricing-card__badge {
    display: inline-block;
    padding: var(--space-1) var(--space-3);
    background: rgba(16, 185, 129, 0.15);
    color: #10b981;
    font-size: var(--text-xs);
    font-weight: 600;
    border-radius: 20px;
    margin-bottom: var(--space-3);
}

.pricing-card__name {
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--color-text-primary);
    margin-bottom: var(--space-2);
}

.pricing-card__desc {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: 1.5;
}

.pricing-card__price {
    display: flex;
    align-items: baseline;
    margin-bottom: var(--space-6);
    padding-bottom: var(--space-6);
    border-bottom: 1px solid var(--color-border);
}

.pricing-card__currency {
    font-size: var(--text-lg);
    font-weight: 600;
    color: var(--color-text-primary);
    margin-right: 2px;
}

.pricing-card__amount {
    font-size: var(--text-4xl);
    font-weight: 700;
    color: var(--color-text-primary);
    font-family: var(--font-display);
    line-height: 1;
}

.pricing-card__amount--custom {
    font-size: var(--text-3xl);
}

.pricing-card__period {
    font-size: var(--text-base);
    color: var(--color-text-muted);
    margin-left: var(--space-1);
}

.pricing-card__features {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    margin-bottom: var(--space-6);
    list-style: none;
}

.pricing-card__feature {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
}

.pricing-card__feature svg {
    flex-shrink: 0;
    color: #10b981;
}

.pricing-card__feature--disabled {
    opacity: 0.5;
}

.pricing-card__feature--disabled svg {
    color: var(--color-text-muted);
}

/* 专业版高亮 */
.pricing-card--featured {
    border-color: var(--color-primary);
    background: linear-gradient(180deg, rgba(72, 88, 255, 0.08) 0%, var(--color-bg-card) 100%);
    transform: scale(1.02);
}

.pricing-card--featured:hover {
    transform: scale(1.02) translateY(-4px);
}

.pricing-card__popular {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    padding: var(--space-1) var(--space-4);
    background: linear-gradient(135deg, var(--color-primary), var(--color-accent-cyan));
    color: white;
    font-size: var(--text-xs);
    font-weight: 600;
    border-radius: 20px;
    white-space: nowrap;
}

.pricing-card__popular--starter {
    background: linear-gradient(135deg, #10b981, #34d399);
}

/* 商业版样式 */
.pricing-card--enterprise {
    border-style: dashed;
}

/* 按钮占满宽度 */
.btn--block {
    width: 100%;
    justify-content: center;
}

/* FAQ Section */
.pricing-faq {
    background: var(--color-bg-tertiary);
}

.faq-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-6);
}

.faq-item {
    background: var(--color-bg-card);
    border-radius: 16px;
    border: 1px solid var(--color-border);
    padding: var(--space-6);
    transition: all var(--transition-base);
}

.faq-item:hover {
    border-color: var(--color-primary);
}

.faq-item__question {
    font-size: var(--text-base);
    font-weight: 600;
    color: var(--color-text-primary);
    margin-bottom: var(--space-3);
}

.faq-item__answer {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: 1.6;
}

/* 响应式 */
@media (max-width: 1200px) {
    .pricing-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .pricing-card--featured {
        transform: none;
    }

    .pricing-card--featured:hover {
        transform: translateY(-4px);
    }
}

@media (max-width: 768px) {
    .pricing-grid {
        grid-template-columns: 1fr;
        max-width: 400px;
        margin: 0 auto;
    }

    .faq-grid {
        grid-template-columns: 1fr;
    }

    .pricing-card__amount {
        font-size: var(--text-3xl);
    }
}

/* ==========================================
   Scroll Indicator
   ========================================== */

.scroll-indicator {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-10);
    color: var(--color-text-muted);
    text-decoration: none;
    transition: all var(--transition-base);
    cursor: pointer;
}

.scroll-indicator:hover {
    color: var(--color-primary);
}

.scroll-indicator__arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border: 1px solid var(--color-border);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.03);
    animation: scroll-bounce 2s ease-in-out infinite;
    transition: all var(--transition-base);
}

.scroll-indicator:hover .scroll-indicator__arrow {
    border-color: var(--color-primary);
    background: rgba(72, 88, 255, 0.1);
    animation-play-state: paused;
    transform: scale(1.1);
}

.scroll-indicator__arrow svg {
    stroke: currentColor;
}

@keyframes scroll-bounce {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(8px);
    }
}

/* ==========================================
   Footer Link QR Code Hover
   ========================================== */

.footer__link-item {
    position: relative;
    display: inline-block;
    width: fit-content;
}

.footer__link-item .footer__qrcode-popup {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    z-index: 100;
    pointer-events: none;
    padding-bottom: 15px;
    /* Increase hover area to prevent flickering */
}

.footer__link-item .footer__qrcode-popup::after {
    content: '';
    position: absolute;
    bottom: 9px;
    /* Adjust based on padding-bottom */
    left: 50%;
    transform: translateX(-50%);
    border-width: 6px 6px 0;
    border-style: solid;
    border-color: var(--color-bg-card) transparent transparent transparent;
    z-index: 101;
}

.footer__link-item:hover .footer__qrcode-popup {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
    pointer-events: auto;
}

/* ==========================================
   隐私政策弹窗
   ========================================== */

/* iOS 滚动穿透修复：锁定 body */
body.modal-open {
    position: fixed;
    width: 100%;
    overflow: hidden;
}

.privacy-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.privacy-modal--active {
    opacity: 1;
    visibility: visible;
}

.privacy-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.8);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}

.privacy-modal__container {
    position: relative;
    width: 90%;
    max-width: 900px;
    max-height: 85vh;
    background: var(--color-bg-card);
    border-radius: 16px;
    border: 1px solid var(--color-border);
    display: flex;
    flex-direction: column;
    transform: scale(0.9) translateY(20px);
    transition: transform 0.3s ease;
}

.privacy-modal--active .privacy-modal__container {
    transform: scale(1) translateY(0);
}

.privacy-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-4) var(--space-6);
    border-bottom: 1px solid var(--color-border);
}

.privacy-modal__title {
    font-size: var(--text-lg);
    font-weight: 600;
    color: var(--color-text-primary);
}

.privacy-modal__close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: transparent;
    border: none;
    border-radius: 8px;
    color: var(--color-text-muted);
    cursor: pointer;
    transition: all var(--transition-base);
}

.privacy-modal__close:hover {
    background: rgba(255, 255, 255, 0.1);
    color: var(--color-text-primary);
}

.privacy-modal__body {
    flex: 1;
    overflow: hidden;
    position: relative;
}

/* iOS iframe 滚动修复 */
.privacy-modal__scroll-wrapper {
    width: 100%;
    height: 70vh;
    overflow-y: auto;
    border-radius: 0 0 16px 16px;
    background: #fff;
}

.privacy-modal__iframe {
    width: 100%;
    height: 100%;
    border: none;
    background: #fff;
}

/* 移动端特殊处理：iOS 需要固定高度才能滚动 */
@media (max-width: 768px) {
    .privacy-modal__container {
        width: 95%;
        max-height: 90vh;
        overscroll-behavior: contain;
    }

    .privacy-modal__scroll-wrapper {
        height: 75vh;
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }

    .privacy-modal__iframe {
        height: 6500px;
    }
}

/* ==========================================
   Utility Classes
   ========================================== */

.u-hidden {
    display: none;
}

.u-relative-z1 {
    position: relative;
    z-index: 1;
}

.u-overflow-hidden {
    overflow: hidden;
}

/* Animation Utilities */
.u-delay-100 {
    animation-delay: 0.1s;
    transition-delay: 0.1s;
}

.u-delay-200 {
    animation-delay: 0.2s;
    transition-delay: 0.2s;
}

.u-delay-300 {
    animation-delay: 0.3s;
    transition-delay: 0.3s;
}

.hero__content--animate-init {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s ease 0.3s;
}

/* Data Growth Bar Modifiers */
.data-growth__bar--30 {
    --height: 30%;
}

.data-growth__bar--50 {
    --height: 50%;
}

.data-growth__bar--70 {
    --height: 70%;
}

.data-growth__bar--90 {
    --height: 90%;
}

.data-growth__bar--100 {
    --height: 100%;
}

/* Form Utilities */
.demo-form__submit-loading,
.demo-form__message {
    display: none;
}


/* ==========================================
   Demo Booking Modal
   ========================================== */

.demo-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.8);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    padding: var(--space-4);
}

.demo-modal--active {
    opacity: 1;
    visibility: visible;
}

.demo-modal__content {
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: 20px;
    width: 100%;
    max-width: 900px;
    max-height: 90vh;
    overflow: hidden;
    transform: scale(0.9) translateY(20px);
    transition: transform 0.3s ease;
}

.demo-modal--active .demo-modal__content {
    transform: scale(1) translateY(0);
}

.demo-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-5) var(--space-6);
    border-bottom: 1px solid var(--color-border);
    background: var(--color-bg-secondary);
}

.demo-modal__title {
    font-size: var(--text-xl);
    font-weight: 600;
    color: var(--color-text-primary);
    margin: 0;
}

.demo-modal__close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: transparent;
    border: none;
    border-radius: 10px;
    color: var(--color-text-muted);
    cursor: pointer;
    transition: all var(--transition-base);
}

.demo-modal__close:hover {
    background: rgba(255, 255, 255, 0.1);
    color: var(--color-text-primary);
}

.demo-modal__body {
    display: grid;
    grid-template-columns: 1fr 320px;
    max-height: calc(90vh - 80px);
    overflow-y: auto;
}

.demo-modal__form-section {
    padding: var(--space-6);
    border-right: 1px solid var(--color-border);
}

.demo-modal__contact-section {
    padding: var(--space-6);
    background: var(--color-bg-secondary);
}

.demo-modal__section-title {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-base);
    font-weight: 600;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-5);
}

.demo-modal__section-title svg {
    color: var(--color-primary);
}

/* Form Styles */
.demo-form {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.demo-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
}

.demo-form__group {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.demo-form__label {
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--color-text-secondary);
}

.demo-form__required {
    color: var(--color-error);
}

.demo-form__input,
.demo-form__textarea {
    width: 100%;
    padding: var(--space-3) var(--space-4);
    background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border);
    border-radius: 10px;
    font-size: var(--text-base);
    color: var(--color-text-primary);
    transition: all var(--transition-base);
}

.demo-form__input::placeholder,
.demo-form__textarea::placeholder {
    color: var(--color-text-muted);
}

.demo-form__input:focus,
.demo-form__textarea:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(72, 88, 255, 0.15);
}

.demo-form__textarea {
    resize: vertical;
    min-height: 100px;
}

.demo-form__submit {
    margin-top: var(--space-2);
}

.demo-form__submit-loading {
    display: none;
    align-items: center;
    gap: var(--space-2);
}

.demo-form__spinner {
    animation: spin 1s linear infinite;
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.demo-form__message {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    border-radius: 10px;
    font-size: var(--text-sm);
    margin-top: var(--space-4);
}

.demo-form__message--success {
    background: rgba(34, 197, 94, 0.1);
    border: 1px solid rgba(34, 197, 94, 0.3);
    color: var(--color-success);
}

.demo-form__message--error {
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    color: var(--color-error);
}

/* Contact Section */
.demo-contact {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.demo-contact__item {
    display: flex;
    align-items: center;
    gap: var(--space-4);
}

.demo-contact__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: rgba(72, 88, 255, 0.1);
    border-radius: 12px;
    color: var(--color-primary);
}

.demo-contact__info {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.demo-contact__label {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
}

.demo-contact__value {
    font-size: var(--text-lg);
    font-weight: 600;
    color: var(--color-text-primary);
    text-decoration: none;
    transition: color var(--transition-base);
}

.demo-contact__value:hover {
    color: var(--color-primary);
}

.demo-contact__qr {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-4);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: 12px;
}

.demo-contact__qr-label {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
}

.demo-contact__qr-img {
    width: 150px;
    height: 150px;
    border-radius: 8px;
    background: #fff;
    padding: 8px;
}

/* Responsive */
@media (max-width: 768px) {
    .demo-modal__body {
        grid-template-columns: 1fr;
    }

    .demo-modal__form-section {
        border-right: none;
        border-bottom: 1px solid var(--color-border);
    }

    .demo-form__row {
        grid-template-columns: 1fr;
    }

    .demo-contact__qr-img {
        width: 120px;
        height: 120px;
    }
}

/* Solution Visual Image Support */
.solution-visual__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-2xl);
    border: 1px solid var(--color-border-highlight);
}

.solution-visual {
    padding: 0;
    overflow: hidden;
    background: transparent;
    border: none;
}

/* Typography fix for mobile */
@media (max-width: 414px) {
    .hero__title {
        font-size: clamp(1.8rem, 8vw, 2.5rem);
    }

    .ai-hero__title {
        text-wrap: balance;
    }
}