/* ============================================================
   site-mobile.css —— ROM王权之忆·龙之觉醒 官网 移动端样式（全新编写）
   金色玄幻主题 · 适配 <= 750px
   ============================================================ */

:root{
  --gold:#d4af37;
  --gold-light:#f2dc9b;
  --gold-deep:#9a7b2d;
  --gold-dim:rgba(212,175,55,.42);
}

*{margin:0;padding:0;border:0;outline:none;box-sizing:border-box}
html{font-size:53.3333px;scroll-behavior:smooth}
body,html{min-width:320px;height:auto}
body{
  font-family:"Microsoft YaHei","PingFang SC",sans-serif;
  background:#f7f5ef;
  -webkit-text-size-adjust:none;-webkit-tap-highlight-color:transparent;
}
a{text-decoration:none;-webkit-tap-highlight-color:transparent;cursor:pointer}
ul,ol,li{list-style:none}
img{max-width:100%}
i,em{font-style:normal}
.pr{position:relative}
.pa{position:absolute}
.disb{display:block}
.dis_i{display:inline-block;vertical-align:middle}
.warp{width:100%;min-width:320px}

/* ---------- 金色落叶粒子层 ---------- */
#fx-leaves{position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.5}

/* ---------- 顶部吸顶 ---------- */
.head{
  width:100%;height:1.03rem;position:fixed;z-index:100;
  background:linear-gradient(180deg,#101018 0%, rgba(16,16,24,.94) 100%);
  border-bottom:1px solid rgba(212,175,55,.25);
}
.head .logo{height:.9rem;margin:.1rem .2rem 0;float:left}
.head .logo img{display:block;height:100%;filter:drop-shadow(0 0 10px rgba(212,175,55,.4))}
.head .headTxt{display:flex;flex-direction:column;margin:.2rem .2rem 0 0;float:left}
.head .headTxt span{color:#fff;font-size:.3rem;line-height:.4rem;height:.4rem;text-shadow:0 0 10px rgba(212,175,55,.5)}
.head .headTxt em{color:var(--gold-light);font-size:.22rem;line-height:.28rem;height:.28rem}
.head .headBtn{top:.225rem;right:0;text-align:right;font-size:0}
.head .headBtn a{width:1.79rem;margin-right:.12rem;overflow:hidden;display:table-cell;padding:2px}
.head .headBtn a img{width:100%;filter:drop-shadow(0 2px 8px rgba(212,175,55,.45))}

/* ---------- 首屏 ---------- */
.page-container{width:100%;height:max-content}
.cover-bg{position:absolute;width:100%;height:32vh;bottom:0;z-index:3;background:linear-gradient(to top, #ffffff 0%, #ffffff 32%, rgba(255,255,255,0) 100%)}
.banner-box{position:relative;width:100%;height:80vh;overflow:hidden}
.banner-box .banner-poster,.banner-box video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.banner-box video{z-index:2;background:#000}
.banner-text{
  position:absolute;left:0;right:0;top:11%;z-index:5;text-align:center;pointer-events:none;
}
.banner-text .bt-kicker{display:none}
.banner-text .bt-title{
  font-size:.72rem;font-weight:800;letter-spacing:.1rem;
  font-family:"STSong","SimSun","Songti SC","Noto Serif SC",serif;
  background:linear-gradient(180deg,#f9ecc0 0%,#e3bf6f 30%,#9a7426 62%,#c9a24a 100%);
  -webkit-background-clip:text;background-clip:text;
  color:transparent;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.7)) drop-shadow(0 0 16px rgba(212,175,55,.5));
}
.banner-text .bt-sub{
  font-size:.34rem;letter-spacing:.14rem;margin-top:.08rem;
  font-family:"STKaiti","KaiTi","STSong","SimSun",serif;font-weight:500;
  background:linear-gradient(180deg,#f6e3ac 0%,#c89a3c 100%);
  -webkit-background-clip:text;background-clip:text;
  color:transparent;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.65)) drop-shadow(0 0 12px rgba(212,175,55,.45));
}
.banner-text .bt-slogan{
  font-size:.24rem;color:#e8e4d8;margin-top:.12rem;letter-spacing:.05rem;
}
.banner-text .bt-desc{
  font-size:.2rem;color:#f0ece0;margin-top:.14rem;letter-spacing:.04rem;
  text-shadow:0 1px 8px rgba(0,0,0,.55);
}
.banner-text .bt-desc2{
  font-size:.2rem;color:#d8d2c0;margin-top:.06rem;letter-spacing:.02rem;
  text-shadow:0 1px 8px rgba(0,0,0,.55);
}

/* ---------- 下载区：金色底板 + 三个下载按钮 + 二维码 ---------- */
.download{
  position:absolute;left:50%;transform:translateX(-50%);bottom:.5rem;z-index:6;
  width:92%;
  padding:.2rem .24rem;
  background:linear-gradient(180deg, rgba(8,8,18,.72) 0%, rgba(8,8,18,.94) 100%);
  border:1px solid rgba(212,175,55,.4);
  border-radius:.16rem;
  box-shadow:0 .2rem .55rem rgba(0,0,0,.6), inset 0 0 .4rem rgba(212,175,55,.08);
}
.download .dl-row{display:flex;gap:.16rem}
.download .dl-btn{
  flex:1;display:flex;align-items:center;justify-content:center;gap:.1rem;
  height:.92rem;border-radius:.12rem;
  color:#fff;transition:transform .3s;
}
.download .dl-btn:active{transform:scale(.96)}
.download .dl-btn svg{width:.34rem;height:.34rem;flex:none}
.download .dl-btn b{font-size:.26rem;letter-spacing:.02rem}
.download .dl-btn i{display:none}
.dl-btn.pc-btn{background:linear-gradient(135deg,#efcf6e 0%,#b8860b 100%);color:#1a1204;box-shadow:0 .08rem .26rem rgba(212,175,55,.45)}
.dl-btn.ios-btn{background:linear-gradient(135deg,#22223a,#0e0e1a);border:1px solid rgba(212,175,55,.38)}
.dl-btn.and-btn{background:linear-gradient(135deg,#22223a,#0e0e1a);border:1px solid rgba(212,175,55,.38)}
.download .wx-row{margin-top:.16rem;display:flex;align-items:center;justify-content:center;gap:.18rem}
.wx-frame{
  width:1.5rem;height:1.5rem;padding:.06rem;
  background:#fff;border:2px solid var(--gold);border-radius:.1rem;
  box-shadow:0 0 0 3px rgba(212,175,55,.2), 0 .12rem .3rem rgba(0,0,0,.5);
}
.wx-frame img{width:100%;height:100%;object-fit:cover;border-radius:.06rem}
.wx-row p{color:var(--gold-light);font-size:.22rem;letter-spacing:.03rem;text-shadow:0 0 8px rgba(212,175,55,.4)}
.wx-row .wx-txt{text-align:left;line-height:1.5}
.wx-row .wx-txt1{color:#fff;font-size:.24rem;font-weight:600;letter-spacing:.03rem;text-shadow:0 1px 6px rgba(0,0,0,.6)}
.wx-row .wx-txt2{color:#f0e6c8;font-size:.2rem;margin-top:.08rem;text-shadow:none;letter-spacing:.02rem;padding-bottom:.04rem}

/* ---------- 新闻区 ---------- */
.title{width:100%;text-align:center;margin:30px 0 10px}
.title img{width:100%;height:100%;object-fit:cover}
.mainNew{width:100%}
.mainNew .newsSelling{width:100%;height:3.92rem;margin:0 auto}
.mainNew .newsSelling a{width:100%;height:3.52rem;overflow:hidden;display:block}
.mainNew .newsSelling img{width:100%;height:3.52rem;object-fit:cover;border-radius:0}
.mainNew .newsSelling .swiper-pagination-bullet{width:calc(20% - 10px);height:.05rem;border-radius:inherit;opacity:1;transition:all .3s}
.mainNew .newsSelling .swiper-pagination-bullet-active{background:#dbb458}
.mainNew .newsSelling .swiper-container-horizontal>.swiper-pagination{bottom:.12rem;font-size:0}
.newsList{width:100%;height:3.7rem;margin:0 auto}
.newsTab{font-size:.5rem}
.newsTab a{
  display:inline-block;color:#757575;font-size:.3rem;line-height:.4rem;
  margin:.15rem .35rem .15rem 0;position:relative;
}
.newsTab a::before{
  content:'';width:1px;height:.3rem;background:#e0e0e0;position:absolute;top:50%;
  margin-top:-.135rem;right:-.25rem;transform:rotate(30deg);
}
.newsTab a:last-child::before{display:none}
.newsTab a.active{color:var(--gold-deep)}
.newsQueue .newsQueueList{width:100%;height:2.87rem;overflow:hidden;display:none}
.newsQueue .newsQueueList.show{display:block;animation:opacitys 1s ease both}
@keyframes opacitys{from{opacity:0}to{opacity:1}}
.newsQueue .newsQueueList a{
  width:100%;height:.7rem;position:relative;display:flex;justify-content:space-between;
  align-items:center;border-top:1px dashed #c9c9c9;color:#4a463e;font-size:.24rem;
}
.newsQueue .newsQueueList a::after{
  content:'';width:.12rem;height:.12rem;background:#ddb862;position:absolute;top:50%;
  left:.12rem;margin-top:-.06rem;transform:rotate(45deg);
}
.newsQueue .newsQueueList a em{width:1rem;display:inline-block;vertical-align:middle;text-align:center;font-size:.24rem;color:#8f8b80}
.newsQueue .newsQueueList a span{
  width:calc(100% - 2.2rem);font-size:.24rem;margin-left:.4rem;display:inline-block;
  vertical-align:middle;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.btnMore{display:flex;align-items:center;gap:.04rem;color:#757575;line-height:.4rem;height:.4rem;bottom:3rem;right:.5rem}
.btnMore span{font-size:.24rem}
.btnMore em{font-size:.28rem;font-style:normal}

/* ---------- 游戏特色 ---------- */
.gameFeatures{width:100%;padding-bottom:2rem}
.gameFeatures .carousel1{width:100%;height:8.31rem;margin:.25rem auto 0}
.gameFeatures .carousel1 .swiper-slide{width:4.74rem;height:8.31rem}
.gameFeatures .carousel2{width:100%;height:3.66rem;margin:.25rem auto 0}
.gameFeatures .carousel2 .swiper-slide{width:6.5rem;height:3.66rem}
.gameFeatures .swiper-slide img{width:100%;height:100%;object-fit:cover;border-radius:8px}
.gameFeatures .swiper-slide{overflow:hidden;border-radius:8px;
  box-shadow:0 10px 30px rgba(0,0,0,.14)}
.gameFeatures .carousel .iconPrev{width:1.05rem;height:7rem;margin-top:-3.5rem;left:0;opacity:0}
.gameFeatures .carousel .iconNext{width:1.05rem;height:7rem;margin-top:-3.5rem;right:0;opacity:0}

/* ---------- 客服弹窗 ---------- */
.kefu-btn{position:absolute;right:0;top:65%;width:2rem;z-index:999}
.kefu-btn img{width:100%;object-fit:cover}
.popup-mask{display:none;position:fixed;left:0;top:0;width:100%;height:100%;
  background:rgba(0,0,0,.65);z-index:9999;align-items:center;justify-content:center}
.popup-mask.show{display:flex}
.popup-box{width:280px;background:#fff;padding:30px 20px;border-radius:12px;text-align:center;position:relative;animation:popAnim 0.25s ease}
@keyframes popAnim{0%{transform:scale(0.85);opacity:0}100%{transform:scale(1);opacity:1}}
.close-btn{position:absolute;right:12px;top:8px;font-size:24px;color:#999;cursor:pointer}
.popup-box .qrcode{width:180px;height:180px;margin:15px 0;border:1px solid #eee}
.popup-box h3{font-size:18px;color:#333;margin:0 0 10px}
.popup-box p{color:#666;font-size:14px;line-height:1.6}

/* ---------- 页脚 ---------- */
.footer{
  width:100%;min-height:100px;text-align:center;
  background:linear-gradient(180deg,#12121c,#08080e);
  padding:30px 0;
}
.footer .tips span{color:var(--gold-light);font-size:.26rem;letter-spacing:.04rem;display:block;margin:5px}
.footer .tips p{color:#a8a294;font-size:.24rem;line-height:.36rem;display:block;margin:5px}
.footer-info{margin-top:.3rem;padding-top:.24rem;border-top:1px solid rgba(212,175,55,.2)}
.footer-info p{color:#8f8b80;font-size:.22rem;line-height:.4rem;text-align:center}
.footer-info a{color:#8f8b80}

/* ---------- 滚动渐入 ---------- */
.reveal{opacity:0;transform:translateY(36px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:translateY(0)}