/* ============ 全局（固定 1920px 宽度设计） ============ */
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body {
  min-width: 1920px;                       /* 全站固定 1920px 宽 */
  font-family: "Microsoft YaHei", "微软雅黑", "PingFang SC", sans-serif;
  background: #000;
  color: #fff;
}
a { text-decoration: none; }

/* ============ 顶部黑色导航栏（1920 * 70px） ============ */
.nav {
  width: 1920px;                            /* 固定 1920 宽 */
  height: 70px;
  margin: 0 auto;
  position: relative;                       /* 普通定位：随页面滚动，不盖住视频 */
  background: #000;
  border-bottom: 1px solid #333;
}
.nav-inner {
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* 前边留 20% 放 Logo，后方留 25% 空白（相对 1920） */
  padding: 0 25% 0 20%;
}
/* 前段：Logo（仅展示，不可点击）+ 竖线 + 银色标语 */
.nav-left { display: flex; align-items: center; gap: 14px; flex: 1; }
.nav-logo {
  width: 140px;          /* 70 * 140px（高70 × 宽140，比例2:1） */
  height: 70px;
  object-fit: contain;
  pointer-events: none;  /* 不可点击，仅展示 */
  flex-shrink: 0;
}
.nav-divider { color: #666; font-size: 20px; font-weight: 300; }
.nav-slogan {
  color: #c0c0c0;        /* 银色文字 */
  font-size: 20px;
  letter-spacing: 2px;
  white-space: nowrap;
  text-shadow: 0 0 8px rgba(255,255,255,0.25);
}
/* 后段：四个按钮 + 音乐开关 */
.nav-right { display: flex; align-items: center; gap: 22px; flex-shrink: 0; }
.nav-btn {
  color: #e8d398;
  font-size: 17px;
  letter-spacing: 1px;
  padding: 8px 4px;
  position: relative;
  transition: color .2s, transform .2s;
  white-space: nowrap;
}
.nav-btn::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 2px;
  background: linear-gradient(90deg, #f5d67b, #c9a24b);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .2s;
}
.nav-btn:hover { color: #fff; text-shadow: 0 0 10px #f5d67b; }
.nav-btn:hover::after { transform: scaleX(1); }

/* 背景音乐开关按钮（导航栏最后一个按钮后） */
.music-toggle {
  color: #e8d398;
  font-size: 20px;
  font-style: normal;
  cursor: pointer;
  user-select: none;
  padding: 6px 12px;
  border: 1px solid #6b5a24;
  border-radius: 20px;
  background: linear-gradient(180deg, #1c1710 0%, #0e0b07 100%);
  box-shadow: inset 0 0 6px rgba(245,214,123,.15);
  transition: color .2s, border-color .2s, box-shadow .2s;
  white-space: nowrap;
}
.music-toggle:hover { color: #fff; border-color: #f5d67b; box-shadow: 0 0 10px rgba(245,214,123,.35); }
.music-toggle.on { color: #ffd15c; border-color: #f5d67b; box-shadow: 0 0 12px rgba(245,214,123,.5); }

/* ============ 游戏主屏幕（1920 固定宽） ============ */
.hero {
  position: relative;
  width: 1920px;                            /* 固定 1920 宽 */
  height: 1080px;                           /* 主屏幕 1920*1080 */
  margin: 0 auto;
  overflow: hidden;
  /* 视频加载前先显示 bg.jpg（url 相对本 CSS 文件 = 918ps/images/bg.jpg） */
  background: url(images/bg.jpg) no-repeat center / cover;
}
.hero-video {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* 上方的两个按钮：游戏下载、在线充值 */
.hero-buttons {
  position: absolute;
  top: 88%;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 40px;
  z-index: 5;
}
.hero-btn {
  display: inline-block;
  padding: 16px 58px;
  font-size: 26px;
  letter-spacing: 4px;
  color: #fff;
  border-radius: 6px;
  background: linear-gradient(180deg, #ffd15c 0%, #e09b24 45%, #b06f10 100%);
  border: 1px solid #ffd98a;
  box-shadow: 0 0 18px rgba(240,180,60,.55), inset 0 1px 0 rgba(255,255,255,.5);
  text-shadow: 0 2px 4px rgba(80,40,0,.6);
  transition: transform .2s, box-shadow .2s;
}
.hero-btn.recharge {
  background: linear-gradient(180deg, #ff7a5c 0%, #e0482f 45%, #a32310 100%);
  border-color: #ffb3a0;
  box-shadow: 0 0 18px rgba(240,90,60,.55), inset 0 1px 0 rgba(255,255,255,.5);
}
.hero-btn:hover { transform: translateY(-3px); box-shadow: 0 0 28px rgba(240,180,60,.8); }
.hero-btn.recharge:hover { box-shadow: 0 0 28px rgba(240,90,60,.8); }

/* ============ 主屏幕诚信承诺面板（叠加在视频上） ============ */
.promise {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;
  width: 1400px;
  padding: 0;
  background: none;
  border: none;
  box-shadow: none;
  text-align: center;
}
/* 顶部四句口号：金光大字 */
.promise-slogans {
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 22px;
  margin-bottom: 14px;
  padding-bottom: 0;
  border-bottom: none;
}
.promise-slogan {
  color: #ffd15c;
  font-size: 50px;
  font-weight: bold;
  letter-spacing: 3px;
  white-space: nowrap;
  text-shadow: 0 0 16px rgba(245,214,123,.65), 0 2px 5px rgba(0,0,0,1);
}
/* 下方三条说明：每排单独加半透明深色底 */
.promise-list { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.promise-item {
  display: inline-block;
  color: #ece5d2;
  font-size: 20px;
  letter-spacing: 1.5px;
  line-height: 1.5;
  padding: 6px 22px;
  background: rgba(0,0,0,.55);
  border-radius: 4px;
  text-shadow: 0 1px 3px rgba(0,0,0,.95);
}

/* ============ 底部页脚（1920 固定宽，参考图1） ============ */
.footer {
  width: 1920px;                            /* 固定 1920 宽 */
  margin: 0 auto;
  padding: 40px 0 30px;
  background: linear-gradient(180deg, #050608 0%, #0a0d12 60%, #111318 100%);
  border-top: 1px solid #2a2d33;
}
.footer-inner {
  width: 1500px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 70px;
}
.footer-logo {
  width: 240px;          /* 120 * 240px（高120 × 宽240，比例2:1） */
  height: 120px;
  object-fit: contain;
  flex-shrink: 0;
}
.footer-text { display: flex; flex-direction: column; gap: 10px; }
.footer-line-1 {
  color: #cfd3da;
  font-size: 15px;
  letter-spacing: 1px;
  line-height: 1.5;
}
.footer-line-2 {
  color: #9aa0ab;
  font-size: 14px;
  letter-spacing: 1px;
}
.footer-line-3 {
  color: #9aa0ab;
  font-size: 14px;
  letter-spacing: 1px;
}
.footer-link {
  color: #fff;
  font-weight: bold;
  text-decoration: underline;
  transition: color .2s;
}
.footer-link:hover { color: #ffd15c; }
