/* roulang page: index */
:root{
            --ink:#17242b;
            --muted:#6d7d82;
            --paper:#f6f8f5;
            --white:#fff;
            --line:#dce7e2;
            --mint:#b9f3da;
            --green:#118b68;
            --deep:#0f3935;
            --orange:#ffad55;
            --shadow:0 18px 50px rgba(19,58,50,.10);
            --radius:22px;
            --container:1180px;
        }
        *,*::before,*::after{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{margin:0;background:var(--paper);color:var(--ink);font-family:"PingFang 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,select,textarea{font:inherit}
        .container{width:min(var(--container),calc(100% - 40px));margin:auto}
        .site-header{position:sticky;top:0;z-index:1000;background:rgba(246,248,245,.92);backdrop-filter:blur(16px);border-bottom:1px solid rgba(220,231,226,.85)}
        .nav-wrap{min-height:78px;display:flex;align-items:center;gap:32px}
        .brand{display:inline-flex;align-items:center;gap:11px;font-weight:900;letter-spacing:-.04em;font-size:22px;color:var(--deep);white-space:nowrap}
        .brand-mark{width:36px;height:36px;border-radius:12px;background:var(--deep);color:var(--mint);display:grid;place-items:center;font-size:18px;box-shadow:0 8px 20px rgba(15,57,53,.22)}
        .nav-tabs{display:flex;align-items:center;gap:7px;margin-left:auto;padding:5px;border:1px solid var(--line);border-radius:15px;background:#edf4ef}
        .nav-tabs a{font-size:14px;font-weight:700;color:var(--muted);padding:8px 17px;border-radius:10px}
        .nav-tabs a:hover,.nav-tabs a.active{color:var(--deep);background:var(--white);box-shadow:0 4px 12px rgba(15,57,53,.08)}
        .nav-action{padding:11px 18px;border-radius:12px;background:var(--green);color:#fff;font-size:14px;font-weight:800}
        .nav-action:hover{background:var(--deep);color:#fff;transform:translateY(-2px)}
        .hero{padding:78px 0 58px;background:radial-gradient(circle at 85% 18%,#d7f9e7 0,transparent 28%),var(--paper)}
        .hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:68px;align-items:center}
        .eyebrow,.tag{display:inline-flex;align-items:center;gap:8px;color:var(--green);font-size:12px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}
        .eyebrow:before{content:"";width:24px;height:2px;background:var(--orange)}
        h1,h2,h3,p{margin-top:0}
        h1{font-size:clamp(42px,6vw,78px);line-height:1.08;letter-spacing:-.07em;margin:18px 0 24px;color:var(--deep);font-weight:900}
        .hero-copy{font-size:18px;color:var(--muted);max-width:670px;margin-bottom:30px}
        .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
        .btn-main,.btn-light{display:inline-flex;align-items:center;justify-content:center;min-height:49px;padding:0 21px;border-radius:13px;font-weight:800;border:1px solid transparent}
        .btn-main{background:var(--green);color:#fff;box-shadow:0 12px 24px rgba(17,139,104,.18)}
        .btn-main:hover{background:var(--deep);color:#fff;transform:translateY(-2px)}
        .btn-light{background:#fff;color:var(--deep);border-color:var(--line)}
        .btn-light:hover{border-color:var(--green);color:var(--green);transform:translateY(-2px)}
        .hero-panel{position:relative;border-radius:30px;background:var(--deep);padding:30px;color:#fff;box-shadow:var(--shadow);overflow:hidden}
        .hero-panel:after{content:"";position:absolute;width:210px;height:210px;border:1px solid rgba(185,243,218,.35);border-radius:50%;right:-65px;top:-65px}
        .panel-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(255,255,255,.15);padding-bottom:20px;margin-bottom:24px}
        .panel-top strong{font-size:17px}.live{font-size:11px;color:var(--mint);font-weight:800}
        .panel-question{font-size:26px;line-height:1.3;font-weight:900;max-width:360px;margin-bottom:26px}
        .panel-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
        .panel-item{padding:17px;border-radius:15px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12)}
        .panel-item b{display:block;font-size:24px;color:var(--mint);line-height:1.2}.panel-item span{font-size:12px;color:#b8cbc7}
        section{padding:88px 0}
        .section-head{max-width:720px;margin-bottom:34px}
        .section-head h2{font-size:clamp(28px,4vw,46px);line-height:1.2;letter-spacing:-.05em;color:var(--deep);font-weight:900;margin:13px 0}
        .section-head p{color:var(--muted);font-size:16px;margin-bottom:0}
        .metric-band{padding:25px 0;background:var(--deep);color:#fff}
        .metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
        .metric{border-right:1px solid rgba(255,255,255,.18);padding:8px 20px}
        .metric:last-child{border:0}.metric strong{display:block;font-size:30px;color:var(--mint);line-height:1.2}.metric span{font-size:13px;color:#b4c9c3}
        .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
        .grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
        .card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:27px;box-shadow:0 8px 25px rgba(19,58,50,.04);transition:.25s ease}
        .card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#b4ddcc}
        .icon-box{width:43px;height:43px;border-radius:13px;background:#e2f7ed;color:var(--green);display:grid;place-items:center;font-weight:900;margin-bottom:20px}
        .card h3{font-size:20px;color:var(--deep);margin-bottom:10px;font-weight:900}.card p{font-size:14px;color:var(--muted);margin-bottom:0}
        .soft{background:#edf5f0}.dark-section{background:var(--deep);color:#fff}.dark-section h2,.dark-section h3{color:#fff}.dark-section .section-head p{color:#b6cbc5}
        .dark-card{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.13)}.dark-card p{color:#b8cbc7}.dark-card:hover{border-color:var(--mint)}
        .number-list{display:grid;gap:13px}.number-item{display:flex;gap:18px;align-items:flex-start;padding:18px 0;border-bottom:1px solid var(--line)}.number-item:last-child{border:0}
        .number{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--mint);color:var(--deep);font-weight:900}
        .number-item h3{font-size:17px;margin:2px 0 4px;color:var(--deep)}.number-item p{font-size:14px;color:var(--muted);margin:0}
        .split{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:center}.quote-box{padding:35px;background:#fff;border-radius:26px;border-left:5px solid var(--orange);box-shadow:var(--shadow);font-size:21px;line-height:1.55;color:var(--deep);font-weight:800}
        .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.step{position:relative;padding:22px;background:#fff;border-radius:18px;border:1px solid var(--line)}.step em{font-style:normal;color:var(--green);font-weight:900;font-size:13px}.step h3{font-size:17px;margin:12px 0 5px}.step p{font-size:13px;color:var(--muted);margin:0}
        .compare{overflow:hidden;border-radius:22px;border:1px solid var(--line);background:#fff}.compare-row{display:grid;grid-template-columns:1fr 1fr 1fr;padding:18px 22px;border-bottom:1px solid var(--line);gap:15px}.compare-row:last-child{border:0}.compare-row strong{color:var(--deep)}.compare-row span{font-size:14px;color:var(--muted)}.compare-head{background:#e4f7ed}
        .article-card{display:flex;flex-direction:column;min-height:235px}.article-meta{font-size:12px;color:var(--green);font-weight:800;margin-bottom:17px}.article-card h3{font-size:20px;margin-bottom:12px}.article-card p{flex:1}
        .assurance{display:flex;flex-wrap:wrap;gap:12px}.assurance span{padding:12px 17px;border:1px solid #b7ddd0;border-radius:12px;background:#f4fcf7;color:var(--deep);font-weight:800;font-size:14px}
        .faq{border-bottom:1px solid var(--line);padding:20px 0}.faq h3{font-size:18px;margin-bottom:8px;color:var(--deep)}.faq p{font-size:14px;color:var(--muted);margin:0}
        .form-shell{display:grid;grid-template-columns:.9fr 1.1fr;gap:45px;align-items:start}.form-box{background:#fff;padding:28px;border-radius:24px;box-shadow:var(--shadow);border:1px solid var(--line)}
        label{display:block;font-size:13px;font-weight:800;color:var(--deep);margin-bottom:7px}.form-control,.form-select{border:1px solid var(--line);border-radius:11px;padding:12px 14px;color:var(--ink);background:#fbfdfb}.form-control:focus,.form-select:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(17,139,104,.1)}
        .form-note{font-size:12px;color:var(--muted);margin-top:12px}.site-footer{background:#102d2b;color:#c0d0cb;padding:55px 0 25px}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:50px}.footer-brand{color:#fff;font-size:21px;font-weight:900;margin-bottom:15px}.footer-title{color:var(--mint);font-size:13px;font-weight:900;margin-bottom:14px}.footer-links{display:grid;gap:8px;font-size:14px}.footer-links a:hover{color:#fff}.copyright{border-top:1px solid rgba(255,255,255,.13);margin-top:40px;padding-top:20px;font-size:12px;color:#8ca49d}
        :focus-visible{outline:3px solid var(--orange);outline-offset:3px}
        @media(max-width:992px){.hero-grid,.split,.form-shell{grid-template-columns:1fr;gap:35px}.hero{padding-top:55px}.grid-3{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}}
        @media(max-width:768px){.container{width:min(100% - 28px,var(--container))}.nav-wrap{min-height:68px;gap:12px}.nav-tabs{overflow-x:auto;margin-left:auto}.nav-tabs a{padding:7px 12px;white-space:nowrap}.nav-action{display:none}.hero-copy{font-size:16px}.metrics{grid-template-columns:repeat(2,1fr)}.metric{border-right:0;border-bottom:1px solid rgba(255,255,255,.18);padding:14px}.metric:nth-child(odd){border-right:1px solid rgba(255,255,255,.18)}section{padding:62px 0}.footer-grid{grid-template-columns:1fr 1fr;gap:28px}}
        @media(max-width:520px){h1{font-size:43px}.hero-panel{padding:22px}.panel-question{font-size:22px}.grid-3,.grid-2,.steps{grid-template-columns:1fr}.compare-row{grid-template-columns:1fr;gap:4px}.footer-grid{grid-template-columns:1fr}.brand{font-size:18px}.brand-mark{width:32px;height:32px}.nav-tabs{max-width:150px}}

/* roulang page: category1 */
:root{
 --ink:#17242b;
 --muted:#6d7d82;
 --paper:#f6f8f5;
 --white:#fff;
 --line:#dce7e2;
 --mint:#b9f3da;
 --green:#118b68;
 --deep:#0f3935;
 --orange:#ffad55;
 --warm:#fff4e3;
 --warm-ink:#9a5b1d;
 --shadow:0 18px 50px rgba(19,58,50,.10);
 --radius:22px;
 --container:1180px;
}
*,
*::before,
*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
 margin:0;
 background:var(--paper);
 color:var(--ink);
 font-family:"PingFang SC","Microsoft YaHei",Arial,sans-serif;
 font-size:16px;
 line-height:1.75;
}
h1,h2,h3,h4,p{margin-top:0}
h1,h2,h3,h4{line-height:1.25}
a{
 color:inherit;
 text-decoration:none;
 transition:all .25s ease;
}
a:hover{color:inherit}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.container{
 width:min(var(--container),calc(100% - 40px));
 max-width:none;
 margin:0 auto;
 padding-left:0;
 padding-right:0;
}
:focus-visible{
 outline:3px solid var(--orange);
 outline-offset:3px;
}
.site-header{
 position:sticky;
 top:0;
 z-index:1000;
 background:rgba(246,248,245,.94);
 backdrop-filter:blur(16px);
 border-bottom:1px solid rgba(220,231,226,.85);
}
.nav-wrap{
 min-height:78px;
 display:flex;
 align-items:center;
 gap:32px;
}
.brand{
 display:inline-flex;
 align-items:center;
 gap:11px;
 color:var(--deep);
 font-size:22px;
 font-weight:900;
 white-space:nowrap;
}
.brand:hover{color:var(--green)}
.brand-mark{
 width:36px;
 height:36px;
 display:grid;
 place-items:center;
 border-radius:12px;
 background:var(--deep);
 color:var(--mint);
 font-size:18px;
 font-weight:900;
 box-shadow:0 8px 20px rgba(15,57,53,.22);
}
.nav-tabs{
 display:flex;
 align-items:center;
 gap:7px;
 margin-left:auto;
 padding:5px;
 border:1px solid var(--line);
 border-radius:15px;
 background:#edf4ef;
}
.nav-tabs a{
 padding:8px 17px;
 border-radius:10px;
 color:var(--muted);
 font-size:14px;
 font-weight:700;
 white-space:nowrap;
}
.nav-tabs a:hover,
.nav-tabs a.active{
 color:var(--deep);
 background:var(--white);
 box-shadow:0 4px 12px rgba(15,57,53,.08);
}
.nav-action{
 padding:11px 18px;
 border-radius:12px;
 background:var(--green);
 color:#fff;
 font-size:14px;
 font-weight:800;
 white-space:nowrap;
}
.nav-action:hover{
 background:var(--deep);
 color:#fff;
 transform:translateY(-2px);
}
main{overflow:hidden}
section{padding:88px 0}
.campaign-hero{
 position:relative;
 overflow:hidden;
 padding:34px 0 72px;
 background:var(--deep);
 color:#fff;
}
.campaign-hero::before,
.campaign-hero::after{
 content:"";
 position:absolute;
 border:1px solid rgba(185,243,218,.15);
 border-radius:50%;
 pointer-events:none;
}
.campaign-hero::before{
 width:510px;
 height:510px;
 right:-180px;
 top:-210px;
}
.campaign-hero::after{
 width:270px;
 height:270px;
 left:-155px;
 bottom:-170px;
}
.campaign-hero .container{position:relative;z-index:1}
.countdown-strip{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:20px;
 min-height:58px;
 margin-bottom:52px;
 padding:10px 14px 10px 20px;
 border:1px solid rgba(185,243,218,.22);
 border-radius:16px;
 background:rgba(255,255,255,.07);
}
.countdown-meta{
 display:flex;
 align-items:center;
 gap:12px;
 color:#d7ebe3;
 font-size:14px;
 font-weight:700;
}
.live-dot{
 width:9px;
 height:9px;
 border-radius:50%;
 background:var(--orange);
 box-shadow:0 0 0 5px rgba(255,173,85,.13);
}
.countdown-values{
 display:flex;
 align-items:center;
 gap:8px;
}
.countdown-item{
 min-width:54px;
 padding:6px 8px;
 border-radius:10px;
 background:rgba(255,255,255,.1);
 text-align:center;
}
.countdown-number{
 display:block;
 color:var(--mint);
 font-size:19px;
 font-weight:900;
 line-height:1.1;
}
.countdown-label{
 display:block;
 margin-top:2px;
 color:#a7c5bc;
 font-size:11px;
}
.campaign-grid{
 display:grid;
 grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
 align-items:center;
 gap:66px;
}
.campaign-label{
 display:inline-flex;
 align-items:center;
 gap:9px;
 margin-bottom:20px;
 color:var(--mint);
 font-size:13px;
 font-weight:900;
}
.campaign-label::before{
 content:"";
 width:25px;
 height:2px;
 background:var(--orange);
}
.campaign-copy h1{
 max-width:720px;
 margin-bottom:22px;
 color:#fff;
 font-size:58px;
 font-weight:900;
}
.campaign-copy p{
 max-width:650px;
 margin-bottom:30px;
 color:#bfd2cc;
 font-size:18px;
}
.campaign-actions{
 display:flex;
 flex-wrap:wrap;
 gap:12px;
}
.btn-main,
.btn-light,
.btn-warm{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 min-height:49px;
 padding:0 21px;
 border:1px solid transparent;
 border-radius:13px;
 font-weight:800;
 transition:all .25s ease;
}
.btn-main{
 background:var(--green);
 color:#fff;
 box-shadow:0 12px 24px rgba(17,139,104,.18);
}
.btn-main:hover{
 background:#0c7557;
 color:#fff;
 transform:translateY(-2px);
}
.btn-light{
 background:#fff;
 color:var(--deep);
 border-color:var(--line);
}
.btn-light:hover{
 color:var(--green);
 border-color:var(--green);
 transform:translateY(-2px);
}
.btn-warm{
 background:var(--orange);
 color:#352516;
 box-shadow:0 12px 24px rgba(255,173,85,.2);
}
.btn-warm:hover{
 background:#ffc378;
 color:#352516;
 transform:translateY(-2px);
}
.hero-visual{
 position:relative;
 min-height:420px;
 padding:15px;
 border:1px solid rgba(185,243,218,.22);
 border-radius:28px;
 background:rgba(255,255,255,.08);
 box-shadow:0 25px 60px rgba(0,0,0,.2);
}
.visual-image{
 width:100%;
 height:390px;
 overflow:hidden;
 border-radius:20px;
 position:relative;
}
.visual-image::after{
 content:"";
 position:absolute;
 inset:0;
 background:rgba(15,57,53,.32);
 pointer-events:none;
}
.visual-image img{
 width:100%;
 height:100%;
 object-fit:cover;
}
.visual-overlay{
 position:absolute;
 inset:0;
 z-index:1;
 display:flex;
 flex-direction:column;
 justify-content:space-between;
 padding:23px;
}
.visual-topline,
.visual-bottom{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:14px;
}
.visual-topline{
 color:#fff;
 font-size:13px;
 font-weight:800;
}
.visual-dot{
 width:9px;
 height:9px;
 display:inline-block;
 margin-right:7px;
 border-radius:50%;
 background:var(--mint);
 box-shadow:0 0 0 5px rgba(185,243,218,.16);
}
.visual-bottom{
 align-items:flex-end;
 color:#fff;
}
.visual-bottom strong{
 display:block;
 font-size:25px;
 line-height:1.2;
}
.visual-bottom span{
 color:#d2e5de;
 font-size:13px;
}
.visual-float{
 position:absolute;
 right:-25px;
 bottom:34px;
 z-index:2;
 min-width:175px;
 padding:15px 18px;
 border:1px solid rgba(15,57,53,.08);
 border-radius:16px;
 background:var(--mint);
 color:var(--deep);
 box-shadow:0 18px 30px rgba(0,0,0,.2);
}
.visual-float span{
 display:block;
 margin-bottom:3px;
 color:#47766c;
 font-size:12px;
}
.visual-float strong{
 font-size:17px;
}
.eyebrow,
.tag{
 display:inline-flex;
 align-items:center;
 gap:8px;
 color:var(--green);
 font-size:12px;
 font-weight:900;
}
.eyebrow{
 text-transform:uppercase;
}
.eyebrow::before{
 content:"";
 width:24px;
 height:2px;
 background:var(--orange);
}
.eyebrow.light{color:var(--mint)}
.section-head{
 max-width:730px;
 margin-bottom:34px;
}
.section-head h2{
 margin:13px 0;
 color:var(--deep);
 font-size:44px;
 font-weight:900;
}
.section-head p{
 margin-bottom:0;
 color:var(--muted);
 font-size:16px;
}
.metrics-section{background:var(--white)}
.metrics-board{
 display:grid;
 grid-template-columns:.78fr 1.22fr;
 gap:18px;
}
.metric-lead{
 display:flex;
 flex-direction:column;
 justify-content:space-between;
 min-height:300px;
 padding:32px;
 border-radius:var(--radius);
 background:var(--deep);
 color:#fff;
 box-shadow:var(--shadow);
}
.metric-lead .tag{color:var(--mint)}
.metric-lead h3{
 max-width:360px;
 margin:20px 0 12px;
 font-size:29px;
 font-weight:900;
}
.metric-lead p{
 max-width:380px;
 margin:0;
 color:#b8cbc7;
 font-size:14px;
}
.lead-pill{
 align-self:flex-start;
 margin-top:26px;
 padding:7px 12px;
 border:1px solid rgba(185,243,218,.24);
 border-radius:999px;
 color:var(--mint);
 font-size:12px;
 font-weight:800;
}
.metric-grid{
 display:grid;
 grid-template-columns:repeat(2,1fr);
 gap:14px;
}
.metric-cell{
 min-height:142px;
 padding:25px;
 border:1px solid var(--line);
 border-radius:18px;
 background:#fbfdfb;
 transition:all .25s ease;
}
.metric-cell:hover{
 border-color:#abd9c6;
 box-shadow:0 13px 28px rgba(19,58,50,.08);
 transform:translateY(-3px);
}
.metric-number{
 display:block;
 margin-bottom:9px;
 color:var(--green);
 font-size:32px;
 font-weight:900;
 line-height:1.1;
}
.metric-label{
 display:block;
 margin-bottom:5px;
 color:var(--deep);
 font-size:16px;
 font-weight:900;
}
.metric-note{
 display:block;
 color:var(--muted);
 font-size:13px;
}
.matrix-section{background:var(--paper)}
.matrix-layout{
 display:grid;
 grid-template-columns:.76fr 1.24fr;
 gap:18px;
}
.matrix-feature{
 display:flex;
 flex-direction:column;
 justify-content:space-between;
 min-height:365px;
 padding:32px;
 border-radius:var(--radius);
 background:var(--mint);
 color:var(--deep);
}
.matrix-feature .tag{color:var(--green)}
.matrix-feature h3{
 max-width:390px;
 margin:20px 0 12px;
 font-size:32px;
 font-weight:900;
}
.matrix-feature p{
 max-width:410px;
 margin-bottom:25px;
 color:#477269;
 font-size:15px;
}
.text-link{
 display:inline-flex;
 align-items:center;
 gap:8px;
 color:var(--deep);
 font-size:14px;
 font-weight:900;
}
.text-link span{
 font-size:19px;
 line-height:1;
 transition:transform .25s ease;
}
.text-link:hover{color:var(--green)}
.text-link:hover span{transform:translateX(4px)}
.matrix-list{
 display:grid;
 grid-template-columns:repeat(2,1fr);
 gap:14px;
}
.matrix-item{
 position:relative;
 display:flex;
 flex-direction:column;
 min-height:175px;
 padding:24px;
 border:1px solid var(--line);
 border-radius:18px;
 background:#fff;
 transition:all .25s ease;
}
.matrix-item:nth-child(3){grid-column:1 / -1}
.matrix-item:hover{
 border-color:#abd9c6;
 box-shadow:var(--shadow);
 transform:translateY(-4px);
}
.matrix-index{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 width:34px;
 height:34px;
 margin-bottom:20px;
 border-radius:10px;
 background:#edf4ef;
 color:var(--green);
 font-size:12px;
 font-weight:900;
}
.matrix-item h3{
 margin-bottom:8px;
 color:var(--deep);
 font-size:19px;
 font-weight:900;
}
.matrix-item p{
 margin:0;
 color:var(--muted);
 font-size:14px;
}
.matrix-arrow{
 position:absolute;
 right:23px;
 top:24px;
 color:var(--green);
 font-size:20px;
}
.compare-section{background:var(--white)}
.compare-layout{
 display:grid;
 grid-template-columns:.7fr 1.3fr;
 gap:20px;
 align-items:stretch;
}
.compare-copy{
 display:flex;
 flex-direction:column;
 justify-content:space-between;
 padding:31px;
 border:1px solid #f2dec0;
 border-radius:var(--radius);
 background:var(--warm);
}
.compare-copy h3{
 margin:18px 0 12px;
 color:#5f3a18;
 font-size:30px;
 font-weight:900;
}
.compare-copy p{
 margin-bottom:25px;
 color:#866541;
 font-size:14px;
}
.compare-highlight{
 display:flex;
 align-items:flex-start;
 gap:13px;
 padding-top:18px;
 border-top:1px solid rgba(154,91,29,.18);
}
.compare-highlight strong{
 color:var(--warm-ink);
 font-size:27px;
 line-height:1;
}
.compare-highlight span{
 color:#866541;
 font-size:13px;
}
.compare-box{
 overflow:hidden;
 border:1px solid var(--line);
 border-radius:var(--radius);
 background:#fff;
 box-shadow:0 8px 25px rgba(19,58,50,.04);
}
.compare-head,
.compare-row{
 display:grid;
 grid-template-columns:.82fr 1fr 1fr;
 gap:18px;
}
.compare-head{
 padding:19px 24px;
 background:var(--deep);
 color:#fff;
 font-size:14px;
 font-weight:900;
}
.compare-row{
 align-items:center;
 padding:20px 24px;
 border-bottom:1px solid var(--line);
}
.compare-row:last-child{border-bottom:0}
.compare-row strong{
 color:var(--deep);
 font-size:15px;
}
.compare-row span{
 color:var(--muted);
 font-size:14px;
}
.compare-note{
 margin-top:14px;
 color:var(--muted);
 font-size:12px;
}
.compare-note strong{color:var(--green)}
.timeline-section{background:#edf5f0}
.timeline-wrap{
 position:relative;
 display:grid;
 grid-template-columns:repeat(4,1fr);
 gap:0;
 padding-top:36px;
}
.timeline-wrap::before{
 content:"";
 position:absolute;
 top:49px;
 left:9%;
 right:9%;
 height:1px;
 background:#bdd8cb;
}
.timeline-item{
 position:relative;
 padding:0 16px;
}
.timeline-dot{
 position:relative;
 z-index:1;
 width:27px;
 height:27px;
 margin:0 auto 25px;
 border:6px solid #edf5f0;
 border-radius:50%;
 background:var(--green);
 box-shadow:0 0 0 1px #acd0bf;
}
.timeline-content{
 min-height:180px;
 padding:24px;
 border:1px solid #d2e5dc;
 border-radius:18px;
 background:rgba(255,255,255,.72);
}
.timeline-stage{
 display:block;
 margin-bottom:10px;
 color:var(--green);
 font-size:12px;
 font-weight:900;
}
.timeline-content h3{
 margin-bottom:9px;
 color:var(--deep);
 font-size:19px;
 font-weight:900;
}
.timeline-content p{
 margin:0;
 color:var(--muted);
 font-size:14px;
}
.updates-section{background:var(--paper)}
.updates-layout{
 display:grid;
 grid-template-columns:1.08fr .92fr;
 gap:20px;
}
.update-lead{
 overflow:hidden;
 display:grid;
 grid-template-columns:.88fr 1.12fr;
 border:1px solid var(--line);
 border-radius:var(--radius);
 background:#fff;
 box-shadow:0 8px 25px rgba(19,58,50,.04);
}
.update-image{
 min-height:330px;
 background:var(--deep);
}
.update-image img{
 width:100%;
 height:100%;
 object-fit:cover;
}
.update-copy{
 display:flex;
 flex-direction:column;
 align-items:flex-start;
 padding:29px;
}
.article-meta{
 display:inline-flex;
 align-items:center;
 gap:8px;
 margin-bottom:15px;
 color:var(--green);
 font-size:12px;
 font-weight:900;
}
.article-meta::before{
 content:"";
 width:7px;
 height:7px;
 border-radius:50%;
 background:var(--orange);
}
.update-copy h3{
 margin-bottom:12px;
 color:var(--deep);
 font-size:25px;
 font-weight:900;
}
.update-copy p{
 flex:1;
 margin-bottom:22px;
 color:var(--muted);
 font-size:14px;
}
.update-list{
 display:grid;
 gap:14px;
}
.article-card{
 display:flex;
 flex-direction:column;
 min-height:154px;
 padding:24px;
 border:1px solid var(--line);
 border-radius:18px;
 background:#fff;
 transition:all .25s ease;
}
.article-card:hover{
 border-color:#abd9c6;
 box-shadow:var(--shadow);
 transform:translateY(-3px);
}
.article-card h3{
 margin-bottom:8px;
 color:var(--deep);
 font-size:19px;
 font-weight:900;
}
.article-card p{
 margin:0;
 color:var(--muted);
 font-size:14px;
}
.update-footer{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:20px;
 margin-top:28px;
 padding-top:22px;
 border-top:1px solid var(--line);
}
.update-footer span{
 color:var(--muted);
 font-size:14px;
}
.dark-section{
 background:var(--deep);
 color:#fff;
}
.dark-section h2,
.dark-section h3{color:#fff}
.dark-section .section-head p{color:#b6cbc5}
.assurance-layout{
 display:grid;
 grid-template-columns:1fr .88fr;
 gap:65px;
 align-items:center;
}
.assurance-copy h2{
 margin:13px 0 17px;
 font-size:44px;
 font-weight:900;
}
.assurance-copy > p{
 max-width:580px;
 color:#b8cbc7;
 font-size:16px;
}
.assurance-list{
 display:grid;
 gap:0;
 margin-top:28px;
}
.assurance-item{
 display:flex;
 gap:16px;
 padding:18px 0;
 border-bottom:1px solid rgba(255,255,255,.13);
}
.assurance-item:last-child{border-bottom:0}
.assurance-mark{
 flex:0 0 34px;
 display:grid;
 place-items:center;
 width:34px;
 height:34px;
 border-radius:10px;
 background:rgba(185,243,218,.12);
 color:var(--mint);
 font-size:11px;
 font-weight:900;
}
.assurance-item h3{
 margin:0 0 5px;
 font-size:17px;
}
.assurance-item p{
 margin:0;
 color:#b8cbc7;
 font-size:14px;
}
.assurance-side{
 padding:27px;
 border:1px solid rgba(185,243,218,.2);
 border-radius:var(--radius);
 background:rgba(255,255,255,.07);
}
.assurance-card-label{
 display:block;
 margin-bottom:8px;
 color:var(--mint);
 font-size:12px;
 font-weight:900;
}
.assurance-side h3{
 margin-bottom:22px;
 font-size:26px;
}
.signal-row{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:15px;
 padding:17px 0;
 border-bottom:1px solid rgba(255,255,255,.12);
}
.signal-row:last-child{border-bottom:0}
.signal-row span{
 color:#b8cbc7;
 font-size:14px;
}
.signal-value{
 color:var(--mint)!important;
 font-weight:800;
}
.signal-pips{
 display:flex;
 gap:5px;
}
.pip{
 width:21px;
 height:6px;
 border-radius:999px;
 background:rgba(255,255,255,.16);
}
.pip.on{background:var(--mint)}
.quick-section{background:var(--white)}
.answer-layout{
 display:grid;
 grid-template-columns:.58fr 1.42fr;
 gap:32px;
 align-items:start;
}
.answer-intro h2{
 margin:13px 0 14px;
 color:var(--deep);
 font-size:38px;
 font-weight:900;
}
.answer-intro p{
 max-width:330px;
 margin:0;
 color:var(--muted);
 font-size:14px;
}
.answer-grid{
 display:grid;
 grid-template-columns:repeat(3,1fr);
 gap:14px;
}
.answer-item{
 min-height:205px;
 padding:25px;
 border:1px solid var(--line);
 border-radius:18px;
 background:#fbfdfb;
 transition:all .25s ease;
}
.answer-item:hover{
 border-color:#abd9c6;
 box-shadow:var(--shadow);
 transform:translateY(-3px);
}
.answer-number{
 display:block;
 margin-bottom:22px;
 color:var(--orange);
 font-size:13px;
 font-weight:900;
}
.answer-item h3{
 margin-bottom:9px;
 color:var(--deep);
 font-size:18px;
 font-weight:900;
}
.answer-item p{
 margin:0;
 color:var(--muted);
 font-size:14px;
}
.faq-section{background:var(--paper)}
.faq-layout{
 display:grid;
 grid-template-columns:.72fr 1.28fr;
 gap:50px;
 align-items:start;
}
.faq-layout .section-head{margin-bottom:0}
.faq-stack{
 border-top:1px solid var(--line);
}
.faq{
 padding:20px 0;
 border-bottom:1px solid var(--line);
}
.faq summary{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:20px;
 list-style:none;
 cursor:pointer;
 color:var(--deep);
 font-size:18px;
 font-weight:900;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
 content:"+";
 flex:0 0 auto;
 color:var(--green);
 font-size:24px;
 font-weight:400;
 line-height:1;
}
.faq[open] summary::after{content:"-"}
.faq p{
 max-width:720px;
 margin:13px 35px 0 0;
 color:var(--muted);
 font-size:14px;
}
.contact-section{
 background:var(--mint);
}
.form-shell{
 display:grid;
 grid-template-columns:.86fr 1.14fr;
 gap:50px;
 align-items:start;
}
.contact-copy h2{
 margin:13px 0 16px;
 color:var(--deep);
 font-size:43px;
 font-weight:900;
}
.contact-copy > p{
 max-width:480px;
 margin-bottom:28px;
 color:#477269;
 font-size:16px;
}
.contact-points{
 display:grid;
 gap:14px;
}
.contact-point{
 display:flex;
 align-items:flex-start;
 gap:12px;
}
.contact-bullet{
 flex:0 0 30px;
 display:grid;
 place-items:center;
 width:30px;
 height:30px;
 border-radius:9px;
 background:var(--deep);
 color:var(--mint);
 font-size:12px;
 font-weight:900;
}
.contact-point strong{
 display:block;
 margin-bottom:2px;
 color:var(--deep);
 font-size:15px;
}
.contact-point span{
 display:block;
 color:#477269;
 font-size:13px;
}
.form-box{
 padding:29px;
 border:1px solid rgba(15,57,53,.1);
 border-radius:24px;
 background:#fff;
 box-shadow:var(--shadow);
}
.form-label{
 display:block;
 margin-bottom:7px;
 color:var(--deep);
 font-size:13px;
 font-weight:800;
}
.form-control,
.form-select{
 width:100%;
 min-height:48px;
 padding:12px 14px;
 border:1px solid var(--line);
 border-radius:11px;
 color:var(--ink);
 background:#fbfdfb;
}
textarea.form-control{
 min-height:125px;
 resize:vertical;
}
.form-control::placeholder{color:#9aa9a6}
.form-control:focus,
.form-select:focus{
 border-color:var(--green);
 box-shadow:0 0 0 4px rgba(17,139,104,.1);
 outline:0;
}
.form-note{
 margin:12px 0 0;
 color:var(--muted);
 font-size:12px;
}
.form-status{
 min-height:25px;
 margin-top:12px;
 color:var(--green);
 font-size:13px;
 font-weight:800;
}
.form-box .btn-main{width:100%}
.site-footer{
 padding:55px 0 25px;
 background:#102d2b;
 color:#c0d0cb;
}
.footer-grid{
 display:grid;
 grid-template-columns:1.5fr 1fr 1fr;
 gap:50px;
}
.footer-brand{
 margin-bottom:15px;
 color:#fff;
 font-size:21px;
 font-weight:900;
}
.footer-grid p{
 max-width:360px;
 margin:0;
 color:#a9bfba;
 font-size:14px;
}
.footer-title{
 margin-bottom:14px;
 color:var(--mint);
 font-size:13px;
 font-weight:900;
}
.footer-links{
 display:grid;
 gap:8px;
 color:#c0d0cb;
 font-size:14px;
}
.footer-links a:hover{color:#fff}
.copyright{
 margin-top:40px;
 padding-top:20px;
 border-top:1px solid rgba(255,255,255,.13);
 color:#8ca49d;
 font-size:12px;
}
@media (max-width:1024px){
 .campaign-grid{gap:40px}
 .campaign-copy h1{font-size:50px}
 .assurance-layout{gap:35px}
 .update-lead{grid-template-columns:1fr}
 .update-image{min-height:245px}
 .faq-layout{gap:30px}
}
@media (max-width:768px){
 .container{width:min(var(--container),calc(100% - 32px))}
 .nav-wrap{
  min-height:70px;
  flex-wrap:wrap;
  gap:14px;
  padding:12px 0;
 }
 .nav-tabs{
  order:3;
  width:100%;
  justify-content:center;
  margin-left:0;
  overflow-x:auto;
 }
 .nav-action{margin-left:auto}
 section{padding:66px 0}
 .countdown-strip{
  align-items:flex-start;
  flex-direction:column;
  gap:12px;
  margin-bottom:38px;
 }
 .countdown-values{width:100%;justify-content:space-between}
 .countdown-item{flex:1}
 .campaign-grid,
 .metrics-board,
 .matrix-layout,
 .compare-layout,
 .assurance-layout,
 .answer-layout,
 .faq-layout,
 .form-shell{
  grid-template-columns:1fr;
 }
 .campaign-copy h1{font-size:44px}
 .campaign-copy p{font-size:16px}
 .hero-visual{max-width:620px}
 .section-head h2,
 .assurance-copy h2{font-size:38px}
 .matrix-feature{min-height:300px}
 .timeline-wrap{
  grid-template-columns:1fr 1fr;
  gap:22px 0;
 }
 .timeline-wrap::before{display:none}
 .timeline-item{padding:0 8px}
 .timeline-dot{margin-bottom:15px}
 .timeline-content{min-height:160px}
 .updates-layout{grid-template-columns:1fr}
 .answer-grid{grid-template-columns:repeat(3,1fr)}
 .footer-grid{grid-template-columns:1fr 1fr;gap:30px}
 .footer-grid > div:first-child{grid-column:1 / -1}
}
@media (max-width:520px){
 .container{width:calc(100% - 28px)}
 .brand{font-size:20px}
 .brand-mark{width:34px;height:34px}
 .nav-action{
  padding:9px 12px;
  font-size:12px;
 }
 .nav-tabs a{
  padding:8px 14px;
  font-size:13px;
 }
 .campaign-hero{padding:26px 0 55px}
 .campaign-copy h1{font-size:34px}
 .campaign-copy p{font-size:15px}
 .campaign-actions{
  flex-direction:column;
  align-items:stretch;
 }
 .campaign-actions a{width:100%}
 .hero-visual{
  min-height:315px;
  padding:10px;
 }
 .visual-image{height:290px}
 .visual-bottom{
  align-items:flex-start;
  flex-direction:column;
  gap:5px;
 }
 .visual-float{
  right:14px;
  bottom:22px;
 }
 .section-head h2,
 .assurance-copy h2{font-size:30px}
 .metric-grid,
 .matrix-list,
 .answer-grid{
  grid-template-columns:1fr;
 }
 .matrix-item:nth-child(3){grid-column:auto}
 .metric-cell{min-height:125px}
 .matrix-feature h3{font-size:27px}
 .compare-head,
 .compare-row{
  grid-template-columns:1fr;
  gap:7px;
 }
 .compare-head{padding:17px 19px}
 .compare-row{padding:17px 19px}
 .compare-head span:first-child{display:none}
 .timeline-wrap{grid-template-columns:1fr}
 .timeline-item{padding:0}
 .timeline-dot{margin:0 0 12px 4px}
 .timeline-content{min-height:0}
 .update-footer{
  align-items:flex-start;
  flex-direction:column;
 }
 .assurance-copy h2{margin-bottom:13px}
 .answer-intro h2{font-size:30px}
 .faq summary{font-size:16px}
 .faq p{margin-right:0}
 .form-box{padding:22px 18px}
 .contact-copy h2{font-size:32px}
 .footer-grid{grid-template-columns:1fr}
 .footer-grid > div:first-child{grid-column:auto}
}

/* roulang: framework shim */
/* 覆盖 Bootstrap 等对 a/btn 的全局默认，避免导航出现下划线/蓝链 */
.site-header a,.site-header a:hover,.navbar a,.navbar a:hover,.nav-links a,.nav-links a:hover,header nav a,header nav a:hover{text-decoration:none}
.site-header .btn,.navbar .btn,.nav-cta{text-decoration:none}
