/* glass-bg.css - 动态玻璃碎片背景样式 */

/* 全页面动态背景容器 - 固定定位，覆盖整个页面 */
.glass-bg-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1; /* 置于底层 */
    overflow: hidden;
    pointer-events: none; /* 允许鼠标事件穿透到下方内容 */
}

/* 玻璃碎片样式 */
#glassBackground {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    overflow: hidden;
}

/* 移除所有.glass-shard相关的CSS，因为现在使用Canvas绘制 */

/* Hero区域样式 - 确保内容在背景之上 */
.hero {
    position: relative;
    width: 100%;
    height: 80vh;
    overflow: hidden;
    z-index: 10; /* 确保内容在背景之上 */
}

.hero-image {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-logo {
    position: relative;
    z-index: 11; /* 确保logo在背景之上 */
    max-width: 60%;
    max-height: 60%;
}

/* 确保其他页面内容也在背景之上 */
.header {
    position: relative;
    z-index: 10;
}