/* roulang page: index */
:root{
      --ink:#f5f7ff;
      --muted:#aeb8d3;
      --deep:#07111f;
      --deep-2:#0b1830;
      --panel:#101f39;
      --panel-2:#132746;
      --line:rgba(181,203,242,.16);
      --cyan:#5ee7d1;
      --cyan-2:#2bc7b1;
      --gold:#ffc96b;
      --pink:#ff789e;
      --white:#fff;
      --radius:22px;
      --radius-sm:14px;
      --shadow:0 22px 70px rgba(0,0,0,.25);
      --soft-shadow:0 12px 34px rgba(0,0,0,.18);
      --max:1240px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--deep);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",Arial,sans-serif;font-size:16px;line-height:1.75;overflow-x:hidden}
    a{color:inherit;text-decoration:none;transition:.25s ease}
    img{display:block;max-width:100%;height:auto}
    button,input{font:inherit}
    button:focus,a:focus,input:focus{outline:3px solid rgba(94,231,209,.42);outline-offset:3px}
    .container{width:min(var(--max),calc(100% - 40px));margin:0 auto}
    .section{padding:104px 0;position:relative}
    .eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--cyan);font-size:13px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
    .eyebrow:before{content:"";display:block;width:26px;height:2px;background:var(--cyan)}
    .section-head{max-width:720px;margin-bottom:48px}
    .section-head h2{font-size:clamp(30px,4vw,52px);line-height:1.18;margin:14px 0 17px;letter-spacing:-.04em}
    .section-head p{color:var(--muted);font-size:17px;margin:0}
    .topbar{background:#050c18;border-bottom:1px solid var(--line);color:#cad4e9;font-size:13px}
    .topbar-inner{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:20px}
    .topbar strong{color:var(--gold)}
    .header{position:sticky;top:0;z-index:50;background:rgba(7,17,31,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
    .header-main{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:25px}
    .brand{display:flex;align-items:center;gap:12px;font-weight:900;font-size:24px;letter-spacing:-.06em;white-space:nowrap}
    .brand-mark{width:39px;height:39px;border-radius:13px;background:linear-gradient(140deg,var(--cyan),#77a5ff);color:#07111f;display:grid;place-items:center;font-weight:900;box-shadow:0 8px 24px rgba(94,231,209,.2)}
    .brand small{display:block;color:var(--muted);font-size:10px;font-weight:500;letter-spacing:.1em;line-height:1;margin-top:2px}
    .nav-grid{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
    .nav-item{display:flex;align-items:center;gap:8px;padding:10px 13px;border-radius:12px;color:#c5cee1;font-size:14px}
    .nav-item:hover,.nav-item.active{background:rgba(94,231,209,.12);color:var(--cyan)}
    .nav-icon{width:22px;height:22px;border:1px solid currentColor;border-radius:7px;display:grid;place-items:center;font-size:11px}
    .header-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid transparent;border-radius:13px;padding:13px 22px;font-weight:800;line-height:1;cursor:pointer}
    .header-cta,.btn-primary{background:var(--cyan);color:#06131e;box-shadow:0 12px 26px rgba(43,199,177,.2)}
    .header-cta:hover,.btn-primary:hover{background:#87f5e3;color:#06131e;transform:translateY(-2px)}
    .btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.035)}
    .btn-ghost:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(94,231,209,.08)}
    .btn-gold{background:var(--gold);color:#211707}
    .btn-gold:hover{background:#ffe09d;color:#211707;transform:translateY(-2px)}
    .hero{min-height:760px;display:flex;align-items:center;background-image:linear-gradient(90deg,rgba(7,17,31,.96) 0%,rgba(7,17,31,.76) 48%,rgba(7,17,31,.3) 100%),url("/assets/images/backpic/back-1.webp");background-size:cover;background-position:center;overflow:hidden}
    .hero:after{content:"";position:absolute;inset:auto 0 0;height:180px;background:linear-gradient(transparent,var(--deep));pointer-events:none}
    .hero-layout{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}
    .hero h1{font-size:clamp(46px,7vw,86px);line-height:1.02;letter-spacing:-.075em;margin:18px 0 24px;max-width:680px}
    .hero h1 span{color:var(--cyan)}
    .hero-copy{font-size:19px;color:#d1d9e9;max-width:660px}
    .hero-actions{display:flex;gap:13px;flex-wrap:wrap;margin:33px 0 34px}
    .hero-note{color:#91a0bc;font-size:13px}
    .hero-panel{position:relative;border:1px solid rgba(255,255,255,.18);border-radius:28px;background:rgba(9,22,42,.73);box-shadow:var(--shadow);padding:27px;backdrop-filter:blur(16px)}
    .panel-top{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:19px;margin-bottom:20px}
    .panel-top strong{font-size:18px}
    .live-dot{color:var(--cyan);font-size:12px}.live-dot:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--cyan);margin-right:6px;box-shadow:0 0 0 5px rgba(94,231,209,.1)}
    .deal{display:grid;grid-template-columns:92px 1fr;gap:17px;align-items:center;padding:14px 0}
    .deal img{width:92px;height:92px;object-fit:cover;border-radius:16px}
    .deal h3{font-size:19px;margin:0 0 4px}.deal p{color:var(--muted);font-size:13px;margin:0}
    .deal-tag{display:inline-block;color:#09151d;background:var(--gold);border-radius:6px;padding:2px 7px;font-size:11px;font-weight:800;margin-bottom:7px}
    .timer{display:flex;gap:8px;margin:22px 0}.time-box{background:#071426;border:1px solid var(--line);border-radius:12px;padding:8px 12px;text-align:center;min-width:58px}.time-box b{font-size:22px;display:block;color:var(--gold);line-height:1.15}.time-box span{font-size:11px;color:var(--muted)}
    .flash{background:linear-gradient(100deg,#11283a,#14253e);border-block:1px solid var(--line)}
    .flash-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:82px}
    .flash-title{display:flex;align-items:center;gap:15px}.flash-title b{color:var(--gold);font-size:20px}.flash-title span{color:#d2dced;font-size:14px}
    .flash-clock{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:13px}.flash-clock strong{color:var(--gold);font-size:19px}
    .feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .feature-card{padding:29px;border:1px solid var(--line);background:var(--panel);border-radius:var(--radius);min-height:230px;transition:.3s}
    .feature-card:hover,.content-card:hover,.quote:hover{transform:translateY(-6px);border-color:rgba(94,231,209,.5);box-shadow:var(--soft-shadow)}
    .feature-no{color:var(--cyan);font-size:13px;font-weight:900;letter-spacing:.1em}
    .feature-card h3{font-size:23px;margin:20px 0 10px}.feature-card p{color:var(--muted);font-size:14px;margin:0}
    .quick{background:#0a172b}
    .quick-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:65px;align-items:start}
    .quick-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
    .quick-item{padding:22px;background:var(--panel);border:1px solid var(--line);border-radius:16px}
    .quick-item b{display:flex;gap:10px;align-items:center;font-size:16px}.quick-item b i{color:var(--cyan);font-style:normal;font-size:12px;border:1px solid var(--cyan);border-radius:50%;width:20px;height:20px;text-align:center;line-height:18px}.quick-item p{color:var(--muted);font-size:13px;margin:10px 0 0}
    .hot-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:22px}
    .hot-list{background:var(--panel);border-radius:var(--radius);border:1px solid var(--line);overflow:hidden}
    .hot-row{display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:16px;padding:21px 24px;border-bottom:1px solid var(--line)}.hot-row:last-child{border-bottom:0}.rank{font-size:26px;font-weight:900;color:#526887}.hot-row:nth-child(1) .rank{color:var(--gold)}.hot-row h3{font-size:17px;margin:0}.hot-row p{font-size:13px;color:var(--muted);margin:2px 0 0}.hot-row a{color:var(--cyan);font-size:13px;font-weight:700}
    .spotlight{position:relative;min-height:380px;border-radius:var(--radius);overflow:hidden;background:url("/assets/images/coverpic/cover-4.webp") center/cover}.spotlight:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,13,26,.95),rgba(5,13,26,.08))}.spotlight-content{position:absolute;z-index:1;bottom:27px;left:27px;right:27px}.spotlight h3{font-size:28px;line-height:1.2;margin:10px 0}.spotlight p{color:#ced7e8;font-size:14px}
    .scene{background:#0d1e35}.scene-layout{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.scene-image{border-radius:25px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}.scene-image img{width:100%;height:430px;object-fit:cover}.step{display:flex;gap:18px;padding:18px 0;border-bottom:1px solid var(--line)}.step:last-child{border:0}.step-num{width:35px;height:35px;flex:none;border-radius:50%;display:grid;place-items:center;background:rgba(94,231,209,.14);color:var(--cyan);font-weight:800}.step h3{font-size:18px;margin:0 0 4px}.step p{color:var(--muted);font-size:14px;margin:0}
    .category-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:13px}.category-tile{padding:23px 15px;text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:18px}.category-tile:hover{background:var(--panel-2);border-color:var(--cyan);transform:translateY(-4px)}.category-tile .tile-icon{margin:0 auto 13px;width:40px;height:40px;border-radius:13px;background:rgba(94,231,209,.12);display:grid;place-items:center;color:var(--cyan);font-weight:900}.category-tile h3{font-size:15px;margin:0}.category-tile p{font-size:12px;color:var(--muted);margin:5px 0 0}
    .trust{background:linear-gradient(120deg,#101e35,#0b1629)}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.trust-item{padding:25px;border-left:2px solid var(--cyan);background:rgba(255,255,255,.035)}.trust-item strong{display:block;font-size:30px;color:var(--white);line-height:1.2}.trust-item span{font-size:13px;color:var(--muted)}
    .quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.quote{padding:27px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);transition:.3s}.quote p{font-size:16px;color:#d8e0ed;margin:0 0 22px}.quote cite{font-style:normal;font-size:13px;color:var(--cyan)}
    .safe{background:#06101e}.safe-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:55px}.safe-lead{padding:35px;border:1px solid rgba(94,231,209,.26);border-radius:var(--radius);background:linear-gradient(145deg,rgba(94,231,209,.1),rgba(255,255,255,.025))}.shield{font-size:55px;color:var(--cyan);line-height:1}.safe-lead h3{font-size:27px;margin:22px 0 10px}.safe-lead p{color:var(--muted);font-size:14px}.safe-list{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.safe-card{padding:23px;background:var(--panel);border:1px solid var(--line);border-radius:16px}.safe-card h3{font-size:17px;margin:0 0 7px;color:var(--gold)}.safe-card p{font-size:13px;color:var(--muted);margin:0}
    .app{background:url("/assets/images/backpic/back-2.webp") center/cover;position:relative}.app:before{content:"";position:absolute;inset:0;background:rgba(7,17,31,.76)}.app .container{position:relative}.app-layout{display:grid;grid-template-columns:1fr .8fr;gap:50px;align-items:center}.app h2{font-size:clamp(32px,4vw,55px);line-height:1.15;margin:13px 0}.app p{color:#d1d9e9;max-width:640px}.download-box{padding:29px;border-radius:var(--radius);background:rgba(9,21,39,.83);border:1px solid var(--line)}.download-box h3{margin:0 0 12px;font-size:21px}.download-row{display:flex;gap:10px;flex-wrap:wrap}.download-row input{flex:1;min-width:170px;border:1px solid var(--line);background:#071426;color:var(--white);border-radius:11px;padding:12px 14px}.download-box small{display:block;color:var(--muted);font-size:12px;margin-top:12px}
    .news{background:#091628}.news-layout{display:grid;grid-template-columns:1.25fr .75fr;gap:25px}.news-list,.news-feature{border:1px solid var(--line);background:var(--panel);border-radius:var(--radius);overflow:hidden}.news-item{display:grid;grid-template-columns:110px 1fr auto;align-items:center;gap:18px;padding:22px 25px;border-bottom:1px solid var(--line)}.news-item:last-child{border-bottom:0}.news-date{color:var(--gold);font-size:13px}.news-item h3{font-size:17px;margin:0}.news-item p{color:var(--muted);font-size:13px;margin:3px 0 0;line-height:1.6}.news-item a{font-size:12px;color:var(--cyan);white-space:nowrap}.news-feature img{width:100%;height:190px;object-fit:cover}.news-feature-content{padding:24px}.news-feature h3{font-size:24px;line-height:1.3;margin:0 0 10px}.news-feature p{color:var(--muted);font-size:14px;margin:0 0 18px}
    .faq-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.faq-item{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:21px 23px}.faq-item summary{cursor:pointer;font-weight:800;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:22px;top:-4px}.faq-item[open] summary:after{content:"−"}.faq-item p{color:var(--muted);font-size:14px;margin:14px 0 0}
    .brand-story{background:#0d1a2e}.story-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:55px;align-items:start}.story-image{border-radius:25px;overflow:hidden;position:sticky;top:110px}.story-image img{width:100%;height:400px;object-fit:cover}.story-copy p{color:#c5cee0;font-size:16px;margin:0 0 18px}.story-points{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;margin-top:28px}.story-point{padding:18px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.035)}.story-point b{color:var(--cyan);display:block;margin-bottom:4px}.story-point span{font-size:13px;color:var(--muted)}
    .cta{padding:90px 0;background:linear-gradient(115deg,#133b4b,#17294a);text-align:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.cta h2{font-size:clamp(32px,5vw,60px);line-height:1.1;margin:12px auto 16px;max-width:780px}.cta p{color:#d4deed;max-width:700px;margin:0 auto 27px}.cta-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
    .footer{background:#050c18;padding:65px 0 30px}.footer-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:35px;padding-bottom:45px;border-bottom:1px solid var(--line)}.footer h3{font-size:15px;margin:0 0 15px}.footer p,.footer a{font-size:13px;color:var(--muted)}.footer a:hover{color:var(--cyan)}.footer-links{display:flex;flex-direction:column;gap:7px}.footer-brand p{max-width:300px}.footer-bottom{display:flex;justify-content:space-between;gap:20px;align-items:center;padding-top:22px;color:#71809c;font-size:12px}.float-cta{position:fixed;right:22px;bottom:22px;z-index:40;background:var(--gold);color:#211707;padding:13px 18px;border-radius:50px;font-size:13px;font-weight:900;box-shadow:var(--shadow)}.float-cta:hover{transform:translateY(-3px);background:#ffe09d}
    @media(max-width:1024px){.nav-grid{max-width:680px}.hero-layout,.scene-layout,.safe-layout,.app-layout,.story-layout{gap:32px}.category-grid{grid-template-columns:repeat(3,1fr)}.footer-grid{grid-template-columns:1.3fr repeat(2,1fr)}}
    @media(max-width:768px){.topbar-inner{justify-content:center;text-align:center}.topbar-inner span{display:none}.header-main{align-items:flex-start;padding:15px 0;flex-direction:column}.nav-grid{width:100%;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px}.nav-item{flex:none}.header-cta{position:absolute;right:20px;top:15px}.hero{min-height:760px}.hero-layout,.hot-layout,.quick-layout,.news-layout,.scene-layout,.safe-layout,.app-layout,.story-layout{grid-template-columns:1fr}.hero-panel{max-width:560px}.feature-grid,.quotes{grid-template-columns:1fr}.trust-grid{grid-template-columns:repeat(2,1fr)}.story-image{position:static}.news-item{grid-template-columns:80px 1fr}.news-item a{display:none}.section{padding:76px 0}.section-head{margin-bottom:30px}}
    @media(max-width:520px){.container{width:min(var(--max),calc(100% - 28px))}.brand{font-size:21px}.header-cta{display:none}.hero h1{font-size:49px}.hero-copy{font-size:16px}.hero-actions .btn{width:100%}.hero-panel{padding:20px}.flash-inner{align-items:flex-start;flex-direction:column;padding:18px 0}.flash-clock{width:100%;justify-content:space-between}.quick-list,.safe-list,.faq-grid,.story-points{grid-template-columns:1fr}.category-grid{grid-template-columns:repeat(2,1fr)}.trust-grid{grid-template-columns:1fr 1fr}.trust-item strong{font-size:25px}.news-item{grid-template-columns:1fr;gap:3px;padding:18px}.news-date{font-size:12px}.download-row{flex-direction:column}.download-row .btn{width:100%}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.footer-bottom{align-items:flex-start;flex-direction:column}.float-cta{right:14px;bottom:14px}}

/* roulang page: category3 */
:root{
      --ink:#f5f7ff;
      --muted:#aeb8d3;
      --deep:#07111f;
      --deep-2:#0b1830;
      --panel:#101f39;
      --panel-2:#132746;
      --line:rgba(181,203,242,.16);
      --cyan:#5ee7d1;
      --cyan-2:#2bc7b1;
      --gold:#ffc96b;
      --pink:#ff789e;
      --white:#fff;
      --radius:22px;
      --radius-sm:14px;
      --shadow:0 22px 70px rgba(0,0,0,.25);
      --soft-shadow:0 12px 34px rgba(0,0,0,.18);
      --max:1240px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--deep);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",Arial,sans-serif;font-size:16px;line-height:1.75;overflow-x:hidden}
    a{color:inherit;text-decoration:none;transition:.25s ease}
    img{display:block;max-width:100%;height:auto}
    button,input{font:inherit}
    button:focus,a:focus,input:focus{outline:3px solid rgba(94,231,209,.42);outline-offset:3px}
    .container{width:min(var(--max),calc(100% - 40px));margin:0 auto}
    .section{padding:96px 0;position:relative}
    .eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--cyan);font-size:13px;font-weight:700;letter-spacing:.13em}
    .eyebrow:before{content:"";display:block;width:26px;height:2px;background:var(--cyan)}
    .section-head{max-width:760px;margin-bottom:42px}
    .section-head h2{font-size:clamp(30px,4vw,52px);line-height:1.18;margin:14px 0 17px;letter-spacing:-.04em}
    .section-head p{color:var(--muted);font-size:17px;margin:0}
    .topbar{background:#050c18;border-bottom:1px solid var(--line);color:#cad4e9;font-size:13px}
    .topbar-inner{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:20px}
    .topbar strong{color:var(--gold)}
    .header{position:sticky;top:0;z-index:50;background:rgba(7,17,31,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
    .header-main{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:25px}
    .brand{display:flex;align-items:center;gap:12px;font-weight:900;font-size:24px;letter-spacing:-.06em;white-space:nowrap}
    .brand-mark{width:39px;height:39px;border-radius:13px;background:linear-gradient(140deg,var(--cyan),#77a5ff);color:#07111f;display:grid;place-items:center;font-weight:900;box-shadow:0 8px 24px rgba(94,231,209,.2)}
    .brand small{display:block;color:var(--muted);font-size:10px;font-weight:500;letter-spacing:.1em;line-height:1;margin-top:2px}
    .nav-grid{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
    .nav-item{display:flex;align-items:center;gap:8px;padding:10px 13px;border-radius:12px;color:#c5cee1;font-size:14px}
    .nav-item:hover,.nav-item.active{background:rgba(94,231,209,.12);color:var(--cyan)}
    .nav-icon{width:22px;height:22px;border:1px solid currentColor;border-radius:7px;display:grid;place-items:center;font-size:11px}
    .header-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid transparent;border-radius:13px;padding:13px 22px;font-weight:800;line-height:1;cursor:pointer}
    .header-cta,.btn-primary{background:var(--cyan);color:#06131e;box-shadow:0 12px 26px rgba(43,199,177,.2)}
    .header-cta:hover,.btn-primary:hover{background:#87f5e3;color:#06131e;transform:translateY(-2px)}
    .btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.035)}
    .btn-ghost:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(94,231,209,.08)}
    .btn-gold{background:var(--gold);color:#211707}
    .btn-gold:hover{background:#ffe09d;color:#211707;transform:translateY(-2px)}
    .page-hero{padding:88px 0 84px;background-image:linear-gradient(90deg,rgba(7,17,31,.97),rgba(7,17,31,.75)),url("/assets/images/backpic/back-2.webp");background-size:cover;background-position:center;border-bottom:1px solid var(--line)}
    .page-hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:55px;align-items:center}
    .page-hero h1{font-size:clamp(44px,6vw,76px);line-height:1.04;letter-spacing:-.07em;margin:18px 0 22px}
    .page-hero h1 span{color:var(--cyan)}
    .page-hero p{max-width:690px;color:#d2dced;font-size:18px;margin:0 0 28px}
    .hero-actions{display:flex;gap:13px;flex-wrap:wrap}
    .hero-art{position:relative;min-height:345px;border-radius:30px;overflow:hidden;border:1px solid rgba(255,255,255,.18);box-shadow:var(--shadow);background:var(--panel)}
    .hero-art img{width:100%;height:345px;object-fit:cover;opacity:.74}
    .hero-art:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,17,31,.9),transparent 70%)}
    .art-label{position:absolute;z-index:2;left:26px;right:26px;bottom:24px}
    .art-label b{display:block;font-size:25px}
    .art-label span{color:var(--muted);font-size:14px}
    .activity-layout{display:grid;grid-template-columns:1.25fr .75fr;gap:24px;align-items:stretch}
    .activity-feature{min-height:390px;border-radius:var(--radius);overflow:hidden;position:relative;border:1px solid var(--line);background:var(--panel)}
    .activity-feature img{width:100%;height:100%;min-height:390px;object-fit:cover;opacity:.7}
    .activity-feature:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,17,31,.95),rgba(7,17,31,.08))}
    .feature-content{position:absolute;z-index:2;left:32px;right:32px;bottom:28px}
    .badge{display:inline-flex;padding:5px 10px;border-radius:99px;background:rgba(94,231,209,.14);border:1px solid rgba(94,231,209,.35);color:var(--cyan);font-size:12px;font-weight:700}
    .feature-content h3{font-size:30px;line-height:1.25;margin:15px 0 8px}
    .feature-content p{color:#d2dced;margin:0 0 18px}
    .side-stack{display:grid;gap:18px}
    .mini-panel,.info-card,.quote,.step,.faq-item,.detail-box{border:1px solid var(--line);background:var(--panel);border-radius:var(--radius);transition:.3s}
    .mini-panel{padding:26px}
    .mini-panel:hover,.info-card:hover,.quote:hover,.step:hover{transform:translateY(-5px);border-color:rgba(94,231,209,.48);box-shadow:var(--soft-shadow)}
    .mini-panel strong{display:flex;align-items:center;justify-content:space-between;font-size:19px}
    .mini-panel strong span{color:var(--gold);font-size:24px}
    .mini-panel p{color:var(--muted);font-size:14px;margin:13px 0 0}
    .activity-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .info-card{padding:27px;min-height:220px}
    .card-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:rgba(94,231,209,.12);color:var(--cyan);font-size:20px;margin-bottom:20px}
    .info-card h3{font-size:21px;margin:0 0 9px}
    .info-card p{color:var(--muted);font-size:14px;margin:0}
    .dark-band{background:var(--deep-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
    .step{padding:25px;border-radius:0;background:transparent;border-width:1px 0 1px 1px}
    .step:first-child{border-radius:var(--radius) 0 0 var(--radius)}
    .step:last-child{border-right-width:1px;border-radius:0 var(--radius) var(--radius) 0}
    .step-no{color:var(--gold);font-size:13px;font-weight:900;letter-spacing:.12em}
    .step h3{font-size:19px;margin:16px 0 7px}
    .step p{color:var(--muted);font-size:14px;margin:0}
    .split{display:grid;grid-template-columns:.85fr 1.15fr;gap:64px;align-items:center}
    .split-image{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
    .split-image img{width:100%;height:430px;object-fit:cover}
    .check-list{list-style:none;margin:25px 0 0;padding:0}
    .check-list li{display:flex;gap:12px;margin:16px 0;color:#d9e1ef}
    .check-list li:before{content:"✓";flex:0 0 24px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:#07111f;background:var(--cyan);font-weight:900;line-height:24px}
    .quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .quote{padding:27px}
    .quote p{font-size:16px;color:#d7dfef;margin:0 0 22px}
    .quote footer{display:flex;align-items:center;gap:11px;color:var(--muted);font-size:13px}
    .quote-avatar{width:35px;height:35px;border-radius:50%;background:linear-gradient(135deg,var(--gold),var(--pink));display:grid;place-items:center;color:#1b1320;font-weight:900}
    .detail-box{padding:30px;background:linear-gradient(135deg,rgba(19,39,70,.95),rgba(16,31,57,.95))}
    .detail-box h3{margin:0 0 12px;font-size:25px}
    .detail-box p{color:var(--muted);margin:0}
    .faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
    .faq-item{padding:20px 23px}
    .faq-item summary{cursor:pointer;font-weight:800;list-style:none;display:flex;justify-content:space-between;gap:18px}
    .faq-item summary::-webkit-details-marker{display:none}
    .faq-item summary:after{content:"+";color:var(--cyan);font-size:22px;line-height:1}
    .faq-item[open] summary:after{content:"−"}
    .faq-item p{color:var(--muted);font-size:14px;margin:13px 0 0}
    .cta-panel{padding:48px 54px;border-radius:28px;background:linear-gradient(115deg,#13334d,#142541);border:1px solid rgba(94,231,209,.28);display:flex;align-items:center;justify-content:space-between;gap:30px;box-shadow:var(--shadow)}
    .cta-panel h2{font-size:clamp(28px,4vw,46px);line-height:1.15;margin:0 0 12px}
    .cta-panel p{color:#b9c6dc;margin:0;max-width:650px}
    .footer{padding:70px 0 24px;background:#050c18;border-top:1px solid var(--line)}
    .footer-grid{display:grid;grid-template-columns:1.5fr .8fr .8fr .8fr;gap:35px}
    .footer-brand p{color:var(--muted);font-size:14px;max-width:360px;margin-top:20px}
    .footer h3{font-size:15px;margin:8px 0 18px;color:var(--white)}
    .footer-links{display:grid;gap:9px}
    .footer-links a{color:var(--muted);font-size:14px}
    .footer-links a:hover{color:var(--cyan)}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:45px;padding-top:22px;color:#8796b1;font-size:12px}
    .fixed-cta{position:fixed;right:22px;bottom:22px;z-index:40;background:var(--gold);color:#211707;border-radius:99px;padding:13px 20px;font-weight:900;box-shadow:0 12px 30px rgba(0,0,0,.3)}
    .fixed-cta:hover{background:#ffe09d;transform:translateY(-3px)}
    @media(max-width:1100px){
      .nav-grid{gap:2px}.nav-item{padding:9px 8px}.header-cta{padding:12px 15px}
      .page-hero-grid,.activity-layout,.split{gap:32px}
    }
    @media(max-width:900px){
      .header-main{align-items:flex-start;padding:14px 0;flex-wrap:wrap}
      .nav-grid{order:3;width:100%;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px}
      .nav-item{white-space:nowrap}
      .page-hero-grid,.activity-layout,.split{grid-template-columns:1fr}
      .page-hero{padding:70px 0}
      .hero-art{min-height:280px}.hero-art img{height:280px}
      .activity-grid,.quote-grid{grid-template-columns:1fr 1fr}
      .timeline{grid-template-columns:1fr 1fr}
      .step:nth-child(1){border-radius:var(--radius) 0 0 0}.step:nth-child(2){border-right-width:1px;border-radius:0 var(--radius) 0 0}.step:nth-child(3){border-radius:0 0 0 var(--radius);border-top:0}.step:nth-child(4){border-radius:0 0 var(--radius) 0;border-top:0;border-right-width:1px}
      .footer-grid{grid-template-columns:1fr 1fr}
    }
    @media(max-width:600px){
      .container{width:min(var(--max),calc(100% - 28px))}
      .topbar-inner{padding:8px 0;display:block}.topbar-inner span:last-child{display:none}
      .brand{font-size:21px}.brand-mark{width:35px;height:35px}
      .header-cta{margin-left:auto}
      .page-hero h1{font-size:46px}.page-hero p{font-size:16px}
      .section{padding:70px 0}.section-head{margin-bottom:30px}.section-head h2{font-size:34px}
      .activity-grid,.quote-grid,.faq-grid,.footer-grid,.timeline{grid-template-columns:1fr}
      .step,.step:first-child,.step:last-child,.step:nth-child(2),.step:nth-child(3),.step:nth-child(4){border:1px solid var(--line);border-radius:var(--radius)}
      .step+ .step{border-top:0;border-radius:0}.step:last-child{border-radius:0 0 var(--radius) var(--radius)}
      .cta-panel{padding:32px 24px;display:block}.cta-panel .btn{margin-top:24px}
      .fixed-cta{right:14px;bottom:14px;font-size:14px}
    }

/* roulang page: category1 */
:root{
      --ink:#f5f7ff;
      --muted:#aeb8d3;
      --deep:#07111f;
      --deep-2:#0b1830;
      --panel:#101f39;
      --panel-2:#132746;
      --line:rgba(181,203,242,.16);
      --cyan:#5ee7d1;
      --cyan-2:#2bc7b1;
      --gold:#ffc96b;
      --pink:#ff789e;
      --white:#fff;
      --radius:22px;
      --radius-sm:14px;
      --shadow:0 22px 70px rgba(0,0,0,.25);
      --soft-shadow:0 12px 34px rgba(0,0,0,.18);
      --max:1240px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--deep);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",Arial,sans-serif;font-size:16px;line-height:1.75;overflow-x:hidden}
    a{color:inherit;text-decoration:none;transition:.25s ease}
    img{display:block;max-width:100%;height:auto}
    button,input{font:inherit}
    button:focus,a:focus,input:focus{outline:3px solid rgba(94,231,209,.42);outline-offset:3px}
    .container{width:min(var(--max),calc(100% - 40px));margin:0 auto}
    .section{padding:104px 0;position:relative}
    .eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--cyan);font-size:13px;font-weight:700;letter-spacing:.13em}
    .eyebrow:before{content:"";display:block;width:26px;height:2px;background:var(--cyan)}
    .section-head{max-width:720px;margin-bottom:48px}
    .section-head h2{font-size:clamp(30px,4vw,52px);line-height:1.18;margin:14px 0 17px;letter-spacing:-.04em}
    .section-head p{color:var(--muted);font-size:17px;margin:0}
    .topbar{background:#050c18;border-bottom:1px solid var(--line);color:#cad4e9;font-size:13px}
    .topbar-inner{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:20px}
    .topbar strong{color:var(--gold)}
    .header{position:sticky;top:0;z-index:50;background:rgba(7,17,31,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
    .header-main{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:25px}
    .brand{display:flex;align-items:center;gap:12px;font-weight:900;font-size:24px;letter-spacing:-.06em;white-space:nowrap}
    .brand-mark{width:39px;height:39px;border-radius:13px;background:linear-gradient(140deg,var(--cyan),#77a5ff);color:#07111f;display:grid;place-items:center;font-weight:900;box-shadow:0 8px 24px rgba(94,231,209,.2)}
    .brand small{display:block;color:var(--muted);font-size:10px;font-weight:500;letter-spacing:.1em;line-height:1;margin-top:2px}
    .nav-grid{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
    .nav-item{display:flex;align-items:center;gap:8px;padding:10px 13px;border-radius:12px;color:#c5cee1;font-size:14px}
    .nav-item:hover,.nav-item.active{background:rgba(94,231,209,.12);color:var(--cyan)}
    .nav-icon{width:22px;height:22px;border:1px solid currentColor;border-radius:7px;display:grid;place-items:center;font-size:11px}
    .header-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid transparent;border-radius:13px;padding:13px 22px;font-weight:800;line-height:1;cursor:pointer}
    .header-cta,.btn-primary{background:var(--cyan);color:#06131e;box-shadow:0 12px 26px rgba(43,199,177,.2)}
    .header-cta:hover,.btn-primary:hover{background:#87f5e3;color:#06131e;transform:translateY(-2px)}
    .btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.035)}
    .btn-ghost:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(94,231,209,.08)}
    .btn-gold{background:var(--gold);color:#211707}
    .btn-gold:hover{background:#ffe09d;color:#211707;transform:translateY(-2px)}
    .hero{padding:92px 0 112px;position:relative;background-image:linear-gradient(90deg,rgba(7,17,31,.98) 0%,rgba(7,17,31,.83) 48%,rgba(7,17,31,.34) 100%),url("/assets/images/backpic/back-2.webp");background-size:cover;background-position:center;overflow:hidden}
    .hero:after{content:"";position:absolute;inset:auto 0 0;height:150px;background:linear-gradient(transparent,var(--deep));pointer-events:none}
    .hero-layout{position:relative;z-index:1;display:grid;grid-template-columns:1fr .9fr;gap:72px;align-items:center}
    .hero h1{font-size:clamp(43px,6vw,76px);line-height:1.06;letter-spacing:-.075em;margin:18px 0 22px;max-width:700px}
    .hero h1 span{color:var(--cyan)}
    .hero-copy{font-size:18px;color:#d1d9e9;max-width:650px}
    .hero-actions{display:flex;gap:13px;flex-wrap:wrap;margin:31px 0 27px}
    .hero-note{color:#91a0bc;font-size:13px}
    .guide-cover{position:relative;min-height:520px;padding:25px;display:flex;align-items:flex-end;background:rgba(10,26,48,.76);border:1px solid rgba(255,255,255,.2);border-radius:28px;box-shadow:var(--shadow);backdrop-filter:blur(13px)}
    .guide-cover img{position:absolute;inset:25px 25px auto 25px;width:calc(100% - 50px);height:275px;object-fit:cover;border-radius:18px;opacity:.9}
    .cover-shade{position:absolute;inset:25px 25px auto 25px;height:275px;border-radius:18px;background:linear-gradient(0deg,rgba(7,17,31,.85),transparent 75%)}
    .guide-content{position:relative;width:100%;padding-top:290px}
    .guide-label{display:inline-block;padding:5px 10px;border-radius:8px;background:var(--gold);color:#211707;font-size:12px;font-weight:800}
    .guide-content h2{font-size:27px;line-height:1.25;margin:16px 0 12px}
    .guide-content p{color:var(--muted);font-size:14px;margin:0 0 17px}
    .guide-points{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:20px}
    .guide-points span{font-size:13px;color:#d8e1f1;padding:8px 10px;border:1px solid var(--line);border-radius:9px}
    .guide-points span:before{content:"✓";color:var(--cyan);margin-right:6px}
    .form-card{padding:26px;border:1px solid var(--line);background:var(--panel);border-radius:var(--radius);box-shadow:var(--soft-shadow)}
    .form-card h3{font-size:25px;margin:0 0 8px}
    .form-card>p{color:var(--muted);font-size:14px;margin:0 0 21px}
    .form-card label{display:block;color:#dce6f5;font-size:13px;font-weight:700;margin-bottom:7px}
    .form-card input{width:100%;height:48px;border:1px solid var(--line);border-radius:11px;background:#0a172b;color:var(--ink);padding:0 14px;margin-bottom:14px}
    .form-card input::placeholder{color:#72819d}
    .form-card .btn{width:100%;margin-top:4px}
    .form-tip{font-size:12px;color:#8292ad;margin:14px 0 0}
    .light-section{background:#0a1729}
    .split{display:grid;grid-template-columns:.82fr 1.18fr;gap:60px;align-items:start}
    .intro-note{padding:26px;border-left:3px solid var(--cyan);background:rgba(94,231,209,.055);border-radius:0 18px 18px 0;color:#d6deed}
    .intro-note strong{display:block;color:var(--cyan);font-size:18px;margin-bottom:7px}
    .feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .feature-card{padding:29px;border:1px solid var(--line);background:var(--panel);border-radius:var(--radius);min-height:230px;transition:.3s}
    .feature-card:hover,.content-card:hover,.quote:hover,.step:hover{transform:translateY(-6px);border-color:rgba(94,231,209,.5);box-shadow:var(--soft-shadow)}
    .feature-no{color:var(--cyan);font-size:13px;font-weight:900;letter-spacing:.1em}
    .feature-card h3{font-size:22px;margin:20px 0 10px}
    .feature-card p{color:var(--muted);font-size:14px;margin:0}
    .icon-disc{width:45px;height:45px;border-radius:15px;background:rgba(94,231,209,.1);border:1px solid rgba(94,231,209,.26);color:var(--cyan);display:grid;place-items:center;font-size:20px}
    .scene-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:stretch}
    .scene-image{overflow:hidden;border-radius:var(--radius);border:1px solid var(--line)}
    .scene-image img{width:100%;height:100%;min-height:400px;object-fit:cover}
    .scene-copy{padding:35px;border-radius:var(--radius);background:var(--panel-2);border:1px solid var(--line)}
    .scene-copy h3{font-size:31px;line-height:1.25;margin:13px 0 15px}
    .scene-copy p{color:var(--muted)}
    .check-list{list-style:none;margin:24px 0 0;padding:0}
    .check-list li{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);color:#dce5f4}
    .check-list li:last-child{border-bottom:0}
    .check-list li:before{content:"↗";color:var(--cyan);font-weight:900}
    .process{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
    .step{padding:24px;background:var(--panel);border:1px solid var(--line);border-radius:18px;transition:.3s}
    .step-number{color:var(--gold);font-size:14px;font-weight:900}
    .step h3{font-size:18px;margin:18px 0 8px}
    .step p{font-size:14px;color:var(--muted);margin:0}
    .stats-band{background:var(--panel-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
    .stat{padding:12px 20px;border-left:1px solid var(--line)}
    .stat:first-child{border-left:0}
    .stat strong{display:block;color:var(--cyan);font-size:36px;line-height:1.2}
    .stat span{color:var(--muted);font-size:14px}
    .quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .quote{padding:27px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);transition:.3s}
    .quote-mark{color:var(--gold);font-size:34px;line-height:1}
    .quote p{color:#d8e1ef;font-size:15px;margin:10px 0 20px}
    .quote cite{font-style:normal;color:var(--cyan);font-size:13px}
    .content-layout{display:grid;grid-template-columns:1fr .78fr;gap:28px}
    .content-card{display:grid;grid-template-columns:190px 1fr;gap:23px;padding:18px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);transition:.3s}
    .content-card img{width:190px;height:145px;object-fit:cover;border-radius:14px}
    .content-card time{color:var(--gold);font-size:12px}
    .content-card h3{font-size:20px;line-height:1.35;margin:7px 0}
    .content-card p{color:var(--muted);font-size:13px;margin:0 0 13px}
    .text-link{color:var(--cyan);font-size:13px;font-weight:800}
    .side-panel{padding:28px;border-radius:var(--radius);background:#0d1b32;border:1px solid var(--line)}
    .side-panel h3{font-size:24px;margin:0 0 15px}
    .side-panel p{color:var(--muted);font-size:14px}
    .side-row{display:flex;justify-content:space-between;gap:15px;padding:14px 0;border-bottom:1px solid var(--line);font-size:14px}
    .side-row:last-child{border-bottom:0}
    .side-row b{color:var(--cyan)}
    .faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
    .faq-item{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:21px 23px}
    .faq-item summary{cursor:pointer;color:#eef4ff;font-weight:800;list-style:none;position:relative;padding-right:25px}
    .faq-item summary::-webkit-details-marker{display:none}
    .faq-item summary:after{content:"+";position:absolute;right:0;color:var(--cyan);font-size:22px;top:-4px}
    .faq-item[open] summary:after{content:"−"}
    .faq-item p{color:var(--muted);font-size:14px;margin:13px 0 0}
    .cta-box{position:relative;overflow:hidden;padding:55px 60px;border-radius:28px;background:linear-gradient(110deg,#12304b,#10233e);border:1px solid rgba(94,231,209,.3)}
    .cta-box:after{content:"";position:absolute;width:280px;height:280px;border-radius:50%;background:rgba(94,231,209,.11);right:-70px;top:-110px}
    .cta-content{position:relative;z-index:1;max-width:760px}
    .cta-box h2{font-size:clamp(30px,4vw,48px);line-height:1.2;margin:13px 0}
    .cta-box p{color:#c2cee1;margin:0 0 25px}
    .footer{padding:66px 0 28px;background:#050c18;border-top:1px solid var(--line)}
    .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:38px}
    .footer-brand p{color:var(--muted);font-size:13px;max-width:350px;margin-top:18px}
    .footer h3{font-size:15px;margin:5px 0 16px;color:#eaf1fc}
    .footer-links{display:grid;gap:8px}
    .footer-links a{color:var(--muted);font-size:13px}
    .footer-links a:hover{color:var(--cyan)}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:45px;padding-top:22px;color:#7888a4;font-size:12px}
    .fixed-bar{position:fixed;z-index:40;left:50%;bottom:18px;transform:translateX(-50%);width:min(680px,calc(100% - 30px));padding:10px 12px 10px 20px;border:1px solid rgba(94,231,209,.3);border-radius:17px;background:rgba(8,23,41,.92);backdrop-filter:blur(16px);box-shadow:var(--shadow);display:flex;align-items:center;justify-content:space-between;gap:15px}
    .fixed-bar span{font-size:13px;color:#dce8f6}
    .fixed-bar b{color:var(--cyan)}
    @media(max-width:1100px){
      .nav-grid{order:3;width:100%;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:8px}
      .header-main{flex-wrap:wrap;padding:12px 0 4px}
      .header-cta{margin-left:auto}
      .hero-layout{gap:35px}
    }
    @media(max-width:768px){
      .container{width:min(var(--max),calc(100% - 28px))}
      .section{padding:72px 0}
      .topbar-inner{justify-content:center;text-align:center}
      .topbar-inner span{display:none}
      .hero{padding:70px 0 90px}
      .hero-layout,.split,.scene-grid,.content-layout{grid-template-columns:1fr}
      .hero h1{font-size:clamp(41px,12vw,65px)}
      .hero-panel{max-width:620px}
      .feature-grid,.quote-grid{grid-template-columns:1fr 1fr}
      .process{grid-template-columns:1fr 1fr}
      .stats{grid-template-columns:1fr 1fr}
      .stat:nth-child(3){border-left:0}
      .footer-grid{grid-template-columns:1fr 1fr}
    }
    @media(max-width:520px){
      .brand{font-size:21px}
      .brand-mark{width:35px;height:35px}
      .header-cta{padding:11px 14px;font-size:13px}
      .nav-item{padding:8px 10px;font-size:13px}
      .feature-grid,.quote-grid,.faq-grid,.process,.stats{grid-template-columns:1fr}
      .stat{border-left:0;border-bottom:1px solid var(--line);padding:15px 0}
      .stat:last-child{border-bottom:0}
      .guide-cover{min-height:500px;padding:18px}
      .guide-cover img,.cover-shade{inset:18px 18px auto 18px;width:calc(100% - 36px)}
      .guide-content{padding-top:285px}
      .guide-points{grid-template-columns:1fr}
      .content-card{grid-template-columns:1fr}
      .content-card img{width:100%;height:190px}
      .scene-image img{min-height:280px}
      .cta-box{padding:34px 24px}
      .footer-grid{grid-template-columns:1fr}
      .fixed-bar{padding-left:14px}
      .fixed-bar span{font-size:12px}
      .fixed-bar .btn{padding:11px 14px;font-size:13px}
    }

/* roulang page: category2 */
:root{
      --ink:#f5f7ff;
      --muted:#aeb8d3;
      --deep:#07111f;
      --deep-2:#0b1830;
      --panel:#101f39;
      --panel-2:#132746;
      --line:rgba(181,203,242,.16);
      --cyan:#5ee7d1;
      --cyan-2:#2bc7b1;
      --gold:#ffc96b;
      --pink:#ff789e;
      --white:#fff;
      --radius:22px;
      --radius-sm:14px;
      --shadow:0 22px 70px rgba(0,0,0,.25);
      --soft-shadow:0 12px 34px rgba(0,0,0,.18);
      --max:1240px;
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      background:var(--deep);
      color:var(--ink);
      font-family:"PingFang SC","Microsoft YaHei",Arial,sans-serif;
      font-size:16px;
      line-height:1.75;
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none;transition:.25s ease}
    img{display:block;max-width:100%;height:auto}
    button,input{font:inherit}
    button:focus,a:focus,input:focus{outline:3px solid rgba(94,231,209,.42);outline-offset:3px}
    .container{width:min(var(--max),calc(100% - 40px));margin:0 auto}
    .section{padding:104px 0;position:relative}
    .section-head{max-width:740px;margin-bottom:48px}
    .section-head h2{font-size:clamp(30px,4vw,52px);line-height:1.18;margin:14px 0 17px;letter-spacing:-.04em}
    .section-head p{color:var(--muted);font-size:17px;margin:0}
    .eyebrow{
      display:inline-flex;align-items:center;gap:9px;color:var(--cyan);
      font-size:13px;font-weight:700;letter-spacing:.13em
    }
    .eyebrow:before{content:"";display:block;width:26px;height:2px;background:var(--cyan)}
    .topbar{background:#050c18;border-bottom:1px solid var(--line);color:#cad4e9;font-size:13px}
    .topbar-inner{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:20px}
    .topbar strong{color:var(--gold)}
    .header{
      position:sticky;top:0;z-index:50;background:rgba(7,17,31,.88);
      backdrop-filter:blur(18px);border-bottom:1px solid var(--line)
    }
    .header-main{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:25px}
    .brand{display:flex;align-items:center;gap:12px;font-weight:900;font-size:24px;letter-spacing:-.06em;white-space:nowrap}
    .brand-mark{
      width:39px;height:39px;border-radius:13px;background:linear-gradient(140deg,var(--cyan),#77a5ff);
      color:#07111f;display:grid;place-items:center;font-weight:900;box-shadow:0 8px 24px rgba(94,231,209,.2)
    }
    .brand small{display:block;color:var(--muted);font-size:10px;font-weight:500;letter-spacing:.1em;line-height:1;margin-top:2px}
    .nav-grid{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
    .nav-item{display:flex;align-items:center;gap:8px;padding:10px 13px;border-radius:12px;color:#c5cee1;font-size:14px}
    .nav-item:hover,.nav-item.active{background:rgba(94,231,209,.12);color:var(--cyan)}
    .nav-icon{width:22px;height:22px;border:1px solid currentColor;border-radius:7px;display:grid;place-items:center;font-size:11px}
    .header-cta,.btn{
      display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid transparent;
      border-radius:13px;padding:13px 22px;font-weight:800;line-height:1;cursor:pointer
    }
    .header-cta,.btn-primary{background:var(--cyan);color:#06131e;box-shadow:0 12px 26px rgba(43,199,177,.2)}
    .header-cta:hover,.btn-primary:hover{background:#87f5e3;color:#06131e;transform:translateY(-2px)}
    .btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.035)}
    .btn-ghost:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(94,231,209,.08)}
    .btn-gold{background:var(--gold);color:#211707}
    .btn-gold:hover{background:#ffe09d;color:#211707;transform:translateY(-2px)}
    .hero{
      min-height:650px;display:flex;align-items:center;position:relative;overflow:hidden;
      background-image:linear-gradient(90deg,rgba(7,17,31,.97) 0%,rgba(7,17,31,.82) 45%,rgba(7,17,31,.35) 100%),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(--deep));pointer-events:none}
    .hero-layout{position:relative;z-index:1;display:grid;grid-template-columns:1fr .82fr;gap:70px;align-items:center}
    .hero h1{font-size:clamp(44px,6.5vw,82px);line-height:1.04;letter-spacing:-.075em;margin:18px 0 24px;max-width:700px}
    .hero h1 span{color:var(--cyan)}
    .hero-copy{font-size:19px;color:#d1d9e9;max-width:650px}
    .hero-actions{display:flex;gap:13px;flex-wrap:wrap;margin:33px 0 25px}
    .hero-note{color:#91a0bc;font-size:13px}
    .poster{
      position:relative;border:1px solid rgba(255,255,255,.2);border-radius:28px;overflow:hidden;
      background:#0b1a30;box-shadow:var(--shadow);transform:rotate(2deg)
    }
    .poster img{width:100%;height:430px;object-fit:cover;opacity:.86}
    .poster:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(3,10,20,.93),transparent 65%)}
    .poster-copy{position:absolute;z-index:2;left:27px;right:27px;bottom:26px}
    .poster-copy h2{font-size:29px;margin:12px 0 4px;line-height:1.2}
    .poster-copy p{color:#cbd4e6;font-size:14px;margin:0}
    .badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 11px;font-size:12px;font-weight:800}
    .badge-hot{background:var(--gold);color:#211707}
    .badge-cyan{background:rgba(94,231,209,.12);border:1px solid rgba(94,231,209,.3);color:var(--cyan)}
    .stat-strip{margin-top:-42px;position:relative;z-index:4}
    .stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);background:rgba(16,31,57,.94);border-radius:20px;box-shadow:var(--soft-shadow);overflow:hidden}
    .stat{padding:25px 28px;border-right:1px solid var(--line)}
    .stat:last-child{border-right:0}
    .stat strong{display:block;color:var(--cyan);font-size:31px;line-height:1.2}
    .stat span{display:block;color:var(--muted);font-size:13px;margin-top:5px}
    .dark-section{background:var(--deep-2)}
    .zone-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:46px;align-items:start}
    .zone-intro{position:sticky;top:120px}
    .zone-intro h2{font-size:clamp(31px,4vw,52px);line-height:1.15;margin:15px 0}
    .zone-intro p{color:var(--muted)}
    .zone-intro .btn{margin-top:18px}
    .zone-list{display:grid;gap:15px}
    .zone-card{
      display:grid;grid-template-columns:92px 1fr auto;gap:20px;align-items:center;padding:18px;
      border:1px solid var(--line);background:var(--panel);border-radius:18px;transition:.3s
    }
    .zone-card:hover{transform:translateX(6px);border-color:rgba(94,231,209,.5);box-shadow:var(--soft-shadow)}
    .zone-card img{width:92px;height:92px;object-fit:cover;border-radius:14px}
    .zone-card h3{font-size:20px;margin:0 0 4px}
    .zone-card p{color:var(--muted);font-size:14px;margin:0}
    .zone-card .arrow{color:var(--cyan);font-size:23px}
    .feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .feature-card{padding:29px;border:1px solid var(--line);background:var(--panel);border-radius:var(--radius);min-height:235px;transition:.3s}
    .feature-card:hover{transform:translateY(-6px);border-color:rgba(94,231,209,.5);box-shadow:var(--soft-shadow)}
    .feature-no{color:var(--cyan);font-size:13px;font-weight:900;letter-spacing:.1em}
    .feature-card h3{font-size:23px;margin:20px 0 10px}
    .feature-card p{color:var(--muted);font-size:14px;margin:0}
    .feature-icon{font-size:28px;color:var(--gold);line-height:1}
    .split{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}
    .split-image{position:relative}
    .split-image img{width:100%;height:430px;object-fit:cover;border-radius:26px;border:1px solid var(--line)}
    .image-label{position:absolute;left:20px;bottom:20px;background:rgba(7,17,31,.86);border:1px solid var(--line);border-radius:14px;padding:13px 16px}
    .image-label strong{display:block;color:var(--gold)}
    .image-label span{font-size:12px;color:#cbd4e6}
    .check-list{list-style:none;padding:0;margin:27px 0 0}
    .check-list li{position:relative;padding:13px 0 13px 33px;border-bottom:1px solid var(--line);color:#d9e1ef}
    .check-list li:before{content:"✓";position:absolute;left:0;top:12px;color:var(--cyan);font-weight:900}
    .quote-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
    .quote{padding:29px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);transition:.3s}
    .quote p{font-size:18px;color:#e6ebf7;margin:0 0 24px}
    .quote footer{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px}
    .quote-mark{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(94,231,209,.14);color:var(--cyan);font-weight:900}
    .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line)}
    .step{padding:28px 22px 10px;border-right:1px solid var(--line);position:relative}
    .step:last-child{border-right:0}
    .step-number{color:var(--gold);font-size:13px;font-weight:900;letter-spacing:.14em}
    .step h3{font-size:19px;margin:15px 0 8px}
    .step p{color:var(--muted);font-size:14px;margin:0}
    .faq-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:70px}
    .faq-intro h2{font-size:clamp(31px,4vw,50px);line-height:1.16;margin:14px 0}
    .faq-intro p{color:var(--muted)}
    .faq-list{display:grid;gap:12px}
    .faq-item{border:1px solid var(--line);border-radius:15px;background:var(--panel);overflow:hidden}
    .faq-item summary{cursor:pointer;padding:20px 22px;font-weight:800;list-style:none;display:flex;justify-content:space-between;gap:20px}
    .faq-item summary::-webkit-details-marker{display:none}
    .faq-item summary:after{content:"+";color:var(--cyan);font-size:22px;line-height:1}
    .faq-item[open] summary:after{content:"−"}
    .faq-answer{padding:0 22px 21px;color:var(--muted);font-size:14px}
    .cta-box{
      position:relative;overflow:hidden;border:1px solid rgba(94,231,209,.34);border-radius:28px;
      padding:58px 65px;background:linear-gradient(115deg,#123553,#10243f 55%,#222044)
    }
    .cta-box:after{content:"";position:absolute;width:310px;height:310px;border-radius:50%;right:-80px;top:-120px;background:rgba(94,231,209,.12)}
    .cta-content{position:relative;z-index:1;max-width:720px}
    .cta-box h2{font-size:clamp(30px,4vw,51px);line-height:1.15;margin:13px 0}
    .cta-box p{color:#cbd6e8;margin:0 0 25px}
    .footer{padding:70px 0 28px;background:#050c18;border-top:1px solid var(--line)}
    .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:45px}
    .footer-brand p{color:var(--muted);max-width:350px;font-size:14px;margin:18px 0 0}
    .footer h3{font-size:15px;margin:8px 0 17px;color:var(--gold)}
    .footer-links{display:grid;gap:9px}
    .footer-links a{color:var(--muted);font-size:14px}
    .footer-links a:hover{color:var(--cyan);transform:translateX(3px)}
    .footer-bottom{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;margin-top:52px;padding-top:22px;border-top:1px solid var(--line);color:#7f8ca8;font-size:12px}
    .fixed-bar{position:fixed;z-index:40;bottom:18px;right:22px;display:flex;align-items:center;gap:13px;padding:9px 10px 9px 17px;border:1px solid rgba(94,231,209,.3);border-radius:999px;background:rgba(5,12,24,.9);backdrop-filter:blur(12px);box-shadow:var(--shadow);font-size:13px}
    .fixed-bar strong{color:#dce7f3}
    .fixed-bar .btn{padding:11px 17px;border-radius:999px;font-size:13px}
    @media(max-width:1100px){
      .header-main{align-items:flex-start;padding:15px 0}
      .nav-grid{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;max-width:100%}
      .header-cta{display:none}
      .hero-layout{gap:35px}
      .footer-grid{grid-template-columns:1.3fr 1fr 1fr}
    }
    @media(max-width:800px){
      .container{width:min(var(--max),calc(100% - 30px))}
      .section{padding:75px 0}
      .hero{min-height:760px;padding:70px 0}
      .hero-layout,.split,.faq-layout,.zone-layout{grid-template-columns:1fr;gap:35px}
      .zone-intro{position:static}
      .poster{max-width:500px;transform:none;margin:0 auto}
      .stats{grid-template-columns:repeat(2,1fr)}
      .stat{border-bottom:1px solid var(--line)}
      .stat:nth-child(2){border-right:0}
      .feature-grid{grid-template-columns:1fr 1fr}
      .steps{grid-template-columns:1fr 1fr;border-top:0}
      .step{border-top:1px solid var(--line);min-height:170px}
      .footer-grid{grid-template-columns:1.4fr 1fr 1fr}
    }
    @media(max-width:520px){
      .topbar-inner{justify-content:center;text-align:center;min-height:42px}
      .topbar-inner span{display:none}
      .brand{font-size:21px}
      .brand-mark{width:35px;height:35px}
      .nav-grid{gap:3px}
      .nav-item{padding:8px 9px;font-size:12px}
      .nav-icon{width:19px;height:19px}
      .hero h1{font-size:46px}
      .hero-copy{font-size:16px}
      .hero-actions{display:grid}
      .hero-actions .btn{width:100%}
      .poster img{height:330px}
      .stats,.feature-grid,.quote-grid,.steps{grid-template-columns:1fr}
      .stat{border-right:0}
      .zone-card{grid-template-columns:67px 1fr auto;gap:12px;padding:13px}
      .zone-card img{width:67px;height:67px}
      .zone-card h3{font-size:17px}
      .zone-card p{font-size:12px;line-height:1.55}
      .split-image img{height:300px}
      .cta-box{padding:38px 24px}
      .fixed-bar{left:15px;right:15px;justify-content:space-between}
      .fixed-bar strong{font-size:12px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:30px}
      .footer-brand{grid-column:1/-1}
    }

/* roulang page: category4 */
:root{--ink:#f5f7ff;--muted:#aeb8d3;--deep:#07111f;--deep2:#0b1830;--panel:#101f39;--panel2:#132746;--line:rgba(181,203,242,.16);--cyan:#5ee7d1;--cyan2:#2bc7b1;--gold:#ffc96b;--pink:#ff789e;--white:#fff;--radius:22px;--small:14px;--shadow:0 22px 70px rgba(0,0,0,.25);--soft:0 12px 34px rgba(0,0,0,.18);--max:1240px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--deep);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",Arial,sans-serif;font-size:16px;line-height:1.75;overflow-x:hidden}a{color:inherit;text-decoration:none;transition:.25s ease}img{display:block;max-width:100%;height:auto}button,input{font:inherit}button:focus,a:focus,input:focus{outline:3px solid rgba(94,231,209,.4);outline-offset:3px}.container{width:min(var(--max),calc(100% - 40px));margin:auto}.section{padding:94px 0;position:relative}.topbar{background:#050c18;border-bottom:1px solid var(--line);font-size:13px;color:#cad4e9}.topbar-inner{min-height:38px;display:flex;justify-content:space-between;align-items:center}.topbar strong{color:var(--gold)}.header{position:sticky;top:0;z-index:20;background:rgba(7,17,31,.9);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.header-main{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:22px}.brand{display:flex;align-items:center;gap:12px;font-weight:900;font-size:24px;letter-spacing:-.06em;white-space:nowrap}.brand-mark{width:39px;height:39px;border-radius:13px;background:linear-gradient(140deg,var(--cyan),#77a5ff);color:#07111f;display:grid;place-items:center;font-weight:900;box-shadow:0 8px 24px rgba(94,231,209,.2)}.brand small{display:block;color:var(--muted);font-size:10px;font-weight:500;letter-spacing:.1em;line-height:1;margin-top:2px}.nav-grid{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}.nav-item{display:flex;align-items:center;gap:7px;padding:10px 12px;border-radius:12px;color:#c5cee1;font-size:14px}.nav-item:hover,.nav-item.active{background:rgba(94,231,209,.12);color:var(--cyan)}.nav-icon{width:22px;height:22px;border:1px solid currentColor;border-radius:7px;display:grid;place-items:center;font-size:11px}.header-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid transparent;border-radius:13px;padding:13px 22px;font-weight:800;line-height:1;cursor:pointer}.header-cta,.btn-primary{background:var(--cyan);color:#06131e;box-shadow:0 12px 26px rgba(43,199,177,.2)}.header-cta:hover,.btn-primary:hover{background:#87f5e3;transform:translateY(-2px)}.btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.035)}.btn-ghost:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(94,231,209,.08)}.btn-gold{background:var(--gold);color:#211707}.btn-gold:hover{background:#ffe09d;transform:translateY(-2px)}.eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--cyan);font-size:13px;font-weight:700;letter-spacing:.13em}.eyebrow:before{content:"";width:26px;height:2px;background:var(--cyan)}.section-head{max-width:730px;margin-bottom:42px}.section-head h2{font-size:clamp(30px,4vw,52px);line-height:1.18;margin:14px 0 16px;letter-spacing:-.04em}.section-head p,.muted{color:var(--muted)}.hero{padding:95px 0 110px;background-image:linear-gradient(90deg,rgba(7,17,31,.98),rgba(7,17,31,.72)),url("/assets/images/backpic/back-2.webp");background-size:cover;background-position:center}.hero-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center}.hero h1{font-size:clamp(44px,6vw,76px);line-height:1.06;letter-spacing:-.07em;margin:18px 0}.hero h1 span{color:var(--cyan)}.hero-copy{font-size:18px;color:#d1d9e9;max-width:570px}.hero-actions{display:flex;gap:13px;flex-wrap:wrap;margin:30px 0 22px}.hero-note{font-size:13px;color:#91a0bc}.stage{padding:18px;border:1px solid rgba(255,255,255,.18);background:rgba(9,22,42,.74);border-radius:28px;box-shadow:var(--shadow);transform:rotate(1deg)}.stage img{width:100%;height:390px;object-fit:cover;border-radius:18px}.stage-caption{display:flex;justify-content:space-between;gap:16px;padding:18px 5px 2px}.stage-caption b{font-size:18px}.stage-caption span{color:var(--gold);font-weight:800}.split{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature-card,.benefit-card,.quote,.process-item{padding:28px;border:1px solid var(--line);background:var(--panel);border-radius:var(--radius);transition:.3s}.feature-card:hover,.benefit-card:hover,.quote:hover,.process-item:hover{transform:translateY(-6px);border-color:rgba(94,231,209,.5);box-shadow:var(--soft)}.feature-no{color:var(--cyan);font-size:13px;font-weight:900;letter-spacing:.1em}.feature-card h3,.benefit-card h3{font-size:22px;margin:17px 0 9px}.feature-card p,.benefit-card p{color:var(--muted);font-size:14px;margin:0}.visual img{height:390px;width:100%;object-fit:cover;border-radius:var(--radius);box-shadow:var(--shadow)}.benefit-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.benefit-card{display:flex;gap:18px;align-items:flex-start}.icon{width:44px;height:44px;flex:none;border-radius:14px;background:rgba(94,231,209,.13);color:var(--cyan);display:grid;place-items:center;font-size:21px}.dark-section{background:var(--deep2)}.process{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.process-item{background:rgba(255,255,255,.035)}.process-item strong{display:block;color:var(--gold);font-size:13px;letter-spacing:.1em}.process-item h3{font-size:18px;margin:15px 0 8px}.process-item p{color:var(--muted);font-size:14px;margin:0}.quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.quote p{color:#d8e0ef;margin-top:0}.quote b{color:var(--cyan);font-size:14px}.notice{border-left:3px solid var(--gold);background:rgba(255,201,107,.08);padding:21px 24px;border-radius:0 16px 16px 0;color:#dbe3f0}.faq{max-width:900px}.faq details{border-bottom:1px solid var(--line);padding:20px 0}.faq summary{cursor:pointer;font-weight:800;font-size:18px;list-style:none;display:flex;justify-content:space-between}.faq summary:after{content:"＋";color:var(--cyan)}.faq details[open] summary:after{content:"－"}.faq p{color:var(--muted);margin:13px 0 0;max-width:780px}.cta{padding:70px 0;background:linear-gradient(120deg,#102a43,#123b4a);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}.cta h2{font-size:clamp(28px,4vw,48px);line-height:1.2;margin:0 0 12px}.cta p{color:#c5d2e6;margin:0;max-width:650px}.footer{padding:62px 0 24px;background:#050c18}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px}.footer-brand p{color:var(--muted);font-size:14px;max-width:330px}.footer h3{font-size:15px;color:var(--gold);margin:7px 0 14px}.footer-links{display:grid;gap:9px;color:var(--muted);font-size:14px}.footer-links a:hover{color:var(--cyan)}.footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin-top:40px;padding-top:20px;color:#8492ae;font-size:12px}.anchor-box{display:flex;gap:12px;flex-wrap:wrap}.tag{display:inline-block;padding:5px 11px;border-radius:20px;color:var(--cyan);background:rgba(94,231,209,.1);font-size:12px;font-weight:700}.fixed-bar{position:fixed;bottom:18px;right:20px;z-index:10;background:rgba(16,31,57,.94);border:1px solid var(--line);border-radius:16px;padding:10px 12px 10px 17px;box-shadow:var(--shadow);display:flex;align-items:center;gap:15px;font-size:13px}.fixed-bar span{color:var(--muted)}@media(max-width:1024px){.nav-grid{display:none}.hero-layout,.split{grid-template-columns:1fr}.hero{padding-top:70px}.stage{max-width:680px;margin:auto}.feature-grid,.quote-grid{grid-template-columns:repeat(2,1fr)}.process{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.container{width:min(var(--max),calc(100% - 28px))}.topbar-inner{font-size:11px}.topbar-inner span:last-child{display:none}.header-main{min-height:68px}.brand{font-size:21px}.header-cta{padding:11px 13px;font-size:13px}.hero{padding:65px 0 78px}.hero h1{font-size:46px}.hero-copy{font-size:16px}.stage img{height:250px}.section{padding:68px 0}.feature-grid,.benefit-grid,.quote-grid,.process{grid-template-columns:1fr}.visual img{height:280px}.cta-inner{display:block}.cta .btn{margin-top:25px}.footer-grid{grid-template-columns:1fr 1fr;gap:25px}.footer-brand{grid-column:1/-1}.footer-bottom{display:block}.footer-bottom span{display:block;margin-bottom:8px}.fixed-bar{left:14px;right:14px;justify-content:space-between}}

/* roulang page: category6 */
:root{
      --ink:#f5f7ff;
      --muted:#aeb8d3;
      --deep:#07111f;
      --deep-2:#0b1830;
      --panel:#101f39;
      --panel-2:#132746;
      --line:rgba(181,203,242,.16);
      --cyan:#5ee7d1;
      --cyan-2:#2bc7b1;
      --gold:#ffc96b;
      --pink:#ff789e;
      --white:#fff;
      --radius:22px;
      --radius-sm:14px;
      --shadow:0 22px 70px rgba(0,0,0,.25);
      --soft-shadow:0 12px 34px rgba(0,0,0,.18);
      --max:1240px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--deep);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",Arial,sans-serif;font-size:16px;line-height:1.75;overflow-x:hidden}
    a{color:inherit;text-decoration:none;transition:.25s ease}
    img{display:block;max-width:100%;height:auto}
    button,input{font:inherit}
    button:focus,a:focus,input:focus{outline:3px solid rgba(94,231,209,.42);outline-offset:3px}
    .container{width:min(var(--max),calc(100% - 40px));margin:0 auto}
    .section{padding:92px 0;position:relative}
    .eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--cyan);font-size:13px;font-weight:700;letter-spacing:.13em}
    .eyebrow:before{content:"";display:block;width:26px;height:2px;background:var(--cyan)}
    .section-head{max-width:740px;margin-bottom:42px}
    .section-head h2{font-size:clamp(30px,4vw,52px);line-height:1.18;margin:14px 0 17px;letter-spacing:-.04em}
    .section-head p{color:var(--muted);font-size:17px;margin:0}
    .topbar{background:#050c18;border-bottom:1px solid var(--line);color:#cad4e9;font-size:13px}
    .topbar-inner{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:20px}
    .topbar strong{color:var(--gold)}
    .header{position:sticky;top:0;z-index:50;background:rgba(7,17,31,.9);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
    .header-main{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:25px}
    .brand{display:flex;align-items:center;gap:12px;font-weight:900;font-size:24px;letter-spacing:-.06em;white-space:nowrap}
    .brand-mark{width:39px;height:39px;border-radius:13px;background:linear-gradient(140deg,var(--cyan),#77a5ff);color:#07111f;display:grid;place-items:center;font-weight:900;box-shadow:0 8px 24px rgba(94,231,209,.2)}
    .brand small{display:block;color:var(--muted);font-size:10px;font-weight:500;letter-spacing:.1em;line-height:1;margin-top:2px}
    .nav-grid{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
    .nav-item{display:flex;align-items:center;gap:8px;padding:10px 13px;border-radius:12px;color:#c5cee1;font-size:14px}
    .nav-item:hover,.nav-item.active{background:rgba(94,231,209,.12);color:var(--cyan)}
    .nav-icon{width:22px;height:22px;border:1px solid currentColor;border-radius:7px;display:grid;place-items:center;font-size:11px}
    .header-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid transparent;border-radius:13px;padding:13px 22px;font-weight:800;line-height:1;cursor:pointer}
    .header-cta,.btn-primary{background:var(--cyan);color:#06131e;box-shadow:0 12px 26px rgba(43,199,177,.2)}
    .header-cta:hover,.btn-primary:hover{background:#87f5e3;color:#06131e;transform:translateY(-2px)}
    .btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.035)}
    .btn-ghost:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(94,231,209,.08)}
    .btn-gold{background:var(--gold);color:#211707}
    .btn-gold:hover{background:#ffe09d;color:#211707;transform:translateY(-2px)}
    .hero{padding:100px 0 110px;min-height:570px;display:flex;align-items:center;background-image:linear-gradient(90deg,rgba(7,17,31,.97) 0%,rgba(7,17,31,.82) 47%,rgba(7,17,31,.38) 100%),url("/assets/images/backpic/back-2.webp");background-size:cover;background-position:center}
    .hero-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
    .hero h1{font-size:clamp(42px,6vw,76px);line-height:1.05;letter-spacing:-.07em;margin:18px 0 24px;max-width:700px}
    .hero h1 span{color:var(--cyan)}
    .hero-copy{font-size:19px;color:#d1d9e9;max-width:680px}
    .hero-actions{display:flex;gap:13px;flex-wrap:wrap;margin:32px 0 24px}
    .hero-note{color:#91a0bc;font-size:13px}
    .hero-panel{position:relative;border:1px solid rgba(255,255,255,.18);border-radius:28px;background:rgba(9,22,42,.78);box-shadow:var(--shadow);padding:27px;backdrop-filter:blur(16px)}
    .deal img{width:110px;height:110px;object-fit:cover;border-radius:18px}
    .deal-tag{display:inline-block;color:#09151d;background:var(--gold);border-radius:6px;padding:2px 7px;font-size:11px;font-weight:800;margin-bottom:7px}
    .flash-title{display:flex;align-items:center;gap:15px;margin-bottom:20px}
    .flash-title b{color:var(--gold);font-size:20px}
    .flash-title span{color:#d2dced;font-size:14px}
    .deal{display:flex;gap:18px;align-items:center}
    .deal h3{font-size:23px;line-height:1.3;margin:0 0 5px}
    .deal p{color:var(--muted);font-size:13px;margin:0 0 12px}
    .price{display:flex;align-items:baseline;gap:10px;margin:18px 0}
    .price strong{font-size:32px;color:var(--gold);line-height:1}
    .price del{color:#7f8ba6;font-size:13px}
    .countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:22px}
    .countdown div{background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:10px;text-align:center;padding:7px}
    .countdown b{display:block;font-size:20px;color:var(--cyan);line-height:1.2}
    .countdown span{display:block;font-size:11px;color:var(--muted)}
    .stripe{background:var(--panel-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
    .stat{padding:27px 22px;border-right:1px solid var(--line)}
    .stat:last-child{border-right:0}
    .stat strong{display:block;font-size:30px;color:var(--cyan);line-height:1.2}
    .stat span{color:var(--muted);font-size:13px}
    .feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .feature-card{padding:29px;border:1px solid var(--line);background:var(--panel);border-radius:var(--radius);min-height:230px;transition:.3s}
    .feature-card:hover,.content-card:hover,.quote:hover,.step:hover{transform:translateY(-6px);border-color:rgba(94,231,209,.5);box-shadow:var(--soft-shadow)}
    .feature-no{color:var(--cyan);font-size:13px;font-weight:900;letter-spacing:.1em}
    .feature-card h3{font-size:23px;margin:20px 0 10px}
    .feature-card p{color:var(--muted);font-size:14px;margin:0}
    .split{display:grid;grid-template-columns:.9fr 1.1fr;gap:52px;align-items:center}
    .image-frame{position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
    .image-frame img{width:100%;height:430px;object-fit:cover}
    .image-label{position:absolute;left:20px;bottom:20px;padding:10px 15px;border:1px solid rgba(255,255,255,.2);background:rgba(7,17,31,.76);backdrop-filter:blur(12px);border-radius:12px;color:var(--cyan);font-size:13px}
    .check-list{list-style:none;margin:25px 0 0;padding:0}
    .check-list li{display:flex;gap:12px;padding:13px 0;border-bottom:1px solid var(--line);color:#dbe3f3}
    .check-list li:before{content:"✓";display:grid;place-items:center;flex:0 0 24px;height:24px;border-radius:50%;background:rgba(94,231,209,.14);color:var(--cyan);font-weight:900}
    .dark-section{background:#09182e}
    .scene-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:20px}
    .content-card{position:relative;min-height:300px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--panel);transition:.3s}
    .content-card img{width:100%;height:100%;min-height:300px;object-fit:cover;opacity:.7}
    .content-card:after{content:"";position:absolute;inset:30% 0 0;background:linear-gradient(transparent,rgba(5,12,24,.96))}
    .content-overlay{position:absolute;z-index:1;left:25px;right:25px;bottom:22px}
    .content-overlay h3{font-size:24px;margin:0 0 6px}
    .content-overlay p{color:#c4cee1;font-size:14px;margin:0}
    .step-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
    .step{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:24px;transition:.3s}
    .step-number{color:var(--gold);font-size:14px;font-weight:900}
    .step h3{font-size:19px;margin:17px 0 8px}
    .step p{font-size:13px;color:var(--muted);margin:0}
    .quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .quote{padding:27px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);transition:.3s}
    .quote p{color:#dbe3f3;margin:0 0 20px}
    .quote footer{display:flex;align-items:center;gap:10px;color:var(--cyan);font-size:13px}
    .avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(94,231,209,.16);color:var(--cyan);font-weight:800}
    .faq-list{max-width:900px}
    .faq-list details{border-bottom:1px solid var(--line);padding:18px 0}
    .faq-list summary{cursor:pointer;font-size:18px;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:20px}
    .faq-list summary:after{content:"＋";color:var(--cyan);font-size:22px}
    .faq-list details[open] summary:after{content:"－"}
    .faq-list details p{color:var(--muted);font-size:14px;margin:13px 35px 0 0}
    .cta-box{padding:48px 55px;border-radius:28px;background:linear-gradient(110deg,#123452,#0e283f);border:1px solid rgba(94,231,209,.3);display:flex;align-items:center;justify-content:space-between;gap:30px;box-shadow:var(--shadow)}
    .cta-box h2{font-size:clamp(28px,4vw,46px);line-height:1.2;margin:0 0 10px}
    .cta-box p{color:#b8c7df;margin:0;max-width:680px}
    .cta-actions{display:flex;gap:12px;flex-wrap:wrap;flex-shrink:0}
    .footer{padding:65px 0 30px;background:#050c18;border-top:1px solid var(--line)}
    .footer-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr .8fr;gap:35px}
    .footer-brand p{color:var(--muted);font-size:13px;max-width:390px;margin-top:20px}
    .footer h3{font-size:15px;margin:7px 0 15px}
    .footer-links{display:grid;gap:8px}
    .footer-links a{color:var(--muted);font-size:13px}
    .footer-links a:hover{color:var(--cyan)}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:40px;padding-top:22px;color:#7f8ba6;font-size:12px}
    .fixed-bar{position:fixed;z-index:40;bottom:18px;left:50%;transform:translateX(-50%);width:min(780px,calc(100% - 30px));padding:12px 15px 12px 20px;display:flex;align-items:center;justify-content:space-between;gap:15px;background:rgba(10,27,48,.94);border:1px solid rgba(94,231,209,.34);border-radius:17px;box-shadow:0 15px 45px rgba(0,0,0,.35);backdrop-filter:blur(14px)}
    .fixed-bar span{font-size:13px;color:#d5deee}
    .fixed-bar b{color:var(--cyan)}
    @media(max-width:1100px){
      .header-main{align-items:flex-start;padding:16px 0}
      .nav-grid{justify-content:center}
      .header-cta{display:none}
      .hero-layout,.split{gap:35px}
    }
    @media(max-width:800px){
      .container{width:min(var(--max),calc(100% - 30px))}
      .topbar-inner{padding:7px 0;align-items:flex-start}
      .topbar-inner span:last-child{display:none}
      .header-main{display:block}
      .brand{margin-bottom:14px}
      .nav-grid{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px}
      .nav-item{white-space:nowrap}
      .hero{padding:75px 0 85px}
      .hero-layout,.split,.scene-grid{grid-template-columns:1fr}
      .hero-panel{max-width:600px}
      .feature-grid,.quote-grid{grid-template-columns:1fr 1fr}
      .step-grid{grid-template-columns:1fr 1fr}
      .stats{grid-template-columns:1fr 1fr}
      .stat:nth-child(2){border-right:0}
      .stat{border-bottom:1px solid var(--line)}
      .cta-box{display:block;padding:38px 28px}
      .cta-actions{margin-top:25px}
      .footer-grid{grid-template-columns:1.5fr 1fr 1fr}
      .footer-grid>div:last-child{grid-column:2}
    }
    @media(max-width:520px){
      .section{padding:68px 0}
      .hero h1{font-size:45px}
      .hero-copy{font-size:16px}
      .feature-grid,.quote-grid,.step-grid{grid-template-columns:1fr}
      .stats{grid-template-columns:1fr 1fr}
      .stat{padding:20px 12px}
      .stat strong{font-size:24px}
      .deal{align-items:flex-start}
      .deal img{width:82px;height:82px}
      .deal h3{font-size:19px}
      .image-frame img{height:300px}
      .footer-grid{grid-template-columns:1fr 1fr}
      .footer-grid>div:first-child{grid-column:1/-1}
      .footer-grid>div:last-child{grid-column:auto}
      .fixed-bar{bottom:10px;padding:10px 11px 10px 14px}
      .fixed-bar span{font-size:12px}
      .fixed-bar .btn{padding:11px 14px;font-size:13px}
    }

/* roulang page: category5 */
:root{
      --ink:#f5f7ff;
      --muted:#aeb8d3;
      --deep:#07111f;
      --deep-2:#0b1830;
      --panel:#101f39;
      --panel-2:#132746;
      --line:rgba(181,203,242,.16);
      --cyan:#5ee7d1;
      --cyan-2:#2bc7b1;
      --gold:#ffc96b;
      --pink:#ff789e;
      --white:#fff;
      --radius:22px;
      --radius-sm:14px;
      --shadow:0 22px 70px rgba(0,0,0,.25);
      --soft-shadow:0 12px 34px rgba(0,0,0,.18);
      --max:1240px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      background:var(--deep);
      color:var(--ink);
      font-family:"PingFang SC","Microsoft YaHei",Arial,sans-serif;
      font-size:16px;
      line-height:1.75;
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none;transition:.25s ease}
    img{display:block;max-width:100%;height:auto}
    button,input{font:inherit}
    button:focus,a:focus,input:focus{outline:3px solid rgba(94,231,209,.42);outline-offset:3px}
    .container{width:min(var(--max),calc(100% - 40px));margin:0 auto}
    .section{padding:104px 0;position:relative}
    .section-dark{background:var(--deep-2)}
    .section-soft{background:#09172b}
    .eyebrow{
      display:inline-flex;
      align-items:center;
      gap:9px;
      color:var(--cyan);
      font-size:13px;
      font-weight:700;
      letter-spacing:.13em;
    }
    .eyebrow:before{content:"";display:block;width:26px;height:2px;background:var(--cyan)}
    .section-head{max-width:760px;margin-bottom:48px}
    .section-head h2{
      font-size:clamp(30px,4vw,52px);
      line-height:1.18;
      margin:14px 0 17px;
      letter-spacing:-.04em;
    }
    .section-head p{color:var(--muted);font-size:17px;margin:0}
    .topbar{background:#050c18;border-bottom:1px solid var(--line);color:#cad4e9;font-size:13px}
    .topbar-inner{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:20px}
    .topbar strong{color:var(--gold)}
    .header{
      position:sticky;
      top:0;
      z-index:50;
      background:rgba(7,17,31,.88);
      backdrop-filter:blur(18px);
      border-bottom:1px solid var(--line);
    }
    .header-main{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:25px}
    .brand{
      display:flex;
      align-items:center;
      gap:12px;
      font-weight:900;
      font-size:24px;
      letter-spacing:-.06em;
      white-space:nowrap;
    }
    .brand-mark{
      width:39px;
      height:39px;
      border-radius:13px;
      background:linear-gradient(140deg,var(--cyan),#77a5ff);
      color:#07111f;
      display:grid;
      place-items:center;
      font-weight:900;
      box-shadow:0 8px 24px rgba(94,231,209,.2);
    }
    .brand small{
      display:block;
      color:var(--muted);
      font-size:10px;
      font-weight:500;
      letter-spacing:.1em;
      line-height:1;
      margin-top:2px;
    }
    .nav-grid{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
    .nav-item{
      display:flex;
      align-items:center;
      gap:8px;
      padding:10px 13px;
      border-radius:12px;
      color:#c5cee1;
      font-size:14px;
    }
    .nav-item:hover,.nav-item.active{background:rgba(94,231,209,.12);color:var(--cyan)}
    .nav-icon{
      width:22px;
      height:22px;
      border:1px solid currentColor;
      border-radius:7px;
      display:grid;
      place-items:center;
      font-size:11px;
    }
    .header-cta,.btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:9px;
      border:1px solid transparent;
      border-radius:13px;
      padding:13px 22px;
      font-weight:800;
      line-height:1;
      cursor:pointer;
    }
    .header-cta,.btn-primary{
      background:var(--cyan);
      color:#06131e;
      box-shadow:0 12px 26px rgba(43,199,177,.2);
    }
    .header-cta:hover,.btn-primary:hover{background:#87f5e3;color:#06131e;transform:translateY(-2px)}
    .btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.035)}
    .btn-ghost:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(94,231,209,.08)}
    .btn-gold{background:var(--gold);color:#211707}
    .btn-gold:hover{background:#ffe09d;color:#211707;transform:translateY(-2px)}
    .hero{
      min-height:650px;
      display:flex;
      align-items:center;
      background-image:
        linear-gradient(90deg,rgba(7,17,31,.97) 0%,rgba(7,17,31,.82) 48%,rgba(7,17,31,.38) 100%),
        url("/assets/images/backpic/back-2.webp");
      background-size:cover;
      background-position:center;
      overflow:hidden;
    }
    .hero:after{
      content:"";
      position:absolute;
      inset:auto 0 0;
      height:150px;
      background:linear-gradient(transparent,var(--deep));
      pointer-events:none;
    }
    .hero-layout{
      position:relative;
      z-index:1;
      display:grid;
      grid-template-columns:1.05fr .95fr;
      gap:70px;
      align-items:center;
    }
    .hero h1{
      font-size:clamp(44px,6vw,76px);
      line-height:1.04;
      letter-spacing:-.075em;
      margin:18px 0 24px;
      max-width:690px;
    }
    .hero h1 span{color:var(--cyan)}
    .hero-copy{font-size:19px;color:#d1d9e9;max-width:660px}
    .hero-actions{display:flex;gap:13px;flex-wrap:wrap;margin:33px 0 25px}
    .hero-note{color:#91a0bc;font-size:13px}
    .hero-panel{
      position:relative;
      border:1px solid rgba(255,255,255,.18);
      border-radius:28px;
      background:rgba(9,22,42,.74);
      box-shadow:var(--shadow);
      padding:27px;
      backdrop-filter:blur(16px);
    }
    .panel-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:23px}
    .panel-label{font-size:13px;color:#d8e2f4}
    .status-dot{display:inline-flex;align-items:center;gap:7px;color:var(--cyan);font-size:12px}
    .status-dot:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 5px rgba(94,231,209,.12)}
    .security-score{
      display:grid;
      grid-template-columns:135px 1fr;
      gap:22px;
      align-items:center;
      padding:22px 0;
      border-top:1px solid var(--line);
      border-bottom:1px solid var(--line);
    }
    .score-ring{
      width:126px;
      height:126px;
      border-radius:50%;
      display:grid;
      place-items:center;
      background:radial-gradient(circle at center,var(--panel) 57%,transparent 58%),conic-gradient(var(--cyan) 0 86%,rgba(255,255,255,.1) 86% 100%);
    }
    .score-ring b{font-size:30px;color:var(--white)}
    .score-copy b{display:block;font-size:20px;margin-bottom:6px}
    .score-copy p{color:var(--muted);font-size:13px;margin:0}
    .check-list{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:11px}
    .check-list li{display:flex;gap:10px;align-items:flex-start;color:#d3dded;font-size:13px}
    .check-list li:before{content:"✓";color:var(--cyan);font-weight:900}
    .intro-band{padding:26px 0;background:#0a1a2f;border-bottom:1px solid var(--line)}
    .intro-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
    .metric{padding:5px 20px;border-left:1px solid var(--line)}
    .metric:first-child{border-left:0}
    .metric b{display:block;color:var(--gold);font-size:29px;line-height:1.1}
    .metric span{color:var(--muted);font-size:13px}
    .split-layout{display:grid;grid-template-columns:.86fr 1.14fr;gap:70px;align-items:center}
    .split-copy h2{font-size:clamp(30px,4vw,50px);line-height:1.18;letter-spacing:-.05em;margin:14px 0 20px}
    .split-copy p{color:var(--muted);margin:0 0 20px}
    .image-frame{position:relative;border-radius:28px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
    .image-frame img{width:100%;height:420px;object-fit:cover}
    .image-caption{
      position:absolute;
      left:20px;
      right:20px;
      bottom:20px;
      padding:16px 18px;
      border:1px solid rgba(255,255,255,.18);
      background:rgba(7,17,31,.78);
      backdrop-filter:blur(10px);
      border-radius:15px;
      font-size:14px;
    }
    .image-caption strong{color:var(--cyan)}
    .security-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .security-card{
      padding:28px;
      min-height:245px;
      background:var(--panel);
      border:1px solid var(--line);
      border-radius:var(--radius);
      transition:.3s;
    }
    .security-card:hover{transform:translateY(-6px);border-color:rgba(94,231,209,.52);box-shadow:var(--soft-shadow)}
    .card-icon{
      width:45px;
      height:45px;
      border-radius:14px;
      display:grid;
      place-items:center;
      color:var(--deep);
      background:var(--cyan);
      font-weight:900;
      font-size:19px;
      margin-bottom:22px;
    }
    .security-card:nth-child(2) .card-icon{background:var(--gold)}
    .security-card:nth-child(3) .card-icon{background:#9daeff}
    .security-card:nth-child(4) .card-icon{background:#ff9bb5}
    .security-card:nth-child(5) .card-icon{background:#91e8ff}
    .security-card:nth-child(6) .card-icon{background:#c9f27f}
    .security-card h3{font-size:20px;margin:0 0 10px}
    .security-card p{color:var(--muted);font-size:14px;margin:0}
    .process-wrap{display:grid;grid-template-columns:.75fr 1.25fr;gap:54px;align-items:start}
    .process-intro{
      padding:30px;
      border-radius:var(--radius);
      background:linear-gradient(145deg,#122b49,#0d1b32);
      border:1px solid var(--line);
    }
    .process-intro h3{font-size:27px;line-height:1.25;margin:15px 0}
    .process-intro p{color:var(--muted);font-size:14px;margin:0}
    .process-list{display:grid;gap:0}
    .process-item{
      display:grid;
      grid-template-columns:55px 1fr;
      gap:20px;
      padding:0 0 30px;
      position:relative;
    }
    .process-item:not(:last-child):after{
      content:"";
      position:absolute;
      left:26px;
      top:51px;
      bottom:0;
      width:1px;
      background:var(--line);
    }
    .process-no{
      width:52px;
      height:52px;
      border-radius:16px;
      display:grid;
      place-items:center;
      color:var(--deep);
      background:var(--gold);
      font-weight:900;
      position:relative;
      z-index:1;
    }
    .process-item:nth-child(even) .process-no{background:var(--cyan)}
    .process-item h3{font-size:19px;margin:2px 0 6px}
    .process-item p{color:var(--muted);font-size:14px;margin:0}
    .scene-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:26px}
    .scene-main{
      min-height:430px;
      border-radius:var(--radius);
      overflow:hidden;
      position:relative;
      background:url("/assets/images/coverpic/cover-9.webp") center/cover;
      border:1px solid var(--line);
    }
    .scene-main:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,12,24,.92),transparent 70%)}
    .scene-main-content{position:absolute;z-index:1;left:30px;right:30px;bottom:27px}
    .scene-main-content h3{font-size:29px;margin:12px 0 8px}
    .scene-main-content p{color:#c4cee1;max-width:570px;margin:0;font-size:14px}
    .scene-side{display:grid;gap:18px}
    .scene-card{
      display:grid;
      grid-template-columns:105px 1fr;
      gap:18px;
      padding:18px;
      background:var(--panel);
      border:1px solid var(--line);
      border-radius:18px;
    }
    .scene-card img{height:111px;width:105px;object-fit:cover;border-radius:13px}
    .scene-card h3{font-size:18px;margin:3px 0 7px}
    .scene-card p{font-size:13px;color:var(--muted);margin:0}
    .quote-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:25px}
    .quote{
      padding:31px;
      background:var(--panel);
      border:1px solid var(--line);
      border-radius:var(--radius);
      transition:.3s;
    }
    .quote-mark{font-size:47px;color:var(--cyan);line-height:.8}
    .quote p{font-size:18px;color:#e8edf7;margin:20px 0 25px}
    .quote footer{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px}
    .avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#274566;color:var(--cyan);font-weight:900}
    .evidence{
      background:linear-gradient(135deg,rgba(94,231,209,.12),rgba(255,201,107,.07));
      border:1px solid rgba(94,231,209,.25);
      border-radius:var(--radius);
      padding:30px;
    }
    .evidence h3{margin:0 0 17px;font-size:25px}
    .evidence p{color:var(--muted);font-size:14px;margin:0 0 22px}
    .evidence-list{display:grid;gap:13px;list-style:none;padding:0;margin:0}
    .evidence-list li{display:flex;justify-content:space-between;gap:20px;padding-bottom:13px;border-bottom:1px solid var(--line);font-size:14px}
    .evidence-list li:last-child{border-bottom:0;padding-bottom:0}
    .evidence-list span{color:var(--muted)}
    .evidence-list b{color:var(--cyan);font-weight:700}
    .faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
    .faq-item{
      border:1px solid var(--line);
      border-radius:17px;
      background:var(--panel);
      padding:22px 24px;
    }
    .faq-item h3{font-size:17px;margin:0 0 8px;color:#f4f7ff}
    .faq-item p{font-size:14px;color:var(--muted);margin:0}
    .cta{
      padding:70px 0;
      background:
        linear-gradient(115deg,rgba(94,231,209,.17),rgba(7,17,31,.12)),
        url("/assets/images/backpic/back-3.webp") center/cover;
      border-top:1px solid var(--line);
      border-bottom:1px solid var(--line);
    }
    .cta-box{display:flex;align-items:center;justify-content:space-between;gap:35px}
    .cta-box h2{font-size:clamp(30px,4vw,50px);line-height:1.15;margin:0 0 12px;letter-spacing:-.05em}
    .cta-box p{color:#c6d1e4;max-width:700px;margin:0}
    .cta-actions{display:flex;gap:12px;flex-wrap:wrap;flex-shrink:0}
    .footer{background:#050c18;padding:68px 0 25px;border-top:1px solid var(--line)}
    .footer-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr .8fr;gap:40px}
    .footer-brand p{color:var(--muted);font-size:14px;max-width:390px;margin:20px 0 0}
    .footer h3{font-size:15px;margin:5px 0 17px;color:#e8eefb}
    .footer-links{display:grid;gap:9px}
    .footer-links a{color:var(--muted);font-size:14px}
    .footer-links a:hover{color:var(--cyan);padding-left:4px}
    .footer-bottom{
      display:flex;
      justify-content:space-between;
      gap:20px;
      flex-wrap:wrap;
      border-top:1px solid var(--line);
      margin-top:45px;
      padding-top:22px;
      color:#7f8ca7;
      font-size:12px;
    }
    .fixed-bar{
      position:fixed;
      z-index:40;
      right:22px;
      bottom:22px;
      display:flex;
      align-items:center;
      gap:13px;
      padding:9px 10px 9px 17px;
      border:1px solid rgba(94,231,209,.34);
      border-radius:17px;
      background:rgba(5,12,24,.9);
      backdrop-filter:blur(15px);
      box-shadow:var(--shadow);
      font-size:13px;
    }
    .fixed-bar span{color:#cbd6e8}
    @media(max-width:1100px){
      .header-main{align-items:flex-start;padding:17px 0}
      .brand{margin-top:3px}
      .nav-grid{justify-content:center}
      .header-cta{display:none}
      .hero-layout,.split-layout,.process-wrap,.scene-layout,.quote-layout{gap:35px}
    }
    @media(max-width:820px){
      .container{width:min(var(--max),calc(100% - 30px))}
      .section{padding:75px 0}
      .topbar-inner{justify-content:center;text-align:center}
      .topbar-inner span{display:none}
      .header-main{display:block}
      .brand{justify-content:center;margin-bottom:15px}
      .nav-grid{overflow-x:auto;justify-content:flex-start;flex-wrap:nowrap;padding-bottom:3px}
      .nav-item{white-space:nowrap;padding:8px 10px}
      .hero{min-height:760px}
      .hero-layout,.split-layout,.process-wrap,.scene-layout,.quote-layout{grid-template-columns:1fr}
      .hero-panel{max-width:620px}
      .intro-grid{grid-template-columns:repeat(2,1fr)}
      .metric:nth-child(3){border-left:0}
      .security-grid{grid-template-columns:repeat(2,1fr)}
      .cta-box{display:block}
      .cta-actions{margin-top:25px}
      .footer-grid{grid-template-columns:1fr 1fr}
    }
    @media(max-width:520px){
      body{font-size:15px}
      .section{padding:62px 0}
      .hero{min-height:820px;background-position:62% center}
      .hero h1{font-size:45px}
      .hero-copy{font-size:16px}
      .hero-actions .btn{width:100%}
      .security-score{grid-template-columns:1fr;justify-items:center;text-align:center}
      .check-list{text-align:left}
      .intro-grid{grid-template-columns:1fr 1fr;gap:12px}
      .metric{padding:4px 10px}
      .metric b{font-size:23px}
      .security-grid,.faq-grid{grid-template-columns:1fr}
      .security-card{min-height:auto}
      .scene-card{grid-template-columns:88px 1fr;padding:13px;gap:13px}
      .scene-card img{width:88px;height:100px}
      .image-frame img{height:300px}
      .process-item{grid-template-columns:43px 1fr;gap:15px}
      .process-no{width:43px;height:43px;border-radius:13px}
      .process-item:not(:last-child):after{left:21px;top:43px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:28px 18px}
      .footer-brand{grid-column:1/-1}
      .footer-bottom{display:block}
      .footer-bottom span{display:block;margin-bottom:9px}
      .fixed-bar{left:15px;right:15px;bottom:15px;justify-content:space-between}
    }