/* roulang page: index */
:root{
      --ink:#102a43;--muted:#60758a;--blue:#1769e0;--blue-dark:#0d4fae;--sky:#eaf4ff;
      --cyan:#2fc4d8;--gold:#efb44b;--paper:#fff;--bg:#f6f9fd;--line:#dce7f2;
      --shadow:0 18px 48px rgba(22,66,116,.12);--shadow-sm:0 8px 22px rgba(22,66,116,.08);
      --r:18px;--r-lg:28px;--max:1180px;--ease:.25s ease;
    }
    *{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif;font-size:16px;line-height:1.8}
    a{color:inherit;text-decoration:none}img{display:block;max-width:100%;object-fit:cover}button,input{font:inherit}button{cursor:pointer;border:0}.container{width:min(calc(100% - 40px),var(--max));margin:auto}
    .skip{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 14px;border-radius:8px;z-index:99}.skip:focus{left:12px;outline:3px solid var(--cyan)}
    .site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.93);backdrop-filter:blur(14px);border-bottom:1px solid rgba(220,231,242,.86)}
    .nav-wrap{height:76px;display:flex;align-items:center;gap:24px}.brand{font-size:25px;font-weight:900;letter-spacing:2px;color:var(--blue);white-space:nowrap}.brand span{color:var(--cyan)}
    .nav-links{display:flex;align-items:center;gap:4px;flex:1;justify-content:center}.nav-links a{padding:8px 10px;border-radius:9px;color:#49627a;font-size:14px;font-weight:700;white-space:nowrap;transition:var(--ease)}
    .nav-links a:hover,.nav-links a.active{background:var(--sky);color:var(--blue)}.nav-ctas{display:flex;gap:9px;white-space:nowrap}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:11px;font-weight:800;line-height:1.2;transition:transform var(--ease),box-shadow var(--ease),background var(--ease);text-align:center}
    .btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}.btn:active{transform:translateY(0)}.btn:focus-visible,a:focus-visible{outline:3px solid rgba(47,196,216,.55);outline-offset:3px}
    .btn-primary{background:var(--blue);color:#fff}.btn-primary:hover{background:var(--blue-dark)}.btn-light{background:#fff;color:var(--blue);border:1px solid #cfe0f3}.btn-outline{border:1px solid rgba(255,255,255,.6);color:#fff;background:rgba(255,255,255,.1)}
    .menu-btn{display:none;background:var(--sky);color:var(--blue);border-radius:9px;padding:9px 12px;font-weight:800}
    .hero{min-height:590px;position:relative;isolation:isolate;background-image:linear-gradient(90deg,rgba(8,37,77,.9),rgba(9,55,110,.7) 52%,rgba(9,70,128,.34)),url('/assets/images/backpic/back-1.webp');background-size:cover;background-position:center;color:#fff;display:flex;align-items:end;padding:78px 0 66px;overflow:hidden}
    .hero:after{content:"";position:absolute;inset:auto -100px -160px auto;width:470px;height:470px;border-radius:50%;background:rgba(47,196,216,.16);filter:blur(3px);z-index:-1}.hero-content{max-width:790px}.eyebrow{display:inline-flex;align-items:center;gap:8px;border-radius:99px;padding:7px 12px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.22);font-size:13px;font-weight:800;letter-spacing:.5px}.eyebrow i{width:7px;height:7px;border-radius:50%;background:#6ff0fb;display:inline-block}
    h1,h2,h3,p{margin-top:0}h1{font-size:clamp(39px,6vw,70px);line-height:1.12;letter-spacing:-2px;margin:18px 0 20px}.hero p{font-size:18px;max-width:730px;color:#e2effd;margin-bottom:26px}.hero-actions{display:flex;flex-wrap:wrap;gap:12px}.hero .btn-light{border:0}.countdown{margin-top:35px;display:flex;gap:0;max-width:790px;background:rgba(7,28,61,.58);border:1px solid rgba(255,255,255,.18);border-radius:15px;overflow:hidden}.count-intro{padding:15px 20px;flex:1;color:#dbeaff;font-size:14px}.count-intro strong{display:block;color:#fff;font-size:16px}.count-unit{min-width:90px;padding:11px 10px;text-align:center;border-left:1px solid rgba(255,255,255,.15)}.count-unit b{display:block;font-size:23px;line-height:1.1;color:#7ae9f1}.count-unit span{font-size:12px;color:#c4dcf6}
    section{padding:86px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:34px}.section-kicker{color:var(--blue);font-weight:900;font-size:13px;letter-spacing:1.2px}.section-head h2{font-size:clamp(27px,4vw,42px);line-height:1.22;margin:7px 0 0;letter-spacing:-1px}.section-head p{max-width:510px;color:var(--muted);margin:0}
    .track{display:flex;gap:18px;overflow:auto;padding:4px 2px 17px;scroll-snap-type:x mandatory}.track::-webkit-scrollbar{height:7px}.track::-webkit-scrollbar-thumb{background:#b8cde3;border-radius:10px}.topic-card{scroll-snap-align:start;min-width:270px;flex:1;border-radius:var(--r);overflow:hidden;background:#fff;box-shadow:var(--shadow-sm);border:1px solid var(--line);transition:var(--ease)}.topic-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}.topic-card img{width:100%;height:152px}.topic-card-body{padding:18px}.topic-card h3{font-size:19px;margin-bottom:8px}.topic-card p{color:var(--muted);font-size:14px;line-height:1.7;margin-bottom:13px}.arrow-link{font-size:14px;font-weight:900;color:var(--blue)}
    .feature-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:28px}.feature-image{min-height:450px;border-radius:var(--r-lg);overflow:hidden;position:relative}.feature-image img{height:100%;width:100%}.feature-image:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(7,39,84,.75))}.image-caption{position:absolute;z-index:1;bottom:25px;left:27px;right:27px;color:#fff}.image-caption b{font-size:27px;display:block}.image-caption span{color:#d4e8ff}
    .feature-copy{padding:10px 0}.feature-copy h2{font-size:38px;line-height:1.25;margin-bottom:18px}.feature-copy>p{color:var(--muted);margin-bottom:22px}.check-list{padding:0;margin:0;list-style:none}.check-list li{position:relative;padding:13px 0 13px 34px;border-bottom:1px solid var(--line);color:#38546d}.check-list li:before{content:"✓";position:absolute;left:0;top:13px;width:21px;height:21px;line-height:21px;text-align:center;border-radius:50%;font-weight:900;background:#dff8f8;color:#078999}
    .hot-area{background:#eaf4ff}.hot-layout{display:grid;grid-template-columns:1.35fr .65fr;gap:23px}.hot-main{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:38px;box-shadow:var(--shadow-sm)}.hot-main h2{font-size:34px;line-height:1.25}.hot-main p{color:var(--muted)}.rule-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:24px}.rule-item{border-radius:13px;background:var(--bg);padding:18px}.rule-item b{display:block;font-size:25px;color:var(--blue)}.rule-item span{font-size:13px;color:var(--muted)}
    .safety-card{border-radius:var(--r-lg);padding:34px;background:#123e79;color:#fff;position:relative;overflow:hidden}.safety-card:before{content:"♠";font-family:serif;position:absolute;right:-5px;bottom:-100px;font-size:270px;opacity:.1}.safety-card h3{font-size:27px;line-height:1.3;position:relative}.safety-card p{color:#cde0fa;position:relative}.safety-card .btn{margin-top:12px;position:relative}
    .collection-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}.collection{position:relative;min-height:244px;border-radius:var(--r);overflow:hidden;color:#fff;background:#123e79;box-shadow:var(--shadow-sm);transition:var(--ease)}.collection:hover{transform:translateY(-5px)}.collection img{position:absolute;width:100%;height:100%;opacity:.66}.collection:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(4,26,56,.87),transparent 70%)}.collection-info{position:absolute;z-index:1;left:19px;right:19px;bottom:18px}.collection-info small{display:block;color:#9ce8ef;margin-bottom:4px}.collection-info h3{font-size:21px;margin-bottom:9px}.collection-info a{font-size:13px;font-weight:900}
    .story{background:#fff}.story-layout{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:58px}.story-art{position:relative;padding:0 25px 26px 0}.story-art img{border-radius:var(--r-lg);height:390px;width:100%}.story-note{position:absolute;right:0;bottom:0;background:#fff;border-radius:14px;padding:18px 20px;box-shadow:var(--shadow);width:220px}.story-note b{display:block;font-size:31px;color:var(--blue)}.story-copy h2{font-size:38px;line-height:1.25}.story-copy p{color:var(--muted)}.quote{border-left:4px solid var(--cyan);padding:5px 0 5px 18px;color:#2a5277;font-weight:700;margin:24px 0}
    .seed-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}.seed-card{background:#fff;border:1px solid var(--line);padding:14px;border-radius:16px;box-shadow:var(--shadow-sm);transition:var(--ease)}.seed-card:hover{transform:translateY(-5px);border-color:#9ec3ed}.seed-card img{height:205px;width:100%;border-radius:11px;margin-bottom:13px}.seed-card h3{font-size:16px;line-height:1.4;margin-bottom:6px}.seed-card p{font-size:13px;color:var(--muted);line-height:1.6;margin-bottom:11px}
    .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:step}.step{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 22px;position:relative;box-shadow:var(--shadow-sm)}.step:before{counter-increment:step;content:"0" counter(step);font-weight:900;color:#c7ddf5;font-size:38px;line-height:1}.step h3{margin:14px 0 8px;font-size:19px}.step p{color:var(--muted);font-size:14px;margin:0}
    .event{background:#102f5e;color:#fff;position:relative;overflow:hidden}.event:before{content:"";position:absolute;inset:0;background:url('/assets/images/backpic/back-2.webp') center/cover;opacity:.13}.event .container{position:relative}.event .section-kicker{color:#75e4eb}.event .section-head p{color:#c5dbf4}.event-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.event-card{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);border-radius:var(--r);padding:25px}.event-card strong{font-size:32px;color:#78e6ed}.event-card h3{font-size:20px;margin:11px 0 7px}.event-card p{color:#d1e1f5;font-size:14px;margin:0}.event-action{text-align:center;margin-top:29px}
    .news-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:32px}.news-list{border-top:1px solid var(--line)}.news-item{padding:21px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:105px 1fr auto;gap:17px;align-items:center}.news-date{font-size:13px;color:var(--blue);font-weight:900}.news-date b{display:block;font-size:24px;line-height:1.1}.news-item h3{font-size:18px;margin:0 0 4px}.news-item p{font-size:14px;color:var(--muted);line-height:1.7;margin:0}.read{font-size:13px;color:var(--blue);font-weight:900;white-space:nowrap}.news-aside{background:#fff;padding:27px;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-sm)}.news-aside h3{font-size:25px}.news-aside p{color:var(--muted)}.subscribe{display:flex;margin-top:19px}.subscribe input{min-width:0;flex:1;padding:12px;border:1px solid var(--line);border-radius:10px 0 0 10px;outline:none}.subscribe input:focus{border-color:var(--blue)}.subscribe button{background:var(--blue);color:#fff;padding:0 14px;border-radius:0 10px 10px 0;font-weight:800}
    .live{background:#fff}.live-box{display:grid;grid-template-columns:.9fr 1.1fr;gap:0;overflow:hidden;border-radius:var(--r-lg);box-shadow:var(--shadow);background:#123e79;color:#fff}.live-cover{min-height:330px;position:relative}.live-cover img{height:100%;width:100%}.live-cover:after{content:"互动提醒";position:absolute;left:22px;top:20px;background:#f4b64c;color:#332406;padding:5px 10px;border-radius:99px;font-size:13px;font-weight:900}.live-content{padding:42px}.live-content h2{font-size:34px;line-height:1.25}.live-content p{color:#d0e0f2}.live-points{list-style:none;padding:0;margin:20px 0}.live-points li{padding:7px 0;color:#e3eef9}.live-points li:before{content:"•";color:#71e5ea;font-size:22px;vertical-align:middle;margin-right:9px}
    .testimonials{background:#eaf4ff}.bubble-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.bubble{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:var(--shadow-sm)}.bubble p{color:#38546d;margin-bottom:17px}.person{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:800}.avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#d7ebff;color:var(--blue)}
    .faq-wrap{display:grid;grid-template-columns:.75fr 1.25fr;gap:45px}.faq-copy h2{font-size:38px;line-height:1.25}.faq-copy p{color:var(--muted)}.faq details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:0 20px;margin-bottom:12px;transition:var(--ease)}.faq details[open]{border-color:#9bc1ec;box-shadow:var(--shadow-sm)}.faq summary{padding:17px 27px 17px 0;cursor:pointer;list-style:none;font-size:17px;font-weight:800;position:relative}.faq summary:after{content:"＋";position:absolute;right:0;color:var(--blue);font-size:22px}.faq details[open] summary:after{content:"－"}.faq details p{color:var(--muted);padding:0 0 18px;margin:0;font-size:14px}
    .cta-band{padding:0 0 86px}.cta{background:linear-gradient(115deg,#1769e0,#1b8dc8);border-radius:var(--r-lg);padding:48px 55px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:30px;box-shadow:var(--shadow)}.cta h2{font-size:34px;line-height:1.25;margin:0 0 8px}.cta p{color:#dceeff;margin:0}.footer{background:#0c284d;color:#c8d8ec;padding:56px 0 22px}.footer-grid{display:grid;grid-template-columns:1.2fr 2fr;gap:50px;padding-bottom:35px}.footer .brand{color:#fff}.footer .brand span{color:#78e6ed}.footer p{color:#9db6d1;font-size:14px}.footer-links{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.footer-links h3{font-size:15px;color:#fff;margin-bottom:12px}.footer-links a{display:block;font-size:14px;color:#b5cae0;padding:3px 0}.footer-links a:hover{color:#79e6ec}.footer-bottom{border-top:1px solid rgba(255,255,255,.13);padding-top:18px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:13px;color:#94abc4}.footer-bottom a{color:#b9d5f0}.footer-bottom a:hover{color:#75e4eb}
    @media(max-width:1050px){.nav-links{gap:0}.nav-links a{font-size:13px;padding:7px}.feature-grid,.story-layout{gap:30px}.seed-grid{grid-template-columns:repeat(3,1fr)}.collection-grid{grid-template-columns:repeat(2,1fr)}}
    @media(max-width:820px){.nav-wrap{height:68px}.menu-btn{display:block;margin-left:auto}.nav-ctas{display:none}.nav-links{display:none;position:absolute;top:68px;left:0;right:0;background:#fff;padding:13px 20px 18px;border-bottom:1px solid var(--line);box-shadow:var(--shadow);flex-wrap:wrap;justify-content:flex-start}.nav-links.open{display:flex}.hero{min-height:570px;padding-top:60px}.feature-grid,.hot-layout,.story-layout,.news-layout,.live-box,.faq-wrap{grid-template-columns:1fr}.feature-image{min-height:330px}.story-art{max-width:600px}.event-grid,.bubble-grid{grid-template-columns:1fr}.steps{grid-template-columns:repeat(2,1fr)}.seed-grid{grid-template-columns:repeat(2,1fr)}.faq-copy{max-width:590px}.footer-grid{grid-template-columns:1fr}}
    @media(max-width:520px){.container{width:min(calc(100% - 28px),var(--max))}section{padding:62px 0}.hero{min-height:610px;padding-bottom:34px}.hero p{font-size:16px}.countdown{margin-top:25px}.count-intro{display:none}.count-unit{min-width:25%;padding:10px 4px}.count-unit b{font-size:20px}.section-head{display:block;margin-bottom:25px}.section-head p{margin-top:13px}.rule-row,.steps{grid-template-columns:1fr}.hot-main{padding:27px}.collection-grid,.seed-grid{grid-template-columns:1fr}.seed-card{display:grid;grid-template-columns:110px 1fr;gap:13px}.seed-card img{height:118px;grid-row:span 3;margin:0}.news-item{grid-template-columns:76px 1fr}.news-item .read{grid-column:2}.news-date b{font-size:19px}.live-content{padding:28px}.cta{padding:35px 25px;display:block}.cta .btn{margin-top:20px;width:100%}.footer-links{grid-template-columns:1fr 1fr}.footer-bottom{display:block}.footer-bottom>*{display:block;margin:7px 0}}

/* roulang page: category3 */
:root{
--ink:#102a43;--muted:#60758a;--blue:#1769e0;--blue-dark:#0d4fae;--sky:#eaf4ff;
--cyan:#2fc4d8;--gold:#efb44b;--paper:#fff;--bg:#f6f9fd;--line:#dce7f2;
--shadow:0 18px 48px rgba(22,66,116,.12);--shadow-sm:0 8px 22px rgba(22,66,116,.08);
--r:18px;--r-lg:28px;--max:1180px;--ease:.25s ease
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif;font-size:16px;line-height:1.8}
a{color:inherit;text-decoration:none} img{display:block;max-width:100%;object-fit:cover}
button,input{font:inherit} button{cursor:pointer;border:0}
.container{width:min(calc(100% - 40px),var(--max));margin:auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.93);backdrop-filter:blur(14px);border-bottom:1px solid rgba(220,231,242,.86)}
.nav-wrap{height:76px;display:flex;align-items:center;gap:24px}
.brand{font-size:25px;font-weight:900;letter-spacing:2px;color:var(--blue);white-space:nowrap}
.brand span{color:var(--cyan)}
.nav-links{display:flex;align-items:center;gap:4px;flex:1;justify-content:center}
.nav-links a{padding:8px 10px;border-radius:9px;color:#49627a;font-size:14px;font-weight:700;white-space:nowrap;transition:var(--ease)}
.nav-links a:hover,.nav-links a.active{background:var(--sky);color:var(--blue)}
.nav-ctas{display:flex;gap:9px;white-space:nowrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:11px;font-weight:800;line-height:1.2;transition:transform var(--ease),box-shadow var(--ease),background var(--ease);text-align:center}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.btn:active{transform:translateY(0)}
.btn:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid rgba(47,196,216,.55);outline-offset:3px}
.btn-primary{background:var(--blue);color:#fff}.btn-primary:hover{background:var(--blue-dark)}
.btn-light{background:#fff;color:var(--blue);border:1px solid #cfe0f3}
.btn-outline{border:1px solid rgba(255,255,255,.58);background:rgba(255,255,255,.1);color:#fff}
.menu-btn{display:none;background:var(--sky);color:var(--blue);border-radius:9px;padding:9px 12px;font-weight:800}
.hero-inner{position:relative;min-height:492px;display:flex;align-items:center;overflow:hidden;background:#0d376f;color:#fff}
.hero-inner:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,28,62,.93) 0%,rgba(8,47,97,.84) 48%,rgba(8,50,98,.32) 100%),url('/assets/images/backpic/back-3.webp') center/cover}
.hero-inner:after{content:"♣";position:absolute;right:7%;bottom:-125px;font:420px Georgia,serif;color:rgba(107,221,232,.11)}
.hero-content{position:relative;z-index:1;max-width:735px;padding:72px 0}
.eyebrow{display:inline-flex;align-items:center;gap:8px;border-radius:99px;padding:7px 12px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);font-size:13px;font-weight:800;letter-spacing:.5px}
.eyebrow i{width:7px;height:7px;border-radius:50%;background:#6ff0fb;display:inline-block}
h1{font-size:clamp(37px,5vw,61px);line-height:1.13;letter-spacing:-2px;margin:18px 0}
.hero-content p{font-size:18px;max-width:680px;color:#e1effd;margin:0 0 27px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px}
section{padding:82px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:34px}
.section-kicker{color:var(--blue);font-weight:900;font-size:13px;letter-spacing:1.2px}
.section-head h2{font-size:clamp(27px,4vw,42px);line-height:1.22;margin:7px 0 0;letter-spacing:-1px}
.section-head p{max-width:510px;color:var(--muted);margin:0}
.intro-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:56px;align-items:center}
.intro-image{height:420px;border-radius:var(--r-lg);overflow:hidden;position:relative;box-shadow:var(--shadow)}
.intro-image img{width:100%;height:100%}
.intro-image:after{content:"轻松相见 · 自在同桌";position:absolute;left:22px;bottom:20px;padding:8px 13px;color:#fff;background:rgba(8,45,91,.76);border:1px solid rgba(255,255,255,.24);border-radius:99px;font-size:13px;font-weight:800}
.intro-copy h2{font-size:37px;line-height:1.28;margin:0 0 18px}
.intro-copy p{color:var(--muted);margin:0 0 16px}
.point-list{list-style:none;padding:0;margin:23px 0 0}
.point-list li{position:relative;padding:12px 0 12px 34px;color:#38546d;border-bottom:1px solid var(--line)}
.point-list li:before{content:"✓";position:absolute;left:0;top:13px;width:21px;height:21px;line-height:21px;text-align:center;border-radius:50%;font-weight:900;background:#dff8f8;color:#078999}
.plan-area{background:var(--sky)}
.plan-shell{display:grid;grid-template-columns:.82fr 1.18fr;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-sm)}
.plan-aside{padding:40px;background:#103f7e;color:#fff;position:relative;overflow:hidden}
.plan-aside:after{content:"♦";position:absolute;right:-30px;bottom:-125px;font:270px Georgia,serif;color:rgba(255,255,255,.1)}
.plan-aside h2{position:relative;font-size:33px;line-height:1.28;margin:12px 0}
.plan-aside p{position:relative;color:#cae1fa}
.plan-aside .eyebrow{position:relative}
.plan-list{padding:18px 34px}
.plan-item{display:grid;grid-template-columns:54px 1fr;gap:17px;padding:21px 0;border-bottom:1px solid var(--line)}
.plan-item:last-child{border:0}
.step-num{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:var(--sky);color:var(--blue);font-size:17px;font-weight:900}
.plan-item h3{font-size:18px;margin:0 0 4px}.plan-item p{margin:0;color:var(--muted);font-size:14px}
.scene-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:18px}
.scene-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:27px;box-shadow:var(--shadow-sm);transition:var(--ease)}
.scene-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.scene-card.featured{min-height:296px;color:#fff;background:linear-gradient(140deg,#0e4eaa,#146bca);position:relative;overflow:hidden}
.scene-card.featured:after{content:"♥";position:absolute;right:-24px;bottom:-115px;font:280px Georgia,serif;color:rgba(255,255,255,.13)}
.scene-icon{width:47px;height:47px;display:grid;place-items:center;background:var(--sky);color:var(--blue);border-radius:14px;font-size:22px;font-weight:900;margin-bottom:18px}
.featured .scene-icon{background:rgba(255,255,255,.18);color:#fff}
.scene-card h3{font-size:21px;line-height:1.35;margin:0 0 9px;position:relative;z-index:1}.scene-card p{color:var(--muted);font-size:14px;margin:0;position:relative;z-index:1}.featured p{color:#dbeafe}
.check-section{display:grid;grid-template-columns:.92fr 1.08fr;gap:30px;align-items:stretch}
.check-copy{padding:35px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.check-copy h2{font-size:34px;line-height:1.27;margin:0 0 14px}.check-copy p{color:var(--muted)}
.check-box{border-radius:var(--r-lg);padding:32px;background:#123e79;color:#fff;box-shadow:var(--shadow);position:relative;overflow:hidden}
.check-box:after{content:"♠";position:absolute;right:-12px;bottom:-102px;color:rgba(255,255,255,.09);font:280px Georgia,serif}
.check-box h3{position:relative;font-size:25px;margin:0 0 15px}.check-box ul{position:relative;list-style:none;padding:0;margin:0}
.check-box li{padding:10px 0 10px 28px;border-bottom:1px solid rgba(255,255,255,.14);color:#d6e8fc}
.check-box li:before{content:"";position:absolute;margin-left:-27px;margin-top:10px;width:8px;height:8px;border-radius:50%;background:var(--cyan)}
.notice{background:#fff8e8;border:1px solid #f3dba6;border-radius:var(--r);padding:23px 26px;color:#74571d}
.notice strong{color:#73500c}
.rhythm-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
.rhythm{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px 20px;box-shadow:var(--shadow-sm)}
.rhythm time{display:block;color:var(--blue);font-size:14px;font-weight:900;margin-bottom:12px}.rhythm h3{font-size:18px;margin:0 0 8px}.rhythm p{font-size:14px;color:var(--muted);margin:0}
.quote-section{padding-top:20px}
.quote-card{border-radius:var(--r-lg);padding:48px 8%;background:#eaf4ff;border:1px solid #d5e7fa;text-align:center;position:relative}
.quote-card:before{content:"“";display:block;font:80px/50px Georgia,serif;color:var(--cyan)}
.quote-card blockquote{font-size:clamp(21px,3vw,30px);font-weight:800;line-height:1.6;margin:5px auto 17px;max-width:850px}
.quote-card cite{font-style:normal;color:var(--muted);font-size:14px}
.news-area{background:#fff}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.news-card{padding:24px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r);transition:var(--ease)}
.news-card:hover{background:#fff;transform:translateY(-4px);box-shadow:var(--shadow-sm)}
.news-card time{font-size:13px;color:var(--blue);font-weight:900}.news-card h3{font-size:19px;line-height:1.45;margin:10px 0}.news-card p{font-size:14px;line-height:1.75;color:var(--muted);margin:0 0 15px}.arrow-link{color:var(--blue);font-size:14px;font-weight:900}
.faq-wrap{display:grid;grid-template-columns:.75fr 1.25fr;gap:55px;align-items:start}
.faq-intro h2{font-size:37px;line-height:1.25;margin:8px 0 15px}.faq-intro p{color:var(--muted)}
.faq-list{border-top:1px solid var(--line)}
.faq{border-bottom:1px solid var(--line)}
.faq button{width:100%;padding:21px 35px 21px 0;text-align:left;background:transparent;color:var(--ink);font-weight:900;font-size:17px;position:relative}
.faq button:after{content:"+";position:absolute;right:4px;color:var(--blue);font-size:25px;font-weight:400;transition:var(--ease)}
.faq button[aria-expanded="true"]:after{transform:rotate(45deg)}
.answer{display:none;padding:0 25px 21px 0;color:var(--muted);font-size:15px}.answer.open{display:block}
.cta{padding:0 0 86px}.cta-box{background:linear-gradient(115deg,#0b438f,#1769e0);border-radius:var(--r-lg);padding:52px 7%;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:25px;overflow:hidden;position:relative}.cta-box:after{content:"♣";position:absolute;right:4%;bottom:-135px;font:320px Georgia,serif;color:rgba(255,255,255,.1)}.cta-box h2{font-size:clamp(27px,4vw,40px);line-height:1.25;margin:0 0 10px;position:relative}.cta-box p{color:#dceeff;margin:0;position:relative;max-width:650px}.cta-box .btn{position:relative;flex:none}
.footer{background:#0b274d;color:#c7d9ed;padding:66px 0 24px}.footer-grid{display:grid;grid-template-columns:.95fr 1.45fr;gap:70px;padding-bottom:45px}.footer .brand{display:inline-block;color:#fff;margin-bottom:14px}.footer .brand span{color:#6ee5ed}.footer p{max-width:410px;font-size:14px;line-height:1.85;margin:0}.footer-links{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.footer h3{font-size:15px;color:#fff;margin:0 0 13px}.footer-links a{display:block;font-size:14px;color:#c7d9ed;margin:7px 0;transition:var(--ease)}.footer-links a:hover{color:#74e5ef}.footer-bottom{display:flex;flex-wrap:wrap;gap:10px 21px;padding-top:22px;border-top:1px solid rgba(255,255,255,.15);font-size:12px;color:#a8c0dc}.footer-bottom a:hover{color:#fff}
@media(max-width:1100px){.nav-wrap{gap:10px}.nav-links a{padding:7px 7px;font-size:13px}.nav-ctas .btn{padding:10px 12px}.scene-grid{grid-template-columns:1fr 1fr}.scene-card.featured{grid-column:span 2}.rhythm-grid{grid-template-columns:1fr 1fr}}
@media(max-width:850px){.nav-wrap{height:68px;justify-content:space-between}.nav-links{display:none;position:absolute;top:68px;left:0;right:0;padding:14px 20px 19px;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow-sm);flex-direction:column;align-items:stretch}.nav-links.open{display:flex}.nav-links a{padding:10px 12px}.nav-ctas{margin-left:auto}.nav-ctas .btn-light{display:none}.menu-btn{display:block}.hero-content{padding:58px 0}.intro-grid,.check-section,.faq-wrap{grid-template-columns:1fr;gap:30px}.intro-image{height:330px}.plan-shell{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr;gap:35px}.section-head{align-items:start;flex-direction:column;gap:10px}.section-head p{max-width:680px}.news-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.container{width:min(calc(100% - 28px),var(--max))}.brand{font-size:22px}.nav-ctas{display:none}.hero-inner{min-height:460px}.hero-content p{font-size:16px}.hero-actions .btn{width:100%}section{padding:58px 0}.intro-copy h2,.faq-intro h2{font-size:30px}.plan-aside,.plan-list,.check-copy,.check-box{padding:26px 21px}.scene-grid,.news-grid,.rhythm-grid{grid-template-columns:1fr}.scene-card.featured{grid-column:auto}.cta{padding-bottom:58px}.cta-box{padding:34px 24px;align-items:start;flex-direction:column}.cta-box .btn{width:100%}.footer{padding-top:48px}.footer-links{grid-template-columns:1fr 1fr;gap:22px}.footer-links>div:last-child{grid-column:span 2}.footer-bottom{display:block}.footer-bottom span{display:block;margin:7px 0}}

/* roulang page: category1 */
:root{
 --ink:#102a43;--muted:#60758a;--blue:#1769e0;--blue-dark:#0d4fae;--sky:#eaf4ff;
 --cyan:#2fc4d8;--gold:#efb44b;--paper:#fff;--bg:#f6f9fd;--line:#dce7f2;
 --shadow:0 18px 48px rgba(22,66,116,.12);--shadow-sm:0 8px 22px rgba(22,66,116,.08);
 --r:18px;--r-lg:28px;--max:1180px;--ease:.25s ease;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif;font-size:16px;line-height:1.8}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;object-fit:cover}
button,input{font:inherit}
button{cursor:pointer;border:0}
h1,h2,h3,h4,p{margin-top:0}
.container{width:min(calc(100% - 40px),var(--max));margin:auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.93);backdrop-filter:blur(14px);border-bottom:1px solid rgba(220,231,242,.86)}
.nav-wrap{height:76px;display:flex;align-items:center;gap:24px}
.brand{font-size:25px;font-weight:900;letter-spacing:2px;color:var(--blue);white-space:nowrap}
.brand span{color:var(--cyan)}
.nav-links{display:flex;align-items:center;gap:4px;flex:1;justify-content:center}
.nav-links a{padding:8px 10px;border-radius:9px;color:#49627a;font-size:14px;font-weight:700;white-space:nowrap;transition:var(--ease)}
.nav-links a:hover,.nav-links a.active{background:var(--sky);color:var(--blue)}
.nav-ctas{display:flex;gap:9px;white-space:nowrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:11px;font-weight:800;line-height:1.2;transition:transform var(--ease),box-shadow var(--ease),background var(--ease);text-align:center}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.btn:active{transform:translateY(0)}
.btn:focus-visible,a:focus-visible,.faq-item summary:focus-visible{outline:3px solid rgba(47,196,216,.55);outline-offset:3px}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--blue-dark)}
.btn-light{background:#fff;color:var(--blue);border:1px solid #cfe0f3}
.btn-outline{border:1px solid rgba(255,255,255,.55);color:#fff;background:rgba(255,255,255,.1)}
.menu-btn{display:none;background:var(--sky);color:var(--blue);border-radius:9px;padding:9px 12px;font-weight:800}
.page-hero{position:relative;overflow:hidden;min-height:470px;display:flex;align-items:center;color:#fff;background:linear-gradient(90deg,rgba(8,37,77,.91),rgba(9,55,110,.72)),url('/assets/images/backpic/back-2.webp') center/cover}
.page-hero:after{content:"";position:absolute;width:360px;height:360px;right:7%;top:-145px;border:55px solid rgba(47,196,216,.18);border-radius:50%}
.hero-inner{position:relative;z-index:1;padding:74px 0}
.crumb{display:flex;gap:10px;align-items:center;color:#cce5ff;font-size:14px;font-weight:700;margin-bottom:22px}
.crumb b{color:#72eaf3}
.eyebrow{display:inline-flex;align-items:center;gap:8px;border-radius:99px;padding:7px 12px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.22);font-size:13px;font-weight:800;letter-spacing:.5px}
.eyebrow i{width:7px;height:7px;border-radius:50%;background:#6ff0fb;display:inline-block}
h1{font-size:clamp(37px,5vw,61px);line-height:1.15;letter-spacing:-2px;max-width:760px;margin:17px 0}
.hero-inner>p{max-width:730px;font-size:18px;color:#e2effd;margin-bottom:27px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
section{padding:82px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:34px}
.section-kicker{color:var(--blue);font-weight:900;font-size:13px;letter-spacing:1.2px}
.section-head h2{font-size:clamp(28px,3.7vw,42px);line-height:1.25;letter-spacing:-1px;margin:7px 0 0}
.section-head p{max-width:520px;color:var(--muted);margin:0}
.intro-grid{display:grid;grid-template-columns:1fr .93fr;gap:52px;align-items:center}
.intro-copy h2{font-size:37px;line-height:1.28;margin-bottom:20px}
.intro-copy p{color:var(--muted);margin-bottom:18px}
.intro-visual{position:relative}
.intro-visual img{height:405px;width:100%;border-radius:var(--r-lg);box-shadow:var(--shadow)}
.floating-note{position:absolute;left:-22px;bottom:27px;padding:18px 20px;width:235px;background:#fff;border:1px solid var(--line);border-radius:15px;box-shadow:var(--shadow-sm)}
.floating-note strong{display:block;color:var(--blue);font-size:22px}
.floating-note span{font-size:13px;color:var(--muted)}
.notice{display:flex;gap:15px;background:#fff8e8;border:1px solid #f6deb0;padding:18px 20px;border-radius:14px;color:#76551a;margin-top:25px}
.notice b{font-size:20px;color:#c98b19}
.rank-panel{border-radius:var(--r-lg);overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.rank-top{padding:28px 32px;background:var(--sky);display:flex;justify-content:space-between;align-items:center;gap:15px}
.rank-top h3{margin:0;font-size:24px}
.rank-top span{font-size:13px;font-weight:800;color:var(--blue)}
.rank-list{padding:10px 28px 20px}
.rank-item{display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:17px;padding:18px 0;border-bottom:1px solid var(--line)}
.rank-item:last-child{border-bottom:0}
.rank-num{width:37px;height:37px;display:grid;place-items:center;border-radius:50%;background:#edf5ff;color:var(--blue);font-weight:900}
.rank-item:first-child .rank-num{background:#fff1cf;color:#b47400}
.rank-item h3{font-size:18px;margin:0 0 2px}
.rank-item p{font-size:14px;color:var(--muted);margin:0;line-height:1.55}
.rank-mark{font-weight:900;color:#4a637a;font-size:14px}
.flow-section{background:#eaf4ff}
.flow-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.flow-card{position:relative;padding:28px 22px;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-sm)}
.flow-card:after{content:"";position:absolute;right:-11px;top:48%;width:21px;height:2px;background:var(--cyan)}
.flow-card:last-child:after{display:none}
.flow-no{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:10px;color:#fff;background:var(--blue);font-size:14px;font-weight:900;margin-bottom:18px}
.flow-card h3{font-size:19px;margin-bottom:9px}
.flow-card p{font-size:14px;color:var(--muted);margin:0}
.compare-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:28px;align-items:stretch}
.compare-copy{padding:38px;border-radius:var(--r-lg);background:#123e79;color:#fff;position:relative;overflow:hidden}
.compare-copy:after{content:"♣";position:absolute;font-family:serif;right:10px;bottom:-145px;font-size:300px;color:#fff;opacity:.08}
.compare-copy>*{position:relative}
.compare-copy h2{font-size:34px;line-height:1.25;margin-bottom:17px}
.compare-copy p{color:#cde0fa}
.clean-list{list-style:none;padding:0;margin:24px 0 0}
.clean-list li{padding:11px 0 11px 30px;position:relative;border-bottom:1px solid rgba(255,255,255,.16);color:#e4f0ff}
.clean-list li:before{content:"✓";position:absolute;left:0;color:#71edf4;font-weight:900}
.example-card{padding:33px;background:#fff;border-radius:var(--r-lg);border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.example-card h3{font-size:25px;margin-bottom:18px}
.example-row{display:grid;grid-template-columns:1fr 54px 1fr;gap:14px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
.example-row:last-child{border-bottom:0}
.hand{border:1px solid var(--line);border-radius:13px;padding:14px;background:var(--bg)}
.hand strong{display:block;font-size:17px;margin-bottom:3px}
.hand span{font-size:13px;color:var(--muted)}
.vs{font-size:13px;font-weight:900;color:var(--blue);text-align:center}
.rules-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:19px}
.rule-card{padding:26px;background:#fff;border:1px solid var(--line);border-radius:var(--r);transition:var(--ease)}
.rule-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.rule-icon{width:49px;height:49px;display:grid;place-items:center;border-radius:14px;background:var(--sky);color:var(--blue);font-weight:900;font-size:22px;margin-bottom:17px}
.rule-card h3{font-size:20px;margin-bottom:9px}
.rule-card p{font-size:14px;color:var(--muted);margin:0}
.scene-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:center}
.scene-image{border-radius:var(--r-lg);overflow:hidden;min-height:382px}
.scene-image img{width:100%;height:382px}
.scene-copy h2{font-size:36px;line-height:1.28;margin-bottom:17px}
.scene-copy>p{color:var(--muted)}
.scene-list{display:grid;gap:12px;margin-top:22px}
.scene-list div{padding:15px 17px;border-radius:13px;border:1px solid var(--line);background:#fff}
.scene-list strong{display:block;font-size:16px}
.scene-list span{font-size:14px;color:var(--muted)}
.news-section{background:#fff}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.news-card{padding:23px;border:1px solid var(--line);border-radius:var(--r);background:#fff;box-shadow:var(--shadow-sm)}
.news-card time{font-size:13px;font-weight:800;color:var(--blue)}
.news-card h3{font-size:19px;line-height:1.45;margin:10px 0}
.news-card p{font-size:14px;color:var(--muted);margin:0 0 17px}
.arrow-link{font-size:14px;font-weight:900;color:var(--blue)}
.faq-wrap{max-width:890px;margin:auto}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:14px;margin-bottom:12px;box-shadow:0 4px 14px rgba(22,66,116,.04)}
.faq-item summary{list-style:none;padding:19px 22px;font-weight:900;cursor:pointer;position:relative;padding-right:52px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:"＋";position:absolute;right:21px;color:var(--blue);font-size:21px;top:15px}
.faq-item[open] summary:after{content:"－"}
.faq-item p{padding:0 22px 20px;color:var(--muted);margin:0}
.cta{padding:70px 0;background:linear-gradient(125deg,#0d4fae,#1769e0 58%,#168bba);color:#fff}
.cta-box{display:flex;justify-content:space-between;gap:35px;align-items:center}
.cta h2{font-size:clamp(29px,4vw,43px);line-height:1.25;margin:0 0 12px}
.cta p{margin:0;color:#dceeff;max-width:660px}
.cta-actions{display:flex;gap:11px;flex-wrap:wrap}
.footer{background:#0c294a;color:#d4e2f2;padding:63px 0 20px}
.footer-grid{display:grid;grid-template-columns:.9fr 1.4fr;gap:65px;padding-bottom:42px}
.footer .brand{display:inline-block;color:#fff;margin-bottom:14px}
.footer .brand span{color:#68e7ef}
.footer p{font-size:14px;color:#a9c0d9;max-width:390px;margin:0}
.footer-links{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.footer-links h3{margin:0 0 13px;font-size:15px;color:#fff}
.footer-links a{display:block;font-size:14px;color:#aec6de;margin:8px 0;transition:var(--ease)}
.footer-links a:hover{color:#75edf4}
.footer-bottom{padding-top:20px;border-top:1px solid rgba(189,217,243,.17);display:flex;flex-wrap:wrap;gap:10px 24px;font-size:12px;color:#9eb7cf}
.footer-bottom a:hover{color:#75edf4}
@media(max-width:1024px){
 .nav-wrap{gap:13px}.nav-links a{padding:8px 7px;font-size:13px}.nav-ctas .btn{padding:10px 12px}
 .flow-grid{grid-template-columns:repeat(2,1fr)}.flow-card:after{display:none}
 .rules-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
 .container{width:min(calc(100% - 30px),var(--max))}.nav-wrap{height:67px;justify-content:space-between}
 .menu-btn{display:block}.nav-ctas{display:none}.nav-links{display:none;position:absolute;top:67px;left:0;right:0;padding:12px 15px 18px;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow-sm);flex-direction:column;align-items:stretch}
 .nav-links.open{display:flex}.nav-links a{padding:11px 14px}
 .page-hero{min-height:425px}.hero-inner{padding:58px 0}.hero-inner>p{font-size:16px}
 section{padding:62px 0}.section-head{display:block}.section-head p{margin-top:14px}
 .intro-grid,.compare-grid,.scene-layout,.footer-grid{grid-template-columns:1fr}.intro-visual{max-width:620px}.floating-note{left:12px}
 .news-grid{grid-template-columns:1fr 1fr}.cta-box{display:block}.cta-actions{margin-top:22px}.footer-grid{gap:34px}
}
@media(max-width:520px){
 body{font-size:15px}.brand{font-size:22px}.page-hero{min-height:400px}h1{font-size:36px;letter-spacing:-1px}
 .hero-actions .btn,.cta-actions .btn{width:100%}.intro-copy h2,.scene-copy h2{font-size:30px}
 .rank-top{padding:22px}.rank-list{padding:8px 18px}.rank-item{grid-template-columns:37px 1fr}.rank-mark{display:none}
 .flow-grid,.rules-grid,.news-grid{grid-template-columns:1fr}.example-row{grid-template-columns:1fr}.vs{padding:2px}.compare-copy,.example-card{padding:25px 20px}
 .floating-note{position:relative;left:auto;bottom:auto;margin:-30px 16px 0;width:auto}.footer-links{grid-template-columns:1fr 1fr;gap:18px}.footer-links>div:last-child{grid-column:span 2}
}

/* roulang page: category2 */
:root{
 --ink:#102a43;--muted:#60758a;--blue:#1769e0;--blue-dark:#0d4fae;--sky:#eaf4ff;
 --cyan:#2fc4d8;--gold:#efb44b;--paper:#fff;--bg:#f6f9fd;--line:#dce7f2;
 --shadow:0 18px 48px rgba(22,66,116,.12);--shadow-sm:0 8px 22px rgba(22,66,116,.08);
 --r:18px;--r-lg:28px;--max:1180px;--ease:.25s ease;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif;font-size:16px;line-height:1.8}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;object-fit:cover}
button,input{font:inherit}
button{cursor:pointer;border:0}
h1,h2,h3,h4,p{margin-top:0}
.container{width:min(calc(100% - 40px),var(--max));margin:auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.93);backdrop-filter:blur(14px);border-bottom:1px solid rgba(220,231,242,.86)}
.nav-wrap{height:76px;display:flex;align-items:center;gap:24px}
.brand{font-size:25px;font-weight:900;letter-spacing:2px;color:var(--blue);white-space:nowrap}
.brand span{color:var(--cyan)}
.nav-links{display:flex;align-items:center;gap:4px;flex:1;justify-content:center}
.nav-links a{padding:8px 10px;border-radius:9px;color:#49627a;font-size:14px;font-weight:700;white-space:nowrap;transition:var(--ease)}
.nav-links a:hover,.nav-links a.active{background:var(--sky);color:var(--blue)}
.nav-ctas{display:flex;gap:9px;white-space:nowrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:11px;font-weight:800;line-height:1.2;transition:transform var(--ease),box-shadow var(--ease),background var(--ease);text-align:center}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.btn:active{transform:translateY(0)}
.btn:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid rgba(47,196,216,.55);outline-offset:3px}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--blue-dark)}
.btn-light{background:#fff;color:var(--blue);border:1px solid #cfe0f3}
.btn-outline{border:1px solid rgba(255,255,255,.6);color:#fff;background:rgba(255,255,255,.1)}
.menu-btn{display:none;background:var(--sky);color:var(--blue);border-radius:9px;padding:9px 12px;font-weight:800}
section{padding:82px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:34px}
.section-kicker{color:var(--blue);font-weight:900;font-size:13px;letter-spacing:1.2px}
.section-head h2{font-size:clamp(27px,4vw,42px);line-height:1.24;margin:7px 0 0;letter-spacing:-1px}
.section-head p{max-width:510px;color:var(--muted);margin:0}
.eyebrow{display:inline-flex;align-items:center;gap:8px;border-radius:99px;padding:7px 12px;background:#e9f5ff;border:1px solid #cde4fa;color:var(--blue);font-size:13px;font-weight:800;letter-spacing:.4px}
.eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--cyan);display:inline-block}
.inner-hero{padding:65px 0 64px;background:linear-gradient(102deg,rgba(8,43,89,.94),rgba(16,92,173,.72)),url('/assets/images/backpic/back-2.webp') center/cover;color:#fff;overflow:hidden}
.inner-hero-grid{display:grid;grid-template-columns:1.03fr .97fr;gap:50px;align-items:center}
.inner-hero .eyebrow{background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.28);color:#e9f7ff}
.inner-hero h1{font-size:clamp(38px,5vw,61px);line-height:1.12;letter-spacing:-2px;margin:18px 0}
.inner-hero p{font-size:18px;max-width:650px;color:#dcecff;margin-bottom:28px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px}
.coupon-wall{position:relative;min-height:352px;display:flex;align-items:center;justify-content:center}
.coupon-small{position:absolute;width:205px;padding:17px;border-radius:17px;background:#fff;color:var(--ink);box-shadow:var(--shadow);border:1px solid #d6e9fb}
.coupon-small span{font-size:12px;color:var(--muted);display:block}
.coupon-small b{display:block;color:var(--blue);font-size:19px;margin-top:4px}
.coupon-small.left{left:0;top:36px;transform:rotate(-8deg)}
.coupon-small.right{right:0;bottom:27px;transform:rotate(8deg)}
.main-coupon{position:relative;z-index:2;width:min(100%,335px);padding:28px;background:#fff;color:var(--ink);border-radius:24px;box-shadow:0 25px 55px rgba(2,31,73,.34);overflow:hidden}
.main-coupon:before{content:"";position:absolute;right:-36px;top:-42px;width:150px;height:150px;border-radius:50%;background:#daf5f6}
.main-coupon .coupon-label{position:relative;color:var(--blue);font-size:13px;font-weight:900;letter-spacing:1px}
.main-coupon h2{position:relative;font-size:28px;line-height:1.25;margin:12px 0 7px}
.main-coupon p{position:relative;color:var(--muted);font-size:14px;margin:0 0 16px}
.main-coupon .btn{position:relative;width:100%}
.coupon-code{position:relative;border-top:1px dashed #b7cae0;padding-top:14px;margin-top:17px;color:#63809c;font-size:12px;text-align:center}
.intro{background:#fff}
.intro-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:55px;align-items:center}
.image-frame{position:relative}
.image-frame img{width:100%;height:405px;border-radius:var(--r-lg);box-shadow:var(--shadow)}
.float-note{position:absolute;bottom:22px;right:-18px;max-width:250px;padding:18px 19px;border-radius:15px;background:#fff;box-shadow:var(--shadow-sm);border:1px solid var(--line)}
.float-note strong{display:block;font-size:24px;color:var(--blue);line-height:1.2}
.float-note span{font-size:13px;color:var(--muted)}
.intro-copy h2{font-size:clamp(29px,4vw,42px);line-height:1.28;margin:13px 0 18px}
.intro-copy p{color:var(--muted);margin-bottom:17px}
.check-list{padding:0;margin:23px 0 0;list-style:none}
.check-list li{position:relative;padding:11px 0 11px 33px;border-bottom:1px solid var(--line);color:#38546d}
.check-list li:before{content:"✓";position:absolute;left:0;top:12px;width:21px;height:21px;line-height:21px;text-align:center;border-radius:50%;font-weight:900;background:#dff8f8;color:#078999}
.commitments{background:var(--sky)}
.commitment-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:25px}
.commitment-board{padding:38px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.commitment-board h3{font-size:28px;line-height:1.3;margin-bottom:12px}
.commitment-board>p{color:var(--muted)}
.promise-list{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:23px}
.promise{padding:18px;border:1px solid var(--line);border-radius:14px;background:#fbfdff}
.promise b{display:block;color:var(--blue);font-size:16px;margin-bottom:5px}
.promise span{font-size:13px;line-height:1.65;color:var(--muted)}
.side-rule{border-radius:var(--r-lg);padding:35px;background:#123e79;color:#fff;position:relative;overflow:hidden}
.side-rule:before{content:"♣";font-family:Georgia,serif;position:absolute;right:-10px;bottom:-100px;font-size:260px;line-height:1;opacity:.1}
.side-rule h3,.side-rule p,.side-rule ul{position:relative}
.side-rule h3{font-size:28px;line-height:1.3}
.side-rule p{color:#cfe2fb}
.side-rule ul{padding:0;margin:22px 0;list-style:none}
.side-rule li{border-bottom:1px solid rgba(255,255,255,.17);padding:10px 0;color:#eaf4ff}
.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.step-card{position:relative;padding:26px 22px;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-sm);transition:var(--ease)}
.step-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.step-num{display:inline-flex;width:39px;height:39px;align-items:center;justify-content:center;border-radius:12px;color:var(--blue);font-weight:900;background:var(--sky);margin-bottom:17px}
.step-card h3{font-size:19px;margin-bottom:9px}
.step-card p{font-size:14px;color:var(--muted);margin:0}
.scene-section{background:#fff}
.scene-grid{display:grid;grid-template-columns:1.22fr .78fr;gap:28px;align-items:stretch}
.scene-main{min-height:380px;position:relative;border-radius:var(--r-lg);overflow:hidden;color:#fff}
.scene-main img{position:absolute;width:100%;height:100%}
.scene-main:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,37,79,.91),rgba(8,65,127,.1))}
.scene-content{position:absolute;z-index:1;left:34px;right:34px;bottom:28px}
.scene-content h3{font-size:31px;margin-bottom:8px}
.scene-content p{color:#dbeeff;max-width:570px;margin:0}
.scene-stack{display:grid;gap:16px}
.scene-mini{padding:23px;border-radius:var(--r);background:var(--sky);border:1px solid #d7eafa}
.scene-mini:nth-child(2){background:#fef8ed;border-color:#f4dfaf}
.scene-mini h3{font-size:19px;margin-bottom:7px}
.scene-mini p{font-size:14px;color:var(--muted);margin:0}
.notice-band{padding:0;background:transparent}
.notice-box{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:22px;padding:25px 30px;border-radius:var(--r);background:#e0f7f7;border:1px solid #beecef}
.notice-icon{width:47px;height:47px;border-radius:14px;background:#fff;color:#078999;display:grid;place-items:center;font-size:22px;font-weight:900}
.notice-box h3{font-size:19px;margin:0 0 2px}
.notice-box p{margin:0;font-size:14px;color:#4e7480}
.agreement-section{background:#fff}
.agreement-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:44px;align-items:start}
.agreement-copy h2{font-size:clamp(29px,4vw,40px);line-height:1.28;margin:13px 0 17px}
.agreement-copy p{color:var(--muted)}
.agreement-list{border-radius:var(--r-lg);padding:10px 28px;background:var(--bg);border:1px solid var(--line)}
.agreement-item{display:flex;gap:16px;padding:20px 0;border-bottom:1px solid var(--line)}
.agreement-item:last-child{border-bottom:0}
.agreement-index{flex:0 0 auto;width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:var(--blue);color:#fff;font-weight:900;font-size:13px}
.agreement-item h3{font-size:17px;margin:0 0 3px}
.agreement-item p{font-size:14px;color:var(--muted);margin:0}
#news{background:var(--sky)}
.news-list{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.news-item{display:grid;grid-template-columns:112px 1fr auto;align-items:center;gap:18px;padding:19px 21px;border-radius:var(--r);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.news-date{color:var(--blue);font-size:14px;font-weight:900}
.news-item h3{font-size:17px;margin:0 0 4px}
.news-item p{font-size:13px;color:var(--muted);line-height:1.65;margin:0}
.arrow-link{font-size:13px;font-weight:900;color:var(--blue);white-space:nowrap}
.faq-wrap{display:grid;grid-template-columns:.75fr 1.25fr;gap:55px;align-items:start}
.faq-intro h2{font-size:clamp(29px,4vw,42px);line-height:1.25;margin:12px 0}
.faq-intro p{color:var(--muted)}
.faq-list{border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line);background:#fff}
.faq-item button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 4px;text-align:left;background:transparent;color:var(--ink);font-weight:900;font-size:16px}
.faq-item button span:last-child{color:var(--blue);font-size:24px;font-weight:400;transition:var(--ease)}
.faq-answer{display:none;color:var(--muted);font-size:14px;padding:0 4px 19px}
.faq-item.open .faq-answer{display:block}
.faq-item.open button span:last-child{transform:rotate(45deg)}
.cta-section{padding:0 0 82px}
.cta-box{padding:53px 55px;border-radius:var(--r-lg);color:#fff;background:linear-gradient(105deg,#0d4fae,#177dcb);position:relative;overflow:hidden}
.cta-box:after{content:"";position:absolute;width:320px;height:320px;border-radius:50%;right:-94px;top:-145px;border:45px solid rgba(255,255,255,.1)}
.cta-box>div{position:relative;z-index:1;max-width:720px}
.cta-box h2{font-size:clamp(30px,4vw,43px);line-height:1.24;margin-bottom:13px}
.cta-box p{color:#dceeff;margin-bottom:24px}
.cta-box .btn-light{border:0}
.footer{background:#0c2848;color:#d6e3f2;padding:64px 0 22px}
.footer-grid{display:grid;grid-template-columns:.9fr 1.5fr;gap:75px;padding-bottom:42px}
.footer .brand{display:inline-block;margin-bottom:14px;color:#fff}
.footer .brand span{color:#65dbe7}
.footer p{color:#a9c0d8;font-size:14px;max-width:390px;margin:0}
.footer-links{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.footer h3{font-size:15px;color:#fff;margin:0 0 13px}
.footer-links a{display:block;color:#a9c0d8;font-size:14px;margin:7px 0;transition:var(--ease)}
.footer-links a:hover{color:#7eeaf1}
.footer-bottom{border-top:1px solid rgba(255,255,255,.14);padding-top:20px;display:flex;flex-wrap:wrap;gap:10px 22px;color:#97b2cd;font-size:12px}
.footer-bottom a:hover{color:#fff}
@media(max-width:1120px){
 .nav-wrap{gap:12px}.nav-links a{font-size:13px;padding:7px}.nav-ctas .btn{padding:10px 12px;font-size:13px}
 .inner-hero-grid{gap:25px}.coupon-small{width:170px}.steps-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:860px){
 .site-header{position:relative}.nav-wrap{height:68px;justify-content:space-between}.menu-btn{display:block}
 .nav-ctas{display:none}.nav-links{display:none;position:absolute;top:68px;left:0;right:0;padding:13px 20px 19px;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow-sm);flex-direction:column;align-items:stretch}
 .nav-links.open{display:flex}.nav-links a{padding:11px 12px}
 .inner-hero-grid,.intro-grid,.commitment-layout,.scene-grid,.agreement-grid,.faq-wrap{grid-template-columns:1fr}
 .inner-hero{padding:58px 0}.coupon-wall{max-width:470px;width:100%;margin:14px auto 0}.inner-hero h1{max-width:650px}
 .feature-image{min-height:320px}.footer-grid{grid-template-columns:1fr;gap:34px}.footer p{max-width:620px}
 .news-list{grid-template-columns:1fr}
}
@media(max-width:600px){
 body{font-size:15px}.container{width:min(calc(100% - 28px),var(--max))}section{padding:60px 0}
 .section-head{display:block;margin-bottom:25px}.section-head p{margin-top:14px}.inner-hero p{font-size:16px}
 .coupon-small{display:none}.coupon-wall{min-height:auto}.main-coupon{width:100%}
 .image-frame img{height:310px}.float-note{right:10px;bottom:12px;max-width:210px;padding:13px}
 .promise-list{grid-template-columns:1fr}.commitment-board,.side-rule{padding:27px 22px}
 .steps-grid{grid-template-columns:1fr}.scene-main{min-height:325px}.scene-content{left:23px;right:23px;bottom:21px}.scene-content h3{font-size:25px}
 .notice-box{grid-template-columns:auto 1fr;padding:20px}.notice-box .btn{grid-column:1/-1;width:100%}
 .agreement-list{padding:8px 18px}.news-item{grid-template-columns:1fr;gap:7px;padding:18px}.news-item .arrow-link{margin-top:4px}
 .cta-box{padding:37px 25px}.footer{padding-top:48px}.footer-links{grid-template-columns:1fr 1fr;gap:22px}.footer-links>div:last-child{grid-column:1/-1}
}

/* roulang page: category4 */
:root{
 --ink:#102a43;
 --muted:#60758a;
 --blue:#1769e0;
 --blue-dark:#0d4fae;
 --sky:#eaf4ff;
 --cyan:#2fc4d8;
 --gold:#efb44b;
 --paper:#fff;
 --bg:#f6f9fd;
 --line:#dce7f2;
 --green:#1b9b83;
 --shadow:0 18px 48px rgba(22,66,116,.12);
 --shadow-sm:0 8px 22px rgba(22,66,116,.08);
 --r:18px;
 --r-lg:28px;
 --max:1180px;
 --ease:.25s ease;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif;font-size:16px;line-height:1.8}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;object-fit:cover}
button,input{font:inherit}
button{cursor:pointer;border:0}
button:focus-visible,a:focus-visible{outline:3px solid rgba(47,196,216,.55);outline-offset:3px}
.container{width:min(calc(100% - 40px),var(--max));margin:auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid rgba(220,231,242,.86)}
.nav-wrap{height:76px;display:flex;align-items:center;gap:24px}
.brand{font-size:25px;font-weight:900;letter-spacing:2px;color:var(--blue);white-space:nowrap}
.brand span{color:var(--cyan)}
.nav-links{display:flex;align-items:center;gap:4px;flex:1;justify-content:center}
.nav-links a{padding:8px 10px;border-radius:9px;color:#49627a;font-size:14px;font-weight:700;white-space:nowrap;transition:var(--ease)}
.nav-links a:hover,.nav-links a.active{background:var(--sky);color:var(--blue)}
.nav-ctas{display:flex;gap:9px;white-space:nowrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:11px;font-weight:800;line-height:1.2;transition:transform var(--ease),box-shadow var(--ease),background var(--ease);text-align:center}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.btn:active{transform:translateY(0)}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--blue-dark)}
.btn-light{background:#fff;color:var(--blue);border:1px solid #cfe0f3}
.btn-outline{border:1px solid rgba(255,255,255,.6);color:#fff;background:rgba(255,255,255,.1)}
.menu-btn{display:none;background:var(--sky);color:var(--blue);border-radius:9px;padding:9px 12px;font-weight:800}
.hero-inner{position:relative;overflow:hidden;color:#fff;background-image:linear-gradient(90deg,rgba(8,37,77,.92),rgba(9,55,110,.73) 55%,rgba(9,70,128,.42)),url('/assets/images/backpic/back-2.webp');background-size:cover;background-position:center}
.hero{min-height:430px;display:flex;align-items:center;padding:76px 0}
.hero-content{max-width:760px}
.eyebrow{display:inline-flex;align-items:center;gap:8px;border-radius:99px;padding:7px 12px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.22);font-size:13px;font-weight:800;letter-spacing:.5px}
.eyebrow i{width:7px;height:7px;border-radius:50%;background:#6ff0fb;display:inline-block}
.hero h1{font-size:clamp(36px,6vw,64px);line-height:1.15;letter-spacing:-2px;margin:18px 0 18px}
.hero p{font-size:18px;max-width:710px;color:#e2effd;margin:0 0 26px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px}
.hero-note{margin-top:22px;color:#c6def8;font-size:13px}
section{padding:84px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:34px}
.section-kicker{color:var(--blue);font-weight:900;font-size:13px;letter-spacing:1.2px}
.section-head h2{font-size:clamp(27px,4vw,42px);line-height:1.22;margin:7px 0 0;letter-spacing:-1px}
.section-head p{max-width:510px;color:var(--muted);margin:0}
.intro-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:stretch}
.intro-copy{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:38px;box-shadow:var(--shadow-sm)}
.intro-copy p{color:var(--muted);margin:0 0 17px}
.quote-box{margin-top:24px;padding:18px 20px;border-left:4px solid var(--cyan);background:var(--sky);border-radius:0 12px 12px 0;color:#285173;font-weight:700}
.intro-image{min-height:350px;border-radius:var(--r-lg);overflow:hidden;position:relative;box-shadow:var(--shadow)}
.intro-image img{width:100%;height:100%}
.image-caption{position:absolute;left:20px;right:20px;bottom:18px;color:#fff;font-size:19px;font-weight:900;text-shadow:0 2px 12px rgba(0,0,0,.35)}
.principles{background:#eaf4ff}
.principle-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.principle{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px;transition:var(--ease)}
.principle:hover{transform:translateY(-5px);box-shadow:var(--shadow-sm)}
.icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:#dff8f8;color:#087f91;font-size:21px;font-weight:900;margin-bottom:18px}
.principle h3{font-size:19px;margin:0 0 8px}
.principle p{font-size:14px;color:var(--muted);margin:0}
.steps-wrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:44px;align-items:center}
.steps-image{border-radius:var(--r-lg);overflow:hidden;min-height:430px}
.steps-image img{width:100%;height:100%}
.step-list{display:grid;gap:0}
.step{display:grid;grid-template-columns:54px 1fr;gap:17px;padding:20px 0;border-bottom:1px solid var(--line)}
.step:last-child{border-bottom:0}
.step-number{width:43px;height:43px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;font-weight:900}
.step h3{margin:0 0 5px;font-size:20px}
.step p{margin:0;color:var(--muted);font-size:15px}
.guidance{background:#123e79;color:#fff}
.guidance .section-kicker{color:#8eeaf0}
.guidance .section-head p{color:#c8ddf5}
.guidance-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.guidance-card{border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.08);border-radius:var(--r);padding:27px}
.guidance-card h3{margin:0 0 12px;font-size:22px}
.guidance-card p{color:#c8ddf5;margin:0}
.guidance-list{list-style:none;padding:0;margin:16px 0 0}
.guidance-list li{padding:10px 0 10px 28px;border-bottom:1px solid rgba(255,255,255,.13);position:relative;color:#e8f3ff}
.guidance-list li:before{content:"✓";position:absolute;left:0;color:#71e1e2;font-weight:900}
.scenario-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:28px}
.scenario-panel{background:#fff;border-radius:var(--r-lg);border:1px solid var(--line);padding:34px;box-shadow:var(--shadow-sm)}
.scenario-panel h2{font-size:31px;line-height:1.3;margin:0 0 14px}
.scenario-panel p{color:var(--muted)}
.scenario-tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}
.tag{padding:7px 12px;border-radius:99px;background:var(--sky);color:var(--blue);font-weight:800;font-size:13px}
.scenario-list{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.scenario-item{padding:20px;border:1px solid var(--line);border-radius:15px;background:var(--bg)}
.scenario-item strong{display:block;margin-bottom:6px;color:var(--blue)}
.scenario-item span{font-size:14px;color:var(--muted)}
.rules-table{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-sm)}
.rule-line{display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:20px;padding:20px 26px;border-bottom:1px solid var(--line);align-items:center}
.rule-line:last-child{border-bottom:0}
.rule-line.head{background:var(--sky);color:var(--blue);font-size:13px;font-weight:900}
.rule-line strong{font-size:17px}
.rule-line span{color:var(--muted);font-size:14px}
.notice{display:flex;gap:18px;align-items:flex-start;background:#fff8e7;border:1px solid #f3d99a;border-radius:var(--r);padding:24px;color:#70521b}
.notice b{color:#9b6b11;white-space:nowrap}
.notice p{margin:0}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:15px;padding:0 22px;box-shadow:var(--shadow-sm)}
.faq-item summary{cursor:pointer;list-style:none;padding:20px 28px 20px 0;font-weight:900;position:relative}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:"+";position:absolute;right:0;color:var(--blue);font-size:25px;top:15px}
.faq-item[open] summary:after{content:"−"}
.faq-item p{color:var(--muted);font-size:14px;margin:0 0 20px}
.cta{padding:78px 0}
.cta-box{border-radius:var(--r-lg);background:linear-gradient(120deg,#1769e0,#0d4fae);padding:48px 54px;color:#fff;display:flex;justify-content:space-between;align-items:center;gap:30px;box-shadow:var(--shadow)}
.cta-box h2{font-size:clamp(28px,4vw,42px);line-height:1.25;margin:0 0 10px}
.cta-box p{color:#d9eaff;margin:0;max-width:650px}
.footer{background:#092b55;color:#d7e7f7;padding:58px 0 22px}
.footer-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:50px;padding-bottom:42px}
.footer .brand{display:inline-block;margin-bottom:14px}
.footer p{color:#a9c3df;max-width:390px;margin:0;font-size:14px}
.footer-links{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.footer-links h3{color:#fff;font-size:15px;margin:0 0 14px}
.footer-links a{display:block;color:#a9c3df;font-size:14px;margin:7px 0;transition:var(--ease)}
.footer-links a:hover{color:#6fe2ea}
.footer-bottom{border-top:1px solid rgba(255,255,255,.14);padding-top:20px;display:flex;flex-wrap:wrap;gap:12px 22px;color:#91afd0;font-size:12px}
.footer-bottom a:hover{color:#fff}
@media(max-width:1100px){
 .nav-links{gap:0}
 .nav-links a{padding-left:7px;padding-right:7px;font-size:13px}
 .nav-ctas .btn{padding:11px 13px;font-size:13px}
 .principle-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
 .nav-wrap{height:68px}
 .nav-ctas{display:none}
 .menu-btn{display:block;margin-left:auto}
 .nav-links{position:absolute;top:68px;left:20px;right:20px;display:none;flex-direction:column;align-items:stretch;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px;box-shadow:var(--shadow)}
 .nav-links.open{display:flex}
 .nav-links a{padding:11px 13px}
 .intro-grid,.steps-wrap,.scenario-grid,.guidance-grid{grid-template-columns:1fr}
 .intro-image{min-height:300px}
 .steps-image{min-height:280px}
 .section-head{display:block}
 .section-head p{margin-top:12px}
 .cta-box{display:block;padding:38px 30px}
 .cta-box .btn{margin-top:24px}
 .footer-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
 .container{width:min(calc(100% - 28px),var(--max))}
 .hero{min-height:500px;padding:58px 0}
 .hero h1{font-size:39px;letter-spacing:-1px}
 .hero p{font-size:16px}
 section{padding:62px 0}
 .principle-grid,.scenario-list,.faq-grid{grid-template-columns:1fr}
 .intro-copy,.scenario-panel{padding:25px}
 .rule-line{grid-template-columns:1fr;gap:4px;padding:17px 20px}
 .rule-line.head{display:none}
 .footer-links{grid-template-columns:1fr 1fr}
 .footer-bottom{display:block}
 .footer-bottom span{display:block;margin:8px 0}
}

/* roulang page: category5 */
:root{
      --ink:#102a43;--muted:#60758a;--blue:#1769e0;--blue-dark:#0d4fae;--sky:#eaf4ff;
      --cyan:#2fc4d8;--gold:#efb44b;--paper:#fff;--bg:#f6f9fd;--line:#dce7f2;
      --shadow:0 18px 48px rgba(22,66,116,.12);--shadow-sm:0 8px 22px rgba(22,66,116,.08);
      --r:18px;--r-lg:28px;--max:1180px;--ease:.25s ease;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--bg);color:var(--ink);font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif;font-size:16px;line-height:1.8}
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{font-weight:900;letter-spacing:-.5px}
    a{color:inherit;text-decoration:none}
    img{display:block;max-width:100%;object-fit:cover}
    button,input{font:inherit}
    button{cursor:pointer;border:0}
    .container{width:min(calc(100% - 40px),var(--max));margin:auto}
    .site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.93);backdrop-filter:blur(14px);border-bottom:1px solid rgba(220,231,242,.86)}
    .nav-wrap{height:76px;display:flex;align-items:center;gap:24px}
    .brand{font-size:25px;font-weight:900;letter-spacing:2px;color:var(--blue);white-space:nowrap}
    .brand span{color:var(--cyan)}
    .nav-links{display:flex;align-items:center;gap:4px;flex:1;justify-content:center}
    .nav-links a{padding:8px 10px;border-radius:9px;color:#49627a;font-size:14px;font-weight:700;white-space:nowrap;transition:var(--ease)}
    .nav-links a:hover,.nav-links a.active{background:var(--sky);color:var(--blue)}
    .nav-ctas{display:flex;gap:9px;white-space:nowrap}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:11px;font-weight:800;line-height:1.2;transition:transform var(--ease),box-shadow var(--ease),background var(--ease);text-align:center}
    .btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
    .btn:active{transform:translateY(0)}
    .btn:focus-visible,a:focus-visible{outline:3px solid rgba(47,196,216,.55);outline-offset:3px}
    .btn-primary{background:var(--blue);color:#fff}
    .btn-primary:hover{background:var(--blue-dark)}
    .btn-light{background:#fff;color:var(--blue);border:1px solid #cfe0f3}
    .btn-outline{background:transparent;border:1px solid rgba(255,255,255,.65);color:#fff}
    .menu-btn{display:none;background:var(--sky);color:var(--blue);border-radius:9px;padding:9px 12px;font-weight:800}
    section{padding:82px 0}
    .section-kicker{color:var(--blue);font-weight:900;font-size:13px;letter-spacing:1.2px;margin-bottom:7px}
    .section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:34px}
    .section-head h2{font-size:clamp(28px,4vw,42px);line-height:1.22;margin-bottom:0}
    .section-head p{max-width:520px;margin-bottom:0;color:var(--muted)}
    .inner-hero{position:relative;overflow:hidden;min-height:515px;padding:74px 0;background:linear-gradient(100deg,rgba(9,43,91,.94),rgba(15,80,166,.75),rgba(11,56,113,.46)),url('/assets/images/backpic/back-2.webp') center/cover;color:#fff}
    .inner-hero:after{content:"";position:absolute;right:-110px;bottom:-160px;width:470px;height:470px;border:1px solid rgba(255,255,255,.18);border-radius:50%;box-shadow:0 0 0 55px rgba(47,196,216,.10),0 0 0 110px rgba(47,196,216,.06)}
    .profile-hero{position:relative;z-index:1;display:grid;grid-template-columns:1fr 390px;gap:42px;align-items:end}
    .crumb{font-size:14px;color:#d8eaff;margin-bottom:35px}
    .crumb a{color:#fff;font-weight:800}
    .profile-line{display:flex;align-items:center;gap:17px;margin-bottom:20px}
    .avatar{width:68px;height:68px;border-radius:50%;background:linear-gradient(135deg,#65dce9,#1769e0);border:4px solid rgba(255,255,255,.55);display:grid;place-items:center;color:#fff;font-size:29px;font-family:Georgia,serif;box-shadow:0 8px 20px rgba(2,25,61,.25)}
    .profile-name b{font-size:18px;display:block}
    .profile-name span{font-size:13px;color:#cce4ff}
    .hero-tag{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.25);border-radius:99px;font-size:13px;font-weight:800}
    .hero-tag i{width:8px;height:8px;border-radius:50%;background:#77eff7}
    .inner-hero h1{font-size:clamp(38px,5vw,62px);line-height:1.12;max-width:720px;margin:0 0 19px}
    .inner-hero p{max-width:700px;color:#e1efff;font-size:18px;margin-bottom:28px}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px}
    .status-board{background:rgba(255,255,255,.96);color:var(--ink);padding:25px;border-radius:var(--r-lg);box-shadow:0 20px 45px rgba(5,30,75,.25)}
    .status-board h2{font-size:20px;margin-bottom:15px}
    .status-board p{font-size:14px;line-height:1.7;color:var(--muted);margin-bottom:17px}
    .metric-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
    .metric{padding:13px;border-radius:13px;background:var(--sky)}
    .metric b{display:block;font-size:20px;color:var(--blue);line-height:1.2}
    .metric span{font-size:12px;color:var(--muted)}
    .intro-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:55px;align-items:center}
    .image-frame{position:relative}
    .image-frame img{height:430px;width:100%;border-radius:var(--r-lg);box-shadow:var(--shadow)}
    .image-note{position:absolute;right:-18px;bottom:25px;width:220px;padding:18px;background:#fff;border-radius:15px;box-shadow:var(--shadow-sm)}
    .image-note b{display:block;color:var(--blue);font-size:16px}
    .image-note span{font-size:13px;line-height:1.6;color:var(--muted)}
    .copy-block h2{font-size:clamp(29px,4vw,42px);line-height:1.26;margin-bottom:18px}
    .copy-block p{color:var(--muted);margin-bottom:17px}
    .check-list{list-style:none;padding:0;margin:24px 0 0}
    .check-list li{position:relative;padding:11px 0 11px 32px;border-bottom:1px solid var(--line);color:#38546d}
    .check-list li:before{content:"✓";position:absolute;left:0;top:11px;width:21px;height:21px;border-radius:50%;background:#dff8f8;color:#078999;text-align:center;line-height:21px;font-weight:900}
    .soft-section{background:var(--sky)}
    .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
    .step{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:25px 21px;box-shadow:var(--shadow-sm);transition:var(--ease)}
    .step:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
    .step-num{display:grid;place-items:center;width:37px;height:37px;border-radius:11px;background:var(--blue);color:#fff;font-size:14px;font-weight:900;margin-bottom:17px}
    .step h3{font-size:19px;margin-bottom:8px}
    .step p{font-size:14px;color:var(--muted);margin-bottom:0}
    .handbook{display:grid;grid-template-columns:1.05fr .95fr;gap:28px;align-items:stretch}
    .handbook-main{padding:39px;border-radius:var(--r-lg);background:#123e79;color:#fff;position:relative;overflow:hidden}
    .handbook-main:after{content:"♣";position:absolute;right:-22px;bottom:-115px;font:280px Georgia,serif;opacity:.1}
    .handbook-main>*{position:relative;z-index:1}
    .handbook-main h2{font-size:35px;line-height:1.23;margin-bottom:15px}
    .handbook-main p{color:#d3e6ff;max-width:570px}
    .guide-points{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:23px}
    .guide-point{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:14px;font-size:14px}
    .guide-point b{display:block;color:#83f0f7;margin-bottom:3px}
    .rule-panel{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;box-shadow:var(--shadow-sm)}
    .rule-panel h3{font-size:24px;margin-bottom:13px}
    .rule-row{display:flex;align-items:flex-start;gap:13px;padding:15px 0;border-bottom:1px solid var(--line)}
    .rule-row:last-child{border-bottom:0}
    .rule-icon{flex:0 0 37px;width:37px;height:37px;border-radius:11px;background:var(--sky);display:grid;place-items:center;color:var(--blue);font-weight:900}
    .rule-row b{display:block;font-size:16px}
    .rule-row span{display:block;font-size:13px;line-height:1.6;color:var(--muted)}
    .scene-layout{display:grid;grid-template-columns:390px 1fr;gap:30px}
    .scene-lead{border-radius:var(--r-lg);overflow:hidden;position:relative;min-height:495px;background:#123e79;color:#fff}
    .scene-lead img{height:100%;width:100%;opacity:.62}
    .scene-lead:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,31,69,.95),rgba(6,31,69,.04))}
    .scene-copy{position:absolute;z-index:1;left:28px;right:28px;bottom:27px}
    .scene-copy h2{font-size:31px;line-height:1.24;margin-bottom:10px}
    .scene-copy p{color:#d6e8ff;margin-bottom:0}
    .scene-list{display:grid;grid-template-columns:1fr 1fr;gap:16px}
    .scene-item{padding:23px;border-radius:var(--r);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-sm);transition:var(--ease)}
    .scene-item:hover{border-color:#a9caee;transform:translateY(-4px)}
    .scene-item small{display:block;color:var(--blue);font-weight:900;margin-bottom:6px}
    .scene-item h3{font-size:20px;margin-bottom:8px}
    .scene-item p{font-size:14px;line-height:1.75;color:var(--muted);margin-bottom:0}
    .etiquette-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .etiquette{padding:26px;border:1px solid var(--line);border-radius:var(--r);background:#fff}
    .etiquette .badge{display:inline-flex;padding:5px 10px;border-radius:99px;background:#e4f8fa;color:#078999;font-size:12px;font-weight:900;margin-bottom:13px}
    .etiquette h3{font-size:20px;margin-bottom:8px}
    .etiquette p{font-size:14px;color:var(--muted);margin-bottom:0}
    .news-area{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .news-list{display:grid;grid-template-columns:1fr 1fr;gap:15px}
    .news-item{display:flex;gap:17px;padding:19px;border:1px solid var(--line);border-radius:15px;background:var(--bg);transition:var(--ease)}
    .news-item:hover{background:#fff;box-shadow:var(--shadow-sm);transform:translateY(-3px)}
    .news-date{flex:0 0 58px;color:var(--blue);font-weight:900;font-size:13px;line-height:1.45}
    .news-date b{display:block;font-size:21px}
    .news-content h3{font-size:17px;margin-bottom:5px;line-height:1.45}
    .news-content p{font-size:13px;line-height:1.7;color:var(--muted);margin-bottom:8px}
    .arrow-link{font-size:13px;color:var(--blue);font-weight:900}
    .faq-wrap{display:grid;grid-template-columns:.7fr 1.3fr;gap:55px;align-items:start}
    .faq-side h2{font-size:38px;line-height:1.24;margin-bottom:15px}
    .faq-side p{color:var(--muted)}
    .faq-list{display:grid;gap:12px}
    .faq{padding:20px 22px;border-radius:14px;border:1px solid var(--line);background:#fff;box-shadow:0 4px 13px rgba(22,66,116,.04)}
    .faq h3{font-size:17px;margin:0 0 8px;line-height:1.5}
    .faq p{color:var(--muted);font-size:14px;margin:0}
    .cta-section{padding-top:20px;padding-bottom:86px}
    .cta-box{display:flex;justify-content:space-between;align-items:center;gap:28px;padding:44px 49px;border-radius:var(--r-lg);background:linear-gradient(115deg,#0e4eab,#1769e0 57%,#209eb7);color:#fff;box-shadow:var(--shadow)}
    .cta-box h2{font-size:34px;line-height:1.22;margin-bottom:9px}
    .cta-box p{max-width:680px;color:#ddecff;margin-bottom:0}
    .cta-box .btn-light{border:0;white-space:nowrap}
    .footer{background:#0d2746;color:#c8d9e9;padding:62px 0 25px}
    .footer-grid{display:grid;grid-template-columns:.85fr 1.45fr;gap:70px;padding-bottom:45px}
    .footer .brand{display:inline-block;margin-bottom:13px;color:#fff}
    .footer .brand span{color:#71e7ef}
    .footer p{font-size:14px;line-height:1.85;max-width:390px;margin-bottom:0;color:#b8cce1}
    .footer-links{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}
    .footer-links h3{font-size:15px;color:#fff;margin-bottom:13px}
    .footer-links a{display:block;font-size:14px;color:#b8cce1;margin:8px 0;transition:var(--ease)}
    .footer-links a:hover{color:#7beef5}
    .footer-bottom{border-top:1px solid rgba(195,219,241,.17);padding-top:21px;display:flex;gap:14px;justify-content:space-between;flex-wrap:wrap;font-size:12px;color:#9db5ce}
    .footer-bottom a:hover{color:#7beef5}
    @media(max-width:1024px){
      .nav-wrap{gap:12px}.nav-links a{padding:7px 7px;font-size:13px}.nav-ctas .btn{padding:10px 12px;font-size:13px}
      .profile-hero{grid-template-columns:1fr 330px}.steps{grid-template-columns:repeat(2,1fr)}
      .scene-layout{grid-template-columns:320px 1fr}.footer-grid{gap:38px}
    }
    @media(max-width:768px){
      .container{width:min(calc(100% - 30px),var(--max))}
      .nav-wrap{height:68px;justify-content:space-between}.nav-ctas{display:none}.menu-btn{display:block}
      .nav-links{display:none;position:absolute;left:0;right:0;top:68px;padding:14px 15px 19px;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow);flex-direction:column;align-items:stretch}
      .nav-links.open{display:flex}.nav-links a{padding:10px 12px}
      .inner-hero{padding:55px 0 50px}.profile-hero,.intro-grid,.handbook,.scene-layout,.faq-wrap,.footer-grid{grid-template-columns:1fr}
      .status-board{max-width:480px}.image-frame img{height:340px}.image-note{right:12px;bottom:-12px}
      .scene-lead{min-height:330px}.scene-list{grid-template-columns:1fr 1fr}.etiquette-grid{grid-template-columns:1fr}
      .cta-box{padding:35px;display:block}.cta-box .btn{margin-top:20px}.footer-links{margin-top:4px}
      section{padding:63px 0}
    }
    @media(max-width:520px){
      body{font-size:15px}.brand{font-size:22px}.inner-hero h1{font-size:37px}.inner-hero p{font-size:16px}
      .profile-line{gap:12px}.avatar{width:56px;height:56px;font-size:24px}.hero-actions .btn{width:100%}
      .section-head{display:block;margin-bottom:25px}.section-head p{margin-top:13px}.steps,.scene-list,.guide-points,.metric-grid,.news-list{grid-template-columns:1fr}
      .handbook-main,.rule-panel{padding:25px}.handbook-main h2,.faq-side h2,.cta-box h2{font-size:29px}
      .image-frame img{height:290px}.image-note{position:relative;right:auto;bottom:auto;width:auto;margin:-15px 15px 0}
      .news-item{gap:12px}.cta-box{padding:28px 24px}.footer-links{grid-template-columns:1fr 1fr;gap:18px}.footer-bottom{display:grid}
    }

/* roulang page: category6 */
:root{
 --ink:#102a43;--muted:#60758a;--blue:#1769e0;--blue-dark:#0d4fae;--sky:#eaf4ff;
 --cyan:#2fc4d8;--gold:#efb44b;--paper:#fff;--bg:#f6f9fd;--line:#dce7f2;
 --shadow:0 18px 48px rgba(22,66,116,.12);--shadow-sm:0 8px 22px rgba(22,66,116,.08);
 --r:18px;--r-lg:28px;--max:1180px;--ease:.25s ease;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif;font-size:16px;line-height:1.8}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;object-fit:cover}
button,input{font:inherit}
button{cursor:pointer;border:0}
h1,h2,h3,h4,p{margin-top:0}
.container{width:min(calc(100% - 40px),var(--max));margin:auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.93);backdrop-filter:blur(14px);border-bottom:1px solid rgba(220,231,242,.86)}
.nav-wrap{height:76px;display:flex;align-items:center;gap:24px}
.brand{font-size:25px;font-weight:900;letter-spacing:2px;color:var(--blue);white-space:nowrap}
.brand span{color:var(--cyan)}
.nav-links{display:flex;align-items:center;gap:4px;flex:1;justify-content:center}
.nav-links a{padding:8px 10px;border-radius:9px;color:#49627a;font-size:14px;font-weight:700;white-space:nowrap;transition:var(--ease)}
.nav-links a:hover,.nav-links a.active{background:var(--sky);color:var(--blue)}
.nav-ctas{display:flex;gap:9px;white-space:nowrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:11px;font-weight:800;line-height:1.25;transition:transform var(--ease),box-shadow var(--ease),background var(--ease,border-color var(--ease);text-align:center}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.btn:active{transform:translateY(0)}
.btn:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid rgba(47,196,216,.55);outline-offset:3px}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--blue-dark)}
.btn-light{background:#fff;color:var(--blue);border:1px solid #cfe0f3}
.btn-outline{border:1px solid rgba(255,255,255,.64);color:#fff;background:rgba(255,255,255,.08)}
.menu-btn{display:none;background:var(--sky);color:var(--blue);border-radius:9px;padding:9px 12px;font-weight:800}
section{padding:82px 0}
.section-kicker{color:var(--blue);font-weight:900;font-size:13px;letter-spacing:1.2px;margin-bottom:7px}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:34px}
.section-head h2{font-size:clamp(28px,4vw,42px);line-height:1.24;letter-spacing:-1px;margin-bottom:0}
.section-head p{max-width:510px;color:var(--muted);margin:0}
.page-hero{position:relative;min-height:490px;display:flex;align-items:center;color:#fff;isolation:isolate;overflow:hidden;background-image:linear-gradient(90deg,rgba(7,31,65,.94),rgba(10,65,128,.72) 52%,rgba(10,70,130,.32)),url('/assets/images/backpic/back-3.webp');background-size:cover;background-position:center}
.page-hero:after{content:"";position:absolute;width:430px;height:430px;right:-115px;bottom:-180px;border-radius:50%;background:rgba(47,196,216,.22);filter:blur(3px);z-index:-1}
.breadcrumb{padding-top:28px;color:#d8eaff;font-size:14px}
.breadcrumb a{color:#fff;font-weight:800}
.page-hero-inner{padding:46px 0 68px;max-width:760px}
.eyebrow{display:inline-flex;align-items:center;gap:8px;border-radius:99px;padding:7px 12px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);font-size:13px;font-weight:800;letter-spacing:.5px}
.eyebrow i{width:7px;height:7px;border-radius:50%;background:#6ff0fb;display:inline-block}
h1{font-size:clamp(39px,6vw,65px);line-height:1.13;letter-spacing:-2px;margin:18px 0}
.hero-copy{font-size:18px;color:#e2effd;max-width:700px;margin-bottom:28px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.hero-facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:31px}
.hero-facts span{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:7px 11px;font-size:13px;color:#eaf5ff}
.intro-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:58px;align-items:center}
.intro-image{position:relative}
.intro-image img{width:100%;height:440px;border-radius:var(--r-lg);box-shadow:var(--shadow)}
.float-note{position:absolute;right:-20px;bottom:25px;max-width:260px;padding:18px 20px;background:#fff;border-radius:15px;box-shadow:var(--shadow-sm);color:var(--ink)}
.float-note strong{display:block;font-size:21px;color:var(--blue)}
.intro-copy h2,.dark-copy h2{font-size:clamp(29px,4vw,42px);line-height:1.25;letter-spacing:-1px}
.intro-copy p{color:var(--muted);margin-bottom:17px}
.check-list{padding:0;margin:24px 0 0;list-style:none}
.check-list li{position:relative;padding:11px 0 11px 34px;border-bottom:1px solid var(--line);color:#38546d}
.check-list li:before{content:"✓";position:absolute;left:0;top:11px;width:21px;height:21px;line-height:21px;text-align:center;border-radius:50%;font-weight:900;background:#dff8f8;color:#078999}
.soft-bg{background:var(--sky)}
.value-layout{display:grid;grid-template-columns:1.04fr .96fr;gap:26px}
.value-main{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:38px;box-shadow:var(--shadow-sm)}
.value-main h2{font-size:34px;line-height:1.28;margin-bottom:15px}
.value-main p{color:var(--muted)}
.value-points{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;margin-top:27px}
.value-point{padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--bg)}
.value-point b{display:block;color:var(--blue);font-size:18px;margin-bottom:4px}
.value-point span{color:var(--muted);font-size:14px;line-height:1.65}
.blue-panel{padding:37px;border-radius:var(--r-lg);background:#123e79;color:#fff;overflow:hidden;position:relative}
.blue-panel:after{content:"♣";font-family:serif;font-size:250px;line-height:1;position:absolute;right:-22px;bottom:-92px;color:#fff;opacity:.08}
.blue-panel>*{position:relative;z-index:1}
.blue-panel h3{font-size:29px;line-height:1.3;margin-bottom:15px}
.blue-panel p{color:#d5e6fb}
.mini-rule{display:flex;gap:12px;align-items:flex-start;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.16)}
.mini-rule:last-child{border-bottom:0}
.mini-rule em{font-style:normal;flex:0 0 28px;height:28px;line-height:28px;text-align:center;border-radius:50%;background:rgba(47,196,216,.24);color:#aaf5fc;font-weight:900}
.scene-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}
.scene-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-sm);transition:transform var(--ease),box-shadow var(--ease)}
.scene-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.scene-card img{width:100%;height:158px}
.scene-card-body{padding:18px}
.scene-card small{font-weight:900;color:var(--cyan)}
.scene-card h3{font-size:19px;line-height:1.35;margin:7px 0}
.scene-card p{font-size:14px;line-height:1.72;color:var(--muted);margin-bottom:0}
.prepare-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.prepare-card{padding:27px 25px;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-sm);transition:var(--ease)}
.prepare-card:hover{border-color:#a9cbef;transform:translateY(-4px)}
.step-num{display:inline-flex;width:39px;height:39px;align-items:center;justify-content:center;border-radius:12px;background:var(--sky);color:var(--blue);font-weight:900;margin-bottom:16px}
.prepare-card h3{font-size:20px;margin-bottom:8px}
.prepare-card p{color:var(--muted);font-size:14px;margin-bottom:0}
.timeline{position:relative;max-width:910px;margin:auto;padding:7px 0}
.timeline:before{content:"";position:absolute;left:21px;top:28px;bottom:28px;width:2px;background:#cce0f4}
.time-item{position:relative;padding:0 0 28px 72px}
.time-item:last-child{padding-bottom:0}
.time-dot{position:absolute;left:8px;top:2px;width:28px;height:28px;border:6px solid #dff4ff;background:var(--blue);border-radius:50%}
.time-item h3{font-size:21px;margin:0 0 6px}
.time-item p{color:var(--muted);margin:0}
.safety-section{background:#102f60;color:#fff}
.safety-section .section-kicker{color:#80ebf2}
.safety-section .section-head p{color:#c8dbf4}
.boundary-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.boundary-card{border:1px solid rgba(255,255,255,.15);border-radius:var(--r);padding:26px;background:rgba(255,255,255,.07)}
.boundary-card h3{font-size:21px;margin-bottom:10px}
.boundary-card p{color:#d2e2f7;margin:0}
.boundary-card strong{color:#83edf4}
.story-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:30px;align-items:stretch}
.story-art{min-height:385px;position:relative;overflow:hidden;border-radius:var(--r-lg)}
.story-art img{width:100%;height:100%}
.story-art:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,37,75,.8),transparent 70%)}
.story-art-copy{position:absolute;z-index:1;left:28px;right:28px;bottom:23px;color:#fff}
.story-art-copy h3{font-size:28px;line-height:1.25;margin-bottom:8px}
.story-art-copy p{color:#e5f2ff;margin:0}
.quote-stack{display:flex;flex-direction:column;gap:16px}
.quote{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:23px;box-shadow:var(--shadow-sm)}
.quote p{font-size:16px;line-height:1.8;margin-bottom:11px}
.quote cite{font-style:normal;color:var(--blue);font-weight:900;font-size:14px}
.news-list{display:grid;grid-template-columns:repeat(2,1fr);gap:17px}
.news-item{display:flex;gap:17px;align-items:flex-start;background:#fff;padding:21px;border-radius:var(--r);border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.news-date{flex:0 0 59px;border-right:1px solid var(--line);color:var(--blue);font-size:13px;font-weight:900;line-height:1.45}
.news-date b{display:block;font-size:25px;line-height:1}
.news-copy h3{font-size:18px;line-height:1.4;margin:0 0 7px}
.news-copy p{font-size:14px;line-height:1.7;color:var(--muted);margin:0 0 9px}
.arrow-link{font-size:14px;font-weight:900;color:var(--blue)}
.faq-wrap{max-width:900px;margin:auto}
.faq-item{margin-bottom:13px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-sm);overflow:hidden}
.faq-item summary{list-style:none;padding:19px 54px 19px 21px;cursor:pointer;font-weight:900;position:relative}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:"+";position:absolute;right:20px;top:15px;font-size:26px;line-height:1;color:var(--blue);transition:transform var(--ease)}
.faq-item[open] summary:after{transform:rotate(45deg)}
.faq-answer{padding:0 21px 20px;color:var(--muted)}
.cta{padding:0 0 86px}
.cta-box{position:relative;overflow:hidden;border-radius:var(--r-lg);padding:54px 58px;background:linear-gradient(110deg,#1769e0,#0f4eab);color:#fff;box-shadow:var(--shadow)}
.cta-box:after{content:"♥";position:absolute;right:42px;bottom:-118px;font-family:serif;font-size:290px;line-height:1;color:rgba(255,255,255,.09)}
.cta-box>*{position:relative;z-index:1}
.cta-box h2{font-size:clamp(30px,4vw,43px);line-height:1.25;margin-bottom:12px}
.cta-box p{color:#dceaff;max-width:660px;margin-bottom:23px}
.cta-box .btn-light{border:0}
.footer{background:#0c2340;color:#c7d7e9;padding:62px 0 22px}
.footer-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:70px;padding-bottom:39px}
.footer .brand{display:inline-block;color:#fff;margin-bottom:16px}
.footer .brand span{color:#62e0ea}
.footer p{max-width:390px;color:#a9bfd7;font-size:14px;line-height:1.8}
.footer-links{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}
.footer-links h3{color:#fff;font-size:15px;margin:0 0 13px}
.footer-links a{display:block;color:#a9bfd7;font-size:14px;margin:8px 0;transition:var(--ease)}
.footer-links a:hover{color:#72ebf2}
.footer-bottom{padding-top:21px;border-top:1px solid rgba(255,255,255,.13);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;color:#91a9c3;font-size:12px}
.footer-bottom a:hover{color:#fff}
@media(max-width:1100px){
 .nav-wrap{gap:12px}.nav-links a{font-size:13px;padding:8px 7px}.nav-ctas .btn{padding:10px 12px;font-size:13px}
 .scene-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:860px){
 .nav-wrap{position:relative;justify-content:space-between}.menu-btn{display:block}.nav-ctas{margin-left:auto;margin-right:8px}.nav-links{display:none;position:absolute;top:76px;left:0;right:0;padding:13px 20px 19px;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow-sm);flex-direction:column;align-items:stretch}.nav-links.open{display:flex}.nav-links a{padding:10px 12px}
 section{padding:65px 0}.intro-grid,.value-layout,.story-grid{grid-template-columns:1fr;gap:30px}.intro-image img{height:355px}.float-note{right:15px}.boundary-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr;gap:28px}
}
@media(max-width:620px){
 body{font-size:15px}.container{width:min(calc(100% - 28px),var(--max))}.nav-ctas{display:none}.page-hero{min-height:460px}.page-hero-inner{padding:39px 0 57px}.hero-copy{font-size:16px}.section-head{display:block;margin-bottom:27px}.section-head p{margin-top:13px}.value-main,.blue-panel{padding:26px 22px}.value-points,.prepare-grid,.news-list{grid-template-columns:1fr}.scene-grid{grid-template-columns:1fr}.story-art{min-height:330px}.cta-box{padding:38px 25px}.footer-links{grid-template-columns:1fr 1fr;gap:20px}.footer-links>div:last-child{grid-column:1/-1}.footer-bottom{display:block}.footer-bottom span{display:block;margin:7px 0}.breadcrumb{font-size:13px}
}
@media(max-width:420px){
 h1{letter-spacing:-1px}.btn{width:100%}.hero-actions{display:grid}.hero-facts{display:none}.intro-image img{height:285px}.float-note{position:static;margin-top:13px;max-width:none}.news-item{padding:17px;gap:12px}.news-date{flex-basis:50px}.footer-links{grid-template-columns:1fr}
}