/* roulang page: index */
:root {
            --navy:#12253f;
            --blue:#2264a8;
            --cyan:#48b9c8;
            --ink:#172538;
            --muted:#6c7a8d;
            --paper:#f5f8fb;
            --white:#fff;
            --line:#dfe7ef;
            --soft:#eaf3f8;
            --gold:#e7a93b;
            --radius:18px;
            --shadow:0 14px 34px rgba(25,55,85,.09);
        }
        * { box-sizing:border-box; }
        html { scroll-behavior:smooth; }
        body { margin:0; color:var(--ink); background:var(--paper); font-family:"Noto Sans SC","Microsoft YaHei",Arial,sans-serif; line-height:1.75; }
        a { color:inherit; text-decoration:none; transition:.25s ease; }
        img { max-width:100%; display:block; }
        button, input { font:inherit; }
        .container { max-width:1180px; }
        .site-header { position:sticky; top:0; z-index:20; background:rgba(255,255,255,.94); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
        .navbar { min-height:78px; }
        .brand { display:flex; align-items:center; gap:12px; font-weight:800; color:var(--navy); letter-spacing:.02em; }
        .brand-mark { width:40px; height:40px; display:grid; place-items:center; border-radius:12px; color:#fff; background:var(--navy); box-shadow:0 7px 16px rgba(18,37,63,.2); }
        .nav-link { color:#566679 !important; font-size:14px; font-weight:600; padding:10px 14px !important; border-radius:10px; }
        .nav-link:hover,.nav-link.active { color:var(--blue) !important; background:var(--soft); }
        .nav-cta { color:#fff !important; background:var(--blue); padding:10px 16px !important; }
        .nav-cta:hover { background:var(--navy); }
        .hero { position:relative; min-height:620px; overflow:hidden; color:#fff; background:#132943; }
        .hero:before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(9,27,48,.94) 0%,rgba(17,48,75,.78) 48%,rgba(18,42,67,.28) 100%),url("https://images.unsplash.com/photo-1538485399081-7c897f98d7d4?auto=format&fit=crop&w=1800&q=88") center/cover; }
        .hero .container { position:relative; z-index:1; }
        .hero-content { padding:120px 0 90px; max-width:760px; }
        .eyebrow { display:inline-flex; gap:8px; align-items:center; color:#b8eef2; font-size:13px; font-weight:700; letter-spacing:.08em; margin-bottom:20px; }
        .hero h1 { font-size:clamp(2.4rem,5vw,4.5rem); line-height:1.14; letter-spacing:0; margin:0 0 22px; font-weight:900; }
        .hero h1 em { color:#72e0df; font-style:normal; }
        .hero-lead { color:#e0edf5; font-size:18px; max-width:700px; margin-bottom:30px; }
        .hero-actions { display:flex; gap:12px; flex-wrap:wrap; }
        .btn-main,.btn-outline-light { border-radius:10px; padding:12px 21px; font-weight:700; transition:.25s; }
        .btn-main { background:#59cbd0; color:#10283f; border:1px solid #59cbd0; }
        .btn-main:hover { background:#84e1df; transform:translateY(-2px); }
        .btn-outline-light:hover { background:#fff; color:var(--navy); }
        .hero-strip { display:flex; gap:30px; flex-wrap:wrap; padding-top:38px; border-top:1px solid rgba(255,255,255,.24); }
        .metric strong { display:block; font-size:25px; color:#fff; line-height:1.2; }
        .metric span { color:#b9cfdd; font-size:13px; }
        section { padding:84px 0; }
        .section-head { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:34px; }
        .section-head h2 { color:var(--navy); font-size:30px; line-height:1.3; margin:0; font-weight:850; }
        .section-head p { max-width:600px; color:var(--muted); margin:8px 0 0; }
        .section-kicker { color:var(--blue); font-weight:800; font-size:13px; letter-spacing:.1em; text-transform:uppercase; }
        .agenda { background:#fff; border-bottom:1px solid var(--line); }
        .calendar-row { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
        .calendar-item { padding:22px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; transition:.25s; }
        .calendar-item:hover { transform:translateY(-4px); box-shadow:var(--shadow); border-color:#b6d5e4; }
        .date { color:var(--blue); font-size:13px; font-weight:800; }
        .calendar-item h3 { font-size:18px; margin:12px 0 8px; }
        .calendar-item p { color:var(--muted); font-size:14px; margin:0; }
        .feature-band { background:var(--soft); }
        .topic-grid { display:grid; grid-template-columns:1.4fr .8fr .8fr; gap:18px; }
        .topic-card { min-height:230px; overflow:hidden; position:relative; color:#fff; border-radius:var(--radius); background:#1c3b5b; }
        .topic-card img { width:100%; height:100%; object-fit:cover; opacity:.7; transition:.4s; }
        .topic-card:hover img { transform:scale(1.06); opacity:.88; }
        .topic-card:after { content:""; position:absolute; inset:35% 0 0; background:linear-gradient(transparent,rgba(8,22,39,.9)); }
        .topic-copy { position:absolute; z-index:1; left:24px; right:24px; bottom:20px; }
        .topic-copy h3 { margin:0 0 6px; font-size:21px; }
        .topic-copy p { margin:0; color:#dceaf2; font-size:13px; }
        .insight-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
        .insight-card { padding:26px; background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:0 8px 24px rgba(25,55,85,.04); }
        .icon-box { width:42px; height:42px; display:grid; place-items:center; color:var(--blue); background:var(--soft); border-radius:12px; margin-bottom:16px; }
        .insight-card h3 { font-size:19px; margin:0 0 9px; }
        .insight-card p { color:var(--muted); font-size:14px; margin:0; }
        .news-section { background:#fff; }
        .news-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
        .news-card { overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:#fff; transition:.25s; }
        .news-card:hover { transform:translateY(-4px); box-shadow:var(--shadow); }
        .news-card img { width:100%; height:175px; object-fit:cover; }
        .news-body { padding:20px; }
        .news-body h3 { font-size:18px; line-height:1.45; margin:8px 0; }
        .news-body p { color:var(--muted); font-size:14px; margin:0; }
        .news-meta { color:var(--blue); font-size:12px; font-weight:700; }
        .media-row { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
        .media-card { display:flex; gap:18px; align-items:center; padding:20px; background:#fff; border-radius:var(--radius); border:1px solid var(--line); }
        .media-card img { width:132px; height:94px; object-fit:cover; border-radius:12px; }
        .media-card h3 { font-size:17px; margin:0 0 6px; }
        .media-card p { color:var(--muted); font-size:13px; margin:0; }
        .data-section { background:var(--navy); color:#fff; }
        .data-section .section-head h2 { color:#fff; }
        .data-section .section-head p { color:#bfd0dc; }
        .data-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
        .data-box { padding:24px; border:1px solid rgba(255,255,255,.14); border-radius:var(--radius); background:rgba(255,255,255,.07); }
        .data-box strong { display:block; color:#72e0df; font-size:31px; line-height:1.2; }
        .data-box span { color:#c5d6e0; font-size:13px; }
        .data-box p { color:#dce7ed; font-size:13px; margin:15px 0 0; }
        .trust-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
        .trust-item { padding:25px; border-left:3px solid var(--cyan); background:#fff; border-radius:0 14px 14px 0; box-shadow:var(--shadow); }
        .trust-item h3 { font-size:18px; margin:0 0 8px; }
        .trust-item p { color:var(--muted); font-size:14px; margin:0; }
        .subscribe { padding:56px 0; background:#e4f2f5; }
        .subscribe-box { display:flex; justify-content:space-between; align-items:center; gap:25px; }
        .subscribe h2 { margin:0 0 8px; font-size:28px; color:var(--navy); }
        .subscribe p { margin:0; color:var(--muted); }
        .subscribe-form { display:flex; gap:10px; min-width:390px; }
        .subscribe-form input { flex:1; min-width:0; border:1px solid #cbdde6; border-radius:10px; padding:12px 14px; outline:0; }
        .subscribe-form input:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(34,100,168,.13); }
        .faq-section { background:#fff; }
        .accordion-item { border:1px solid var(--line); margin-bottom:12px; border-radius:12px !important; overflow:hidden; }
        .accordion-button { font-weight:700; color:var(--navy); background:#fff; box-shadow:none !important; }
        .accordion-button:not(.collapsed) { color:var(--blue); background:var(--soft); }
        .accordion-body { color:var(--muted); font-size:14px; }
        footer { background:#0d1d31; color:#b9c9d6; padding:58px 0 24px; }
        .footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:35px; }
        footer .brand { color:#fff; margin-bottom:15px; }
        footer h3 { color:#fff; font-size:15px; margin:0 0 15px; }
        footer a { display:block; color:#b9c9d6; font-size:14px; margin:8px 0; }
        footer a:hover { color:#72e0df; }
        .footer-intro { max-width:310px; font-size:14px; }
        .copyright { margin-top:42px; padding-top:20px; border-top:1px solid rgba(255,255,255,.12); font-size:12px; color:#8fa4b4; display:flex; justify-content:space-between; gap:20px; }
        :focus-visible { outline:3px solid rgba(72,185,200,.55); outline-offset:3px; }
        @media (max-width: 991px) {
            .calendar-row,.data-grid { grid-template-columns:repeat(2,1fr); }
            .topic-grid { grid-template-columns:1fr 1fr; }
            .topic-card:first-child { grid-column:1/-1; }
            .insight-grid,.news-grid,.trust-grid { grid-template-columns:repeat(2,1fr); }
            .footer-grid { grid-template-columns:repeat(2,1fr); }
            .subscribe-box { align-items:flex-start; flex-direction:column; }
            .subscribe-form { width:100%; min-width:0; }
        }
        @media (max-width: 767px) {
            section { padding:62px 0; }
            .hero { min-height:600px; }
            .hero-content { padding:92px 0 60px; }
            .hero h1 { font-size:2.55rem; }
            .hero-lead { font-size:16px; }
            .section-head { display:block; }
            .section-head h2 { font-size:26px; }
            .topic-grid,.insight-grid,.news-grid,.media-row,.trust-grid { grid-template-columns:1fr; }
            .topic-card:first-child { grid-column:auto; }
            .data-grid,.calendar-row { grid-template-columns:1fr 1fr; }
            .media-card { align-items:flex-start; }
        }
        @media (max-width: 520px) {
            .brand { font-size:14px; }
            .brand-mark { width:35px; height:35px; }
            .hero h1 { font-size:2.15rem; }
            .hero-strip { gap:18px; }
            .metric strong { font-size:21px; }
            .data-grid,.calendar-row { grid-template-columns:1fr; }
            .subscribe-form { flex-direction:column; }
            .subscribe-form .btn-main { width:100%; }
            .footer-grid { grid-template-columns:1fr; gap:25px; }
            .copyright { display:block; }
            .copyright span { display:block; margin-top:8px; }
        }

/* roulang page: category1 */
:root{--navy:#12253f;--blue:#2264a8;--cyan:#48b9c8;--ink:#172538;--muted:#6c7a8d;--paper:#f5f8fb;--white:#fff;--line:#dfe7ef;--soft:#eaf3f8;--gold:#e7a93b;--radius:18px;--shadow:0 14px 34px rgba(25,55,85,.09)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--paper);font-family:"Noto Sans SC","Microsoft YaHei",Arial,sans-serif;line-height:1.75}
a{color:inherit;text-decoration:none;transition:.25s ease}
img{max-width:100%;display:block}
button,input{font:inherit}
.container{max-width:1180px}
.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.95);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
.navbar{min-height:78px}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;color:var(--navy);letter-spacing:.02em}
.brand-mark{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;color:#fff;background:var(--navy);box-shadow:0 7px 16px rgba(18,37,63,.2)}
.nav-link{color:#566679!important;font-size:14px;font-weight:600;padding:10px 14px!important;border-radius:10px}
.nav-link:hover,.nav-link.active{color:var(--blue)!important;background:var(--soft)}
.nav-cta{color:#fff!important;background:var(--blue)}
.nav-cta:hover{background:var(--navy)}
.hero-category{position:relative;overflow:hidden;background:var(--navy);color:#fff}
.hero-category:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,27,48,.95),rgba(18,54,81,.72),rgba(18,42,67,.35)),url("https://images.unsplash.com/photo-1538485399081-7c897f98d7d4?auto=format&fit=crop&w=1800&q=88") center/cover}
.hero-category .container{position:relative;z-index:1}
.hero-content{padding:100px 0 90px;max-width:790px}
.eyebrow,.section-kicker{color:var(--cyan);font-size:13px;font-weight:800;letter-spacing:.1em}
.eyebrow{display:inline-flex;gap:9px;align-items:center;margin-bottom:18px}
.hero-category h1{font-size:clamp(2.3rem,5vw,4.3rem);line-height:1.15;margin:0 0 20px;font-weight:900}
.hero-category h1 em{color:#72e0df;font-style:normal}
.hero-lead{max-width:700px;color:#dcebf3;font-size:18px;margin:0 0 28px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.btn-main,.btn-outline-light{border-radius:10px;padding:11px 20px;font-weight:700;transition:.25s}
.btn-main{color:#10283f;background:#59cbd0;border:1px solid #59cbd0}
.btn-main:hover{color:#10283f;background:#84e1df;transform:translateY(-2px)}
.btn-outline-light:hover{color:var(--navy);background:#fff}
.answer-strip{padding:24px 0;background:#fff;border-bottom:1px solid var(--line)}
.answer-box{display:flex;align-items:flex-start;gap:16px}
.answer-icon{width:42px;height:42px;display:grid;place-items:center;flex:0 0 auto;color:var(--blue);background:var(--soft);border-radius:12px}
.answer-box strong{display:block;color:var(--navy);font-size:16px}
.answer-box p{margin:3px 0 0;color:var(--muted);font-size:14px}
section{padding:78px 0}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:30px}
.section-head h2{color:var(--navy);font-size:30px;line-height:1.3;margin:0;font-weight:850}
.section-head p{max-width:620px;color:var(--muted);margin:8px 0 0}
.section-link{color:var(--blue);font-weight:700;font-size:14px}
.section-link:hover{color:var(--navy)}
.metric-section{background:#fff}
.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.metric{padding:24px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:0 8px 22px rgba(25,55,85,.04)}
.metric strong{display:block;color:var(--blue);font-size:32px;line-height:1.2}
.metric span{display:block;color:var(--navy);font-weight:700;margin-top:6px}
.metric small{display:block;color:var(--muted);margin-top:8px}
.matrix-section{background:var(--soft)}
.matrix-grid{display:grid;grid-template-columns:1.25fr .9fr .9fr;gap:18px}
.matrix-card{min-height:205px;padding:26px;border:1px solid rgba(34,100,168,.13);border-radius:var(--radius);background:#fff;transition:.25s}
.matrix-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.matrix-card.featured{color:#fff;background:var(--navy)}
.matrix-card.featured h3{color:#fff}
.matrix-card h3{color:var(--navy);font-size:20px;margin:14px 0 9px}
.matrix-card p{color:var(--muted);font-size:14px;margin:0}
.matrix-card.featured p{color:#c8d9e4}
.matrix-icon{width:42px;height:42px;display:grid;place-items:center;color:var(--blue);background:var(--soft);border-radius:12px}
.featured .matrix-icon{color:#123047;background:#72e0df}
.compare-section{background:#fff}
.compare-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:stretch}
.compare-panel{padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow)}
.compare-panel h3{color:var(--navy);font-size:20px;margin:0 0 20px}
.compare-row{display:grid;grid-template-columns:1fr 100px 100px;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);font-size:14px;align-items:center}
.compare-row:last-child{border-bottom:0}
.compare-row strong{color:var(--navy)}
.compare-label{color:var(--muted)}
.score{color:var(--blue);font-weight:800;text-align:right}
.quote-panel{padding:30px;color:#fff;border-radius:var(--radius);background:var(--navy)}
.quote-panel .quote-mark{color:#72e0df;font-size:40px;line-height:1}
.quote-panel p{font-size:19px;line-height:1.7;margin:12px 0 24px}
.quote-panel span{color:#bfd0dc;font-size:13px}
.timeline-section{background:#eef5f8}
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.timeline-item{position:relative;padding:0 22px 0 0}
.timeline-item:not(:last-child):after{content:"";position:absolute;top:19px;left:36px;right:0;height:1px;background:#b9d4df}
.timeline-dot{position:relative;z-index:1;width:38px;height:38px;display:grid;place-items:center;color:#fff;background:var(--blue);border:6px solid #d5edf1;border-radius:50%;font-size:12px;font-weight:800}
.timeline-item h3{font-size:17px;margin:18px 0 7px;color:var(--navy)}
.timeline-item p{color:var(--muted);font-size:14px;margin:0;padding-right:15px}
.topic-section{background:#fff}
.topic-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.topic-card{padding:24px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;transition:.25s}
.topic-card:hover{border-color:#a9cddd;box-shadow:var(--shadow);transform:translateY(-3px)}
.topic-card h3{font-size:18px;color:var(--navy);margin:0 0 10px}
.topic-card p{font-size:14px;color:var(--muted);margin:0}
.topic-tag{display:inline-flex;padding:4px 9px;color:var(--blue);background:var(--soft);border-radius:20px;font-size:12px;font-weight:800;margin-bottom:16px}
.news-section{background:var(--paper)}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.news-card{overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:#fff;transition:.25s}
.news-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.news-card img{width:100%;height:160px;object-fit:cover}
.news-body{padding:19px}
.news-meta{color:var(--blue);font-size:12px;font-weight:800}
.news-body h3{font-size:17px;line-height:1.5;margin:8px 0}
.news-body p{color:var(--muted);font-size:14px;margin:0}
.trust-section{background:#fff}
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.trust-item{padding:25px;border-left:3px solid var(--cyan);background:#fff;border-radius:0 14px 14px 0;box-shadow:var(--shadow)}
.trust-item h3{font-size:18px;margin:0 0 8px;color:var(--navy)}
.trust-item p{color:var(--muted);font-size:14px;margin:0}
.faq-section{background:var(--soft)}
.accordion-item{border:1px solid var(--line)!important;border-radius:12px!important;overflow:hidden;margin-bottom:12px;background:#fff}
.accordion-button{color:var(--navy);font-weight:800;background:#fff;box-shadow:none!important}
.accordion-button:not(.collapsed){color:var(--blue);background:#fff}
.accordion-body{color:var(--muted);font-size:14px}
.closing-section{padding:55px 0;background:var(--navy);color:#fff}
.closing-box{display:flex;align-items:center;justify-content:space-between;gap:24px}
.closing-box h2{font-size:28px;margin:0 0 8px}
.closing-box p{color:#c9d9e4;margin:0}
footer{padding:58px 0 22px;color:#c4d2dc;background:#0d1e34}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px}
footer .brand{color:#fff;margin-bottom:15px}
footer .brand-mark{background:#2264a8}
.footer-intro{max-width:300px;color:#9fb1c0;font-size:14px;margin:0}
footer h3{color:#fff;font-size:15px;margin:4px 0 14px}
footer a:not(.brand){display:block;color:#aabcc9;font-size:14px;margin:8px 0}
footer a:not(.brand):hover{color:#72e0df}
.copyright{display:flex;justify-content:space-between;gap:18px;border-top:1px solid rgba(255,255,255,.13);margin-top:42px;padding-top:20px;color:#8fa4b4;font-size:12px}
@media(max-width:992px){.metric-grid{grid-template-columns:repeat(2,1fr)}.matrix-grid{grid-template-columns:repeat(2,1fr)}.matrix-card.featured{grid-column:span 2}.compare-layout{grid-template-columns:1fr}.topic-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){.hero-content{padding:76px 0 68px}.hero-category h1{font-size:2.6rem}.section-head{display:block}.section-head p{margin-top:12px}.timeline{grid-template-columns:1fr 1fr;gap:28px 0}.timeline-item:not(:last-child):after{display:none}.news-grid{grid-template-columns:1fr}.trust-grid{grid-template-columns:1fr}}
@media(max-width:520px){section{padding:58px 0}.hero-category h1{font-size:2.25rem}.hero-lead{font-size:16px}.metric-grid,.matrix-grid,.topic-grid{grid-template-columns:1fr}.matrix-card.featured{grid-column:auto}.compare-panel{padding:20px}.compare-row{grid-template-columns:1fr 72px 72px;font-size:13px}.timeline{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.copyright{display:block}.copyright span{display:block;margin-top:6px}.navbar{min-height:68px}}
