/* roulang page: index */
:root{
            --blue-950:#102a43;
            --blue-900:#173f67;
            --blue-800:#1f5f91;
            --blue-700:#2878b8;
            --blue-600:#3b91cf;
            --blue-100:#e8f3fb;
            --blue-050:#f4f9fc;
            --ink:#17324d;
            --muted:#6d8296;
            --line:#dbe8f1;
            --white:#ffffff;
            --orange:#f08b52;
            --green:#2e9b79;
            --radius-xl:28px;
            --radius-lg:20px;
            --radius-md:14px;
            --shadow-sm:0 8px 24px rgba(25,70,105,.07);
            --shadow-md:0 18px 48px rgba(25,70,105,.12);
            --ease:all .25s ease;
        }
        *,*::before,*::after{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{
            margin:0;
            color:var(--ink);
            background:var(--blue-050);
            font-family:"PingFang SC","Microsoft YaHei",Arial,sans-serif;
            font-size:15px;
            line-height:1.75;
            padding-bottom:82px;
        }
        a{color:inherit;text-decoration:none;transition:var(--ease)}
        a:hover{color:var(--blue-700)}
        img{max-width:100%;display:block}
        button,input{font:inherit}
        button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid rgba(59,145,207,.3);outline-offset:3px}
        .container{max-width:1180px}
        .site-header{
            position:sticky;
            top:0;
            z-index:1000;
            background:rgba(255,255,255,.94);
            backdrop-filter:blur(16px);
            border-bottom:1px solid rgba(219,232,241,.9);
        }
        .navbar{min-height:76px}
        .brand{
            display:inline-flex;
            align-items:center;
            gap:11px;
            color:var(--blue-950);
            font-weight:800;
            letter-spacing:-.03em;
            font-size:19px;
            white-space:nowrap;
        }
        .brand-mark{
            width:38px;height:38px;border-radius:13px;
            display:grid;place-items:center;
            color:#fff;
            background:linear-gradient(145deg,var(--blue-700),var(--blue-950));
            box-shadow:0 8px 18px rgba(31,95,145,.22);
        }
        .brand-mark::before{
            content:"";
            width:0;height:0;
            border-top:7px solid transparent;
            border-bottom:7px solid transparent;
            border-left:11px solid #fff;
            margin-left:3px;
        }
        .nav-link{
            position:relative;
            color:#647b90!important;
            font-weight:650;
            padding:.55rem .9rem!important;
            border-radius:10px;
        }
        .nav-link:hover{color:var(--blue-800)!important;background:var(--blue-050)}
        .nav-link.active{color:var(--blue-900)!important;background:var(--blue-100)}
        .nav-link.active::after{
            content:"";
            position:absolute;
            left:50%;bottom:3px;
            width:20px;height:3px;
            transform:translateX(-50%);
            border-radius:4px;
            background:var(--blue-700);
        }
        .region-entry{
            display:inline-flex;
            align-items:center;
            gap:8px;
            color:var(--muted);
            font-size:13px;
            border:1px solid var(--line);
            background:#fff;
            border-radius:999px;
            padding:8px 13px;
        }
        .region-dot{width:8px;height:8px;background:var(--green);border-radius:50%;box-shadow:0 0 0 4px #e5f5ef}
        .nav-cta,.btn-primary-custom{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            gap:8px;
            color:#fff!important;
            background:var(--blue-900);
            border:1px solid var(--blue-900);
            border-radius:12px;
            padding:11px 18px;
            font-weight:750;
            box-shadow:0 8px 18px rgba(23,63,103,.15);
        }
        .nav-cta:hover,.btn-primary-custom:hover{background:var(--blue-700);border-color:var(--blue-700);transform:translateY(-2px)}
        .btn-secondary-custom{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            gap:8px;
            color:var(--blue-900)!important;
            background:#fff;
            border:1px solid var(--line);
            border-radius:12px;
            padding:11px 18px;
            font-weight:750;
        }
        .btn-secondary-custom:hover{border-color:var(--blue-600);background:var(--blue-050);transform:translateY(-2px)}
        .status-strip{
            border-top:1px solid #edf4f8;
            background:#fbfdfe;
            color:var(--muted);
            font-size:13px;
        }
        .status-inner{min-height:39px;display:flex;align-items:center;justify-content:space-between;gap:18px}
        .status-item{display:inline-flex;align-items:center;gap:8px}
        .status-item strong{color:var(--blue-800)}
        .hero{
            position:relative;
            overflow:hidden;
            padding:76px 0 70px;
            background:
                radial-gradient(circle at 84% 22%,rgba(59,145,207,.16),transparent 28%),
                linear-gradient(180deg,#fff 0%,#f3f9fd 100%);
        }
        .hero::after{
            content:"";
            position:absolute;
            right:-120px;bottom:-180px;
            width:430px;height:430px;
            border:1px solid rgba(59,145,207,.12);
            border-radius:50%;
            box-shadow:0 0 0 35px rgba(59,145,207,.035),0 0 0 70px rgba(59,145,207,.025);
        }
        .eyebrow{
            display:inline-flex;
            align-items:center;
            gap:8px;
            color:var(--blue-700);
            font-size:13px;
            font-weight:800;
            letter-spacing:.08em;
            text-transform:uppercase;
        }
        .eyebrow::before{content:"";width:24px;height:3px;border-radius:4px;background:var(--orange)}
        h1,h2,h3,h4{color:var(--blue-950);font-weight:800;letter-spacing:-.045em}
        h1{font-size:clamp(2.35rem,5vw,4.35rem);line-height:1.12;margin:18px 0 20px;max-width:670px}
        h2{font-size:clamp(1.8rem,3vw,2.7rem);line-height:1.2}
        h3{font-size:1.2rem;letter-spacing:-.025em}
        .hero-copy{font-size:17px;color:#5f7589;max-width:610px}
        .hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:29px}
        .hero-note{display:flex;gap:24px;flex-wrap:wrap;margin-top:30px;color:var(--muted);font-size:13px}
        .hero-note strong{display:block;color:var(--blue-900);font-size:20px;line-height:1.2}
        .hero-stage{
            position:relative;
            min-height:420px;
            padding:22px;
            border:1px solid #d7e7f1;
            border-radius:var(--radius-xl);
            background:#fff;
            box-shadow:var(--shadow-md);
        }
        .stage-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
        .stage-label{font-size:12px;font-weight:800;color:var(--muted);letter-spacing:.08em}
        .stage-status{font-size:12px;color:var(--green);background:#eaf8f2;border-radius:99px;padding:5px 10px;font-weight:700}
        .cover-panel{
            min-height:190px;
            border-radius:19px;
            padding:22px;
            color:#fff;
            background:
                linear-gradient(135deg,rgba(16,42,67,.35),rgba(16,42,67,.78)),
                repeating-linear-gradient(135deg,rgba(255,255,255,.08) 0 1px,transparent 1px 13px),
                linear-gradient(135deg,#5ca4d5,#173f67 68%,#102a43);
            display:flex;
            flex-direction:column;
            justify-content:space-between;
        }
        .cover-kicker{font-size:12px;opacity:.78;letter-spacing:.1em}
        .cover-title{font-size:25px;font-weight:800;letter-spacing:-.04em}
        .cover-meta{font-size:12px;opacity:.75}
        .timeline{margin:20px 0 14px}
        .timeline-line{height:6px;border-radius:9px;background:#e6eff5;overflow:hidden}
        .timeline-line span{display:block;width:62%;height:100%;background:linear-gradient(90deg,var(--blue-700),var(--orange));border-radius:9px}
        .timeline-time{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin-top:6px}
        .stage-controls{display:flex;align-items:center;justify-content:space-between;gap:12px}
        .control-set{display:flex;gap:8px}
        .control{
            width:36px;height:36px;border-radius:50%;
            border:1px solid var(--line);
            background:#fff;color:var(--blue-800);
            display:grid;place-items:center;
            font-size:13px;
        }
        .control.main{color:#fff;background:var(--blue-900);border-color:var(--blue-900);font-size:16px}
        .queue{margin-top:19px;border-top:1px solid #edf3f7;padding-top:14px}
        .queue-row{display:flex;align-items:center;gap:11px;padding:8px 0}
        .queue-thumb{width:38px;height:30px;border-radius:8px;background:linear-gradient(135deg,#c9e4f3,#668eae);flex:none}
        .queue-row:nth-child(2) .queue-thumb{background:linear-gradient(135deg,#f8d9c6,#bb7d72)}
        .queue-row:nth-child(3) .queue-thumb{background:linear-gradient(135deg,#d8e9dc,#75a58c)}
        .queue-copy{flex:1;min-width:0}
        .queue-copy strong{display:block;font-size:12px;color:var(--blue-950);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
        .queue-copy small{font-size:11px;color:var(--muted)}
        .queue-tag{font-size:10px;color:var(--blue-700);background:var(--blue-100);border-radius:6px;padding:3px 6px}
        .section{padding:92px 0}
        .section-tight{padding:72px 0}
        .section-head{max-width:680px;margin-bottom:38px}
        .section-head p{color:var(--muted);margin:14px 0 0;font-size:16px}
        .section-head.centered{margin-left:auto;margin-right:auto;text-align:center}
        .section-head.centered .eyebrow{justify-content:center}
        .feature-grid{display:grid;grid-template-columns:1.35fr .85fr .85fr;gap:18px;align-items:stretch}
        .feature-card{
            position:relative;
            min-height:245px;
            padding:28px;
            background:#fff;
            border:1px solid var(--line);
            border-radius:var(--radius-lg);
            box-shadow:var(--shadow-sm);
            overflow:hidden;
            transition:var(--ease);
        }
        .feature-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:#bdd9ea}
        .feature-card.primary{background:var(--blue-900);color:#fff;padding:34px}
        .feature-card.primary h3,.feature-card.primary p{color:#fff}
        .feature-card.primary p{opacity:.78}
        .feature-card::after{
            content:"";
            position:absolute;
            right:-42px;bottom:-45px;
            width:150px;height:150px;
            border:1px solid rgba(59,145,207,.16);
            border-radius:50%;
        }
        .feature-card.primary::after{border-color:rgba(255,255,255,.16)}
        .feature-number{font-size:12px;color:var(--orange);font-weight:850;letter-spacing:.12em}
        .feature-card h3{margin:22px 0 11px}
        .feature-card p{color:var(--muted);font-size:14px;margin:0;max-width:290px}
        .feature-icon{
            width:44px;height:44px;border-radius:14px;
            display:grid;place-items:center;
            color:var(--blue-700);background:var(--blue-100);
            font-weight:800;font-size:17px;
        }
        .feature-card.primary .feature-icon{color:#fff;background:rgba(255,255,255,.14)}
        .entry-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:30px;align-items:center}
        .entry-panel{
            padding:30px;
            background:#fff;
            border:1px solid var(--line);
            border-radius:var(--radius-xl);
            box-shadow:var(--shadow-sm);
        }
        .entry-list{display:grid;gap:10px;margin-top:22px}
        .entry-link{
            display:flex;align-items:center;justify-content:space-between;
            padding:14px 15px;
            border:1px solid var(--line);
            border-radius:13px;
            color:var(--blue-900);
            font-weight:750;
            background:#fff;
        }
        .entry-link span:last-child{color:var(--blue-600);font-size:18px}
        .entry-link:hover{border-color:var(--blue-600);background:var(--blue-050);transform:translateX(3px)}
        .showcase{
            min-height:365px;
            padding:24px;
            border-radius:var(--radius-xl);
            background:#eef6fb;
            border:1px solid #d8e9f3;
        }
        .showcase-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:18px}
        .toolbar-pill{border:1px solid #cfe2ee;border-radius:99px;background:#fff;padding:7px 12px;color:var(--muted);font-size:12px}
        .showcase-body{display:grid;grid-template-columns:150px 1fr 170px;gap:15px}
        .filter-box,.preview-box,.info-box{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px}
        .filter-box h4,.info-box h4{font-size:13px;margin:0 0 12px}
        .filter-option{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid #eef4f7;color:var(--muted);font-size:12px}
        .filter-option:last-child{border-bottom:0}
        .filter-option.active{color:var(--blue-800);font-weight:800}
        .filter-option i{width:7px;height:7px;border-radius:50%;background:#c6d7e3}
        .filter-option.active i{background:var(--orange)}
        .preview-box{padding:18px}
        .preview-cover{
            height:145px;border-radius:13px;
            background:
                linear-gradient(135deg,rgba(16,42,67,.18),rgba(16,42,67,.76)),
                linear-gradient(135deg,#d5eaf5 0 30%,#75a8bf 30% 62%,#243f5a 62%);
            position:relative;overflow:hidden;
        }
        .preview-cover::before,.preview-cover::after{
            content:"";position:absolute;border:1px solid rgba(255,255,255,.3);border-radius:50%;
        }
        .preview-cover::before{width:180px;height:180px;right:-35px;top:-45px}
        .preview-cover::after{width:90px;height:90px;left:25px;bottom:-45px}
        .preview-content h3{font-size:16px;margin:15px 0 4px}
        .preview-content p{font-size:12px;color:var(--muted);margin:0}
        .tag-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:11px}
        .tag{display:inline-flex;align-items:center;padding:5px 9px;border-radius:8px;background:var(--blue-100);color:var(--blue-800);font-size:11px;font-weight:700}
        .info-box{display:flex;flex-direction:column;justify-content:space-between}
        .info-stat{padding:11px 0;border-bottom:1px solid #eef4f7}
        .info-stat:last-of-type{border-bottom:0}
        .info-stat small{display:block;color:var(--muted);font-size:11px}
        .info-stat strong{display:block;color:var(--blue-900);font-size:14px;margin-top:2px}
        .mini-action{display:block;text-align:center;background:var(--blue-900);color:#fff;border-radius:10px;padding:9px;font-size:12px;font-weight:750}
        .milestone-wrap{display:grid;grid-template-columns:1fr 1fr;gap:20px}
        .milestone-card{
            background:var(--blue-950);
            color:#fff;
            border-radius:var(--radius-xl);
            padding:33px;
            position:relative;
            overflow:hidden;
        }
        .milestone-card::before{content:"";position:absolute;width:260px;height:260px;border:1px solid rgba(255,255,255,.1);border-radius:50%;right:-90px;top:-90px}
        .milestone-card h3{color:#fff;font-size:25px;margin:0 0 12px}
        .milestone-card p{color:rgba(255,255,255,.7);font-size:14px;max-width:420px}
        .milestone-line{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:28px}
        .milestone-step{border-top:2px solid rgba(255,255,255,.22);padding-top:12px}
        .milestone-step strong{display:block;font-size:20px}
        .milestone-step span{font-size:11px;color:rgba(255,255,255,.6)}
        .notice-card{padding:28px;background:#fff;border:1px solid var(--line);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm)}
        .notice-row{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid #edf3f7}
        .notice-row:last-child{border-bottom:0;padding-bottom:0}
        .notice-date{width:52px;height:52px;border-radius:13px;background:var(--blue-100);color:var(--blue-800);display:grid;place-items:center;text-align:center;font-size:11px;font-weight:800;line-height:1.2;flex:none}
        .notice-row h4{font-size:15px;margin:0 0 4px;letter-spacing:-.02em}
        .notice-row p{font-size:13px;color:var(--muted);margin:0}
        .trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
        .trust-item{padding:23px 20px;background:#fff;border:1px solid var(--line);border-radius:16px}
        .trust-item strong{display:block;color:var(--blue-900);font-size:23px;margin-bottom:4px}
        .trust-item span{color:var(--muted);font-size:12px}
        .trust-item .trust-icon{color:var(--green);font-size:18px;margin-bottom:12px}
        .faq-wrap{max-width:850px;margin:auto}
        .accordion-item{border:1px solid var(--line)!important;border-radius:14px!important;margin-bottom:10px;overflow:hidden;background:#fff}
        .accordion-button{font-weight:750;color:var(--blue-950);background:#fff;box-shadow:none!important;padding:18px 20px}
        .accordion-button:not(.collapsed){color:var(--blue-800);background:var(--blue-050)}
        .accordion-body{color:var(--muted);font-size:14px;line-height:1.8;padding:0 20px 20px}
        .cta-section{padding:70px 0 100px}
        .cta-box{
            border-radius:var(--radius-xl);
            padding:42px 48px;
            background:linear-gradient(110deg,#e3f2fb,#fff);
            border:1px solid #cfe4f0;
            display:flex;align-items:center;justify-content:space-between;gap:30px;
        }
        .cta-box h2{margin:0 0 10px;font-size:31px}
        .cta-box p{margin:0;color:var(--muted);max-width:610px}
        .cta-actions{display:flex;gap:10px;flex-wrap:wrap;flex:none}
        .site-footer{background:#102a43;color:rgba(255,255,255,.68);padding:48px 0 30px}
        .footer-brand{color:#fff;font-weight:800;font-size:18px;display:inline-flex;align-items:center;gap:10px}
        .footer-brand .brand-mark{width:32px;height:32px;border-radius:10px}
        .footer-copy{font-size:13px;max-width:360px;margin:18px 0 0;line-height:1.8}
        .footer-heading{font-size:13px;color:#fff;font-weight:800;margin-bottom:14px}
        .footer-link{display:block;color:rgba(255,255,255,.62);font-size:13px;margin-bottom:8px}
        .footer-link:hover{color:#fff}
        .footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:34px;padding-top:18px;font-size:12px;display:flex;justify-content:space-between;gap:15px}
        .fixed-cta{
            position:fixed;
            left:0;right:0;bottom:0;
            z-index:990;
            background:rgba(16,42,67,.96);
            border-top:1px solid rgba(255,255,255,.1);
            box-shadow:0 -8px 30px rgba(16,42,67,.12);
        }
        .fixed-inner{min-height:70px;display:flex;align-items:center;justify-content:space-between;gap:18px}
        .fixed-copy{color:#fff;font-weight:750}
        .fixed-copy small{display:block;color:rgba(255,255,255,.62);font-weight:400;font-size:12px}
        .fixed-cta .btn-primary-custom{background:var(--orange);border-color:var(--orange);box-shadow:none}
        .fixed-cta .btn-primary-custom:hover{background:#dd7440;border-color:#dd7440}
        .modal-content{border:0;border-radius:22px;box-shadow:var(--shadow-md)}
        .age-modal-icon{width:52px;height:52px;border-radius:16px;background:var(--blue-100);color:var(--blue-800);display:grid;place-items:center;font-weight:900;font-size:20px}
        .modal-title{color:var(--blue-950);font-weight:800}
        .modal-body p{color:var(--muted);font-size:14px}
        @media (max-width:991px){
            .region-entry{margin:10px 0}
            .hero{padding:58px 0}
            .feature-grid{grid-template-columns:1fr 1fr}
            .feature-card.primary{grid-column:span 2}
            .entry-layout{grid-template-columns:1fr}
            .showcase-body{grid-template-columns:130px 1fr}
            .info-box{grid-column:span 2;display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
            .info-box h4{grid-column:1/-1;margin-bottom:-5px}
            .info-box .mini-action{grid-column:1/-1}
            .trust-grid{grid-template-columns:repeat(2,1fr)}
        }
        @media (max-width:767px){
            body{padding-bottom:88px}
            .navbar{min-height:68px}
            .brand{font-size:16px}
            .status-inner{align-items:flex-start;flex-direction:column;gap:2px;padding:9px 0}
            h1{font-size:2.45rem}
            .hero-stage{margin-top:28px;min-height:0;padding:17px}
            .section{padding:64px 0}
            .section-tight{padding:54px 0}
            .feature-grid{grid-template-columns:1fr}
            .feature-card.primary{grid-column:auto}
            .feature-card{min-height:210px}
            .showcase{padding:14px}
            .showcase-toolbar{align-items:flex-start;flex-direction:column}
            .showcase-body{grid-template-columns:1fr}
            .filter-box{display:flex;gap:10px;overflow:auto;padding:12px}
            .filter-box h4{display:none}
            .filter-option{white-space:nowrap;border:1px solid var(--line);padding:7px 10px;border-radius:8px}
            .info-box{grid-column:auto;display:block}
            .info-box h4{margin-bottom:12px}
            .info-stat{display:flex;justify-content:space-between;align-items:center}
            .milestone-wrap{grid-template-columns:1fr}
            .trust-grid{grid-template-columns:1fr 1fr}
            .cta-box{padding:30px 24px;display:block}
            .cta-box h2{font-size:26px}
            .cta-actions{margin-top:22px}
            .footer-bottom{display:block}
            .footer-bottom span{display:block;margin-top:8px}
            .fixed-inner{min-height:78px}
            .fixed-copy{font-size:13px;line-height:1.35}
            .fixed-copy small{font-size:11px;margin-top:4px}
            .fixed-cta .btn-primary-custom{padding:10px 13px;white-space:nowrap;font-size:13px}
        }
        @media (max-width:520px){
            .hero-actions .btn-primary-custom,.hero-actions .btn-secondary-custom{width:100%}
            .hero-note{gap:16px}
            .hero-note strong{font-size:17px}
            .trust-grid{grid-template-columns:1fr}
            .milestone-line{grid-template-columns:1fr}
            .milestone-step{border-top:0;border-left:2px solid rgba(255,255,255,.22);padding:0 0 0 12px}
            .footer-col{margin-top:24px}
        }

/* roulang page: category2 */
:root{
 --blue-950:#102a43;
 --blue-900:#173f67;
 --blue-800:#1f5f91;
 --blue-700:#2878b8;
 --blue-600:#3b91cf;
 --blue-100:#e8f3fb;
 --blue-050:#f4f9fc;
 --ink:#17324d;
 --muted:#6d8296;
 --line:#dbe8f1;
 --white:#fff;
 --orange:#f08b52;
 --green:#2e9b79;
 --red:#c85d5d;
 --radius-xl:28px;
 --radius-lg:20px;
 --radius-md:14px;
 --shadow-sm:0 8px 24px rgba(25,70,105,.07);
 --shadow-md:0 18px 48px rgba(25,70,105,.12);
 --ease:all .25s ease;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
 margin:0;
 padding-bottom:82px;
 color:var(--ink);
 background:var(--blue-050);
 font-family:"PingFang SC","Microsoft YaHei",Arial,sans-serif;
 font-size:15px;
 line-height:1.75;
}
a{color:inherit;text-decoration:none;transition:var(--ease)}
a:hover{color:var(--blue-700)}
img{max-width:100%;display:block}
button,input{font:inherit}
button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid rgba(59,145,207,.3);outline-offset:3px}
.container{max-width:1180px}
.site-header{
 position:sticky;
 top:0;
 z-index:1000;
 background:rgba(255,255,255,.95);
 backdrop-filter:blur(16px);
 border-bottom:1px solid rgba(219,232,241,.9);
}
.navbar{min-height:76px}
.brand,.footer-brand{
 display:inline-flex;
 align-items:center;
 gap:11px;
 color:var(--blue-950);
 font-weight:800;
 letter-spacing:-.03em;
 font-size:19px;
 white-space:nowrap;
}
.brand-mark{
 width:38px;height:38px;border-radius:13px;
 display:grid;place-items:center;
 color:#fff;
 background:linear-gradient(145deg,var(--blue-700),var(--blue-950));
 box-shadow:0 8px 18px rgba(31,95,145,.22);
}
.brand-mark:before{
 content:"";
 width:0;height:0;
 border-top:7px solid transparent;
 border-bottom:7px solid transparent;
 border-left:11px solid #fff;
 margin-left:3px;
}
.nav-link{
 position:relative;
 color:#647b90!important;
 font-weight:650;
 padding:.55rem .9rem!important;
 border-radius:10px;
}
.nav-link:hover{color:var(--blue-800)!important;background:var(--blue-050)}
.nav-link.active{color:var(--blue-900)!important;background:var(--blue-100)}
.nav-link.active:after{
 content:"";
 position:absolute;
 left:50%;bottom:3px;
 width:20px;height:3px;
 transform:translateX(-50%);
 border-radius:4px;
 background:var(--blue-700);
}
.nav-cta,.btn-primary-custom{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 gap:8px;
 color:#fff!important;
 background:var(--blue-900);
 border:1px solid var(--blue-900);
 border-radius:12px;
 padding:11px 18px;
 font-weight:750;
 box-shadow:0 8px 18px rgba(23,63,103,.15);
 transition:var(--ease);
}
.nav-cta:hover,.btn-primary-custom:hover{background:var(--blue-700);border-color:var(--blue-700);transform:translateY(-2px)}
.btn-secondary-custom{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 gap:8px;
 color:var(--blue-900)!important;
 background:#fff;
 border:1px solid var(--line);
 border-radius:12px;
 padding:11px 18px;
 font-weight:750;
 transition:var(--ease);
}
.btn-secondary-custom:hover{border-color:var(--blue-600);background:var(--blue-050);transform:translateY(-2px)}
.region-entry{
 display:inline-flex;
 align-items:center;
 gap:7px;
 color:var(--muted);
 font-size:13px;
 font-weight:700;
 padding:9px 10px;
 border-radius:10px;
}
.region-entry:hover{background:var(--blue-050);color:var(--blue-800)}
.region-dot{
 width:8px;height:8px;border-radius:50%;
 background:var(--green);
 display:inline-block;
 box-shadow:0 0 0 4px rgba(46,155,121,.12);
}
.status-strip{background:#f8fbfd;border-top:1px solid #edf4f8}
.status-inner{
 min-height:39px;
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:18px;
 flex-wrap:wrap;
 color:var(--muted);
 font-size:12px;
}
.status-item{display:inline-flex;align-items:center;gap:8px}
.status-item strong{color:var(--blue-800)}
.hero{
 position:relative;
 overflow:hidden;
 padding:78px 0 86px;
 color:#fff;
 background:
 linear-gradient(100deg,rgba(10,30,53,.96),rgba(16,55,89,.88)),
 radial-gradient(circle at 78% 25%,#438cc0,transparent 32%),
 #102a43;
}
.hero:before{
 content:"";
 position:absolute;
 inset:0;
 opacity:.18;
 background-image:linear-gradient(120deg,transparent 45%,rgba(255,255,255,.3) 46%,transparent 47%);
 background-size:28px 28px;
}
.hero .container{position:relative;z-index:1}
.eyebrow{
 display:inline-flex;
 align-items:center;
 gap:8px;
 color:#a9d6ef;
 font-size:13px;
 font-weight:800;
 letter-spacing:.08em;
}
.eyebrow:before{content:"";width:24px;height:3px;border-radius:4px;background:var(--orange)}
.hero h1{
 max-width:680px;
 margin:18px 0 18px;
 font-size:clamp(38px,5vw,66px);
 line-height:1.12;
 letter-spacing:-.055em;
 font-weight:850;
}
.hero-copy{max-width:610px;color:#d6e6f1;font-size:17px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.hero .btn-primary-custom{background:#fff;border-color:#fff;color:var(--blue-950)!important}
.hero .btn-primary-custom:hover{background:#dceff9;border-color:#dceff9}
.hero .btn-secondary-custom{background:transparent;border-color:rgba(255,255,255,.35);color:#fff!important}
.hero .btn-secondary-custom:hover{background:rgba(255,255,255,.1);border-color:#fff}
.poster{
 min-height:430px;
 padding:22px;
 border:1px solid rgba(255,255,255,.2);
 border-radius:var(--radius-xl);
 background:linear-gradient(145deg,rgba(255,255,255,.17),rgba(255,255,255,.05));
 box-shadow:0 24px 55px rgba(0,0,0,.26);
 transform:rotate(1.3deg);
}
.poster-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;color:#c6dce9;font-size:12px;font-weight:750}
.hot-badge{padding:6px 10px;border-radius:99px;color:#fff;background:rgba(240,139,82,.9)}
.poster-art{
 height:220px;
 border-radius:18px;
 display:flex;
 align-items:flex-end;
 padding:20px;
 overflow:hidden;
 position:relative;
 background:
 linear-gradient(155deg,rgba(24,103,150,.18),rgba(8,26,49,.95)),
 radial-gradient(circle at 68% 25%,#76c4e8,transparent 20%),
 linear-gradient(135deg,#315c82,#0e2039);
}
.poster-art:after{
 content:"";
 position:absolute;
 width:240px;height:240px;
 right:-50px;top:-70px;
 border:1px solid rgba(255,255,255,.28);
 border-radius:50%;
 box-shadow:0 0 0 28px rgba(255,255,255,.05),0 0 0 58px rgba(255,255,255,.04);
}
.poster-art strong{position:relative;z-index:1;font-size:24px;letter-spacing:-.04em}
.poster-meta{display:flex;justify-content:space-between;margin:18px 0 10px;color:#c6dce9;font-size:12px}
.progress{height:5px;background:rgba(255,255,255,.18);border-radius:99px;overflow:hidden}
.progress span{display:block;width:68%;height:100%;background:#8ed1ed;border-radius:inherit}
.poster-controls{display:flex;justify-content:space-between;align-items:center;margin-top:20px;color:#c6dce9}
.control-main{
 width:48px;height:48px;border:0;border-radius:50%;
 display:grid;place-items:center;
 color:var(--blue-950);background:#fff;
 transition:var(--ease);
}
.control-main:hover{transform:scale(1.08);background:#dff2fc}
.section{padding:86px 0}
.section-soft{background:#fff}
.section-kicker{color:var(--blue-700);font-size:13px;font-weight:800;letter-spacing:.08em}
.section-title{margin:9px 0 12px;font-size:clamp(28px,3.5vw,42px);line-height:1.2;letter-spacing:-.045em;font-weight:850}
.section-intro{max-width:650px;color:var(--muted);font-size:16px}
.feature-grid{display:grid;grid-template-columns:1.35fr .9fr .9fr;gap:18px;margin-top:34px}
.feature-card,.safe-card,.filter-panel,.faq-item,.trust-card{
 background:#fff;
 border:1px solid var(--line);
 border-radius:var(--radius-lg);
 box-shadow:var(--shadow-sm);
 transition:var(--ease);
}
.feature-card:hover,.safe-card:hover,.trust-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)}
.feature-card{min-height:225px;padding:27px;position:relative;overflow:hidden}
.feature-card.main{background:var(--blue-900);color:#fff}
.feature-card.main p{color:#cfe2ee}
.feature-number{font-size:12px;font-weight:800;color:var(--orange);letter-spacing:.1em}
.feature-card h3{margin:27px 0 9px;font-size:23px;letter-spacing:-.035em}
.feature-card p,.safe-card p{margin:0;color:var(--muted)}
.safe-card{padding:25px}
.safe-icon{
 width:44px;height:44px;border-radius:14px;
 display:grid;place-items:center;
 color:var(--blue-800);background:var(--blue-100);
 font-size:20px;font-weight:800;
}
.safe-card h3{margin:22px 0 8px;font-size:19px}
.demo-wrap{
 display:grid;
 grid-template-columns:220px 1fr 220px;
 gap:0;
 margin-top:35px;
 overflow:hidden;
 background:#fff;
 border:1px solid var(--line);
 border-radius:var(--radius-xl);
 box-shadow:var(--shadow-md);
}
.filter-panel{border:0;border-radius:0;box-shadow:none;padding:24px;background:#f7fbfd}
.filter-title{font-size:12px;color:var(--muted);font-weight:800;letter-spacing:.08em;margin-bottom:16px}
.filter-item{
 display:flex;justify-content:space-between;align-items:center;
 padding:11px 12px;margin:5px 0;border-radius:10px;
 color:var(--muted);font-weight:650;
}
.filter-item.active{color:var(--blue-900);background:#dff0fa}
.filter-count{font-size:11px;color:var(--blue-600)}
.preview{padding:29px 30px;border-left:1px solid var(--line);border-right:1px solid var(--line)}
.preview-head{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:22px}
.preview-title{font-size:23px;font-weight:800;letter-spacing:-.04em}
.tag-row{display:flex;gap:8px;flex-wrap:wrap}
.tag{display:inline-flex;padding:5px 10px;border-radius:99px;color:var(--blue-800);background:var(--blue-100);font-size:12px;font-weight:750}
.content-row{
 display:flex;align-items:center;gap:15px;
 padding:15px 0;border-bottom:1px solid #edf3f7;
}
.content-thumb{
 width:72px;height:55px;border-radius:11px;flex:none;
 background:linear-gradient(135deg,#78b7d5,#173f67 75%);
 position:relative;overflow:hidden;
}
.content-thumb:after{content:"";position:absolute;inset:15px 24px;border:2px solid rgba(255,255,255,.65);border-radius:50%}
.content-info{min-width:0;flex:1}
.content-info strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.content-info small{color:var(--muted)}
.content-state{font-size:12px;color:var(--green);font-weight:750}
.control-panel{padding:24px;background:#fbfdfe}
.control-panel h3{font-size:17px;margin:0 0 18px}
.control-line{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line);font-size:13px}
.control-line span{color:var(--muted)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:25px}
.step{padding:17px;border:1px solid var(--line);border-radius:var(--radius-md);background:#fff}
.step b{display:block;color:var(--blue-700);font-size:12px;margin-bottom:6px}
.step strong{font-size:15px}
.step p{margin:5px 0 0;color:var(--muted);font-size:13px;line-height:1.55}
.trust-section{padding:68px 0;background:#edf6fb}
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}
.trust-card{padding:24px}
.trust-value{font-size:29px;font-weight:850;color:var(--blue-900);line-height:1.15}
.trust-card p{margin:9px 0 0;color:var(--muted);font-size:13px}
.faq-list{max-width:820px;margin-top:28px}
.faq-item{padding:20px 23px;margin-bottom:12px}
.faq-item summary{cursor:pointer;font-weight:800;color:var(--blue-900)}
.faq-item p{color:var(--muted);margin:13px 0 0;padding-top:12px;border-top:1px solid var(--line)}
.cta-section{padding:70px 0}
.cta-box{
 padding:42px 48px;
 border-radius:var(--radius-xl);
 display:flex;align-items:center;justify-content:space-between;gap:24px;
 color:#fff;background:var(--blue-900);
 box-shadow:var(--shadow-md);
}
.cta-box h2{margin:0 0 8px;font-size:32px;letter-spacing:-.045em}
.cta-box p{margin:0;color:#c9dce9}
.cta-box .btn-primary-custom{background:#fff;color:var(--blue-950)!important;border-color:#fff;white-space:nowrap}
.site-footer{padding:52px 0 25px;background:#102a43;color:#d5e4ed}
.footer-brand{color:#fff;margin-bottom:15px}
.footer-copy{max-width:520px;margin:0;color:#a9c0ce}
.footer-heading{margin-bottom:13px;color:#fff;font-weight:800}
.footer-col{display:flex;flex-direction:column;gap:7px}
.footer-link{color:#a9c0ce;font-size:14px}
.footer-link:hover{color:#fff}
.footer-bottom{
 display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;
 margin-top:38px;padding-top:20px;border-top:1px solid rgba(255,255,255,.13);
 color:#91aebb;font-size:12px;
}
.fixed-cta{
 position:fixed;z-index:990;bottom:0;left:0;right:0;
 padding:12px 0;background:rgba(255,255,255,.95);
 backdrop-filter:blur(12px);border-top:1px solid var(--line);
}
.fixed-inner{display:flex;align-items:center;justify-content:space-between;gap:16px}
.fixed-copy{color:var(--muted);font-size:13px}
.fixed-copy strong{color:var(--blue-900)}
.modal-content{border:0;border-radius:var(--radius-lg);box-shadow:var(--shadow-md)}
.modal-header{border-bottom:1px solid var(--line)}
@media(max-width:1024px){
 .demo-wrap{grid-template-columns:190px 1fr}
 .control-panel{grid-column:1/-1;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
 .control-panel h3{grid-column:1/-1;margin-bottom:0}
}
@media(max-width:768px){
 .navbar{min-height:68px}
 .brand{font-size:17px}
 .region-entry{margin-top:12px}
 .nav-cta{margin-top:12px}
 .hero{padding:57px 0 60px}
 .poster{margin-top:28px;transform:none;min-height:390px}
 .feature-grid,.trust-grid{grid-template-columns:1fr}
 .feature-card{min-height:0}
 .demo-wrap{grid-template-columns:1fr}
 .filter-panel{display:flex;gap:8px;overflow:auto;padding:15px}
 .filter-title{display:none}
 .filter-item{margin:0;white-space:nowrap}
 .preview{border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
 .control-panel{grid-template-columns:1fr 1fr}
 .steps{grid-template-columns:1fr 1fr}
 .cta-box{padding:32px 25px;display:block}
 .cta-box .btn-primary-custom{margin-top:22px}
}
@media(max-width:520px){
 body{font-size:14px}
 .hero h1{font-size:38px}
 .hero-copy{font-size:15px}
 .hero-actions a{width:100%}
 .poster{padding:16px}
 .poster-art{height:190px}
 .section{padding:62px 0}
 .preview{padding:23px 18px}
 .preview-head{display:block}
 .preview-head .tag-row{margin-top:12px}
 .control-panel{display:block}
 .control-line{padding:9px 0}
 .steps{grid-template-columns:1fr}
 .fixed-copy{display:none}
 .fixed-inner{justify-content:center}
 .fixed-inner .btn-primary-custom{width:100%}
 .footer-bottom{display:block}
 .footer-bottom span{display:block;margin-top:5px}
}

/* roulang page: category1 */
:root{
      --blue-950:#102a43;
      --blue-900:#173f67;
      --blue-800:#1f5f91;
      --blue-700:#2878b8;
      --blue-600:#3b91cf;
      --blue-100:#e8f3fb;
      --blue-050:#f4f9fc;
      --ink:#17324d;
      --muted:#6d8296;
      --line:#dbe8f1;
      --white:#fff;
      --orange:#f08b52;
      --green:#2e9b79;
      --red:#c85b63;
      --radius-xl:28px;
      --radius-lg:20px;
      --radius-md:14px;
      --shadow-sm:0 8px 24px rgba(25,70,105,.07);
      --shadow-md:0 18px 48px rgba(25,70,105,.12);
      --ease:all .25s ease;
    }
    *,*::before,*::after{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      padding-bottom:82px;
      color:var(--ink);
      background:var(--blue-050);
      font-family:"PingFang SC","Microsoft YaHei",Arial,sans-serif;
      font-size:15px;
      line-height:1.75;
    }
    a{color:inherit;text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--blue-700)}
    img{display:block;max-width:100%}
    button,input{font:inherit}
    button:focus-visible,a:focus-visible,input:focus-visible{
      outline:3px solid rgba(59,145,207,.3);
      outline-offset:3px;
    }
    .container{max-width:1180px}
    .site-header{
      position:sticky;
      top:0;
      z-index:1000;
      background:rgba(255,255,255,.95);
      backdrop-filter:blur(16px);
      border-bottom:1px solid rgba(219,232,241,.9);
    }
    .navbar{min-height:76px}
    .brand,.footer-brand{
      display:inline-flex;
      align-items:center;
      gap:11px;
      color:var(--blue-950);
      font-weight:800;
      letter-spacing:-.03em;
      font-size:19px;
      white-space:nowrap;
    }
    .brand:hover,.footer-brand:hover{color:var(--blue-800)}
    .brand-mark{
      width:38px;
      height:38px;
      display:grid;
      place-items:center;
      border-radius:13px;
      background:linear-gradient(145deg,var(--blue-700),var(--blue-950));
      box-shadow:0 8px 18px rgba(31,95,145,.22);
    }
    .brand-mark::before{
      content:"";
      width:0;
      height:0;
      margin-left:3px;
      border-top:7px solid transparent;
      border-bottom:7px solid transparent;
      border-left:11px solid #fff;
    }
    .nav-link{
      position:relative;
      padding:.55rem .9rem!important;
      border-radius:10px;
      color:#647b90!important;
      font-weight:650;
    }
    .nav-link:hover{color:var(--blue-800)!important;background:var(--blue-050)}
    .nav-link.active{color:var(--blue-900)!important;background:var(--blue-100)}
    .nav-link.active::after{
      content:"";
      position:absolute;
      left:50%;
      bottom:3px;
      width:20px;
      height:3px;
      transform:translateX(-50%);
      border-radius:4px;
      background:var(--blue-700);
    }
    .region-entry{
      display:inline-flex;
      align-items:center;
      gap:7px;
      padding:9px 11px;
      border:1px solid var(--line);
      border-radius:10px;
      color:var(--muted);
      font-size:13px;
      font-weight:650;
      background:#fff;
    }
    .region-entry:hover{border-color:var(--blue-600);background:var(--blue-050)}
    .region-dot{
      width:8px;
      height:8px;
      display:inline-block;
      border-radius:50%;
      background:var(--green);
      box-shadow:0 0 0 4px rgba(46,155,121,.12);
    }
    .nav-cta,.btn-primary-custom{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:8px;
      padding:11px 18px;
      color:#fff!important;
      background:var(--blue-900);
      border:1px solid var(--blue-900);
      border-radius:12px;
      font-weight:750;
      box-shadow:0 8px 18px rgba(23,63,103,.15);
      transition:var(--ease);
    }
    .nav-cta:hover,.btn-primary-custom:hover{
      color:#fff!important;
      background:var(--blue-700);
      border-color:var(--blue-700);
      transform:translateY(-2px);
    }
    .btn-secondary-custom{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:8px;
      padding:11px 18px;
      color:var(--blue-900)!important;
      background:#fff;
      border:1px solid var(--line);
      border-radius:12px;
      font-weight:750;
      transition:var(--ease);
    }
    .btn-secondary-custom:hover{
      border-color:var(--blue-600);
      background:var(--blue-050);
      transform:translateY(-2px);
    }
    .status-strip{
      border-top:1px solid #edf4f8;
      background:#fbfdfe;
    }
    .status-inner{
      min-height:38px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:18px;
      color:var(--muted);
      font-size:12px;
    }
    .status-item{display:inline-flex;align-items:center;gap:8px}
    .status-item strong{color:var(--blue-800)}
    .hero{
      position:relative;
      overflow:hidden;
      padding:70px 0 66px;
      background:
        radial-gradient(circle at 84% 22%,rgba(59,145,207,.16),transparent 28%),
        linear-gradient(180deg,#fff 0%,#f3f9fd 100%);
    }
    .hero::after{
      content:"";
      position:absolute;
      right:-130px;
      bottom:-190px;
      width:440px;
      height:440px;
      border:1px solid rgba(59,145,207,.12);
      border-radius:50%;
      box-shadow:0 0 0 35px rgba(59,145,207,.035),0 0 0 70px rgba(59,145,207,.025);
    }
    .hero-content{position:relative;z-index:1}
    .eyebrow{
      display:inline-flex;
      align-items:center;
      gap:8px;
      color:var(--blue-700);
      font-size:13px;
      font-weight:800;
      letter-spacing:.08em;
    }
    .eyebrow::before{
      content:"";
      width:24px;
      height:3px;
      border-radius:4px;
      background:var(--orange);
    }
    h1,h2,h3{color:var(--blue-950);font-weight:800;letter-spacing:-.045em}
    h1{max-width:650px;margin:18px 0 18px;font-size:clamp(2.35rem,5vw,4.55rem);line-height:1.08}
    h2{font-size:clamp(1.75rem,3vw,2.55rem);line-height:1.2}
    .hero-copy{max-width:620px;color:#5f7589;font-size:17px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
    .hero-note{display:flex;gap:24px;flex-wrap:wrap;margin-top:28px;color:var(--muted);font-size:13px}
    .hero-note strong{display:block;color:var(--blue-900);font-size:19px;line-height:1.2}
    .hero-stage{
      position:relative;
      min-height:405px;
      padding:22px;
      border:1px solid #d7e7f1;
      border-radius:var(--radius-xl);
      background:#fff;
      box-shadow:var(--shadow-md);
    }
    .stage-top,.stage-controls{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:14px;
    }
    .stage-top{margin-bottom:18px}
    .stage-label{
      color:var(--muted);
      font-size:12px;
      font-weight:800;
      letter-spacing:.08em;
    }
    .stage-status{
      padding:5px 10px;
      border-radius:99px;
      color:var(--green);
      background:#eaf8f2;
      font-size:12px;
      font-weight:700;
    }
    .visual-cover{
      position:relative;
      height:168px;
      overflow:hidden;
      padding:22px;
      border-radius:18px;
      color:#fff;
      background:
        linear-gradient(135deg,rgba(16,42,67,.94),rgba(40,120,184,.8)),
        repeating-linear-gradient(135deg,transparent 0 16px,rgba(255,255,255,.08) 17px 18px);
    }
    .visual-cover::after{
      content:"";
      position:absolute;
      right:24px;
      bottom:24px;
      width:100px;
      height:54px;
      opacity:.65;
      background:linear-gradient(90deg,transparent 0 5%,#fff 6% 8%,transparent 9% 15%,#fff 16% 18%,transparent 19% 27%,#fff 28% 32%,transparent 33% 39%,#fff 40% 42%,transparent 43% 50%,#fff 51% 56%,transparent 57% 64%,#fff 65% 67%,transparent 68% 76%,#fff 77% 82%,transparent 83%);
      clip-path:polygon(0 48%,8% 30%,16% 64%,24% 16%,32% 78%,40% 38%,48% 60%,56% 10%,64% 78%,72% 35%,80% 58%,88% 24%,100% 50%,100% 58%,88% 32%,80% 68%,72% 43%,64% 86%,56% 18%,48% 68%,40% 48%,32% 88%,24% 27%,16% 72%,8% 39%,0 58%);
    }
    .cover-title{margin-top:16px;font-size:25px;font-weight:800;letter-spacing:-.04em}
    .cover-meta{font-size:12px;opacity:.78}
    .progress{height:6px;margin:21px 0 17px;overflow:hidden;border-radius:10px;background:#e8f1f6}
    .progress-bar{width:64%;border-radius:10px;background:var(--orange)}
    .control{
      width:38px;
      height:38px;
      display:grid;
      place-items:center;
      border:1px solid var(--line);
      border-radius:50%;
      color:var(--blue-900);
      background:#fff;
      font-weight:800;
    }
    .control:hover{color:#fff;background:var(--blue-700);border-color:var(--blue-700)}
    .control.main{width:48px;height:48px;color:#fff;background:var(--blue-900);border-color:var(--blue-900)}
    .queue{margin-top:18px;padding-top:13px;border-top:1px solid var(--line)}
    .queue-row{
      display:flex;
      align-items:center;
      gap:11px;
      padding:8px 0;
      color:var(--muted);
      font-size:13px;
    }
    .queue-thumb{
      width:35px;
      height:29px;
      flex:0 0 auto;
      border-radius:8px;
      background:linear-gradient(135deg,#b7d9ec,#eaf5fb);
    }
    .queue-row:nth-child(2) .queue-thumb{background:linear-gradient(135deg,#f2c09e,#f9e6d8)}
    .queue-row:nth-child(3) .queue-thumb{background:linear-gradient(135deg,#b9d8c9,#e6f4ec)}
    .section{padding:86px 0}
    .section-soft{background:#edf6fb}
    .section-heading{max-width:650px;margin-bottom:32px}
    .section-heading p{color:var(--muted);margin:14px 0 0}
    .feature-track{display:grid;grid-template-columns:1.35fr .85fr .85fr;gap:18px;align-items:stretch}
    .feature-card{
      position:relative;
      min-height:220px;
      overflow:hidden;
      padding:25px;
      border:1px solid var(--line);
      border-radius:var(--radius-lg);
      background:#fff;
      box-shadow:var(--shadow-sm);
      transition:var(--ease);
    }
    .feature-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:#b9d9eb}
    .feature-card.primary{background:var(--blue-900);color:#fff;border-color:var(--blue-900)}
    .feature-card.primary h3,.feature-card.primary p{color:#fff}
    .feature-number{color:var(--orange);font-weight:800;font-size:13px}
    .feature-card h3{margin:28px 0 10px;font-size:22px}
    .feature-card p{margin:0;color:var(--muted);font-size:14px}
    .feature-card.primary p{color:#c9deee}
    .tag-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}
    .tag{
      display:inline-flex;
      align-items:center;
      padding:6px 10px;
      border:1px solid var(--line);
      border-radius:99px;
      color:var(--blue-800);
      background:var(--blue-050);
      font-size:12px;
      font-weight:700;
    }
    .primary .tag{color:#e7f4fc;background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18)}
    .browse-panel{
      display:grid;
      grid-template-columns:190px 1fr 210px;
      min-height:390px;
      overflow:hidden;
      border:1px solid var(--line);
      border-radius:var(--radius-xl);
      background:#fff;
      box-shadow:var(--shadow-sm);
    }
    .filter-side{padding:25px 18px;border-right:1px solid var(--line);background:#f8fbfd}
    .panel-kicker{margin-bottom:18px;color:var(--muted);font-size:11px;font-weight:800;letter-spacing:.08em}
    .filter-item{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:8px;
      padding:10px 11px;
      margin-bottom:5px;
      border-radius:10px;
      color:var(--muted);
      font-size:13px;
    }
    .filter-item:hover,.filter-item.selected{color:var(--blue-900);background:var(--blue-100);font-weight:750}
    .filter-count{font-size:11px;color:#9aafbd}
    .preview-area{padding:27px}
    .preview-header{display:flex;align-items:start;justify-content:space-between;gap:15px}
    .preview-header h3{margin:0;font-size:24px}
    .search-box{
      display:flex;
      align-items:center;
      gap:9px;
      min-width:180px;
      padding:8px 11px;
      border:1px solid var(--line);
      border-radius:10px;
      color:var(--muted);
      background:#fff;
      font-size:12px;
    }
    .search-box input{width:100%;border:0;outline:0;color:var(--ink);background:transparent}
    .content-preview{
      position:relative;
      min-height:176px;
      margin-top:23px;
      padding:23px;
      overflow:hidden;
      border-radius:17px;
      color:#fff;
      background:linear-gradient(135deg,#173f67,#3b91cf);
    }
    .content-preview::before,.content-preview::after{
      content:"";
      position:absolute;
      border:1px solid rgba(255,255,255,.2);
      border-radius:50%;
    }
    .content-preview::before{right:-30px;top:-60px;width:220px;height:220px}
    .content-preview::after{right:25px;top:-18px;width:140px;height:140px}
    .preview-badge{
      position:relative;
      z-index:1;
      display:inline-block;
      padding:5px 9px;
      border-radius:99px;
      color:#fff;
      background:rgba(255,255,255,.15);
      font-size:11px;
    }
    .content-preview h4{position:relative;z-index:1;margin:24px 0 3px;font-size:22px}
    .content-preview p{position:relative;z-index:1;margin:0;color:#d8edf9;font-size:13px}
    .timeline{height:5px;margin-top:22px;border-radius:10px;background:rgba(255,255,255,.22)}
    .timeline span{display:block;width:58%;height:100%;border-radius:10px;background:#f3a06d}
    .step-list{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
    .step{
      padding:6px 9px;
      border-radius:8px;
      color:var(--muted);
      background:var(--blue-050);
      font-size:11px;
    }
    .step.current{color:var(--blue-900);background:var(--blue-100);font-weight:750}
    .action-side{padding:25px 19px;border-left:1px solid var(--line)}
    .action-box{padding:17px;border-radius:15px;background:var(--blue-050)}
    .action-box strong{display:block;color:var(--blue-900);font-size:14px}
    .action-box span{display:block;margin-top:6px;color:var(--muted);font-size:12px}
    .action-list{margin:22px 0 0;padding:0;list-style:none}
    .action-list li{padding:12px 0;border-bottom:1px solid var(--line);color:var(--muted);font-size:13px}
    .action-list li::before{content:"✓";margin-right:8px;color:var(--green);font-weight:800}
    .trust-grid{display:grid;grid-template-columns:1fr 1fr 1.25fr;gap:18px}
    .trust-card{padding:26px;border:1px solid var(--line);border-radius:var(--radius-lg);background:#fff;box-shadow:var(--shadow-sm)}
    .trust-card strong{display:block;color:var(--blue-900);font-size:29px;line-height:1.2}
    .trust-card span{display:block;margin-top:7px;color:var(--muted);font-size:13px}
    .trust-card.wide{background:var(--blue-900);color:#fff}
    .trust-card.wide strong,.trust-card.wide span{color:#fff}
    .trust-card.wide span{opacity:.75}
    .safe-list{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
    .safe-chip{padding:7px 10px;border-radius:9px;background:rgba(255,255,255,.1);color:#dceef8;font-size:12px}
    .faq-wrap{max-width:850px}
    .accordion-item{margin-bottom:10px;overflow:hidden;border:1px solid var(--line)!important;border-radius:14px!important;background:#fff}
    .accordion-button{padding:19px 20px;color:var(--blue-900);font-weight:750;background:#fff;box-shadow:none!important}
    .accordion-button:not(.collapsed){color:var(--blue-800);background:var(--blue-050)}
    .accordion-body{padding:0 20px 19px;color:var(--muted);font-size:14px}
    .cta-section{padding:68px 0;background:linear-gradient(135deg,#e8f3fb,#fff)}
    .cta-panel{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:30px;
      padding:35px 38px;
      border:1px solid #cfe2ee;
      border-radius:var(--radius-xl);
      background:#fff;
      box-shadow:var(--shadow-sm);
    }
    .cta-panel h2{margin:0 0 8px;font-size:30px}
    .cta-panel p{margin:0;color:var(--muted)}
    .cta-actions{display:flex;gap:10px;flex-wrap:wrap;flex:0 0 auto}
    .site-footer{padding:56px 0 105px;border-top:1px solid var(--line);background:#fff}
    .footer-copy{max-width:500px;margin:17px 0 0;color:var(--muted);font-size:13px}
    .footer-col{display:flex;flex-direction:column;gap:8px}
    .footer-heading{margin-bottom:5px;color:var(--blue-950);font-weight:800}
    .footer-link{width:max-content;color:var(--muted);font-size:13px}
    .footer-link:hover{color:var(--blue-700);transform:translateX(2px)}
    .footer-bottom{
      display:flex;
      justify-content:space-between;
      gap:18px;
      margin-top:42px;
      padding-top:18px;
      border-top:1px solid var(--line);
      color:#8a9eac;
      font-size:12px;
    }
    .fixed-cta{
      position:fixed;
      z-index:1050;
      right:0;
      bottom:0;
      left:0;
      padding:12px 0;
      border-top:1px solid rgba(207,226,238,.9);
      background:rgba(255,255,255,.95);
      backdrop-filter:blur(12px);
      box-shadow:0 -8px 25px rgba(25,70,105,.08);
    }
    .fixed-inner{display:flex;align-items:center;justify-content:space-between;gap:18px}
    .fixed-copy{color:var(--muted);font-size:13px}
    .fixed-copy strong{color:var(--blue-900)}
    .report-box{
      padding:24px;
      border:1px dashed #bcd7e6;
      border-radius:var(--radius-lg);
      background:#f8fcfe;
    }
    .report-box h3{margin:0 0 8px;font-size:20px}
    .report-box p{margin:0;color:var(--muted);font-size:13px}
    @media(max-width:991.98px){
      .navbar-collapse{padding:12px 0 16px}
      .navbar-nav{align-items:stretch!important}
      .navbar-nav .nav-link{margin:2px 0}
      .region-entry{margin-top:10px}
      .hero{padding-top:54px}
      .feature-track{grid-template-columns:1fr 1fr}
      .feature-card.primary{grid-column:1/-1}
      .browse-panel{grid-template-columns:170px 1fr}
      .action-side{grid-column:1/-1;border-top:1px solid var(--line);border-left:0}
      .action-list{display:flex;gap:15px;flex-wrap:wrap;margin-top:14px}
      .action-list li{border:0;padding:0}
      .trust-grid{grid-template-columns:1fr 1fr}
      .trust-card.wide{grid-column:1/-1}
    }
    @media(max-width:767.98px){
      body{padding-bottom:112px}
      .status-inner{align-items:flex-start;flex-direction:column;justify-content:center;padding:8px 12px;gap:3px}
      .hero{padding:48px 0}
      h1{font-size:2.6rem}
      .hero-stage{min-height:380px;margin-top:28px;padding:17px}
      .feature-track,.trust-grid{grid-template-columns:1fr}
      .feature-card.primary,.trust-card.wide{grid-column:auto}
      .section{padding:60px 0}
      .browse-panel{display:block}
      .filter-side{border-right:0;border-bottom:1px solid var(--line)}
      .filter-item{display:inline-flex;margin:0 4px 5px 0}
      .preview-area{padding:21px}
      .preview-header{display:block}
      .search-box{margin-top:14px}
      .action-side{padding:21px}
      .cta-panel{align-items:flex-start;flex-direction:column;padding:27px 22px}
      .footer-bottom{align-items:flex-start;flex-direction:column;gap:7px}
      .fixed-inner{align-items:stretch;flex-direction:column;gap:8px}
      .fixed-cta .btn-primary-custom{width:100%}
    }
    @media(max-width:520px){
      .brand{font-size:16px}
      .brand-mark{width:34px;height:34px;border-radius:11px}
      .hero-actions a{width:100%}
      .hero-note{gap:15px}
      .visual-cover{height:155px}
      .cover-title{font-size:21px}
      .content-preview h4{font-size:19px}
      .preview-area{padding:17px}
    }
