/* ==========================================================================
   WinboxBG88 — site.css
   --------------------------------------------------------------------------
   winboxonlinebet.com 的共用样式表（2026-09 合并版）
   · 视觉语言沿用 winboxofficial.online：浅色底、白色导航 + 青蓝菜单条、
     青蓝 #00AEEF / 橙 #ff6600 两个主色、深色页脚
   · 内容与版面沿用 winboxonlinebet.com 原有的 HTML 结构
   · 所有页面共用这一份，不再在页面里写内联 <style>
   --------------------------------------------------------------------------
   目录
     0. 变量 / 基础
     1. 导航
     2. 页脚
     3. 通用区块（section 宽度、标题组、按钮）
     4. 首页：hero 轮播 / intro / 3 steps / games / promos / why / faq
     5. 内页顶部：poster + 标题区（promo / free-credit / slots / register / login）
     6. 卡片网格：feat / promo / bonus-how
     7. 内容版式：pg-two / spec / note / zigzag / 时间线 / 清单 / 编号
     8. FAQ 三种版式
     9. 相关页面 / 底部 CTA
    10. free-credit：自家优惠卡 / 弹窗
    11. slots
    12. live casino
    13. download
    14. 从 official 迁过来的文章页（.page-head / .util / 博客）
    15. 响应式
   ========================================================================== */

/* ── 0. 变量 / 基础 ─────────────────────────────────────────────────────── */
:root{
  --cyan:#00AEEF; --cyan-d:#0083b3; --cyan-dd:#0079a8;
  --cyan-t1:#e6f5fc; --cyan-t2:#f2f9fd; --cyan-b:#d9edf8;
  --orange:#ff6600; --orange-d:#e65c00;
  --ink:#1a1a2e; --text:#333c45; --muted:#5a6570; --faint:#8a97a3;
  --line:#e5eaee; --line2:#eef2f5;
  --bg:#f0f0f0; --panel:#fff; --panel2:#f7f9fb;
  --foot:#1a1a2e;
  --r:12px;
  --gutter:max(20px, calc((100% - 1200px) / 2));
  --nav-h:92px;
  --text-dark:#1a1a2e;
}
*,*::before,*::after{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  background:var(--bg); color:var(--text);
  font-family:'Noto Sans','Microsoft YaHei',sans-serif;
  font-size:16px; line-height:1.6; overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; }
a{ color:var(--cyan-d); }
h1,h2,h3,h4{ color:var(--ink); line-height:1.2; }
a:focus-visible, button:focus-visible, summary:focus-visible{ outline:3px solid var(--orange); outline-offset:2px; }
[id]{ scroll-margin-top:calc(var(--nav-h) + 12px); }

/* ── 1. 导航（与 official 一致：白色 logo 行 + 青蓝菜单条，吸顶）──────── */
nav{ background:#fff; border-bottom:1px solid #ddd; position:sticky; top:0; z-index:999; }
.nav-top{ display:flex; align-items:center; justify-content:space-between; padding:0 20px; height:56px; max-width:1280px; margin:0 auto; }
.nav-top > a img{ height:38px; width:auto; display:block; }
.nav-btns{ display:flex; gap:8px; }
.nav-btns a{ padding:7px 20px; border-radius:4px; font-size:13px; font-weight:700; text-decoration:none; color:#fff; letter-spacing:.3px; transition:filter .15s; }
.nav-btns a:hover{ filter:brightness(1.08); }
.btn-login{ background:var(--cyan); }
.btn-reg{ background:var(--orange); }
.nav-bar{ background:var(--cyan); }
.nav-bar ul{ display:flex; list-style:none; max-width:1280px; margin:0 auto; padding:0 20px; overflow-x:auto; scrollbar-width:none; }
.nav-bar ul::-webkit-scrollbar{ display:none; }
.nav-bar li a{ display:block; padding:9px 14px; color:#fff; text-decoration:none; font-size:12px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; white-space:nowrap; }
.nav-bar li a:hover{ background:rgba(0,0,0,.15); }
.nav-bar li a[aria-current="page"]{ background:rgba(0,0,0,.18); }

/* ── 2. 页脚 ───────────────────────────────────────────────────────────── */
footer{ background:var(--foot); padding:34px 24px 20px; }
.foot{ max-width:1280px; margin:0 auto; }
.foot-top{ display:flex; gap:40px; flex-wrap:wrap; padding-bottom:24px; border-bottom:1px solid rgba(255,255,255,.08); margin-bottom:20px; }
.foot-brand{ max-width:340px; }
.foot-brand img{ height:36px; width:auto; display:block; }
.foot-about{ font-size:12.5px; line-height:1.75; color:rgba(255,255,255,.62); margin-top:12px; }
.foot-badges{ display:flex; flex-wrap:wrap; gap:7px; margin-top:14px; }
.foot-badge{ background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); border-radius:5px; padding:5px 11px; font-size:11px; color:rgba(255,255,255,.72); font-weight:600; }
/* 18+ 用描边：联盟协议和广告审核通常要求显示，不要删 */
.foot-badge.age{ background:transparent; border-color:rgba(255,150,70,.6); color:rgba(255,165,95,.95); }
.foot-pay{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.pay-tag{ background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); border-radius:4px; padding:4px 10px; font-size:11px; color:rgba(255,255,255,.66); font-weight:600; }
.foot-social{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.foot-social a{ display:flex; align-items:center; gap:6px; white-space:nowrap; padding:6px 12px; border-radius:6px; font-size:12px; font-weight:700; text-decoration:none; color:#fff; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); }
.foot-social a:hover{ background:var(--cyan); border-color:var(--cyan); }
.foot-cols{ display:flex; gap:40px; flex-wrap:wrap; flex:1; }
.foot-col h4{ font-family:inherit; font-size:10px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--cyan); margin-bottom:12px; }
.foot-col ul{ list-style:none; }
.foot-col li{ margin-bottom:7px; }
.foot-col a{ color:rgba(255,255,255,.66); text-decoration:none; font-size:12.5px; }
.foot-col a:hover{ color:#fff; }
.foot-note{ font-size:11px; color:rgba(255,255,255,.45); line-height:1.75; margin-bottom:14px; }
.foot-note a{ color:rgba(255,255,255,.7); }
.foot-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; font-size:11px; color:rgba(255,255,255,.5); padding-top:14px; border-top:1px solid rgba(255,255,255,.06); }
.foot-bottom a{ color:rgba(255,255,255,.55); text-decoration:none; }
.foot-bottom a:hover{ color:#fff; }

/* ── 3. 通用区块 ───────────────────────────────────────────────────────── */
section{ padding:64px var(--gutter); background:var(--panel); }
/* 相邻区块交替底色，靠颜色分段，不用加分隔线 */
section + section{ border-top:1px solid var(--line2); }
.feat-section, .why-section, .steps-section, .bonus-how, .top-games-section, .lc-games-section{ background:var(--panel2); }
.container{ width:100%; }

.se{ font-size:12px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase; color:var(--cyan); margin-bottom:8px; }
.st{ font-family:'Rajdhani',sans-serif; font-size:clamp(26px,3vw,36px); font-weight:700; color:var(--ink); line-height:1.12; margin-bottom:12px; letter-spacing:.3px; }
.ss{ font-size:15px; color:var(--muted); line-height:1.75; max-width:640px; margin-bottom:30px; }
.pg-lead{ max-width:820px; }
/* 首页区块（带 .container 的那些）标题居中，跟 official 首页一致 */
.container > .se, .container > .st, .container > .ss{ text-align:center; margin-left:auto; margin-right:auto; }
.acc{ color:var(--cyan); }
.eyebrow{ font-size:12px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--cyan); margin-bottom:10px; }

/* 按钮 */
.btn-learn, .btn-join, .btn-claim, .btn-read-more, .btn-play-now, .pg-btn{
  display:inline-block; text-align:center; text-decoration:none; font-weight:700; cursor:pointer;
  border-radius:6px; font-family:inherit; line-height:1.2; transition:filter .15s, background .15s, color .15s, transform .15s;
}
.btn-join, .btn-play-now, .pg-btn-primary{ background:var(--orange); color:#fff; border:1px solid var(--orange); }
.btn-join:hover, .btn-play-now:hover, .pg-btn-primary:hover{ filter:brightness(1.07); transform:translateY(-1px); }
.btn-learn, .btn-claim{ background:#fff; color:var(--cyan-d); border:1px solid var(--cyan); }
.btn-learn:hover, .btn-claim:hover{ background:var(--cyan); color:#fff; }
.btn-play-now{ padding:15px 42px; font-size:15px; border-radius:6px; }
.play-now-wrap, .art-cta{ text-align:center; margin-top:34px; }

/* ── 4. 首页 ───────────────────────────────────────────────────────────── */
/* hero 轮播：比例固定 2064×640，任何宽度 0 裁切。换图规格时改这里的 aspect-ratio */
.hero{ position:relative; width:100%; overflow:hidden; background:#1a6db5; }
.slider-track{ display:flex; will-change:transform; }
.slide{ position:relative; flex:0 0 100%; min-width:100%; aspect-ratio:2064/640; overflow:hidden; }
.slide > a{ position:absolute; inset:0; z-index:3; }
.slide-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.slider-arrow{
  position:absolute; top:50%; transform:translateY(-50%); z-index:10;
  width:38px; height:38px; border-radius:50%; border:none; cursor:pointer;
  background:rgba(0,0,0,.35); color:#fff; font-size:16px;
  display:flex; align-items:center; justify-content:center; transition:background .2s;
}
.slider-arrow:hover{ background:rgba(0,0,0,.6); }
.slider-arrow.prev{ left:14px; } .slider-arrow.next{ right:14px; }
.slider-dots{ position:absolute; bottom:12px; left:50%; transform:translateX(-50%); display:flex; gap:7px; z-index:10; }
.dot{ width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.5); border:none; cursor:pointer; padding:0; transition:all .3s; }
.dot.active{ background:#fff; width:24px; border-radius:4px; }

.home-intro{ text-align:center; padding-top:40px; padding-bottom:36px; }
.home-intro h1{ font-family:'Rajdhani',sans-serif; font-size:clamp(24px,3.2vw,36px); font-weight:700; color:var(--ink); max-width:900px; margin:0 auto 12px; }
.home-intro p{ font-size:15px; color:var(--muted); max-width:780px; margin:0 auto; line-height:1.8; }

/* 3 steps */
.steps-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
.step-card{ display:flex; flex-direction:column; align-items:center; text-align:center; }
.step-media{ width:100%; max-width:220px; aspect-ratio:1/1; border-radius:16px; overflow:hidden; margin-bottom:16px; background:var(--cyan-t2); }
.step-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.step-n{ font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--cyan); margin-bottom:6px; }
.step-card h3{ font-size:18px; margin-bottom:6px; }
.step-card p{ font-size:14px; color:var(--muted); margin-bottom:12px; }
.step-card a{ margin-top:auto; font-size:14px; font-weight:700; color:var(--cyan-d); text-decoration:none; }
.step-card a:hover{ text-decoration:underline; }

/* games：official 的青蓝卡片 */
.games-intro{ text-align:center; font-size:15px; color:var(--muted); max-width:640px; margin:0 auto 30px; }
.cat-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
.cat-card{ display:flex; flex-direction:column; background:var(--cyan); border-radius:12px; overflow:hidden; box-shadow:0 4px 14px rgba(0,120,170,.14); transition:transform .2s, box-shadow .2s; }
.cat-card:hover{ transform:translateY(-4px); box-shadow:0 10px 26px rgba(0,120,170,.22); }
.cat-banner{ position:relative; aspect-ratio:4/3; overflow:hidden; background:#1a6db5 !important; }
.cat-banner-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.cat-banner-label{ position:absolute; left:0; right:0; bottom:0; z-index:1; padding:26px 12px 10px; font-weight:700; font-size:15px; color:#fff; background:linear-gradient(transparent,rgba(0,0,0,.55)); display:none; }
.cat-banner-emoji{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:56px; }
.cat-body{ display:flex; flex-direction:column; flex:1; padding:16px 14px 18px; text-align:center; }
.cat-title{ font-family:'Rajdhani',sans-serif; font-size:21px; font-weight:700; color:#fff; margin-bottom:8px; }
.cat-desc{ font-size:12.5px; line-height:1.7; color:rgba(255,255,255,.92); margin-bottom:14px; }
.btn-read-more{ margin-top:auto; background:#fff; color:var(--cyan-d); border-radius:5px; padding:9px 0; font-size:13px; width:100%; }
.btn-read-more:hover{ background:#e0f6ff; }

/* 首页 bonus（p-header 版）*/
.container .promos-2{ max-width:860px; margin:0 auto; }
.promo-card{ background:#fff; border:1px solid var(--line); border-radius:12px; overflow:hidden; display:flex; flex-direction:column; transition:transform .2s, box-shadow .2s; }
.promo-card:hover{ transform:translateY(-3px); box-shadow:0 10px 26px rgba(0,0,0,.08); }
.p-header{ display:flex; justify-content:space-between; align-items:center; padding:0 22px; min-height:104px; color:#fff; }
.p-header.g1{ background:linear-gradient(135deg,#00AEEF,#1a6db5); }
.p-header.g2{ background:linear-gradient(135deg,#ff8a1f,#ff6600); }
.p-emoji{ font-size:42px; line-height:1; }
.p-right{ text-align:right; }
.p-amt{ font-family:'Rajdhani',sans-serif; font-size:46px; font-weight:700; line-height:1; color:#fff; }
.p-lbl{ font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:rgba(255,255,255,.9); margin-top:4px; }
.promo-body{ padding:20px; display:flex; flex-direction:column; flex:1; }
.promo-body h3{ font-size:18px; margin-bottom:6px; }
.promo-body p{ font-size:14px; color:var(--muted); margin-bottom:14px; }
.btn-claim{ align-self:flex-start; margin-top:auto; padding:9px 20px; font-size:13px; }

/* why */
.why-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.why-card{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:26px 24px; }
.why-icon{ font-size:30px; line-height:1; margin-bottom:12px; }
.why-card h3{ font-size:17px; margin-bottom:6px; }
.why-card p{ font-size:14px; color:var(--muted); line-height:1.75; }

/* ── 5. 内页顶部 ───────────────────────────────────────────────────────── */
/* banner 图完整显示（图里有字），没上传前留一条窄带 */
.page-hero{ position:relative; background:#1a6db5; line-height:0; min-height:90px; overflow:hidden; }
.hero-poster{ display:block; width:100%; height:auto; }
/* 标题区：跟 official 的 .page-head 一致（白底、青蓝大写标题）*/
.hero-intro{ text-align:center; padding-top:30px; padding-bottom:24px; }
.hero-intro h1{ font-family:'Rajdhani',sans-serif; font-size:clamp(26px,3.4vw,38px); font-weight:700; color:var(--cyan); letter-spacing:1px; text-transform:uppercase; max-width:920px; margin:0 auto 10px; }
.hero-intro p{ font-size:14.5px; color:var(--muted); max-width:760px; margin:0 auto; line-height:1.75; }

/* ── 6. 卡片网格 ───────────────────────────────────────────────────────── */
.feat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.feat-grid.g2{ grid-template-columns:repeat(2,1fr); }
.fcard{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:26px 24px; transition:border-color .2s, box-shadow .2s; }
.fcard:hover{ border-color:var(--cyan-b); box-shadow:0 8px 22px rgba(0,120,170,.08); }
.fi{ font-size:28px; line-height:1; margin-bottom:12px; }
.fcard h3{ font-size:17px; margin-bottom:6px; }
.fcard p{ font-size:14px; color:var(--muted); line-height:1.75; }

/* promo / free-credit 的图片卡 */
.pg-head{ margin:0 0 16px; }
.promos-grid + .pg-head{ margin-top:44px; }
.pg-head h2{ font-family:'Rajdhani',sans-serif; font-size:clamp(21px,2.4vw,28px); font-weight:700; color:var(--ink); display:flex; align-items:center; gap:10px; margin-bottom:6px; }
.pg-head h2::before{ content:''; flex:0 0 auto; width:4px; height:1em; background:var(--cyan); border-radius:2px; }
.pg-head p{ font-size:14.5px; color:var(--muted); max-width:780px; }
.promos-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
/* 图片区：直接按图片本身的宽高走（img 标签上的 width/height），任何图都 0 裁切 */
.p-banner{ position:relative; overflow:hidden; background:var(--cyan-t1); line-height:0; }
.p-banner-img{ display:block; width:100%; height:auto; }
.p-flag{ position:absolute; top:12px; left:12px; z-index:2; line-height:1; background:var(--orange); color:#fff; font-size:10px; font-weight:800; letter-spacing:1.6px; text-transform:uppercase; padding:6px 11px; border-radius:5px; box-shadow:0 3px 10px rgba(255,102,0,.35); }
.p-body{ display:flex; flex-direction:column; flex:1; padding:20px 22px 22px; }
.p-body h3{ font-size:18px; margin-bottom:6px; }
.p-body p{ font-size:14px; color:var(--muted); line-height:1.7; margin-bottom:14px; }
.p-btns{ display:flex; gap:10px; margin-top:auto; }
.p-btns > *{ flex:1; padding:11px 12px; font-size:13px; }
.promo-featured{ border:2px solid var(--cyan); box-shadow:0 8px 26px rgba(0,174,239,.13); }

/* promo 页底部说明 */
.bh-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.bonus-how > h2{ font-family:'Rajdhani',sans-serif; font-size:clamp(22px,2.6vw,30px); text-align:center; margin-bottom:20px; }
.bh-card{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:22px 20px; }
.bh-card h3{ font-size:17px; color:var(--cyan-d); margin-bottom:8px; }
.bh-card p{ font-size:13.5px; color:var(--muted); line-height:1.8; }

/* ── 7. 内容版式 ───────────────────────────────────────────────────────── */
.pg-two{ display:grid; grid-template-columns:1fr 1fr; gap:36px; align-items:start; }
.pg-two p{ font-size:15px; color:var(--text); line-height:1.85; margin-bottom:12px; }
.pg-note{ background:var(--cyan-t2); border:1px solid var(--cyan-b); border-left:4px solid var(--cyan); border-radius:8px; padding:16px 18px; margin-top:8px; }
.pg-note p{ font-size:14px; margin:0; color:var(--text); }
.pg-spec{ background:#fff; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.pg-spec-h{ background:var(--cyan); color:#fff; font-weight:700; font-size:15px; padding:13px 20px; }
.pg-spec dl > div{ display:flex; justify-content:space-between; gap:16px; padding:11px 20px; border-top:1px solid var(--line2); font-size:14px; }
.pg-spec dl > div:first-child{ border-top:none; }
.pg-spec dt{ color:var(--muted); }
.pg-spec dd{ color:var(--ink); font-weight:700; text-align:right; }
.pg-media{ position:relative; border-radius:12px; overflow:hidden; background:var(--cyan-t2); }
.pg-media img{ display:block; width:100%; height:auto; }
.pg-step-img{ display:block; width:100%; max-width:100%; aspect-ratio:19/13; object-fit:cover; border-radius:10px; margin-top:10px; }

/* 编号步骤（download / login）*/
.isteps{ display:flex; flex-direction:column; gap:20px; max-width:640px; }
.istep{ display:flex; gap:16px; }
.istep-n{ flex:0 0 32px; width:32px; height:32px; border-radius:50%; background:var(--cyan); color:#fff; font-family:'Rajdhani',sans-serif; font-size:16px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.istep h4{ font-size:16px; margin-bottom:4px; }
.istep p{ font-size:14px; color:var(--muted); line-height:1.75; }
.install-tabs{ display:flex; gap:0; margin-bottom:24px; border-bottom:2px solid var(--line); }
.itab{ padding:12px 24px; font-size:14px; font-weight:700; font-family:inherit; color:var(--muted); background:none; border:none; border-bottom:3px solid transparent; margin-bottom:-2px; cursor:pointer; }
.itab.active{ color:var(--cyan-d); border-bottom-color:var(--cyan); }

/* register：图文左右交替 */
.zz{ display:flex; flex-direction:column; gap:20px; }
.zz-row{ display:grid; grid-template-columns:1fr 1fr; background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.zz-row:nth-child(even) .zz-media{ order:2; }
.zz-media{ position:relative; aspect-ratio:3/2; background:var(--cyan-t2); }
.zz-media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.zz-body{ display:flex; gap:18px; align-items:flex-start; padding:36px 38px; align-self:center; }
.zz-n{ flex:0 0 34px; width:34px; height:34px; border-radius:50%; background:var(--cyan); color:#fff; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:16px; display:flex; align-items:center; justify-content:center; }
.zz-body h3{ font-size:19px; margin-bottom:6px; }
.zz-body p{ font-size:14.5px; color:var(--muted); line-height:1.8; }

/* register：时间线 */
.pr-time{ position:relative; max-width:900px; padding-left:34px; }
.pr-time::before{ content:''; position:absolute; left:9px; top:6px; bottom:6px; width:2px; background:var(--cyan-b); }
.pr-t{ position:relative; padding-bottom:28px; }
.pr-t:last-child{ padding-bottom:0; }
.pr-t::before{ content:''; position:absolute; left:-31px; top:5px; width:14px; height:14px; border-radius:50%; background:#fff; border:3px solid var(--cyan); }
.pr-t h3{ font-size:17px; margin-bottom:5px; }
.pr-t p{ font-size:14.5px; color:var(--muted); line-height:1.8; }

/* login：打勾清单 */
.pr-check{ display:grid; grid-template-columns:repeat(2,1fr); gap:26px 40px; }
.pr-c{ display:grid; grid-template-columns:28px 1fr; gap:14px; }
.pr-c-ic{ width:26px; height:26px; border-radius:50%; background:var(--cyan-t1); color:var(--cyan-d); font-size:13px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.pr-c h3{ font-size:16px; margin-bottom:4px; }
.pr-c p{ font-size:14px; color:var(--muted); line-height:1.75; }

/* free-credit：大号编号 */
.pr-num{ display:flex; flex-direction:column; gap:28px; max-width:900px; }
.pr-num-item{ display:grid; grid-template-columns:70px 1fr; gap:22px; }
.pr-num-n{ font-family:'Rajdhani',sans-serif; font-size:42px; font-weight:700; line-height:1; color:var(--cyan); }
.pr-num-item h3{ font-size:17px; margin-bottom:5px; }
.pr-num-item p{ font-size:14.5px; color:var(--muted); line-height:1.8; }

/* ── 8. FAQ 三种版式 ───────────────────────────────────────────────────── */
/* A. 手风琴（首页 / register）*/
.faq-list{ max-width:820px; }
.container > .faq-list{ margin:0 auto; }
.faq-item{ border-bottom:1px solid var(--line); }
.faq-q{ width:100%; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 0; background:none; border:none; cursor:pointer; font-family:inherit; font-size:16px; font-weight:700; color:var(--ink); text-align:left; }
.faq-q:hover{ color:var(--cyan-d); }
.faq-icon{ flex:0 0 auto; color:var(--cyan); font-size:20px; line-height:1; }
.faq-a{ display:none; padding:0 0 18px; font-size:14.5px; color:var(--muted); line-height:1.8; }
.faq-item.open .faq-a{ display:block; }
/* B. 左标题右折叠卡（free-credit）*/
.faq-split{ display:grid; grid-template-columns:.85fr 1.15fr; gap:52px; align-items:start; }
.faq-count{ font-size:12px; letter-spacing:2px; text-transform:uppercase; color:var(--faint); margin-bottom:12px; }
.faq-split-side p{ font-size:14.5px; color:var(--muted); line-height:1.8; }
.faq-cards{ display:flex; flex-direction:column; gap:10px; }
.faq-c{ background:#fff; border:1px solid var(--line); border-radius:10px; }
.faq-c[open]{ border-color:var(--cyan); }
.faq-c > summary{ list-style:none; cursor:pointer; padding:17px 20px; display:flex; justify-content:space-between; gap:16px; align-items:center; font-weight:700; font-size:15px; color:var(--ink); }
.faq-c > summary::-webkit-details-marker{ display:none; }
.faq-c > summary::after{ content:'+'; color:var(--cyan); font-size:21px; line-height:1; flex-shrink:0; }
.faq-c[open] > summary::after{ content:'\2212'; }
.faq-c > summary:hover{ color:var(--cyan-d); }
.faq-c > p{ padding:0 20px 18px; font-size:14px; color:var(--muted); line-height:1.8; }
/* C. 双栏卡片（login）*/
.faq-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.faq-g{ background:#fff; border:1px solid var(--line); border-top:3px solid var(--cyan); border-radius:10px; padding:22px 24px; }
.faq-g h3{ font-size:16px; margin-bottom:6px; }
.faq-g p{ font-size:14px; color:var(--muted); line-height:1.75; }

/* ── 9. 相关页面 / 底部 CTA ────────────────────────────────────────────── */
.pg-rel{ padding-top:40px; padding-bottom:48px; }
.pg-rel-links{ display:flex; flex-wrap:wrap; gap:10px; margin-top:6px; }
.pg-rel-links a{ display:inline-block; padding:8px 16px; border-radius:20px; background:var(--cyan-t2); border:1px solid var(--cyan-b); color:var(--cyan-d); font-size:13px; font-weight:600; text-decoration:none; transition:background .15s, color .15s; }
.pg-rel-links a:hover{ background:var(--cyan); border-color:var(--cyan); color:#fff; }
/* 底部大 CTA：official 的青蓝色带 */
.pg-cta{ background:var(--cyan); text-align:center; padding-top:52px; padding-bottom:56px; border-top:none; }
.pg-cta .se{ color:rgba(255,255,255,.85); }
.pg-cta .st{ color:#fff; font-size:clamp(26px,3.2vw,38px); letter-spacing:1.5px; }
.pg-cta p{ color:rgba(255,255,255,.92); font-size:15px; max-width:620px; margin:0 auto 24px; line-height:1.75; }
.pg-btn-row{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.pg-btn{ padding:13px 36px; font-size:14px; border-radius:5px; }
.pg-cta .pg-btn-primary{ background:#fff; color:var(--cyan-d); border-color:#fff; }
.pg-cta .pg-btn-primary:hover{ background:#e0f6ff; }
.pg-btn-ghost{ background:transparent; color:#fff; border:1px solid rgba(255,255,255,.75); }
.pg-btn-ghost:hover{ background:rgba(255,255,255,.12); }

/* ── 10. free-credit ──────────────────────────────────────────────────── */
.fc-grid2{ max-width:960px; }
.fc-tiers{ display:flex; flex-direction:column; gap:8px; margin:-4px 0 16px; }
.fc-tier{ display:flex; align-items:center; gap:12px; padding:10px 14px; border-radius:8px; background:var(--cyan-t2); border:1px solid var(--cyan-b); }
.fc-tier-in{ font-size:13px; color:var(--muted); }
.fc-tier-ar{ font-size:15px; font-weight:700; color:var(--cyan); }
.fc-tier-out{ margin-left:auto; font-family:'Rajdhani',sans-serif; font-size:18px; font-weight:700; color:var(--orange); }
#offer-first-topup:target, #offer-refer:target{ border-color:var(--cyan); box-shadow:0 0 0 3px rgba(0,174,239,.25), 0 14px 36px rgba(0,174,239,.16); animation:fcPulse 2.4s ease-out 1; }
@keyframes fcPulse{ 0%{ box-shadow:0 0 0 0 rgba(0,174,239,.55); } 70%{ box-shadow:0 0 0 14px rgba(0,174,239,0); } 100%{ box-shadow:0 0 0 3px rgba(0,174,239,.25); } }

/* 弹窗（细则 / 客服联系）*/
.fc-modal{ position:fixed; inset:0; z-index:2000; display:none; align-items:center; justify-content:center; padding:24px; }
.fc-modal.open{ display:flex; }
.fc-modal-bd{ position:absolute; inset:0; background:rgba(10,20,35,.62); }
.fc-modal-box{ position:relative; z-index:1; width:100%; max-width:640px; max-height:84vh; display:flex; flex-direction:column; background:#fff; border-radius:14px; box-shadow:0 30px 80px rgba(0,0,0,.35); overflow:hidden; }
.fc-modal-h{ display:flex; justify-content:space-between; align-items:flex-start; gap:16px; padding:22px 26px 14px; border-bottom:1px solid var(--line2); }
.fc-modal-h h3{ font-family:'Rajdhani',sans-serif; font-size:22px; font-weight:700; color:var(--ink); }
.fc-modal-x{ background:none; border:0; color:var(--faint); font-size:26px; line-height:1; cursor:pointer; padding:0 2px; }
.fc-modal-x:hover{ color:var(--cyan); }
.fc-modal-b{ padding:18px 26px 8px; overflow-y:auto; }
.fc-modal-lead{ font-size:14px; color:var(--muted); line-height:1.75; margin-bottom:14px; }
.fc-terms{ margin:0; padding-left:22px; }
.fc-terms li{ font-size:14px; color:var(--text); line-height:1.75; margin-bottom:11px; padding-left:5px; }
.fc-terms li::marker{ color:var(--cyan); font-weight:700; }
.fc-terms a{ color:var(--cyan-d); }
.fc-modal-f{ display:flex; gap:10px; padding:14px 26px 22px; border-top:1px solid var(--line2); }
.fc-modal-f > *{ padding:11px 26px; font-size:14px; }
body.fc-lock{ overflow:hidden; }
.fc-contact-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:16px 0 6px; }
.fc-contact{ display:flex; align-items:center; gap:12px; text-decoration:none; padding:14px 16px; border-radius:10px; border:1px solid var(--line); background:#fff; transition:transform .15s, border-color .15s, background .15s; }
.fc-contact:hover{ transform:translateY(-2px); border-color:var(--cyan); background:var(--cyan-t2); }
.fc-contact-i{ font-size:22px; line-height:1; flex:0 0 auto; }
.fc-contact b{ display:block; color:var(--ink); font-size:15px; }
.fc-contact small{ display:block; color:var(--faint); font-size:12px; margin-top:2px; }
.fc-tg .fc-contact-i{ color:#229ED9; }
.fc-wa .fc-contact-i{ color:#25D366; }

/* ── 11. slots ────────────────────────────────────────────────────────── */
.provider-icon-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:14px; }
.pvd-icon-card{ display:flex; flex-direction:column; align-items:center; gap:8px; text-decoration:none; transition:transform .2s; }
.pvd-icon-card:hover{ transform:translateY(-3px); }
.pvd-icon-img{ width:100%; aspect-ratio:1/1; border-radius:14px; overflow:hidden; box-shadow:0 4px 14px rgba(0,0,0,.08); }
.pvd-icon-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.pvd-icon-name{ font-size:12px; font-weight:700; color:var(--ink); text-align:center; }
.top-games-section > div > h2, .top-games-section > h2{ font-family:'Rajdhani',sans-serif; font-size:clamp(24px,2.8vw,32px); margin-bottom:22px; text-align:center; }
.tg-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:14px; }
.tgcard{ display:flex; flex-direction:column; align-items:center; gap:8px; text-decoration:none; }
.tg-img{ width:100%; aspect-ratio:127/122; border-radius:14px; overflow:hidden; box-shadow:0 4px 14px rgba(0,0,0,.1); transition:transform .2s; }
.tgcard:hover .tg-img{ transform:translateY(-3px); }
.tg-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.tg-name{ font-size:12px; font-weight:700; color:var(--ink); text-align:center; }
.seo-section > h2{ font-family:'Rajdhani',sans-serif; font-size:clamp(24px,2.8vw,32px); text-align:center; margin-bottom:12px; }
.seo-intro, .art-intro{ font-size:15px; color:var(--muted); line-height:1.85; text-align:center; max-width:820px; margin:0 auto 32px; }
.seo-cols, .art-cols{ display:grid; grid-template-columns:1fr 1fr; gap:24px 40px; }
.seo-block h3, .art-block h3{ font-size:17px; color:var(--cyan-d); margin-bottom:6px; }
.seo-block p, .art-block p{ font-size:14.5px; color:var(--text); line-height:1.85; }

/* ── 12. live casino ──────────────────────────────────────────────────── */
.lc-section-title{ font-family:'Rajdhani',sans-serif; font-size:clamp(24px,3vw,34px); font-weight:700; text-align:center; margin-bottom:22px; }
h1.lc-section-title{ color:var(--cyan); text-transform:uppercase; letter-spacing:1px; }
.lc-provider-btns{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }
.lc-pvd-btn{ display:block; width:220px; text-decoration:none; border-radius:10px; overflow:hidden; line-height:0; box-shadow:0 4px 14px rgba(0,0,0,.12); transition:transform .2s, box-shadow .2s; }
.lc-pvd-btn:hover{ transform:translateY(-3px); box-shadow:0 10px 24px rgba(0,0,0,.18); }
.lc-pvd-btn img{ display:block; width:100%; height:auto; }
.lc-slider-wrap{ overflow:hidden; width:100%; }
.lc-slider-track{ display:flex; gap:16px; width:max-content; animation:lcSlide 100s linear infinite; }
.lc-slider-track:hover{ animation-play-state:paused; }
@keyframes lcSlide{ 0%{ transform:translateX(0); } 100%{ transform:translateX(-50%); } }
.lc-game-card{ flex-shrink:0; width:160px; text-decoration:none; transition:transform .2s; }
.lc-game-card:hover{ transform:translateY(-4px); }
.lc-game-img{ position:relative; width:100%; aspect-ratio:4/5; border-radius:12px; overflow:hidden; box-shadow:0 4px 14px rgba(0,0,0,.12); }
.lc-game-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.lc-game-name{ margin-top:6px; font-size:13px; font-weight:700; color:var(--ink); text-align:center; }
.article-section > h2{ font-family:'Rajdhani',sans-serif; font-size:clamp(24px,2.8vw,32px); text-align:center; margin-bottom:12px; }
.art-cols{ max-width:980px; margin:0 auto; }
.art-tips{ max-width:980px; margin:36px auto 0; background:var(--panel2); border:1px solid var(--line); border-radius:12px; padding:26px 28px; }
.art-tips h3{ font-size:18px; margin-bottom:14px; }
.tips-list{ display:flex; flex-direction:column; gap:12px; }
.tip-row{ display:flex; gap:14px; align-items:flex-start; }
.tip-num{ flex:0 0 28px; width:28px; height:28px; border-radius:50%; background:var(--cyan); color:#fff; font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.tip-row p{ font-size:14.5px; color:var(--text); line-height:1.8; }

/* ── 13. download ─────────────────────────────────────────────────────── */
.dl-hero{ position:relative; overflow:hidden; display:flex; align-items:center; padding:64px var(--gutter); background:linear-gradient(135deg,#00AEEF 0%,#1a6db5 100%); }
.dl-hero > .hero-poster{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.35; }
.dl-content{ position:relative; z-index:1; max-width:640px; }
.dl-eyebrow{ display:inline-block; font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:#fff; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.35); padding:6px 14px; border-radius:20px; margin-bottom:16px; }
.dl-content h1{ font-family:'Rajdhani',sans-serif; font-size:clamp(32px,5vw,58px); font-weight:700; color:#fff; line-height:1.05; margin-bottom:12px; }
.dl-content h1 .acc{ color:#ffe08a; }
.dl-content > p{ font-size:15.5px; color:rgba(255,255,255,.92); line-height:1.75; margin-bottom:24px; }
.dl-btns{ display:flex; flex-direction:column; gap:12px; }
.dl-btn{ display:flex; align-items:center; gap:16px; padding:18px 22px; border-radius:10px; background:#fff; text-decoration:none; box-shadow:0 8px 24px rgba(0,40,80,.18); transition:transform .15s; }
.dl-btn:hover{ transform:translateY(-2px); }
.dl-icon{ font-size:30px; line-height:1; }
.dl-platform{ font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--faint); }
.dl-action{ font-family:'Rajdhani',sans-serif; font-size:23px; font-weight:700; color:var(--orange); line-height:1.15; }
.dl-btn.ios .dl-action{ color:var(--cyan-d); }
.dl-meta{ font-size:12.5px; color:var(--muted); }
.dl-arrow{ margin-left:auto; font-size:18px; color:var(--cyan); }

/* ── 14. 从 official 迁过来的文章页 ──────────────────────────────────── */
.page-head{ background:#fff; padding:34px 20px 8px; text-align:center; }
.page-head h1{ font-family:'Rajdhani',sans-serif; font-size:32px; font-weight:700; color:var(--cyan); letter-spacing:1px; text-transform:uppercase; }
.page-head p{ font-size:13.5px; color:#666; margin-top:8px; max-width:720px; margin-left:auto; margin-right:auto; }
.util{ background:#fff; padding:8px 20px 46px; }
.util-inner{ max-width:820px; margin:0 auto; }
.util-inner h2{ font-family:'Rajdhani',sans-serif; font-size:22px; font-weight:700; color:var(--ink); margin:30px 0 10px; letter-spacing:.3px; padding-bottom:7px; border-bottom:2px solid var(--cyan-t1); }
.util-inner > h2:first-child{ margin-top:18px; }
.util-inner h3{ font-size:16px; margin:18px 0 6px; }
.util-inner p{ font-size:14px; color:#4a5560; line-height:1.85; margin-bottom:11px; }
.util-inner strong{ color:var(--ink); }
.util-inner a{ color:var(--cyan-d); }
.util-steps{ list-style:none; counter-reset:step; margin:4px 0 14px; }
.util-steps li{ counter-increment:step; position:relative; padding:0 0 0 38px; margin-bottom:11px; font-size:14px; color:#4a5560; line-height:1.75; }
.util-steps li::before{ content:counter(step); position:absolute; left:0; top:1px; width:25px; height:25px; border-radius:50%; background:var(--cyan); color:#fff; font-family:'Rajdhani',sans-serif; font-size:14px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.util-list{ list-style:none; margin:4px 0 14px; }
.util-list li{ position:relative; padding-left:20px; margin-bottom:9px; font-size:14px; color:#4a5560; line-height:1.75; }
.util-list li::before{ content:""; position:absolute; left:4px; top:9px; width:7px; height:7px; border-radius:50%; background:var(--cyan); }
.util-tablewrap{ overflow-x:auto; margin:6px 0 14px; -webkit-overflow-scrolling:touch; }
.util-table{ width:100%; border-collapse:collapse; min-width:420px; }
.util-table th, .util-table td{ border:1px solid var(--line); padding:9px 12px; font-size:13.5px; text-align:left; }
.util-table th{ background:#f4fbfe; color:var(--cyan-dd); font-weight:700; white-space:nowrap; }
.util-table td{ color:#4a5560; }
.util-table tbody tr:nth-child(even) td{ background:#fafcfd; }
.util-faq-h{ margin-top:34px; }
.util-faqs{ margin-top:12px; }
.util-faq{ border:1px solid var(--line); border-radius:7px; margin-bottom:9px; background:#fcfdfe; }
.util-faq summary{ cursor:pointer; padding:13px 42px 13px 16px; list-style:none; font-size:14px; font-weight:700; color:var(--ink); position:relative; }
.util-faq summary::-webkit-details-marker{ display:none; }
.util-faq summary::after{ content:""; position:absolute; right:17px; top:19px; border-left:5px solid transparent; border-right:5px solid transparent; border-top:6px solid var(--cyan); transition:transform .18s; }
.util-faq[open] summary::after{ transform:rotate(180deg); }
.util-faq summary:hover{ color:var(--cyan); }
.util-faq p{ padding:0 16px 14px; margin:0; font-size:13.5px; }
.util-related{ margin-top:36px; padding-top:4px; border-top:1px solid var(--line2); }
.util-related-links{ display:flex; flex-wrap:wrap; gap:9px; margin-top:12px; }
.util-related-links a{ display:inline-block; padding:8px 15px; border-radius:20px; background:var(--cyan-t2); border:1px solid var(--cyan-b); color:var(--cyan-d); font-size:13px; font-weight:600; text-decoration:none; transition:background .15s, border-color .15s; }
.util-related-links a:hover{ background:var(--cyan); border-color:var(--cyan); color:#fff; }
.login-bonus{ background:var(--cyan); padding:36px 20px; text-align:center; }
.lb-title{ font-family:'Rajdhani',sans-serif; font-size:30px; font-weight:700; color:#fff; letter-spacing:2px; margin-bottom:18px; }
.btn-lb{ display:inline-block; padding:12px 60px; background:#fff; color:var(--cyan-d); font-weight:700; font-size:16px; border-radius:5px; text-decoration:none; }
.btn-lb:hover{ background:#e0f6ff; }
/* 博客 */
.post-meta{ display:flex; align-items:center; justify-content:center; gap:10px; margin-bottom:10px; }
.post-cat{ display:inline-block; padding:3px 10px; border-radius:20px; background:var(--cyan-t1); color:var(--cyan-dd); font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; }
.post-meta time{ font-size:12px; color:var(--faint); }
.post-list{ display:flex; flex-direction:column; gap:18px; padding-top:14px; }
.post-card{ border:1px solid var(--line); border-radius:10px; padding:18px 20px; background:#fff; transition:box-shadow .2s, transform .2s; }
.post-card:hover{ box-shadow:0 8px 24px rgba(0,0,0,.08); transform:translateY(-2px); }
.post-card .post-meta{ justify-content:flex-start; margin-bottom:8px; }
.post-card h2{ font-family:'Rajdhani',sans-serif; font-size:21px; font-weight:700; margin:0 0 8px; border:none; padding:0; line-height:1.25; }
.post-card h2 a{ color:var(--ink); text-decoration:none; }
.post-card h2 a:hover{ color:var(--cyan); }
.post-card p{ font-size:13.5px; color:var(--muted); line-height:1.75; margin-bottom:10px; }
.post-more{ font-size:13px; font-weight:700; color:var(--cyan-d); text-decoration:none; }
.post-more:hover{ text-decoration:underline; }
.post-nav{ display:flex; flex-wrap:wrap; gap:9px; margin-top:26px; padding-top:18px; border-top:1px solid var(--line2); }
.post-nav a{ display:inline-block; padding:8px 15px; border-radius:20px; background:#f6f8fa; border:1px solid var(--line); color:#4a5560; font-size:12.5px; font-weight:600; text-decoration:none; }
.post-nav a:hover{ background:var(--cyan); border-color:var(--cyan); color:#fff; }
.post-nav .post-back{ background:#fff; color:var(--cyan-d); }

/* ── 15. 响应式 ───────────────────────────────────────────────────────── */
@media (max-width:1100px){
  .nav-bar li a{ padding:9px 11px; }
  .cat-grid{ grid-template-columns:repeat(3,1fr); }
  .provider-icon-grid, .tg-grid{ grid-template-columns:repeat(5,1fr); }
}
@media (max-width:900px){
  :root{ --nav-h:88px; }
  section{ padding-top:40px; padding-bottom:40px; padding-left:16px; padding-right:16px; }
  .st{ font-size:24px; }
  .ss{ font-size:14px; margin-bottom:22px; }
  .foot-top{ flex-direction:column; gap:26px; }
  .foot-cols{ gap:22px 30px; }

  /* 手机端卡片瘦身：一屏至少看得到两张卡，不让一张卡占满整个屏幕 */
  .feat-grid, .feat-grid.g2, .why-grid, .faq-grid, .pr-check, .promos-grid, .cat-grid{ grid-template-columns:repeat(2,1fr); gap:10px; }
  .fcard, .why-card{ padding:16px 13px; border-radius:10px; }
  .fi, .why-icon{ font-size:22px; margin-bottom:8px; }
  .fcard h3, .why-card h3{ font-size:14px; }
  .fcard p, .why-card p{ font-size:12px; line-height:1.6; }
  .faq-g{ padding:15px 13px; }
  .faq-g h3{ font-size:13.5px; }
  .faq-g p{ font-size:12px; line-height:1.6; }
  .pr-check{ gap:16px 10px; }
  .pr-c{ grid-template-columns:1fr; gap:6px; }
  .pr-c-ic{ width:20px; height:20px; font-size:11px; }
  .pr-c h3{ font-size:13.5px; }
  .pr-c p{ font-size:12px; line-height:1.6; }
  .cat-body{ padding:11px 10px 12px; }
  .cat-title{ font-size:15px; margin-bottom:5px; }
  .cat-desc{ font-size:11px; line-height:1.55; margin-bottom:10px; }
  .btn-read-more{ padding:7px 0; font-size:12px; }
  .p-header{ min-height:76px; padding:0 12px; }
  .p-emoji{ font-size:24px; }
  .p-amt{ font-size:24px; }
  .p-lbl{ font-size:8.5px; letter-spacing:.8px; }
  .promo-body, .p-body{ padding:12px 11px; }
  .promo-body h3, .p-body h3{ font-size:14px; line-height:1.25; margin-bottom:5px; }
  .promo-body p, .p-body p{ font-size:11.5px; line-height:1.55; margin-bottom:10px; }
  .p-btns{ flex-direction:column; gap:6px; }
  .p-btns > *{ padding:8px 6px; font-size:11.5px; }
  .btn-claim{ padding:7px 12px; font-size:11.5px; }
  .p-flag{ font-size:8.5px; padding:4px 8px; top:8px; left:8px; }
  .fc-tier{ padding:7px 9px; gap:6px; flex-wrap:wrap; }
  .fc-tier-in{ font-size:11px; } .fc-tier-out{ font-size:14px; }
  .steps-grid{ gap:12px; }
  .step-media{ border-radius:12px; margin-bottom:10px; }
  .step-card h3{ font-size:14px; } .step-card p{ font-size:12px; line-height:1.55; } .step-card a{ font-size:12px; }
  .step-n{ font-size:9.5px; letter-spacing:1.2px; }
  .bh-grid{ grid-template-columns:1fr; gap:10px; }
  .bh-card{ padding:15px 14px; }
  .bh-card h3{ font-size:15px; } .bh-card p{ font-size:12.5px; line-height:1.7; }
  .pg-head h2{ font-size:18px; gap:8px; }
  .pg-head p{ font-size:12.5px; }
  .promos-grid + .pg-head{ margin-top:28px; }
  .hero-intro{ padding-top:18px; padding-bottom:14px; }
  .hero-intro h1{ font-size:clamp(20px,5.6vw,28px); margin-bottom:6px; }
  .hero-intro p{ font-size:13px; line-height:1.6; }
  .eyebrow{ font-size:10.5px; margin-bottom:6px; }
  .pg-two, .seo-cols, .art-cols, .faq-split{ grid-template-columns:1fr; gap:22px; }
  .zz{ gap:10px; }
  .zz-row{ grid-template-columns:40% 1fr; border-radius:10px; }
  .zz-row:nth-child(even) .zz-media{ order:0; }
  .zz-media{ aspect-ratio:auto; min-height:100%; }
  .zz-body{ padding:12px; gap:9px; }
  .zz-n{ flex-basis:22px; width:22px; height:22px; font-size:11px; }
  .zz-body h3{ font-size:13.5px; margin-bottom:3px; }
  .zz-body p{ font-size:11.5px; line-height:1.55; }
  .pr-num{ gap:18px; }
  .pr-num-item{ grid-template-columns:40px 1fr; gap:12px; }
  .pr-num-n{ font-size:26px; }
  .provider-icon-grid{ grid-template-columns:repeat(4,1fr); gap:8px; }
  .tg-grid{ grid-template-columns:repeat(3,1fr); gap:8px; }
  .pvd-icon-name, .tg-name{ font-size:10.5px; }
  .lc-pvd-btn{ width:calc(50% - 7px); }
  .lc-game-card{ width:120px; }
  .dl-hero{ padding:36px 16px; }
  .dl-btn{ padding:14px 16px; }
  .dl-action{ font-size:19px; }
  .pg-btn-row{ flex-direction:column; align-items:stretch; }
  .pg-cta{ padding-top:40px; padding-bottom:44px; }
}
@media (max-width:600px){
  .nav-top{ padding:0 12px; }
  .nav-top > a img{ height:32px; }
  .nav-btns{ gap:6px; }
  .nav-btns a{ padding:7px 12px; font-size:12px; }
  .slider-arrow{ display:none; }
  .slider-dots{ bottom:6px; }
  .dot{ width:6px; height:6px; } .dot.active{ width:16px; }
  .fc-contact-row{ grid-template-columns:1fr; gap:9px; }
  .fc-modal{ padding:14px; }
  .fc-modal-box{ max-height:88vh; }
  .fc-modal-h{ padding:16px 18px 10px; } .fc-modal-h h3{ font-size:18px; }
  .fc-modal-b{ padding:12px 18px 4px; }
  .fc-modal-lead{ font-size:12.5px; margin-bottom:10px; }
  .fc-terms li{ font-size:12.5px; line-height:1.6; margin-bottom:7px; }
  .fc-modal-f{ padding:11px 18px 16px; }
  .fc-modal-f > *{ flex:1; }
  .util{ padding:6px 14px 34px; }
  .util-inner h2{ font-size:19px; margin-top:24px; }
  .util-inner p, .util-steps li, .util-list li{ font-size:13.5px; }
  .page-head h1{ font-size:25px; }
  .post-card{ padding:15px 16px; } .post-card h2{ font-size:18px; }
  .lb-title{ font-size:24px; }
  .btn-lb{ padding:12px 40px; }
}
/* 很窄的屏（小于 340px）才退回单栏，375px 的 iPhone SE 仍是两栏 */
@media (max-width:340px){
  .feat-grid, .feat-grid.g2, .why-grid, .faq-grid, .pr-check, .promos-grid, .cat-grid{ grid-template-columns:1fr; }
  .steps-grid{ grid-template-columns:1fr; }
}
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .lc-slider-track{ animation:none; }
  *{ transition:none !important; }
}

/* ── 合并时并进来的纯文字段落（download 的「装不上怎么办」、free-credit 的「真假优惠」）── */
.pg-prose{ max-width:820px; }
.pg-prose h3{ font-size:18px; margin-bottom:8px; }
.pg-prose p{ font-size:15px; color:var(--text); line-height:1.85; margin-bottom:12px; }
.pg-prose .util-list li, .pg-prose .util-steps li{ font-size:14.5px; color:var(--text); }
.pg-two .pg-prose{ max-width:none; }
@media (max-width:900px){
  .pg-prose p{ font-size:14px; }
  .pg-prose .util-list li, .pg-prose .util-steps li{ font-size:13.5px; }
}
.cat-desc a{ color:#fff; text-decoration:underline; text-underline-offset:2px; }


/* 客服弹窗：4 个按钮（Telegram 1/2、WhatsApp 1/2），手机上也保持两栏，一屏看得到全部 */
@media (max-width:600px){
  .fc-contact-row{ grid-template-columns:1fr 1fr; gap:8px; }
  .fc-contact{ padding:10px 11px; gap:9px; }
  .fc-contact-i{ font-size:19px; }
  .fc-contact b{ font-size:13.5px; }
  .fc-contact small{ font-size:11px; }
}

/* 标题区（hero-intro）下面紧接的那一段少留点空，让优惠卡更靠近首屏（promo 页是主要流量来源）*/
.hero-intro + section{ padding-top:28px; }
@media (max-width:900px){
  .hero-intro + section{ padding-top:18px; }
}
@media (max-width:600px){
  .nav-top{ height:50px; }
  .nav-bar li a{ padding:8px 11px; }
}