/* roulang page: index */
:root{--ink:#17212b;--muted:#697785;--cream:#f7f4ee;--paper:#fffdf9;--teal:#087f78;--teal-dark:#075b5b;--coral:#e87961;--gold:#d4a24c;--line:#e8e2d9;--radius:22px;--shadow:0 18px 50px rgba(29,45,52,.1)}
    *{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--cream);font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;line-height:1.8}a{text-decoration:none;color:inherit}img{display:block;max-width:100%}button,input{font:inherit}button{cursor:pointer;border:0}.container{width:min(1180px,calc(100% - 40px));margin:auto}.topline{height:4px;background:linear-gradient(90deg,var(--teal),var(--gold),var(--coral))}
    .header{position:sticky;top:0;z-index:20;background:rgba(255,253,249,.9);backdrop-filter:blur(18px);border-bottom:1px solid rgba(232,226,217,.9)}.nav{height:76px;display:flex;align-items:center;gap:30px}.logo{font-size:25px;font-weight:900;letter-spacing:.04em;color:var(--teal-dark)}.logo b{color:var(--coral)}.navlinks{display:flex;align-items:center;gap:6px;margin-left:auto}.navlinks a{padding:9px 13px;color:#52616b;border-radius:12px;font-size:14px;transition:.25s}.navlinks a:hover,.navlinks a.active{color:var(--teal-dark);background:#e9f3ef}.nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:12px 21px;font-weight:750;transition:.25s}.nav-cta,.btn-primary{background:var(--teal);color:white;box-shadow:0 8px 20px rgba(8,127,120,.2)}.nav-cta:hover,.btn-primary:hover{background:var(--teal-dark);transform:translateY(-2px)}.menu{display:none;background:none;color:var(--teal-dark);font-size:25px}
    .hero{min-height:650px;display:flex;align-items:center;background:linear-gradient(90deg,rgba(12,35,39,.87),rgba(12,35,39,.47)),url('/assets/images/backpic/back-1.webp') center/cover;position:relative;color:#fff}.hero:after{content:"";position:absolute;inset:auto 0 0;height:100px;background:linear-gradient(transparent,var(--cream))}.hero-inner{position:relative;z-index:1;width:100%;padding:80px 0}.eyebrow,.tag{display:inline-flex;border:1px solid rgba(255,255,255,.35);border-radius:99px;padding:5px 13px;font-size:13px;letter-spacing:.08em;color:#f9dca0}.hero h1{font-size:clamp(42px,7vw,78px);line-height:1.12;max-width:750px;margin:22px 0 18px;letter-spacing:-.04em}.hero p{font-size:18px;max-width:690px;color:#e3ece9;margin:0 0 30px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.btn-light{background:#fff;color:var(--teal-dark)}.btn-light:hover{background:#f6d9a0}.btn-outline{border:1px solid rgba(255,255,255,.5);color:white}.btn-outline:hover{background:rgba(255,255,255,.12)}.hero-board{margin-top:62px;display:flex;gap:14px;flex-wrap:wrap}.metric{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(12px);padding:13px 18px;border-radius:16px;min-width:145px}.metric strong{display:block;font-size:25px;color:#f5d28e}.metric span{font-size:12px;color:#d6e0dc}
    section{padding:92px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:34px}.kicker{color:var(--coral);font-weight:800;font-size:13px;letter-spacing:.12em}.section-head h2{font-size:clamp(28px,4vw,44px);line-height:1.25;margin:8px 0 0;letter-spacing:-.03em}.section-head p{max-width:520px;color:var(--muted);margin:0}.grid{display:grid;gap:20px}.grid-4{grid-template-columns:repeat(4,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-2{grid-template-columns:repeat(2,1fr)}.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:25px;box-shadow:0 8px 24px rgba(40,49,48,.035);transition:.3s}.card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#c6ddd7}.icon{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:#e5f2ed;color:var(--teal);font-size:22px;margin-bottom:18px}.card h3{margin:0 0 9px;font-size:19px}.card p{margin:0;color:var(--muted);font-size:14px}.soft{background:#eaf1ec}.dark{background:var(--teal-dark);color:#fff}.dark .section-head p,.dark .card p{color:#c8ddda}.dark .card{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.15)}.dark .icon{background:#246e6b;color:#ffe0a2}
    .series{background:var(--paper)}.series-card{position:relative;overflow:hidden;padding:0;min-height:265px}.series-card img{height:265px;width:100%;object-fit:cover;transition:.4s}.series-card:hover img{transform:scale(1.06)}.series-card:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.78))}.series-copy{position:absolute;bottom:18px;left:20px;right:18px;z-index:1;color:#fff}.series-copy h3{margin:0 0 3px;font-size:20px}.series-copy p{font-size:13px;color:#e8eeeb;margin:0}.wide-story{display:grid;grid-template-columns:1.15fr .85fr;gap:32px;align-items:center}.story-img{border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}.story-img img{width:100%;height:440px;object-fit:cover}.story-copy p{color:var(--muted);font-size:16px}.checklist{padding:0;margin:24px 0;list-style:none}.checklist li{padding:11px 0;border-bottom:1px solid var(--line);font-size:15px}.checklist li:before{content:"✓";color:var(--coral);font-weight:900;margin-right:12px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden}.stat{background:var(--paper);padding:28px}.stat strong{font-size:35px;color:var(--teal);display:block}.stat span{color:var(--muted);font-size:14px}.news-layout{display:grid;grid-template-columns:1.3fr .7fr;gap:24px}.news-list{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:7px 25px}.news-item{display:grid;grid-template-columns:100px 1fr 90px;gap:16px;align-items:center;padding:19px 0;border-bottom:1px solid var(--line)}.news-item:last-child{border:0}.date{font-size:13px;color:var(--coral);font-weight:700}.news-item h3{margin:0;font-size:16px}.news-item p{margin:3px 0 0;color:var(--muted);font-size:13px;line-height:1.7}.more{font-size:13px;color:var(--teal);white-space:nowrap}.quote{padding:35px;background:#f7e8d7;border-radius:24px;color:#61463c}.quote p{font-size:19px;line-height:1.75;margin:0 0 22px}.quote strong{font-size:14px}.member{display:grid;grid-template-columns:1fr 1fr;gap:0;overflow:hidden;border-radius:28px;background:#152d32;color:#fff}.member-text{padding:45px}.member-text p{color:#c5d8d4}.member-art{min-height:300px;background:url('/assets/images/coverpic/cover-8.webp') center/cover}.price{font-size:34px;color:#f4d196;font-weight:850;margin:12px 0}.faq{max-width:820px;margin:auto}.faq details{background:var(--paper);border:1px solid var(--line);border-radius:16px;margin:12px 0;padding:19px 22px}.faq summary{font-weight:750;cursor:pointer;list-style:none}.faq summary:after{content:"＋";float:right;color:var(--coral)}.faq details[open] summary:after{content:"－"}.faq p{color:var(--muted);font-size:14px;margin:14px 25px 0 0}.formbox{background:linear-gradient(135deg,#f5d9aa,#f6eee2);border-radius:28px;padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:35px}.formbox p{color:#725f51}.form{display:grid;gap:12px}.form input,.form textarea{border:1px solid #ddcdb8;background:rgba(255,255,255,.75);border-radius:13px;padding:13px 15px;outline:none}.form input:focus,.form textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(8,127,120,.12)}.form textarea{min-height:90px;resize:vertical}.footer{background:#14272d;color:#d6e3df;padding:55px 0 25px}.footer-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:35px}.footer h3{color:#fff;margin:0 0 14px;font-size:15px}.footer p,.footer a{color:#a8bfba;font-size:13px}.footer a:hover{color:#f3d08f}.footer-bottom{border-top:1px solid rgba(255,255,255,.13);margin-top:35px;padding-top:18px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:12px;color:#94aaa7}.crumb{padding:18px 0 0;color:var(--muted);font-size:13px}.crumb a{color:var(--teal)}.float{position:fixed;right:22px;bottom:22px;z-index:10}
    @media(max-width:1024px){.grid-4{grid-template-columns:repeat(2,1fr)}.container{width:min(100% - 32px,900px)}.hero{min-height:610px}.footer-grid{grid-template-columns:2fr 1fr 1fr}}
    @media(max-width:768px){.navlinks,.nav-cta{display:none}.menu{display:block;margin-left:auto}.wide-story,.news-layout,.member,.formbox{grid-template-columns:1fr}.member-art{min-height:220px}.section-head{display:block}.section-head p{margin-top:14px}.stats{grid-template-columns:repeat(2,1fr)}.news-item{grid-template-columns:75px 1fr}.news-item .more{display:none}.footer-grid{grid-template-columns:1fr 1fr}.hero h1{font-size:47px}}
    @media(max-width:520px){section{padding:65px 0}.grid-3,.grid-4,.grid-2{grid-template-columns:1fr}.hero{min-height:650px}.hero p{font-size:16px}.hero-board{margin-top:42px}.metric{min-width:calc(50% - 8px)}.stats{grid-template-columns:1fr 1fr}.stat{padding:20px 14px}.stat strong{font-size:28px}.formbox,.member-text{padding:26px}.footer-grid{grid-template-columns:1fr}.story-img img{height:300px}.logo{font-size:22px}}

/* roulang page: category1 */
:root{--ink:#17212b;--muted:#697785;--cream:#f7f4ee;--paper:#fffdf9;--teal:#087f78;--teal-dark:#075b5b;--coral:#e87961;--gold:#d4a24c;--line:#e8e2d9;--radius:22px;--shadow:0 18px 50px rgba(29,45,52,.1)}
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;color:var(--ink);background:var(--cream);font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;line-height:1.8}
    a{text-decoration:none;color:inherit}
    img{display:block;max-width:100%}
    button,input,textarea{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(1180px,calc(100% - 40px));margin:auto}
    .header{position:sticky;top:0;z-index:20;background:rgba(255,253,249,.92);backdrop-filter:blur(18px);border-bottom:1px solid rgba(232,226,217,.9)}
    .nav{height:76px;display:flex;align-items:center;gap:30px}
    .logo{font-size:25px;font-weight:900;letter-spacing:.04em;color:var(--teal-dark)}
    .logo span{color:var(--coral)}
    .navlinks{display:flex;align-items:center;gap:6px;margin-left:auto}
    .navlinks a{padding:9px 13px;color:#52616b;border-radius:12px;font-size:14px;transition:.25s}
    .navlinks a:hover,.navlinks a.active{color:var(--teal-dark);background:#e9f3ef}
    .nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:12px 21px;font-weight:750;transition:.25s}
    .nav-cta,.btn-primary{background:var(--teal);color:#fff;box-shadow:0 8px 20px rgba(8,127,120,.2)}
    .nav-cta:hover,.btn-primary:hover{background:var(--teal-dark);transform:translateY(-2px)}
    .menu{display:none;background:none;color:var(--teal-dark);font-size:25px}
    .hero{min-height:600px;display:flex;align-items:center;background:linear-gradient(90deg,rgba(12,35,39,.9),rgba(12,35,39,.48)),url('/assets/images/backpic/back-2.webp') center/cover;position:relative;color:#fff}
    .hero:after{content:"";position:absolute;inset:auto 0 0;height:90px;background:linear-gradient(transparent,var(--cream))}
    .hero-inner{position:relative;z-index:1;width:100%;padding:86px 0}
    .eyebrow,.tag{display:inline-flex;border:1px solid rgba(255,255,255,.35);border-radius:99px;padding:5px 13px;font-size:13px;letter-spacing:.08em;color:#f9dca0}
    .hero h1{font-size:clamp(42px,6vw,72px);line-height:1.14;max-width:760px;margin:22px 0 18px;letter-spacing:-.04em}
    .hero p{font-size:18px;max-width:670px;color:#e3ece9;margin:0 0 30px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
    .btn-light{background:#fff;color:var(--teal-dark)}
    .btn-light:hover{background:#f6d9a0}
    .btn-outline{border:1px solid rgba(255,255,255,.5);color:#fff}
    .btn-outline:hover{background:rgba(255,255,255,.12)}
    section{padding:86px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:34px}
    .section-head h2{font-size:clamp(28px,4vw,44px);line-height:1.25;margin:8px 0 0;letter-spacing:-.03em}
    .section-head p{max-width:550px;color:var(--muted);margin:0}
    .kicker{color:var(--coral);font-weight:800;font-size:13px;letter-spacing:.12em}
    .grid{display:grid;gap:20px}
    .grid-4{grid-template-columns:repeat(4,1fr)}
    .grid-3{grid-template-columns:repeat(3,1fr)}
    .grid-2{grid-template-columns:repeat(2,1fr)}
    .card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:25px;box-shadow:0 8px 24px rgba(40,49,48,.035);transition:.3s}
    .card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#c6ddd7}
    .card h3{margin:0 0 9px;font-size:19px}
    .card p{margin:0;color:var(--muted);font-size:14px}
    .metric{padding:27px;background:#fffdf9;border:1px solid var(--line);border-radius:18px}
    .metric strong{display:block;font-size:34px;color:var(--teal-dark);line-height:1.2}
    .metric span{font-size:13px;color:var(--muted)}
    .crumb{padding:20px 0 0;font-size:13px;color:var(--muted)}
    .crumb a{color:var(--teal)}
    .icon{width:43px;height:43px;border-radius:14px;background:#e9f3ef;color:var(--teal-dark);display:grid;place-items:center;font-weight:900;margin-bottom:20px}
    .service-row{display:grid;grid-template-columns:170px 1fr 150px;gap:25px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}
    .service-row:last-child{border-bottom:0}
    .service-row h3{margin:0;font-size:18px}
    .service-row p{margin:0;color:var(--muted);font-size:14px}
    .service-label{color:var(--coral);font-weight:800;font-size:13px}
    .story{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}
    .story-img{border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}
    .story-img img{width:100%;height:420px;object-fit:cover}
    .checklist{padding:0;margin:24px 0;list-style:none}
    .checklist li{padding:11px 0;border-bottom:1px solid var(--line);font-size:15px}
    .checklist li:before{content:"✓";color:var(--coral);font-weight:900;margin-right:12px}
    .dark{background:#14272d;color:#fff}
    .dark .section-head p,.dark .card p{color:#c8ddda}
    .dark .card{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.15)}
    .dark .icon{background:rgba(255,255,255,.12);color:#f6d9a0}
    .step{position:relative;padding-top:50px}
    .step-no{position:absolute;top:0;left:0;color:var(--gold);font-size:31px;font-weight:900}
    .faq{max-width:850px;margin:auto}
    .faq details{background:var(--paper);border:1px solid var(--line);border-radius:16px;margin:12px 0;padding:19px 22px}
    .faq summary{font-weight:750;cursor:pointer;list-style:none}
    .faq summary::-webkit-details-marker{display:none}
    .faq summary:after{content:"＋";float:right;color:var(--coral)}
    .faq details[open] summary:after{content:"－"}
    .faq p{color:var(--muted);font-size:14px;margin:14px 25px 0 0}
    .formbox{background:linear-gradient(135deg,#f5d9aa,#f6eee2);border-radius:28px;padding:42px;display:grid;grid-template-columns:1fr 1fr;gap:35px}
    .formbox h2{font-size:36px;line-height:1.3;margin:0 0 15px}
    .formbox p{color:#725f51}
    .form{display:grid;gap:12px}
    .form input,.form textarea{border:1px solid #ddcdb8;background:rgba(255,255,255,.75);border-radius:13px;padding:13px 15px;outline:none}
    .form input:focus,.form textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(8,127,120,.12)}
    .form textarea{min-height:100px;resize:vertical}
    .form small{color:#725f51}
    .footer{background:#14272d;color:#d6e3df;padding:55px 0 25px}
    .footer-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:35px}
    .footer h3{color:#fff;margin:0 0 14px;font-size:15px}
    .footer p,.footer a{color:#a8bfba;font-size:13px}
    .footer a:hover{color:#f3d08f}
    .footer-bottom{border-top:1px solid rgba(255,255,255,.13);margin-top:35px;padding-top:18px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:12px;color:#94aaa7}
    .badge{display:inline-block;background:#f8ead0;color:#86662d;border-radius:99px;padding:5px 11px;font-size:12px;font-weight:700}
    @media(max-width:1024px){.navlinks{gap:0}.navlinks a{padding:8px 8px;font-size:13px}.grid-4{grid-template-columns:repeat(2,1fr)}}
    @media(max-width:768px){.container{width:min(100% - 32px,900px)}.navlinks,.nav-cta{display:none}.navlinks.show{display:flex;position:absolute;top:76px;left:0;right:0;background:var(--paper);padding:14px 16px;flex-direction:column;align-items:stretch;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}.navlinks.show a{padding:12px 15px}.menu{display:block;margin-left:auto}.hero{min-height:620px}.hero h1{font-size:48px}.hero p{font-size:16px}.section-head{display:block}.section-head p{margin-top:14px}.grid-3,.grid-4,.grid-2,.story,.formbox{grid-template-columns:1fr}.service-row{grid-template-columns:1fr;gap:6px}.service-row .btn{justify-self:start}.story-img img{height:310px}.formbox{padding:28px}.formbox h2{font-size:30px}.footer-grid{grid-template-columns:1fr 1fr}}
    @media(max-width:520px){section{padding:64px 0}.hero h1{font-size:42px}.hero-inner{padding:65px 0}.hero-actions .btn{width:100%}.grid-4{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.footer-bottom{display:block}.footer-bottom span{display:block;margin:8px 0}}

/* roulang page: category2 */
:root{--ink:#17212b;--muted:#697785;--cream:#f7f4ee;--paper:#fffdf9;--teal:#087f78;--teal-dark:#075b5b;--coral:#e87961;--gold:#d4a24c;--line:#e8e2d9;--radius:22px;--shadow:0 18px 50px rgba(29,45,52,.1)}
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;color:var(--ink);background:var(--cream);font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;line-height:1.8}
    a{text-decoration:none;color:inherit}
    img{display:block;max-width:100%}
    button,input,textarea{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(1180px,calc(100% - 40px));margin:auto}
    .header{position:sticky;top:0;z-index:20;background:rgba(255,253,249,.92);backdrop-filter:blur(18px);border-bottom:1px solid rgba(232,226,217,.9)}
    .nav{height:76px;display:flex;align-items:center;gap:24px}
    .logo{font-size:25px;font-weight:900;letter-spacing:.04em;color:var(--teal-dark)}
    .logo span{color:var(--coral)}
    .navlinks{display:flex;align-items:center;gap:4px;margin-left:auto}
    .navlinks a{padding:9px 11px;color:#52616b;border-radius:12px;font-size:14px;transition:.25s;white-space:nowrap}
    .navlinks a:hover,.navlinks a.active{color:var(--teal-dark);background:#e9f3ef}
    .nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:12px 21px;font-weight:750;transition:.25s}
    .nav-cta,.btn-primary{background:var(--teal);color:#fff;box-shadow:0 8px 20px rgba(8,127,120,.2)}
    .nav-cta:hover,.btn-primary:hover{background:var(--teal-dark);transform:translateY(-2px)}
    .menu{display:none;background:none;color:var(--teal-dark);font-size:25px}
    .hero{min-height:610px;display:flex;align-items:center;position:relative;background:linear-gradient(90deg,rgba(12,35,39,.9),rgba(12,35,39,.48)),url('/assets/images/backpic/back-2.webp') center/cover;color:#fff}
    .hero:after{content:"";position:absolute;inset:auto 0 0;height:90px;background:linear-gradient(transparent,var(--cream))}
    .hero-inner{position:relative;z-index:1;padding:80px 0;width:100%}
    .eyebrow,.tag{display:inline-flex;border:1px solid rgba(255,255,255,.35);border-radius:99px;padding:5px 13px;font-size:13px;letter-spacing:.08em;color:#f9dca0}
    .hero h1{font-size:clamp(42px,7vw,76px);line-height:1.12;max-width:760px;margin:22px 0 18px;letter-spacing:-.04em}
    .hero p{font-size:18px;max-width:690px;color:#e3ece9;margin:0 0 28px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
    .btn-light{background:#fff;color:var(--teal-dark)}
    .btn-light:hover{background:#f6d9a0}
    .btn-outline{border:1px solid rgba(255,255,255,.5);color:#fff}
    .btn-outline:hover{background:rgba(255,255,255,.12)}
    .trustline{display:flex;gap:18px;flex-wrap:wrap;margin-top:35px;color:#d8e9e5;font-size:13px}
    .trustline span:before{content:"✓";color:#f2ca7e;margin-right:7px;font-weight:800}
    section{padding:88px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:32px}
    .section-head h2{font-size:clamp(28px,4vw,44px);line-height:1.25;margin:8px 0 0;letter-spacing:-.03em}
    .section-head p{max-width:520px;color:var(--muted);margin:0}
    .kicker{color:var(--teal);font-size:13px;font-weight:800;letter-spacing:.12em}
    .grid{display:grid;gap:20px}
    .grid-4{grid-template-columns:repeat(4,1fr)}
    .grid-3{grid-template-columns:repeat(3,1fr)}
    .grid-2{grid-template-columns:repeat(2,1fr)}
    .card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:25px;box-shadow:0 8px 24px rgba(40,49,48,.035);transition:.3s}
    .card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#c6ddd7}
    .card h3{margin:0 0 9px;font-size:19px}
    .card p{margin:0;color:var(--muted);font-size:14px}
    .metric{padding:25px 20px;border-left:3px solid var(--coral);background:var(--paper);border-radius:0 18px 18px 0}
    .metric strong{display:block;color:var(--teal-dark);font-size:31px;line-height:1.2}
    .metric span{color:var(--muted);font-size:14px}
    .image-card{overflow:hidden;padding:0}
    .image-card img{width:100%;height:220px;object-fit:cover;transition:.4s}
    .image-card:hover img{transform:scale(1.05)}
    .image-card .card-copy{padding:22px}
    .story{display:grid;grid-template-columns:.9fr 1.1fr;gap:55px;align-items:center}
    .story-img{border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}
    .story-img img{width:100%;height:430px;object-fit:cover}
    .checklist{padding:0;margin:24px 0;list-style:none}
    .checklist li{padding:12px 0;border-bottom:1px solid var(--line);font-size:15px}
    .checklist li:before{content:"✓";color:var(--coral);font-weight:900;margin-right:12px}
    .dark{background:#142f34;color:#fff}
    .dark .section-head p,.dark .card p{color:#c8ddda}
    .dark .card{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.15)}
    .dark .kicker{color:#f2ca7e}
    .step{position:relative;padding-top:54px}
    .step-num{position:absolute;top:20px;left:25px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#f6d9a0;color:var(--teal-dark);font-weight:900}
    .compare{display:grid;grid-template-columns:1fr 1fr;gap:0;background:var(--paper);border:1px solid var(--line);border-radius:24px;overflow:hidden}
    .compare>div{padding:31px}
    .compare>div+div{background:#e9f3ef;border-left:1px solid var(--line)}
    .compare h3{margin-top:0}
    .compare ul{padding-left:20px;color:var(--muted)}
    .quote{font-size:20px;line-height:1.7;color:var(--teal-dark)}
    .faq{max-width:850px;margin:auto}
    .faq details{background:var(--paper);border:1px solid var(--line);border-radius:16px;margin:12px 0;padding:18px 22px}
    .faq summary{font-weight:750;cursor:pointer;list-style:none}
    .faq summary::-webkit-details-marker{display:none}
    .faq summary:after{content:"＋";float:right;color:var(--coral)}
    .faq details[open] summary:after{content:"－"}
    .faq p{color:var(--muted);font-size:14px;margin:14px 25px 0 0}
    .formbox{background:linear-gradient(135deg,#f5d9aa,#f6eee2);border-radius:28px;padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:35px}
    .formbox p{color:#725f51}
    .form{display:grid;gap:12px}
    .form input,.form textarea{border:1px solid #ddcdb8;background:rgba(255,255,255,.75);border-radius:13px;padding:13px 15px;outline:none}
    .form input:focus,.form textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(8,127,120,.12)}
    .form textarea{min-height:105px;resize:vertical}
    .notice{font-size:12px;color:#806e5d}
    .footer{background:#14272d;color:#d6e3df;padding:55px 0 25px}
    .footer-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:35px}
    .footer h3{color:#fff;margin:0 0 14px;font-size:15px}
    .footer p,.footer a{color:#a8bfba;font-size:13px}
    .footer a:hover{color:#f3d08f}
    .footer-bottom{border-top:1px solid rgba(255,255,255,.13);margin-top:35px;padding-top:18px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:12px;color:#94aaa7}
    .crumb{padding:18px 0 0;color:var(--muted);font-size:13px}
    .crumb a{color:var(--teal)}
    @media(max-width:1100px){.navlinks a{padding:8px 7px;font-size:13px}.nav{gap:12px}.grid-4{grid-template-columns:repeat(2,1fr)}}
    @media(max-width:768px){.container{width:min(100% - 32px,900px)}.navlinks{display:none;position:absolute;top:76px;left:0;right:0;padding:12px 16px;background:var(--paper);border-bottom:1px solid var(--line);box-shadow:var(--shadow);flex-direction:column;align-items:stretch}.navlinks.show{display:flex}.navlinks a{padding:11px 14px}.nav-cta{display:none}.menu{display:block;margin-left:auto}.hero{min-height:650px}.hero h1{font-size:48px}.hero p{font-size:16px}.section-head{display:block}.section-head p{margin-top:14px}.story,.compare,.formbox{grid-template-columns:1fr}.compare>div+div{border-left:0;border-top:1px solid var(--line)}.footer-grid{grid-template-columns:1fr 1fr}}
    @media(max-width:520px){section{padding:62px 0}.grid-3,.grid-4,.grid-2{grid-template-columns:1fr}.hero h1{font-size:42px}.hero-inner{padding:60px 0}.trustline{gap:8px;display:grid}.story-img img{height:300px}.formbox{padding:25px}.footer-grid{grid-template-columns:1fr}.footer-bottom{display:block}.footer-bottom span{display:block;margin-bottom:8px}}

/* roulang page: category3 */
:root{--ink:#17212b;--muted:#697785;--cream:#f7f4ee;--paper:#fffdf9;--teal:#087f78;--teal-dark:#075b5b;--coral:#e87961;--gold:#d4a24c;--line:#e8e2d9;--radius:22px;--shadow:0 18px 50px rgba(29,45,52,.1)}
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;color:var(--ink);background:var(--cream);font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;line-height:1.8}
    a{text-decoration:none;color:inherit}
    img{display:block;max-width:100%}
    button,input,textarea{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(1180px,calc(100% - 40px));margin:auto}
    .header{position:sticky;top:0;z-index:30;background:rgba(255,253,249,.92);backdrop-filter:blur(18px);border-bottom:1px solid rgba(232,226,217,.9)}
    .nav{height:76px;display:flex;align-items:center;gap:30px}
    .logo{font-size:25px;font-weight:900;letter-spacing:.04em;color:var(--teal-dark)}
    .logo span{color:var(--coral)}
    .navlinks{display:flex;align-items:center;gap:6px;margin-left:auto}
    .navlinks a{padding:9px 13px;color:#52616b;border-radius:12px;font-size:14px;transition:.25s}
    .navlinks a:hover,.navlinks a.active{color:var(--teal-dark);background:#e9f3ef}
    .nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:12px 21px;font-weight:750;transition:.25s}
    .nav-cta,.btn-primary{background:var(--teal);color:white;box-shadow:0 8px 20px rgba(8,127,120,.2)}
    .nav-cta:hover,.btn-primary:hover{background:var(--teal-dark);transform:translateY(-2px)}
    .menu{display:none;background:none;color:var(--teal-dark);font-size:25px}
    .hero{min-height:590px;display:flex;align-items:center;background:linear-gradient(90deg,rgba(12,35,39,.9),rgba(12,35,39,.48)),url('/assets/images/backpic/back-2.webp') center/cover;position:relative;color:#fff}
    .hero:after{content:"";position:absolute;inset:auto 0 0;height:100px;background:linear-gradient(transparent,var(--cream))}
    .hero-inner{position:relative;z-index:1;width:100%;padding:75px 0}
    .eyebrow,.tag{display:inline-flex;border:1px solid rgba(255,255,255,.35);border-radius:99px;padding:5px 13px;font-size:13px;letter-spacing:.08em;color:#f9dca0}
    .hero h1{font-size:clamp(40px,6vw,70px);line-height:1.15;max-width:720px;margin:22px 0 18px;letter-spacing:-.04em}
    .hero p{font-size:18px;max-width:680px;color:#e3ece9;margin:0 0 30px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
    .btn-light{background:#fff;color:var(--teal-dark)}
    .btn-light:hover{background:#f6d9a0}
    .btn-outline{border:1px solid rgba(255,255,255,.5);color:white}
    .btn-outline:hover{background:rgba(255,255,255,.12)}
    .hero-panel{position:absolute;right:0;bottom:55px;width:300px;padding:22px;border:1px solid rgba(255,255,255,.2);border-radius:24px;background:rgba(17,45,48,.72);backdrop-filter:blur(12px)}
    .panel-top{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:#cfe1dc}
    .ring{width:116px;height:116px;margin:16px auto;display:grid;place-items:center;border-radius:50%;background:conic-gradient(var(--coral) 0 78%,rgba(255,255,255,.16) 78% 100%);position:relative}
    .ring:after{content:"";position:absolute;inset:11px;border-radius:50%;background:#17393c}
    .ring strong{position:relative;z-index:1;font-size:24px;color:#fff}
    .panel-list{display:grid;gap:8px;font-size:13px;color:#d7e7e2}
    .panel-list span{display:flex;justify-content:space-between;padding-bottom:7px;border-bottom:1px solid rgba(255,255,255,.12)}
    .crumbbar{padding:22px 0 0;color:var(--muted);font-size:14px}
    .crumbbar a{color:var(--teal)}
    section{padding:86px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:34px}
    .section-head h2{font-size:clamp(28px,4vw,44px);line-height:1.25;margin:8px 0 0;letter-spacing:-.03em}
    .section-head p{max-width:520px;color:var(--muted);margin:0}
    .label{color:var(--coral);font-size:13px;font-weight:800;letter-spacing:.12em}
    .grid{display:grid;gap:20px}
    .grid-4{grid-template-columns:repeat(4,1fr)}
    .grid-3{grid-template-columns:repeat(3,1fr)}
    .grid-2{grid-template-columns:repeat(2,1fr)}
    .card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:25px;box-shadow:0 8px 24px rgba(40,49,48,.035);transition:.3s}
    .card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#c6ddd7}
    .card h3{margin:0 0 9px;font-size:19px}
    .card p{margin:0;color:var(--muted);font-size:14px}
    .metric{padding:28px 24px;border-left:4px solid var(--coral)}
    .metric strong{display:block;font-size:34px;color:var(--teal-dark);line-height:1.2}
    .metric span{display:block;color:var(--muted);font-size:14px;margin-top:8px}
    .service-card{min-height:230px;position:relative;overflow:hidden}
    .service-card .num{font-size:42px;color:#dcece6;font-weight:900;position:absolute;right:20px;top:9px}
    .service-card h3{position:relative;margin-top:34px}
    .service-card p{position:relative}
    .service-card ul{padding:0;margin:18px 0 0;list-style:none;color:var(--muted);font-size:13px}
    .service-card li{padding:4px 0}
    .service-card li:before{content:"✓";color:var(--coral);font-weight:900;margin-right:8px}
    .split{display:grid;grid-template-columns:.92fr 1.08fr;gap:52px;align-items:center}
    .story-img{border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}
    .story-img img{width:100%;height:430px;object-fit:cover}
    .story-copy h2{font-size:clamp(29px,4vw,45px);line-height:1.25;margin:10px 0 18px}
    .story-copy p{color:var(--muted)}
    .checklist{padding:0;margin:24px 0;list-style:none}
    .checklist li{padding:11px 0;border-bottom:1px solid var(--line);font-size:15px}
    .checklist li:before{content:"✓";color:var(--coral);font-weight:900;margin-right:12px}
    .dark{background:#142f33;color:#fff}
    .dark .section-head p,.dark .card p{color:#c8ddda}
    .dark .card{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.15)}
    .compare{display:grid;grid-template-columns:1fr 1fr;gap:20px}
    .compare-box{padding:30px;border-radius:22px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15)}
    .compare-box.good{background:#f1d8a8;color:var(--ink);border:0}
    .compare-box h3{margin:0 0 18px}
    .compare-box ul{padding:0;margin:0;list-style:none;font-size:14px}
    .compare-box li{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.15)}
    .compare-box.good li{border-color:rgba(23,33,43,.12)}
    .timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
    .step{position:relative;padding:23px 20px 22px;background:var(--paper);border:1px solid var(--line);border-radius:20px}
    .step b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--teal);color:#fff;margin-bottom:18px}
    .step h3{font-size:17px;margin:0 0 7px}
    .step p{font-size:13px;color:var(--muted);margin:0}
    .quote{font-size:23px;line-height:1.7;margin:0 0 22px}
    .person{display:flex;align-items:center;gap:13px;color:var(--muted);font-size:13px}
    .avatar{width:42px;height:42px;border-radius:50%;background:#d4a24c;display:grid;place-items:center;color:#fff;font-weight:800}
    .faq{max-width:850px;margin:auto}
    .faq details{background:var(--paper);border:1px solid var(--line);border-radius:16px;margin:12px 0;padding:19px 22px}
    .faq summary{font-weight:750;cursor:pointer;list-style:none}
    .faq summary:after{content:"＋";float:right;color:var(--coral)}
    .faq details[open] summary:after{content:"－"}
    .faq p{color:var(--muted);font-size:14px;margin:14px 25px 0 0}
    .formbox{background:linear-gradient(135deg,#f5d9aa,#f6eee2);border-radius:28px;padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:35px}
    .formbox h2{font-size:36px;line-height:1.3;margin:8px 0 15px}
    .formbox p{color:#725f51}
    .form{display:grid;gap:12px}
    .form input,.form textarea{border:1px solid #ddcdb8;background:rgba(255,255,255,.75);border-radius:13px;padding:13px 15px;outline:none}
    .form input:focus,.form textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(8,127,120,.12)}
    .form textarea{min-height:110px;resize:vertical}
    .form-note{font-size:12px;color:#866f5d;margin:0}
    .footer{background:#14272d;color:#d6e3df;padding:55px 0 25px}
    .footer-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:35px}
    .footer h3{color:#fff;margin:0 0 14px;font-size:15px}
    .footer p,.footer a{color:#a8bfba;font-size:13px}
    .footer a:hover{color:#f3d08f}
    .footer-bottom{border-top:1px solid rgba(255,255,255,.13);margin-top:35px;padding-top:18px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:12px;color:#94aaa7}
    .more-link{color:var(--teal);font-weight:750;font-size:13px}
    @media(max-width:1024px){.navlinks a{padding:8px 8px}.hero-panel{right:20px}.grid-4{grid-template-columns:repeat(2,1fr)}}
    @media(max-width:768px){.container{width:min(100% - 32px,900px)}.navlinks,.nav-cta{display:none}.navlinks.show{display:flex;position:absolute;top:76px;left:0;right:0;margin:0;padding:15px 16px;flex-direction:column;align-items:stretch;background:var(--paper);border-bottom:1px solid var(--line);box-shadow:var(--shadow)}.navlinks.show a{padding:11px 15px}.menu{display:block;margin-left:auto}.hero{min-height:690px}.hero-panel{position:relative;right:auto;bottom:auto;margin-top:40px;width:100%;max-width:330px}.hero-inner{padding:65px 0}.hero h1{font-size:47px}.hero p{font-size:16px}.section-head{display:block}.section-head p{margin-top:14px}.split,.formbox,.compare{grid-template-columns:1fr}.timeline{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}}
    @media(max-width:520px){section{padding:65px 0}.grid-2,.grid-3,.grid-4,.timeline{grid-template-columns:1fr}.hero h1{font-size:40px}.story-img img{height:300px}.formbox{padding:26px}.formbox h2{font-size:30px}.footer-grid{grid-template-columns:1fr}.footer-bottom{display:block}.footer-bottom span{display:block;margin:8px 0}}

/* roulang page: category5 */
:root{--ink:#17212b;--muted:#697785;--cream:#f7f4ee;--paper:#fffdf9;--teal:#087f78;--teal-dark:#075b5b;--coral:#e87961;--gold:#d4a24c;--line:#e8e2d9;--radius:22px;--shadow:0 18px 50px rgba(29,45,52,.1)}
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;color:var(--ink);background:var(--cream);font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;line-height:1.8}
    a{text-decoration:none;color:inherit}
    img{display:block;max-width:100%}
    button,input,textarea{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(1180px,calc(100% - 40px));margin:auto}
    .header{position:sticky;top:0;z-index:20;background:rgba(255,253,249,.92);backdrop-filter:blur(18px);border-bottom:1px solid rgba(232,226,217,.9)}
    .nav{height:76px;display:flex;align-items:center;gap:30px}
    .logo{font-size:25px;font-weight:900;letter-spacing:.04em;color:var(--teal-dark)}
    .logo span{color:var(--coral)}
    .navlinks{display:flex;align-items:center;gap:5px;margin-left:auto}
    .navlinks a{padding:9px 12px;color:#52616b;border-radius:12px;font-size:14px;transition:.25s;white-space:nowrap}
    .navlinks a:hover,.navlinks a.active{color:var(--teal-dark);background:#e9f3ef}
    .nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:12px 21px;font-weight:750;transition:.25s}
    .nav-cta,.btn-primary{background:var(--teal);color:#fff;box-shadow:0 8px 20px rgba(8,127,120,.2)}
    .nav-cta:hover,.btn-primary:hover{background:var(--teal-dark);transform:translateY(-2px)}
    .menu{display:none;background:none;color:var(--teal-dark);font-size:25px}
    .hero{position:relative;min-height:590px;display:flex;align-items:center;color:#fff;background:linear-gradient(90deg,rgba(10,39,42,.9),rgba(10,39,42,.46)),url('/assets/images/backpic/back-2.webp') center/cover}
    .hero:after{content:"";position:absolute;bottom:0;left:0;right:0;height:90px;background:linear-gradient(transparent,var(--cream))}
    .hero-inner{position:relative;z-index:1;width:100%;padding:75px 0}
    .eyebrow,.tag{display:inline-flex;border:1px solid rgba(255,255,255,.35);border-radius:99px;padding:5px 13px;font-size:13px;letter-spacing:.08em;color:#f9dca0}
    .hero h1{font-size:clamp(42px,6vw,72px);line-height:1.14;max-width:760px;margin:22px 0 18px;letter-spacing:-.04em}
    .hero p{font-size:18px;max-width:680px;color:#e3ece9;margin:0 0 28px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
    .btn-light{background:#fff;color:var(--teal-dark)}
    .btn-light:hover{background:#f6d9a0;transform:translateY(-2px)}
    .btn-outline{border:1px solid rgba(255,255,255,.5);color:#fff}
    .btn-outline:hover{background:rgba(255,255,255,.12)}
    .hero-panel{margin-top:46px;display:flex;gap:12px;flex-wrap:wrap}
    .metric{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(8px);border-radius:17px;padding:14px 18px;min-width:150px}
    .metric strong{display:block;font-size:24px;color:#f9dca0;line-height:1.2}
    .metric span{font-size:12px;color:#dce9e5}
    section{padding:86px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:32px}
    .section-head h2{font-size:clamp(28px,4vw,43px);line-height:1.25;margin:8px 0 0;letter-spacing:-.03em}
    .section-head p{max-width:530px;color:var(--muted);margin:0}
    .kicker{color:var(--coral);font-weight:800;font-size:13px;letter-spacing:.12em}
    .grid{display:grid;gap:20px}
    .grid-4{grid-template-columns:repeat(4,1fr)}
    .grid-3{grid-template-columns:repeat(3,1fr)}
    .grid-2{grid-template-columns:repeat(2,1fr)}
    .card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:25px;box-shadow:0 8px 24px rgba(40,49,48,.035);transition:.3s}
    .card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#c6ddd7}
    .card h3{margin:0 0 9px;font-size:19px}
    .card p{margin:0;color:var(--muted);font-size:14px}
    .icon{width:46px;height:46px;border-radius:15px;background:#e9f3ef;color:var(--teal);display:grid;place-items:center;font-size:22px;margin-bottom:18px}
    .feature-band{background:#eaf2ed}
    .split{display:grid;grid-template-columns:.92fr 1.08fr;gap:55px;align-items:center}
    .story-img{border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}
    .story-img img{width:100%;height:430px;object-fit:cover}
    .story-copy h2{font-size:40px;line-height:1.3;margin:8px 0 17px}
    .checklist{padding:0;margin:22px 0;list-style:none}
    .checklist li{padding:11px 0;border-bottom:1px solid var(--line);font-size:15px}
    .checklist li:before{content:"✓";color:var(--coral);font-weight:900;margin-right:12px}
    .dark{background:#142f33;color:#fff}
    .dark .section-head p,.dark .card p{color:#c8ddda}
    .dark .card{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14)}
    .dark .icon{background:rgba(255,255,255,.12);color:#f5d39a}
    .process{display:grid;grid-template-columns:1fr 1.4fr;gap:55px;align-items:start}
    .process-list{border-left:1px solid #b8d2c9;padding-left:25px}
    .process-item{position:relative;padding:0 0 28px}
    .process-item:before{content:"";position:absolute;left:-32px;top:9px;width:13px;height:13px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 5px #d5e8df}
    .process-item strong{display:block;font-size:18px;margin-bottom:5px}
    .process-item p{margin:0;color:var(--muted);font-size:14px}
    .result-box{background:var(--paper);border:1px solid var(--line);border-radius:24px;padding:28px}
    .bar{height:9px;border-radius:99px;background:#e8e2d9;overflow:hidden;margin:10px 0 18px}
    .bar i{display:block;height:100%;background:var(--teal);border-radius:inherit}
    .bar.coral i{background:var(--coral)}
    .bar.gold i{background:var(--gold)}
    .interest-photo{overflow:hidden;border-radius:22px;background:#ddd}
    .interest-photo img{width:100%;height:230px;object-fit:cover;transition:.4s}
    .interest-photo:hover img{transform:scale(1.05)}
    .photo-card{background:var(--paper);border:1px solid var(--line);border-radius:22px;overflow:hidden}
    .photo-card .caption{padding:18px 20px}
    .photo-card h3{margin:0 0 4px;font-size:18px}
    .photo-card p{margin:0;color:var(--muted);font-size:13px}
    .faq{max-width:850px;margin:auto}
    .faq details{background:var(--paper);border:1px solid var(--line);border-radius:16px;margin:12px 0;padding:18px 22px}
    .faq summary{font-weight:750;cursor:pointer;list-style:none}
    .faq summary::-webkit-details-marker{display:none}
    .faq summary:after{content:"＋";float:right;color:var(--coral)}
    .faq details[open] summary:after{content:"－"}
    .faq p{color:var(--muted);font-size:14px;margin:14px 25px 0 0}
    .crumb{padding:18px 0 0;color:var(--muted);font-size:13px}
    .crumb a{color:var(--teal)}
    .formbox{background:linear-gradient(135deg,#f5d9aa,#f6eee2);border-radius:28px;padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:35px}
    .formbox h2{font-size:36px;line-height:1.3;margin:10px 0}
    .formbox p{color:#725f51}
    .form{display:grid;gap:12px}
    .form input,.form textarea{border:1px solid #ddcdb8;background:rgba(255,255,255,.78);border-radius:13px;padding:13px 15px;outline:none}
    .form input:focus,.form textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(8,127,120,.12)}
    .form textarea{min-height:95px;resize:vertical}
    .form-note{font-size:12px;color:#7c6e60!important}
    .footer{background:#14272d;color:#d6e3df;padding:55px 0 25px}
    .footer-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:35px}
    .footer h3{color:#fff;margin:0 0 14px;font-size:15px}
    .footer p,.footer a{color:#a8bfba;font-size:13px}
    .footer a:hover{color:#f3d08f}
    .footer-bottom{border-top:1px solid rgba(255,255,255,.13);margin-top:35px;padding-top:18px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:12px;color:#94aaa7}
    .notice{margin-top:18px;color:var(--muted);font-size:13px}
    @media(max-width:1100px){.navlinks{gap:0}.navlinks a{padding:8px 8px;font-size:13px}.nav{gap:14px}}
    @media(max-width:900px){.navlinks,.nav-cta{display:none}.menu{display:block;margin-left:auto}.container{width:min(100% - 32px,900px)}.grid-4{grid-template-columns:repeat(2,1fr)}.split,.process{grid-template-columns:1fr;gap:30px}.formbox{grid-template-columns:1fr}.footer-grid{grid-template-columns:2fr 1fr 1fr}.hero{min-height:620px}}
    @media(max-width:600px){section{padding:62px 0}.hero h1{font-size:45px}.hero p{font-size:16px}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.section-head{display:block}.section-head p{margin-top:13px}.story-copy h2,.formbox h2{font-size:30px}.story-img img{height:300px}.formbox{padding:26px}.footer-grid{grid-template-columns:1fr}.hero-panel{margin-top:34px}.metric{min-width:135px}.crumb{padding-top:14px}}
    .navlinks.show{display:flex;position:absolute;left:16px;right:16px;top:67px;background:var(--paper);padding:12px;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch}
    .navlinks.show a{display:block}
    :focus-visible{outline:3px solid rgba(232,121,97,.55);outline-offset:3px}

/* roulang page: category6 */
:root{--ink:#17212b;--muted:#697785;--cream:#f7f4ee;--paper:#fffdf9;--teal:#087f78;--teal-dark:#075b5b;--coral:#e87961;--gold:#d4a24c;--line:#e8e2d9;--radius:22px;--shadow:0 18px 50px rgba(29,45,52,.1)}
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;color:var(--ink);background:var(--cream);font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;line-height:1.8}
    a{text-decoration:none;color:inherit}
    img{display:block;max-width:100%}
    button,input,textarea{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(1180px,calc(100% - 40px));margin:auto}
    .header{position:sticky;top:0;z-index:30;background:rgba(255,253,249,.92);backdrop-filter:blur(18px);border-bottom:1px solid rgba(232,226,217,.9)}
    .nav{height:76px;display:flex;align-items:center;gap:30px}
    .logo{font-size:25px;font-weight:900;letter-spacing:.04em;color:var(--teal-dark)}
    .logo span{color:var(--coral)}
    .navlinks{display:flex;align-items:center;gap:5px;margin-left:auto}
    .navlinks a{padding:9px 12px;color:#52616b;border-radius:12px;font-size:14px;transition:.25s;white-space:nowrap}
    .navlinks a:hover,.navlinks a.active{color:var(--teal-dark);background:#e9f3ef}
    .nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:12px 21px;font-weight:750;transition:.25s}
    .nav-cta,.btn-primary{background:var(--teal);color:#fff;box-shadow:0 8px 20px rgba(8,127,120,.2)}
    .nav-cta:hover,.btn-primary:hover{background:var(--teal-dark);transform:translateY(-2px)}
    .menu{display:none;background:none;color:var(--teal-dark);font-size:25px}
    .hero{min-height:600px;display:flex;align-items:center;background:linear-gradient(90deg,rgba(12,35,39,.88),rgba(12,35,39,.48)),url('/assets/images/backpic/back-2.webp') center/cover;position:relative;color:#fff}
    .hero:after{content:"";position:absolute;inset:auto 0 0;height:100px;background:linear-gradient(transparent,var(--cream))}
    .hero-inner{position:relative;z-index:1;width:100%;padding:80px 0}
    .eyebrow,.tag{display:inline-flex;border:1px solid rgba(255,255,255,.35);border-radius:99px;padding:5px 13px;font-size:13px;letter-spacing:.08em;color:#f9dca0}
    .hero h1{font-size:clamp(42px,6vw,72px);line-height:1.15;max-width:760px;margin:22px 0 18px;letter-spacing:-.04em}
    .hero p{font-size:18px;max-width:680px;color:#e3ece9;margin:0 0 28px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
    .btn-light{background:#fff;color:var(--teal-dark)}
    .btn-light:hover{background:#f6d9a0}
    .btn-outline{border:1px solid rgba(255,255,255,.5);color:#fff}
    .btn-outline:hover{background:rgba(255,255,255,.13)}
    .trustbar{display:flex;gap:10px;flex-wrap:wrap;margin-top:42px}
    .trustbar span{font-size:13px;color:#d7e8e3;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.17);padding:8px 13px;border-radius:10px}
    section{padding:88px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:34px}
    .section-head h2{font-size:clamp(28px,4vw,44px);line-height:1.25;margin:8px 0 0;letter-spacing:-.03em}
    .section-head p{max-width:530px;color:var(--muted);margin:0}
    .kicker{color:var(--coral);font-weight:800;font-size:13px;letter-spacing:.1em}
    .crumb{padding:20px 0 0;color:var(--muted);font-size:13px}
    .crumb a{color:var(--teal)}
    .grid{display:grid;gap:20px}
    .grid-4{grid-template-columns:repeat(4,1fr)}
    .grid-3{grid-template-columns:repeat(3,1fr)}
    .grid-2{grid-template-columns:repeat(2,1fr)}
    .card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:25px;box-shadow:0 8px 24px rgba(40,49,48,.035);transition:.3s}
    .card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#c6ddd7}
    .card h3{margin:0 0 9px;font-size:19px}
    .card p{margin:0;color:var(--muted);font-size:14px}
    .metric{background:#e8f3ef;border-radius:20px;padding:22px;border:1px solid #d2e7df}
    .metric strong{display:block;color:var(--teal-dark);font-size:32px;line-height:1.2}
    .metric small{color:var(--muted)}
    .iconbox{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:#f7e2c2;color:var(--teal-dark);font-weight:900;margin-bottom:19px}
    .service-card{display:flex;gap:17px;align-items:flex-start}
    .service-card .iconbox{flex:0 0 44px}
    .story{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center}
    .story-img{border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}
    .story-img img{width:100%;height:430px;object-fit:cover}
    .checklist{padding:0;margin:24px 0;list-style:none}
    .checklist li{padding:11px 0;border-bottom:1px solid var(--line);font-size:15px}
    .checklist li:before{content:"✓";color:var(--coral);font-weight:900;margin-right:12px}
    .dark{background:#142f32;color:#fff}
    .dark .section-head p,.dark .card p{color:#c8ddda}
    .dark .card{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14)}
    .dark .kicker{color:#f3d08f}
    .image-card{padding:0;overflow:hidden}
    .image-card img{height:220px;width:100%;object-fit:cover;transition:.4s}
    .image-card:hover img{transform:scale(1.05)}
    .image-card div{padding:21px}
    .split-note{border-left:4px solid var(--coral);padding:10px 0 10px 22px;color:var(--muted)}
    .compare{display:grid;grid-template-columns:1fr 1fr;gap:0;background:var(--paper);border:1px solid var(--line);border-radius:24px;overflow:hidden}
    .compare>div{padding:30px}
    .compare>div+div{background:#e9f3ef;border-left:1px solid var(--line)}
    .compare h3{margin-top:0}
    .compare ul{padding-left:20px;color:var(--muted)}
    .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
    .step{position:relative;padding:8px 26px 8px 0}
    .step:not(:last-child):after{content:"→";position:absolute;right:15px;top:18px;color:var(--coral);font-size:24px}
    .step-num{color:var(--coral);font-weight:900;font-size:14px}
    .step h3{font-size:18px;margin:7px 0}
    .step p{font-size:14px;color:var(--muted);margin:0}
    .quote{font-size:18px;line-height:1.9;color:var(--ink)}
    .quote:before{content:"“";font-size:52px;color:var(--coral);line-height:0;vertical-align:-20px;margin-right:6px}
    .faq{max-width:850px;margin:auto}
    .faq details{background:var(--paper);border:1px solid var(--line);border-radius:16px;margin:12px 0;padding:19px 22px}
    .faq summary{font-weight:750;cursor:pointer;list-style:none}
    .faq summary:after{content:"＋";float:right;color:var(--coral)}
    .faq details[open] summary:after{content:"－"}
    .faq p{color:var(--muted);font-size:14px;margin:14px 25px 0 0}
    .formbox{background:linear-gradient(135deg,#f5d9aa,#f6eee2);border-radius:28px;padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:35px}
    .formbox p{color:#725f51}
    .form{display:grid;gap:12px}
    .form input,.form textarea{border:1px solid #ddcdb8;background:rgba(255,255,255,.75);border-radius:13px;padding:13px 15px;outline:none;width:100%}
    .form input:focus,.form textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(8,127,120,.12)}
    .form textarea{min-height:105px;resize:vertical}
    .form-note{font-size:12px;color:#806e5f;margin:0}
    .footer{background:#14272d;color:#d6e3df;padding:55px 0 25px}
    .footer-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:35px}
    .footer h3{color:#fff;margin:0 0 14px;font-size:15px}
    .footer p,.footer a{color:#a8bfba;font-size:13px}
    .footer a:hover{color:#f3d08f}
    .footer-bottom{border-top:1px solid rgba(255,255,255,.13);margin-top:35px;padding-top:18px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:12px;color:#94aaa7}
    @media(max-width:1100px){.nav{gap:12px}.navlinks a{padding:8px 7px;font-size:13px}.nav-cta{padding:10px 14px}}
    @media(max-width:900px){.navlinks,.nav-cta{display:none}.menu{display:block;margin-left:auto}.hero{min-height:650px}.grid-4{grid-template-columns:repeat(2,1fr)}.story{grid-template-columns:1fr;gap:28px}.story-img img{height:340px}.steps{grid-template-columns:repeat(2,1fr);gap:25px}.step:not(:last-child):after{display:none}}
    @media(max-width:600px){.container{width:min(100% - 32px,900px)}section{padding:65px 0}.hero h1{font-size:45px}.hero p{font-size:16px}.section-head{display:block}.section-head p{margin-top:14px}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.formbox{grid-template-columns:1fr;padding:26px;gap:20px}.compare{grid-template-columns:1fr}.compare>div+div{border-left:0;border-top:1px solid var(--line)}.steps{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}.story-img img{height:290px}.logo{font-size:22px}}
    @media(max-width:380px){.footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}}

/* roulang page: category7 */
:root{--ink:#17212b;--muted:#697785;--cream:#f7f4ee;--paper:#fffdf9;--teal:#087f78;--teal-dark:#075b5b;--coral:#e87961;--gold:#d4a24c;--line:#e8e2d9;--radius:22px;--shadow:0 18px 50px rgba(29,45,52,.1)}
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;color:var(--ink);background:var(--cream);font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;line-height:1.8}
    a{text-decoration:none;color:inherit}
    img{display:block;max-width:100%}
    button,input,textarea,select{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(1180px,calc(100% - 40px));margin:auto}
    .header{position:sticky;top:0;z-index:20;background:rgba(255,253,249,.92);backdrop-filter:blur(18px);border-bottom:1px solid rgba(232,226,217,.9)}
    .nav{height:76px;display:flex;align-items:center;gap:30px}
    .logo{font-size:25px;font-weight:900;letter-spacing:.04em;color:var(--teal-dark)}
    .logo span{color:var(--coral)}
    .navlinks{display:flex;align-items:center;gap:6px;margin-left:auto}
    .navlinks a{padding:9px 13px;color:#52616b;border-radius:12px;font-size:14px;transition:.25s}
    .navlinks a:hover,.navlinks a.active{color:var(--teal-dark);background:#e9f3ef}
    .nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:12px 21px;font-weight:750;transition:.25s}
    .nav-cta,.btn-primary{background:var(--teal);color:white;box-shadow:0 8px 20px rgba(8,127,120,.2)}
    .nav-cta:hover,.btn-primary:hover{background:var(--teal-dark);transform:translateY(-2px)}
    .menu{display:none;background:none;color:var(--teal-dark);font-size:25px}
    .hero{position:relative;overflow:hidden;padding:75px 0 100px;background:linear-gradient(110deg,rgba(9,46,48,.92),rgba(9,46,48,.58)),url('/assets/images/backpic/back-2.webp') center/cover;color:#fff}
    .hero:after{content:"";position:absolute;right:-10%;top:15%;width:42%;height:70%;border:1px solid rgba(243,208,143,.32);transform:skewY(-8deg);border-radius:40px}
    .hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:5fr 7fr;gap:48px;align-items:center}
    .hero-copy{padding:22px 0}
    .eyebrow,.tag{display:inline-flex;border:1px solid rgba(255,255,255,.35);border-radius:99px;padding:5px 13px;font-size:13px;letter-spacing:.08em;color:#f9dca0}
    .hero h1{font-size:clamp(42px,6vw,72px);line-height:1.13;max-width:560px;margin:22px 0 18px;letter-spacing:-.045em}
    .hero p{font-size:18px;max-width:560px;color:#e3ece9;margin:0 0 30px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
    .btn-light{background:#fff;color:var(--teal-dark)}
    .btn-light:hover{background:#f6d9a0}
    .btn-outline{border:1px solid rgba(255,255,255,.5);color:white}
    .btn-outline:hover{background:rgba(255,255,255,.12)}
    .hero-visual{position:relative;transform:translate(26px,16px) rotate(3deg)}
    .hero-visual img{width:100%;height:470px;object-fit:cover;border-radius:36px 12px 36px 12px;box-shadow:0 28px 70px rgba(0,0,0,.3);border:8px solid rgba(255,255,255,.12)}
    .floating-note{position:absolute;left:-36px;bottom:28px;background:var(--paper);color:var(--ink);padding:18px 20px;border-radius:18px;box-shadow:var(--shadow);transform:rotate(-5deg);max-width:220px}
    .floating-note strong{display:block;color:var(--teal-dark);font-size:23px;line-height:1.2}
    .floating-note small{color:var(--muted)}
    .crumbbar{background:var(--paper);border-bottom:1px solid var(--line)}
    .crumb{padding:17px 0;color:var(--muted);font-size:14px}
    .crumb a{color:var(--teal)}
    section{padding:88px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:34px}
    .section-head h2{font-size:clamp(28px,4vw,44px);line-height:1.25;margin:8px 0 0;letter-spacing:-.03em}
    .section-head p{max-width:530px;color:var(--muted);margin:0}
    .kicker{font-size:13px;letter-spacing:.12em;color:var(--coral);font-weight:800}
    .grid{display:grid;gap:20px}
    .grid-4{grid-template-columns:repeat(4,1fr)}
    .grid-3{grid-template-columns:repeat(3,1fr)}
    .grid-2{grid-template-columns:repeat(2,1fr)}
    .card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:25px;box-shadow:0 8px 24px rgba(40,49,48,.035);transition:.3s}
    .card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#c6ddd7}
    .card h3{margin:0 0 9px;font-size:19px}
    .card p{margin:0;color:var(--muted);font-size:14px}
    .metric-strip{display:grid;grid-template-columns:repeat(4,1fr);background:var(--paper);border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:var(--shadow)}
    .metric{padding:27px 25px;border-right:1px solid var(--line)}
    .metric:last-child{border:0}
    .metric strong{font-size:34px;line-height:1;color:var(--teal-dark);display:block}
    .metric span{display:block;margin-top:8px;color:var(--muted);font-size:14px}
    .icon-dot{width:42px;height:42px;border-radius:14px;background:#e8f3ef;color:var(--teal);display:grid;place-items:center;font-weight:900;margin-bottom:18px}
    .matrix{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:22px;overflow:hidden}
    .matrix div{background:var(--paper);padding:20px}
    .matrix .matrix-title{background:var(--teal-dark);color:#fff;font-weight:750}
    .matrix div:not(.matrix-title){color:var(--muted);font-size:14px}
    .matrix .yes{color:var(--teal-dark);font-weight:800}
    .split{display:grid;grid-template-columns:1fr 1.05fr;gap:58px;align-items:center}
    .split.reverse{grid-template-columns:1.05fr 1fr}
    .story-img{border-radius:30px;overflow:hidden;box-shadow:var(--shadow);position:relative}
    .story-img img{width:100%;height:430px;object-fit:cover}
    .story-img:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(8,127,120,.16),transparent 55%)}
    .checklist{padding:0;margin:24px 0;list-style:none}
    .checklist li{padding:12px 0;border-bottom:1px solid var(--line);font-size:15px}
    .checklist li:before{content:"✓";color:var(--coral);font-weight:900;margin-right:12px}
    .number-list{display:grid;gap:14px}
    .number-item{display:grid;grid-template-columns:48px 1fr;gap:15px;align-items:start}
    .number-item b{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#f5d9aa;color:#6a5131}
    .number-item h3{font-size:18px;margin:0 0 3px}
    .number-item p{margin:0;color:var(--muted);font-size:14px}
    .dark{background:#142f32;color:#fff}
    .dark .section-head p{color:#c8ddda}
    .dark .card{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14)}
    .dark .card p{color:#c8ddda}
    .result-table{width:100%;border-collapse:collapse;background:var(--paper);border-radius:22px;overflow:hidden;box-shadow:var(--shadow)}
    .result-table th,.result-table td{text-align:left;padding:18px 20px;border-bottom:1px solid var(--line)}
    .result-table th{color:var(--teal-dark);font-size:14px;background:#edf5f1}
    .result-table td{font-size:14px;color:var(--muted)}
    .result-table tr:last-child td{border:0}
    .quote{padding:30px;background:#f4e6cf;border-radius:24px;position:relative}
    .quote:before{content:"“";font-size:65px;line-height:1;color:var(--coral);position:absolute;top:8px;left:22px}
    .quote p{padding:24px 10px 0;margin:0;color:#5e5148;font-size:16px}
    .quote strong{display:block;margin-top:18px;color:var(--teal-dark);font-size:14px}
    .faq{max-width:850px;margin:auto}
    .faq details{background:var(--paper);border:1px solid var(--line);border-radius:16px;margin:12px 0;padding:19px 22px}
    .faq summary{font-weight:750;cursor:pointer;list-style:none}
    .faq summary::-webkit-details-marker{display:none}
    .faq summary:after{content:"＋";float:right;color:var(--coral)}
    .faq details[open] summary:after{content:"－"}
    .faq p{color:var(--muted);font-size:14px;margin:14px 25px 0 0}
    .formbox{background:linear-gradient(135deg,#f5d9aa,#f6eee2);border-radius:30px;padding:42px;display:grid;grid-template-columns:1fr 1fr;gap:38px}
    .formbox h2{font-size:36px;line-height:1.25;margin:10px 0 15px}
    .formbox p{color:#725f51}
    .form{display:grid;gap:12px}
    .form label{font-size:13px;color:#67594e;font-weight:700}
    .form input,.form textarea,.form select{width:100%;border:1px solid #ddcdb8;background:rgba(255,255,255,.75);border-radius:13px;padding:13px 15px;outline:none}
    .form input:focus,.form textarea:focus,.form select:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(8,127,120,.12)}
    .form textarea{min-height:105px;resize:vertical}
    .form-note{font-size:12px!important;color:#806f61!important;margin:0}
    .footer{background:#14272d;color:#d6e3df;padding:55px 0 25px}
    .footer-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:35px}
    .footer h3{color:#fff;margin:0 0 14px;font-size:15px}
    .footer p,.footer a{color:#a8bfba;font-size:13px}
    .footer a:hover{color:#f3d08f}
    .footer-bottom{border-top:1px solid rgba(255,255,255,.13);margin-top:35px;padding-top:18px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:12px;color:#94aaa7}
    .footer .logo{color:#fff}
    .footer .logo span{color:#f3d08f}
    .mini-label{display:inline-block;color:var(--coral);font-size:12px;font-weight:800;letter-spacing:.1em;margin-bottom:10px}
    @media(max-width:1024px){
      .navlinks{gap:0}.navlinks a{padding:8px 8px;font-size:13px}
      .hero-inner{gap:28px}.hero-visual{transform:translate(10px,10px) rotate(2deg)}
      .grid-4{grid-template-columns:repeat(2,1fr)}
    }
    @media(max-width:768px){
      .container{width:min(100% - 32px,900px)}
      .nav{height:68px}.navlinks,.nav-cta{display:none}
      .menu{display:block;margin-left:auto}
      .navlinks.show{display:flex;position:absolute;top:68px;left:16px;right:16px;padding:10px;flex-direction:column;align-items:stretch;background:var(--paper);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}
      .navlinks.show a{padding:12px 14px}
      .hero{padding:58px 0 78px}.hero-inner{grid-template-columns:1fr}
      .hero h1{font-size:48px}.hero p{font-size:16px}
      .hero-visual{transform:none;margin:10px 14px 0}.hero-visual img{height:340px}
      .floating-note{left:-10px;bottom:18px}
      section{padding:66px 0}.section-head{display:block}.section-head p{margin-top:14px}
      .metric-strip{grid-template-columns:repeat(2,1fr)}.metric:nth-child(2){border-right:0}.metric:nth-child(-n+2){border-bottom:1px solid var(--line)}
      .split,.split.reverse{grid-template-columns:1fr;gap:30px}.story-img img{height:310px}
      .matrix{grid-template-columns:1fr 1fr}.matrix .matrix-title:first-child{grid-column:span 2}
      .formbox{grid-template-columns:1fr;padding:28px}
      .footer-grid{grid-template-columns:1fr 1fr}
    }
    @media(max-width:520px){
      .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
      .hero h1{font-size:42px}.metric strong{font-size:28px}
      .metric{padding:22px 16px}.matrix{grid-template-columns:1fr}.matrix .matrix-title:first-child{grid-column:auto}
      .result-table{font-size:13px}.result-table th,.result-table td{padding:13px 11px}
      .formbox h2{font-size:29px}.footer-grid{grid-template-columns:1fr}
      .footer-bottom{display:block}.footer-bottom span{display:block;margin:8px 0}
    }

/* roulang page: category4 */
:root{--ink:#17212b;--muted:#697785;--cream:#f7f4ee;--paper:#fffdf9;--teal:#087f78;--teal-dark:#075b5b;--coral:#e87961;--gold:#d4a24c;--line:#e8e2d9;--radius:22px;--shadow:0 18px 50px rgba(29,45,52,.1)}
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;color:var(--ink);background:var(--cream);font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;line-height:1.8}
    a{text-decoration:none;color:inherit}
    img{display:block;max-width:100%}
    button,input,textarea{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(1180px,calc(100% - 40px));margin:auto}
    .header{position:sticky;top:0;z-index:20;background:rgba(255,253,249,.92);backdrop-filter:blur(18px);border-bottom:1px solid rgba(232,226,217,.9)}
    .nav{height:76px;display:flex;align-items:center;gap:30px}
    .logo{font-size:25px;font-weight:900;letter-spacing:.04em;color:var(--teal-dark)}
    .logo span{color:var(--coral)}
    .navlinks{display:flex;align-items:center;gap:6px;margin-left:auto}
    .navlinks a{padding:9px 13px;color:#52616b;border-radius:12px;font-size:14px;transition:.25s}
    .navlinks a:hover,.navlinks a.active{color:var(--teal-dark);background:#e9f3ef}
    .nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:12px 21px;font-weight:750;transition:.25s}
    .nav-cta,.btn-primary{background:var(--teal);color:#fff;box-shadow:0 8px 20px rgba(8,127,120,.2)}
    .nav-cta:hover,.btn-primary:hover{background:var(--teal-dark);transform:translateY(-2px)}
    .menu{display:none;background:none;color:var(--teal-dark);font-size:25px}
    .hero{min-height:610px;display:flex;align-items:center;background:linear-gradient(90deg,rgba(12,35,39,.89),rgba(12,35,39,.48)),url('/assets/images/backpic/back-2.webp') center/cover;position:relative;color:#fff}
    .hero:after{content:"";position:absolute;inset:auto 0 0;height:90px;background:linear-gradient(transparent,var(--cream))}
    .hero-inner{position:relative;z-index:1;width:100%;padding:78px 0}
    .eyebrow,.tag{display:inline-flex;border:1px solid rgba(255,255,255,.35);border-radius:99px;padding:5px 13px;font-size:13px;letter-spacing:.08em;color:#f9dca0}
    .hero h1{font-size:clamp(42px,7vw,76px);line-height:1.12;max-width:760px;margin:22px 0 18px;letter-spacing:-.04em}
    .hero p{font-size:18px;max-width:690px;color:#e3ece9;margin:0 0 30px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
    .btn-light{background:#fff;color:var(--teal-dark)}
    .btn-light:hover{background:#f6d9a0}
    .btn-outline{border:1px solid rgba(255,255,255,.5);color:#fff}
    .btn-outline:hover{background:rgba(255,255,255,.12)}
    .trustbar{display:flex;gap:12px;flex-wrap:wrap;margin-top:48px}
    .trustbar span{padding:8px 14px;border-radius:12px;background:rgba(255,255,255,.12);font-size:13px;color:#e5efeb}
    section{padding:92px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:34px}
    .section-head h2{font-size:clamp(28px,4vw,44px);line-height:1.25;margin:8px 0 0;letter-spacing:-.03em}
    .section-head p{max-width:550px;color:var(--muted);margin:0}
    .kicker{color:var(--coral);font-size:13px;font-weight:800;letter-spacing:.12em}
    .grid{display:grid;gap:20px}
    .grid-4{grid-template-columns:repeat(4,1fr)}
    .grid-3{grid-template-columns:repeat(3,1fr)}
    .grid-2{grid-template-columns:repeat(2,1fr)}
    .card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:25px;box-shadow:0 8px 24px rgba(40,49,48,.035);transition:.3s}
    .card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#c6ddd7}
    .card h3{margin:0 0 9px;font-size:19px}
    .card p{margin:0;color:var(--muted);font-size:14px}
    .metric{padding:25px 22px;border-left:3px solid var(--coral);background:var(--paper);border-radius:16px}
    .metric strong{display:block;font-size:31px;color:var(--teal-dark);line-height:1.2}
    .metric span{display:block;color:var(--muted);font-size:13px;margin-top:7px}
    .crumb{padding:20px 0 0;color:var(--muted);font-size:13px}
    .crumb a{color:var(--teal)}
    .story{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
    .story-img{border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}
    .story-img img{width:100%;height:430px;object-fit:cover}
    .story h2{font-size:clamp(29px,4vw,45px);line-height:1.25;margin:10px 0 18px}
    .story p{color:var(--muted)}
    .checklist{padding:0;margin:24px 0;list-style:none}
    .checklist li{padding:11px 0;border-bottom:1px solid var(--line);font-size:15px}
    .checklist li:before{content:"✓";color:var(--coral);font-weight:900;margin-right:12px}
    .matrix{background:#e8f1ed}
    .matrix .card{min-height:205px}
    .icon{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:#f8dfb6;color:var(--teal-dark);font-weight:900;margin-bottom:20px}
    .scenario{display:grid;grid-template-columns:1.1fr .9fr;gap:20px}
    .scenario .feature{padding:34px;border-radius:var(--radius);background:var(--teal-dark);color:#fff}
    .scenario .feature p{color:#cfe2dc}
    .scenario .small-list{display:grid;gap:20px}
    .small-list .card{padding:22px}
    .process{counter-reset:step}
    .step{position:relative;padding:28px 28px 28px 74px}
    .step:before{counter-increment:step;content:"0" counter(step);position:absolute;left:25px;top:27px;color:var(--coral);font-size:21px;font-weight:900}
    .comparison{overflow:hidden;border-radius:24px;border:1px solid var(--line);background:var(--paper)}
    .comparison-row{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:0;border-bottom:1px solid var(--line)}
    .comparison-row:last-child{border-bottom:0}
    .comparison-row>div{padding:18px 22px;font-size:14px;border-right:1px solid var(--line)}
    .comparison-row>div:last-child{border-right:0}
    .comparison-row.head{background:var(--teal-dark);color:#fff;font-weight:750}
    .comparison-row:not(.head)>div:first-child{font-weight:750}
    .standards{background:#172f34;color:#fff}
    .standards .section-head p{color:#c7d9d5}
    .standards .card{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.15)}
    .standards .card p{color:#c6dad5}
    .faq{max-width:850px;margin:auto}
    .faq details{background:var(--paper);border:1px solid var(--line);border-radius:16px;margin:12px 0;padding:19px 22px}
    .faq summary{font-weight:750;cursor:pointer;list-style:none}
    .faq summary::-webkit-details-marker{display:none}
    .faq summary:after{content:"＋";float:right;color:var(--coral)}
    .faq details[open] summary:after{content:"－"}
    .faq p{color:var(--muted);font-size:14px;margin:14px 25px 0 0}
    .cta{background:linear-gradient(135deg,#f5d9aa,#f6eee2);border-radius:28px;padding:42px;display:flex;justify-content:space-between;align-items:center;gap:30px}
    .cta h2{margin:0 0 8px;font-size:32px;line-height:1.3}
    .cta p{color:#725f51;margin:0;max-width:650px}
    .formbox{background:linear-gradient(135deg,#f5d9aa,#f6eee2);border-radius:28px;padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:35px}
    .formbox p{color:#725f51}
    .form{display:grid;gap:12px}
    .form input,.form textarea{border:1px solid #ddcdb8;background:rgba(255,255,255,.75);border-radius:13px;padding:13px 15px;outline:none}
    .form input:focus,.form textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(8,127,120,.12)}
    .form textarea{min-height:95px;resize:vertical}
    .form-note{font-size:12px;color:#806e61;margin:0}
    .footer{background:#14272d;color:#d6e3df;padding:55px 0 25px}
    .footer-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:35px}
    .footer h3{color:#fff;margin:0 0 14px;font-size:15px}
    .footer p,.footer a{color:#a8bfba;font-size:13px}
    .footer a:hover{color:#f3d08f}
    .footer-bottom{border-top:1px solid rgba(255,255,255,.13);margin-top:35px;padding-top:18px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:12px;color:#94aaa7}
    @media(max-width:1100px){.navlinks{gap:0}.navlinks a{padding:8px 8px;font-size:13px}.grid-4{grid-template-columns:repeat(2,1fr)}}
    @media(max-width:768px){.container{width:min(100% - 32px,900px)}.navlinks,.nav-cta{display:none}.menu{display:block;margin-left:auto}.navlinks.show{position:absolute;display:flex;flex-direction:column;align-items:stretch;top:76px;left:16px;right:16px;padding:12px;background:var(--paper);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.navlinks.show a{padding:11px 14px}.hero{min-height:650px}.hero h1{font-size:47px}.hero p{font-size:16px}.section-head{display:block}.section-head p{margin-top:14px}.story,.scenario,.formbox{grid-template-columns:1fr}.story-img{order:2}.story-img img{height:300px}.grid-3,.grid-2{grid-template-columns:1fr}.comparison{overflow-x:auto}.comparison-row{min-width:650px}.cta{display:block}.cta .btn{margin-top:22px}.footer-grid{grid-template-columns:1fr 1fr}}
    @media(max-width:520px){section{padding:65px 0}.grid-4{grid-template-columns:1fr}.hero h1{font-size:42px}.hero-inner{padding:65px 0}.hero-actions .btn{width:100%}.trustbar{margin-top:35px}.formbox{padding:26px}.footer-grid{grid-template-columns:1fr}.logo{font-size:22px}}
