@charset "UTF-8";
/* CSS Document */
body{ 
	overflow-x: hidden !important;
	letter-spacing: 0px;
}
.w_video{ width:100vw; height:600px; overflow:hidden;}

.w_video video{
	object-position: center center;
	width: 100vw;
	height: 600px;
	object-fit: cover;transform-origin: center center;
}

.pro_slogn {
	font-family: "Source Han Sans CN", "思源黑体 CN", "Noto Sans CJK SC", sans-serif;
    font-size: 32px;
    line-height: 50px;
    color: #fff;
    position: absolute;
    top: 290px;
    left: 50%;
    margin-left: -350px;
    width: 700px;
	text-align: center;
    z-index: 10;
    text-align-last: justify;
}
@media (min-width: 1400px) {
	.pro_slogn {
		font-size: 34px;
		text-align: center;
	}
}
@media (min-width: 1600px) {
	.pro_slogn {
		font-size: 36px;
		text-align: center;
	}
}
@media (min-width: 1800px) {
	.pro_slogn {
		font-size: 38px;
		text-align: center;
	}
}
.pro_slogn span {
    text-transform: uppercase;
    font-size: 16px;
    text-align-last: justify;
}
.pro_tit{ margin: 0 auto;}
 .pro_strategy-container {
            display: flex;
            justify-content: space-between;
            align-items: center;
            width: 100%;
            max-width: 1200px; /* 总容器1200px */
            margin: 0 auto;
            gap: 45px; /* 卡片间距45px */
        }
        .pro_strategy-card {
            width: 370px; /* 适配1200px容器的合理宽度 */
            height: 310px; /* 保持正方形视觉协调 */
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            padding: 1.2rem;
            box-sizing: border-box;
            text-align: center;
            background-color: #f0f2f5; /* 兜底底色，防止图片加载失败 */
            background-repeat: no-repeat; /* 不平铺，完整展示图片内容 */
            background-position: center center; /* 固定居中，放大时不偏移核心内容 */
            background-size: 100%; /* 初始状态：100%贴合卡片，为放大留足空间 */
            color: #3d3d3d; /* 默认深色文字，匹配灰色图片 */
            position: relative; /* 作为图标的定位父级，限制图标在卡片内 */
            overflow: hidden; /* 核心：隐藏背景图放大后超出卡片的部分，避免溢出 */
            cursor: pointer;
            flex-shrink: 0;
            /* 核心优化：统一丝滑过渡，采用ease-out让结束阶段更平缓，时长1s更丝滑 */
            transition: all 1s cubic-bezier(0.2, 0.8, 0.2, 1);
        }
        /* 为每张卡片设置独立的灰色背景图（3张不同，均为1200px高清图） */
        .pro_strategy-card:nth-child(1) { /* 第1张：市场中性 - 商务数据风格 */
            background-image: url("../img/pro_1.jpg");
        }
        .pro_strategy-card:nth-child(2) { /* 第2张：指数增强 - 金融图表风格 */
            background-image: url("../img/pro_2.jpg");
        }
        .pro_strategy-card:nth-child(3) { /* 第3张：量化选股 - 科技办公风格 */
            background-image: url("../img/pro_3.jpg");
        }
        /* 核心优化：真正的背景图放大，搭配丝滑过渡 */
        .pro_strategy-card:hover {
            color: #ffffff;
            transform: translateY(-3px); /* 保留卡片轻微上移效果 */
            background-size: 120%; /* 从100%放大到120%，明显的放大效果，不夸张 */
        }
        /* 蓝色遮罩层（默认透明隐藏，悬停时显示） */
        .pro_strategy-card::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;

            opacity: 0;
            z-index: 0;
            /* 遮罩层同步丝滑过渡 */
            transition: all 1s cubic-bezier(0.2, 0.8, 0.2, 1);
        }
        .pro_strategy-card:hover::before {
            background-color: #093979;
            opacity: 0.8;
        }
        .pro_icon-wrapper {
            width:  55px;
            height: 55px;
            margin-bottom: 1rem;
            z-index: 1;
            position: relative; /* 默认相对定位，居中展示 */
            /* 图标同步丝滑过渡 */
            transition: all 1s cubic-bezier(0.2, 0.8, 0.2, 1);
        }
        /* 核心：悬停时图标定位到卡片左上角15px，保留放大效果 */
        .pro_strategy-card:hover .pro_icon-wrapper {
            transform: scale(0.8); /* 保留图标轻微放大效果 */
            position: absolute; /* 切换为绝对定位，实现精准定位 */
            top: 15px; /* 距离图片上边15px */
            left: 15px; /* 距离图片左边15px */
            margin-bottom: 0; /* 清除默认底部间距，避免定位干扰 */
        }
.pro_strategy-card:hover .pro_strategy-title{color: #fff; font-size: 24px;}
        .pro_icon-wrapper img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            /* 默认状态：无滤镜，保持图标黑色（匹配SVG原始深色） */
            filter: none;
            /* 图标颜色切换同步丝滑过渡 */
            transition: all 1s cubic-bezier(0.2, 0.8, 0.2, 1);
        }
        /* 核心：卡片悬停时，图标应用反转滤镜，转为纯白色 */
.pro_strategy-card:first-child:hover .pro_icon-wrapper {
            background: url("../img/pro_2_whi.png") no-repeat; width: 45px;
	background-size: 100%;
        }
.pro_strategy-card:nth-child(2):hover .pro_icon-wrapper {
            background: url("../img/pro_3_whi.png") no-repeat;width: 45px;
	background-size: 100%;
        }
.pro_strategy-card:last-child:hover .pro_icon-wrapper {
            background: url("../img/pro_1_whi.png") no-repeat;width: 45px;
	background-size: 100%;
        }
.pro_strategy-card:first-child:hover .pro_icon-wrapper img{
            display: none;
        }
.pro_strategy-card:nth-child(2):hover .pro_icon-wrapper img{
             display: none;
        }
.pro_strategy-card:last-child:hover .pro_icon-wrapper img{
             display: none;
        }
.pro_strategy-card:first-child:hover .pro_strategy-title{
            margin-top: 4.5rem;
        }
.pro_strategy-card:nth-child(2):hover .pro_strategy-title{
            margin-top: 4.5rem;
        }
.pro_strategy-card:last-child:hover .pro_strategy-title{
            margin-top: 4.5rem;
        }
        .pro_strategy-title {
            /* 大字（标题）30px */
            font-size: 28px;
            font-weight: 600;
            margin-bottom: 1rem;
            z-index: 1;
            /* 标题同步丝滑过渡 */
            transition: all 1s cubic-bezier(0.2, 0.8, 0.2, 1);
        }
        .pro_strategy-desc {
            /* 小字（详细描述）18px */
            font-size: 18px;
            line-height: 1.5;
            z-index: 1;
            /* 默认隐藏详细文字 */
            opacity: 0;
            visibility: hidden;
            transform: translateY(10px);
            max-height: 0;
            /* 描述文字同步丝滑过渡 */
            transition: all 1s cubic-bezier(0.2, 0.8, 0.2, 1);
			    text-align: justify;
        }
        /* 悬停：显示详细文字 */
        .pro_strategy-card:hover .pro_strategy-desc {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
            max-height: 200px; /* 容纳18px字号文字，不被截断 */
			margin: 0 0 60px 0;
        }
.pro_but button{width: 180px; height: 45px;margin: 0 auto; cursor: pointer; display: block; color: #093979; border: 1px solid #093979; background: #fff;}
.pro_but button span{
	font-size: 36px;
	line-height: 45px;
}
.pro_but button b{
	font-size: 18px;
	position: relative;
    top: -8px;
    left: -5px;
	font-weight: normal;
}
footer{
	position:relative; 
}
