/**
 * 怀旧天龙官网首页样式 - 优化版
 * 
 * 只保留首页相关样式，删除所有其他页面样式
 * 优化代码结构，添加详细注释
 */

/* ==================== 全局和基础样式 ==================== */

/* 页面和HTML基础设置 */
body, html { 
    height: 100%; 
    overflow: hidden; 
    font-family: 'Microsoft YaHei', Arial, sans-serif;
}

/* 主容器样式 */
.wrap { 
    position: relative; 
    width: 100%; 
    height: 100%; 
    overflow: hidden; 
}

/* 容器内所有元素使用边框盒模型 */
.wrap * { 
    box-sizing: border-box; 
}

/* ==================== 页面布局样式 ==================== */

/* 页面基础样式 */
.page { 
    width: 1920px; 
    height: 1080px; 
    position: absolute; 
    left: 50%; 
    top: 0; 
    margin-top: 0; 
    margin-left: -960px; 
    transform-origin: center top; 
}

/* 背景元素样式 */
.page-bg { 
    width: 1920px; 
    height: 1080px; 
    position: absolute; 
    top: 0; 
    left: 50%; 
    margin-left: -960px; 
    display: block; 
}

/* 首页背景特殊定位 */
.page0 .page-bg{ 
    top: -55px; 
}

/* ==================== 首页主要操作区域样式 ==================== */

/* 主操作按钮容器 */
.home_btn_main { 
    width: 630px; 
    height: 132px; 
    position: absolute; 
    left: 300px; 
    top: 680px; 
    display: flex; 
}

/* 二维码区域样式 */
.home_btn_ewm { 
    display: flex; 
    justify-content: flex-start; 
    box-shadow: 1px 1px 10px rgba(79, 39, 24, .2), -1px -1px 10px rgba(79, 39, 24, .2); 
}

/* 二维码文字标签 */
.home_btn_ewm p { 
    width: 34px; 
    height: 132px; 
    background: #c7ac75; 
    writing-mode: vertical-lr;  /* 竖排文字 */
    text-align: center; 
    vertical-align: middle; 
    line-height: 34px; 
    letter-spacing: 5px; 
    font-family: 'title'; 
    font-size: 18px; 
    color: #ffffff; 
}

/* 二维码图片 */
.home_btn_ewm img { 
    display: block; 
    width: 132px; 
}

/* 下载游戏按钮 */
.btn_home_download { 
    background-image: url(../image/home_btn_down.png); 
    background-repeat: no-repeat; 
    width: 278px; 
    height: 132px; 
    margin-left: 12px; 
    box-shadow: 1px 1px 10px rgba(79, 39, 24, .2), -1px -1px 10px rgba(79, 39, 24, .2); 
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* 下载按钮悬停效果 */
.btn_home_download:hover {
    transform: translateY(-2px);
    box-shadow: 2px 4px 15px rgba(79, 39, 24, .3), -2px -4px 15px rgba(79, 39, 24, .3);
}

/* 注册和充值按钮容器 */
.home_btn_sign { 
    display: flex; 
    flex-direction: column; 
    justify-content: space-between; 
    margin-left: 12px; 
}

/* 注册按钮 */
.home_btn_sign a:nth-child(1) { 
    background-image: url(../image/home_btn_zc.png); 
    background-repeat: no-repeat; 
    width: 157px; 
    height: 60px; 
    box-shadow: 1px 1px 10px rgba(79, 39, 24, .2), -1px -1px 10px rgba(79, 39, 24, .2);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* 充值按钮 */
.home_btn_sign a:nth-child(2) { 
    background-image: url(../image/home_btn_cz.png); 
    background-repeat: no-repeat; 
    width: 157px; 
    height: 60px; 
    box-shadow: 1px 1px 10px rgba(79, 39, 24, .2), -1px -1px 10px rgba(79, 39, 24, .2);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* 注册和充值按钮悬停效果 */
.home_btn_sign a:hover {
    transform: translateY(-1px);
    box-shadow: 2px 3px 12px rgba(79, 39, 24, .3), -2px -3px 12px rgba(79, 39, 24, .3);
}

/* ==================== 通用工具类 ==================== */

/* 块级显示 */
.db { 
    display: block; 
}

/* 图片懒加载初始状态 */
.swiper-lazy {
    opacity: 0;
    transition: opacity 0.3s ease;
}

/* 图片加载完成状态 */
.swiper-lazy.loaded {
    opacity: 1;
}

/* ==================== 动画效果 ==================== */

/* 按钮发光效果（可选） */
@keyframes Light {
    0%, 100% { 
        filter: brightness(100%); 
    }
    50% { 
        filter: brightness(120%); 
    }
}

/* ==================== 响应式优化 ==================== */

/* 小屏幕优化 */
@media screen and (max-width: 1200px) {
    /* 在小屏幕上可以适当调整按钮位置 */
    .home_btn_main {
        left: 200px;
    }
}

/* 高分辨率屏幕优化 */
@media screen and (min-width: 2560px) {
    /* 确保在高分屏上的显示效果 */
    .page, .page-bg {
        image-rendering: -webkit-optimize-contrast;
        image-rendering: crisp-edges;
    }
}