body { 
            font-family: 'Inter', sans-serif; 
            -webkit-font-smoothing: antialiased; 
            -moz-osx-font-smoothing: grayscale;
            background-color: #FCFCFC; 
            color: #0A0A0A;
        }
        
        .bg-grid-ultra { 
            background-image: 
                linear-gradient(to right, rgba(0,0,0,0.012) 1px, transparent 1px), 
                linear-gradient(to bottom, rgba(0,0,0,0.012) 1px, transparent 1px); 
            background-size: 48px 48px; 
            background-position: center top;
        }

        .bg-mesh-glow {
            background-image: 
                radial-gradient(circle at 15% 50%, rgba(255, 79, 42, 0.025), transparent 25%),
                radial-gradient(circle at 85% 30%, rgba(14, 165, 233, 0.025), transparent 25%),
                radial-gradient(circle at 50% 80%, rgba(0, 0, 0, 0.015), transparent 30%);
            z-index: 0;
            pointer-events: none;
        }

        .bento-card { 
            background: rgba(255, 255, 255, 0.6);
            backdrop-filter: blur(24px);
            -webkit-backdrop-filter: blur(24px);
            border: 1px solid rgba(0, 0, 0, 0.04);
            transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1); 
        }
        .bento-card:hover { 
            background: rgba(255, 255, 255, 0.85);
            transform: translateY(-2px); 
            border-color: rgba(0, 0, 0, 0.08);
        }

        .btn-black { 
            background-color: rgba(255, 255, 255, 0.6);
            backdrop-filter: blur(24px);
            -webkit-backdrop-filter: blur(24px);
            border: 1px solid rgba(0, 0, 0, 0.08);
            color: #0A0A0A;
            transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1); 
        }
        .btn-black:hover { 
            background-color: rgba(255, 255, 255, 0.95);
            border-color: rgba(0, 0, 0, 0.15);
            transform: scale(1.02); 
        }

        .page-view { display: none; opacity: 0; transition: opacity 0.4s ease-in-out; }
        .page-view.active { display: block; opacity: 1; }
        .nav-link.active { color: #0A0A0A; font-weight: 500; }
        .nav-link::after { content: ''; position: absolute; bottom: -4px; left: 50%; transform: translateX(-50%); width: 0; height: 2px; background-color: #0A0A0A; transition: width 0.3s ease; }
        .nav-link.active::after { width: 100%; }
        #mobile-nav-menu .nav-link::after { content: none !important; display: none !important; }
        
        .reveal { opacity: 0; transform: translateY(16px); transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1); }
        .reveal.active { opacity: 1; transform: translateY(0); }
        
        .shape-moon-morph-matte {
            background: radial-gradient(circle at 25% 25%, #ffffff 0%, #fdfdfd 15%, #ebebeb 45%, #d6d6d6 75%, #a8a8a8 100%);
            box-shadow: 
                0 30px 60px -15px rgba(0, 0, 0, 0.08),
                inset 10px 10px 24px rgba(255, 255, 255, 1),
                inset -15px -15px 35px rgba(0, 0, 0, 0.04),
                inset -35px -35px 60px rgba(0, 0, 0, 0.12);
            animation: morph-moon 14s ease-in-out infinite, orbit-1 30s linear infinite;
        }
        
        .shape-moon-morph-glass {
            background: radial-gradient(circle at 25% 25%, rgba(255, 255, 255, 0.85) 0%, rgba(255, 255, 255, 0.1) 60%, transparent 100%);
            backdrop-filter: blur(32px) saturate(120%);
            -webkit-backdrop-filter: blur(32px) saturate(120%);
            border: 1px solid rgba(255, 255, 255, 0.9);
            box-shadow: 
                0 30px 60px -10px rgba(0, 0, 0, 0.06),
                inset 6px 6px 20px rgba(255, 255, 255, 1),
                inset -2px -2px 10px rgba(255, 255, 255, 0.4),
                inset -15px -15px 30px rgba(0, 0, 0, 0.05),
                inset 0 0 20px rgba(255, 255, 255, 0.3);
            animation: morph-moon 15s ease-in-out infinite reverse, orbit-2 35s linear infinite;
        }

        .shape-accent-sphere {
            border-radius: 50%;
            background: radial-gradient(circle at 25% 25%, #FFD4CC 0%, #FF5A36 35%, #D42F0D 70%, #6A1404 100%);
            box-shadow: 
                0 20px 40px -10px rgba(255, 79, 42, 0.4),
                inset 6px 6px 15px rgba(255, 255, 255, 0.6),
                inset -10px -10px 25px rgba(0, 0, 0, 0.4);
        }
        
        .logo-gradient-sphere {
            background: radial-gradient(circle at 25% 25%, #FFD4CC 0%, #FF5A36 40%, #D42F0D 80%, #8A200B 100%);
            box-shadow: 
                0 4px 12px -2px rgba(255, 79, 42, 0.4),
                inset 3px 3px 8px rgba(255, 255, 255, 0.5),
                inset -4px -4px 10px rgba(0, 0, 0, 0.3);
        }
        
        @keyframes orbit-1 {
            from { transform: rotate(0deg) translateX(40px) rotate(0deg); }
            to   { transform: rotate(360deg) translateX(40px) rotate(-360deg); }
        }
        @keyframes orbit-2 {
            from { transform: rotate(360deg) translateX(60px) rotate(-360deg); }
            to   { transform: rotate(0deg) translateX(60px) rotate(0deg); }
        }
        @keyframes orbit-3 {
            from { transform: rotate(0deg) translateX(30px) rotate(0deg); }
            to   { transform: rotate(360deg) translateX(30px) rotate(-360deg); }
        }

        @keyframes morph-moon {
            0% { border-radius: 50%; }
            25% { border-radius: 30% 70% 60% 40% / 50% 40% 60% 50%; }
            50% { border-radius: 40% 60% 35% 65% / 65% 35% 55% 45%; }
            75% { border-radius: 65% 35% 60% 40% / 40% 60% 30% 70%; }
            100% { border-radius: 50%; }
        }

        .animate-orbit-3 { animation: orbit-3 15s linear infinite; }

        .interactive-card {
            position: relative;
            overflow: hidden;
            transform: translateZ(0);
        }
        .interactive-card::before {
            content: "";
            position: absolute;
            top: 0; left: 0; right: 0; bottom: 0;
            background: radial-gradient(
                600px circle at var(--mouse-x, 0) var(--mouse-y, 0),
                rgba(14, 165, 233, 0.08),
                transparent 40%
            );
            opacity: 0;
            transition: opacity 0.5s ease;
            pointer-events: none;
            z-index: 0;
        }
        .interactive-card:hover::before {
            opacity: 1;
        }
        /* 不 要 覆 盖 <video> 的 absolute 铺 满 ， 否 则 会 出 现 播 放 区 上 下 黑 边 、 比 例 失 常 */
        .interactive-card > *:not(video) {
            position: relative;
            z-index: 1;
        }

        /* Home M Series — podcast card: full-bleed audio watermark (must stay absolute; generic rule above would force relative) */
        #home-m-series .interactive-card.home-m-series-podcast-card > .home-m-series-podcast-watermark {
            position: absolute;
            inset: 0;
            z-index: 0;
            pointer-events: none;
            overflow: hidden;
        }

        /* 覆 盖 层 、 标 签 需 铺 满 卡 片 ， 不 能 被 上 述 relative 规 则 压 掉 absolute */
        .interactive-card.signature-video-card > .signature-video-play-ui {
            position: absolute;
            inset: 0;
            z-index: 5;
        }

        /* 主 卡 与 右 侧 缩 略 卡 共 用 ： 内 层 画 框 + 播 放 态 与 主 舞 台 相 同 的 contain / 进 度 条 对 齐 逻 辑 （ 仅 主 卡 会 is-playing） */
        .interactive-card.signature-video-card > .signature-video-frame {
            position: absolute;
            inset: 0;
            z-index: 0;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .signature-video-frame .signature-video-el {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        /* 播 放 中 ： video 盒 与 画 面 同 宽 ， 原 生 进 度 条 不 再 超 出 画 面 区 域 （ 右 栏 点 击 后 仍 在 主 卡 播 放 ， 沿 用 此 规 则 ） */
        .signature-video-prime.is-playing .signature-video-frame .signature-video-el {
            position: relative;
            inset: auto;
            width: auto;
            height: auto;
            max-width: 100%;
            max-height: 100%;
            flex-shrink: 1;
            object-fit: contain;
            transition: none;
        }

        .interactive-card.signature-video-prime > .signature-main-kicker-layer {
            position: absolute;
            top: 1.5rem;
            left: 2rem;
            z-index: 35;
            pointer-events: none;
        }

        .signature-play-btn-circle {
            width: 5rem;
            height: 5rem;
            min-width: 5rem;
            min-height: 5rem;
            border-radius: 50%;
            box-sizing: border-box;
        }

        /* Media / JS-SEZ 视 频 卡 ： 播 放 时 淡 出 覆 盖 层 */
        .signature-video-card.is-playing .signature-video-play-ui {
            opacity: 0;
        }

        /* 主 舞 台 启 用 原 生 controls 时 避 免 底 部 进 度 条 被 overflow 裁 切 */
        .signature-video-prime.is-playing {
            overflow: visible;
        }

        /* Signature 剧 场 态 ： 仅 本 块 黑 底 、 标 题 反 色 、 保 留 播 放 中 卡 片 ， 其 他 卡 片 退 场 */
        .signature-theater-root {
            background-color: transparent;
        }

        .signature-theater-root--active {
            background-color: #0a0a0a;
        }

        /* 播 放 中 ： 保 留 标 题 区 间 距 ； 底 部 黑 区 尽 量 贴 底 （ 见 sig-media-grid min-height） */
        .signature-theater-root.signature-theater-root--active {
            padding-top: 0.75rem;
            padding-bottom: 0;
        }

        @media (min-width: 640px) {
            .signature-theater-root.signature-theater-root--active {
                padding-top: 1rem;
                padding-bottom: 0;
            }
        }

        .signature-theater-root--active .signature-theater-title {
            color: #fafafa;
        }

        .signature-theater-root--active .signature-theater-lede {
            color: rgba(250, 250, 250, 0.68);
        }

        .signature-theater-root--active #signature-main-kicker {
            background-color: rgba(255, 255, 255, 0.92);
            border-color: rgba(0, 0, 0, 0.08);
            color: #171717;
        }

        .signature-theater-root--active .signature-theater-badge {
            border-color: rgba(255, 255, 255, 0.22);
            background-color: rgba(255, 255, 255, 0.08);
            color: rgba(255, 255, 255, 0.92);
            box-shadow: none;
        }

        .signature-theater-root--active .signature-theater-badge svg {
            stroke: rgba(255, 255, 255, 0.9);
            color: rgba(255, 255, 255, 0.9);
        }

        .signature-video-rail {
            min-height: 300px;
            transition:
                opacity 0.42s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.48s cubic-bezier(0.22, 1, 0.36, 1),
                filter 0.45s ease,
                max-width 0.45s cubic-bezier(0.22, 1, 0.36, 1),
                padding 0.35s ease,
                border-color 0.35s ease,
                border-width 0.35s ease;
        }

        .signature-thumb-card {
            aspect-ratio: 16 / 9;
            width: 100%;
            min-height: 0;
        }

        @media (max-width: 1023px) {
            .signature-thumb-card {
                max-height: 220px;
            }
        }

        .signature-theater-root--active .signature-video-rail {
            background: rgba(255, 255, 255, 0.04);
            border-color: rgba(255, 255, 255, 0.12);
            box-shadow: none;
            min-height: 0 !important;
            max-height: 0 !important;
            height: 0 !important;
            padding: 0 !important;
            margin: 0 !important;
            overflow: hidden !important;
            pointer-events: none;
        }

        .signature-theater-root--active .signature-video-rail h3,
        .signature-theater-root--active .signature-video-rail span {
            color: rgba(255, 255, 255, 0.55);
        }

        .signature-theater-root--active .signature-video-card:not(.is-playing) {
            opacity: 0;
            transform: translate3d(0.5rem, 0.5rem, 0) scale(0.95);
            filter: blur(8px);
            pointer-events: none;
        }

        .signature-theater-root--active .signature-video-prime.is-playing .signature-video-frame {
            background-color: #000;
        }

        .signature-theater-root--active .signature-video-prime.is-playing .signature-video-frame .signature-video-el {
            outline: none;
            border: none;
            box-shadow: none;
            background-color: transparent;
        }

        /* 剧 场 态 ： 网 格 不 再 被 侧 栏 min-height 撑 高 ； 顶 对 齐 避 免 主 卡 被 拉 伸 出 多 余 黑 底 */
        .signature-theater-root--active .sig-media-grid {
            min-height: 0;
            align-content: end;
            align-items: start;
            gap: 0;
        }

        @media (max-width: 1023px) {
            .signature-theater-root--active .signature-video-prime {
                grid-column: 1 / -1;
                justify-self: center;
                width: 100%;
                max-width: min(100%, 1180px);
                height: auto !important;
                aspect-ratio: 16 / 9;
                max-height: min(46vh, 380px);
                min-height: 0;
            }
        }

        @media (min-width: 1024px) {
            .signature-theater-root--active .sig-media-grid {
                grid-template-columns: 1fr 0fr;
                min-height: 0;
            }

            .signature-theater-root--active .signature-video-prime {
                grid-column: 1 / -1;
                justify-self: center;
                width: 100%;
                max-width: min(100%, 1180px);
                height: auto !important;
                aspect-ratio: 16 / 9;
                max-height: min(58vh, 600px);
                min-height: 0;
            }

            .signature-theater-root--active .signature-video-rail {
                max-width: 0;
                padding-left: 0;
                padding-right: 0;
                border-width: 0;
                overflow: hidden;
            }
        }

        .signature-video-card {
            transition:
                opacity 0.42s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.48s cubic-bezier(0.22, 1, 0.36, 1),
                filter 0.45s ease,
                box-shadow 0.45s ease,
                border-color 0.35s ease;
        }

        .signature-theater-root--active .signature-video-card.is-playing {
            border-color: rgba(255, 255, 255, 0.12);
            box-shadow: 0 28px 64px -24px rgba(0, 0, 0, 0.55);
            z-index: 6;
        }

        /* 播 放 时 隐 藏 Highlight 标 签 */
        .signature-video-prime.is-playing .signature-main-kicker-layer {
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.35s ease, visibility 0.35s ease;
        }

        /* 主 舞 台 播 放 中 ： 去 玻 璃 白 边 （ 保 留 overflow:visible 以 免 裁 切 原 生 控 件 ） */
        .signature-theater-root--active .signature-video-prime.is-playing {
            background-color: #000 !important;
            border-color: transparent;
            border-width: 0;
            box-shadow: none;
            backdrop-filter: none;
            -webkit-backdrop-filter: none;
        }

        .signature-theater-root--active .signature-video-prime.is-playing::before {
            opacity: 0 !important;
        }

        .signature-theater-root--active .signature-video-card.is-playing .signature-video-play-ui {
            opacity: 0;
        }

        @media (prefers-reduced-motion: reduce) {
            .signature-video-card .signature-video-play-ui {
                transition-duration: 0.01ms !important;
            }

            .signature-video-card {
                transition-duration: 0.01ms !important;
                transition-delay: 0s !important;
            }

            .signature-theater-root--active .signature-video-card:not(.is-playing) {
                filter: none;
                transform: none;
            }

            .signature-video-prime.is-playing .signature-main-kicker-layer {
                transition: none;
            }
        }

        /* 隐 藏 滚 动 条 但 保 留 滚 动 功 能  */
        .hide-scrollbar {
            -ms-overflow-style: none; /* IE and Edge */
            scrollbar-width: none; /* Firefox */
        }
        .hide-scrollbar::-webkit-scrollbar {
            display: none; /* Chrome, Safari and Opera */
        }

        /* Tabs Style */
        .product-tab {
            opacity: 0.3;
            transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
            border-left: 2px solid transparent;
            padding-left: 1.5rem;
            cursor: pointer;
            position: relative;
        }
        .product-tab:hover { opacity: 0.6; }
        .product-tab.active {
            opacity: 1;
            border-left-color: transparent;
        }

        .product-tab::before {
            content: "";
            position: absolute;
            left: -2px;
            top: 8px;
            bottom: 8px;
            width: 2px;
            border-radius: 999px;
            opacity: 0;
            background: linear-gradient(
                180deg,
                rgba(59, 130, 246, 0.15) 0%,
                rgba(59, 130, 246, 0.78) 45%,
                rgba(125, 211, 252, 0.95) 55%,
                rgba(59, 130, 246, 0.2) 100%
            );
            box-shadow: 0 0 10px rgba(59, 130, 246, 0.35), 0 0 18px rgba(59, 130, 246, 0.18);
            transition: opacity 260ms ease;
        }

        .product-tab.active::before {
            opacity: 1;
            animation: product-tab-blue-flow 2.6s ease-in-out infinite;
        }

        /* 终 极 解 决 方 案 ： 完 美 的  3D Cover Flow 环 绕 阵 列  
           修 复 了 旧 版 越 界 裁 切 与 图 片 塌 陷 的  Bug
        */
        .perspective-container {
            perspective: 1200px;
            transform-style: preserve-3d;
            position: relative;
        }

        .carousel-item {
            position: absolute;
            top: 50%; left: 50%;
            /* 设 定 核 心 尺 寸 与 绝 对 居 中  */
            margin-top: -300px; margin-left: -140px;
            width: 280px; height: 600px;
            
            /* 丝 滑 的 物 理 阻 尼 过 渡  */
            transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), 
                        opacity 0.8s ease, filter 0.8s ease, box-shadow 0.8s ease;
            transform-origin: center center;
            will-change: transform, opacity, filter;
            border-radius: 3rem;
            /* 必 须 加  overflow-hidden 配 合  absolute img 才 能 完 美 包 裹 画 面  */
            overflow: hidden;
        }

        /* 响 应 式 尺 寸 微 调  */
        @media (max-width: 1024px) {
            .carousel-item { margin-top: -260px; margin-left: -125px; width: 250px; height: 520px; }
        }

        /* 完 美 复 刻 草 图 ： 精 确 控 制 的  translateX 和  rotateY 防 止 越 界 裁 切  */
        .pos-center {
            /* A： 正 前 方  C位  */
            transform: translateX(0) scale(1) translateZ(0);
            opacity: 1;
            filter: blur(0px);
            z-index: 30;
            pointer-events: auto;
            box-shadow: 0 30px 60px -15px rgba(0,0,0,0.15);
        }

        .pos-left {
            /* B： 左 侧 ， 后 退 缩 小 ， 向 内 倾 斜  */
            transform: translateX(-65%) scale(0.85) translateZ(-100px) rotateY(30deg);
            opacity: 0.4; /* 提 高 可 见 度 ， 清 晰 展 示 透 明 感  */
            filter: blur(3px);
            z-index: 10;
            pointer-events: none;
            box-shadow: 0 10px 30px -10px rgba(0,0,0,0.05);
        }

        .pos-right {
            /* C： 右 侧 ， 后 退 缩 小 ， 向 内 倾 斜  */
            transform: translateX(65%) scale(0.85) translateZ(-100px) rotateY(-30deg);
            opacity: 0.4; /* 提 高 可 见 度 ， 清 晰 展 示 透 明 感  */
            filter: blur(3px);
            z-index: 10;
            pointer-events: none;
            box-shadow: 0 10px 30px -10px rgba(0,0,0,0.05);
        }

        .pos-offstage {
            transform: translateX(0) scale(0.72) translateZ(-240px);
            opacity: 0;
            filter: blur(6px);
            z-index: 1;
            pointer-events: none;
        }

        /* AI 扫 描 线 特 效  */
        @keyframes scan-sweep {
            0% { transform: translateY(-100%); opacity: 0; }
            10% { opacity: 1; }
            90% { opacity: 1; }
            100% { transform: translateY(400%); opacity: 0; }
        }

        @keyframes product-tab-blue-flow {
            0% {
                filter: brightness(0.9);
                background-position: 0% 0%;
                box-shadow: 0 0 8px rgba(59, 130, 246, 0.28), 0 0 14px rgba(59, 130, 246, 0.16);
            }
            50% {
                filter: brightness(1.2);
                background-position: 0% 100%;
                box-shadow: 0 0 12px rgba(59, 130, 246, 0.46), 0 0 24px rgba(125, 211, 252, 0.24);
            }
            100% {
                filter: brightness(0.95);
                background-position: 0% 0%;
                box-shadow: 0 0 9px rgba(59, 130, 246, 0.3), 0 0 16px rgba(59, 130, 246, 0.18);
            }
        }
        .ai-scan-line {
            position: absolute;
            left: 0; right: 0;
            height: 2px;
            background: linear-gradient(to right, transparent, rgba(59, 130, 246, 0.85), transparent);
            box-shadow: 0 0 12px rgba(59, 130, 246, 0.55);
            animation: scan-sweep 3s ease-in-out infinite;
            z-index: 40; /* 提 升 层 级 保 证 盖 在 图 片 上 方  */
            pointer-events: none;
            transition: opacity 0.5s ease;
            opacity: 0;
        }
        .pos-center .active-scan {
            opacity: 1;
        }

        /* ====================================================
           Solutions Hero - Water Light Field
           ==================================================== */
        #solutions {
            overflow: hidden;
            isolation: isolate;
            background: transparent;
        }


        .solutions-hero-terrain {
            position: absolute;
            inset: -4% -12% auto -12%;
            height: min(94vh, 940px);
            pointer-events: none;
            z-index: 0;
            overflow: hidden;
        }

        .solutions-water-page {
            position: absolute;
            inset: 0;
            pointer-events: none;
            z-index: 1;
            overflow: hidden;
        }

        .solutions-water-page-layer {
            position: absolute;
            inset: -20% -18%;
            opacity: 0.45;
            will-change: transform, background-position;
        }

        .solutions-water-page-layer-a {
            background:
                repeating-radial-gradient(
                    ellipse at 52% 48%,
                    rgba(255, 255, 255, 0.34) 0 2px,
                    rgba(255, 255, 255, 0) 2px 34px
                ),
                radial-gradient(150% 100% at 26% 30%, rgba(255, 255, 255, 0.58) 0%, rgba(255, 255, 255, 0) 56%),
                radial-gradient(160% 110% at 72% 70%, rgba(170, 170, 170, 0.12) 0%, rgba(170, 170, 170, 0) 60%);
            mix-blend-mode: screen;
            animation: solutions-page-water-a 18s linear infinite;
        }

        .solutions-water-page-layer-b {
            background:
                repeating-radial-gradient(
                    ellipse at 48% 58%,
                    rgba(0, 0, 0, 0.05) 0 1px,
                    rgba(0, 0, 0, 0) 1px 30px
                ),
                linear-gradient(110deg, rgba(255, 255, 255, 0) 10%, rgba(210, 210, 210, 0.22) 44%, rgba(255, 255, 255, 0) 80%);
            mix-blend-mode: multiply;
            opacity: 0.28;
            animation: solutions-page-water-b 24s ease-in-out infinite alternate;
        }

        .solutions-water-top {
            position: absolute;
            inset: 0;
            pointer-events: none;
            z-index: 12;
            overflow: hidden;
        }

        .solutions-water-top-layer {
            position: absolute;
            inset: -16% -14%;
            background:
                repeating-radial-gradient(
                    ellipse at 50% 52%,
                    rgba(255, 255, 255, 0.2) 0 1px,
                    rgba(255, 255, 255, 0) 1px 24px
                ),
                radial-gradient(140% 90% at 18% 34%, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0) 58%),
                radial-gradient(146% 96% at 82% 70%, rgba(0, 0, 0, 0.06) 0%, rgba(0, 0, 0, 0) 62%);
            opacity: 0.26;
            mix-blend-mode: soft-light;
            will-change: transform, background-position;
            animation: solutions-page-water-top 14s linear infinite;
        }

        .solutions-ambient-base {
            position: absolute;
            inset: 0;
            background:
                radial-gradient(130% 76% at 24% 38%, rgba(255, 255, 255, 0.82) 0%, rgba(255, 255, 255, 0) 62%),
                radial-gradient(126% 80% at 78% 62%, rgba(215, 215, 215, 0.24) 0%, rgba(215, 215, 215, 0) 64%),
                linear-gradient(180deg, rgba(255, 255, 255, 0.52) 0%, rgba(236, 236, 236, 0.68) 100%);
            opacity: 0.9;
        }

        .hero-water-overlay {
            position: absolute;
            inset: -2% -10% -8% -10%;
            overflow: visible;
            z-index: 5;
            pointer-events: none;
            filter: contrast(1.08);
        }

        .hero-water-overlay::after {
            content: "";
            position: absolute;
            left: -14%;
            right: -14%;
            bottom: 10%;
            height: 26%;
            pointer-events: none;
            background:
                radial-gradient(140% 100% at 50% 18%, rgba(232, 232, 232, 0) 56%, rgba(224, 224, 224, 0.42) 64%, rgba(255, 255, 255, 0) 74%),
                radial-gradient(120% 96% at 30% 8%, rgba(224, 224, 224, 0.26) 58%, rgba(255, 255, 255, 0) 72%),
                radial-gradient(118% 94% at 72% 10%, rgba(216, 216, 216, 0.22) 60%, rgba(255, 255, 255, 0) 74%);
            opacity: 0.7;
            filter: blur(7px);
            will-change: transform, opacity;
            animation: hero-boundary-wave 10s ease-in-out infinite alternate;
        }

        .water-sheet {
            position: absolute;
            left: -24%;
            width: 148%;
            border-radius: 50%;
            will-change: transform;
            mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.9) 56%, rgba(0, 0, 0, 0.62) 76%, rgba(0, 0, 0, 0.22) 90%, rgba(0, 0, 0, 0) 100%);
            -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.9) 56%, rgba(0, 0, 0, 0.62) 76%, rgba(0, 0, 0, 0.22) 90%, rgba(0, 0, 0, 0) 100%);
        }

        .water-sheet-a {
            top: 20%;
            height: 56%;
            background:
                radial-gradient(170% 90% at 22% 40%, rgba(255, 255, 255, 0.92) 0%, rgba(255, 255, 255, 0) 54%),
                radial-gradient(160% 96% at 64% 64%, rgba(174, 174, 174, 0.36) 0%, rgba(174, 174, 174, 0) 58%),
                linear-gradient(108deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0.74) 42%, rgba(206, 206, 206, 0.38) 62%, rgba(255, 255, 255, 0) 84%);
            opacity: 0.94;
            mix-blend-mode: screen;
            animation: water-flow-a 7.8s ease-in-out infinite alternate;
        }

        .water-sheet-b {
            top: 44%;
            height: 70%;
            background:
                radial-gradient(176% 94% at 68% 62%, rgba(132, 132, 132, 0.28) 0%, rgba(132, 132, 132, 0) 54%),
                radial-gradient(162% 92% at 36% 80%, rgba(102, 102, 102, 0.2) 0%, rgba(102, 102, 102, 0) 52%),
                linear-gradient(100deg, rgba(255, 255, 255, 0) 18%, rgba(208, 208, 208, 0.5) 48%, rgba(255, 255, 255, 0) 78%);
            opacity: 0.84;
            mix-blend-mode: multiply;
            animation: water-flow-b 9.2s ease-in-out infinite alternate;
        }

        .water-specular {
            position: absolute;
            inset: 10% -22% 0 -22%;
            background:
                radial-gradient(ellipse at 30% 52%, rgba(255, 255, 255, 0.88) 0%, rgba(255, 255, 255, 0) 42%),
                radial-gradient(ellipse at 70% 62%, rgba(255, 255, 255, 0.72) 0%, rgba(255, 255, 255, 0) 44%);
            opacity: 0.9;
            mix-blend-mode: screen;
            animation: water-specular-shift 7.6s ease-in-out infinite alternate;
        }

        .solutions-copy-veil {
            position: absolute;
            left: 0;
            top: 12%;
            width: 62%;
            height: 74%;
            background: radial-gradient(ellipse at 24% 52%, rgba(248, 248, 248, 0.96) 0%, rgba(248, 248, 248, 0.36) 50%, rgba(248, 248, 248, 0) 80%);
            opacity: 1;
        }

        #solutions-module-01 .spatial-grid,
        #solutions-module-02 .spatial-grid {
            perspective: 1400px;
            transform-style: preserve-3d;
        }

        #solutions-module-01 .spatial-card,
        #solutions-module-02 .spatial-card {
            transition:
                transform 0.78s cubic-bezier(0.22, 0.9, 0.3, 1),
                filter 0.72s cubic-bezier(0.22, 0.9, 0.3, 1),
                opacity 0.58s ease,
                box-shadow 0.72s cubic-bezier(0.22, 0.9, 0.3, 1),
                border-color 0.58s ease;
            will-change: transform, filter, opacity;
            transform: translateZ(0) scale(1);
        }

        #solutions-module-01 .spatial-card > span,
        #solutions-module-02 .spatial-card > span {
            color: rgba(0, 0, 0, 0.28);
            font-weight: 500;
            letter-spacing: 0.2em;
        }

        #solutions-module-01 .spatial-card p,
        #solutions-module-02 .spatial-card p {
            color: rgba(0, 0, 0, 0.44);
            line-height: 1.78;
        }

        #solutions-module-02 .spatial-card {
            background: rgba(255, 255, 255, 0.64);
        }

        #solutions-module-01 .spatial-grid.module-focus-has-focus .spatial-card,
        #solutions-module-02 .spatial-grid.module-focus-has-focus .spatial-card {
            transform: translateZ(-28px) scale(0.96);
            filter: blur(1.2px) saturate(0.9);
            opacity: 0.64;
            box-shadow: 0 10px 26px -16px rgba(0, 0, 0, 0.22);
            border-color: rgba(0, 0, 0, 0.03);
        }

        #solutions-module-01 .spatial-grid.module-focus-has-focus .spatial-card.is-focus,
        #solutions-module-02 .spatial-grid.module-focus-has-focus .spatial-card.is-focus {
            transform: translate3d(var(--focus-shift-x, 0px), var(--focus-shift-y, 0px), 0) translateZ(96px) scale(1.05);
            filter: blur(0) saturate(1.02);
            opacity: 1;
            z-index: 8;
            box-shadow: 0 42px 82px -28px rgba(0, 0, 0, 0.34);
            border-color: rgba(0, 0, 0, 0.1);
        }

        #solutions-module-02 .spatial-grid.module-focus-has-focus .spatial-card.is-focus {
            transform: translate3d(var(--focus-shift-x, 0px), var(--focus-shift-y, 0px), 0) translateZ(88px) scale(1.04);
        }

        .water-orb-zone {
            position: absolute;
            left: 0;
            right: 0;
            top: 84px;
            height: 320px;
            overflow: visible;
            pointer-events: none;
            z-index: 40;
        }

        .solutions-cursor-orb {
            position: fixed;
            width: 18px;
            height: 18px;
            border-radius: 9999px;
            pointer-events: none;
            left: 0;
            top: 0;
            z-index: 80;
            opacity: 0;
            transform: translate3d(-9999px, -9999px, 0);
            background: radial-gradient(circle at 28% 28%, #ffd9d0 0%, #ff6a45 38%, #d6391a 72%, #7c1a0a 100%);
            box-shadow: 0 0 16px rgba(255, 92, 54, 0.42), 0 0 34px rgba(255, 92, 54, 0.22);
            transition: opacity 140ms ease;
            mix-blend-mode: normal;
            will-change: transform, opacity;
        }

        .solutions-cursor-orb.is-hover-target {
            box-shadow: 0 0 20px rgba(255, 92, 54, 0.52), 0 0 40px rgba(255, 92, 54, 0.3);
        }

        .insights-news-feed {
            max-height: 220px;
            overflow-y: auto;
            display: grid;
            gap: 10px;
            padding-right: 4px;
        }

        .insights-news-feed::-webkit-scrollbar {
            width: 6px;
        }

        .insights-news-feed::-webkit-scrollbar-track {
            background: rgba(0, 0, 0, 0.04);
            border-radius: 999px;
        }

        .insights-news-feed::-webkit-scrollbar-thumb {
            background: rgba(0, 0, 0, 0.18);
            border-radius: 999px;
        }

        .insights-news-item {
            display: grid;
            gap: 6px;
            padding: 12px 14px;
            border: 1px solid rgba(0, 0, 0, 0.06);
            border-radius: 14px;
            background: rgba(255, 255, 255, 0.72);
        }

        .insights-news-item p {
            margin: 0;
            font-size: 0.9rem;
            line-height: 1.5;
            color: rgba(0, 0, 0, 0.6);
            font-weight: 300;
        }

        .insights-news-item p a {
            color: inherit;
            text-decoration: none;
            font-weight: 400;
        }

        .insights-news-item p a:hover {
            color: rgba(0, 0, 0, 0.85);
        }

        .insights-news-tag {
            width: fit-content;
            font-size: 10px;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: rgba(0, 0, 0, 0.42);
            font-weight: 600;
        }

        /* news-desk.html — three scrollable regional columns */
        .news-desk-module-scroll {
            max-height: min(42vh, 520px);
            overflow-y: auto;
            display: grid;
            gap: 10px;
            padding-right: 6px;
        }

        .news-desk-module-scroll::-webkit-scrollbar {
            width: 6px;
        }

        .news-desk-module-scroll::-webkit-scrollbar-track {
            background: rgba(0, 0, 0, 0.04);
            border-radius: 999px;
        }

        .news-desk-module-scroll::-webkit-scrollbar-thumb {
            background: rgba(0, 0, 0, 0.18);
            border-radius: 999px;
        }

        .insights-report-card {
            position: relative;
            overflow: hidden;
            background:
                linear-gradient(162deg, rgba(255, 255, 255, 0.94) 0%, rgba(252, 252, 252, 0.88) 44%, rgba(238, 238, 238, 0.82) 100%);
            border-color: rgba(0, 0, 0, 0.05);
            box-shadow:
                0 22px 44px -22px rgba(0, 0, 0, 0.18),
                inset 0 1px 0 rgba(255, 255, 255, 0.9),
                inset 0 -1px 0 rgba(0, 0, 0, 0.03);
        }

        .insights-report-card::before {
            content: "";
            position: absolute;
            z-index: 0;
            top: 5%;
            bottom: 5%;
            left: 12px;
            width: 7px;
            border-radius: 999px;
            background:
                linear-gradient(90deg, rgba(0, 0, 0, 0.14) 0%, rgba(0, 0, 0, 0.06) 38%, rgba(255, 255, 255, 0.68) 100%),
                linear-gradient(180deg, rgba(0, 0, 0, 0.06) 0%, rgba(0, 0, 0, 0.14) 48%, rgba(0, 0, 0, 0.06) 100%);
            box-shadow: 1px 0 0 rgba(255, 255, 255, 0.62), 3px 0 12px rgba(0, 0, 0, 0.08);
            opacity: 0.88;
            pointer-events: none;
        }

        .insights-report-card::after {
            content: "";
            position: absolute;
            z-index: 0;
            right: 0;
            bottom: 0;
            width: 112px;
            height: 112px;
            border-bottom-right-radius: inherit;
            background:
                linear-gradient(320deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.12) 24%, rgba(255, 255, 255, 0.98) 44%, rgba(255, 255, 255, 0.82) 62%, rgba(255, 255, 255, 0) 100%);
            clip-path: polygon(100% 0, 100% 100%, 0 100%);
            box-shadow:
                -12px -12px 24px rgba(0, 0, 0, 0.16),
                -2px -2px 0 rgba(255, 255, 255, 0.7) inset;
            opacity: 0;
            transform: translate3d(14px, 14px, 0) scale(0.78);
            transition: transform 360ms cubic-bezier(0.22, 0.9, 0.3, 1), opacity 240ms ease;
            pointer-events: none;
        }

        .insights-report-card > * {
            position: relative;
            z-index: 1;
        }

        .insights-report-card .insights-report-title {
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 4;
            overflow: hidden;
            word-break: break-word;
            overflow-wrap: anywhere;
            hyphens: auto;
        }

        /* Featured report covers: do NOT rely on Tailwind arbitrary positioning utilities.
           Some static previews won't have the full Tailwind class map, which makes `left-8/top-8`
           ineffective and breaks layout. */
        .insights-report-card .mm-report-kicker {
            position: absolute;
            z-index: 5;
            left: 2.15rem; /* align with p-8, but nudged for spine */
            top: 2rem;
            max-width: 72%;
            text-align: left;
            font-size: 10px;
            font-weight: 700;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            color: rgba(0, 0, 0, 0.3);
            line-height: 1.2;
            pointer-events: none;
        }

        .insights-report-card .mm-report-title {
            position: absolute;
            z-index: 4;
            left: 2.6rem; /* keep clear of the faux spine */
            right: 2rem;
            bottom: 2rem;
            min-width: 0;
        }

        .insights-report-card:hover::after {
            opacity: 1;
            transform: translate3d(0, 0, 0) scale(1);
        }

        .news-region-tab {
            border: 1px solid rgba(0, 0, 0, 0.1);
            background: rgba(255, 255, 255, 0.88);
            color: rgba(0, 0, 0, 0.6);
            transition: all 180ms ease;
            cursor: pointer;
        }

        .news-region-tab:hover {
            color: rgba(0, 0, 0, 0.9);
            border-color: rgba(0, 0, 0, 0.2);
            background: rgba(255, 255, 255, 1);
        }

        .news-region-tab.is-active {
            background: #0a0a0a;
            color: #ffffff;
            border-color: #0a0a0a;
        }

        .latest-article-item {
            transform-origin: center;
            transition:
                transform 320ms cubic-bezier(0.22, 0.9, 0.3, 1),
                box-shadow 320ms cubic-bezier(0.22, 0.9, 0.3, 1),
                background-color 240ms ease;
            border-radius: 14px;
        }

        .latest-article-item:hover {
            transform: translate3d(0, -3px, 0) scale(1.012);
            background-color: rgba(255, 255, 255, 0.62);
            box-shadow: 0 18px 28px -22px rgba(0, 0, 0, 0.35);
        }

        .solutions-cursor-orb.is-product-page {
            background: radial-gradient(circle at 28% 28%, #dff3ff 0%, #58b7ff 40%, #2f77ff 72%, #1f46b8 100%);
            box-shadow: 0 0 16px rgba(56, 142, 255, 0.45), 0 0 34px rgba(56, 142, 255, 0.25);
        }

        .solutions-cursor-orb.is-product-page.is-hover-target {
            box-shadow: 0 0 22px rgba(56, 142, 255, 0.58), 0 0 44px rgba(56, 142, 255, 0.34);
        }

        .logo-gradient-sphere-blue {
            background: radial-gradient(circle at 25% 25%, #e2f2ff 0%, #6bc4ff 42%, #2f7df0 82%, #214fae 100%);
            box-shadow:
                0 4px 12px -2px rgba(44, 125, 240, 0.44),
                inset 3px 3px 8px rgba(255, 255, 255, 0.55),
                inset -4px -4px 10px rgba(20, 44, 110, 0.25);
        }

        .product-logo-halo {
            position: absolute;
            background:
                radial-gradient(circle at 50% 50%, rgba(56, 189, 248, 0.28) 0%, rgba(56, 189, 248, 0.08) 38%, rgba(56, 189, 248, 0) 72%),
                radial-gradient(circle at 62% 42%, rgba(59, 130, 246, 0.2) 0%, rgba(59, 130, 246, 0) 64%);
            animation: product-logo-halo-flow 4.8s ease-in-out infinite;
            will-change: transform, opacity, filter;
        }

        .product-logo-halo::after {
            content: "";
            position: absolute;
            inset: -18%;
            border-radius: 9999px;
            background: conic-gradient(
                from 0deg,
                rgba(56, 189, 248, 0) 0deg,
                rgba(56, 189, 248, 0.28) 58deg,
                rgba(96, 165, 250, 0.38) 92deg,
                rgba(56, 189, 248, 0) 138deg,
                rgba(56, 189, 248, 0) 360deg
            );
            filter: blur(12px);
            opacity: 0.55;
            animation: product-logo-halo-sweep 6.8s linear infinite;
            pointer-events: none;
        }

        .product-logo-frame {
            border: 1px solid rgba(125, 211, 252, 0.42);
            box-shadow:
                0 0 0 1px rgba(96, 165, 250, 0.28),
                0 0 18px rgba(59, 130, 246, 0.24),
                0 0 34px rgba(59, 130, 246, 0.16),
                0 20px 40px -10px rgba(59, 130, 246, 0.3),
                inset 0 1px 0 rgba(255, 255, 255, 0.6);
            animation: product-logo-frame-glow 3.4s ease-in-out infinite;
        }

        @keyframes product-logo-halo-flow {
            0% {
                transform: scale(0.96);
                opacity: 0.42;
                filter: saturate(1) brightness(0.95);
            }
            50% {
                transform: scale(1.12);
                opacity: 0.78;
                filter: saturate(1.15) brightness(1.06);
            }
            100% {
                transform: scale(0.98);
                opacity: 0.48;
                filter: saturate(1.02) brightness(0.98);
            }
        }

        @keyframes product-logo-halo-sweep {
            0% { transform: rotate(0deg) scale(0.98); opacity: 0.42; }
            50% { transform: rotate(180deg) scale(1.04); opacity: 0.62; }
            100% { transform: rotate(360deg) scale(0.98); opacity: 0.42; }
        }

        @keyframes product-logo-frame-glow {
            0% {
                border-color: rgba(125, 211, 252, 0.34);
                box-shadow:
                    0 0 0 1px rgba(96, 165, 250, 0.22),
                    0 0 14px rgba(59, 130, 246, 0.2),
                    0 0 26px rgba(59, 130, 246, 0.14),
                    0 20px 40px -10px rgba(59, 130, 246, 0.28),
                    inset 0 1px 0 rgba(255, 255, 255, 0.58);
            }
            50% {
                border-color: rgba(125, 211, 252, 0.58);
                box-shadow:
                    0 0 0 1px rgba(96, 165, 250, 0.38),
                    0 0 24px rgba(59, 130, 246, 0.36),
                    0 0 46px rgba(59, 130, 246, 0.24),
                    0 22px 46px -10px rgba(59, 130, 246, 0.36),
                    inset 0 1px 0 rgba(255, 255, 255, 0.65);
            }
            100% {
                border-color: rgba(125, 211, 252, 0.36);
                box-shadow:
                    0 0 0 1px rgba(96, 165, 250, 0.24),
                    0 0 16px rgba(59, 130, 246, 0.22),
                    0 0 28px rgba(59, 130, 246, 0.15),
                    0 20px 40px -10px rgba(59, 130, 246, 0.3),
                    inset 0 1px 0 rgba(255, 255, 255, 0.6);
            }
        }


        .solution-orb-wrap {
            position: absolute;
            width: 34px;
            height: 34px;
            transform-origin: center;
            will-change: transform, opacity, filter;
            left: 0;
            top: 0;
            animation: none;
            z-index: 41;
        }

        .solution-orb {
            width: 100%;
            height: 100%;
            border-radius: 9999px;
            box-shadow: 0 0 34px rgba(255, 79, 42, 0.52), 0 14px 34px rgba(255, 79, 42, 0.56);
            animation: solution-orb-core 4.2s ease-in-out infinite;
        }

        .solution-orb-pulse {
            position: absolute;
            inset: 0;
            border-radius: 9999px;
            background: radial-gradient(circle, rgba(255, 79, 42, 0.3) 0%, rgba(255, 79, 42, 0) 70%);
            animation: solution-orb-pulse 3.6s ease-in-out infinite;
        }

        @keyframes water-flow-a {
            0% { transform: translate3d(-4%, 2.2%, 0) scale(1.02) rotate(-1.4deg); }
            35% { transform: translate3d(6.5%, -4.6%, 0) scale(1.18) rotate(1deg); }
            70% { transform: translate3d(-2.4%, 3.8%, 0) scale(1.1) rotate(-0.8deg); }
            100% { transform: translate3d(9.4%, -6.8%, 0) scale(1.26) rotate(1.4deg); }
        }

        @keyframes water-flow-b {
            0% { transform: translate3d(3.4%, 2.4%, 0) scale(1.04) rotate(1.2deg); }
            40% { transform: translate3d(-6.6%, 5.2%, 0) scale(1.2) rotate(-0.9deg); }
            75% { transform: translate3d(2.2%, -2.8%, 0) scale(1.12) rotate(0.7deg); }
            100% { transform: translate3d(-9.2%, 6.6%, 0) scale(1.28) rotate(-1.3deg); }
        }

        @keyframes water-specular-shift {
            0% { transform: translate3d(-2%, 1%, 0) scale(1); opacity: 0.56; }
            35% { transform: translate3d(3.4%, -2.8%, 0) scale(1.1); opacity: 0.96; }
            70% { transform: translate3d(-1.6%, 2.2%, 0) scale(1.04); opacity: 0.7; }
            100% { transform: translate3d(5.4%, -3.8%, 0) scale(1.12); opacity: 0.98; }
        }

        @keyframes hero-boundary-wave {
            0% {
                transform: translate3d(-1.4%, 0.8%, 0) scale(1);
                opacity: 0.6;
            }
            50% {
                transform: translate3d(1.2%, -0.9%, 0) scale(1.04);
                opacity: 0.78;
            }
            100% {
                transform: translate3d(2.4%, 0.6%, 0) scale(1.06);
                opacity: 0.64;
            }
        }

        @keyframes solutions-page-water-a {
            0% {
                transform: translate3d(0, 0, 0) scale(1);
                background-position: 0 0, 0 0, 0 0;
            }
            100% {
                transform: translate3d(-3.5%, 2.2%, 0) scale(1.05);
                background-position: 0 140px, 0 0, 0 0;
            }
        }

        @keyframes solutions-page-water-b {
            0% {
                transform: translate3d(0, 0, 0) scale(1);
                background-position: 0 0, 0 0;
            }
            100% {
                transform: translate3d(4.2%, -2.8%, 0) scale(1.06);
                background-position: 0 120px, 120px 0;
            }
        }

        @keyframes solutions-page-water-top {
            0% {
                transform: translate3d(0, 0, 0) scale(1);
                background-position: 0 0, 0 0, 0 0;
            }
            100% {
                transform: translate3d(-2.8%, 1.9%, 0) scale(1.04);
                background-position: 0 110px, 80px 0, 0 0;
            }
        }



        @keyframes solution-orb-float {
            0% {
                transform: translate3d(-220px, -70px, 0) scale(0.68);
                opacity: 0.16;
                filter: blur(2.4px);
            }
            16% {
                transform: translate3d(-120px, -142px, 0) scale(0.8);
                opacity: 0.38;
                filter: blur(1.8px);
            }
            34% {
                transform: translate3d(22px, -166px, 0) scale(0.96);
                opacity: 0.58;
                filter: blur(1px);
            }
            50% {
                transform: translate3d(178px, -62px, 0) scale(1.14);
                opacity: 0.98;
                filter: blur(0px);
            }
            66% {
                transform: translate3d(214px, 42px, 0) scale(1);
                opacity: 0.74;
                filter: blur(0.8px);
            }
            84% {
                transform: translate3d(28px, 142px, 0) scale(0.82);
                opacity: 0.42;
                filter: blur(1.8px);
            }
            100% {
                transform: translate3d(-220px, -70px, 0) scale(0.68);
                opacity: 0.16;
                filter: blur(2.4px);
            }
        }

        @keyframes solution-orb-pulse {
            0%, 100% { transform: scale(0.72); opacity: 0.08; }
            50% { transform: scale(1.62); opacity: 0.32; }
        }

        @keyframes solution-orb-core {
            0%, 100% {
                box-shadow: 0 0 16px rgba(255, 79, 42, 0.24), 0 8px 18px rgba(255, 79, 42, 0.28);
                filter: brightness(0.82);
            }
            42% {
                box-shadow: 0 0 34px rgba(255, 79, 42, 0.56), 0 16px 34px rgba(255, 79, 42, 0.52);
                filter: brightness(1.18);
            }
            70% {
                box-shadow: 0 0 22px rgba(255, 79, 42, 0.36), 0 10px 22px rgba(255, 79, 42, 0.34);
                filter: brightness(0.92);
            }
        }

        @media (max-width: 1024px) {
            .solutions-hero-terrain {
                height: 88vh;
                inset: -8% -16% auto -16%;
            }
            .solutions-copy-veil {
                width: 68%;
            }
        }

        @media (max-width: 768px) {
            .solutions-hero-terrain {
                height: 78vh;
                inset: 6% -22% auto -22%;
            }
            .solutions-copy-veil {
                width: 74%;
                top: 18%;
                height: 60%;
            }
            .hero-water-overlay {
                inset: 10% -6% 8% -6%;
            }
            .water-orb-zone {
                top: 74px;
                height: 240px;
                left: 0;
                right: 0;
            }
            .water-sheet-a {
                top: 26%;
                height: 58%;
            }
            .water-sheet-b {
                top: 48%;
                height: 74%;
            }
            @keyframes solution-orb-float {
                0% {
                    transform: translate3d(-112px, -44px, 0) scale(0.68);
                    opacity: 0.16;
                    filter: blur(2px);
                }
                16% {
                    transform: translate3d(-58px, -88px, 0) scale(0.8);
                    opacity: 0.36;
                    filter: blur(1.5px);
                }
                34% {
                    transform: translate3d(22px, -102px, 0) scale(0.94);
                    opacity: 0.58;
                    filter: blur(0.9px);
                }
                50% {
                    transform: translate3d(114px, -38px, 0) scale(1.12);
                    opacity: 0.98;
                    filter: blur(0px);
                }
                66% {
                    transform: translate3d(130px, 20px, 0) scale(0.98);
                    opacity: 0.72;
                    filter: blur(0.6px);
                }
                84% {
                    transform: translate3d(16px, 78px, 0) scale(0.82);
                    opacity: 0.42;
                    filter: blur(1.6px);
                }
                100% {
                    transform: translate3d(-112px, -44px, 0) scale(0.68);
                    opacity: 0.16;
                    filter: blur(2px);
                }
            }
        }

        /* ====================================================
           Solutions Page - Undulating Terrain (起 伏 地 貌 层 次 )
           ==================================================== */
        .terrain-container {
            position: absolute;
            /* 扩 张 容 器 范 围 ， 确 保 图 片 的 真 实 边 缘 被 推 到 视 窗 之 外  */
            inset: -20%;
            display: flex;
            align-items: center;
            justify-content: center;
            /* 关 键 ： 径 向 渐 变 遮 罩 ， 让 地 貌 边 缘 完 美 融 合 进 纯 白 背 景 ， 产 生 无 界 感  */
            mask-image: radial-gradient(circle at center, black 25%, transparent 65%);
            -webkit-mask-image: radial-gradient(circle at center, black 25%, transparent 65%);
            overflow: hidden;
        }
        .terrain-img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            /* 滤 镜 魔 法 ： 将 地 形 图 转 为 高 级 的 极 简 纯 白 石 膏 /雪 山 质 感  */
            filter: grayscale(100%) contrast(1.1) brightness(1.3);
            opacity: 0.65;
            animation: pan-terrain 30s ease-in-out infinite alternate;
        }
        
        /* 地 貌 极 其 缓 慢 的 平 移 ， 仿 佛 镜 头 在 沙 丘 上 空 滑 过  */
        @keyframes pan-terrain {
            0% { transform: scale(1.15) translate(0, 0); }
            100% { transform: scale(1.15) translate(-30px, -20px); }
        }

        /* 悬 浮 小 球 的 物 理 动 效  */
            perspective: 2500px;
            transform-style: preserve-3d;
            position: relative;
            width: 100%;
            min-height: 450px;
        }
        /* 针 对 手 机 端 的 降 级 保 护  */
        @media (max-width: 768px) {
            .prism-stage {
                perspective: none;
                transform-style: flat;
                height: auto;
                min-height: auto;
                display: flex;
                flex-direction: column;
                gap: 1rem;
            }
            .prism-panel {
                position: relative !important;
                top: auto !important;
                left: auto !important;
                right: auto !important;
                bottom: auto !important;
                margin: 0 !important;
                transform: none !important;
                width: 100% !important;
                height: auto !important;
                opacity: 1 !important;
                filter: none !important;
            }
        }
        /* 桌 面 端 完 美 的  3D 环 绕  */
        @media (min-width: 769px) {
            .prism-panel {
                position: absolute;
                transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
                transform-style: preserve-3d;
                will-change: transform, opacity, filter;
                border-radius: 2rem;
                background: rgba(255,255,255,0.6);
                backdrop-filter: blur(24px);
                -webkit-backdrop-filter: blur(24px);
                border: 1px solid rgba(0,0,0,0.04);
            }
            .prism-center {
                top: 50%; left: 50%; margin-top: -120px; margin-left: -180px;
                width: 360px; height: 240px;
                transform: translateZ(120px);
                z-index: 30;
                box-shadow: 0 30px 60px -15px rgba(0,0,0,0.08);
            }
            .prism-orbit-1 {
                top: 10%; right: -5%;
                width: 300px; height: 200px;
                transform: translateZ(-100px) rotateY(-25deg) rotateX(15deg);
                opacity: 0.6; filter: blur(3px); z-index: 10;
            }
            .prism-orbit-2 {
                bottom: 5%; left: -5%;
                width: 280px; height: 220px;
                transform: translateZ(-50px) rotateY(25deg) rotateX(-10deg);
                opacity: 0.7; filter: blur(2px); z-index: 15;
            }
            .prism-orbit-3 {
                bottom: -5%; right: 10%;
                width: 340px; height: 180px;
                transform: translateZ(20px) rotateZ(-5deg);
                opacity: 0.8; filter: blur(1px); z-index: 20;
            }
            .prism-panel:hover {
                transform: translateZ(200px) rotateY(0) rotateX(0) rotateZ(0) scale(1.05);
                opacity: 1; filter: blur(0); z-index: 50;
                box-shadow: 0 40px 80px -20px rgba(0, 0, 0, 0.16);
                border-color: rgba(0, 0, 0, 0.12);
                background: rgba(255,255,255,0.9);
            }
        }

        /* 3. 深 邃 的 高 透 传 送 门  (The Portal CTA) */
        .portal-inset {
            box-shadow: 
                inset 0 40px 80px -20px rgba(0, 0, 0, 0.05), 
                inset 0 0 0 1px rgba(0,0,0,0.02),
                0 20px 40px -10px rgba(0, 0, 0, 0.02);
            background: radial-gradient(120% 120% at 50% -20%, rgba(245,245,245,1) 0%, rgba(255,255,255,0.3) 100%);
        }
        .portal-btn {
            background: rgba(255,255,255,0.8);
            backdrop-filter: blur(12px);
            box-shadow: 0 10px 30px -10px rgba(0,0,0,0.08), inset 0 2px 5px rgba(255,255,255,1), inset 0 -2px 5px rgba(0,0,0,0.02);
            transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
        }
        .portal-btn:hover {
            transform: translateY(-4px) scale(1.02);
            box-shadow: 0 20px 40px -10px rgba(0,0,0,0.12), inset 0 2px 5px rgba(255,255,255,1), inset 0 -2px 5px rgba(0,0,0,0.02);
            background: #ffffff;
        }

        /* Media 页 — 现 场 照 片 横 向 无 缝 滚 动（ 自 右 向 左 ） */
        @keyframes media-photo-marquee-x {
            from {
                transform: translate3d(0, 0, 0);
            }
            to {
                transform: translate3d(-50%, 0, 0);
            }
        }
        .media-marquee-inner--running {
            animation: media-photo-marquee-x 52s linear infinite;
        }
        /* JS 驱动无缝滚动时禁用 CSS 动画（位移由 script 写入 transform） */
        .media-marquee-inner--js-driven {
            animation: none !important;
        }
        @media (prefers-reduced-motion: reduce) {
            .media-marquee-inner--running {
                animation: none !important;
                transform: none !important;
            }
        }

        /* 为悬停「浮出」预留上下空间，减轻裁切 */
        .media-marquee-view {
            padding-top: 18px;
            padding-bottom: 18px;
            padding-left: 10px;
            padding-right: 10px;
            cursor: grab;
            touch-action: none;
            -webkit-user-select: none;
            user-select: none;
        }
        .media-marquee-view.media-marquee-view--dragging {
            cursor: grabbing;
        }

        /* Media 现场照片：悬停整卡浮起 + 画面略冲出画框 */
        .media-marquee-root .media-marquee-fig {
            transform-origin: 50% 50%;
            transition:
                transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
                border-color 0.35s ease,
                box-shadow 0.5s cubic-bezier(0.16, 1, 0.3, 1),
                filter 0.45s ease;
        }
        .media-marquee-root .media-marquee-fig img {
            transition: transform 0.55s cubic-bezier(0.16, 1, 0.3, 1);
            will-change: transform;
        }
        .media-marquee-root .media-marquee-fig:hover {
            z-index: 25;
            overflow: visible;
            border-color: rgba(255, 255, 255, 0.32);
            filter: brightness(1.06);
            transform: translateY(-14px) scale(1.08);
            box-shadow:
                0 0 0 1px rgba(255, 255, 255, 0.12),
                0 12px 24px rgba(0, 0, 0, 0.45),
                0 36px 72px -20px rgba(0, 0, 0, 0.75);
        }
        .media-marquee-root .media-marquee-fig:hover img {
            transform: scale(1.12);
        }
        @media (prefers-reduced-motion: reduce) {
            .media-marquee-root .media-marquee-fig,
            .media-marquee-root .media-marquee-fig img {
                transition: none;
            }
            .media-marquee-root .media-marquee-fig:hover {
                transform: none;
                filter: none;
                box-shadow: none;
            }
            .media-marquee-root .media-marquee-fig:hover img {
                transform: none;
            }
        }

        /* Media 页 — 参 会 伙 伴 Logo 墙（ 自 左 向 右 无 缝 滚 动 ， 由 script 驱 动 ） */
        .media-partner-marquee-inner--js-driven {
            animation: none !important;
        }

        .media-partner-marquee-root .media-partner-marquee-view {
            padding-top: 6px;
            padding-bottom: 6px;
            padding-left: 8px;
            padding-right: 8px;
            cursor: grab;
            touch-action: none;
            -webkit-user-select: none;
            user-select: none;
        }

        .media-partner-marquee-root .media-partner-marquee-view.media-partner-marquee-view--dragging {
            cursor: grabbing;
        }

        .media-partner-marquee-root .media-partner-logo {
            transition:
                border-color 0.35s ease,
                background-color 0.35s ease,
                transform 0.35s ease;
        }

        .media-partner-marquee-root .media-partner-logo img {
            display: block;
            width: 100%;
            height: 100%;
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
        }

        .media-partner-marquee-root .media-partner-logo:hover {
            border-color: rgba(255, 255, 255, 0.22);
            background-color: rgba(255, 255, 255, 0.1);
            transform: scale(1.04);
        }

        /* Solutions 页 — Selected partners（浅色无缝滚动，与 Media 的交互一致） */
        .solutions-partner-marquee-inner--js-driven {
            animation: none !important;
        }

        .solutions-partner-marquee-root .solutions-partner-marquee-view {
            padding-top: 6px;
            padding-bottom: 6px;
            padding-left: 8px;
            padding-right: 8px;
            cursor: grab;
            touch-action: none;
            -webkit-user-select: none;
            user-select: none;
        }

        .solutions-partner-marquee-root .solutions-partner-marquee-view.solutions-partner-marquee-view--dragging {
            cursor: grabbing;
        }

        .solutions-partner-marquee-root .solutions-partner-logo {
            transition:
                border-color 0.35s ease,
                background-color 0.35s ease,
                transform 0.35s ease;
        }

        .solutions-partner-marquee-root .solutions-partner-logo:hover {
            border-color: rgba(0, 0, 0, 0.14);
            background-color: rgba(255, 255, 255, 0.92);
            transform: scale(1.035);
        }


        /* Learning page interactions */
        .learning-kpi-card {
            position: relative;
            isolation: isolate;
        }

        .learning-kpi-card::after {
            content: "";
            position: absolute;
            inset: 0;
            border-radius: inherit;
            background: radial-gradient(90% 60% at 85% 10%, rgba(14, 165, 233, 0.08), transparent 52%);
            opacity: 0;
            transition: opacity 0.35s ease;
            pointer-events: none;
        }

        .learning-kpi-card:hover::after {
            opacity: 1;
        }

        .learning-module-chip {
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
            transition: all 0.28s ease;
        }

        .learning-module-chip.is-active {
            background: rgba(255, 255, 255, 0.18);
            border-color: rgba(255, 255, 255, 0.35);
            transform: translateY(-2px);
        }

        .learning-country-tab {
            color: rgba(10, 10, 10, 0.52);
            border: 1px solid rgba(0, 0, 0, 0.08);
            background: rgba(255, 255, 255, 0.68);
            transition: all 0.25s ease;
        }

        .learning-country-tab.is-active {
            background: #0a0a0a;
            color: #fafafa;
            border-color: #0a0a0a;
            box-shadow: 0 10px 20px -10px rgba(0, 0, 0, 0.35);
        }

        .learning-flow-item {
            border: 1px solid rgba(0, 0, 0, 0.07);
            background: rgba(255, 255, 255, 0.85);
            border-radius: 0.9rem;
            padding: 0.8rem 0.95rem;
            font-size: 0.82rem;
            letter-spacing: 0.02em;
            color: rgba(10, 10, 10, 0.68);
            font-weight: 500;
            transition: all 0.25s ease;
        }

        .learning-flow-item:hover {
            transform: translateX(4px);
            border-color: rgba(14, 165, 233, 0.25);
            color: rgba(10, 10, 10, 0.9);
        }

        @media (prefers-reduced-motion: reduce) {
            .media-partner-marquee-root .media-partner-logo {
                transition: none;
            }
            .media-partner-marquee-root .media-partner-logo:hover {
                transform: none;
            }
        }

        /* Media page — press coverage panel (glass, neutral chrome) */
        .media-press-panel {
            box-shadow:
                0 1px 0 rgba(255, 255, 255, 0.75) inset,
                0 24px 60px -28px rgba(0, 0, 0, 0.1);
        }

        .media-press-card {
            isolation: isolate;
            border-radius: 1.75rem;
            background: linear-gradient(165deg, rgba(255, 255, 255, 0.72) 0%, rgba(255, 255, 255, 0.5) 100%);
            border: 1px solid rgba(0, 0, 0, 0.07);
            box-shadow:
                0 1px 0 rgba(255, 255, 255, 0.9) inset,
                0 18px 44px -22px rgba(0, 0, 0, 0.1);
            transition:
                transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.5s cubic-bezier(0.16, 1, 0.3, 1),
                border-color 0.35s ease;
        }

        .media-press-card::after {
            content: "";
            position: absolute;
            inset: 0;
            border-radius: inherit;
            pointer-events: none;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
            z-index: 6;
        }

        .media-press-card:hover {
            transform: translateY(-8px);
            border-color: rgba(0, 0, 0, 0.12);
            box-shadow:
                0 1px 0 rgba(255, 255, 255, 0.95) inset,
                0 28px 56px -20px rgba(0, 0, 0, 0.08),
                0 20px 48px -24px rgba(0, 0, 0, 0.1);
        }

        .media-press-card h4 {
            border-left: 3px solid rgba(0, 0, 0, 0.12);
            padding-left: 1rem;
            margin-left: 0.0625rem;
        }

        .media-press-card .relative.z-10 > .mt-3 > div:last-child {
            display: inline-flex;
            align-items: center;
            gap: 0.35rem;
            margin-top: 0.25rem;
            padding: 0.45rem 0.85rem;
            border-radius: 9999px;
            background: rgba(255, 255, 255, 0.65);
            border: 1px solid rgba(0, 0, 0, 0.05);
            font-size: 10px;
            font-weight: 700;
            letter-spacing: 0.12em;
            text-transform: uppercase;
            color: rgba(0, 0, 0, 0.32);
            transition: color 0.3s ease, border-color 0.3s ease, background 0.3s ease;
        }

        .media-press-card:hover .relative.z-10 > .mt-3 > div:last-child {
            color: rgba(23, 23, 23, 0.92);
            border-color: rgba(0, 0, 0, 0.12);
            background: rgba(0, 0, 0, 0.04);
        }

        @media (prefers-reduced-motion: reduce) {
            .media-press-card {
                transition: none;
            }
            .media-press-card:hover {
                transform: none;
            }
        }