/* roulang page: index */
:root{
      --ink:#edf4ff;
      --muted:#9aabc4;
      --dim:#70819d;
      --navy:#07111f;
      --panel:#0d1c30;
      --panel2:#112640;
      --line:rgba(164,193,229,.16);
      --blue:#4ca9ff;
      --cyan:#61e0d0;
      --orange:#ffb65b;
      --white:#fff;
      --radius:22px;
      --radius-sm:14px;
      --shadow:0 22px 60px rgba(0,0,0,.26);
      --container:1200px;
    }
    *,*:before,*:after{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--navy);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-size:16px;line-height:1.8;letter-spacing:.01em}
    a{color:inherit;text-decoration:none}
    img{display:block;max-width:100%;height:auto}
    button,input{font:inherit}
    button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 48px));margin:auto}
    .topline{height:4px;background:linear-gradient(90deg,var(--blue),var(--cyan),var(--orange))}
    .site-header{position:sticky;top:0;z-index:20;background:rgba(7,17,31,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
    .nav{height:76px;display:flex;align-items:center;gap:28px}
    .brand{display:flex;align-items:center;gap:11px;min-width:max-content;font-size:21px;font-weight:800;letter-spacing:.06em}
    .brand-mark{width:34px;height:34px;border-radius:11px;background:linear-gradient(145deg,var(--cyan),var(--blue));position:relative;box-shadow:0 7px 22px rgba(76,169,255,.3)}
    .brand-mark:after{content:"";position:absolute;width:12px;height:12px;border:3px solid #081525;border-radius:50%;left:10px;top:8px}
    .nav-links{display:flex;align-items:center;gap:5px;flex:1}
    .nav-links a{padding:9px 13px;color:var(--muted);font-size:14px;border-radius:10px;transition:.25s}
    .nav-links a:hover,.nav-links a.active{color:var(--white);background:rgba(76,169,255,.12)}
    .nav-links a.active{box-shadow:inset 0 -2px var(--cyan)}
    .nav-tools{display:flex;align-items:center;gap:13px}
    .status{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:12px;white-space:nowrap}
    .status i{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 5px rgba(97,224,208,.12)}
    .icon-btn{width:38px;height:38px;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:11px;transition:.25s}
    .icon-btn:hover{color:var(--white);border-color:var(--blue);background:rgba(76,169,255,.1)}
    .menu-btn{display:none}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:12px;border:1px solid transparent;font-weight:700;font-size:14px;transition:transform .25s,box-shadow .25s,background .25s}
    .btn:hover{transform:translateY(-2px)}
    .btn-primary{background:var(--blue);color:#041222;box-shadow:0 10px 25px rgba(76,169,255,.22)}
    .btn-primary:hover{background:#78bdff;box-shadow:0 14px 32px rgba(76,169,255,.3)}
    .btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.03)}
    .btn-ghost:hover{border-color:var(--cyan);background:rgba(97,224,208,.08)}
    .eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--cyan);font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
    .eyebrow:before{content:"";width:22px;height:1px;background:var(--cyan)}
    h1,h2,h3,p{margin-top:0}
    h1{font-size:clamp(40px,6vw,76px);line-height:1.14;letter-spacing:-.045em;margin-bottom:24px}
    h2{font-size:clamp(28px,4vw,46px);line-height:1.22;letter-spacing:-.03em;margin-bottom:14px}
    h3{font-size:19px;line-height:1.4;margin-bottom:8px}
    .lead{font-size:18px;color:#c7d5e8;line-height:1.9;max-width:680px}
    .section{padding:104px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:38px}
    .section-head p{max-width:590px;color:var(--muted);margin-bottom:0}
    .hero{min-height:680px;display:flex;align-items:center;position:relative;overflow:hidden;background-image:linear-gradient(90deg,rgba(7,17,31,.98) 10%,rgba(7,17,31,.78) 53%,rgba(7,17,31,.42)),url("/assets/images/backpic/back-1.webp");background-size:cover;background-position:center}
    .hero:after{content:"";position:absolute;inset:auto 0 0;height:150px;background:linear-gradient(transparent,var(--navy));pointer-events:none}
    .hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.08fr .92fr;gap:60px;align-items:center}
    .hero-copy{padding:55px 0}
    .hero-copy h1 span{color:var(--cyan)}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0 32px}
    .hero-points{display:flex;gap:25px;flex-wrap:wrap;color:var(--muted);font-size:13px}
    .hero-points strong{display:block;color:var(--white);font-size:22px;line-height:1.2}
    .hero-points div{padding-left:15px;border-left:1px solid var(--line)}
    .hero-panel{background:rgba(13,28,48,.82);border:1px solid rgba(164,193,229,.22);border-radius:26px;padding:24px;box-shadow:var(--shadow);transform:rotate(1.5deg)}
    .panel-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;color:var(--muted);font-size:13px}
    .live-dot{color:var(--cyan);font-size:12px}.live-dot:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--cyan);margin-right:7px}
    .feature-card{background:linear-gradient(135deg,#163657,#10233a);border-radius:18px;padding:22px;margin-bottom:15px}
    .feature-card .match{display:flex;align-items:center;justify-content:space-between;font-size:21px;font-weight:800}
    .team{display:flex;align-items:center;gap:10px}.team-badge{width:30px;height:30px;border-radius:9px;background:var(--orange);display:grid;place-items:center;color:#172033;font-size:12px}
    .versus{color:var(--dim);font-size:12px}
    .panel-list{display:grid;gap:10px}.panel-row{display:flex;justify-content:space-between;align-items:center;padding:13px 14px;border:1px solid var(--line);border-radius:12px;color:var(--muted);font-size:13px}.panel-row b{color:var(--ink)}
    .story{background:#0b1a2d}.story-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:72px;align-items:start}
    .story-image{border-radius:var(--radius);overflow:hidden;position:relative}.story-image img{width:100%;height:430px;object-fit:cover}.story-image figcaption{position:absolute;bottom:0;left:0;right:0;padding:30px 24px 20px;background:linear-gradient(transparent,rgba(0,0,0,.8));font-weight:700}
    .story-copy p{color:var(--muted);margin-bottom:18px}
    .quote-line{margin-top:28px;padding:18px 20px;border-left:3px solid var(--orange);color:#d9e5f5;background:rgba(255,182,91,.06)}
    .three-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .value-card,.content-card,.quote-card,.faq-item,.calendar-card{border:1px solid var(--line);background:linear-gradient(145deg,rgba(17,38,64,.9),rgba(10,26,44,.9));border-radius:var(--radius);transition:.3s}
    .value-card{padding:30px;min-height:220px}.value-card:hover,.content-card:hover,.quote-card:hover{transform:translateY(-5px);border-color:rgba(97,224,208,.45);box-shadow:var(--shadow)}
    .number{display:block;color:var(--cyan);font-size:38px;font-weight:800;line-height:1;margin-bottom:22px}
    .value-card p,.content-card p,.quote-card p{color:var(--muted);font-size:14px}
    .topics{background:#0b192b}.topic-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.topic-card{min-height:156px;padding:22px;border-radius:18px;border:1px solid var(--line);background-size:cover;background-position:center;position:relative;overflow:hidden}.topic-card:before{content:"";position:absolute;inset:0;background:linear-gradient(140deg,rgba(7,17,31,.25),rgba(7,17,31,.95))}.topic-card>*{position:relative}.topic-card small{color:var(--cyan)}.topic-card h3{margin-top:38px}
    .dark-band{background:#071827;background-image:radial-gradient(circle at 90% 20%,rgba(76,169,255,.16),transparent 35%)}
    .hot-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:20px}.hot-main{padding:34px;border-radius:var(--radius);background:linear-gradient(130deg,#143b5b,#10243b);border:1px solid rgba(97,224,208,.2)}.hot-main p{color:#bdd0e5}.rank-list{display:grid;gap:10px}.rank-item{display:grid;grid-template-columns:35px 1fr auto;gap:13px;align-items:center;padding:15px;border-bottom:1px solid var(--line)}.rank-item em{font-style:normal;color:var(--orange);font-weight:800}.rank-item span{color:var(--muted);font-size:13px}.rank-item b{font-size:13px}
    .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:step}.step{position:relative;padding:25px 22px 23px;background:#0c1d31;border-radius:18px;border:1px solid var(--line)}.step:before{counter-increment:step;content:"0" counter(step);color:var(--blue);font-size:13px;font-weight:800}.step p{font-size:14px;color:var(--muted);margin:0}
    .timeline{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);gap:0}.milestone{padding:27px 22px 10px;border-right:1px solid var(--line);position:relative}.milestone:before{content:"";position:absolute;top:-6px;left:22px;width:11px;height:11px;background:var(--cyan);border-radius:50%;box-shadow:0 0 0 5px var(--navy)}.milestone strong{display:block;color:var(--orange);font-size:13px;margin-bottom:12px}.milestone p{color:var(--muted);font-size:14px}
    .scene-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.scene{display:grid;grid-template-columns:145px 1fr;gap:20px;align-items:center;padding:18px;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.025)}.scene img{width:145px;height:110px;object-fit:cover;border-radius:13px}.scene p{color:var(--muted);font-size:14px;margin:0}
    .metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.metric{background:#0d2035;padding:28px 24px}.metric strong{font-size:34px;color:var(--white);display:block}.metric span{color:var(--muted);font-size:13px}
    .feature-content{display:grid;grid-template-columns:1fr 1fr;gap:20px}.content-card{overflow:hidden}.content-card img{height:220px;width:100%;object-fit:cover}.content-card-body{padding:22px}.tag{display:inline-block;color:var(--cyan);font-size:12px;padding:3px 9px;border:1px solid rgba(97,224,208,.3);border-radius:99px;margin-bottom:12px}.content-card a{color:var(--blue);font-size:13px;font-weight:700}
    .quotes{background:#0b1b2e}.quote-card{padding:27px}.quote-card blockquote{margin:0 0 18px;color:#dbe8f8;font-size:16px}.quote-author{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--panel2);color:var(--cyan);font-weight:800}
    .news-layout{display:grid;grid-template-columns:1fr 330px;gap:24px}.news-list{border-top:1px solid var(--line)}.news-item{display:grid;grid-template-columns:94px 1fr auto;gap:18px;align-items:center;padding:21px 0;border-bottom:1px solid var(--line)}.news-date{color:var(--orange);font-size:13px}.news-item h3{font-size:17px;margin:0 0 5px}.news-item p{margin:0;color:var(--muted);font-size:13px;line-height:1.65}.news-item .btn{min-height:34px;padding:0 11px;font-size:12px}.recommend{padding:26px;border-radius:var(--radius);background:linear-gradient(160deg,#133756,#0d2036);border:1px solid var(--line)}.recommend img{height:145px;width:100%;object-fit:cover;border-radius:14px;margin:14px 0}.recommend p{font-size:13px;color:var(--muted)}
    .calendar{background:#0b192a}.calendar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.calendar-card{padding:22px}.calendar-card time{color:var(--orange);font-size:13px}.calendar-card p{color:var(--muted);font-size:14px;margin:8px 0 0}
    .faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.faq-item{padding:0 22px}.faq-item summary{padding:20px 0;cursor:pointer;font-weight:700;list-style:none}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:after{content:"＋";float:right;color:var(--cyan)}.faq-item[open] summary:after{content:"－"}.faq-item p{color:var(--muted);font-size:14px;padding:0 0 18px;margin:0}
    .subscribe{padding:42px;border-radius:var(--radius);background:linear-gradient(110deg,#123553,#10243c);display:flex;justify-content:space-between;align-items:center;gap:30px;border:1px solid rgba(97,224,208,.2)}.subscribe p{color:var(--muted);margin:0}.subscribe-form{display:flex;gap:9px;min-width:390px}.subscribe-form input{min-width:0;flex:1;border:1px solid var(--line);border-radius:11px;background:#071525;color:var(--white);padding:0 15px;outline:none}.subscribe-form input:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(97,224,208,.12)}
    .cta{padding:90px 0;text-align:center;background:radial-gradient(circle at 50% 100%,rgba(76,169,255,.18),transparent 48%)}.cta p{color:var(--muted);max-width:650px;margin:0 auto 25px}.footer{padding:52px 0 24px;border-top:1px solid var(--line);background:#050d18}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:35px}.footer h3{font-size:14px}.footer p,.footer a{color:var(--muted);font-size:13px}.footer a{display:block;margin:5px 0;transition:.2s}.footer a:hover{color:var(--cyan)}.footer-bottom{border-top:1px solid var(--line);margin-top:35px;padding-top:18px;color:var(--dim);font-size:12px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
    @media(max-width:1024px){.hero-grid{gap:30px}.topic-grid{grid-template-columns:repeat(2,1fr)}.steps,.timeline{grid-template-columns:repeat(2,1fr)}.timeline{border-top:0;gap:1px;background:var(--line)}.milestone{border:0;background:var(--navy)}.news-layout{grid-template-columns:1fr}.recommend{display:grid;grid-template-columns:180px 1fr;gap:20px;align-items:center}.recommend img{margin:0}.footer-grid{grid-template-columns:repeat(2,1fr)}}
    @media(max-width:768px){.container{width:min(100% - 32px,var(--container))}.nav{height:68px}.menu-btn{display:block}.nav-links{display:none;position:absolute;top:68px;left:16px;right:16px;padding:10px;background:#0b1a2d;border:1px solid var(--line);border-radius:15px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch}.nav-links.open{display:flex}.nav-links a{padding:12px 15px}.status,.nav-tools>.btn{display:none}.hero{min-height:auto}.hero-grid,.story-grid,.hot-grid,.feature-content{grid-template-columns:1fr}.hero-copy{padding:85px 0 45px}.hero-panel{max-width:580px;margin:0 auto 70px;transform:none}.three-grid,.metrics{grid-template-columns:repeat(2,1fr)}.scene-grid{grid-template-columns:1fr}.subscribe{display:block}.subscribe-form{min-width:0;margin-top:22px}}
    @media(max-width:520px){.section{padding:68px 0}.section-head{display:block;margin-bottom:26px}.section-head p{margin-top:12px}.hero-copy h1{font-size:42px}.lead{font-size:16px}.hero-actions .btn{width:100%}.hero-points{gap:16px}.three-grid,.topic-grid,.steps,.timeline,.metrics,.calendar-grid,.faq-grid{grid-template-columns:1fr}.story-image img{height:300px}.news-item{grid-template-columns:1fr;gap:4px;padding:18px 0}.news-item .btn{justify-self:start}.recommend{display:block}.recommend img{margin:14px 0}.subscribe{padding:28px 22px}.subscribe-form{display:block}.subscribe-form input{width:100%;height:46px;margin-bottom:10px}.subscribe-form .btn{width:100%}.footer-grid{grid-template-columns:1fr;gap:18px}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:8px}}

/* roulang page: category1 */
:root{--ink:#edf4ff;--muted:#9aabc4;--dim:#70819d;--navy:#07111f;--panel:#0d1c30;--panel2:#112640;--line:rgba(164,193,229,.16);--blue:#4ca9ff;--cyan:#61e0d0;--orange:#ffb65b;--white:#fff;--radius:22px;--radius-sm:14px;--shadow:0 22px 60px rgba(0,0,0,.26);--container:1200px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--navy);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-size:16px;line-height:1.8;letter-spacing:.01em}a{color:inherit;text-decoration:none}img{display:block;max-width:100%;height:auto}button,input{font:inherit}button{cursor:pointer}.container{width:min(var(--container),calc(100% - 48px));margin:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(7,17,31,.9);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.nav{height:76px;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;gap:11px;min-width:max-content;font-size:21px;font-weight:800;letter-spacing:.06em}.brand-mark{width:34px;height:34px;border-radius:11px;background:linear-gradient(145deg,var(--cyan),var(--blue));position:relative;box-shadow:0 7px 22px rgba(76,169,255,.3)}.brand-mark:after{content:"";position:absolute;width:12px;height:12px;border:3px solid #081525;border-radius:50%;left:10px;top:8px}.nav-links{display:flex;align-items:center;gap:5px;flex:1}.nav-links a{padding:9px 13px;color:var(--muted);font-size:14px;border-radius:10px;transition:.25s}.nav-links a:hover,.nav-links a.active{color:var(--white);background:rgba(76,169,255,.12)}.nav-links a.active{box-shadow:inset 0 -2px var(--cyan)}.nav-tools{display:flex;align-items:center;gap:13px}.status{font-size:12px;color:var(--muted);white-space:nowrap}.status i{display:inline-block;width:7px;height:7px;margin-right:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan)}.icon-btn{width:38px;height:38px;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:11px;transition:.25s}.icon-btn:hover{color:var(--white);border-color:var(--blue);background:rgba(76,169,255,.1)}.menu-btn{display:none}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:12px;border:1px solid transparent;font-weight:700;font-size:14px;transition:transform .25s,box-shadow .25s,background .25s}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--blue);color:#041222;box-shadow:0 10px 25px rgba(76,169,255,.22)}.btn-primary:hover{background:#78bdff;box-shadow:0 14px 32px rgba(76,169,255,.3)}.btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.03)}.btn-ghost:hover{border-color:var(--cyan);background:rgba(97,224,208,.08)}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--cyan);font-size:12px;font-weight:800;letter-spacing:.16em}.eyebrow:before{content:"";width:22px;height:1px;background:var(--cyan)}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(38px,5vw,68px);line-height:1.14;letter-spacing:-.04em;margin:18px 0}h2{font-size:clamp(28px,3.5vw,44px);line-height:1.25;margin:12px 0 18px}h3{line-height:1.35}.lead{font-size:18px;color:#c7d5e8;line-height:1.9;max-width:700px}.section{padding:100px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:38px}.section-head p{max-width:590px;color:var(--muted);margin-bottom:0}.hero{min-height:650px;display:flex;align-items:center;position:relative;overflow:hidden;background-image:linear-gradient(90deg,rgba(7,17,31,.98) 8%,rgba(7,17,31,.76) 55%,rgba(7,17,31,.34)),url("/assets/images/backpic/back-2.webp");background-size:cover;background-position:center}.hero:after{content:"";position:absolute;inset:auto 0 0;height:150px;background:linear-gradient(transparent,var(--navy));pointer-events:none}.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr .85fr;gap:70px;align-items:center}.hero-copy{padding:55px 0}.hero-copy h1 span{color:var(--cyan)}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0}.hero-note{font-size:13px;color:var(--muted)}.video-panel{position:relative;min-height:360px;border:1px solid rgba(164,193,229,.28);border-radius:26px;overflow:hidden;background:url("/assets/images/coverpic/cover-1.webp") center/cover;box-shadow:var(--shadow);transform:rotate(1.2deg)}.video-panel:before{content:"";position:absolute;inset:0;background:linear-gradient(145deg,rgba(8,23,41,.25),rgba(7,17,31,.88))}.video-info{position:absolute;left:26px;right:26px;bottom:24px}.video-info strong{font-size:22px}.play{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);width:74px;height:74px;border:1px solid rgba(255,255,255,.5);border-radius:50%;background:rgba(76,169,255,.78);color:#061423;font-size:25px;transition:.25s}.play:hover{transform:translate(-50%,-50%) scale(1.08);background:var(--cyan)}.split{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:start}.copy-box p{color:var(--muted);font-size:16px}.dark-panel{padding:32px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(145deg,rgba(17,38,64,.9),rgba(10,26,44,.9))}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px}.metric{padding:20px;border-left:2px solid var(--cyan);background:rgba(255,255,255,.035);border-radius:0 14px 14px 0}.metric b{display:block;color:var(--white);font-size:28px}.metric span{font-size:13px;color:var(--muted)}.three-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.value-card,.quote-card,.faq-item,.process-card{border:1px solid var(--line);background:linear-gradient(145deg,rgba(17,38,64,.9),rgba(10,26,44,.9));border-radius:var(--radius);transition:.3s}.value-card{padding:29px;min-height:220px}.value-card:hover,.quote-card:hover,.process-card:hover{transform:translateY(-5px);border-color:rgba(97,224,208,.45);box-shadow:var(--shadow)}.value-card .num{color:var(--orange);font-size:13px;font-weight:800}.value-card p,.quote-card p,.process-card p{color:var(--muted);font-size:14px}.scene{display:grid;grid-template-columns:1.1fr .9fr;gap:20px}.scene-main{min-height:330px;padding:38px;border-radius:var(--radius);background:linear-gradient(135deg,rgba(20,61,91,.92),rgba(12,30,51,.95));border:1px solid rgba(97,224,208,.2)}.scene-main p{color:#bdd0e5;max-width:650px}.scene-side{padding:30px;border-radius:var(--radius);background:#0b192b;border:1px solid var(--line)}.check-list{padding:0;margin:22px 0;list-style:none}.check-list li{padding:12px 0 12px 28px;color:var(--muted);border-bottom:1px solid var(--line);position:relative}.check-list li:before{content:"✓";position:absolute;left:0;color:var(--cyan);font-weight:800}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.process-card{padding:24px;min-height:190px}.process-card b{display:block;font-size:30px;color:var(--blue);margin-bottom:12px}.quote-layout{display:grid;grid-template-columns:1fr 1fr;gap:18px}.quote-card{padding:30px}.quote-card cite{color:var(--cyan);font-style:normal;font-size:13px}.faq-list{display:grid;gap:10px;max-width:900px}.faq-item{overflow:hidden}.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left;padding:20px 24px;background:none;border:0;color:var(--ink);font-weight:700}.faq-q span{color:var(--cyan);font-size:22px}.faq-a{display:none;padding:0 24px 22px;color:var(--muted);font-size:14px}.faq-item.open .faq-a{display:block}.cta{padding:65px 0;background:linear-gradient(100deg,#123451,#0d2238);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.cta-inner{display:flex;justify-content:space-between;align-items:center;gap:30px}.cta p{color:#bdd0e5;max-width:660px}.footer{padding:58px 0 24px;background:#050d18}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:30px}.footer p,.footer a{color:var(--muted);font-size:14px}.footer a{display:block;margin:7px 0;transition:.2s}.footer a:hover{color:var(--cyan)}.footer h3{font-size:15px;margin:4px 0 16px;color:var(--ink)}.footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin-top:45px;padding-top:20px;color:var(--dim);font-size:12px}.subscribe-box{display:flex;gap:10px;margin-top:20px}.subscribe-box input{min-width:220px;padding:12px 15px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.04);color:var(--ink);outline:none}.subscribe-box input:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(97,224,208,.12)}
@media(max-width:1024px){.nav{gap:14px}.nav-links a{padding:8px 8px}.status{display:none}.hero-grid,.scene,.split{gap:35px}.process-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){.container{width:min(var(--container),calc(100% - 34px))}.nav{height:68px}.nav-links{display:none;position:absolute;top:68px;left:0;right:0;padding:14px 17px;background:#091727;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch}.nav-links.show{display:flex}.nav-links a{padding:11px 14px}.nav-tools .btn-primary,.icon-btn:not(.menu-btn){display:none}.menu-btn{display:block}.hero{min-height:700px}.hero-grid,.scene,.split,.quote-layout{grid-template-columns:1fr}.hero-copy{padding:75px 0 20px}.video-panel{min-height:300px;transform:none}.section{padding:75px 0}.section-head,.cta-inner{display:block}.section-head p{margin-top:15px}.three-grid{grid-template-columns:1fr}.metric-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:8px}}
@media(max-width:520px){h1{font-size:40px}.lead{font-size:16px}.hero-actions .btn{width:100%}.metric-grid,.process-grid,.footer-grid{grid-template-columns:1fr}.subscribe-box{display:block}.subscribe-box input,.subscribe-box .btn{width:100%;margin-bottom:10px}}

/* roulang page: category3 */
:root{--ink:#edf4ff;--muted:#9aabc4;--dim:#70819d;--navy:#07111f;--panel:#0d1c30;--panel2:#112640;--line:rgba(164,193,229,.16);--blue:#4ca9ff;--cyan:#61e0d0;--orange:#ffb65b;--white:#fff;--radius:22px;--radius-sm:14px;--shadow:0 22px 60px rgba(0,0,0,.26);--container:1200px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--navy);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-size:16px;line-height:1.8;letter-spacing:.01em}a{color:inherit;text-decoration:none}img{display:block;max-width:100%;height:auto}button,input{font:inherit}button{cursor:pointer}.container{width:min(var(--container),calc(100% - 48px));margin:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(7,17,31,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.nav{height:76px;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;gap:11px;min-width:max-content;font-size:21px;font-weight:800;letter-spacing:.06em}.brand-mark{width:34px;height:34px;border-radius:11px;background:linear-gradient(145deg,var(--cyan),var(--blue));position:relative;box-shadow:0 7px 22px rgba(76,169,255,.3)}.brand-mark:after{content:"";position:absolute;width:12px;height:12px;border:3px solid #081525;border-radius:50%;left:10px;top:8px}.nav-links{display:flex;align-items:center;gap:5px;flex:1}.nav-links a{padding:9px 13px;color:var(--muted);font-size:14px;border-radius:10px;transition:.25s}.nav-links a:hover,.nav-links a.active{color:var(--white);background:rgba(76,169,255,.12)}.nav-links a.active{box-shadow:inset 0 -2px var(--cyan)}.nav-tools{display:flex;align-items:center;gap:13px}.status{font-size:12px;color:var(--muted);white-space:nowrap}.status i{display:inline-block;width:7px;height:7px;background:var(--cyan);border-radius:50%;margin-right:6px;box-shadow:0 0 10px var(--cyan)}.icon-btn{width:38px;height:38px;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:11px;transition:.25s}.icon-btn:hover{color:var(--white);border-color:var(--blue);background:rgba(76,169,255,.1)}.menu-btn{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:12px;border:1px solid transparent;font-weight:700;font-size:14px;transition:transform .25s,box-shadow .25s,background .25s}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--blue);color:#041222;box-shadow:0 10px 25px rgba(76,169,255,.22)}.btn-primary:hover{background:#78bdff;box-shadow:0 14px 32px rgba(76,169,255,.3)}.btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.03)}.btn-ghost:hover{border-color:var(--cyan);background:rgba(97,224,208,.08)}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--cyan);font-size:12px;font-weight:800;letter-spacing:.16em}.eyebrow:before{content:"";width:22px;height:1px;background:var(--cyan)}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(38px,5vw,66px);line-height:1.15;letter-spacing:-.04em;margin:18px 0}h2{font-size:clamp(28px,3.3vw,44px);line-height:1.25;margin:12px 0}h3{line-height:1.35;margin:0 0 10px}.lead{font-size:18px;color:#c7d5e8;line-height:1.9;max-width:700px}.section{padding:94px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:36px}.section-head p{max-width:590px;color:var(--muted);margin-bottom:0}
.hero{min-height:620px;display:flex;align-items:center;position:relative;overflow:hidden;background-image:linear-gradient(90deg,rgba(7,17,31,.98) 8%,rgba(7,17,31,.78) 52%,rgba(7,17,31,.48)),url("/assets/images/backpic/back-2.webp");background-size:cover;background-position:center}.hero:after{content:"";position:absolute;inset:auto 0 0;height:130px;background:linear-gradient(transparent,var(--navy));pointer-events:none}.hero-inner{position:relative;z-index:1;text-align:center;width:100%;padding:78px 0}.hero-inner .lead{margin:0 auto}.hero-inner h1 span{color:var(--cyan)}.search-box{display:flex;max-width:720px;margin:34px auto 22px;padding:7px;border:1px solid rgba(164,193,229,.28);background:rgba(9,25,43,.8);border-radius:16px;box-shadow:var(--shadow)}.search-box input{flex:1;min-width:0;background:transparent;border:0;outline:0;color:var(--white);padding:0 18px}.search-box input::placeholder{color:var(--dim)}.quick-links{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}.quick-links a{font-size:13px;color:#c7d5e8;border:1px solid var(--line);border-radius:30px;padding:5px 14px;background:rgba(255,255,255,.04);transition:.25s}.quick-links a:hover{border-color:var(--cyan);color:var(--cyan)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:25px;align-items:stretch}.story{padding:35px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(145deg,rgba(17,38,64,.92),rgba(10,26,44,.9))}.story p{color:var(--muted)}.story-image{min-height:340px;border-radius:var(--radius);overflow:hidden}.story-image img{width:100%;height:100%;object-fit:cover}.tag{display:inline-block;color:var(--cyan);font-size:12px;padding:4px 10px;border:1px solid rgba(97,224,208,.35);border-radius:20px;margin-bottom:18px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature{padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);transition:.3s}.feature:hover{transform:translateY(-5px);border-color:rgba(97,224,208,.45);box-shadow:var(--shadow)}.feature .num{font-size:34px;color:var(--orange);font-weight:800}.feature p{font-size:14px;color:var(--muted)}
.data-band{background:#0b192b;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.data-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1px}.data-item{padding:30px 20px;border-right:1px solid var(--line)}.data-item strong{display:block;color:var(--white);font-size:32px;line-height:1.2}.data-item span{font-size:13px;color:var(--muted)}
.article-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:24px}.reading-card{display:grid;grid-template-columns:180px 1fr;gap:22px;padding:18px;border:1px solid var(--line);border-radius:18px;background:var(--panel);margin-bottom:14px;transition:.25s}.reading-card:hover{border-color:var(--blue);transform:translateX(4px)}.reading-card img{width:180px;height:130px;object-fit:cover;border-radius:12px}.reading-card p{font-size:13px;color:var(--muted);margin:5px 0 10px}.date{font-size:12px;color:var(--orange)}.side-panel{padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(145deg,#122b47,#0d1c30)}.side-panel ul{list-style:none;padding:0;margin:20px 0}.side-panel li{padding:13px 0;border-bottom:1px solid var(--line);color:#c7d5e8}.side-panel li:before{content:"↗";color:var(--cyan);margin-right:9px}
.timeline{position:relative;padding-left:30px;border-left:1px solid var(--line);max-width:850px}.timeline-item{position:relative;padding:0 0 30px 24px}.timeline-item:before{content:"";position:absolute;left:-37px;top:8px;width:13px;height:13px;border:3px solid var(--navy);background:var(--cyan);border-radius:50%;box-shadow:0 0 0 1px var(--cyan)}.timeline-item h3{font-size:19px}.timeline-item p{color:var(--muted);font-size:14px}
.quote-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.quote{padding:30px;border-radius:var(--radius);background:linear-gradient(135deg,#143b5b,#10243b);border:1px solid rgba(97,224,208,.2)}.quote p{font-size:18px;color:#d8e7f7}.quote small{color:var(--cyan)}.faq-list{display:grid;gap:12px;max-width:900px}.faq-item{padding:21px 24px}.faq-item summary{cursor:pointer;font-weight:700;color:var(--white)}.faq-item p{color:var(--muted);font-size:14px;margin:13px 0 0}.cta{padding:58px;border-radius:var(--radius);background:linear-gradient(110deg,#16415f,#102943);border:1px solid rgba(97,224,208,.25);display:flex;justify-content:space-between;align-items:center;gap:25px}.cta p{color:#c7d5e8;margin:0;max-width:650px}.footer{padding:65px 0 22px;border-top:1px solid var(--line);background:#06101d}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px}.footer p,.footer a{color:var(--muted);font-size:14px}.footer h3{font-size:14px;color:var(--white)}.footer-grid>div>a:not(.brand){display:block;margin:7px 0;transition:.2s}.footer-grid>div>a:hover{color:var(--cyan)}.footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin-top:42px;padding-top:20px;color:var(--dim);font-size:12px}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
@media(max-width:1024px){.nav{gap:14px}.nav-links a{padding:8px 8px;font-size:13px}.status{display:none}.article-layout{grid-template-columns:1fr}.side-panel{display:none}}
@media(max-width:768px){.container{width:min(var(--container),calc(100% - 32px))}.nav{height:68px}.nav-links{display:none;position:absolute;top:68px;left:0;right:0;padding:12px 16px;background:#091727;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch}.nav-links.open{display:flex}.nav-links a{padding:11px 14px}.nav-tools .btn-primary,.nav-tools .icon-btn:not(.menu-btn){display:none}.menu-btn{display:block}.hero{min-height:600px}.section{padding:70px 0}.section-head{display:block}.section-head p{margin-top:15px}.two-col,.quote-grid{grid-template-columns:1fr}.feature-grid{grid-template-columns:1fr}.data-row{grid-template-columns:repeat(2,1fr)}.data-item:nth-child(2){border-right:0}.reading-card{grid-template-columns:120px 1fr}.reading-card img{width:120px;height:115px}.cta{display:block;padding:36px}.cta .btn{margin-top:22px}.footer-grid{grid-template-columns:1fr 1fr}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:10px}}
@media(max-width:520px){h1{font-size:38px}.lead{font-size:16px}.search-box{display:block;background:transparent;border:0;box-shadow:none}.search-box input{width:100%;height:50px;border:1px solid var(--line);border-radius:12px;background:rgba(9,25,43,.85);margin-bottom:10px}.search-box .btn{width:100%}.story{padding:24px}.reading-card{grid-template-columns:1fr}.reading-card img{width:100%;height:170px}.data-item{padding:22px 12px}.data-item strong{font-size:26px}.footer-grid{grid-template-columns:1fr}.hero-inner{padding:55px 0}}

/* roulang page: category2 */
:root{
 --ink:#edf4ff;--muted:#9aabc4;--dim:#70819d;--navy:#07111f;--panel:#0d1c30;
 --panel2:#112640;--line:rgba(164,193,229,.16);--blue:#4ca9ff;--cyan:#61e0d0;
 --orange:#ffb65b;--white:#fff;--radius:22px;--radius-sm:14px;
 --shadow:0 22px 60px rgba(0,0,0,.26);--container:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--navy);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-size:16px;line-height:1.8;letter-spacing:.01em}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
button,input{font:inherit}
button{cursor:pointer}
.container{width:min(var(--container),calc(100% - 48px));margin:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(7,17,31,.9);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav{height:76px;display:flex;align-items:center;gap:28px}
.brand{display:flex;align-items:center;gap:11px;min-width:max-content;font-size:21px;font-weight:800;letter-spacing:.06em}
.brand-mark{width:34px;height:34px;border-radius:11px;background:linear-gradient(145deg,var(--cyan),var(--blue));position:relative;box-shadow:0 7px 22px rgba(76,169,255,.3)}
.brand-mark:after{content:"";position:absolute;width:12px;height:12px;border:3px solid #081525;border-radius:50%;left:10px;top:8px}
.nav-links{display:flex;align-items:center;gap:5px;flex:1}
.nav-links a{padding:9px 13px;color:var(--muted);font-size:14px;border-radius:10px;transition:.25s}
.nav-links a:hover,.nav-links a.active{color:var(--white);background:rgba(76,169,255,.12)}
.nav-links a.active{box-shadow:inset 0 -2px var(--cyan)}
.nav-tools{display:flex;align-items:center;gap:13px}
.status{font-size:12px;color:var(--muted);white-space:nowrap}
.status i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--cyan);margin-right:6px;box-shadow:0 0 0 4px rgba(97,224,208,.1)}
.icon-btn{width:38px;height:38px;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:11px;transition:.25s}
.icon-btn:hover{color:var(--white);border-color:var(--blue);background:rgba(76,169,255,.1)}
.menu-btn{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:12px;border:1px solid transparent;font-weight:700;font-size:14px;transition:transform .25s,box-shadow .25s,background .25s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--blue);color:#041222;box-shadow:0 10px 25px rgba(76,169,255,.22)}
.btn-primary:hover{background:#78bdff;box-shadow:0 14px 32px rgba(76,169,255,.3)}
.btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.03)}
.btn-ghost:hover{border-color:var(--cyan);background:rgba(97,224,208,.08)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--cyan);font-size:12px;font-weight:800;letter-spacing:.16em}
.eyebrow:before{content:"";width:22px;height:1px;background:var(--cyan)}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(38px,5vw,68px);line-height:1.16;letter-spacing:-.04em;margin:18px 0}
h2{font-size:clamp(28px,3.5vw,44px);line-height:1.25;letter-spacing:-.03em;margin-bottom:15px}
h3{font-size:20px;line-height:1.4;margin-bottom:10px}
.lead{font-size:18px;color:#c7d5e8;line-height:1.9;max-width:700px}
.section{padding:100px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:38px}
.section-head p{max-width:590px;color:var(--muted);margin-bottom:0}
.page-hero{position:relative;min-height:450px;display:flex;align-items:center;overflow:hidden;background-image:linear-gradient(90deg,rgba(7,17,31,.98) 12%,rgba(7,17,31,.78) 58%,rgba(7,17,31,.35)),url("/assets/images/backpic/back-2.webp");background-size:cover;background-position:center}
.page-hero:after{content:"";position:absolute;inset:auto 0 0;height:120px;background:linear-gradient(transparent,var(--navy))}
.page-hero .container{position:relative;z-index:1}
.hero-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}
.badge{display:inline-flex;align-items:center;padding:5px 11px;border:1px solid rgba(97,224,208,.32);border-radius:30px;color:var(--cyan);font-size:12px;background:rgba(97,224,208,.07)}
.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center}
.media-card{position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
.media-card img{width:100%;height:430px;object-fit:cover}
.media-caption{position:absolute;bottom:0;left:0;right:0;padding:25px;background:linear-gradient(transparent,rgba(4,14,27,.95));color:#dbe8f7}
.check-list{display:grid;gap:15px;margin:24px 0 0;padding:0;list-style:none}
.check-list li{display:flex;gap:13px;color:var(--muted)}
.check-list li:before{content:"✓";display:grid;place-items:center;flex:0 0 24px;height:24px;border-radius:50%;background:rgba(97,224,208,.12);color:var(--cyan);font-weight:800}
.three-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.value-card,.quote-card,.faq-item,.step-card{border:1px solid var(--line);background:linear-gradient(145deg,rgba(17,38,64,.9),rgba(10,26,44,.9));border-radius:var(--radius);transition:.3s}
.value-card{padding:29px;min-height:235px}
.value-card:hover,.quote-card:hover,.step-card:hover{transform:translateY(-5px);border-color:rgba(97,224,208,.45);box-shadow:var(--shadow)}
.value-card .num{color:var(--orange);font-size:13px;font-weight:800;letter-spacing:.1em}
.value-card p,.quote-card p,.step-card p{color:var(--muted);font-size:14px}
.band{background:#0b192b;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.data-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.data-item{padding:25px;background:var(--panel);text-align:center}
.data-item strong{display:block;color:var(--cyan);font-size:30px;line-height:1.2}
.data-item span{font-size:13px;color:var(--muted)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.step-card{padding:25px}
.step-card b{display:grid;place-items:center;width:35px;height:35px;border-radius:10px;color:#07111f;background:var(--orange);margin-bottom:22px}
.quote-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:20px}
.quote-card{padding:35px}
.quote-card blockquote{font-size:24px;line-height:1.6;margin:0 0 22px;color:var(--ink)}
.quote-author{color:var(--cyan);font-size:13px}
.note-card{padding:30px;border-radius:var(--radius);background:linear-gradient(140deg,#153a58,#102239);border:1px solid rgba(97,224,208,.22)}
.note-card p{color:#bdd0e5;font-size:14px}
.faq-list{display:grid;gap:12px;max-width:900px}
.faq-item{padding:21px 25px}
.faq-item summary{cursor:pointer;font-weight:700;list-style:none;position:relative;padding-right:30px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:"＋";position:absolute;right:0;color:var(--cyan);font-size:20px}
.faq-item[open] summary:after{content:"−"}
.faq-item p{color:var(--muted);font-size:14px;margin:13px 0 0;max-width:780px}
.cta{padding:70px 0;background:linear-gradient(120deg,#123452,#0e2238);border-top:1px solid rgba(97,224,208,.18);border-bottom:1px solid rgba(97,224,208,.18)}
.cta-inner{display:flex;justify-content:space-between;align-items:center;gap:30px}
.cta p{color:#bfd0e4;max-width:650px}
.footer{padding:68px 0 24px;background:#050d18;color:var(--muted)}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px}
.footer p{font-size:14px;max-width:330px}
.footer h3{color:var(--white);font-size:14px}
.footer-grid>div>a:not(.brand){display:block;font-size:14px;margin:7px 0;transition:.2s}
.footer-grid>div>a:hover{color:var(--cyan)}
.footer-bottom{display:flex;justify-content:space-between;gap:25px;border-top:1px solid var(--line);margin-top:45px;padding-top:20px;font-size:12px;color:var(--dim)}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
@media(max-width:1024px){.nav{gap:15px}.nav-links a{padding:8px 8px;font-size:13px}.status{display:none}.split{gap:35px}.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){.container{width:min(var(--container),calc(100% - 32px))}.nav{height:68px}.nav-links{display:none;position:absolute;top:68px;left:16px;right:16px;padding:12px;background:rgba(13,28,48,.98);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch}.nav-links.open{display:flex}.nav-links a{padding:11px 14px}.nav-tools .btn,.nav-tools .icon-btn:not(.menu-btn){display:none}.menu-btn{display:block}.page-hero{min-height:420px}.section{padding:72px 0}.section-head,.cta-inner{display:block}.section-head p{margin-top:15px}.split,.quote-layout{grid-template-columns:1fr}.media-card img{height:330px}.three-grid{grid-template-columns:1fr}.data-strip{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}.footer-bottom{display:block}.footer-bottom span{display:block;margin-bottom:10px}}
@media(max-width:520px){h1{font-size:39px}.lead{font-size:16px}.hero-meta{gap:7px}.hero-meta .badge{font-size:11px}.data-item strong{font-size:25px}.steps{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.footer{padding-top:50px}.cta .btn{margin-top:15px;width:100%}}

/* roulang page: category4 */
:root{
      --ink:#edf4ff;--muted:#9aabc4;--dim:#70819d;--navy:#07111f;
      --panel:#0d1c30;--panel2:#112640;--line:rgba(164,193,229,.16);
      --blue:#4ca9ff;--cyan:#61e0d0;--orange:#ffb65b;--white:#fff;
      --radius:22px;--radius-sm:14px;--shadow:0 22px 60px rgba(0,0,0,.26);
      --container:1200px
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--navy);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-size:16px;line-height:1.8;letter-spacing:.01em}
    a{color:inherit;text-decoration:none} img{display:block;max-width:100%;height:auto} button,input{font:inherit} button{cursor:pointer}
    .container{width:min(var(--container),calc(100% - 48px));margin:auto}
    .site-header{position:sticky;top:0;z-index:20;background:rgba(7,17,31,.9);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
    .nav{height:76px;display:flex;align-items:center;gap:28px}
    .brand{display:flex;align-items:center;gap:11px;min-width:max-content;font-size:21px;font-weight:800;letter-spacing:.06em}
    .brand-mark{width:34px;height:34px;border-radius:11px;background:linear-gradient(145deg,var(--cyan),var(--blue));position:relative;box-shadow:0 7px 22px rgba(76,169,255,.3)}
    .brand-mark:after{content:"";position:absolute;width:12px;height:12px;border:3px solid #081525;border-radius:50%;left:10px;top:8px}
    .nav-links{display:flex;align-items:center;gap:5px;flex:1}
    .nav-links a{padding:9px 13px;color:var(--muted);font-size:14px;border-radius:10px;transition:.25s}
    .nav-links a:hover,.nav-links a.active{color:var(--white);background:rgba(76,169,255,.12)}
    .nav-links a.active{box-shadow:inset 0 -2px var(--cyan)}
    .nav-tools{display:flex;align-items:center;gap:13px}
    .status{color:var(--muted);font-size:12px;white-space:nowrap}.status i{display:inline-block;width:7px;height:7px;background:var(--cyan);border-radius:50%;margin-right:6px;box-shadow:0 0 10px var(--cyan)}
    .icon-btn{width:38px;height:38px;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:11px;transition:.25s}
    .icon-btn:hover{color:var(--white);border-color:var(--blue);background:rgba(76,169,255,.1)}
    .menu-btn{display:none}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:12px;border:1px solid transparent;font-weight:700;font-size:14px;transition:transform .25s,box-shadow .25s,background .25s}
    .btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--blue);color:#041222;box-shadow:0 10px 25px rgba(76,169,255,.22)}
    .btn-primary:hover{background:#78bdff;box-shadow:0 14px 32px rgba(76,169,255,.3)}
    .btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.03)}.btn-ghost:hover{border-color:var(--cyan);background:rgba(97,224,208,.08)}
    .eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--cyan);font-size:12px;font-weight:800;letter-spacing:.16em}
    .eyebrow:before{content:"";width:22px;height:1px;background:var(--cyan)}
    h1,h2,h3,p{margin-top:0}h1{font-size:clamp(38px,5vw,68px);line-height:1.15;letter-spacing:-.04em;margin:18px 0}
    h2{font-size:clamp(28px,3.5vw,46px);line-height:1.25;letter-spacing:-.03em;margin:12px 0 16px}h3{font-size:20px;line-height:1.4}
    .lead{font-size:18px;color:#c7d5e8;line-height:1.9;max-width:700px}.section{padding:96px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:38px}.section-head p{max-width:590px;color:var(--muted);margin-bottom:0}
    .hero{min-height:585px;display:flex;align-items:center;position:relative;overflow:hidden;background-image:linear-gradient(90deg,rgba(7,17,31,.98) 9%,rgba(7,17,31,.78) 56%,rgba(7,17,31,.38)),url("/assets/images/backpic/back-2.webp");background-size:cover;background-position:center}
    .hero:after{content:"";position:absolute;inset:auto 0 0;height:120px;background:linear-gradient(transparent,var(--navy));pointer-events:none}
    .hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr .82fr;gap:65px;align-items:center}.hero-copy{padding:55px 0}
    .hero-copy h1 span{color:var(--cyan)}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0 25px}
    .hero-points{display:flex;gap:24px;flex-wrap:wrap;color:var(--muted);font-size:13px}.hero-points strong{display:block;color:var(--white);font-size:21px;line-height:1.25}.hero-points div{padding-left:15px;border-left:1px solid var(--line)}
    .hero-panel{background:rgba(13,28,48,.86);border:1px solid rgba(164,193,229,.22);border-radius:26px;padding:24px;box-shadow:var(--shadow);transform:rotate(1.5deg)}
    .panel-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.panel-top small{color:var(--cyan)}.panel-tag{font-size:12px;color:var(--orange);border:1px solid rgba(255,182,91,.35);padding:3px 9px;border-radius:20px}
    .timeline{display:grid;gap:13px}.timeline-item{display:grid;grid-template-columns:72px 1fr;gap:13px;padding:15px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025)}
    .timeline-item time{font-size:12px;color:var(--cyan);padding-top:2px}.timeline-item b{display:block;font-size:14px}.timeline-item span{color:var(--muted);font-size:12px}
    .split{display:grid;grid-template-columns:.88fr 1.12fr;gap:70px;align-items:center}.split img{width:100%;height:390px;object-fit:cover;border-radius:var(--radius);border:1px solid var(--line)}
    .check-list{display:grid;gap:16px;margin:28px 0 0;padding:0;list-style:none}.check-list li{display:flex;gap:12px;color:#c6d4e8}.check-list li:before{content:"✓";display:grid;place-items:center;flex:0 0 24px;height:24px;color:#061525;background:var(--cyan);border-radius:50%;font-weight:900;margin-top:3px}
    .three-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.value-card,.quote-card,.faq-item,.process-card{border:1px solid var(--line);background:linear-gradient(145deg,rgba(17,38,64,.92),rgba(10,26,44,.9));border-radius:var(--radius);transition:.3s}
    .value-card{padding:28px;min-height:215px}.value-card:hover,.quote-card:hover,.process-card:hover{transform:translateY(-5px);border-color:rgba(97,224,208,.45);box-shadow:var(--shadow)}
    .value-card .num{color:var(--orange);font-size:13px;font-weight:800;letter-spacing:.15em}.value-card p,.quote-card p{color:var(--muted);font-size:14px}
    .dark-band{background:#0b192b;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .metric-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.metric{padding:28px;background:var(--panel);text-align:center}.metric strong{font-size:32px;color:var(--cyan);display:block}.metric span{font-size:13px;color:var(--muted)}
    .process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.process-card{padding:23px}.process-card b{display:block;color:var(--blue);font-size:13px;margin-bottom:24px}.process-card p{font-size:14px;color:var(--muted)}
    .quote-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:20px}.quote-card{padding:32px}.quote-card blockquote{font-size:22px;line-height:1.65;margin:0 0 20px}.quote-card cite{color:var(--cyan);font-style:normal;font-size:13px}
    .faq-list{display:grid;gap:12px;max-width:880px}.faq-item{padding:0 22px}.faq-item summary{cursor:pointer;padding:20px 0;font-weight:700;list-style:none}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:after{content:"＋";float:right;color:var(--cyan);font-size:22px}.faq-item[open] summary:after{content:"−"}.faq-item p{color:var(--muted);font-size:14px;padding:0 0 20px;margin:0}
    .cta{padding:66px 0;background:linear-gradient(120deg,#123454,#10263c);border:1px solid rgba(97,224,208,.22);border-radius:var(--radius);position:relative;overflow:hidden}.cta:after{content:"";position:absolute;width:300px;height:300px;border:1px solid rgba(97,224,208,.2);border-radius:50%;right:-80px;top:-130px}.cta-inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:30px;padding:0 54px}.cta p{color:#bdd0e5;max-width:650px;margin:0}
    .footer{padding:65px 0 24px;background:#050d18;border-top:1px solid var(--line)}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px}.footer p{color:var(--muted);font-size:14px;max-width:315px}.footer h3{font-size:14px;color:var(--white);margin-bottom:13px}.footer-grid>div:not(:first-child) a{display:block;color:var(--muted);font-size:13px;margin:7px 0;transition:.2s}.footer-grid>div a:hover{color:var(--cyan)}.footer-bottom{border-top:1px solid var(--line);margin-top:42px;padding-top:20px;display:flex;justify-content:space-between;gap:20px;color:var(--dim);font-size:12px}
    :focus-visible{outline:3px solid var(--orange);outline-offset:3px}
    @media(max-width:1024px){.nav{gap:14px}.nav-links a{padding:8px 8px}.status{display:none}.hero-grid{gap:30px}.section{padding:78px 0}.split{gap:38px}}
    @media(max-width:768px){.container{width:min(100% - 32px,var(--container))}.nav{height:68px}.nav-links{display:none;position:absolute;left:16px;right:16px;top:76px;padding:12px;background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch}.nav-links.open{display:flex}.nav-links a{padding:11px 14px}.nav-tools .btn,.nav-tools .icon-btn:not(.menu-btn){display:none}.menu-btn{display:block}.hero{min-height:auto}.hero-grid,.split,.quote-layout{grid-template-columns:1fr}.hero-copy{padding:75px 0 35px}.hero-panel{max-width:560px;margin:0 auto 65px}.three-grid,.process-grid{grid-template-columns:repeat(2,1fr)}.metric-row{grid-template-columns:repeat(2,1fr)}.section-head{display:block}.section-head p{margin-top:14px}.cta-inner{display:block;padding:0 28px}.cta .btn{margin-top:25px}.footer-grid{grid-template-columns:repeat(2,1fr)}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{display:block}.footer-bottom span{display:block;margin-bottom:10px}}
    @media(max-width:520px){h1{font-size:39px}.lead{font-size:16px}.section{padding:62px 0}.three-grid,.process-grid{grid-template-columns:1fr}.hero-points{gap:14px}.hero-points strong{font-size:18px}.timeline-item{grid-template-columns:58px 1fr}.split img{height:270px}.metric strong{font-size:26px}.footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}.cta{padding:45px 0}}

/* roulang page: category5 */
:root{
 --ink:#edf4ff;--muted:#9aabc4;--dim:#70819d;--navy:#07111f;--panel:#0d1c30;
 --panel2:#112640;--line:rgba(164,193,229,.16);--blue:#4ca9ff;--cyan:#61e0d0;
 --orange:#ffb65b;--white:#fff;--radius:22px;--radius-sm:14px;
 --shadow:0 22px 60px rgba(0,0,0,.26);--container:1200px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--navy);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-size:16px;line-height:1.8;letter-spacing:.01em}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
button,input{font:inherit}
button{cursor:pointer}
h1,h2,h3,h4,p{margin-top:0}
h1{font-size:clamp(36px,5vw,66px);line-height:1.16;letter-spacing:-.045em;margin-bottom:22px}
h2{font-size:clamp(27px,3.4vw,43px);line-height:1.28;letter-spacing:-.03em;margin-bottom:15px}
h3{font-size:20px;line-height:1.4;margin-bottom:10px}
.container{width:min(var(--container),calc(100% - 48px));margin:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(7,17,31,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav{height:76px;display:flex;align-items:center;gap:28px}
.brand{display:flex;align-items:center;gap:11px;min-width:max-content;font-size:21px;font-weight:800;letter-spacing:.06em}
.brand-mark{width:34px;height:34px;border-radius:11px;background:linear-gradient(145deg,var(--cyan),var(--blue));position:relative;box-shadow:0 7px 22px rgba(76,169,255,.3)}
.brand-mark:after{content:"";position:absolute;width:12px;height:12px;border:3px solid #081525;border-radius:50%;left:10px;top:8px}
.nav-links{display:flex;align-items:center;gap:5px;flex:1}
.nav-links a{padding:9px 13px;color:var(--muted);font-size:14px;border-radius:10px;transition:.25s}
.nav-links a:hover,.nav-links a.active{color:var(--white);background:rgba(76,169,255,.12)}
.nav-links a.active{box-shadow:inset 0 -2px var(--cyan)}
.nav-tools{display:flex;align-items:center;gap:13px}
.status{font-size:12px;color:var(--muted);white-space:nowrap}
.status i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--cyan);margin-right:7px;box-shadow:0 0 0 4px rgba(97,224,208,.1)}
.icon-btn{width:38px;height:38px;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:11px;transition:.25s}
.icon-btn:hover{color:var(--white);border-color:var(--blue);background:rgba(76,169,255,.1)}
.menu-btn{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:12px;border:1px solid transparent;font-weight:700;font-size:14px;transition:transform .25s,box-shadow .25s,background .25s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--blue);color:#041222;box-shadow:0 10px 25px rgba(76,169,255,.22)}
.btn-primary:hover{background:#78bdff;box-shadow:0 14px 32px rgba(76,169,255,.3)}
.btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.03)}
.btn-ghost:hover{border-color:var(--cyan);background:rgba(97,224,208,.08)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--cyan);font-size:12px;font-weight:800;letter-spacing:.16em}
.eyebrow:before{content:"";width:22px;height:1px;background:var(--cyan)}
.lead{font-size:18px;color:#c7d5e8;line-height:1.9;max-width:720px}
.section{padding:96px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:38px}
.section-head p{max-width:590px;color:var(--muted);margin-bottom:0}
.inner-hero{position:relative;overflow:hidden;padding:90px 0 104px;background-image:linear-gradient(90deg,rgba(7,17,31,.97),rgba(7,17,31,.7)),url("/assets/images/backpic/back-2.webp");background-size:cover;background-position:center}
.inner-hero:after{content:"";position:absolute;bottom:0;left:0;right:0;height:90px;background:linear-gradient(transparent,var(--navy))}
.inner-hero .container{position:relative;z-index:1}
.hero-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.badge{display:inline-flex;align-items:center;padding:6px 11px;border:1px solid rgba(97,224,208,.28);border-radius:30px;color:var(--cyan);background:rgba(97,224,208,.08);font-size:12px}
.split{display:grid;grid-template-columns:.85fr 1.15fr;gap:66px;align-items:center}
.split.reverse{grid-template-columns:1.15fr .85fr}
.image-frame{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);background:var(--panel)}
.image-frame img{width:100%;height:390px;object-fit:cover}
.text-block p{color:var(--muted)}
.list-check{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:14px}
.list-check li{position:relative;padding-left:31px;color:#c9d7e8}
.list-check li:before{content:"✓";position:absolute;left:0;top:1px;width:21px;height:21px;line-height:20px;text-align:center;border-radius:50%;background:rgba(97,224,208,.13);color:var(--cyan);font-weight:800}
.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.metric{padding:25px 22px;border:1px solid var(--line);border-radius:18px;background:rgba(17,38,64,.7)}
.metric strong{display:block;color:var(--white);font-size:30px;line-height:1.25}
.metric span{color:var(--muted);font-size:13px}
.panel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.value-card,.data-card,.quote-card,.faq-item{border:1px solid var(--line);background:linear-gradient(145deg,rgba(17,38,64,.92),rgba(10,26,44,.92));border-radius:var(--radius);transition:.3s}
.value-card,.data-card{padding:28px}
.value-card:hover,.data-card:hover,.quote-card:hover{transform:translateY(-5px);border-color:rgba(97,224,208,.45);box-shadow:var(--shadow)}
.card-number{color:var(--orange);font-weight:800;font-size:13px;letter-spacing:.12em}
.value-card p,.data-card p,.quote-card p{color:var(--muted);font-size:14px}
.data-card{min-height:220px}
.data-card h3{margin-top:25px}
.data-card .line{height:5px;border-radius:5px;background:rgba(255,255,255,.08);margin:19px 0 10px;overflow:hidden}
.data-card .line b{display:block;height:100%;background:linear-gradient(90deg,var(--cyan),var(--blue));border-radius:5px}
.compare{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.compare-box{padding:28px;border-radius:18px;background:var(--panel);border:1px solid var(--line)}
.compare-box h3{display:flex;justify-content:space-between}
.compare-box h3 span{color:var(--cyan);font-size:14px}
.bar{height:9px;border-radius:9px;background:#1a2c43;margin:17px 0}
.bar i{display:block;height:100%;border-radius:9px;background:var(--blue)}
.bar.cyan i{background:var(--cyan)}
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line)}
.process-item{padding:30px 24px 12px;border-right:1px solid var(--line);position:relative}
.process-item:last-child{border-right:0}
.process-item:before{content:"";position:absolute;top:-6px;left:24px;width:11px;height:11px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 5px var(--navy),0 0 0 6px rgba(97,224,208,.4)}
.process-item strong{color:var(--orange);font-size:13px}
.process-item p{color:var(--muted);font-size:14px}
.quote-card{padding:32px;display:grid;grid-template-columns:56px 1fr;gap:18px}
.quote-mark{width:56px;height:56px;border-radius:16px;background:rgba(76,169,255,.13);display:grid;place-items:center;color:var(--blue);font-size:30px}
.quote-card p{font-size:16px;color:#d1deee;margin-bottom:14px}
.faq-list{display:grid;gap:12px;max-width:900px}
.faq-item{padding:0 24px}
.faq-item button{width:100%;padding:20px 0;background:none;border:0;color:var(--ink);display:flex;justify-content:space-between;text-align:left;font-weight:700}
.faq-item button span{color:var(--cyan);font-size:22px;transition:.25s}
.faq-answer{display:none;color:var(--muted);font-size:14px;padding:0 0 20px}
.faq-item.open .faq-answer{display:block}
.faq-item.open button span{transform:rotate(45deg)}
.cta{padding:62px 0;background:linear-gradient(120deg,#123552,#0d2038);border-top:1px solid rgba(97,224,208,.2);border-bottom:1px solid var(--line)}
.cta-row{display:flex;justify-content:space-between;align-items:center;gap:35px}
.cta p{color:#b8cade;max-width:690px;margin-bottom:0}
.footer{padding:62px 0 22px;background:#050d18;border-top:1px solid var(--line)}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px}
.footer p,.footer a{color:var(--muted);font-size:14px}
.footer a{display:block;margin:7px 0;transition:.2s}
.footer a:hover{color:var(--cyan)}
.footer h3{font-size:14px;color:var(--white);margin-bottom:16px}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin-top:40px;padding-top:20px;color:var(--dim);font-size:12px}
:focus-visible{outline:3px solid rgba(97,224,208,.7);outline-offset:3px}
@media(max-width:1024px){
 .nav{gap:16px}.nav-links a{padding:8px 8px;font-size:13px}.status{display:none}
 .split,.split.reverse{grid-template-columns:1fr 1fr;gap:35px}.metric-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
 .container{width:min(var(--container),calc(100% - 34px))}
 .nav{height:68px}.nav-links{display:none;position:absolute;top:68px;left:0;right:0;padding:14px 17px;background:#091727;border-bottom:1px solid var(--line);box-shadow:var(--shadow);flex-direction:column;align-items:stretch}
 .nav-links.show{display:flex}.nav-links a{padding:11px 14px}.nav-tools .btn-primary,.icon-btn:not(.menu-btn){display:none}.menu-btn{display:block}
 .inner-hero{padding:70px 0 82px}.section{padding:70px 0}.section-head{display:block;margin-bottom:27px}
 .section-head p{margin-top:12px}.split,.split.reverse,.compare{grid-template-columns:1fr}.image-frame img{height:280px}
 .panel-grid{grid-template-columns:1fr 1fr}.process{grid-template-columns:1fr 1fr}.process-item{border-bottom:1px solid var(--line)}
 .footer-grid{grid-template-columns:1fr 1fr}.footer-bottom{display:block}.footer-bottom span{display:block;margin-bottom:10px}
 .cta-row{display:block}.cta-row .btn{margin-top:24px}
}
@media(max-width:520px){
 h1{font-size:37px}.lead{font-size:16px}.metric-grid,.panel-grid{grid-template-columns:1fr}
 .process{grid-template-columns:1fr}.process-item{border-right:0}.hero-meta{gap:7px}
 .footer-grid{grid-template-columns:1fr}.section{padding:58px 0}
}

/* roulang page: category6 */
:root{
 --ink:#edf4ff;--muted:#9aabc4;--dim:#70819d;--navy:#07111f;--panel:#0d1c30;
 --panel2:#112640;--line:rgba(164,193,229,.16);--blue:#4ca9ff;--cyan:#61e0d0;
 --orange:#ffb65b;--white:#fff;--radius:22px;--radius-sm:14px;
 --shadow:0 22px 60px rgba(0,0,0,.26);--container:1200px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--navy);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-size:16px;line-height:1.8;letter-spacing:.01em}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
button,input{font:inherit}
button{cursor:pointer}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(36px,5vw,68px);line-height:1.16;letter-spacing:-.04em;margin-bottom:24px}
h2{font-size:clamp(28px,3vw,42px);line-height:1.25;letter-spacing:-.03em;margin-bottom:16px}
h3{font-size:20px;line-height:1.4;margin-bottom:10px}
.container{width:min(var(--container),calc(100% - 48px));margin:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(7,17,31,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav{height:76px;display:flex;align-items:center;gap:28px}
.brand{display:flex;align-items:center;gap:11px;min-width:max-content;font-size:21px;font-weight:800;letter-spacing:.06em}
.brand-mark{width:34px;height:34px;border-radius:11px;background:linear-gradient(145deg,var(--cyan),var(--blue));position:relative;box-shadow:0 7px 22px rgba(76,169,255,.3)}
.brand-mark:after{content:"";position:absolute;width:12px;height:12px;border:3px solid #081525;border-radius:50%;left:10px;top:8px}
.nav-links{display:flex;align-items:center;gap:5px;flex:1}
.nav-links a{padding:9px 13px;color:var(--muted);font-size:14px;border-radius:10px;transition:.25s}
.nav-links a:hover,.nav-links a.active{color:var(--white);background:rgba(76,169,255,.12)}
.nav-links a.active{box-shadow:inset 0 -2px var(--cyan)}
.nav-tools{display:flex;align-items:center;gap:13px}
.status{font-size:12px;color:var(--muted);white-space:nowrap}
.status i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--cyan);margin-right:6px;box-shadow:0 0 0 4px rgba(97,224,208,.1)}
.icon-btn{width:38px;height:38px;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:11px;transition:.25s}
.icon-btn:hover{color:var(--white);border-color:var(--blue);background:rgba(76,169,255,.1)}
.menu-btn{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:12px;border:1px solid transparent;font-weight:700;font-size:14px;transition:transform .25s,box-shadow .25s,background .25s}
.btn:hover{transform:translateY(-2px)}
.btn:focus,.icon-btn:focus,input:focus{outline:3px solid rgba(97,224,208,.35);outline-offset:2px}
.btn-primary{background:var(--blue);color:#041222;box-shadow:0 10px 25px rgba(76,169,255,.22)}
.btn-primary:hover{background:#78bdff;box-shadow:0 14px 32px rgba(76,169,255,.3)}
.btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.03)}
.btn-ghost:hover{border-color:var(--cyan);background:rgba(97,224,208,.08)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--cyan);font-size:12px;font-weight:800;letter-spacing:.16em}
.eyebrow:before{content:"";width:22px;height:1px;background:var(--cyan)}
.lead{font-size:18px;color:#c7d5e8;line-height:1.9;max-width:680px}
.hero{min-height:600px;display:flex;align-items:center;position:relative;overflow:hidden;background-image:linear-gradient(90deg,rgba(7,17,31,.98) 8%,rgba(7,17,31,.78) 53%,rgba(7,17,31,.35)),url("/assets/images/backpic/back-3.webp");background-size:cover;background-position:center}
.hero:after{content:"";position:absolute;inset:auto 0 0;height:150px;background:linear-gradient(transparent,var(--navy));pointer-events:none}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr .72fr;gap:70px;align-items:center}
.hero-copy{padding:70px 0}
.hero-copy h1 span{color:var(--cyan)}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0 28px}
.hero-points{display:flex;gap:24px;flex-wrap:wrap;color:var(--muted);font-size:13px}
.hero-points strong{display:block;color:var(--white);font-size:22px;line-height:1.2}
.hero-points div{padding-left:15px;border-left:1px solid var(--line)}
.vertical-panel{width:280px;margin-left:auto;padding:13px;border:1px solid rgba(164,193,229,.26);border-radius:25px;background:rgba(7,17,31,.72);box-shadow:var(--shadow);transform:rotate(3deg)}
.vertical-panel img{height:390px;width:100%;object-fit:cover;border-radius:17px;opacity:.8}
.panel-caption{padding:15px 8px 7px;font-size:13px;color:var(--muted)}
.panel-caption b{display:block;color:var(--white);font-size:17px}
.section{padding:94px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:36px}
.section-head p{max-width:590px;color:var(--muted);margin-bottom:0}
.story-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:70px;align-items:center}
.story-image{position:relative}
.story-image img{width:100%;height:420px;object-fit:cover;border-radius:var(--radius);border:1px solid var(--line)}
.image-note{position:absolute;bottom:18px;left:18px;padding:10px 14px;border-radius:12px;background:rgba(7,17,31,.83);font-size:13px;color:var(--cyan)}
.copy p{color:var(--muted)}
.three-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.value-card,.quote-card,.faq-item,.review-card{border:1px solid var(--line);background:linear-gradient(145deg,rgba(17,38,64,.9),rgba(10,26,44,.9));border-radius:var(--radius);transition:.3s}
.value-card{padding:28px;min-height:215px}
.value-card:hover,.quote-card:hover,.review-card:hover{transform:translateY(-5px);border-color:rgba(97,224,208,.45);box-shadow:var(--shadow)}
.value-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:rgba(97,224,208,.1);color:var(--cyan);font-size:20px;margin-bottom:20px}
.value-card p,.quote-card p,.review-card p{color:var(--muted);font-size:14px}
.review-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:20px}
.review-card{overflow:hidden}
.review-card img{height:225px;width:100%;object-fit:cover}
.review-body{padding:24px}
.review-body small{color:var(--cyan)}
.review-body a{color:var(--orange);font-size:14px;font-weight:700}
.review-main{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.review-main .review-card:first-child{grid-column:span 2}
.review-main .review-card:first-child img{height:285px}
.review-side{padding:28px;border-radius:var(--radius);background:#102b45;border:1px solid rgba(97,224,208,.22)}
.review-side ul,.check-list{list-style:none;padding:0;margin:20px 0 0}
.review-side li,.check-list li{padding:13px 0;border-bottom:1px solid var(--line);color:var(--muted)}
.review-side li:before,.check-list li:before{content:"✓";color:var(--cyan);margin-right:10px}
.stat-band{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stat{padding:27px 20px;border-right:1px solid var(--line)}
.stat:last-child{border:0}
.stat strong{font-size:34px;color:var(--white);display:block}
.stat span{font-size:13px;color:var(--muted)}
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.step{position:relative;padding:25px 22px 22px;border-left:2px solid var(--blue);background:rgba(13,28,48,.7);border-radius:0 var(--radius-sm) var(--radius-sm) 0}
.step b{color:var(--orange);font-size:13px;letter-spacing:.08em}
.step p{color:var(--muted);font-size:14px;margin:12px 0 0}
.quote-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.quote-card{padding:30px}
.quote-mark{font-size:44px;color:var(--cyan);line-height:1}
.quote-person{display:flex;align-items:center;gap:12px;margin-top:22px}
.avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(145deg,var(--blue),var(--cyan));display:grid;place-items:center;color:#07111f;font-weight:800}
.quote-person small{color:var(--muted)}
.faq-list{display:grid;gap:12px;max-width:900px}
.faq-item{padding:21px 25px}
.faq-item summary{cursor:pointer;font-weight:700;list-style:none;position:relative;padding-right:30px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:"＋";position:absolute;right:0;color:var(--cyan);font-size:20px}
.faq-item[open] summary:after{content:"－"}
.faq-item p{color:var(--muted);font-size:14px;margin:13px 0 0}
.cta{padding:58px 64px;border-radius:var(--radius);background:linear-gradient(120deg,#133754,#0c2138);border:1px solid rgba(97,224,208,.24);display:flex;justify-content:space-between;align-items:center;gap:30px}
.cta p{color:#bdd0e5;max-width:650px;margin-bottom:0}
.subscribe{display:flex;gap:10px;margin-top:22px}
.subscribe input{width:260px;height:46px;border:1px solid var(--line);border-radius:12px;background:rgba(7,17,31,.7);color:var(--ink);padding:0 15px}
.footer{padding:65px 0 25px;border-top:1px solid var(--line);background:#06101d}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px}
.footer p,.footer a{color:var(--muted);font-size:14px}
.footer a{display:block;margin:8px 0;transition:.2s}
.footer a:hover{color:var(--cyan)}
.footer h3{font-size:15px;color:var(--white)}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin-top:40px;padding-top:20px;color:var(--dim);font-size:12px}
@media(max-width:1024px){.nav{gap:15px}.nav-links a{padding:8px 7px}.status{display:none}.hero-grid{gap:35px}.timeline{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){
 .container{width:min(var(--container),calc(100% - 32px))}.nav{height:68px}.nav-tools .btn-primary,.nav-tools .icon-btn:not(.menu-btn){display:none}.menu-btn{display:block}
 .nav-links{display:none;position:absolute;top:68px;left:16px;right:16px;padding:12px;background:#0b1c30;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch}
 .nav-links.open{display:flex}.nav-links a{padding:11px 14px}.hero{min-height:auto}.hero-copy{padding:70px 0 45px}.hero-grid,.story-grid,.review-layout{grid-template-columns:1fr}.vertical-panel{margin:0 auto 60px;transform:rotate(0)}.section{padding:70px 0}.section-head{display:block}.section-head p{margin-top:12px}.three-grid,.quote-grid{grid-template-columns:1fr}.review-main{grid-template-columns:1fr}.review-main .review-card:first-child{grid-column:auto}.stat-band{grid-template-columns:1fr 1fr}.stat:nth-child(2){border-right:0}.stat:nth-child(-n+2){border-bottom:1px solid var(--line)}.footer-grid{grid-template-columns:1fr 1fr}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:9px}}
@media(max-width:520px){h1{font-size:39px}.lead{font-size:16px}.hero-actions .btn{width:100%}.story-image img{height:300px}.timeline{grid-template-columns:1fr}.cta{padding:32px 23px;display:block}.subscribe{display:block}.subscribe input{width:100%;margin-bottom:10px}.subscribe .btn{width:100%}.footer-grid{grid-template-columns:1fr}.stat strong{font-size:28px}}
