/* 粒子遮罩 */
#particleCanvas {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* ========== 导航栏整体居中 ========== */
/* 实际DOM: nav > table > tbody > tr > td > div.nav_menustyle_1_1 > ul > li */
header > nav {
    width: 100%;
    display: block;
}
header > nav > table {
    width: 100%;
}
header > nav > table > tbody > tr > td {
    display: block;
    width: 100%;
}
.nav_menustyle_1_1 {
    width: 100%;
}
/* 一级菜单 ul 居中 */
.nav_menustyle_1_1 > ul {
    text-align: center;
}
/* 一级菜单 li 取消浮动，改用 inline-block */
.nav_menustyle_1_1 > ul > li {
    float: none !important;
    display: inline-block;
    vertical-align: top;
}
/* ========== 导航栏整体居中 END ========== */

/* ========== 版块入场动画（高级感：淡入+微上移） ========== */
.reveal-section {
    opacity: 0;
    transform: translateY(-40px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}
.reveal-section.revealed {
    opacity: 1;
    transform: translateY(0);
}
/* ========== 版块入场动画 END ========== */

@layer utilities {
    .text-shadow {
        text-shadow: 0 2px 4px rgba(0,0,0,0.3);
    }
    .card-hover {
        transition: all 0.3s ease;
    }
    .card-hover:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    }
    .nav-link {
        position: relative;
    }
    .nav-link::after {
        content: '';
        position: absolute;
        bottom: -2px;
        left: 50%;
        width: 0;
        height: 2px;
        background: white;
        transition: all 0.3s ease;
        transform: translateX(-50%);
    }
    .nav-link:hover::after {
        width: 80%;
    }
    /* 导航组件表格撑满宽度，确保一级菜单在屏幕居中 */
    .nav_menustyle_1_1 {
        width: 100%;
    }
    .nav_menustyle_1_1 table {
        width: 100%;
    }
     .section-title {
        height: 28px;
        line-height: 28px;
    }
    .scrollbar-hide::-webkit-scrollbar {
        display: none;
    }
    .scrollbar-hide {
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    .carousel-3d-stage {
        perspective: 1200px;
        perspective-origin: center center;
        overflow: visible;
    }
    .carousel-3d-card {
        position: absolute;
        top: 50%;
        transition: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        transform-style: preserve-3d;
        will-change: transform, opacity, left;
    }
    .carousel-3d-card.pos-center {
        left: 50%;
        transform: translate(-50%, -50%) rotateY(0deg) scale(1.08);
        opacity: 1;
        box-shadow: 0 20px 50px rgba(0,0,0,0.3);
        z-index: 5;
    }
    .carousel-3d-card.pos-left1 {
        left: 28%;
        transform: translate(-50%, -50%) rotateY(28deg) scale(0.88);
        opacity: 0.82;
        box-shadow: 0 8px 25px rgba(0,0,0,0.15);
        z-index: 4;
    }
    .carousel-3d-card.pos-right1 {
        left: 72%;
        transform: translate(-50%, -50%) rotateY(-28deg) scale(0.88);
        opacity: 0.82;
        box-shadow: 0 8px 25px rgba(0,0,0,0.15);
        z-index: 4;
    }
    .carousel-3d-card.pos-left2 {
        left: 10%;
        transform: translate(-50%, -50%) rotateY(42deg) scale(0.7);
        opacity: 0.5;
        box-shadow: 0 4px 15px rgba(0,0,0,0.08);
        z-index: 3;
    }
    .carousel-3d-card.pos-right2 {
        left: 90%;
        transform: translate(-50%, -50%) rotateY(-42deg) scale(0.7);
        opacity: 0.5;
        box-shadow: 0 4px 15px rgba(0,0,0,0.08);
        z-index: 3;
    }
    .carousel-3d-card.pos-hidden-left {
        left: -10%;
        top: 50%;
        transform: translate(-50%, -50%) rotateY(60deg) scale(0.5);
        opacity: 0;
        z-index: 0;
        pointer-events: none;
        transition: none;
    }
    .carousel-3d-card.pos-hidden-right {
        left: 110%;
        top: 50%;
        transform: translate(-50%, -50%) rotateY(-60deg) scale(0.5);
        opacity: 0;
        z-index: 0;
        pointer-events: none;
        transition: none;
    }
}