/* roulang page: index */
:root{
  --ink:#1a1f3d;
  --ink-2:#232a52;
  --ink-3:#2f3768;
  --gold:#ffb400;
  --gold-soft:#ffd873;
  --gold-deep:#c98d00;
  --bg:#f5f7fc;
  --surface:#ffffff;
  --surface-2:#eef1fa;
  --line:#e2e7f3;
  --text:#1c2140;
  --muted:#69719a;
  --radius:12px;
  --radius-lg:20px;
  --shadow-sm:0 2px 10px rgba(26,31,61,.06);
  --shadow:0 12px 32px rgba(26,31,61,.10);
  --shadow-lg:0 20px 50px rgba(26,31,61,.16);
}
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:16px;
  line-height:1.75;
  color:var(--text);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;height:auto;}
a{color:inherit;text-decoration:none;transition:color .2s ease,background .2s ease,transform .2s ease,box-shadow .2s ease;}
h1,h2,h3,h4{margin:0;line-height:1.32;font-weight:800;letter-spacing:-.01em;}
p{margin:0;}
ul,ol{margin:0;padding:0;list-style:none;}
button,input,select,textarea{font:inherit;color:inherit;}
:focus-visible{outline:3px solid rgba(255,180,0,.75);outline-offset:3px;border-radius:8px;}
.container{width:100%;max-width:1180px;margin:0 auto;padding-left:24px;padding-right:24px;}
.section{padding:78px 0;}
.section-alt{background:var(--surface);}
.section-head{max-width:760px;margin-bottom:46px;}
.section-head h2{margin-top:14px;font-size:clamp(23px,3vw,33px);color:var(--ink);}
.section-head p{margin-top:16px;font-size:16px;line-height:1.92;color:var(--muted);}
.kicker{display:inline-block;font-size:12.5px;font-weight:800;letter-spacing:.18em;color:var(--gold-deep);}

/* Header */
.site-header{position:sticky;top:0;z-index:80;background:var(--ink);box-shadow:0 8px 28px rgba(10,14,35,.28);}
.topbar{display:flex;align-items:center;gap:26px;height:76px;}
.brand{display:flex;align-items:center;gap:11px;flex-shrink:0;}
.brand-mark{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:18px;font-weight:900;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 6px 18px rgba(255,180,0,.38);}
.brand-text{font-size:17px;font-weight:800;color:#fff;letter-spacing:.02em;white-space:nowrap;}
.main-nav{display:flex;align-items:center;gap:2px;margin-left:6px;}
.main-nav a{padding:9px 15px;border-radius:9px;font-size:15px;font-weight:500;color:rgba(255,255,255,.72);white-space:nowrap;}
.main-nav a:hover{color:#fff;background:rgba(255,255,255,.09);}
.main-nav a.is-active{color:var(--gold);background:rgba(255,180,0,.13);font-weight:700;}
.notice-chip{margin-left:auto;display:inline-flex;align-items:center;gap:9px;padding:9px 20px;border-radius:999px;font-size:14px;font-weight:800;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 8px 20px rgba(255,180,0,.32);white-space:nowrap;}
.notice-chip:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(255,180,0,.42);}
.notice-dot{width:7px;height:7px;border-radius:50%;background:#1a1f3d;}
.subbar{background:rgba(255,255,255,.05);border-top:1px solid rgba(255,255,255,.09);}
.subbar-inner{display:flex;align-items:center;gap:14px;min-height:42px;font-size:13px;color:rgba(255,255,255,.68);}
.subbar-label{flex-shrink:0;padding:3px 11px;border-radius:6px;background:rgba(255,180,0,.18);color:var(--gold);font-size:12px;font-weight:800;letter-spacing:.08em;}
.ticker{display:flex;gap:30px;overflow-x:auto;white-space:nowrap;scrollbar-width:none;}
.ticker::-webkit-scrollbar{display:none;}
.ticker a{color:rgba(255,255,255,.68);}
.ticker a:hover{color:var(--gold);}

/* Hero */
.hero{position:relative;overflow:hidden;background:var(--ink);}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.44;}
.hero-veil{position:absolute;inset:0;background:linear-gradient(115deg,rgba(15,19,42,.96) 0%,rgba(26,31,61,.88) 55%,rgba(26,31,61,.56) 100%);}
.hero-inner{position:relative;z-index:2;padding-top:74px;padding-bottom:58px;}
.hero-eyebrow{display:inline-flex;align-items:center;gap:9px;padding:7px 16px;border-radius:999px;font-size:13px;font-weight:600;letter-spacing:.05em;color:var(--gold-soft);background:rgba(255,180,0,.14);border:1px solid rgba(255,180,0,.36);}
.eyebrow-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(255,180,0,.18);}
.hero-title{margin-top:24px;max-width:920px;font-size:clamp(27px,4.2vw,49px);line-height:1.24;color:#fff;letter-spacing:-.02em;}
.hero-lead{margin-top:22px;max-width:790px;font-size:16px;line-height:1.95;color:rgba(255,255,255,.79);}
.hero-actions{margin-top:34px;display:flex;flex-wrap:wrap;gap:14px;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 30px;border-radius:999px;border:1px solid transparent;font-size:15px;font-weight:700;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease;}
.btn-gold{background:linear-gradient(135deg,#ffcd4d,var(--gold));color:#1a1f3d;box-shadow:0 12px 28px rgba(255,180,0,.34);}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(255,180,0,.46);}
.btn-ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.26);}
.btn-ghost:hover{background:rgba(255,255,255,.17);transform:translateY(-2px);}
.btn-dark{background:var(--ink);color:#fff;box-shadow:0 12px 26px rgba(26,31,61,.24);}
.btn-dark:hover{background:var(--ink-2);transform:translateY(-2px);}
.hero-stats{margin-top:46px;display:flex;flex-wrap:wrap;gap:44px;}
.hero-stats strong{display:block;font-size:32px;font-weight:900;line-height:1.1;color:var(--gold);}
.hero-stats strong span{font-size:16px;margin-left:2px;}
.hero-stats em{display:block;margin-top:7px;font-style:normal;font-size:13px;color:rgba(255,255,255,.6);letter-spacing:.03em;}
.hero-series{position:relative;z-index:2;background:rgba(11,15,34,.75);border-top:1px solid rgba(255,255,255,.1);}
.series-inner{display:flex;align-items:center;gap:10px;padding-top:14px;padding-bottom:14px;overflow-x:auto;scrollbar-width:none;}
.series-inner::-webkit-scrollbar{display:none;}
.series-label{flex-shrink:0;font-size:12px;letter-spacing:.2em;color:rgba(255,255,255,.42);}
.series-inner a{flex-shrink:0;padding:7px 17px;border-radius:999px;font-size:14px;color:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.15);}
.series-inner a:hover{color:#1a1f3d;background:var(--gold);border-color:var(--gold);}

/* Snapshot */
.snapshot{background:var(--surface);border-bottom:1px solid var(--line);}
.snapshot-grid{display:grid;grid-template-columns:repeat(4,1fr);}
.snap{padding:30px 22px;text-align:center;border-right:1px solid var(--line);}
.snap:last-child{border-right:0;}
.snap-num{display:block;font-size:29px;font-weight:900;color:var(--ink);letter-spacing:-.02em;}
.snap-num i{font-style:normal;font-size:15px;color:var(--gold-deep);margin-left:2px;}
.snap-label{display:block;margin-top:8px;font-size:13px;color:var(--muted);}

/* Pain */
.pain-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.pain-card{position:relative;padding:30px 30px 28px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.pain-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(255,180,0,.5);}
.pain-num{position:absolute;top:22px;right:26px;font-size:34px;font-weight:900;line-height:1;color:var(--surface-2);}
.pain-card h3{font-size:18px;color:var(--ink);}
.pain-card p{margin-top:13px;max-width:90%;font-size:15px;line-height:1.85;color:var(--muted);}

/* Solution */
.solution-wrap{display:grid;grid-template-columns:.92fr 1.08fr;gap:56px;align-items:start;}
.solution-text p{font-size:15.5px;line-height:1.95;color:var(--muted);}
.solution-text p + p{margin-top:16px;}
.solution-note{margin-top:26px;padding:18px 22px;border-left:3px solid var(--gold);background:rgba(255,180,0,.09);border-radius:0 12px 12px 0;font-size:14.5px;line-height:1.85;color:var(--ink-2);}
.sol-list{display:grid;gap:16px;}
.sol-item{display:flex;gap:18px;padding:22px 24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease;}
.sol-item:hover{transform:translateX(5px);box-shadow:var(--shadow);}
.sol-idx{flex-shrink:0;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:15px;font-weight:900;color:var(--gold);background:linear-gradient(135deg,var(--ink),var(--ink-3));}
.sol-item h3{font-size:17px;color:var(--ink);}
.sol-item p{margin-top:8px;font-size:14.5px;line-height:1.8;color:var(--muted);}

/* Scenario */
.scenario-card{display:grid;grid-template-columns:1.02fr 1fr;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);}
.scenario-media{position:relative;min-height:400px;}
.scenario-media img{width:100%;height:100%;object-fit:cover;}
.media-tag{position:absolute;left:20px;top:20px;padding:7px 15px;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.08em;color:var(--gold);background:rgba(20,25,50,.85);}
.scenario-body{padding:44px 44px 40px;}
.scenario-body h3{font-size:21px;color:var(--ink);}
.scenario-body > p{margin-top:14px;font-size:15px;line-height:1.9;color:var(--muted);}
.node-list{margin-top:26px;display:grid;gap:16px;}
.node{display:flex;gap:16px;}
.node-time{flex-shrink:0;min-width:78px;font-size:12.5px;font-weight:800;letter-spacing:.06em;color:var(--gold-deep);padding-top:3px;}
.node h4{font-size:15.5px;color:var(--ink);}
.node p{margin-top:6px;font-size:14px;line-height:1.78;color:var(--muted);}

/* Channels */
.channel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.channel-card{display:block;overflow:hidden;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease;}
.channel-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);}
.channel-card img{width:100%;height:170px;object-fit:cover;}
.channel-body{padding:24px 24px 28px;}
.channel-body h3{font-size:18px;color:var(--ink);}
.channel-body p{margin-top:11px;font-size:14.5px;line-height:1.82;color:var(--muted);}
.channel-more{display:inline-flex;align-items:center;gap:6px;margin-top:18px;font-size:14px;font-weight:800;color:var(--gold-deep);}
.channel-card:hover .channel-more{color:var(--ink);}

/* Steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.step{padding:32px 28px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.step:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(255,180,0,.45);}
.step-no{font-size:12.5px;font-weight:800;letter-spacing:.2em;color:var(--gold-deep);}
.step h3{margin-top:12px;font-size:18px;color:var(--ink);}
.step p{margin-top:12px;font-size:14.5px;line-height:1.85;color:var(--muted);}

/* Voices */
.voice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.voice{padding:28px 26px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);}
.stars{font-size:14px;letter-spacing:3px;color:var(--gold);}
.voice p{margin-top:14px;font-size:15px;line-height:1.88;color:var(--text);}
.who{margin-top:20px;display:flex;align-items:center;gap:11px;}
.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:800;color:var(--ink);background:var(--surface-2);}
.who span{font-size:13.5px;color:var(--muted);}

/* News */
.news-wrap{display:grid;grid-template-columns:1.75fr 1fr;gap:32px;align-items:start;}
.news-list{display:grid;gap:16px;}
.news-item{display:block;padding:24px 28px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.news-item:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:rgba(255,180,0,.45);}
.news-meta{display:flex;flex-wrap:wrap;align-items:center;gap:12px;font-size:12.5px;color:var(--muted);}
.news-tag{padding:3px 11px;border-radius:999px;font-weight:800;color:var(--gold-deep);background:rgba(255,180,0,.15);}
.news-item h3{margin-top:11px;font-size:17.5px;line-height:1.5;color:var(--ink);}
.news-item p{margin-top:9px;font-size:14.5px;line-height:1.78;color:var(--muted);}
.news-side{padding:30px 28px;background:linear-gradient(160deg,var(--ink),#2a3163);border-radius:var(--radius);color:#fff;box-shadow:var(--shadow);}
.news-side h3{font-size:16.5px;color:var(--gold);}
.news-side > p{margin-top:12px;font-size:14px;line-height:1.8;color:rgba(255,255,255,.66);}
.side-list{margin-top:20px;display:grid;gap:15px;}
.side-list a{display:block;font-size:14.5px;line-height:1.68;color:rgba(255,255,255,.82);padding-left:14px;border-left:2px solid rgba(255,180,0,.4);}
.side-list a:hover{color:var(--gold);border-left-color:var(--gold);}
.empty-tip{padding:22px 26px;background:var(--surface);border:1px dashed var(--line);border-radius:var(--radius);font-size:14.5px;color:var(--muted);}

/* Plans */
.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch;}
.plan{display:flex;flex-direction:column;padding:34px 28px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease;}
.plan:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.plan-featured{border-color:var(--gold);box-shadow:0 20px 44px rgba(255,180,0,.18);}
.plan-badge{display:inline-block;align-self:flex-start;margin-bottom:14px;padding:4px 12px;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--gold-deep);background:rgba(255,180,0,.16);}
.plan h3{font-size:19px;color:var(--ink);}
.plan > p{margin-top:10px;font-size:14.5px;line-height:1.8;color:var(--muted);}
.plan ul{margin-top:20px;padding-top:20px;border-top:1px dashed var(--line);display:grid;gap:12px;font-size:14.5px;color:var(--text);}
.plan ul li{display:flex;gap:10px;line-height:1.7;}
.plan ul li::before{content:"✓";flex-shrink:0;color:var(--gold-deep);font-weight:900;}

/* Guarantee */
.guarantee{background:var(--ink);color:#fff;}
.guarantee .section-head h2{color:#fff;}
.guarantee .section-head p{color:rgba(255,255,255,.66);}
.guarantee .kicker{color:var(--gold);}
.gua-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.gua-item{display:flex;gap:15px;align-items:flex-start;padding:22px;border-radius:var(--radius);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);transition:background .25s ease,transform .25s ease;}
.gua-item:hover{background:rgba(255,255,255,.1);transform:translateY(-3px);}
.gua-icon{flex-shrink:0;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:15px;font-weight:900;color:var(--gold);background:rgba(255,180,0,.16);}
.gua-item h3{font-size:16px;color:#fff;}
.gua-item p{margin-top:7px;font-size:13.5px;line-height:1.75;color:rgba(255,255,255,.62);}

/* Topics */
.topic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.topic{padding:24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease;}
.topic:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.topic h3{font-size:16px;color:var(--ink);}
.topic p{margin-top:9px;font-size:14px;line-height:1.78;color:var(--muted);}

/* Changelog */
.log-list{margin-left:8px;padding-left:28px;border-left:2px solid var(--line);}
.log{position:relative;padding-bottom:30px;}
.log:last-child{padding-bottom:0;}
.log::before{content:"";position:absolute;left:-35px;top:7px;width:11px;height:11px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(255,180,0,.2);}
.log time{font-size:12.5px;font-weight:800;letter-spacing:.08em;color:var(--gold-deep);}
.log h3{margin-top:7px;font-size:16.5px;color:var(--ink);}
.log p{margin-top:7px;font-size:14.5px;line-height:1.82;color:var(--muted);}

/* CTA form */
.cta-section{position:relative;overflow:hidden;background:linear-gradient(150deg,#1a1f3d 0%,#2b3268 100%);color:#fff;}
.cta-wrap{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center;}
.cta-wrap h2{font-size:clamp(23px,3vw,32px);color:#fff;}
.cta-wrap > div > p{margin-top:18px;font-size:15.5px;line-height:1.92;color:rgba(255,255,255,.74);}
.cta-points{margin-top:26px;display:grid;gap:12px;font-size:14.5px;color:rgba(255,255,255,.82);}
.cta-points li{display:flex;gap:10px;align-items:flex-start;}
.cta-points li::before{content:"◆";flex-shrink:0;font-size:11px;color:var(--gold);margin-top:6px;}
.lead-form{padding:34px 32px;background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);}
.lead-form h3{font-size:18px;color:var(--ink);}
.lead-form > p{margin-top:8px;font-size:13.5px;color:var(--muted);line-height:1.7;}
.field{margin-top:16px;}
.field label{display:block;margin-bottom:8px;font-size:13px;font-weight:700;color:var(--ink);}
.field input,.field select{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#fbfcff;font-size:14.5px;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;}
.field input:focus,.field select:focus{border-color:var(--gold);background:#fff;box-shadow:0 0 0 4px rgba(255,180,0,.16);outline:none;}
.lead-form .btn{width:100%;margin-top:22px;}
.form-tip{margin-top:14px;min-height:20px;font-size:13.5px;color:#2b8f5e;}

/* Footer */
.site-footer{background:#11152c;color:rgba(255,255,255,.66);}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:38px;padding-top:64px;padding-bottom:46px;}
.footer-brand .brand-text{color:#fff;}
.footer-brand p{margin-top:18px;max-width:330px;font-size:14px;line-height:1.9;color:rgba(255,255,255,.58);}
.footer-col h4{margin-bottom:16px;font-size:14px;letter-spacing:.08em;color:#fff;}
.footer-col a,.footer-col p{display:block;font-size:14px;line-height:1.95;color:rgba(255,255,255,.6);}
.footer-col a:hover{color:var(--gold);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);}
.footer-bottom .container{display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;padding-top:20px;padding-bottom:20px;font-size:13px;color:rgba(255,255,255,.46);}

/* Responsive */
@media (max-width:1080px){
  .main-nav a{padding:8px 11px;font-size:14px;}
  .notice-chip{padding:8px 15px;font-size:13px;}
  .solution-wrap{gap:36px;}
  .scenario-body{padding:36px 32px;}
}
@media (max-width:960px){
  .topbar{height:auto;padding-top:13px;padding-bottom:13px;flex-wrap:wrap;row-gap:12px;gap:14px;}
  .main-nav{order:3;width:100%;margin-left:0;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;}
  .main-nav::-webkit-scrollbar{display:none;}
  .notice-chip{margin-left:auto;}
  .subbar-inner{min-height:40px;}
  .section{padding:60px 0;}
  .solution-wrap{grid-template-columns:1fr;gap:34px;}
  .news-wrap{grid-template-columns:1fr;}
  .channel-grid,.voice-grid,.topic-grid,.plan-grid,.gua-grid{grid-template-columns:repeat(2,1fr);}
  .scenario-card{grid-template-columns:1fr;}
  .scenario-media{min-height:270px;}
  .cta-wrap{grid-template-columns:1fr;gap:34px;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .snap{padding:24px 16px;}
  .snap-num{font-size:25px;}
}
@media (max-width:768px){
  .pain-grid{grid-template-columns:1fr;}
  .steps{grid-template-columns:1fr;}
  .hero-inner{padding-top:52px;padding-bottom:44px;}
  .hero-stats{gap:30px;}
  .hero-stats strong{font-size:27px;}
  .section-head{margin-bottom:32px;}
  .section{padding:52px 0;}
  .scenario-body{padding:28px 24px 30px;}
  .lead-form{padding:26px 22px;}
  .plan{padding:28px 24px;}
}
@media (max-width:560px){
  .container{padding-left:18px;padding-right:18px;}
  .series-inner{padding-left:18px;padding-right:18px;}
  .brand-text{font-size:15px;}
  .notice-chip{padding:7px 13px;font-size:12.5px;}
  .hero-title{font-size:26px;}
  .hero-lead{font-size:15px;}
  .hero-actions .btn{width:100%;}
  .channel-grid,.voice-grid,.topic-grid,.plan-grid,.gua-grid,.snapshot-grid{grid-template-columns:1fr;}
  .snap{border-right:0;border-bottom:1px solid var(--line);}
  .snap:last-child{border-bottom:0;}
  .footer-grid{grid-template-columns:1fr;gap:30px;padding-top:48px;}
  .pain-card p{max-width:100%;}
  .log-list{padding-left:22px;}
  .log::before{left:-29px;}
}

/* roulang page: category1 */
:root{
 --ink:#1a1f3d;
 --ink-2:#232a52;
 --ink-3:#2f3768;
 --gold:#ffb400;
 --gold-soft:#ffd873;
 --gold-deep:#c98d00;
 --bg:#f5f7fc;
 --surface:#ffffff;
 --surface-2:#eef1fa;
 --line:#e2e7f3;
 --text:#1c2140;
 --muted:#69719a;
 --radius:12px;
 --radius-lg:20px;
 --shadow-sm:0 2px 10px rgba(26,31,61,.06);
 --shadow:0 12px 32px rgba(26,31,61,.10);
 --shadow-lg:0 20px 50px rgba(26,31,61,.16);
}
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
 margin:0;
 font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
 font-size:16px;
 line-height:1.75;
 color:var(--text);
 background:var(--bg);
 -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,p,ul,ol,figure{margin:0;padding:0;}
ul,ol{list-style:none;}
img{display:block;max-width:100%;height:auto;}
a{color:inherit;text-decoration:none;transition:color .2s ease,background .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease;}
button,input,select,textarea{font:inherit;color:inherit;}
:focus-visible{outline:3px solid rgba(255,180,0,.75);outline-offset:3px;border-radius:6px;}
.container{width:100%;max-width:1180px;margin:0 auto;padding-left:24px;padding-right:24px;}
.section{padding:78px 0;}
.section-alt{background:var(--surface);}
.section-ink{background:var(--ink);color:#fff;}
.section-head{max-width:780px;margin-bottom:44px;}
.section-head h2{margin-top:14px;font-size:clamp(23px,3vw,33px);line-height:1.35;color:var(--ink);letter-spacing:-.01em;}
.section-head p{margin-top:16px;font-size:16px;line-height:1.92;color:var(--muted);}
.section-ink .section-head h2{color:#fff;}
.section-ink .section-head p{color:rgba(255,255,255,.72);}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:6px 15px;border-radius:999px;font-size:12.5px;font-weight:700;letter-spacing:.06em;color:var(--gold-deep);background:rgba(255,180,0,.14);border:1px solid rgba(255,180,0,.34);}
.section-ink .eyebrow{color:var(--gold-soft);}
/* Header */
.site-header{position:sticky;top:0;z-index:80;background:var(--ink);box-shadow:0 8px 28px rgba(10,14,35,.28);}
.topbar{display:flex;align-items:center;gap:26px;height:76px;}
.brand{display:flex;align-items:center;gap:11px;flex-shrink:0;}
.brand-mark{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:18px;font-weight:900;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 6px 18px rgba(255,180,0,.38);}
.brand-text{font-size:17px;font-weight:800;color:#fff;letter-spacing:.02em;white-space:nowrap;}
.main-nav{display:flex;align-items:center;gap:2px;margin-left:6px;}
.main-nav a{padding:9px 15px;border-radius:9px;font-size:15px;font-weight:500;color:rgba(255,255,255,.72);white-space:nowrap;}
.main-nav a:hover{color:#fff;background:rgba(255,255,255,.09);}
.main-nav a.is-active{color:var(--gold);background:rgba(255,180,0,.13);font-weight:700;}
.notice-chip{margin-left:auto;display:inline-flex;align-items:center;gap:9px;padding:9px 20px;border-radius:999px;font-size:14px;font-weight:800;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 8px 20px rgba(255,180,0,.32);white-space:nowrap;}
.notice-chip:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(255,180,0,.42);}
.notice-dot{width:7px;height:7px;border-radius:50%;background:#1a1f3d;}
.subbar{background:rgba(11,15,34,.82);border-top:1px solid rgba(255,255,255,.08);}
.subbar-inner{display:flex;align-items:center;gap:14px;height:42px;overflow:hidden;}
.subbar-label{flex-shrink:0;padding:2px 10px;border-radius:6px;font-size:12px;font-weight:800;letter-spacing:.08em;color:var(--ink);background:var(--gold);}
.ticker{display:flex;align-items:center;gap:30px;overflow-x:auto;scrollbar-width:none;font-size:13.5px;white-space:nowrap;}
.ticker::-webkit-scrollbar{display:none;}
.ticker a{color:rgba(255,255,255,.68);}
.ticker a:hover{color:var(--gold);}
/* Hero */
.hero{position:relative;overflow:hidden;background:var(--ink);}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.34;}
.hero-veil{position:absolute;inset:0;background:linear-gradient(118deg,rgba(13,17,38,.97) 0%,rgba(26,31,61,.9) 52%,rgba(35,42,82,.7) 100%);}
.hero-inner{position:relative;z-index:2;padding-top:34px;padding-bottom:66px;}
.crumb{display:flex;align-items:center;gap:9px;font-size:13.5px;color:rgba(255,255,255,.58);}
.crumb a:hover{color:var(--gold);}
.crumb span{opacity:.5;}
.hero-head{max-width:840px;margin:38px auto 0;text-align:center;}
.hero-eyebrow{display:inline-flex;align-items:center;gap:9px;padding:7px 17px;border-radius:999px;font-size:13px;font-weight:600;letter-spacing:.05em;color:var(--gold-soft);background:rgba(255,180,0,.14);border:1px solid rgba(255,180,0,.36);}
.eyebrow-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(255,180,0,.18);}
.hero-title{margin-top:22px;font-size:clamp(26px,3.9vw,44px);line-height:1.28;color:#fff;letter-spacing:-.02em;}
.hero-title em{font-style:normal;color:var(--gold);}
.hero-lead{margin:20px auto 0;max-width:720px;font-size:15.6px;line-height:1.95;color:rgba(255,255,255,.78);}
.hero-actions{margin-top:30px;display:flex;flex-wrap:wrap;gap:13px;justify-content:center;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 30px;border-radius:999px;border:1px solid transparent;font-size:15px;font-weight:700;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease;}
.btn-gold{background:linear-gradient(135deg,#ffcd4d,var(--gold));color:#1a1f3d;box-shadow:0 12px 28px rgba(255,180,0,.34);}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(255,180,0,.46);}
.btn-ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.26);}
.btn-ghost:hover{background:rgba(255,255,255,.17);transform:translateY(-2px);}
.btn-dark{background:var(--ink);color:#fff;box-shadow:0 12px 26px rgba(26,31,61,.24);}
.btn-dark:hover{background:var(--ink-2);transform:translateY(-2px);}
.btn-line{background:transparent;color:var(--ink);border-color:rgba(26,31,61,.22);}
.btn-line:hover{background:var(--surface-2);transform:translateY(-2px);}
/* Hero stage */
.stage-grid{margin-top:52px;display:grid;grid-template-columns:1fr 1.42fr 1fr;gap:24px;align-items:center;}
.stage-media{position:relative;border-radius:var(--radius-lg);overflow:hidden;border:1px solid rgba(255,255,255,.16);box-shadow:0 26px 60px rgba(6,9,24,.6);background:#0e1229;}
.stage-media img{width:100%;aspect-ratio:16/10;object-fit:cover;}
.stage-tag{position:absolute;left:14px;bottom:14px;padding:6px 14px;border-radius:999px;font-size:12.5px;font-weight:800;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 8px 18px rgba(0,0,0,.35);}
.value-list{display:grid;gap:16px;}
.value-item{padding:18px 20px;border-radius:var(--radius);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.13);transition:background .25s ease,transform .25s ease,border-color .25s ease;}
.value-item:hover{background:rgba(255,255,255,.11);border-color:rgba(255,180,0,.45);transform:translateY(-3px);}
.value-item h3{font-size:15px;font-weight:800;color:var(--gold-soft);}
.value-item p{margin-top:8px;font-size:13.6px;line-height:1.8;color:rgba(255,255,255,.72);}
/* Snapshot */
.snapshot{background:rgba(11,15,34,.72);border-top:1px solid rgba(255,255,255,.1);position:relative;z-index:2;}
.snapshot-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;}
.snapshot-item{padding:26px 22px;border-left:1px solid rgba(255,255,255,.09);}
.snapshot-item:first-child{border-left:0;padding-left:0;}
.snapshot-item strong{display:block;font-size:30px;font-weight:900;line-height:1.1;color:var(--gold);}
.snapshot-item strong span{font-size:14px;margin-left:3px;font-weight:700;}
.snapshot-item em{display:block;margin-top:8px;font-style:normal;font-size:13px;color:rgba(255,255,255,.62);letter-spacing:.02em;}
/* Pain */
.pain-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.pain-card{padding:30px 28px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.pain-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(255,180,0,.5);}
.pain-index{display:inline-block;font-size:12.5px;font-weight:800;letter-spacing:.08em;color:var(--gold-deep);background:rgba(255,180,0,.14);padding:3px 11px;border-radius:6px;}
.pain-card h3{margin-top:16px;font-size:18px;line-height:1.5;color:var(--ink);}
.pain-card p{margin-top:12px;font-size:14.6px;line-height:1.88;color:var(--muted);}
/* Timeline */
.timeline{position:relative;display:grid;gap:18px;}
.timeline::before{content:"";position:absolute;left:26px;top:14px;bottom:14px;width:2px;background:linear-gradient(180deg,rgba(255,180,0,.85),rgba(255,180,0,.12));}
.tl-item{position:relative;display:grid;grid-template-columns:54px 1fr;gap:22px;align-items:start;}
.tl-index{position:relative;z-index:2;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;font-size:15px;font-weight:900;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 9px 22px rgba(255,180,0,.34);}
.tl-body{padding:22px 26px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:box-shadow .25s ease,transform .25s ease;}
.tl-body:hover{box-shadow:var(--shadow);transform:translateX(4px);}
.tl-body h3{font-size:17.5px;color:var(--ink);display:flex;flex-wrap:wrap;align-items:center;gap:10px;}
.tl-body h3 span{font-size:12.5px;font-weight:700;color:var(--gold-deep);background:rgba(255,180,0,.13);padding:3px 10px;border-radius:6px;}
.tl-body p{margin-top:10px;font-size:14.6px;line-height:1.88;color:var(--muted);}
/* Judge */
.judge-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:44px;align-items:center;}
.judge-media{border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);background:var(--surface);}
.judge-media img{width:100%;aspect-ratio:4/3;object-fit:cover;}
.check-list{display:grid;gap:14px;margin-top:26px;}
.check-item{display:grid;grid-template-columns:30px 1fr;gap:14px;padding:18px 20px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:border-color .25s ease,transform .25s ease;}
.check-item:hover{border-color:rgba(255,180,0,.55);transform:translateX(4px);}
.check-dot{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:13px;font-weight:900;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));}
.check-item h3{font-size:16px;color:var(--ink);}
.check-item p{margin-top:7px;font-size:14.2px;line-height:1.82;color:var(--muted);}
/* Tiers */
.tier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.tier-card{padding:28px 26px 26px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;transition:transform .25s ease,box-shadow .25s ease;}
.tier-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.tier-card.is-key{border-color:rgba(255,180,0,.6);box-shadow:0 14px 34px rgba(255,180,0,.16);}
.tier-badge{align-self:flex-start;padding:4px 12px;border-radius:999px;font-size:12.5px;font-weight:800;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));}
.tier-badge.alt{color:var(--ink);background:var(--surface-2);}
.tier-card h3{margin-top:16px;font-size:18.5px;color:var(--ink);}
.tier-card p{margin-top:12px;font-size:14.5px;line-height:1.88;color:var(--muted);}
.tier-list{margin-top:18px;display:grid;gap:9px;padding-top:16px;border-top:1px dashed var(--line);}
.tier-list li{position:relative;padding-left:18px;font-size:14px;color:var(--text);line-height:1.8;}
.tier-list li::before{content:"";position:absolute;left:0;top:11px;width:7px;height:7px;border-radius:2px;background:var(--gold);}
/* Audience */
.audience-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.audience-card{display:grid;grid-template-columns:56px 1fr;gap:18px;padding:26px 26px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease;}
.audience-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.audience-icon{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;font-size:22px;background:rgba(255,180,0,.14);border:1px solid rgba(255,180,0,.35);}
.audience-card h3{font-size:17px;color:var(--ink);}
.audience-card p{margin-top:9px;font-size:14.4px;line-height:1.85;color:var(--muted);}
/* Notes */
.note-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.note-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.note-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:rgba(255,180,0,.45);}
.note-media{position:relative;overflow:hidden;background:#0e1229;}
.note-media img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .5s ease;}
.note-card:hover .note-media img{transform:scale(1.06);}
.note-stage{position:absolute;left:14px;top:14px;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:800;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));}
.note-body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:10px;}
.note-body h3{font-size:16.5px;line-height:1.55;color:var(--ink);}
.note-body p{font-size:14.2px;line-height:1.85;color:var(--muted);}
.note-meta{margin-top:auto;padding-top:12px;font-size:12.8px;color:var(--gold-deep);font-weight:700;letter-spacing:.02em;}
/* FAQ */
.faq{display:grid;gap:14px;max-width:900px;}
.faq-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden;transition:border-color .25s ease,box-shadow .25s ease;}
.faq-item[open]{border-color:rgba(255,180,0,.55);box-shadow:var(--shadow);}
.faq-item summary{cursor:pointer;list-style:none;padding:20px 56px 20px 24px;position:relative;font-size:16.5px;font-weight:700;color:var(--ink);line-height:1.6;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+";position:absolute;right:22px;top:50%;transform:translateY(-50%);width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:17px;font-weight:800;color:#1a1f3d;background:rgba(255,180,0,.24);transition:background .2s ease,transform .2s ease;}
.faq-item[open] summary::after{content:"−";background:var(--gold);}
.faq-item summary:hover{color:var(--gold-deep);}
.faq-body{padding:0 24px 22px;font-size:14.8px;line-height:1.92;color:var(--muted);}
/* CTA */
.cta-band{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--ink) 0%,var(--ink-3) 100%);border-radius:var(--radius-lg);padding:52px 48px;display:grid;grid-template-columns:1.4fr auto;gap:32px;align-items:center;box-shadow:var(--shadow-lg);}
.cta-band::after{content:"";position:absolute;right:-70px;top:-70px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(255,180,0,.32),transparent 68%);}
.cta-band h2{position:relative;z-index:2;font-size:clamp(21px,2.6vw,29px);line-height:1.4;color:#fff;}
.cta-band p{position:relative;z-index:2;margin-top:14px;max-width:600px;font-size:15px;line-height:1.9;color:rgba(255,255,255,.76);}
.cta-actions{position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:12px;}
/* Footer */
.site-footer{background:var(--ink);color:rgba(255,255,255,.72);padding-top:62px;}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.1fr;gap:38px;padding-bottom:46px;}
.footer-brand .brand{margin-bottom:18px;}
.footer-brand p{font-size:14.2px;line-height:1.9;color:rgba(255,255,255,.6);max-width:340px;}
.footer-col h4{font-size:15px;font-weight:800;color:#fff;margin-bottom:16px;}
.footer-col a,.footer-col p{display:block;font-size:14px;line-height:1.9;color:rgba(255,255,255,.62);margin-bottom:9px;word-break:break-word;}
.footer-col a:hover{color:var(--gold);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding:20px 0;}
.footer-bottom .container{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;font-size:13px;color:rgba(255,255,255,.5);}
/* Responsive */
@media (max-width:1024px){
 .stage-grid{grid-template-columns:1fr;gap:20px;}
 .stage-media{order:-1;}
 .value-list{grid-template-columns:repeat(2,1fr);}
 .judge-grid{grid-template-columns:1fr;gap:30px;}
 .footer-grid{grid-template-columns:1fr 1fr;gap:30px;}
 .cta-band{grid-template-columns:1fr;padding:42px 34px;}
 .note-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:860px){
 .topbar{height:auto;flex-wrap:wrap;padding-top:14px;padding-bottom:12px;gap:12px;}
 .main-nav{order:3;width:100%;overflow-x:auto;scrollbar-width:none;margin-left:0;gap:4px;}
 .main-nav::-webkit-scrollbar{display:none;}
 .notice-chip{margin-left:auto;}
 .snapshot-grid{grid-template-columns:repeat(2,1fr);}
 .snapshot-item{border-left:0;padding-left:0;padding-right:0;}
 .snapshot-item:nth-child(even){padding-left:20px;border-left:1px solid rgba(255,255,255,.09);}
 .pain-grid{grid-template-columns:1fr;}
 .tier-grid{grid-template-columns:1fr;}
 .audience-grid{grid-template-columns:1fr;}
 .section{padding:58px 0;}
}
@media (max-width:768px){
 .note-grid{grid-template-columns:1fr;}
 .footer-grid{grid-template-columns:1fr;}
 .hero-lead{font-size:15px;}
 .value-list{grid-template-columns:1fr;}
 .crumb{font-size:12.5px;}
 .ticker{gap:20px;font-size:12.5px;}
 .subbar-inner{height:40px;}
}
@media (max-width:520px){
 .container{padding-left:16px;padding-right:16px;}
 .brand-text{font-size:15px;}
 .brand-mark{width:34px;height:34px;font-size:16px;}
 .hero-title{font-size:clamp(23px,6.4vw,30px);}
 .hero-actions .btn{width:100%;}
 .tl-item{grid-template-columns:44px 1fr;gap:14px;}
 .tl-index{width:44px;height:44px;font-size:13.5px;}
 .timeline::before{left:21px;}
 .tl-body{padding:18px 18px;}
 .faq-item summary{font-size:15.4px;padding:17px 50px 17px 18px;}
 .faq-body{padding:0 18px 18px;font-size:14.2px;}
 .cta-band{padding:34px 22px;}
 .cta-actions .btn{width:100%;}
 .snapshot-item strong{font-size:25px;}
 .section{padding:48px 0;}
}

/* roulang page: article */
:root{
  --ink:#1a1f3d;
  --ink-2:#232a52;
  --ink-3:#2f3768;
  --gold:#ffb400;
  --gold-soft:#ffd873;
  --gold-deep:#c98d00;
  --bg:#f5f7fc;
  --surface:#ffffff;
  --surface-2:#eef1fa;
  --line:#e2e7f3;
  --text:#1c2140;
  --muted:#69719a;
  --radius:12px;
  --radius-lg:20px;
  --shadow-sm:0 2px 10px rgba(26,31,61,.06);
  --shadow:0 12px 32px rgba(26,31,61,.10);
  --shadow-lg:0 20px 50px rgba(26,31,61,.16);
}
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:16px;
  line-height:1.75;
  color:var(--text);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;height:auto;}
a{color:inherit;text-decoration:none;transition:color .2s ease,background .2s ease,transform .2s ease,box-shadow .2s ease,border-color .2s ease;}
button,input,select,textarea{font:inherit;color:inherit;}
h1,h2,h3,h4{margin:0;line-height:1.35;font-weight:800;}
p{margin:0;}
ul,ol{margin:0;padding:0;}
:focus-visible{outline:3px solid rgba(255,180,0,.65);outline-offset:3px;border-radius:6px;}
.container{width:100%;max-width:1180px;margin:0 auto;padding-left:24px;padding-right:24px;}
.section{padding:78px 0;}
.section-alt{background:var(--surface);}
.section-head{max-width:780px;margin-bottom:44px;}
.section-head h2{margin-top:14px;font-size:clamp(23px,3vw,33px);color:var(--ink);}
.section-head p{margin-top:16px;font-size:16px;line-height:1.92;color:var(--muted);}
.eyebrow{display:inline-flex;align-items:center;gap:9px;padding:6px 15px;border-radius:999px;font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--gold-deep);background:rgba(255,180,0,.14);border:1px solid rgba(255,180,0,.32);}
.eyebrow-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(255,180,0,.18);}

/* Header */
.site-header{position:sticky;top:0;z-index:80;background:var(--ink);box-shadow:0 8px 28px rgba(10,14,35,.28);}
.topbar{display:flex;align-items:center;gap:26px;height:76px;}
.brand{display:flex;align-items:center;gap:11px;flex-shrink:0;}
.brand-mark{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:18px;font-weight:900;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 6px 18px rgba(255,180,0,.38);}
.brand-text{font-size:17px;font-weight:800;color:#fff;letter-spacing:.02em;white-space:nowrap;}
.main-nav{display:flex;align-items:center;gap:2px;margin-left:6px;}
.main-nav a{padding:9px 15px;border-radius:9px;font-size:15px;font-weight:500;color:rgba(255,255,255,.72);white-space:nowrap;}
.main-nav a:hover{color:#fff;background:rgba(255,255,255,.09);}
.main-nav a.is-active{color:var(--gold);background:rgba(255,180,0,.13);font-weight:700;}
.notice-chip{margin-left:auto;display:inline-flex;align-items:center;gap:9px;padding:9px 20px;border-radius:999px;font-size:14px;font-weight:800;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 8px 20px rgba(255,180,0,.32);white-space:nowrap;}
.notice-chip:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(255,180,0,.42);}
.notice-dot{width:7px;height:7px;border-radius:50%;background:#1a1f3d;opacity:.75;}
.subbar{background:rgba(255,255,255,.045);border-top:1px solid rgba(255,255,255,.08);}
.subbar-inner{display:flex;align-items:center;gap:14px;height:44px;overflow:hidden;}
.subbar-label{flex-shrink:0;padding:3px 10px;border-radius:6px;font-size:12px;font-weight:800;color:#1a1f3d;background:var(--gold);letter-spacing:.06em;}
.ticker{display:flex;gap:28px;overflow-x:auto;font-size:13.5px;scrollbar-width:none;}
.ticker::-webkit-scrollbar{display:none;}
.ticker a{color:rgba(255,255,255,.68);white-space:nowrap;}
.ticker a:hover{color:var(--gold);}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 30px;border-radius:999px;border:1px solid transparent;font-size:15px;font-weight:700;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease;}
.btn-gold{background:linear-gradient(135deg,#ffcd4d,var(--gold));color:#1a1f3d;box-shadow:0 12px 28px rgba(255,180,0,.34);}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(255,180,0,.46);}
.btn-ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.26);}
.btn-ghost:hover{background:rgba(255,255,255,.17);transform:translateY(-2px);}
.btn-dark{background:var(--ink);color:#fff;box-shadow:0 12px 26px rgba(26,31,61,.24);}
.btn-dark:hover{background:var(--ink-2);transform:translateY(-2px);}
.btn-line{background:var(--surface);color:var(--ink);border-color:var(--line);box-shadow:var(--shadow-sm);}
.btn-line:hover{border-color:rgba(255,180,0,.6);transform:translateY(-2px);}

/* Article hero */
.article-hero{position:relative;overflow:hidden;background:var(--ink);}
.article-hero .hero-bg{position:absolute;inset:0;background-image:url('/assets/images/快乐之都牛牛游戏.webp');background-size:cover;background-position:center;opacity:.34;}
.article-hero .hero-veil{position:absolute;inset:0;background:linear-gradient(118deg,rgba(14,18,40,.97) 0%,rgba(26,31,61,.9) 58%,rgba(26,31,61,.6) 100%);}
.article-hero .hero-inner{position:relative;z-index:2;padding:40px 0 62px;}
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13.5px;color:rgba(255,255,255,.55);}
.breadcrumb a{color:rgba(255,255,255,.76);}
.breadcrumb a:hover{color:var(--gold);}
.breadcrumb span{color:rgba(255,255,255,.35);}
.kicker{margin-top:24px;display:inline-flex;align-items:center;gap:9px;padding:6px 16px;border-radius:999px;font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--gold-soft);background:rgba(255,180,0,.14);border:1px solid rgba(255,180,0,.36);}
.article-title{margin-top:20px;max-width:920px;font-size:clamp(25px,3.8vw,43px);line-height:1.26;color:#fff;letter-spacing:-.015em;}
.article-lead{margin-top:20px;max-width:830px;font-size:15.5px;line-height:1.95;color:rgba(255,255,255,.79);}
.meta-row{margin-top:28px;display:flex;flex-wrap:wrap;gap:11px;}
.meta-item{display:inline-flex;align-items:center;gap:7px;padding:6px 15px;border-radius:999px;font-size:13px;color:rgba(255,255,255,.8);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);}
.meta-item b{font-weight:800;color:var(--gold);}

/* Snapshot */
.snapshot{position:relative;z-index:3;margin-top:-38px;}
.snap-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.snap-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px 22px;}
.snap-item strong{display:block;font-size:26px;font-weight:900;line-height:1.15;color:var(--ink);}
.snap-item strong em{font-style:normal;font-size:14px;font-weight:700;color:var(--muted);margin-left:3px;}
.snap-item span{display:block;margin-top:7px;font-size:13px;color:var(--muted);}

/* Article body */
.article-wrap{padding:44px 0 78px;}
.article-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:40px 46px;}
.article-cover{margin-bottom:32px;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);position:relative;}
.article-cover img{width:100%;object-fit:cover;aspect-ratio:16/8;}
.article-cover figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 22px 16px;font-size:13px;color:#fff;background:linear-gradient(180deg,rgba(15,19,42,0),rgba(15,19,42,.82));}
.article-body{font-size:16.5px;line-height:1.98;color:#2b3159;}
.article-body h2{margin:38px 0 16px;font-size:clamp(20px,2.4vw,26px);color:var(--ink);padding-left:16px;border-left:5px solid var(--gold);border-radius:2px;}
.article-body h3{margin:28px 0 12px;font-size:19px;color:var(--ink-2);}
.article-body h4{margin:22px 0 10px;font-size:17px;color:var(--ink-2);}
.article-body p{margin:15px 0;}
.article-body ul,.article-body ol{margin:16px 0;padding-left:22px;}
.article-body li{margin:9px 0;}
.article-body ul li::marker{color:var(--gold);}
.article-body ol li::marker{color:var(--gold-deep);font-weight:800;}
.article-body strong{color:var(--ink);font-weight:800;}
.article-body a{color:var(--gold-deep);border-bottom:1px solid rgba(201,141,0,.35);}
.article-body a:hover{color:var(--ink);border-bottom-color:var(--ink);}
.article-body blockquote{margin:24px 0;padding:18px 24px;background:var(--surface-2);border-left:4px solid var(--gold);border-radius:0 var(--radius) var(--radius) 0;color:var(--ink-2);font-size:15.5px;}
.article-body img{border-radius:var(--radius);margin:22px 0;border:1px solid var(--line);}
.article-body table{width:100%;border-collapse:collapse;margin:22px 0;font-size:15px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.article-body th,.article-body td{padding:12px 16px;border-bottom:1px solid var(--line);text-align:left;}
.article-body th{background:var(--surface-2);color:var(--ink);font-weight:800;}
.article-body tr:last-child td{border-bottom:0;}
.article-body hr{margin:32px 0;border:0;border-top:1px solid var(--line);}
.article-tags{margin-top:34px;padding-top:24px;border-top:1px dashed var(--line);display:flex;flex-wrap:wrap;gap:10px;align-items:center;}
.tag{display:inline-flex;align-items:center;padding:6px 14px;border-radius:999px;font-size:13px;font-weight:600;color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line);transition:background .2s ease,color .2s ease,border-color .2s ease;}
.tag:hover{background:rgba(255,180,0,.16);border-color:rgba(255,180,0,.45);color:var(--gold-deep);}
.empty-state{padding:52px 0;text-align:center;}
.empty-state h2{font-size:24px;color:var(--ink);}
.empty-state p{margin-top:14px;color:var(--muted);font-size:15.5px;}
.empty-state .btn{margin-top:26px;}

/* Node cards */
.node-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.node-card{position:relative;padding:28px 26px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.node-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(255,180,0,.5);}
.node-step{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;font-size:15px;font-weight:900;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 6px 16px rgba(255,180,0,.3);}
.node-card h3{margin-top:16px;font-size:18px;color:var(--ink);}
.node-card p{margin-top:12px;font-size:15px;line-height:1.85;color:var(--muted);}
.node-note{margin-top:14px;display:inline-flex;padding:4px 12px;border-radius:999px;font-size:12.5px;font-weight:700;color:var(--gold-deep);background:rgba(255,180,0,.14);}

/* Metric band */
.metric-band{background:linear-gradient(135deg,var(--ink) 0%,var(--ink-3) 100%);color:#fff;position:relative;overflow:hidden;}
.metric-band::after{content:"";position:absolute;right:-120px;top:-120px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(255,180,0,.24),transparent 70%);}
.metric-inner{position:relative;z-index:2;}
.metric-head h2{color:#fff;font-size:clamp(22px,2.8vw,30px);}
.metric-head p{margin-top:14px;max-width:720px;color:rgba(255,255,255,.72);font-size:15.5px;line-height:1.9;}
.metric-grid{margin-top:38px;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.metric{padding:22px 0 0;border-top:1px solid rgba(255,255,255,.16);}
.metric strong{display:block;font-size:34px;font-weight:900;line-height:1.1;color:var(--gold);}
.metric strong span{font-size:16px;font-weight:700;margin-left:2px;}
.metric em{display:block;margin-top:9px;font-style:normal;font-size:13.5px;color:rgba(255,255,255,.66);letter-spacing:.02em;}

/* Related list */
.read-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
.read-card{display:flex;gap:18px;padding:24px 26px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.read-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:rgba(255,180,0,.5);}
.read-index{flex-shrink:0;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:15px;font-weight:900;color:var(--gold-deep);background:rgba(255,180,0,.14);border:1px solid rgba(255,180,0,.28);}
.read-card h3{font-size:16.5px;color:var(--ink);line-height:1.55;}
.read-card p{margin-top:9px;font-size:14px;line-height:1.8;color:var(--muted);}
.read-card .read-more{margin-top:12px;display:inline-block;font-size:13.5px;font-weight:700;color:var(--gold-deep);}
.read-card:hover .read-more{color:var(--ink);}

/* FAQ */
.faq-list{display:grid;gap:14px;max-width:920px;}
.faq-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease;}
.faq-item[open]{border-color:rgba(255,180,0,.5);box-shadow:var(--shadow);}
.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 26px;font-size:16.5px;font-weight:800;color:var(--ink);cursor:pointer;list-style:none;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+";flex-shrink:0;font-size:21px;font-weight:800;line-height:1;color:var(--gold);}
.faq-item[open] summary::after{content:"−";}
.faq-item p{padding:0 26px 22px;font-size:15px;line-height:1.88;color:var(--muted);}

/* CTA band */
.cta-band{padding:0 0 84px;}
.cta-inner{position:relative;overflow:hidden;display:flex;flex-wrap:wrap;align-items:center;gap:32px;padding:44px 48px;border-radius:var(--radius-lg);background:linear-gradient(120deg,var(--ink) 0%,var(--ink-3) 100%);box-shadow:var(--shadow-lg);}
.cta-inner::after{content:"";position:absolute;right:-80px;bottom:-140px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(255,180,0,.3),transparent 68%);}
.cta-text{position:relative;z-index:2;flex:1 1 420px;}
.cta-text h2{font-size:clamp(21px,2.6vw,28px);color:#fff;}
.cta-text p{margin-top:14px;font-size:15px;line-height:1.9;color:rgba(255,255,255,.75);max-width:620px;}
.cta-actions{position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:12px;}

/* Footer */
.site-footer{background:var(--ink);color:rgba(255,255,255,.72);padding-top:62px;}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:38px;padding-bottom:46px;}
.footer-brand .brand{margin-bottom:18px;}
.footer-brand p{font-size:14.5px;line-height:1.9;color:rgba(255,255,255,.6);max-width:330px;}
.footer-col h4{margin-bottom:16px;font-size:15px;color:#fff;letter-spacing:.03em;}
.footer-col a,.footer-col p{display:block;margin-bottom:11px;font-size:14.5px;color:rgba(255,255,255,.62);line-height:1.75;}
.footer-col a:hover{color:var(--gold);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:20px 0;}
.footer-bottom .container{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:13.5px;color:rgba(255,255,255,.45);}

/* Responsive */
@media (max-width:1024px){
  .snap-grid{grid-template-columns:repeat(2,1fr);}
  .node-grid{grid-template-columns:repeat(2,1fr);}
  .metric-grid{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr 1fr;gap:30px;}
  .article-card{padding:32px 30px;}
}
@media (max-width:900px){
  .topbar{flex-wrap:wrap;height:auto;padding:14px 0;gap:12px;}
  .main-nav{order:3;width:100%;margin-left:0;overflow-x:auto;padding-bottom:4px;}
  .notice-chip{margin-left:auto;}
  .subbar-inner{height:auto;padding:9px 0;}
}
@media (max-width:768px){
  .container{padding-left:18px;padding-right:18px;}
  .section{padding:56px 0;}
  .article-hero .hero-inner{padding:28px 0 58px;}
  .article-title{font-size:clamp(22px,6vw,30px);}
  .article-lead{font-size:15px;}
  .snap-grid{grid-template-columns:1fr 1fr;gap:10px;}
  .snap-item{padding:16px 16px;}
  .snap-item strong{font-size:22px;}
  .article-card{padding:26px 20px;}
  .article-body{font-size:15.5px;}
  .node-grid{grid-template-columns:1fr;}
  .read-grid{grid-template-columns:1fr;}
  .cta-inner{padding:32px 24px;}
  .footer-grid{grid-template-columns:1fr;gap:26px;}
  .brand-text{font-size:15.5px;}
}
@media (max-width:520px){
  .snap-grid{grid-template-columns:1fr;}
  .metric-grid{grid-template-columns:1fr;gap:18px;}
  .article-card{padding:22px 16px;}
  .article-body h2{font-size:19px;}
  .btn{width:100%;}
  .cta-actions{width:100%;}
  .notice-chip{display:none;}
  .faq-item summary{padding:16px 18px;font-size:15.5px;}
  .faq-item p{padding:0 18px 18px;}
  .footer-bottom .container{justify-content:flex-start;}
}

/* roulang page: category2 */
:root{
 --ink:#1a1f3d;
 --ink-2:#232a52;
 --ink-3:#2f3768;
 --gold:#ffb400;
 --gold-soft:#ffd873;
 --gold-deep:#c98d00;
 --bg:#f5f7fc;
 --surface:#ffffff;
 --surface-2:#eef1fa;
 --line:#e2e7f3;
 --text:#1c2140;
 --muted:#69719a;
 --radius:12px;
 --radius-lg:20px;
 --shadow-sm:0 2px 10px rgba(26,31,61,.06);
 --shadow:0 12px 32px rgba(26,31,61,.10);
 --shadow-lg:0 20px 50px rgba(26,31,61,.16);
}
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
 margin:0;
 font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
 font-size:16px;
 line-height:1.75;
 color:var(--text);
 background:var(--bg);
 -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;height:auto;}
a{color:inherit;text-decoration:none;transition:color .2s ease,background .2s ease,transform .2s ease,box-shadow .2s ease,border-color .2s ease;}
p{margin:0;}
h1,h2,h3,h4{margin:0;line-height:1.35;font-weight:800;letter-spacing:-.01em;}
ul{margin:0;padding:0;list-style:none;}
button,input,select,textarea{font:inherit;color:inherit;}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px;}
.container{width:100%;max-width:1180px;margin:0 auto;padding-left:24px;padding-right:24px;}
.section{padding:78px 0;}
.section-alt{background:var(--surface);}
.section-head{max-width:780px;margin-bottom:44px;}
.section-head h2{margin-top:14px;font-size:clamp(23px,3vw,33px);color:var(--ink);}
.section-head p{margin-top:16px;font-size:16px;line-height:1.92;color:var(--muted);}
.eyebrow{display:inline-flex;align-items:center;gap:9px;padding:6px 15px;border-radius:999px;font-size:13px;font-weight:700;letter-spacing:.05em;color:var(--gold-deep);background:rgba(255,180,0,.14);border:1px solid rgba(255,180,0,.32);}
.eyebrow-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(255,180,0,.18);}
/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:80;background:var(--ink);box-shadow:0 8px 28px rgba(10,14,35,.28);}
.topbar{display:flex;align-items:center;gap:26px;height:76px;}
.brand{display:flex;align-items:center;gap:11px;flex-shrink:0;}
.brand-mark{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:18px;font-weight:900;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 6px 18px rgba(255,180,0,.38);}
.brand-text{font-size:17px;font-weight:800;color:#fff;letter-spacing:.02em;white-space:nowrap;}
.main-nav{display:flex;align-items:center;gap:2px;margin-left:6px;}
.main-nav a{padding:9px 15px;border-radius:9px;font-size:15px;font-weight:500;color:rgba(255,255,255,.72);white-space:nowrap;}
.main-nav a:hover{color:#fff;background:rgba(255,255,255,.09);}
.main-nav a.is-active{color:var(--gold);background:rgba(255,180,0,.13);font-weight:700;}
.notice-chip{margin-left:auto;display:inline-flex;align-items:center;gap:9px;padding:9px 20px;border-radius:999px;font-size:14px;font-weight:800;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 8px 20px rgba(255,180,0,.32);white-space:nowrap;}
.notice-chip:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(255,180,0,.42);}
.notice-dot{width:7px;height:7px;border-radius:50%;background:#1a1f3d;opacity:.75;}
.subbar{background:#141937;border-top:1px solid rgba(255,255,255,.08);}
.subbar-inner{display:flex;align-items:center;gap:14px;height:44px;}
.subbar-label{flex-shrink:0;padding:3px 10px;border-radius:6px;font-size:12px;font-weight:800;letter-spacing:.08em;color:var(--gold);background:rgba(255,180,0,.16);}
.ticker{display:flex;gap:30px;font-size:13px;overflow:hidden;white-space:nowrap;}
.ticker a{color:rgba(255,255,255,.68);}
.ticker a:hover{color:var(--gold);}
/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;background:var(--ink);}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.32;}
.hero-veil{position:absolute;inset:0;background:linear-gradient(115deg,rgba(15,19,42,.97) 0%,rgba(26,31,61,.88) 56%,rgba(26,31,61,.62) 100%);}
.hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:1.18fr .82fr;gap:52px;align-items:center;padding:46px 0 62px;}
.crumb{display:flex;align-items:center;gap:9px;font-size:13px;color:rgba(255,255,255,.56);}
.crumb a{color:rgba(255,255,255,.72);}
.crumb a:hover{color:var(--gold);}
.crumb span{opacity:.5;}
.hero-eyebrow{display:inline-flex;align-items:center;gap:9px;margin-top:22px;padding:7px 16px;border-radius:999px;font-size:13px;font-weight:600;letter-spacing:.05em;color:var(--gold-soft);background:rgba(255,180,0,.14);border:1px solid rgba(255,180,0,.36);}
.hero-title{margin-top:20px;font-size:clamp(26px,3.9vw,44px);line-height:1.26;color:#fff;letter-spacing:-.02em;}
.hero-title em{font-style:normal;color:var(--gold);}
.hero-lead{margin-top:20px;max-width:660px;font-size:15.5px;line-height:1.95;color:rgba(255,255,255,.78);}
.hero-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px;}
.hero-tags span{padding:5px 14px;border-radius:999px;font-size:13px;color:rgba(255,255,255,.8);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);}
.hero-actions{margin-top:30px;display:flex;flex-wrap:wrap;gap:14px;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 30px;border-radius:999px;border:1px solid transparent;font-size:15px;font-weight:700;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease;}
.btn-gold{background:linear-gradient(135deg,#ffcd4d,var(--gold));color:#1a1f3d;box-shadow:0 12px 28px rgba(255,180,0,.34);}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(255,180,0,.46);}
.btn-ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.26);}
.btn-ghost:hover{background:rgba(255,255,255,.17);transform:translateY(-2px);}
.btn-dark{background:var(--ink);color:#fff;box-shadow:0 12px 26px rgba(26,31,61,.24);}
.btn-dark:hover{background:var(--ink-2);transform:translateY(-2px);}
.hero-panel{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.17);border-radius:var(--radius-lg);padding:26px 26px 22px;backdrop-filter:blur(6px);box-shadow:0 20px 46px rgba(5,8,22,.34);}
.hero-panel h2{font-size:15px;color:#fff;letter-spacing:.02em;}
.hero-panel h2 small{display:block;margin-top:6px;font-size:12.5px;font-weight:500;letter-spacing:0;color:rgba(255,255,255,.55);}
.gear-list{margin-top:16px;}
.gear-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px dashed rgba(255,255,255,.14);}
.gear-row:last-child{border-bottom:0;padding-bottom:4px;}
.gear-name{font-size:14px;font-weight:700;color:#fff;}
.gear-name i{display:block;margin-top:3px;font-style:normal;font-size:12.5px;font-weight:500;color:rgba(255,255,255,.55);}
.gear-val{flex-shrink:0;padding:4px 12px;border-radius:8px;font-size:12.5px;font-weight:800;color:var(--gold);background:rgba(255,180,0,.14);border:1px solid rgba(255,180,0,.3);}
/* ---------- Pain ---------- */
.pain-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.pain-card{position:relative;padding:28px 30px 26px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.pain-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(255,180,0,.5);}
.pain-num{display:inline-block;font-size:12.5px;font-weight:900;letter-spacing:.12em;color:var(--gold-deep);}
.pain-card h3{margin-top:10px;font-size:18px;color:var(--ink);}
.pain-card p{margin-top:12px;font-size:15px;line-height:1.85;color:var(--muted);}
/* ---------- Steps ---------- */
.steps-wrap{display:grid;grid-template-columns:.86fr 1.14fr;gap:52px;align-items:start;}
.steps-media{position:relative;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line);}
.steps-media img{width:100%;aspect-ratio:4/3.4;object-fit:cover;}
.steps-media figcaption{position:absolute;left:0;right:0;bottom:0;padding:34px 22px 18px;font-size:13.5px;color:#fff;background:linear-gradient(to top,rgba(15,19,42,.92),rgba(15,19,42,0));}
.step-list{display:grid;gap:14px;}
.step-item{display:grid;grid-template-columns:52px 1fr;gap:18px;padding:22px 24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.step-item:hover{transform:translateX(5px);box-shadow:var(--shadow);border-color:rgba(255,180,0,.45);}
.step-idx{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;font-size:17px;font-weight:900;color:#1a1f3d;background:linear-gradient(135deg,#ffd873,var(--gold));}
.step-item h3{font-size:17px;color:var(--ink);}
.step-item p{margin-top:8px;font-size:14.5px;line-height:1.82;color:var(--muted);}
/* ---------- Skill cards ---------- */
.skill-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.skill-card{padding:26px 26px 24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease;}
.skill-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.skill-card .tag{display:inline-block;padding:4px 11px;border-radius:7px;font-size:12px;font-weight:800;color:var(--gold-deep);background:rgba(255,180,0,.14);}
.skill-card h3{margin-top:14px;font-size:17px;color:var(--ink);}
.skill-card p{margin-top:10px;font-size:14.5px;line-height:1.82;color:var(--muted);}
/* ---------- Audience ---------- */
.aud-list{display:grid;gap:16px;}
.aud-item{display:grid;grid-template-columns:150px 1fr;gap:26px;align-items:start;padding:26px 30px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);}
.aud-item h3{font-size:16.5px;color:var(--ink);}
.aud-item h3 i{display:block;margin-top:6px;font-style:normal;font-size:12.5px;font-weight:600;color:var(--gold-deep);letter-spacing:.06em;}
.aud-item p{font-size:15px;line-height:1.88;color:var(--muted);}
/* ---------- Metrics ---------- */
.metrics{background:linear-gradient(120deg,var(--ink) 0%,var(--ink-3) 100%);color:#fff;border-radius:var(--radius-lg);padding:44px 40px;display:grid;grid-template-columns:repeat(4,1fr);gap:30px;box-shadow:var(--shadow-lg);}
.metric strong{display:block;font-size:clamp(26px,3.4vw,38px);font-weight:900;line-height:1.1;color:var(--gold);}
.metric strong span{font-size:15px;margin-left:2px;}
.metric em{display:block;margin-top:10px;font-style:normal;font-size:13.5px;color:rgba(255,255,255,.66);letter-spacing:.03em;}
/* ---------- Reviews ---------- */
.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.review-card{padding:26px 26px 22px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);position:relative;}
.review-card::before{content:"“";position:absolute;top:6px;right:22px;font-size:52px;line-height:1;color:rgba(255,180,0,.22);font-weight:900;}
.review-card p{font-size:14.5px;line-height:1.88;color:var(--text);}
.review-who{margin-top:16px;display:flex;align-items:center;gap:11px;font-size:13px;color:var(--muted);}
.review-who b{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;font-size:13px;font-weight:900;color:#1a1f3d;background:linear-gradient(135deg,#ffd873,var(--gold));}
/* ---------- News ---------- */
.news-list{display:grid;gap:14px;}
.news-item{display:grid;grid-template-columns:64px 1fr auto;gap:22px;align-items:center;padding:22px 26px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.news-item:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:rgba(255,180,0,.5);}
.news-no{display:grid;place-items:center;width:64px;height:64px;border-radius:14px;font-size:18px;font-weight:900;color:var(--gold-deep);background:rgba(255,180,0,.13);}
.news-body h3{font-size:16.5px;color:var(--ink);}
.news-body h3 a:hover{color:var(--gold-deep);}
.news-body p{margin-top:8px;font-size:14px;line-height:1.8;color:var(--muted);}
.news-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px;font-size:12.5px;color:var(--muted);}
.news-meta i{font-style:normal;padding:3px 10px;border-radius:6px;background:var(--surface-2);color:var(--ink-3);}
.news-more{flex-shrink:0;font-size:14px;font-weight:800;color:var(--gold-deep);white-space:nowrap;}
.news-more:hover{color:var(--ink);}
.empty-tip{padding:34px;text-align:center;font-size:14.5px;color:var(--muted);background:var(--surface);border:1px dashed var(--line);border-radius:var(--radius);}
/* ---------- FAQ ---------- */
.faq-list{display:grid;gap:12px;max-width:900px;}
.faq-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease;}
.faq-item[open]{border-color:rgba(255,180,0,.55);box-shadow:var(--shadow);}
.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:19px 24px;font-size:16px;font-weight:700;color:var(--ink);cursor:pointer;list-style:none;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+";flex-shrink:0;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:17px;font-weight:800;color:var(--gold-deep);background:rgba(255,180,0,.15);}
.faq-item[open] summary::after{content:"–";}
.faq-item p{padding:0 24px 22px;font-size:14.5px;line-height:1.9;color:var(--muted);}
/* ---------- CTA ---------- */
.cta-band{background:linear-gradient(115deg,var(--ink) 0%,var(--ink-3) 100%);border-radius:var(--radius-lg);padding:48px 44px;display:flex;align-items:center;justify-content:space-between;gap:34px;box-shadow:var(--shadow-lg);}
.cta-band h2{font-size:clamp(21px,2.7vw,29px);color:#fff;}
.cta-band p{margin-top:12px;max-width:620px;font-size:15px;line-height:1.9;color:rgba(255,255,255,.72);}
.cta-band .btn{flex-shrink:0;}
/* ---------- Footer ---------- */
.site-footer{background:var(--ink);color:rgba(255,255,255,.7);padding-top:56px;}
.footer-grid{display:grid;grid-template-columns:1.5fr .8fr .9fr 1.2fr;gap:38px;padding-bottom:44px;}
.footer-brand .brand{margin-bottom:16px;}
.footer-brand p{font-size:14px;line-height:1.9;color:rgba(255,255,255,.6);max-width:340px;}
.footer-col h4{margin-bottom:16px;font-size:14px;font-weight:800;letter-spacing:.06em;color:#fff;}
.footer-col a,.footer-col p{display:block;margin-bottom:10px;font-size:14px;color:rgba(255,255,255,.62);}
.footer-col a:hover{color:var(--gold);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);}
.footer-bottom .container{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding-top:20px;padding-bottom:22px;font-size:13px;color:rgba(255,255,255,.5);}
/* ---------- Responsive ---------- */
@media (max-width:1024px){
 .hero-inner{grid-template-columns:1fr;gap:38px;padding:40px 0 52px;}
 .steps-wrap{grid-template-columns:1fr;gap:32px;}
 .metrics{grid-template-columns:repeat(2,1fr);gap:26px;padding:36px 30px;}
 .skill-grid{grid-template-columns:repeat(2,1fr);}
 .review-grid{grid-template-columns:1fr 1fr;}
 .footer-grid{grid-template-columns:1fr 1fr;gap:30px;}
 .cta-band{flex-direction:column;align-items:flex-start;}
 .main-nav a{padding:9px 12px;font-size:14px;}
 .brand-text{font-size:15.5px;}
}
@media (max-width:768px){
 .topbar{height:auto;flex-wrap:wrap;padding-top:14px;padding-bottom:12px;gap:12px;}
 .notice-chip{margin-left:0;order:3;}
 .main-nav{margin-left:0;order:4;width:100%;overflow-x:auto;padding-bottom:4px;scrollbar-width:none;}
 .main-nav::-webkit-scrollbar{display:none;}
 .subbar-inner{height:auto;padding:9px 0;}
 .ticker{gap:22px;overflow-x:auto;scrollbar-width:none;}
 .ticker::-webkit-scrollbar{display:none;}
 .section{padding:56px 0;}
 .pain-grid{grid-template-columns:1fr;}
 .aud-item{grid-template-columns:1fr;gap:12px;padding:22px 22px;}
 .news-item{grid-template-columns:1fr;gap:14px;padding:20px;}
 .news-no{width:48px;height:48px;font-size:16px;}
 .hero-panel{padding:22px;}
 .cta-band{padding:32px 24px;}
}
@media (max-width:520px){
 .container{padding-left:18px;padding-right:18px;}
 .skill-grid,.review-grid{grid-template-columns:1fr;}
 .metrics{grid-template-columns:1fr;gap:22px;}
 .footer-grid{grid-template-columns:1fr;}
 .hero-title{font-size:26px;}
 .btn{width:100%;}
 .hero-actions{flex-direction:column;align-items:stretch;}
 .step-item{grid-template-columns:1fr;gap:12px;}
 .step-idx{width:44px;height:44px;font-size:15px;}
}

/* roulang page: category3 */
:root{
 --ink:#1a1f3d;
 --ink-2:#232a52;
 --ink-3:#2f3768;
 --gold:#ffb400;
 --gold-soft:#ffd873;
 --gold-deep:#c98d00;
 --bg:#f5f7fc;
 --surface:#ffffff;
 --surface-2:#eef1fa;
 --line:#e2e7f3;
 --text:#1c2140;
 --muted:#69719a;
 --radius:12px;
 --radius-lg:20px;
 --shadow-sm:0 2px 10px rgba(26,31,61,.06);
 --shadow:0 12px 32px rgba(26,31,61,.10);
 --shadow-lg:0 20px 50px rgba(26,31,61,.16);
}
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
 margin:0;
 font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
 font-size:16px;
 line-height:1.75;
 color:var(--text);
 background:var(--bg);
 -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{margin:0;line-height:1.32;letter-spacing:-.01em;}
p{margin:0;}
ul{margin:0;padding:0;list-style:none;}
img{display:block;max-width:100%;height:auto;}
a{color:inherit;text-decoration:none;transition:color .2s ease,background .2s ease,transform .2s ease,box-shadow .2s ease,border-color .2s ease;}
button,input,select,textarea{font:inherit;color:inherit;}
:focus-visible{outline:3px solid rgba(255,180,0,.72);outline-offset:3px;border-radius:6px;}
.container{width:100%;max-width:1180px;margin:0 auto;padding-left:24px;padding-right:24px;}
.section{padding:78px 0;background:var(--bg);}
.section-alt{background:var(--surface);}
.section-deep{background:var(--ink);color:#fff;}
.section-head{max-width:790px;margin-bottom:44px;}
.section-head h2{margin-top:14px;font-size:clamp(23px,3vw,33px);color:var(--ink);}
.section-head p{margin-top:16px;font-size:16px;line-height:1.92;color:var(--muted);}
.section-deep .section-head h2{color:#fff;}
.section-deep .section-head p{color:rgba(255,255,255,.7);}
.eyebrow{display:inline-flex;align-items:center;gap:9px;padding:6px 15px;border-radius:999px;font-size:12.5px;font-weight:700;letter-spacing:.06em;color:var(--gold-deep);background:rgba(255,180,0,.13);border:1px solid rgba(255,180,0,.32);}
.section-deep .eyebrow{color:var(--gold-soft);background:rgba(255,180,0,.14);border-color:rgba(255,180,0,.34);}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:80;background:var(--ink);box-shadow:0 8px 28px rgba(10,14,35,.28);}
.topbar{display:flex;align-items:center;gap:26px;height:76px;}
.brand{display:flex;align-items:center;gap:11px;flex-shrink:0;}
.brand-mark{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:18px;font-weight:900;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 6px 18px rgba(255,180,0,.38);}
.brand-text{font-size:17px;font-weight:800;color:#fff;letter-spacing:.02em;white-space:nowrap;}
.main-nav{display:flex;align-items:center;gap:2px;margin-left:6px;}
.main-nav a{padding:9px 15px;border-radius:9px;font-size:15px;font-weight:500;color:rgba(255,255,255,.72);white-space:nowrap;}
.main-nav a:hover{color:#fff;background:rgba(255,255,255,.09);}
.main-nav a.is-active{color:var(--gold);background:rgba(255,180,0,.13);font-weight:700;}
.notice-chip{margin-left:auto;display:inline-flex;align-items:center;gap:9px;padding:9px 20px;border-radius:999px;font-size:14px;font-weight:800;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 8px 20px rgba(255,180,0,.32);white-space:nowrap;}
.notice-chip:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(255,180,0,.42);}
.notice-dot{width:7px;height:7px;border-radius:50%;background:#1a1f3d;opacity:.7;}
.subbar{background:var(--ink-2);border-top:1px solid rgba(255,255,255,.08);}
.subbar-inner{display:flex;align-items:center;gap:14px;height:42px;overflow:hidden;}
.subbar-label{flex-shrink:0;padding:2px 10px;border-radius:6px;font-size:12px;font-weight:800;color:var(--gold);background:rgba(255,180,0,.14);letter-spacing:.08em;}
.ticker{display:flex;gap:30px;overflow-x:auto;font-size:13.5px;color:rgba(255,255,255,.62);scrollbar-width:none;}
.ticker::-webkit-scrollbar{display:none;}
.ticker a{white-space:nowrap;}
.ticker a:hover{color:var(--gold);}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;background:var(--ink);}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.42;}
.hero-veil{position:absolute;inset:0;background:linear-gradient(115deg,rgba(15,19,42,.97) 0%,rgba(26,31,61,.9) 55%,rgba(26,31,61,.58) 100%);}
.hero-inner{position:relative;z-index:2;padding:40px 0 66px;}
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:9px;font-size:13px;color:rgba(255,255,255,.52);margin-bottom:20px;}
.breadcrumb a:hover{color:var(--gold);}
.breadcrumb span.sep{opacity:.5;}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:54px;align-items:start;}
.hero-title{font-size:clamp(28px,4.1vw,46px);color:#fff;margin-top:20px;}
.hero-sub{margin-top:18px;font-size:16.5px;line-height:1.9;color:rgba(255,255,255,.8);max-width:660px;}
.hero-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px;}
.tag{display:inline-flex;align-items:center;padding:5px 13px;border-radius:999px;font-size:12.5px;font-weight:600;color:var(--gold-soft);background:rgba(255,180,0,.12);border:1px solid rgba(255,180,0,.3);}
.hero-actions{margin-top:32px;display:flex;flex-wrap:wrap;gap:14px;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 30px;border-radius:999px;border:1px solid transparent;font-size:15px;font-weight:700;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease;}
.btn-gold{background:linear-gradient(135deg,#ffcd4d,var(--gold));color:#1a1f3d;box-shadow:0 12px 28px rgba(255,180,0,.34);}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(255,180,0,.46);}
.btn-ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.26);}
.btn-ghost:hover{background:rgba(255,255,255,.17);transform:translateY(-2px);}
.btn-dark{background:var(--ink);color:#fff;box-shadow:0 12px 26px rgba(26,31,61,.24);}
.btn-dark:hover{background:var(--ink-2);transform:translateY(-2px);}
.version-panel{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:var(--radius-lg);padding:26px 24px;backdrop-filter:blur(6px);box-shadow:0 20px 44px rgba(8,11,28,.4);}
.version-panel h3{font-size:15px;font-weight:800;color:#fff;letter-spacing:.04em;display:flex;align-items:center;gap:9px;}
.panel-dot{width:8px;height:8px;border-radius:50%;background:#5ce0a0;box-shadow:0 0 0 4px rgba(92,224,160,.16);}
.vrow{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px dashed rgba(255,255,255,.14);font-size:13.5px;}
.vrow:last-of-type{border-bottom:0;}
.vrow span{color:rgba(255,255,255,.58);flex-shrink:0;}
.vrow strong{color:#fff;font-weight:700;text-align:right;font-size:13.5px;}
.vrow strong.hl{color:var(--gold);}
.panel-note{margin-top:16px;padding:13px 15px;border-radius:10px;background:rgba(255,180,0,.12);border:1px solid rgba(255,180,0,.28);font-size:13px;line-height:1.8;color:rgba(255,255,255,.82);}
.hero-stats{margin-top:44px;display:flex;flex-wrap:wrap;gap:46px;}
.hero-stats strong{display:block;font-size:31px;font-weight:900;line-height:1.1;color:var(--gold);}
.hero-stats em{display:block;margin-top:7px;font-style:normal;font-size:13px;color:rgba(255,255,255,.58);letter-spacing:.03em;}

/* ---------- Stat strip ---------- */
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.stat-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px 24px;box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.stat-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(255,180,0,.5);}
.stat-card strong{display:block;font-size:30px;font-weight:900;color:var(--ink);line-height:1.15;letter-spacing:-.02em;}
.stat-card strong i{font-style:normal;font-size:15px;color:var(--gold-deep);margin-left:3px;}
.stat-card p{margin-top:10px;font-size:14px;line-height:1.78;color:var(--muted);}

/* ---------- Change cards ---------- */
.change-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.change-card{position:relative;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px 26px 26px;box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.change-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(255,180,0,.55);}
.icon-badge{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:18px;font-weight:900;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 8px 18px rgba(255,180,0,.28);}
.change-card h3{margin-top:18px;font-size:18px;color:var(--ink);}
.change-card p{margin-top:12px;font-size:14.5px;line-height:1.85;color:var(--muted);}
.change-card .mini-tag{margin-top:18px;align-self:flex-start;padding:4px 12px;border-radius:999px;font-size:12px;font-weight:700;color:var(--ink-3);background:var(--surface-2);border:1px solid var(--line);}

/* ---------- Steps ---------- */
.step-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:step;}
.step-item{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px 22px;box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease;}
.step-item:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.step-num{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;font-size:14px;font-weight:900;color:#fff;background:var(--ink-3);}
.step-item h3{margin-top:16px;font-size:16.5px;color:var(--ink);}
.step-item p{margin-top:10px;font-size:14px;line-height:1.82;color:var(--muted);}
.step-item.is-key{border-color:rgba(255,180,0,.55);box-shadow:0 10px 26px rgba(255,180,0,.16);}
.step-item.is-key .step-num{background:linear-gradient(135deg,#ffcd4d,var(--gold));color:#1a1f3d;}

/* ---------- Split ---------- */
.split{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center;}
.split-media{position:relative;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line);}
.split-media img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/11;}
.split-media .media-chip{position:absolute;left:16px;bottom:16px;padding:7px 15px;border-radius:999px;font-size:12.5px;font-weight:700;color:#1a1f3d;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 8px 20px rgba(10,14,35,.3);}
.split h2{font-size:clamp(22px,2.8vw,30px);color:var(--ink);}
.split .lead{margin-top:16px;font-size:15.5px;line-height:1.92;color:var(--muted);}
.check-list{margin-top:26px;display:grid;gap:14px;}
.check-list li{position:relative;padding-left:30px;font-size:14.8px;line-height:1.82;color:var(--text);}
.check-list li::before{content:"";position:absolute;left:0;top:8px;width:10px;height:10px;border-radius:50%;background:linear-gradient(135deg,#ffcd4d,var(--gold));box-shadow:0 0 0 4px rgba(255,180,0,.16);}
.check-list li b{color:var(--ink);}

/* ---------- Compat ---------- */
.compat-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.compat-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px 26px;box-shadow:var(--shadow-sm);}
.compat-card h3{font-size:17.5px;color:var(--ink);display:flex;align-items:center;gap:10px;}
.compat-card h3 .dot{width:8px;height:8px;border-radius:50%;background:var(--gold);}
.compat-card ul{margin-top:18px;display:grid;gap:12px;}
.compat-card li{font-size:14.5px;line-height:1.82;color:var(--muted);padding-left:18px;position:relative;}
.compat-card li::before{content:"";position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:2px;background:var(--ink-3);opacity:.45;}
.compat-card li b{color:var(--ink);}

/* ---------- FAQ ---------- */
.faq-list{display:grid;gap:14px;max-width:920px;}
.faq-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease;}
.faq-item[open]{border-color:rgba(255,180,0,.55);box-shadow:var(--shadow);}
.faq-item summary{list-style:none;cursor:pointer;padding:20px 56px 20px 24px;position:relative;font-size:16px;font-weight:700;color:var(--ink);}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+";position:absolute;right:22px;top:50%;transform:translateY(-50%);font-size:20px;font-weight:700;color:var(--gold-deep);transition:transform .2s ease;}
.faq-item[open] summary::after{content:"−";}
.faq-item summary:hover{color:var(--gold-deep);}
.faq-body{padding:0 24px 22px;font-size:14.8px;line-height:1.9;color:var(--muted);}

/* ---------- CTA ---------- */
.cta-band{position:relative;overflow:hidden;background:linear-gradient(120deg,var(--ink) 0%,var(--ink-2) 58%,var(--ink-3) 100%);border-radius:var(--radius-lg);padding:52px 46px;box-shadow:var(--shadow-lg);}
.cta-band::after{content:"";position:absolute;right:-90px;top:-90px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(255,180,0,.32),transparent 68%);}
.cta-band h2{position:relative;z-index:2;font-size:clamp(22px,2.8vw,30px);color:#fff;max-width:640px;}
.cta-band p{position:relative;z-index:2;margin-top:16px;max-width:660px;font-size:15px;line-height:1.9;color:rgba(255,255,255,.76);}
.cta-actions{position:relative;z-index:2;margin-top:28px;display:flex;flex-wrap:wrap;gap:14px;}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink);color:rgba(255,255,255,.72);padding-top:58px;}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:38px;padding-bottom:44px;}
.footer-brand p{margin-top:16px;font-size:14px;line-height:1.9;color:rgba(255,255,255,.58);max-width:340px;}
.footer-col h4{font-size:14.5px;font-weight:800;color:#fff;margin-bottom:16px;letter-spacing:.04em;}
.footer-col a,.footer-col p{display:block;font-size:14px;line-height:1.9;color:rgba(255,255,255,.58);margin-bottom:9px;}
.footer-col a:hover{color:var(--gold);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:20px 0;font-size:13px;color:rgba(255,255,255,.45);}
.footer-bottom .container{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;}

/* ---------- Responsive ---------- */
@media (max-width:1024px){
 .hero-grid{grid-template-columns:1fr;gap:36px;}
 .version-panel{max-width:560px;}
 .split{grid-template-columns:1fr;gap:32px;}
 .change-grid{grid-template-columns:repeat(2,1fr);}
 .step-flow{grid-template-columns:repeat(2,1fr);}
 .stat-grid{grid-template-columns:repeat(2,1fr);}
 .footer-grid{grid-template-columns:1fr 1fr;gap:30px;}
}
@media (max-width:860px){
 .topbar{flex-wrap:wrap;height:auto;padding-top:14px;padding-bottom:12px;gap:14px;}
 .main-nav{order:3;width:100%;margin-left:0;overflow-x:auto;padding-bottom:4px;scrollbar-width:none;}
 .main-nav::-webkit-scrollbar{display:none;}
 .notice-chip{margin-left:auto;padding:8px 16px;font-size:13px;}
 .hero-inner{padding:28px 0 50px;}
 .section{padding:58px 0;}
 .section-head{margin-bottom:32px;}
 .cta-band{padding:38px 28px;}
}
@media (max-width:768px){
 .change-grid,.step-flow,.compat-grid{grid-template-columns:1fr;}
 .stat-grid{grid-template-columns:1fr 1fr;}
 .hero-stats{gap:30px;}
 .hero-stats strong{font-size:26px;}
 .footer-grid{grid-template-columns:1fr;}
 .brand-text{font-size:15.5px;}
}
@media (max-width:520px){
 .container{padding-left:18px;padding-right:18px;}
 .hero-actions{flex-direction:column;align-items:stretch;}
 .btn{width:100%;}
 .stat-grid{grid-template-columns:1fr;}
 .cta-actions{flex-direction:column;align-items:stretch;}
 .stat-card strong{font-size:26px;}
 .subbar-inner{height:auto;padding:8px 0;}
 .ticker{font-size:12.5px;gap:20px;}
}
