/* roulang page: index */
:root{
            --blue:#246bfd;
            --blue-deep:#164db8;
            --blue-soft:#eaf2ff;
            --teal:#20a6a1;
            --ink:#172033;
            --muted:#5f6b7a;
            --soft:#8792a2;
            --line:#dde5f0;
            --bg:#f7f9fc;
            --card:#fff;
            --danger:#c94d5f;
            --success:#178b70;
            --radius-lg:24px;
            --radius-md:16px;
            --radius-sm:11px;
            --shadow:0 16px 45px rgba(30,62,110,.09);
            --shadow-hover:0 20px 55px rgba(30,75,145,.15);
            --container:1220px;
        }
        *,*:before,*:after{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{
            margin:0;
            color:var(--ink);
            background:var(--bg);
            font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;
            font-size:16px;
            line-height:1.75;
            overflow-x:hidden;
        }
        body:before{
            content:"";
            position:fixed;
            inset:0;
            pointer-events:none;
            opacity:.32;
            background-image:linear-gradient(rgba(36,107,253,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(36,107,253,.035) 1px,transparent 1px);
            background-size:42px 42px;
            mask-image:linear-gradient(to bottom,black,transparent 72%);
        }
        a{color:inherit;text-decoration:none}
        button,input,select,textarea{font:inherit}
        button{cursor:pointer}
        img,svg{display:block;max-width:100%}
        .container{width:min(var(--container),calc(100% - 48px));margin:auto}
        .skip-link{position:absolute;left:-9999px}
        .skip-link:focus{left:16px;top:16px;z-index:1000;background:#fff;padding:10px 14px;border-radius:8px}
        :focus-visible{outline:3px solid rgba(36,107,253,.35);outline-offset:3px}
        .site-header{
            position:sticky;top:0;z-index:20;
            background:rgba(247,249,252,.94);
            border-bottom:1px solid transparent;
            backdrop-filter:blur(14px);
            transition:.25s ease;
        }
        .site-header.scrolled{border-color:var(--line);box-shadow:0 8px 24px rgba(31,62,110,.06)}
        .nav-wrap{height:78px;display:flex;align-items:center;justify-content:space-between;gap:28px}
        .brand{display:flex;align-items:center;gap:12px;min-width:0}
        .brand-mark{
            width:38px;height:38px;flex:0 0 38px;border-radius:12px;
            background:var(--blue-soft);border:1px solid #cbdcff;position:relative;
        }
        .brand-mark:before,.brand-mark:after{
            content:"";position:absolute;height:4px;border-radius:4px;background:var(--blue);left:8px;right:8px;
        }
        .brand-mark:before{top:11px;box-shadow:0 8px 0 var(--teal)}
        .brand-mark:after{top:27px;right:15px;background:var(--blue-deep)}
        .brand-name{font-size:16px;font-weight:750;letter-spacing:-.03em;max-width:290px;line-height:1.2;overflow-wrap:anywhere}
        .desktop-nav{display:flex;align-items:center;gap:7px;margin-left:auto}
        .nav-link{padding:10px 14px;border-radius:10px;color:var(--muted);font-size:14px;font-weight:600;transition:.2s}
        .nav-link:hover,.nav-link.active{color:var(--blue-deep);background:var(--blue-soft)}
        .header-cta,.btn{
            display:inline-flex;align-items:center;justify-content:center;gap:8px;
            min-height:46px;padding:0 19px;border:1px solid transparent;border-radius:11px;
            font-weight:700;font-size:14px;transition:.2s ease;
        }
        .header-cta,.btn-primary{color:#fff;background:var(--blue);box-shadow:0 8px 20px rgba(36,107,253,.2)}
        .header-cta:hover,.btn-primary:hover{background:var(--blue-deep);transform:translateY(-2px);box-shadow:0 11px 25px rgba(36,107,253,.28)}
        .header-cta:active,.btn-primary:active{transform:translateY(0);box-shadow:none}
        .btn-secondary{color:var(--blue-deep);background:#fff;border-color:#cbd8ea}
        .btn-secondary:hover{border-color:var(--blue);background:var(--blue-soft);transform:translateY(-2px)}
        .mobile-tabs{display:none}
        main{position:relative}
        .hero{
            padding:72px 0 82px;
            background:linear-gradient(180deg,#f7f9fc 0%,#eef5ff 100%);
            border-bottom:1px solid var(--line);
        }
        .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:center}
        .eyebrow,.section-kicker{
            display:inline-flex;align-items:center;gap:8px;color:var(--blue-deep);
            background:var(--blue-soft);border:1px solid #cfddff;border-radius:999px;
            padding:5px 11px;font-size:12px;font-weight:750;letter-spacing:.04em;
        }
        .eyebrow i{width:7px;height:7px;background:var(--teal);border-radius:50%}
        h1,h2,h3,p{margin-top:0}
        h1{font-size:clamp(36px,5vw,58px);line-height:1.15;letter-spacing:-.055em;margin:20px 0 22px;max-width:680px;overflow-wrap:anywhere}
        h2{font-size:clamp(28px,3.4vw,40px);line-height:1.25;letter-spacing:-.04em;margin:14px 0}
        h3{font-size:19px;line-height:1.4;margin:0 0 9px}
        .hero-copy{font-size:18px;color:var(--muted);max-width:650px;line-height:1.85}
        .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 24px}
        .hero-notes{display:flex;flex-wrap:wrap;gap:18px;color:var(--muted);font-size:13px}
        .hero-notes span:before{content:"✓";color:var(--teal);font-weight:800;margin-right:6px}
        .dashboard{
            background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);
            box-shadow:var(--shadow);padding:23px;position:relative;overflow:hidden;
        }
        .dashboard:after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;background:#eaf2ff;right:-75px;top:-80px}
        .dash-top{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:22px}
        .dash-label{font-size:13px;color:var(--muted);font-weight:650}
        .status{font-size:12px;color:var(--success);background:#e8f8f4;border-radius:999px;padding:4px 9px}
        .stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;position:relative;z-index:1}
        .stat{padding:17px;border:1px solid #e6edf6;border-radius:14px;background:#fbfdff}
        .stat strong{display:block;font-size:29px;line-height:1.2;letter-spacing:-.05em;font-variant-numeric:tabular-nums}
        .stat small{display:block;color:var(--muted);font-size:12px;margin-top:6px}
        .trend{color:var(--teal);font-size:12px;font-weight:700}
        .dash-chart{margin-top:16px;border-top:1px solid var(--line);padding-top:16px;position:relative;z-index:1}
        .chart-label{display:flex;justify-content:space-between;color:var(--muted);font-size:12px}
        .bars{height:68px;display:flex;align-items:end;gap:8px;margin-top:12px}
        .bars i{display:block;flex:1;border-radius:5px 5px 2px 2px;background:#cfe0ff}
        .bars i:nth-child(2),.bars i:nth-child(5){background:#91b7ff}
        .bars i:nth-child(6),.bars i:nth-child(8){background:var(--blue)}
        .section{padding:96px 0}
        .section-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:32px}
        .section-head p{color:var(--muted);max-width:530px;margin:0}
        .pain-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:20px}
        .pain-panel{border:1px solid var(--line);background:#fff;border-radius:var(--radius-lg);padding:30px;box-shadow:var(--shadow)}
        .pain-panel.blue{background:var(--blue);color:#fff;border-color:var(--blue)}
        .pain-panel.blue p{color:#dfeaff}
        .pain-list{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:13px}
        .pain-list li{display:flex;gap:11px;align-items:flex-start;color:var(--muted)}
        .pain-list li:before{content:"";width:8px;height:8px;flex:0 0 8px;margin-top:9px;border-radius:50%;background:var(--teal)}
        .blue .pain-list li{color:#e9f1ff}.blue .pain-list li:before{background:#9de4db}
        .service-layout{display:grid;grid-template-columns:1.25fr .75fr;gap:18px}
        .service-card{border:1px solid var(--line);background:#fff;border-radius:var(--radius-md);padding:25px;box-shadow:var(--shadow);transition:.25s}
        .service-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover);border-color:#b8ceff}
        .service-card.featured{grid-row:span 2;background:#edf4ff;min-height:300px;display:flex;flex-direction:column;justify-content:space-between}
        .service-side{display:grid;gap:18px}
        .tag{display:inline-block;color:var(--blue-deep);background:var(--blue-soft);border:1px solid #d0ddff;padding:4px 9px;border-radius:999px;font-size:11px;font-weight:700;margin-bottom:17px}
        .service-card p{color:var(--muted);font-size:14px;margin-bottom:18px}
        .text-link{color:var(--blue-deep);font-weight:700;font-size:13px}
        .text-link:after{content:" →";transition:.2s}.text-link:hover:after{padding-left:4px}
        .process{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
        .process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
        .process-item{padding:20px 28px 20px 0;border-right:1px solid var(--line);margin-right:28px}
        .process-item:last-child{border:0;margin:0}
        .step-number{color:var(--blue);font-size:13px;font-weight:800;letter-spacing:.1em}
        .process-item p{color:var(--muted);font-size:14px;margin-bottom:0}
        .compare{display:grid;grid-template-columns:1fr 1.15fr;gap:20px;align-items:stretch}
        .compare-box{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:28px;box-shadow:var(--shadow)}
        .compare-box.highlight{background:#f0f6ff;border-color:#c4d8ff}
        .compare-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
        .compare-title span{font-size:12px;color:var(--muted);background:#f0f3f7;padding:5px 9px;border-radius:999px}
        .highlight .compare-title span{color:var(--blue-deep);background:#dce9ff}
        .dimension{display:grid;grid-template-columns:100px 1fr 62px;gap:14px;align-items:center;padding:14px 0;border-top:1px solid var(--line);font-size:13px}
        .dimension b{font-size:13px}.bar{height:7px;background:#e8edf4;border-radius:9px;overflow:hidden}.bar i{display:block;height:100%;border-radius:inherit;background:#aab8cd}.highlight .bar i{background:var(--blue)}
        .faq-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:48px}
        .faq-intro p{color:var(--muted);max-width:350px}
        .faq-list{display:grid;gap:10px}
        .faq-item{border:1px solid var(--line);background:#fff;border-radius:13px;overflow:hidden}
        .faq-question{width:100%;padding:18px 20px;border:0;background:transparent;color:var(--ink);display:flex;align-items:center;justify-content:space-between;text-align:left;font-weight:700}
        .faq-question span:last-child{font-size:22px;color:var(--blue);transition:.2s}
        .faq-item.open .faq-question span:last-child{transform:rotate(45deg)}
        .faq-answer{display:none;padding:0 20px 19px;color:var(--muted);font-size:14px}
        .faq-item.open .faq-answer{display:block}
        .cta-section{padding:0 0 96px}
        .cta-panel{display:grid;grid-template-columns:.8fr 1.2fr;gap:38px;background:#eaf2ff;border:1px solid #cddcff;border-radius:var(--radius-lg);padding:38px}
        .cta-copy p{color:var(--muted);max-width:390px}
        .contact-form{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:0 12px 30px rgba(37,75,130,.07)}
        .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}
        .field{display:grid;gap:7px}.field.full{grid-column:1/-1}
        label{font-size:13px;font-weight:700}
        input,select,textarea{width:100%;border:1px solid #d5dfec;border-radius:9px;padding:12px 13px;color:var(--ink);background:#fff;min-height:48px;transition:.2s}
        textarea{resize:vertical;min-height:92px}
        input:hover,select:hover,textarea:hover{border-color:#a9c3f5}
        input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px rgba(36,107,253,.1)}
        .consent{display:flex;gap:8px;align-items:flex-start;margin:15px 0;color:var(--muted);font-size:12px}
        .consent input{width:16px;min-height:16px;margin-top:4px}
        .form-submit{width:100%}
        .form-message{display:none;margin-top:12px;padding:10px 12px;border-radius:9px;background:#e8f8f4;color:var(--success);font-size:13px}
        .form-message.show{display:block}
        footer{padding:34px 0 42px;border-top:1px solid var(--line);background:#f1f5fa}
        .footer-grid{display:flex;justify-content:space-between;gap:30px;align-items:flex-start}
        .footer-brand{max-width:330px}.footer-brand p{color:var(--muted);font-size:13px;margin:12px 0 0}
        .footer-links{display:flex;gap:22px;color:var(--muted);font-size:13px}
        .footer-links a:hover{color:var(--blue-deep)}
        .copyright{margin-top:26px;color:var(--soft);font-size:12px}
        @media(max-width:900px){
            .hero-grid,.pain-grid,.compare,.cta-panel,.faq-layout{grid-template-columns:1fr}
            .hero{padding:55px 0 65px}.section{padding:70px 0}
            .desktop-nav{display:none}.header-cta{display:none}
            .nav-wrap{height:68px}.brand-name{max-width:245px}
            .mobile-tabs{display:flex;position:fixed;z-index:30;bottom:0;left:0;right:0;height:68px;padding-bottom:env(safe-area-inset-bottom);background:rgba(255,255,255,.96);border-top:1px solid var(--line);box-shadow:0 -8px 25px rgba(34,70,120,.08);justify-content:space-around}
            .tab-link{min-width:66px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--muted);font-size:11px}
            .tab-icon{font-size:19px;line-height:1;color:#7e8ca0}.tab-link.active{color:var(--blue-deep);font-weight:700}
            .tab-link.active .tab-icon{color:var(--blue)}
            body{padding-bottom:68px}
            .process-grid{grid-template-columns:1fr;gap:0}.process-item{border-right:0;border-bottom:1px solid var(--line);margin:0;padding:20px 0}
        }
        @media(max-width:560px){
            .container{width:min(100% - 32px,var(--container))}
            h1{font-size:36px}.hero-copy{font-size:16px}.section{padding:58px 0}
            .section-head{display:block}.section-head p{margin-top:14px}
            .service-layout{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}
            .service-card,.service-side{min-width:84vw;scroll-snap-align:start}.service-side{display:grid}
            .stat-grid{gap:8px}.stat{padding:13px}.stat strong{font-size:25px}
            .form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}
            .cta-panel{padding:23px;gap:22px}.pain-panel,.compare-box{padding:22px}
            .footer-grid{display:block}.footer-links{margin-top:24px;flex-wrap:wrap;gap:14px}
            .hero-actions .btn{width:100%}
        }
        @media(prefers-reduced-motion:reduce){
            *,*:before,*:after{scroll-behavior:auto!important;transition:none!important}
        }

/* roulang page: category1 */
:root{
 --blue:#246bfd;--blue-deep:#164db8;--blue-soft:#eaf2ff;--teal:#20a6a1;
 --ink:#172033;--muted:#5f6b7a;--soft:#8792a2;--line:#dde5f0;
 --bg:#f7f9fc;--card:#fff;--danger:#c94d5f;--success:#178b70;
 --radius-lg:24px;--radius-md:16px;--radius-sm:11px;
 --shadow:0 16px 45px rgba(30,62,110,.09);
 --shadow-hover:0 20px 55px rgba(30,75,145,.15);--container:1220px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--bg);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;font-size:16px;line-height:1.75;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.32;background-image:linear-gradient(rgba(36,107,253,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(36,107,253,.035) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,black,transparent 72%)}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img,svg{display:block;max-width:100%}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{line-height:1.25;letter-spacing:-.035em}
h1{font-size:clamp(34px,5vw,56px);margin:18px 0 20px;overflow-wrap:anywhere}
h2{font-size:clamp(28px,3.2vw,38px);margin:0 0 14px}
h3{font-size:20px;margin:0 0 9px}
.container{width:min(var(--container),calc(100% - 48px));margin:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(247,249,252,.94);border-bottom:1px solid transparent;backdrop-filter:blur(14px);transition:.25s ease}
.site-header.scrolled{border-color:var(--line);box-shadow:0 8px 24px rgba(31,62,110,.06)}
.nav-wrap{height:78px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.brand-mark{width:38px;height:38px;flex:0 0 38px;border-radius:12px;background:var(--blue-soft);border:1px solid #cbdcff;position:relative}
.brand-mark:before,.brand-mark:after{content:"";position:absolute;height:4px;border-radius:4px;background:var(--blue);left:8px;right:8px}
.brand-mark:before{top:11px;box-shadow:0 8px 0 var(--teal)}
.brand-mark:after{top:27px;right:15px;background:var(--blue-deep)}
.brand-name{font-size:16px;font-weight:750;letter-spacing:-.03em;max-width:290px;line-height:1.2;overflow-wrap:anywhere}
.desktop-nav{display:flex;align-items:center;gap:7px;margin-left:auto}
.nav-link{padding:10px 14px;border-radius:10px;color:var(--muted);font-size:14px;font-weight:600;transition:.2s}
.nav-link:hover,.nav-link.active{color:var(--blue-deep);background:var(--blue-soft)}
.header-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 19px;border:1px solid transparent;border-radius:11px;font-weight:700;font-size:14px;transition:.2s ease}
.header-cta,.btn-primary{color:#fff;background:var(--blue);box-shadow:0 8px 20px rgba(36,107,253,.2)}
.header-cta:hover,.btn-primary:hover{background:var(--blue-deep);transform:translateY(-2px);box-shadow:0 11px 25px rgba(36,107,253,.28)}
.header-cta:active,.btn-primary:active{transform:translateY(0);box-shadow:none}
.btn-secondary{color:var(--blue-deep);background:#fff;border-color:#cbd8ea}
.btn-secondary:hover{border-color:var(--blue);background:var(--blue-soft);transform:translateY(-2px)}
.btn:focus-visible,.header-cta:focus-visible,.nav-link:focus-visible,.filter-btn:focus-visible,.faq-question:focus-visible,.text-link:focus-visible{outline:3px solid rgba(36,107,253,.3);outline-offset:3px}
.mobile-tabs{display:none}
.page-hero{padding:64px 0 58px;background:linear-gradient(180deg,#f7f9fc 0%,#eef5ff 100%);border-bottom:1px solid var(--line)}
.hero-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;align-items:end;gap:70px}
.eyebrow,.section-kicker{display:inline-flex;align-items:center;gap:8px;color:var(--blue-deep);background:var(--blue-soft);border:1px solid #cfddff;border-radius:999px;padding:5px 11px;font-size:12px;font-weight:750;letter-spacing:.04em}
.eyebrow i{width:7px;height:7px;background:var(--teal);border-radius:50%}
.hero-copy{font-size:17px;color:var(--muted);max-width:720px;line-height:1.85}
.breadcrumb{display:flex;gap:9px;align-items:center;color:var(--soft);font-size:13px;margin-bottom:26px}
.breadcrumb a{color:var(--blue-deep)}
.summary-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:var(--shadow)}
.summary-card strong{display:block;font-size:34px;line-height:1;color:var(--blue-deep);font-variant-numeric:tabular-nums;margin-bottom:8px}
.summary-card p{color:var(--muted);font-size:13px;margin:0}
.summary-line{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);margin-top:20px;padding-top:15px;font-size:13px;color:var(--muted)}
.summary-line b{color:var(--teal)}
.section{padding:82px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:28px}
.section-head p{color:var(--muted);max-width:560px;margin:0}
.filter-panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px 20px;box-shadow:0 8px 26px rgba(30,62,110,.05);margin-bottom:30px}
.filter-row{display:flex;align-items:center;gap:12px;overflow-x:auto;padding-bottom:2px;scrollbar-width:thin}
.filter-label{color:var(--soft);font-size:13px;font-weight:700;white-space:nowrap}
.filter-btn{border:1px solid var(--line);background:#fff;border-radius:999px;color:var(--muted);padding:8px 15px;white-space:nowrap;font-size:13px;transition:.2s}
.filter-btn:hover,.filter-btn.active{color:var(--blue-deep);border-color:#aac5ff;background:var(--blue-soft)}
.filter-row+.filter-row{margin-top:12px;padding-top:12px;border-top:1px solid #edf1f6}
.featured-entry{display:grid;grid-template-columns:42% 58%;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);margin-bottom:32px}
.abstract-visual{min-height:310px;background:#eaf2ff;position:relative;overflow:hidden;padding:30px}
.abstract-visual:before{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-70px;top:-70px;background:#cbdcff}
.abstract-visual:after{content:"";position:absolute;width:180px;height:180px;border:25px solid rgba(32,166,161,.22);border-radius:50%;left:-60px;bottom:-70px}
.visual-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px}
.visual-block{height:88px;border-radius:12px;background:#fff;border:1px solid #d7e4fb;padding:14px;box-shadow:0 8px 18px rgba(39,91,170,.08)}
.visual-block span{display:block;height:7px;background:#c9d9f8;border-radius:5px;margin-bottom:9px}
.visual-block span:last-child{width:62%;background:#82b0ff}
.featured-content{padding:34px 38px}
.tag{display:inline-block;color:var(--blue-deep);background:var(--blue-soft);border:1px solid #d0ddff;padding:4px 9px;border-radius:999px;font-size:11px;font-weight:700;margin-bottom:17px}
.featured-content p{color:var(--muted);max-width:600px}
.entry-points{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 25px;padding:0;list-style:none}
.entry-points li{font-size:13px;background:#f5f8fc;border:1px solid #e3eaf3;border-radius:10px;padding:8px 12px;color:var(--muted)}
.entry-points li:before{content:"✓";color:var(--teal);font-weight:800;margin-right:6px}
.index-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:24px;align-items:start}
.entry-list{display:grid;gap:14px}
.index-entry{display:grid;grid-template-columns:130px minmax(0,1fr) auto;gap:22px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;transition:.25s}
.index-entry:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover);border-color:#b8ceff}
.entry-icon{height:100px;border-radius:12px;background:var(--blue-soft);position:relative;overflow:hidden;border:1px solid #d5e2fb}
.entry-icon:before{content:"";position:absolute;left:20px;right:20px;top:27px;height:9px;background:var(--blue);border-radius:8px;box-shadow:0 19px 0 #80aaff,0 38px 0 var(--teal)}
.index-entry p{font-size:13px;color:var(--muted);margin:0 0 8px;line-height:1.65}
.entry-meta{font-size:12px;color:var(--soft)}
.entry-meta b{color:var(--teal);margin-right:12px}
.aside-card{background:#f0f6ff;border:1px solid #d5e4ff;border-radius:18px;padding:23px;position:sticky;top:105px}
.aside-card h3{font-size:18px}
.aside-card p{color:var(--muted);font-size:13px}
.aside-list{list-style:none;padding:0;margin:17px 0 0;display:grid;gap:11px}
.aside-list li{display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:13px;border-bottom:1px dashed #cbdaf1;padding-bottom:9px}
.aside-list b{color:var(--blue-deep)}
.pager{display:flex;justify-content:center;gap:9px;margin-top:28px}
.page-number{min-width:42px;height:42px;border:1px solid var(--line);background:#fff;border-radius:10px;display:grid;place-items:center;color:var(--muted);font-size:14px}
.page-number.current{background:var(--blue);border-color:var(--blue);color:#fff}
.note{font-size:12px;color:var(--soft);text-align:center;margin:13px 0 0}
.faq-wrap{display:grid;grid-template-columns:.72fr 1.28fr;gap:60px;align-items:start}
.faq-intro p{color:var(--muted);max-width:340px}
.faq-list{display:grid;gap:10px}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.faq-question{width:100%;border:0;background:transparent;text-align:left;padding:19px 22px;color:var(--ink);font-weight:700;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq-question span:last-child{color:var(--blue);font-size:22px;transition:.25s}
.faq-answer{display:none;padding:0 22px 19px;color:var(--muted);font-size:14px}
.faq-item.open .faq-answer{display:block}
.faq-item.open .faq-question span:last-child{transform:rotate(45deg)}
.category-cta{background:#eaf2ff;border:1px solid #cbdcff;border-radius:var(--radius-lg);padding:34px 40px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.category-cta p{color:var(--muted);margin:0;max-width:650px}
footer{background:#eef3f9;border-top:1px solid var(--line);padding:46px 0 25px}
.footer-grid{display:flex;justify-content:space-between;gap:40px;align-items:start}
.footer-brand{max-width:520px}
.footer-brand p{color:var(--muted);font-size:13px;margin:18px 0 0}
.footer-links{display:flex;flex-wrap:wrap;gap:10px 24px;color:var(--muted);font-size:14px}
.footer-links a:hover{color:var(--blue-deep)}
.copyright{border-top:1px solid var(--line);margin-top:34px;padding-top:18px;color:var(--soft);font-size:12px}
@media(max-width:992px){
 .desktop-nav{gap:2px}.nav-link{padding:9px 10px}.hero-layout{gap:35px}.index-layout{grid-template-columns:1fr 250px}
}
@media(max-width:768px){
 body{padding-bottom:76px}.container{width:min(var(--container),calc(100% - 36px))}
 .nav-wrap{height:68px}.desktop-nav,.header-cta{display:none}.brand-name{font-size:14px;max-width:245px}
 .mobile-tabs{position:fixed;display:grid;grid-template-columns:repeat(4,1fr);bottom:0;left:0;right:0;z-index:30;height:calc(66px + env(safe-area-inset-bottom));padding:7px 10px env(safe-area-inset-bottom);background:rgba(255,255,255,.97);border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(30,62,110,.08)}
 .mobile-tabs a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-radius:10px;color:var(--soft);font-size:11px;font-weight:650}
 .mobile-tabs a.active,.mobile-tabs a:hover{color:var(--blue-deep);background:var(--blue-soft)}
 .tab-icon{width:18px;height:18px;position:relative}.tab-icon:before{content:"";position:absolute;inset:3px;border:2px solid currentColor;border-radius:5px}.tab-icon.line:after{content:"";position:absolute;left:5px;right:5px;top:8px;border-top:2px solid currentColor}
 .page-hero{padding:45px 0 42px}.hero-layout{grid-template-columns:1fr;gap:28px}h1{font-size:37px}
 .section{padding:62px 0}.section-head{display:block}.section-head p{margin-top:10px}
 .featured-entry{grid-template-columns:1fr}.abstract-visual{min-height:220px}.featured-content{padding:27px 23px}
 .index-layout{grid-template-columns:1fr}.aside-card{position:static;order:-1}.index-entry{grid-template-columns:82px 1fr;gap:15px}.entry-icon{height:80px}.index-entry .text-link{grid-column:2}
 .faq-wrap{grid-template-columns:1fr;gap:25px}.category-cta{display:block;padding:28px 23px}.category-cta .btn{margin-top:20px;width:100%}
 .footer-grid{display:block}.footer-links{margin-top:27px}
}
@media(max-width:520px){
 .container{width:min(var(--container),calc(100% - 32px))}.brand{gap:8px}.brand-mark{width:33px;height:33px;flex-basis:33px;border-radius:10px}.brand-name{font-size:13px;max-width:220px}
 h1{font-size:32px}.hero-copy{font-size:15px}.summary-card{padding:20px}
 .filter-panel{padding:15px}.featured-content{padding:23px 18px}.abstract-visual{padding:22px}
 .index-entry{padding:13px}.index-entry p{font-size:12px}.entry-icon{height:72px}
 .faq-question{padding:16px}.faq-answer{padding:0 16px 16px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}
