/* roulang page: index */
:root{
      --bg:#f2f0eb;
      --bg-soft:#e9e7e0;
      --ink:#1b211d;
      --muted:#6d746c;
      --deep:#202922;
      --line:#d6d5cc;
      --accent:#b7d84b;
      --accent-hover:#c9ed5b;
      --card:#fbfaf6;
      --shadow:0 18px 45px rgba(31,40,31,.08);
      --radius:18px;
      --container:1240px;
      --space:clamp(72px,9vw,132px);
      --title-weight:800;
      --body-leading:1.85;
      --breakpoint:1024px;
    }
    *{box-sizing:border-box;margin:0;padding:0}
    html{scroll-behavior:smooth}
    body{
      background:var(--bg);
      color:var(--ink);
      font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
      line-height:var(--body-leading);
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none}
    img{display:block;width:100%;max-width:100%;object-fit:cover}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    ::selection{background:var(--accent);color:var(--deep)}
    .container{width:min(calc(100% - 48px),var(--container));margin-inline:auto}
    .eyebrow{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
    .eyebrow:before{content:"";display:block;width:24px;height:2px;background:var(--accent)}
    .section{padding-block:var(--space)}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:42px}
    .section-title{font-size:clamp(30px,4vw,58px);line-height:1.08;letter-spacing:-.06em;font-weight:var(--title-weight)}
    .section-intro{max-width:510px;color:var(--muted);font-size:15px;line-height:1.9}
    .nav-wrap{position:fixed;z-index:40;top:0;left:0;width:100%;transition:.3s ease}
    .nav-wrap.scrolled{background:rgba(242,240,235,.95);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
    .nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:26px}
    .logo{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:900;letter-spacing:-.05em;white-space:nowrap}
    .logo-mark{width:30px;height:30px;display:grid;place-items:center;background:var(--accent);border-radius:9px;font-size:12px;font-weight:900}
    .nav-links{display:flex;align-items:center;gap:22px;font-size:13px;color:#535b53}
    .nav-links a{position:relative;padding:8px 0;transition:.25s}
    .nav-links a:after{content:"";position:absolute;left:0;right:100%;bottom:1px;height:2px;background:var(--accent);transition:.25s}
    .nav-links a:hover,.nav-links a.active{color:var(--ink);font-weight:700}
    .nav-links a.active:after,.nav-links a:hover:after{right:0}
    .nav-tools{display:flex;align-items:center;gap:10px}
    .search-link,.menu-btn{border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--ink);padding:9px 13px;font-size:12px;transition:.25s}
    .search-link:hover,.menu-btn:hover{border-color:var(--ink);background:var(--card)}
    .menu-btn{display:none}
    .hero{min-height:760px;padding-top:76px;display:grid;grid-template-columns:47% 53%;background:var(--deep);color:#f7f6f0}
    .hero-copy{display:flex;flex-direction:column;justify-content:center;padding:72px max(30px,calc((100vw - var(--container))/2)) 72px 0}
    .hero .eyebrow{color:#bbc3b9}
    .hero-title{font-size:clamp(48px,7vw,104px);font-weight:900;line-height:.98;letter-spacing:-.085em;margin:25px 0 28px}
    .hero-title em{color:var(--accent);font-style:normal}
    .hero-desc{max-width:520px;color:#bdc5bc;font-size:16px;line-height:1.95}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:46px;padding:0 19px;border-radius:10px;border:1px solid transparent;font-size:13px;font-weight:700;transition:.25s ease}
    .btn:focus,.search-link:focus,.menu-btn:focus,input:focus,select:focus,textarea:focus,summary:focus{outline:3px solid rgba(183,216,75,.55);outline-offset:3px}
    .btn:active{transform:scale(.97)}
    .btn-primary{background:var(--accent);color:var(--deep)}
    .btn-primary:hover{background:var(--accent-hover);transform:translateY(-2px)}
    .btn-outline{border-color:#59645a;color:#f7f6f0}
    .btn-outline:hover{background:#f7f6f0;color:var(--deep);border-color:#f7f6f0}
    .btn-light{background:var(--card);color:var(--deep)}
    .btn-light:hover{background:var(--accent);transform:translateY(-2px)}
    .btn-arrow{padding:0;background:none;color:var(--ink);min-height:auto}
    .btn-arrow span{transition:.25s}
    .btn-arrow:hover span{transform:translateX(5px)}
    .hero-meta{display:flex;gap:28px;margin-top:52px;padding-top:20px;border-top:1px solid #485248;color:#aeb7ae;font-size:12px}
    .hero-meta strong{display:block;color:#f7f6f0;font-size:20px;line-height:1.2;margin-bottom:4px}
    .hero-visual{position:relative;min-height:684px;overflow:hidden}
    .hero-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--deep) 0%,transparent 20%),linear-gradient(0deg,rgba(14,20,15,.55),transparent 45%)}
    .hero-visual img{height:100%;filter:saturate(.8);object-position:center}
    .vertical-panel{position:absolute;z-index:2;right:8%;bottom:8%;width:265px;padding:22px;background:rgba(31,41,34,.9);border:1px solid rgba(183,216,75,.5);border-radius:16px;color:#f5f6ee;box-shadow:var(--shadow)}
    .vertical-panel .mini-label{color:var(--accent);font-size:11px;letter-spacing:.14em}
    .vertical-panel h3{font-size:24px;line-height:1.2;margin:14px 0 18px}
    .panel-row{display:flex;justify-content:space-between;padding:11px 0;border-top:1px solid #4e5b4d;font-size:12px;color:#bfc8bf}
    .panel-row b{color:#fff}
    .metrics{background:var(--card);border-bottom:1px solid var(--line)}
    .metric-grid{display:grid;grid-template-columns:1.35fr repeat(4,1fr);border-left:1px solid var(--line)}
    .metric{min-height:145px;padding:25px 22px;border-right:1px solid var(--line);border-top:1px solid var(--line)}
    .metric.big{background:var(--accent)}
    .metric small{display:block;font-size:11px;color:var(--muted);margin-bottom:12px}
    .metric.big small{color:#40522a}
    .metric strong{font-size:clamp(28px,4vw,52px);line-height:1;font-weight:900;letter-spacing:-.07em}
    .metric p{font-size:12px;color:var(--muted);margin-top:12px}
    .metric.big p{color:#40522a}
    .trend{height:27px;margin-top:17px;display:flex;align-items:end;gap:4px}
    .trend i{display:block;width:9px;background:#7da52b;border-radius:3px 3px 0 0}
    .trend i:nth-child(1){height:8px}.trend i:nth-child(2){height:14px}.trend i:nth-child(3){height:11px}.trend i:nth-child(4){height:22px}.trend i:nth-child(5){height:18px}.trend i:nth-child(6){height:27px}
    .matrix{background:var(--bg)}
    .matrix-layout{display:grid;grid-template-columns:1.4fr .8fr;gap:18px}
    .feature-card{position:relative;min-height:430px;padding:34px;display:flex;flex-direction:column;justify-content:end;overflow:hidden;border-radius:var(--radius);color:#fff;background:var(--deep)}
    .feature-card img{position:absolute;inset:0;height:100%;opacity:.52;transition:.45s}
    .feature-card:hover img{transform:scale(1.04);opacity:.65}
    .feature-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(18,25,19,.94),transparent 70%)}
    .feature-content{position:relative;z-index:1}
    .feature-content h3{font-size:clamp(28px,4vw,46px);line-height:1.1;letter-spacing:-.06em;margin:13px 0}
    .feature-content p{max-width:500px;color:#d0d7ce;font-size:14px}
    .tag{display:inline-flex;padding:5px 9px;border-radius:6px;background:#e2e4db;color:#526050;font-size:11px;line-height:1.2;font-weight:700}
    .tag.accent{background:var(--accent);color:var(--deep)}
    .matrix-side{display:grid;gap:18px}
    .topic-item{display:flex;flex-direction:column;justify-content:space-between;min-height:206px;padding:25px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);transition:.28s}
    .topic-item:hover{transform:translateY(-4px);border-color:#a5bc63;box-shadow:var(--shadow)}
    .topic-item h3{font-size:24px;line-height:1.2;letter-spacing:-.04em}
    .topic-item p{font-size:13px;color:var(--muted);line-height:1.7;margin-top:9px}
    .topic-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:22px}
    .scene{background:var(--bg-soft)}
    .scene-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
    .scene-main{grid-column:span 7;padding:42px;background:var(--card);border-radius:var(--radius);border:1px solid var(--line)}
    .scene-main h3{font-size:38px;line-height:1.15;letter-spacing:-.06em;margin:18px 0}
    .scene-main p,.long-copy{font-size:14px;color:var(--muted);line-height:2}
    .scene-list{grid-column:span 5;display:grid;gap:18px}
    .scene-row{display:grid;grid-template-columns:58px 1fr auto;align-items:center;gap:18px;padding:23px;background:var(--deep);color:#f7f6f0;border-radius:14px}
    .scene-row .number{font-size:27px;color:var(--accent);font-weight:800}
    .scene-row h4{font-size:16px}
    .scene-row p{font-size:12px;color:#b5c0b4;line-height:1.6;margin-top:4px}
    .scene-row b{font-size:20px;color:var(--accent)}
    .stage{background:var(--deep);color:#f6f7f1}
    .stage .section-intro{color:#aeb8ac}
    .stage-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:55px;align-items:center}
    .stage-copy h3{font-size:clamp(33px,4.4vw,65px);line-height:1.05;letter-spacing:-.08em;margin:20px 0}
    .stage-copy p{color:#bbc4b9;font-size:15px;line-height:2}
    .stage-note{display:flex;gap:15px;margin-top:30px;padding-top:20px;border-top:1px solid #465147;color:#aeb9ad;font-size:12px}
    .dashboard{position:relative;padding:20px;background:#daddd2;border-radius:22px;box-shadow:0 25px 70px rgba(0,0,0,.22);transform:rotate(1.5deg)}
    .dash-bar{height:34px;display:flex;align-items:center;gap:6px;border-bottom:1px solid #c0c8bb;color:#647064;font-size:11px}
    .dash-dot{width:7px;height:7px;border-radius:50%;background:#a9b1a6}
    .dash-inner{display:grid;grid-template-columns:1.3fr .7fr;gap:13px;padding-top:15px}
    .dash-large,.dash-small{background:#f9faf5;border-radius:12px;padding:18px;color:var(--ink)}
    .dash-large{min-height:260px}
    .dash-small{min-height:123px;margin-bottom:13px}
    .dash-large h4{font-size:20px;margin:10px 0}
    .dash-line{height:90px;display:flex;align-items:end;gap:7px;border-bottom:2px solid #cad3c4;margin-top:20px}
    .dash-line i{flex:1;background:var(--accent);border-radius:4px 4px 0 0}
    .dash-line i:nth-child(1){height:28%}.dash-line i:nth-child(2){height:48%}.dash-line i:nth-child(3){height:39%}.dash-line i:nth-child(4){height:70%}.dash-line i:nth-child(5){height:57%}.dash-line i:nth-child(6){height:85%}
    .dash-small strong{font-size:29px;display:block;line-height:1.1;margin:8px 0}
    .compare{background:var(--bg)}
    .compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
    .compare-card{padding:36px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}
    .compare-card.dark{background:var(--deep);color:#f7f8f1;border-color:var(--deep)}
    .compare-label{display:flex;justify-content:space-between;align-items:center;padding-bottom:22px;border-bottom:1px solid var(--line);font-size:12px;color:var(--muted)}
    .dark .compare-label{border-color:#4b584d;color:#aeb9ae}
    .compare-card h3{font-size:32px;line-height:1.15;letter-spacing:-.05em;margin:26px 0 20px}
    .compare-card p{font-size:14px;color:var(--muted);line-height:1.95}
    .dark p{color:#b8c2b7}
    .compare-list{list-style:none;margin-top:25px;display:grid;gap:12px}
    .compare-list li{display:flex;gap:10px;font-size:13px}
    .compare-list li:before{content:"＋";color:#86a92c;font-weight:800}
    .trust{background:var(--card);border-block:1px solid var(--line)}
    .trust-grid{display:grid;grid-template-columns:1fr 2fr;gap:70px}
    .trust h3{font-size:38px;line-height:1.14;letter-spacing:-.06em;margin-top:20px}
    .trust-copy{font-size:15px;color:var(--muted);line-height:2}
    .trust-copy p+p{margin-top:19px}
    .quote{padding:28px 0 28px 30px;border-left:3px solid var(--accent);font-size:21px;line-height:1.55;letter-spacing:-.03em}
    .quote small{display:block;color:var(--muted);font-size:12px;margin-top:16px}
    .vertical{background:var(--bg-soft)}
    .vertical-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}
    .vertical-feature{display:grid;grid-template-columns:.9fr 1.1fr;gap:25px;padding:24px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}
    .vertical-feature img{height:360px;border-radius:13px}
    .vertical-feature h3{font-size:33px;line-height:1.15;letter-spacing:-.06em;margin:20px 0}
    .vertical-feature p{color:var(--muted);font-size:14px;line-height:1.9}
    .vertical-stack{display:grid;grid-template-columns:1fr 1fr;gap:18px}
    .v-card{min-height:250px;padding:22px;border-radius:var(--radius);background:var(--deep);color:#fff;display:flex;flex-direction:column;justify-content:end;overflow:hidden;position:relative}
    .v-card img{position:absolute;inset:0;height:100%;opacity:.42}
    .v-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(20,28,21,.94),transparent 75%)}
    .v-card div{position:relative;z-index:1}
    .v-card h4{font-size:20px;line-height:1.3;margin-top:12px}
    .v-card p{font-size:12px;color:#c3cdc0;margin-top:6px}
    .news{background:var(--bg)}
    .news-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:50px}
    .lead-news{border-top:3px solid var(--ink);padding-top:24px}
    .lead-news img{height:330px;border-radius:15px;margin-bottom:24px}
    .news-date{font-size:11px;color:var(--muted);letter-spacing:.08em}
    .lead-news h3{font-size:34px;line-height:1.2;letter-spacing:-.05em;margin:11px 0}
    .news-summary{font-size:14px;color:var(--muted);line-height:1.9}
    .news-list{border-top:1px solid var(--line)}
    .news-item{padding:21px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:80px 1fr;gap:15px}
    .news-item h4{font-size:17px;line-height:1.45;margin-bottom:5px}
    .news-item p{font-size:12px;color:var(--muted);line-height:1.7}
    .news-item .btn-arrow{margin-top:8px;font-size:12px}
    .timeline{background:var(--card);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .timeline-track{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line)}
    .time-node{position:relative;padding:30px 24px 10px;border-right:1px solid var(--line)}
    .time-node:first-child{border-left:1px solid var(--line)}
    .time-node:before{content:"";position:absolute;top:-6px;left:24px;width:11px;height:11px;border-radius:50%;background:var(--accent);border:3px solid var(--card)}
    .time-node strong{font-size:13px;color:#779329}
    .time-node h3{font-size:22px;line-height:1.25;margin:18px 0 10px}
    .time-node p{font-size:13px;color:var(--muted);line-height:1.8}
    .faq{background:var(--bg)}
    .faq-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px}
    .faq-side p{margin-top:20px;color:var(--muted);font-size:14px;line-height:1.9}
    .faq-list{border-top:1px solid var(--line)}
    details{border-bottom:1px solid var(--line);padding:20px 0}
    summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;font-size:16px;font-weight:700}
    summary::-webkit-details-marker{display:none}
    summary:after{content:"＋";color:#809e32;font-size:22px;font-weight:400}
    details[open] summary:after{content:"－"}
    details p{max-width:720px;padding:14px 35px 3px 0;font-size:14px;color:var(--muted);line-height:1.9}
    .form-section{background:var(--accent)}
    .form-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:70px}
    .form-section .section-title{color:var(--deep)}
    .form-copy{color:#52622f;font-size:14px;line-height:1.9;margin-top:20px}
    .privacy{display:block;color:#66763b;font-size:11px;margin-top:24px}
    .form-box{padding:30px;background:rgba(250,250,242,.8);border-radius:16px;border:1px solid rgba(31,41,34,.16)}
    .form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}
    .field{display:flex;flex-direction:column;gap:7px;margin-bottom:17px}
    .field label{font-size:12px;font-weight:700}
    .field input,.field select,.field textarea{width:100%;border:1px solid #c5caaf;background:#fffef8;border-radius:9px;padding:12px 13px;font-size:13px;color:var(--ink);transition:.2s}
    .field textarea{min-height:105px;resize:vertical}
    .field input::placeholder,.field textarea::placeholder{color:#9da498}
    .field input:invalid:not(:placeholder-shown){border-color:#bd6d58;background:#fff7f4}
    .field input:disabled{background:#e2e5d7;color:#9ba28d;cursor:not-allowed}
    .form-status{font-size:12px;color:#52622f;margin-top:12px;min-height:20px}
    footer{background:var(--deep);color:#f5f6ef;padding:66px 0 28px}
    .footer-top{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:35px;padding-bottom:58px}
    .footer-brand p{max-width:280px;color:#aeb8ac;font-size:13px;line-height:1.9;margin-top:18px}
    footer h4{font-size:13px;margin-bottom:16px}
    .footer-links{display:grid;gap:10px;color:#aeb8ac;font-size:12px}
    .footer-links a{transition:.2s}
    .footer-links a:hover{color:var(--accent)}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:22px;border-top:1px solid #465148;color:#929d92;font-size:11px}
    .reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}
    .reveal.visible{opacity:1;transform:none}
    @media(max-width:1024px){
      .nav-links{gap:13px}.nav-links a{font-size:12px}
      .hero{grid-template-columns:1fr;min-height:auto}.hero-copy{padding:120px 24px 60px}.hero-visual{min-height:520px}
      .metric-grid{grid-template-columns:repeat(3,1fr)}.metric.big{grid-column:span 2}
      .matrix-layout,.stage-grid,.news-grid,.faq-grid,.form-grid{grid-template-columns:1fr;gap:34px}
      .trust-grid{grid-template-columns:1fr;gap:25px}.vertical-grid{grid-template-columns:1fr}
      .footer-top{grid-template-columns:repeat(2,1fr)}
    }
    @media(max-width:768px){
      .container{width:min(calc(100% - 32px),var(--container))}
      .nav{height:68px}.nav-links{display:none;position:absolute;top:68px;left:16px;right:16px;padding:16px;background:var(--card);border:1px solid var(--line);border-radius:13px;box-shadow:var(--shadow);flex-direction:column;align-items:flex-start;gap:5px}
      .nav-links.open{display:flex}.menu-btn{display:block}.search-link{display:none}
      .hero-copy{padding-top:105px}.hero-title{font-size:clamp(49px,15vw,82px)}
      .hero-visual{min-height:430px}.vertical-panel{right:5%;bottom:5%;width:235px}
      .metric-grid{display:grid;grid-template-columns:1fr 1fr}.metric.big{grid-column:span 2}
      .section-head{display:block;margin-bottom:28px}.section-intro{margin-top:17px}
      .scene-grid,.compare-grid{display:block}.scene-main{margin-bottom:18px}.scene-row{margin-bottom:12px}
      .vertical-feature{grid-template-columns:1fr}.vertical-feature img{height:280px}.vertical-stack{margin-top:18px}
      .timeline-track{grid-template-columns:1fr 1fr}.time-node{min-height:210px}
      .form-row{grid-template-columns:1fr}.footer-top{grid-template-columns:1fr 1fr;gap:30px}
    }
    @media(max-width:520px){
      .section{padding-block:68px}.hero-meta{gap:16px;flex-wrap:wrap}.hero-meta strong{font-size:17px}
      .metric{padding:20px 15px;min-height:130px}.metric strong{font-size:31px}
      .scene-main{padding:25px}.scene-main h3{font-size:30px}.scene-row{grid-template-columns:42px 1fr auto;padding:17px 14px;gap:10px}
      .stage-grid{gap:28px}.dashboard{transform:none;padding:12px}.dash-inner{grid-template-columns:1fr}.dash-small{min-height:auto;margin:0 0 12px}
      .dash-large{min-height:220px}.lead-news img{height:230px}.lead-news h3{font-size:28px}
      .news-item{grid-template-columns:1fr}.timeline-track{grid-template-columns:1fr}.time-node{border-left:1px solid var(--line)!important;min-height:auto;padding-bottom:30px}
      .form-box{padding:20px}.footer-top{grid-template-columns:1fr}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:8px}
    }
    @media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
    @media print{.nav-wrap{position:static}.hero{color:#000;background:#fff}.hero-visual{display:none}.section{padding-block:35px}}

/* roulang page: category1 */
:root{
      --bg:#f2f0eb;
      --bg-soft:#e9e7e0;
      --ink:#1b211d;
      --muted:#6d746c;
      --deep:#202922;
      --line:#d6d5cc;
      --accent:#b7d84b;
      --accent-hover:#c9ed5b;
      --card:#fbfaf6;
      --shadow:0 18px 45px rgba(31,40,31,.08);
      --radius:18px;
      --container:1240px;
      --space:clamp(72px,9vw,132px);
      --title-weight:800;
      --body-leading:1.85;
      --breakpoint:1024px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--bg);color:var(--ink);font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;line-height:var(--body-leading);overflow-x:hidden}
    a{color:inherit;text-decoration:none}
    img{display:block;width:100%;max-width:100%;object-fit:cover}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    .container{width:min(calc(100% - 48px),var(--container));margin-inline:auto}
    .eyebrow{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
    .eyebrow:before{content:"";display:block;width:24px;height:2px;background:var(--accent)}
    .section{padding-block:var(--space)}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:42px}
    .section-title{font-size:clamp(30px,4vw,58px);line-height:1.08;letter-spacing:-.06em;font-weight:var(--title-weight);margin:10px 0 0}
    .section-intro{max-width:510px;color:var(--muted);font-size:15px;line-height:1.9}
    .nav-wrap{position:fixed;z-index:40;top:0;left:0;width:100%;transition:.3s ease}
    .nav-wrap.scrolled{background:rgba(242,240,235,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
    .nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:26px}
    .logo{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:900;letter-spacing:-.05em;white-space:nowrap}
    .logo-mark{width:30px;height:30px;display:grid;place-items:center;background:var(--accent);border-radius:9px;font-size:12px;font-weight:900}
    .nav-links{display:flex;align-items:center;gap:21px;font-size:13px;color:#535b53}
    .nav-links a{position:relative;padding:8px 0;transition:.25s}
    .nav-links a:after{content:"";position:absolute;left:0;right:100%;bottom:1px;height:2px;background:var(--accent);transition:.25s}
    .nav-links a:hover,.nav-links a.active{color:var(--ink);font-weight:700}
    .nav-links a.active:after,.nav-links a:hover:after{right:0}
    .nav-tools{display:flex;align-items:center;gap:10px}
    .search-link,.menu-btn{border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--ink);padding:9px 13px;font-size:12px;transition:.25s}
    .search-link:hover,.menu-btn:hover{border-color:var(--ink);background:var(--card)}
    .menu-btn{display:none}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:46px;padding:0 19px;border-radius:10px;border:1px solid transparent;font-size:13px;font-weight:700;transition:.25s ease}
    .btn:focus,.search-link:focus,.menu-btn:focus,input:focus,select:focus,textarea:focus,summary:focus{outline:3px solid rgba(183,216,75,.55);outline-offset:3px}
    .btn:active{transform:scale(.97)}
    .btn-primary{background:var(--accent);color:var(--deep)}
    .btn-primary:hover{background:var(--accent-hover);transform:translateY(-2px)}
    .btn-outline{border-color:#59645a;color:#f7f6f0}
    .btn-outline:hover{background:#f7f6f0;color:var(--deep)}
    .btn-dark{background:var(--deep);color:#f7f6f0}
    .btn-dark:hover{background:#354137;transform:translateY(-2px)}
    .btn-arrow{padding:0;background:none;color:var(--ink);min-height:auto}
    .btn-arrow span{transition:.25s}
    .btn-arrow:hover span{transform:translateX(5px)}
    .hero-news{padding-top:76px;background:var(--deep);color:#f7f6f0}
    .hero-news-inner{padding-block:clamp(70px,10vw,128px) 48px}
    .hero-news-copy{display:grid;grid-template-columns:1fr 370px;gap:54px;align-items:end}
    .hero-title{font-size:clamp(50px,8vw,108px);font-weight:900;line-height:.96;letter-spacing:-.09em;margin:24px 0}
    .hero-title em{color:var(--accent);font-style:normal}
    .hero-desc{max-width:620px;color:#c4ccc2;font-size:16px;line-height:1.95}
    .update-box{border-left:1px solid #536052;padding-left:24px;color:#bdc6bb}
    .update-box strong{display:block;color:#fff;font-size:30px;line-height:1.2;margin:10px 0}
    .hero-image{height:330px;margin-top:52px;position:relative;overflow:hidden;border-radius:18px}
    .hero-image:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,29,21,.62),transparent 55%),linear-gradient(0deg,rgba(20,29,21,.45),transparent)}
    .hero-image img{height:100%;object-position:center 48%;filter:saturate(.82)}
    .hero-image-caption{position:absolute;z-index:2;left:32px;bottom:28px;max-width:560px}
    .hero-image-caption h2{font-size:clamp(24px,3vw,42px);line-height:1.15;letter-spacing:-.05em;margin:12px 0 0}
    .tag{display:inline-flex;padding:5px 9px;border-radius:6px;background:#e2e4db;color:#526050;font-size:11px;line-height:1.2;font-weight:700}
    .tag.accent{background:var(--accent);color:var(--deep)}
    .metric-strip{display:grid;grid-template-columns:1.4fr repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .metric{padding:28px 24px;border-right:1px solid var(--line)}
    .metric:last-child{border-right:0}
    .metric strong{display:block;font-size:clamp(27px,4vw,48px);line-height:1.1;letter-spacing:-.07em}
    .metric span{display:block;color:var(--muted);font-size:12px;margin-top:7px}
    .lead-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(260px,.75fr);gap:22px}
    .lead-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
    .lead-card img{height:340px}
    .lead-body{padding:30px 34px 34px}
    .lead-body h2{font-size:clamp(28px,4vw,48px);line-height:1.13;letter-spacing:-.06em;margin:14px 0}
    .lead-body p,.story p{color:var(--muted);font-size:14px}
    .timeline{padding:24px 28px;background:var(--deep);color:#f7f6f0;border-radius:var(--radius)}
    .timeline h3{margin:0 0 18px;font-size:22px}
    .timeline-item{position:relative;padding:16px 0 16px 22px;border-top:1px solid #4b584b}
    .timeline-item:before{content:"";position:absolute;left:0;top:23px;width:7px;height:7px;background:var(--accent);border-radius:50%}
    .timeline-item time{font-size:11px;color:#aeb9ad}
    .timeline-item p{font-size:13px;line-height:1.6;margin:4px 0 0;color:#e0e5de}
    .topic-grid{display:grid;grid-template-columns:1.1fr .9fr .9fr;gap:18px}
    .topic-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.28s}
    .topic-card:hover{transform:translateY(-5px);border-color:#a8be69;box-shadow:var(--shadow)}
    .topic-card:first-child{grid-row:span 2}
    .topic-card img{height:190px}
    .topic-card:first-child img{height:300px}
    .topic-card-content{padding:23px}
    .topic-card h3{font-size:24px;line-height:1.25;letter-spacing:-.04em;margin:13px 0 8px}
    .topic-card p{font-size:13px;color:var(--muted);margin:0 0 20px}
    .index-band{background:var(--bg-soft);border-block:1px solid var(--line)}
    .index-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
    .index-item{background:var(--bg-soft);padding:25px}
    .index-item b{display:block;font-size:30px;line-height:1;margin-bottom:9px}
    .index-item span{font-size:13px;color:var(--muted)}
    .story-layout{display:grid;grid-template-columns:240px minmax(0,1fr) 270px;gap:42px}
    .story-nav{border-top:2px solid var(--ink)}
    .story-nav a{display:block;padding:14px 0;border-bottom:1px solid var(--line);font-size:13px;color:var(--muted)}
    .story-nav a:hover{color:var(--ink)}
    .story h2{font-size:34px;line-height:1.2;letter-spacing:-.05em;margin:0 0 18px}
    .story h3{font-size:22px;margin:34px 0 8px}
    .story p{line-height:2;margin:0 0 18px}
    .quote{border-left:4px solid var(--accent);padding:15px 20px;background:var(--card);font-size:16px;line-height:1.8;margin:24px 0}
    .side-note{padding:22px;background:var(--card);border:1px solid var(--line);border-radius:14px}
    .side-note h3{font-size:18px;margin:0 0 15px}
    .side-note li{font-size:13px;color:var(--muted);padding:9px 0;border-bottom:1px solid var(--line)}
    .news-list{border-top:2px solid var(--ink)}
    .news-row{display:grid;grid-template-columns:110px 125px 1fr 100px;gap:18px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line);transition:.2s}
    .news-row:hover{padding-left:8px;background:rgba(255,255,255,.3)}
    .news-row time{font-size:12px;color:var(--muted)}
    .news-row h3{font-size:18px;line-height:1.35;margin:0}
    .news-row p{font-size:13px;color:var(--muted);margin:4px 0 0;line-height:1.65}
    .faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px}
    .faq-list{border-top:1px solid var(--line)}
    details{border-bottom:1px solid var(--line);padding:20px 0}
    summary{cursor:pointer;list-style:none;font-weight:700;font-size:16px;display:flex;justify-content:space-between;gap:20px}
    summary::-webkit-details-marker{display:none}
    summary:after{content:"+";font-size:22px;color:var(--muted);line-height:1}
    details[open] summary:after{content:"−";color:var(--ink)}
    details p{color:var(--muted);font-size:14px;margin:13px 30px 0 0}
    .subscribe{background:var(--deep);color:#f7f6f0}
    .subscribe-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:start}
    .subscribe h2{font-size:clamp(32px,5vw,62px);line-height:1.05;letter-spacing:-.07em;margin:14px 0}
    .subscribe p{color:#bac4b9;font-size:14px}
    .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}
    .field{display:flex;flex-direction:column;gap:7px}
    .field.full{grid-column:1/-1}
    label{font-size:12px;color:#cbd3c9}
    input,select,textarea{width:100%;border:1px solid #526052;background:#29352b;color:#fff;border-radius:9px;padding:12px 14px;font-size:13px;transition:.2s}
    input::placeholder,textarea::placeholder{color:#899589}
    input:hover,select:hover,textarea:hover{border-color:#899b83}
    textarea{min-height:106px;resize:vertical}
    input:disabled{opacity:.45;cursor:not-allowed}
    .form-note{font-size:11px;color:#8e9a8d;margin-top:13px}
    footer{background:#182019;color:#e8eee5;padding:58px 0 25px}
    .footer-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;padding-bottom:48px;border-bottom:1px solid #3d493e}
    .footer-brand p{max-width:340px;color:#aeb9ad;font-size:13px;line-height:1.8;margin-top:18px}
    footer h4{font-size:13px;margin:0 0 15px;color:#fff}
    .footer-links{display:flex;flex-direction:column;gap:9px;color:#aeb9ad;font-size:12px}
    .footer-links a:hover{color:var(--accent)}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:22px;color:#899589;font-size:11px;flex-wrap:wrap}
    .reveal{opacity:0;transform:translateY(18px);transition:.65s ease}
    .reveal.show{opacity:1;transform:none}
    @media(max-width:1024px){
      .nav-links{gap:13px}.nav-tools .search-link{display:none}
      .hero-news-copy,.story-layout,.faq-grid,.subscribe-grid{grid-template-columns:1fr}
      .story-layout{gap:28px}.story-nav{display:flex;gap:18px;overflow:auto}.story-nav a{white-space:nowrap}
      .topic-grid{grid-template-columns:1fr 1fr}.topic-card:first-child{grid-row:auto}.topic-card:first-child img{height:220px}
    }
    @media(max-width:768px){
      .container{width:min(calc(100% - 32px),var(--container))}
      .nav{height:68px}.menu-btn{display:block}.nav-links{display:none;position:absolute;top:68px;left:16px;right:16px;padding:16px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);flex-direction:column;align-items:flex-start;gap:5px}.nav-links.open{display:flex}
      .hero-news{padding-top:68px}.hero-news-inner{padding-block:67px 30px}.hero-news-copy{gap:35px}.hero-title{font-size:clamp(48px,16vw,82px)}.hero-image{height:260px;margin-top:35px}.hero-image-caption{left:20px;bottom:19px}
      .metric-strip{display:flex;overflow-x:auto}.metric{min-width:145px}.metric:first-child{min-width:180px}
      .lead-layout,.topic-grid{grid-template-columns:1fr}.lead-card img{height:240px}.timeline{padding:22px}
      .index-grid{grid-template-columns:1fr 1fr}.section-head{display:block;margin-bottom:28px}.section-intro{margin-top:15px}
      .news-row{grid-template-columns:85px 1fr;gap:9px}.news-row .tag{width:max-content}.news-row p{grid-column:2}.news-row .btn{grid-column:2;justify-self:start}
      .form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.footer-top{grid-template-columns:1fr 1fr;gap:30px}.footer-brand{grid-column:1/-1}
    }
    @media(max-width:520px){
      .section{padding-block:68px}.hero-title{letter-spacing:-.075em}.update-box strong{font-size:26px}.index-grid{grid-template-columns:1fr}
      .lead-body{padding:24px}.story h2{font-size:28px}.footer-top{grid-template-columns:1fr}.footer-brand{grid-column:auto}.footer-bottom{display:block}.footer-bottom span{display:block;margin-bottom:8px}
    }
    @media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* roulang page: category3 */
:root{
      --bg:#f2f0eb;--bg-soft:#e9e7e0;--ink:#1b211d;--muted:#6d746c;
      --deep:#202922;--line:#d6d5cc;--accent:#b7d84b;--accent-hover:#c9ed5b;
      --card:#fbfaf6;--shadow:0 18px 45px rgba(31,40,31,.08);--radius:18px;
      --container:1240px;--space:clamp(72px,9vw,132px);--title-weight:800;
      --body-leading:1.85;--breakpoint:1024px;
    }
    *,*::before,*::after{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--bg);color:var(--ink);font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;line-height:var(--body-leading);overflow-x:hidden}
    a{color:inherit;text-decoration:none} img{display:block;width:100%;max-width:100%;object-fit:cover}
    button,input,select,textarea{font:inherit}button{cursor:pointer}
    .container{width:min(calc(100% - 48px),var(--container));margin-inline:auto}
    .eyebrow{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
    .eyebrow:before{content:"";display:block;width:24px;height:2px;background:var(--accent)}
    .section{padding-block:var(--space)}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:42px}
    .section-title{font-size:clamp(30px,4vw,58px);line-height:1.08;letter-spacing:-.06em;font-weight:var(--title-weight);margin:0}
    .section-intro{max-width:510px;color:var(--muted);font-size:15px;line-height:1.9;margin:0}
    .nav-wrap{position:fixed;z-index:40;top:0;left:0;width:100%;transition:.3s ease}
    .nav-wrap.scrolled{background:rgba(242,240,235,.95);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
    .nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:26px}
    .logo{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:900;letter-spacing:-.05em;white-space:nowrap}
    .logo-mark{width:30px;height:30px;display:grid;place-items:center;background:var(--accent);border-radius:9px;font-size:12px;font-weight:900}
    .nav-links{display:flex;align-items:center;gap:22px;font-size:13px;color:#535b53}
    .nav-links a{position:relative;padding:8px 0;transition:.25s}
    .nav-links a:after{content:"";position:absolute;left:0;right:100%;bottom:1px;height:2px;background:var(--accent);transition:.25s}
    .nav-links a:hover,.nav-links a.active{color:var(--ink);font-weight:700}
    .nav-links a.active:after,.nav-links a:hover:after{right:0}
    .nav-tools{display:flex;align-items:center;gap:10px}
    .search-link,.menu-btn{border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--ink);padding:9px 13px;font-size:12px;transition:.25s}
    .search-link:hover,.menu-btn:hover{border-color:var(--ink);background:var(--card)}
    .menu-btn{display:none}
    .hero{padding-top:76px;background:var(--deep);color:#f7f6f0;display:grid;grid-template-columns:44% 56%;min-height:660px}
    .hero-copy{display:flex;flex-direction:column;justify-content:center;padding:70px max(30px,calc((100vw - var(--container))/2)) 70px 0}
    .hero .eyebrow{color:#bbc3b9}
    .hero-title{font-size:clamp(48px,7vw,100px);font-weight:900;line-height:.98;letter-spacing:-.085em;margin:25px 0 28px}
    .hero-title em{color:var(--accent);font-style:normal}
    .hero-desc{max-width:520px;color:#bdc5bc;font-size:16px;line-height:1.95}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:46px;padding:0 19px;border-radius:10px;border:1px solid transparent;font-size:13px;font-weight:700;transition:.25s ease}
    .btn:focus,.search-link:focus,.menu-btn:focus,input:focus,select:focus,textarea:focus,summary:focus{outline:3px solid rgba(183,216,75,.55);outline-offset:3px}
    .btn:active{transform:scale(.97)}
    .btn-primary{background:var(--accent);color:var(--deep)}.btn-primary:hover{background:var(--accent-hover);transform:translateY(-2px)}
    .btn-outline{border-color:#59645a;color:#f7f6f0}.btn-outline:hover{background:#f7f6f0;color:var(--deep);border-color:#f7f6f0}
    .btn-light{background:var(--card);color:var(--deep)}.btn-light:hover{background:var(--accent);transform:translateY(-2px)}
    .btn-arrow{padding:0;background:none;color:var(--ink);min-height:auto}.btn-arrow span{transition:.25s}.btn-arrow:hover span{transform:translateX(5px)}
    .hero-meta{display:flex;gap:28px;margin-top:52px;padding-top:20px;border-top:1px solid #485248;color:#aeb7ae;font-size:12px}
    .hero-meta strong{display:block;color:#f7f6f0;font-size:20px;line-height:1.2;margin-bottom:4px}
    .hero-visual{position:relative;min-height:584px;overflow:hidden}
    .hero-visual img{height:100%;filter:saturate(.78);object-position:center}
    .hero-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--deep),transparent 24%),linear-gradient(0deg,rgba(14,20,15,.65),transparent 52%)}
    .visual-note{position:absolute;z-index:2;right:9%;bottom:9%;width:260px;padding:21px;background:rgba(32,41,34,.87);border:1px solid #647060;border-radius:14px;color:#dce2d9}
    .visual-note b{display:block;font-size:24px;color:var(--accent);line-height:1.2;margin:7px 0}
    .metric-strip{background:var(--card);border-bottom:1px solid var(--line);display:grid;grid-template-columns:1.5fr repeat(4,1fr)}
    .metric{padding:29px 26px;border-right:1px solid var(--line);min-height:132px}.metric:first-child{background:var(--accent)}
    .metric small{display:block;font-size:11px;color:var(--muted);letter-spacing:.08em}.metric:first-child small{color:#42502e}
    .metric strong{display:block;font-size:clamp(27px,3vw,43px);line-height:1.2;letter-spacing:-.06em;margin:8px 0 3px}
    .metric span{font-size:12px;color:var(--muted)}
    .analysis-layout{display:grid;grid-template-columns:7fr 5fr;gap:34px}
    .article-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.3s}
    .article-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#a5bc63}
    .article-card img{height:285px;transition:.45s}.article-card:hover img{transform:scale(1.03)}
    .article-body{padding:30px}.article-body h3{font-size:clamp(25px,3vw,39px);line-height:1.18;letter-spacing:-.055em;margin:15px 0 12px}
    .article-body p{font-size:14px;color:var(--muted);margin:0 0 22px}
    .tag{display:inline-flex;padding:5px 9px;border-radius:6px;background:#e2e4db;color:#526050;font-size:11px;line-height:1.2;font-weight:700}.tag.accent{background:var(--accent);color:var(--deep)}
    .side-index{border-top:1px solid var(--ink)}
    .index-row{padding:20px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:48px 1fr 22px;gap:15px;align-items:start;transition:.25s}.index-row:hover{padding-left:8px;background:#ebe9e2}
    .index-row b{font-size:13px;color:var(--muted)}.index-row h4{font-size:17px;line-height:1.4;margin:0 0 4px}.index-row p{font-size:12px;color:var(--muted);margin:0}.index-row span{font-size:20px}
    .dark-section{background:var(--deep);color:#f7f6f0}.dark-section .section-intro{color:#b7c0b6}
    .data-grid{display:grid;grid-template-columns:4fr 5fr 3fr;gap:16px;align-items:stretch}
    .data-box{padding:30px;border:1px solid #4c594d;border-radius:14px}.data-box.highlight{background:var(--accent);color:var(--deep);border-color:var(--accent)}
    .data-box h3{font-size:22px;line-height:1.25;margin:0 0 18px}.data-box p{font-size:13px;color:#b9c2b8;line-height:1.8}.data-box.highlight p{color:#495532}
    .bar{height:9px;background:#3c493e;border-radius:20px;overflow:hidden;margin:15px 0 8px}.bar i{display:block;height:100%;background:var(--accent);border-radius:20px}.highlight .bar{background:#d1e690}.highlight .bar i{background:var(--deep)}
    .note-grid{display:grid;grid-template-columns:5fr 7fr;gap:48px;align-items:start}
    .note-copy{font-size:16px;color:var(--muted);line-height:2.05}.note-copy p{margin:0 0 20px}
    .quote{border-left:4px solid var(--accent);padding:18px 24px;background:var(--card);font-size:23px;line-height:1.45;letter-spacing:-.04em}
    .reading-list{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.reading-item{padding:24px;background:var(--card);border:1px solid var(--line);border-radius:14px;min-height:190px;transition:.25s}.reading-item:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
    .reading-item h3{font-size:20px;line-height:1.35;margin:17px 0 8px}.reading-item p{font-size:13px;color:var(--muted);margin:0 0 15px}
    .timeline{border-top:1px solid var(--line)}.timeline-item{display:grid;grid-template-columns:120px 1fr 110px;gap:25px;padding:25px 0;border-bottom:1px solid var(--line);align-items:start}.timeline-item time{font-size:13px;color:var(--muted)}.timeline-item h3{font-size:19px;margin:0 0 4px;line-height:1.35}.timeline-item p{font-size:13px;color:var(--muted);margin:0}.timeline-item .btn-arrow{justify-self:end}
    .faq-wrap{display:grid;grid-template-columns:4fr 8fr;gap:70px}.faq-list{border-top:1px solid var(--ink)}details{border-bottom:1px solid var(--line);padding:20px 0}summary{cursor:pointer;list-style:none;font-size:17px;font-weight:700;display:flex;justify-content:space-between;gap:20px}summary::-webkit-details-marker{display:none}summary:after{content:"+";font-size:22px;color:var(--muted)}details[open] summary:after{content:"−"}details p{color:var(--muted);font-size:14px;line-height:1.9;margin:13px 30px 0 0}
.cta{background:var(--accent);padding:55px 0}.cta-inner{display:grid;grid-template-columns:5fr 7fr;gap:50px;align-items:center}.cta h2{font-size:clamp(31px,4vw,57px);line-height:1.06;letter-spacing:-.06em;margin:12px 0}.cta p{color:#4d5a35;font-size:14px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field{display:flex;flex-direction:column;gap:6px}.field.full{grid-column:1/-1}.field label{font-size:12px;font-weight:700}.field input,.field select,.field textarea{width:100%;border:1px solid #93ad46;border-radius:9px;background:rgba(255,255,255,.45);padding:12px 13px;color:var(--ink);font-size:13px}.field textarea{min-height:92px;resize:vertical}.field input::placeholder,.field textarea::placeholder{color:#77835a}.form-note{font-size:11px;color:#60703e;margin-top:11px}.form-error{display:none;color:#8b3d32;font-size:11px}.field input:invalid:not(:placeholder-shown)+.form-error{display:block}
footer{background:#192119;color:#dce3da;padding:65px 0 24px}.footer-top{display:grid;grid-template-columns:2.2fr 1fr 1fr 1fr;gap:45px;padding-bottom:52px;border-bottom:1px solid #3c483d}.footer-brand p{max-width:320px;color:#9da99d;font-size:13px;line-height:1.9;margin-top:19px}.footer-top h4{font-size:13px;margin:7px 0 16px;color:#f5f6ef}.footer-links{display:grid;gap:9px;color:#9da99d;font-size:13px}.footer-links a{transition:.2s}.footer-links a:hover{color:var(--accent)}.footer-bottom{display:flex;justify-content:space-between;gap:20px;color:#879387;font-size:11px;padding-top:21px}
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}.reveal.show{opacity:1;transform:none}
@media(max-width:1024px){.nav-links{gap:13px}.nav-links a{font-size:12px}.hero{grid-template-columns:1fr 1fr}.hero-copy{padding-left:24px}.metric-strip{grid-template-columns:repeat(3,1fr)}.metric:first-child{grid-column:span 3}.data-grid{grid-template-columns:1fr 1fr}.data-box:last-child{grid-column:span 2}.footer-top{grid-template-columns:2fr 1fr 1fr}}
@media(max-width:768px){.container{width:min(calc(100% - 32px),var(--container))}.nav{height:68px}.nav-links{display:none;position:absolute;top:68px;left:16px;right:16px;padding:14px 20px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);flex-direction:column;align-items:flex-start}.nav-links.open{display:flex}.menu-btn{display:block}.search-link{display:none}.hero{display:block;padding-top:68px}.hero-copy{padding:65px 16px 52px}.hero-visual{min-height:360px}.hero-title{font-size:clamp(48px,14vw,78px)}.hero-meta{margin-top:35px}.section{padding-block:74px}.section-head,.analysis-layout,.note-grid,.faq-wrap,.cta-inner{display:block}.section-head{margin-bottom:28px}.section-intro{margin-top:18px}.analysis-layout>*+*{margin-top:25px}.data-grid{grid-template-columns:1fr}.data-box:last-child{grid-column:auto}.reading-list{grid-template-columns:1fr}.timeline-item{grid-template-columns:85px 1fr}.timeline-item .btn-arrow{display:none}.quote{margin-top:28px}.cta-inner>*+*{margin-top:28px}.footer-top{grid-template-columns:1fr 1fr;gap:32px}.footer-brand{grid-column:span 2}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:8px}}
@media(max-width:520px){.metric-strip{grid-template-columns:1fr 1fr}.metric:first-child{grid-column:span 2}.metric{padding:22px 16px;min-height:110px}.metric strong{font-size:29px}.hero-actions .btn{width:100%}.hero-meta{gap:16px}.visual-note{right:5%;bottom:6%;width:220px}.article-body{padding:22px}.timeline-item{grid-template-columns:1fr;gap:5px}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.footer-top{grid-template-columns:1fr}.footer-brand{grid-column:auto}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}.reveal{opacity:1;transform:none}}
@media print{.nav-wrap,.hero-actions,.cta{display:none}.hero{padding-top:20px;color:#000;background:#fff}.hero-visual{display:none}}

/* roulang page: category2 */
:root{
      --bg:#f2f0eb;--bg-soft:#e9e7e0;--ink:#1b211d;--muted:#6d746c;
      --deep:#202922;--line:#d6d5cc;--accent:#b7d84b;--accent-hover:#c9ed5b;
      --card:#fbfaf6;--shadow:0 18px 45px rgba(31,40,31,.08);--radius:18px;
      --container:1240px;--space:clamp(70px,8vw,118px);--title-weight:800;
      --body-leading:1.85;--breakpoint:1024px;
    }
    *{box-sizing:border-box;margin:0;padding:0}
    html{scroll-behavior:smooth}
    body{background:var(--bg);color:var(--ink);font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;line-height:var(--body-leading);overflow-x:hidden}
    a{color:inherit;text-decoration:none}
    img{display:block;width:100%;max-width:100%;object-fit:cover}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    .container{width:min(calc(100% - 48px),var(--container));margin-inline:auto}
    .eyebrow{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
    .eyebrow:before{content:"";display:block;width:24px;height:2px;background:var(--accent)}
    .section{padding-block:var(--space)}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:40px}
    .section-title{font-size:clamp(30px,4vw,58px);line-height:1.08;letter-spacing:-.06em;font-weight:var(--title-weight)}
    .section-intro{max-width:510px;color:var(--muted);font-size:15px;line-height:1.9}
    .nav-wrap{position:fixed;z-index:40;top:0;left:0;width:100%;transition:.3s ease}
    .nav-wrap.scrolled{background:rgba(242,240,235,.95);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
    .nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:26px}
    .logo{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:900;letter-spacing:-.05em;white-space:nowrap}
    .logo-mark{width:30px;height:30px;display:grid;place-items:center;background:var(--accent);border-radius:9px;font-size:12px;font-weight:900}
    .nav-links{display:flex;align-items:center;gap:20px;font-size:13px;color:#535b53}
    .nav-links a{position:relative;padding:8px 0;transition:.25s}
    .nav-links a:after{content:"";position:absolute;left:0;right:100%;bottom:1px;height:2px;background:var(--accent);transition:.25s}
    .nav-links a:hover,.nav-links a.active{color:var(--ink);font-weight:700}
    .nav-links a.active:after,.nav-links a:hover:after{right:0}
    .nav-tools{display:flex;align-items:center;gap:10px}
    .search-link,.menu-btn{border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--ink);padding:9px 13px;font-size:12px;transition:.25s}
    .search-link:hover,.menu-btn:hover{border-color:var(--ink);background:var(--card)}
    .menu-btn{display:none}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:46px;padding:0 19px;border-radius:10px;border:1px solid transparent;font-size:13px;font-weight:700;transition:.25s ease}
    .btn:focus,.search-link:focus,.menu-btn:focus,input:focus,select:focus,textarea:focus,summary:focus{outline:3px solid rgba(183,216,75,.55);outline-offset:3px}
    .btn:active{transform:scale(.97)}
    .btn-primary{background:var(--accent);color:var(--deep)}
    .btn-primary:hover{background:var(--accent-hover);transform:translateY(-2px)}
    .btn-outline{border-color:#657064;color:var(--ink)}
    .btn-outline:hover{background:var(--deep);color:#fff;border-color:var(--deep)}
    .btn-arrow{padding:0;background:none;color:var(--ink);min-height:auto}
    .btn-arrow span{transition:.25s}.btn-arrow:hover span{transform:translateX(5px)}
    .page-hero{padding-top:76px;min-height:590px;background:var(--deep);color:#f7f6f0;display:grid;grid-template-columns:44% 56%}
    .hero-copy{display:flex;flex-direction:column;justify-content:center;padding:80px max(30px,calc((100vw - var(--container))/2)) 80px 0}
    .hero-copy .eyebrow{color:#bbc3b9}
    .hero-title{font-size:clamp(48px,7vw,96px);font-weight:900;line-height:.98;letter-spacing:-.085em;margin:24px 0 26px}
    .hero-title em{font-style:normal;color:var(--accent)}
    .hero-desc{max-width:500px;color:#c1c9c0;font-size:16px;line-height:1.95}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}
    .hero-image{position:relative;min-height:514px;overflow:hidden}
    .hero-image:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--deep),transparent 30%),linear-gradient(0deg,rgba(16,23,17,.72),transparent 60%)}
    .hero-image img{height:100%;filter:saturate(.72);object-position:center}
    .hero-stamp{position:absolute;z-index:2;right:8%;bottom:9%;width:240px;padding:20px;border-left:3px solid var(--accent);background:rgba(32,41,34,.82);font-size:12px;color:#ccd4cb}
    .hero-stamp strong{display:block;font-size:32px;line-height:1.1;color:#fff;margin-bottom:8px}
    .metric-band{background:var(--card);border-bottom:1px solid var(--line);display:grid;grid-template-columns:1.4fr repeat(4,1fr)}
    .metric{padding:28px 25px;border-left:1px solid var(--line);min-height:130px}
    .metric:first-child{border-left:0;background:var(--accent)}
    .metric strong{display:block;font-size:37px;line-height:1.1;letter-spacing:-.07em}
    .metric small{display:block;color:var(--muted);font-size:12px;margin-top:8px}
    .metric:first-child small{color:#43533a}
    .filter-box{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px;display:flex;align-items:end;gap:18px;flex-wrap:wrap;box-shadow:var(--shadow)}
    .filter-field{display:flex;flex-direction:column;gap:7px;min-width:160px;flex:1}
    .filter-field label{font-size:12px;color:var(--muted);font-weight:700}
    select,.input{width:100%;height:44px;border:1px solid var(--line);background:var(--bg);border-radius:9px;padding:0 13px;color:var(--ink)}
    select:hover,.input:hover{border-color:#9eb15b}
    .filter-note{width:100%;font-size:12px;color:var(--muted);border-top:1px solid var(--line);padding-top:15px}
    .schedule-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.7fr);gap:22px}
    .schedule-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:27px;transition:.3s}
    .schedule-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#aabd68}
    .schedule-card.featured{background:var(--deep);color:#fff;padding:34px}
    .schedule-top{display:flex;justify-content:space-between;align-items:start;gap:15px;margin-bottom:25px}
    .tag{display:inline-flex;padding:5px 9px;border-radius:6px;background:#e2e4db;color:#526050;font-size:11px;line-height:1.2;font-weight:700}
    .tag.accent{background:var(--accent);color:var(--deep)}
    .schedule-date{font-size:13px;color:var(--muted)}
    .featured .schedule-date{color:#b4c0b5}
    .match-line{display:grid;grid-template-columns:1fr 82px 1fr;align-items:center;gap:14px;text-align:center}
    .team{font-size:20px;font-weight:800;line-height:1.25}
    .team:first-child{text-align:right}.team:last-child{text-align:left}
    .match-time{font-size:28px;font-weight:900;letter-spacing:-.06em}
    .match-time small{display:block;font-size:11px;font-weight:400;color:var(--muted);letter-spacing:0}
    .featured .match-time small{color:#b4c0b5}
    .schedule-foot{display:flex;justify-content:space-between;border-top:1px solid var(--line);margin-top:28px;padding-top:16px;font-size:12px;color:var(--muted)}
    .featured .schedule-foot{border-color:#4e5b4d;color:#b4c0b5}
    .timeline{border-left:1px solid #aeb5aa;padding-left:25px;display:grid;gap:20px}
    .timeline-item{position:relative;padding:16px 17px;background:var(--card);border:1px solid var(--line);border-radius:12px}
    .timeline-item:before{content:"";position:absolute;width:9px;height:9px;border-radius:50%;background:var(--accent);left:-31px;top:24px;border:3px solid var(--bg)}
    .timeline-item time{font-size:12px;color:var(--muted)}
    .timeline-item h3{font-size:17px;line-height:1.35;margin:6px 0}
    .timeline-item p{font-size:13px;color:var(--muted);line-height:1.7}
    .priority-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
    .priority-main{grid-column:span 7;min-height:390px;border-radius:var(--radius);overflow:hidden;position:relative;color:#fff}
    .priority-main img{position:absolute;inset:0;height:100%;transition:.4s}
    .priority-main:hover img{transform:scale(1.04)}
    .priority-main:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(23,31,24,.92),transparent 70%)}
    .priority-main .content{position:absolute;z-index:1;left:30px;right:30px;bottom:28px}
    .priority-main h3{font-size:32px;line-height:1.15;margin:12px 0}
    .priority-side{grid-column:span 5;display:grid;gap:12px}
    .priority-row{display:flex;align-items:center;gap:16px;padding:18px;background:var(--card);border:1px solid var(--line);border-radius:13px;transition:.25s}
    .priority-row:hover{border-color:#aabd68;transform:translateX(4px)}
    .priority-row .num{font-size:22px;font-weight:900;color:#a2b868}
    .priority-row h3{font-size:16px;line-height:1.35}.priority-row p{font-size:12px;color:var(--muted)}
    .reading{background:var(--deep);color:#f7f6f0}
    .reading-grid{display:grid;grid-template-columns:4fr 7fr;gap:70px;align-items:start}
    .reading .eyebrow{color:#b8c4b8}
    .reading h2{font-size:clamp(32px,4vw,57px);line-height:1.1;letter-spacing:-.06em;margin-top:18px}
    .reading-copy{font-size:15px;color:#c1c9c0;line-height:2}
    .reading-copy p+p{margin-top:18px}
    .data-notes{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:26px}
    .note{padding:18px;border:1px solid #4d594e;border-radius:12px}.note b{display:block;color:var(--accent);font-size:22px}.note span{font-size:12px;color:#b5c0b6}
    .faq-grid{display:grid;grid-template-columns:.8fr 1.5fr;gap:72px}
    .faq-list{border-top:1px solid var(--line)}
    details{border-bottom:1px solid var(--line);padding:20px 0}
    summary{cursor:pointer;list-style:none;font-size:16px;font-weight:700;display:flex;justify-content:space-between;gap:20px}
    summary::-webkit-details-marker{display:none}summary:after{content:"+";font-size:22px;color:#91a858}details[open] summary:after{content:"−"}
    details p{color:var(--muted);font-size:14px;line-height:1.9;padding:13px 30px 0 0}
    .cta{background:var(--accent);padding:55px 0}
    .cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:center}
    .cta h2{font-size:clamp(32px,4vw,55px);line-height:1.08;letter-spacing:-.06em}
    .cta p{font-size:14px;color:#4c5b40;line-height:1.9;margin-top:14px}
    .form-panel{background:var(--card);border-radius:15px;padding:22px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
    .form-panel label{font-size:12px;color:var(--muted);display:flex;flex-direction:column;gap:6px}
    .form-panel .full{grid-column:1/-1}
    textarea.input{height:76px;padding-top:10px;resize:vertical}
    .form-help{font-size:11px;color:var(--muted);grid-column:1/-1}
    footer{background:var(--deep);color:#eef1e9;padding:65px 0 22px}
    .footer-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:35px;padding-bottom:55px}
    .footer-brand p{color:#aeb9ad;font-size:13px;max-width:310px;margin-top:20px;line-height:1.9}
    footer h4{font-size:13px;color:var(--accent);margin-bottom:17px}
    .footer-links{display:grid;gap:9px;color:#b8c2b8;font-size:13px}.footer-links a{transition:.2s}.footer-links a:hover{color:var(--accent)}
    .footer-bottom{border-top:1px solid #465247;padding-top:20px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;color:#929e93;font-size:11px}
    .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}.reveal.visible{opacity:1;transform:none}
    @media(max-width:1024px){.nav-links{gap:11px}.nav-links a{font-size:12px}.page-hero{grid-template-columns:1fr 1fr}.metric-band{grid-template-columns:repeat(3,1fr)}.metric:first-child{grid-column:span 3}.reading-grid,.faq-grid{gap:35px}.footer-top{grid-template-columns:2fr 1fr 1fr}}
    @media(max-width:768px){.container{width:min(calc(100% - 32px),var(--container))}.nav{height:68px}.nav-links{position:absolute;top:68px;left:16px;right:16px;display:none;padding:14px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:2px}.nav-links.open{display:flex}.nav-links a{padding:10px 8px}.menu-btn{display:block}.search-link{display:none}.page-hero{display:flex;flex-direction:column;padding-top:68px}.hero-copy{padding:65px 16px 55px}.hero-image{min-height:330px}.hero-stamp{right:6%;bottom:8%;width:205px}.metric-band{grid-template-columns:repeat(2,1fr)}.metric:first-child{grid-column:span 2}.metric{padding:22px 17px}.metric strong{font-size:30px}.section-head{display:block}.section-intro{margin-top:18px}.schedule-layout,.reading-grid,.faq-grid,.cta-grid{grid-template-columns:1fr}.priority-main,.priority-side{grid-column:1/-1}.reading-grid{gap:30px}.footer-top{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}}
    @media(max-width:520px){.hero-title{font-size:52px}.hero-actions .btn{width:100%}.filter-box{padding:18px}.filter-field{min-width:100%}.match-line{grid-template-columns:1fr 62px 1fr;gap:5px}.team{font-size:16px}.match-time{font-size:22px}.priority-main{min-height:330px}.priority-main h3{font-size:25px}.form-panel{grid-template-columns:1fr}.form-panel .full{grid-column:auto}.form-help{grid-column:auto}.footer-top{grid-template-columns:1fr}.footer-brand{grid-column:auto}.footer-bottom{display:grid}}
    @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.priority-main img,.schedule-card,.priority-row{transition:none}}
    @media print{.nav-wrap,.hero-actions,.cta{display:none}.page-hero{color:#000;background:#fff}.hero-image{display:none}}

/* roulang page: category5 */
:root{
      --bg:#f2f0eb;
      --bg-soft:#e9e7e0;
      --ink:#1b211d;
      --muted:#6d746c;
      --deep:#202922;
      --line:#d6d5cc;
      --accent:#b7d84b;
      --accent-hover:#c9ed5b;
      --card:#fbfaf6;
      --shadow:0 18px 45px rgba(31,40,31,.08);
      --radius:18px;
      --container:1240px;
      --space:clamp(72px,9vw,132px);
      --title-weight:800;
      --body-leading:1.85;
      --breakpoint:1024px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      background:var(--bg);
      color:var(--ink);
      font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
      line-height:var(--body-leading);
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none}
    img{display:block;width:100%;max-width:100%;object-fit:cover}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    .container{width:min(calc(100% - 48px),var(--container));margin-inline:auto}
    .eyebrow{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
    .eyebrow:before{content:"";display:block;width:24px;height:2px;background:var(--accent)}
    .section{padding-block:var(--space)}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:42px}
    .section-title{font-size:clamp(30px,4vw,58px);line-height:1.08;letter-spacing:-.06em;font-weight:var(--title-weight);margin:10px 0 0}
    .section-intro{max-width:510px;color:var(--muted);font-size:15px;line-height:1.9;margin:0}
    .nav-wrap{position:fixed;z-index:40;top:0;left:0;width:100%;transition:.3s ease}
    .nav-wrap.scrolled{background:rgba(242,240,235,.95);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
    .nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:26px}
    .logo{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:900;letter-spacing:-.05em;white-space:nowrap}
    .logo-mark{width:30px;height:30px;display:grid;place-items:center;background:var(--accent);border-radius:9px;font-size:12px;font-weight:900}
    .nav-links{display:flex;align-items:center;gap:22px;font-size:13px;color:#535b53}
    .nav-links a{position:relative;padding:8px 0;transition:.25s}
    .nav-links a:after{content:"";position:absolute;left:0;right:100%;bottom:1px;height:2px;background:var(--accent);transition:.25s}
    .nav-links a:hover,.nav-links a.active{color:var(--ink);font-weight:700}
    .nav-links a.active:after,.nav-links a:hover:after{right:0}
    .nav-tools{display:flex;align-items:center;gap:10px}
    .search-link,.menu-btn{border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--ink);padding:9px 13px;font-size:12px;transition:.25s}
    .search-link:hover,.menu-btn:hover{border-color:var(--ink);background:var(--card)}
    .menu-btn{display:none}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:46px;padding:0 19px;border-radius:10px;border:1px solid transparent;font-size:13px;font-weight:700;transition:.25s ease}
    .btn:focus,.search-link:focus,.menu-btn:focus,input:focus,select:focus,textarea:focus,summary:focus{outline:3px solid rgba(183,216,75,.55);outline-offset:3px}
    .btn:active{transform:scale(.97)}
    .btn-primary{background:var(--accent);color:var(--deep)}
    .btn-primary:hover{background:var(--accent-hover);transform:translateY(-2px)}
    .btn-outline{border-color:#59645a;color:#f7f6f0}
    .btn-outline:hover{background:#f7f6f0;color:var(--deep);border-color:#f7f6f0}
    .btn-dark{background:var(--deep);color:#f7f6f0}
    .btn-dark:hover{background:#354238;transform:translateY(-2px)}
    .btn-arrow{padding:0;background:none;color:var(--ink);min-height:auto}
    .btn-arrow span{transition:.25s}
    .btn-arrow:hover span{transform:translateX(5px)}
    .page-hero{
      padding-top:76px;
      background:var(--bg-soft);
      border-bottom:1px solid var(--line);
    }
    .hero-band{min-height:430px;display:grid;grid-template-columns:5fr 7fr;align-items:stretch}
    .hero-band-copy{padding:76px 58px 72px 0;display:flex;flex-direction:column;justify-content:center}
    .hero-title{font-size:clamp(46px,7vw,94px);line-height:.98;letter-spacing:-.09em;font-weight:900;margin:22px 0 22px}
    .hero-title em{font-style:normal;color:#7f9e22}
    .hero-desc{max-width:570px;color:var(--muted);font-size:16px;line-height:1.95;margin:0}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
    .hero-band-image{position:relative;min-height:430px;overflow:hidden}
    .hero-band-image img{height:100%;object-position:center}
    .hero-band-image:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(233,231,224,.7),transparent 26%),linear-gradient(0deg,rgba(20,28,20,.42),transparent 52%)}
    .image-note{position:absolute;z-index:2;right:24px;bottom:23px;padding:12px 15px;background:rgba(32,41,34,.86);color:#f6f6ef;border-left:3px solid var(--accent);font-size:12px}
    .section-label{font-size:12px;color:var(--muted);letter-spacing:.12em;font-weight:700}
    .line{height:1px;background:var(--line)}
    .topic-progress{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .progress-cell{padding:24px 22px;border-right:1px solid var(--line)}
    .progress-cell:last-child{border-right:0}
    .progress-number{font-size:34px;line-height:1;font-weight:900;letter-spacing:-.07em}
    .progress-cell p{font-size:12px;color:var(--muted);margin:8px 0 0}
    .progress-bar{height:6px;background:#d5d8ca;border-radius:20px;margin-top:18px;overflow:hidden}
    .progress-bar span{display:block;height:100%;background:var(--accent);width:68%;border-radius:20px}
    .feature-layout{display:grid;grid-template-columns:7fr 5fr;gap:22px}
    .feature-card{position:relative;min-height:470px;padding:36px;display:flex;flex-direction:column;justify-content:end;overflow:hidden;border-radius:var(--radius);color:#fff;background:var(--deep)}
    .feature-card img{position:absolute;inset:0;height:100%;opacity:.58;transition:.45s}
    .feature-card:hover img{transform:scale(1.04);opacity:.7}
    .feature-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(18,25,19,.96),transparent 74%)}
    .feature-content{position:relative;z-index:1}
    .feature-content h2{font-size:clamp(29px,4vw,52px);line-height:1.1;letter-spacing:-.07em;margin:14px 0}
    .feature-content p{max-width:560px;color:#d0d7ce;font-size:14px;line-height:1.8;margin:0 0 20px}
    .tag{display:inline-flex;padding:5px 9px;border-radius:6px;background:#e2e4db;color:#526050;font-size:11px;line-height:1.2;font-weight:700}
    .tag.accent{background:var(--accent);color:var(--deep)}
    .side-stories{display:flex;flex-direction:column;gap:12px}
    .story-row{display:grid;grid-template-columns:112px 1fr;gap:18px;padding:15px;border:1px solid var(--line);background:var(--card);border-radius:14px;transition:.25s}
    .story-row:hover{transform:translateX(4px);border-color:#adc95a;box-shadow:var(--shadow)}
    .story-row img{height:92px;border-radius:9px}
    .story-row h3{font-size:17px;line-height:1.35;letter-spacing:-.035em;margin:7px 0 5px}
    .story-row p{font-size:12px;line-height:1.65;color:var(--muted);margin:0}
    .reading-layout{display:grid;grid-template-columns:3fr 1.2fr;gap:72px;align-items:start}
    .article-body{max-width:760px}
    .article-body h2{font-size:clamp(28px,3.5vw,46px);line-height:1.15;letter-spacing:-.065em;margin:0 0 25px}
    .article-body h3{font-size:23px;line-height:1.3;margin:34px 0 12px}
    .article-body p{font-size:16px;line-height:2.05;color:#454d45;margin:0 0 21px}
    .article-body ul{padding-left:20px;color:#454d45;line-height:2;margin:18px 0 28px}
    .quote{border-left:4px solid var(--accent);padding:18px 24px;background:var(--card);font-size:19px;line-height:1.7;font-weight:700;letter-spacing:-.03em;margin:30px 0}
    .toc{position:sticky;top:108px;border-top:2px solid var(--ink);padding-top:16px}
    .toc h3{font-size:14px;margin:0 0 15px}
    .toc a{display:block;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px;color:var(--muted);transition:.2s}
    .toc a:hover{color:var(--ink);padding-left:5px}
    .data-callout{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:1px;background:var(--line);margin-top:42px;border:1px solid var(--line)}
    .data-box{background:var(--deep);color:#f8f8f1;padding:25px}
    .data-box strong{font-size:35px;line-height:1;display:block;color:var(--accent)}
    .data-box small{display:block;color:#b6c0b5;font-size:12px;margin-top:10px}
    .split-reading{display:grid;grid-template-columns:1fr 1fr;gap:0;background:var(--deep);color:#f5f5ee}
    .split-reading .visual{min-height:400px}
    .split-reading .visual img{height:100%;opacity:.75}
    .split-reading .copy{padding:54px}
    .split-reading h2{font-size:clamp(28px,4vw,49px);line-height:1.12;letter-spacing:-.07em;margin:16px 0 20px}
    .split-reading p{color:#c4ccc2;font-size:14px;line-height:1.95;margin:0 0 18px}
    .related-wrap{background:var(--bg-soft)}
    .related-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px}
    .related-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.28s}
    .related-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#aec55c}
    .related-card img{height:190px}
    .related-copy{padding:22px}
    .related-copy h3{font-size:21px;line-height:1.28;letter-spacing:-.045em;margin:11px 0}
    .related-copy p{font-size:13px;color:var(--muted);line-height:1.75;margin:0 0 16px}
    .faq-grid{display:grid;grid-template-columns:4fr 8fr;gap:70px;align-items:start}
    .faq-list{border-top:1px solid var(--line)}
    details{border-bottom:1px solid var(--line);padding:19px 0}
    summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:18px;font-size:16px;font-weight:700}
    summary::-webkit-details-marker{display:none}
    summary:after{content:"+";font-size:21px;font-weight:400;color:var(--muted);line-height:1}
    details[open] summary:after{content:"−";color:var(--ink)}
    details p{color:var(--muted);font-size:14px;line-height:1.9;margin:13px 30px 2px 0}
    .cta-section{background:var(--accent);padding-block:72px}
    .cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
    .cta-section h2{font-size:clamp(32px,4.5vw,62px);line-height:1.02;letter-spacing:-.075em;margin:12px 0 18px}
    .cta-section p{max-width:520px;color:#435139;font-size:15px;line-height:1.9;margin:0}
    .subscribe-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
    .subscribe-form input,.subscribe-form select{width:100%;height:48px;border:1px solid rgba(27,33,29,.28);border-radius:9px;background:rgba(255,255,255,.42);padding:0 14px;color:var(--ink)}
    .subscribe-form input::placeholder{color:#657055}
    .subscribe-form .full{grid-column:1/-1}
    .form-note{grid-column:1/-1;font-size:11px;color:#526044}
    footer{background:var(--deep);color:#eef0e8;padding:63px 0 25px}
    .footer-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:50px;padding-bottom:48px;border-bottom:1px solid #475247}
    .footer-brand p{max-width:330px;color:#aeb8ad;font-size:13px;line-height:1.9;margin:18px 0 0}
    footer h4{font-size:13px;margin:7px 0 16px;color:#fff}
    .footer-links{display:flex;flex-direction:column;gap:8px}
    .footer-links a{color:#aeb8ad;font-size:13px;transition:.2s}
    .footer-links a:hover{color:var(--accent);transform:translateX(3px)}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:22px;color:#8f9a8e;font-size:11px;flex-wrap:wrap}
    .reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}
    .reveal.visible{opacity:1;transform:none}
    @media(max-width:1024px){
      .nav-links{gap:13px}
      .nav-links a{font-size:12px}
      .hero-band-copy{padding-right:30px}
      .reading-layout{gap:35px}
    }
    @media(max-width:768px){
      .container{width:min(calc(100% - 32px),var(--container))}
      .nav{height:68px}
      .nav-links{display:none;position:absolute;top:68px;left:16px;right:16px;padding:16px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:4px}
      .nav-links.open{display:flex}
      .nav-links a{padding:10px 8px}
      .menu-btn{display:block}
      .search-link{display:none}
      .page-hero{padding-top:68px}
      .hero-band{grid-template-columns:1fr}
      .hero-band-copy{padding:58px 0 48px;min-height:370px}
      .hero-band-image{min-height:280px}
      .topic-progress{grid-template-columns:1fr 1fr}
      .progress-cell:nth-child(2){border-right:0}
      .progress-cell:nth-child(-n+2){border-bottom:1px solid var(--line)}
      .feature-layout,.reading-layout,.split-reading,.faq-grid,.cta-grid{grid-template-columns:1fr}
      .feature-card{min-height:390px}
      .toc{position:static;order:-1}
      .split-reading .visual{min-height:260px}
      .split-reading .copy{padding:38px 26px}
      .related-grid{grid-template-columns:1fr 1fr}
      .footer-top{grid-template-columns:1fr 1fr;gap:30px}
    }
    @media(max-width:520px){
      .section{padding-block:66px}
      .section-head{display:block;margin-bottom:28px}
      .section-intro{margin-top:18px}
      .hero-title{font-size:54px}
      .hero-desc{font-size:14px}
      .hero-actions .btn{width:100%}
      .topic-progress{grid-template-columns:1fr}
      .progress-cell{border-right:0!important;border-bottom:1px solid var(--line)}
      .progress-cell:last-child{border-bottom:0}
      .feature-card{padding:25px;min-height:420px}
      .story-row{grid-template-columns:88px 1fr;gap:12px}
      .story-row img{height:82px}
      .story-row h3{font-size:15px}
      .data-callout{grid-template-columns:1fr}
      .related-grid{grid-template-columns:1fr}
      .subscribe-form{grid-template-columns:1fr}
      .subscribe-form .full,.form-note{grid-column:auto}
      .footer-top{grid-template-columns:1fr}
      .footer-bottom{display:block}
      .footer-bottom span{display:block;margin-bottom:8px}
    }
    @media(prefers-reduced-motion:reduce){
      *,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
      .reveal{opacity:1;transform:none}
    }
    @media print{
      .nav-wrap,.hero-actions,.cta-section{display:none}
      .page-hero{padding-top:20px}
      .section{padding-block:35px}
    }

/* roulang page: category4 */
:root{
      --bg:#f2f0eb;
      --bg-soft:#e9e7e0;
      --ink:#1b211d;
      --muted:#6d746c;
      --deep:#202922;
      --line:#d6d5cc;
      --accent:#b7d84b;
      --accent-hover:#c9ed5b;
      --card:#fbfaf6;
      --shadow:0 18px 45px rgba(31,40,31,.08);
      --radius:18px;
      --container:1240px;
      --space:clamp(72px,9vw,132px);
      --title-weight:800;
      --body-leading:1.85;
      --breakpoint:1024px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      background:var(--bg);
      color:var(--ink);
      font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
      line-height:var(--body-leading);
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none}
    img{display:block;width:100%;max-width:100%;object-fit:cover}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    .container{width:min(calc(100% - 48px),var(--container));margin-inline:auto}
    .nav-wrap{position:fixed;z-index:40;top:0;left:0;width:100%;transition:.3s ease}
    .nav-wrap.scrolled{background:rgba(242,240,235,.95);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
    .nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:26px}
    .logo{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:900;letter-spacing:-.05em;white-space:nowrap}
    .logo-mark{width:30px;height:30px;display:grid;place-items:center;background:var(--accent);border-radius:9px;font-size:12px;font-weight:900}
    .nav-links{display:flex;align-items:center;gap:21px;font-size:13px;color:#535b53}
    .nav-links a{position:relative;padding:8px 0;transition:.25s}
    .nav-links a:after{content:"";position:absolute;left:0;right:100%;bottom:1px;height:2px;background:var(--accent);transition:.25s}
    .nav-links a:hover,.nav-links a.active{color:var(--ink);font-weight:700}
    .nav-links a.active:after,.nav-links a:hover:after{right:0}
    .nav-tools{display:flex;align-items:center;gap:10px}
    .search-link,.menu-btn{border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--ink);padding:9px 13px;font-size:12px;transition:.25s}
    .search-link:hover,.menu-btn:hover{border-color:var(--ink);background:var(--card)}
    .menu-btn{display:none}
    .eyebrow{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
    .eyebrow:before{content:"";display:block;width:24px;height:2px;background:var(--accent)}
    .section{padding-block:var(--space)}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:42px}
    .section-title{font-size:clamp(30px,4vw,58px);line-height:1.08;letter-spacing:-.06em;font-weight:var(--title-weight);margin:12px 0 0}
    .section-intro{max-width:510px;color:var(--muted);font-size:15px;line-height:1.9}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:46px;padding:0 19px;border-radius:10px;border:1px solid transparent;font-size:13px;font-weight:700;transition:.25s ease}
    .btn:focus,.search-link:focus,.menu-btn:focus,input:focus,select:focus,textarea:focus,summary:focus{outline:3px solid rgba(183,216,75,.55);outline-offset:3px}
    .btn:active{transform:scale(.97)}
    .btn-primary{background:var(--accent);color:var(--deep)}
    .btn-primary:hover{background:var(--accent-hover);transform:translateY(-2px)}
    .btn-outline{border-color:#657064;color:var(--ink)}
    .btn-outline:hover{background:var(--deep);color:#fff;border-color:var(--deep)}
    .btn-light{background:var(--card);color:var(--deep)}
    .btn-light:hover{background:var(--accent);transform:translateY(-2px)}
    .btn-arrow{padding:0;background:none;color:var(--ink);min-height:auto}
    .btn-arrow span{transition:.25s}
    .btn-arrow:hover span{transform:translateX(5px)}
    .tag{display:inline-flex;padding:5px 9px;border-radius:6px;background:#e2e4db;color:#526050;font-size:11px;line-height:1.2;font-weight:700}
    .tag.accent{background:var(--accent);color:var(--deep)}
    .hero-inner{padding-top:76px;min-height:700px;display:grid;grid-template-columns:42% 58%;background:var(--deep);color:#f7f6f0}
    .hero-copy{display:flex;flex-direction:column;justify-content:center;padding:68px 40px 68px max(24px,calc((100vw - var(--container))/2))}
    .hero .eyebrow{color:#bbc3b9}
    .hero-title{font-size:clamp(48px,7vw,96px);font-weight:900;line-height:.98;letter-spacing:-.085em;margin:25px 0 28px}
    .hero-title em{color:var(--accent);font-style:normal}
    .hero-desc{max-width:480px;color:#bdc5bc;font-size:16px;line-height:1.95}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
    .hero-meta{display:flex;gap:26px;margin-top:48px;padding-top:20px;border-top:1px solid #485248;color:#aeb7ae;font-size:12px}
    .hero-meta strong{display:block;color:#f7f6f0;font-size:21px;line-height:1.2;margin-bottom:4px}
    .hero-visual{position:relative;min-height:624px;overflow:hidden}
    .hero-visual img{height:100%;filter:saturate(.78);object-position:center}
    .hero-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--deep) 0%,transparent 22%),linear-gradient(0deg,rgba(14,20,15,.72),transparent 55%)}
    .visual-card{position:absolute;z-index:2;right:8%;bottom:9%;width:min(340px,76%);padding:22px;background:rgba(32,41,34,.88);border:1px solid rgba(221,231,212,.3);border-radius:14px}
    .visual-card h2{font-size:26px;line-height:1.2;letter-spacing:-.05em;margin:12px 0}
    .visual-card p{font-size:12px;color:#c1cbc0;margin:0}
    .metric-strip{display:grid;grid-template-columns:1.5fr repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .metric{padding:28px 24px;border-right:1px solid var(--line)}
    .metric:last-child{border-right:0}
    .metric small{display:block;color:var(--muted);font-size:12px;margin-bottom:12px}
    .metric strong{font-size:clamp(26px,3vw,44px);letter-spacing:-.07em;line-height:1}
    .metric p{font-size:12px;color:var(--muted);margin:11px 0 0}
    .metric.primary{background:var(--deep);color:#fff}
    .metric.primary small,.metric.primary p{color:#bbc3b9}
    .metric.primary strong{color:var(--accent);font-size:54px}
    .index-layout{display:grid;grid-template-columns:3fr 1.2fr;gap:20px}
    .index-panel,.side-panel,.profile-card,.team-row,.update-panel,.article-preview,.faq-wrap,.cta-box{background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}
    .index-panel{padding:32px}
    .filter-bar{display:flex;flex-wrap:wrap;gap:9px;margin:22px 0 28px}
    .filter{padding:9px 14px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--muted);font-size:12px}
    .filter.active,.filter:hover{background:var(--accent);border-color:var(--accent);color:var(--deep);font-weight:700}
    .index-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
    .index-item{display:flex;align-items:center;justify-content:space-between;padding:17px 18px;border-top:1px solid var(--line);transition:.25s}
    .index-item:hover{background:var(--bg-soft);padding-left:22px}
    .index-item b{font-size:15px}
    .index-item span{font-size:11px;color:var(--muted)}
    .side-panel{padding:28px;background:var(--bg-soft)}
    .side-panel h3{font-size:23px;letter-spacing:-.05em;margin:0 0 20px}
    .side-list{list-style:none;padding:0;margin:0}
    .side-list li{display:flex;gap:13px;padding:15px 0;border-top:1px solid var(--line);font-size:13px}
    .side-list i{font-style:normal;color:var(--muted);font-size:11px}
    .spotlight{display:grid;grid-template-columns:1.1fr .9fr;gap:20px;align-items:stretch}
    .spotlight-image{min-height:460px;overflow:hidden;border-radius:var(--radius);position:relative;background:var(--deep)}
    .spotlight-image img{height:100%;transition:.45s}
    .spotlight-image:hover img{transform:scale(1.035)}
    .spotlight-image:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(20,28,21,.8),transparent 60%)}
    .spotlight-caption{position:absolute;z-index:1;left:32px;right:32px;bottom:28px;color:#fff}
    .spotlight-caption h2{font-size:clamp(30px,4vw,54px);line-height:1.08;letter-spacing:-.07em;margin:14px 0 0}
    .profile-card{padding:36px;display:flex;flex-direction:column;justify-content:space-between}
    .profile-card h2{font-size:34px;line-height:1.15;letter-spacing:-.06em;margin:17px 0}
    .profile-card p{font-size:14px;color:var(--muted);line-height:1.9}
    .profile-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:28px}
    .profile-stat{padding:16px;background:var(--bg-soft);border-radius:10px}
    .profile-stat strong{display:block;font-size:26px;line-height:1}
    .profile-stat span{font-size:11px;color:var(--muted)}
    .team-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}
    .team-row{padding:20px 22px;display:flex;align-items:center;gap:17px;transition:.28s}
    .team-row:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#acc66a}
    .team-badge{width:48px;height:48px;display:grid;place-items:center;border-radius:13px;background:var(--deep);color:var(--accent);font-weight:900;font-size:14px}
    .team-row h3{font-size:17px;margin:0;line-height:1.25}
    .team-row p{font-size:12px;color:var(--muted);margin:4px 0 0}
    .team-row .arrow{margin-left:auto;font-size:20px;color:var(--muted)}
    .data-zone{background:var(--deep);color:#f7f6f0}
    .data-zone .eyebrow{color:#bbc3b9}
    .data-layout{display:grid;grid-template-columns:1fr 1.45fr;gap:70px;align-items:start}
    .data-layout h2{font-size:clamp(34px,5vw,66px);line-height:1.02;letter-spacing:-.08em;margin:18px 0 24px}
    .data-layout p{color:#bdc5bc;font-size:14px}
    .bars{display:flex;flex-direction:column;gap:20px}
    .bar-row{display:grid;grid-template-columns:118px 1fr 50px;gap:14px;align-items:center;font-size:12px;color:#c2ccc0}
    .bar-track{height:9px;background:#3d493e;border-radius:20px;overflow:hidden}
    .bar-track span{display:block;height:100%;background:var(--accent);border-radius:20px}
    .bar-row strong{color:var(--accent);text-align:right}
    .article-layout{display:grid;grid-template-columns:1fr 1fr;gap:20px}
    .article-preview{padding:30px}
    .article-preview.large{grid-row:span 2;background:var(--card)}
    .article-preview h3{font-size:26px;line-height:1.2;letter-spacing:-.05em;margin:15px 0 12px}
    .article-preview p{font-size:13px;color:var(--muted);line-height:1.85;margin:0 0 25px}
    .article-preview.large p{font-size:15px}
    .article-meta{display:flex;gap:12px;align-items:center;color:var(--muted);font-size:11px}
    .article-meta time{font-variant-numeric:tabular-nums}
    .reading-layout{display:grid;grid-template-columns:.8fr 1.5fr;gap:70px;align-items:start}
    .reading-layout h2{font-size:clamp(32px,4vw,52px);line-height:1.08;letter-spacing:-.07em;margin:14px 0}
    .reading-copy{font-size:15px;color:var(--muted);line-height:2}
    .reading-copy p{margin:0 0 20px}
    .reading-copy blockquote{margin:28px 0;padding:17px 22px;border-left:3px solid var(--accent);background:var(--card);color:var(--ink);font-weight:700}
    .faq-grid{display:grid;grid-template-columns:.75fr 1.35fr;gap:70px}
    .faq-grid h2{font-size:clamp(32px,4vw,54px);line-height:1.05;letter-spacing:-.07em;margin:14px 0}
    .faq-list{border-top:1px solid var(--line)}
    details{border-bottom:1px solid var(--line);padding:20px 0}
    summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;font-size:15px;font-weight:700}
    summary::-webkit-details-marker{display:none}
    summary:after{content:"+";font-size:22px;font-weight:400;color:var(--muted);line-height:1}
    details[open] summary:after{content:"−";color:var(--ink)}
    details p{color:var(--muted);font-size:13px;line-height:1.9;margin:14px 35px 0 0}
    .cta-box{background:var(--accent);padding:48px;display:grid;grid-template-columns:.9fr 1.1fr;gap:45px}
    .cta-box h2{font-size:clamp(32px,4vw,53px);line-height:1.05;letter-spacing:-.07em;margin:14px 0}
    .cta-box p{font-size:14px;color:#4d5c42}
    .subscribe-form{display:grid;grid-template-columns:1fr 1fr;gap:14px}
    .field{display:flex;flex-direction:column;gap:7px}
    .field.full{grid-column:1/-1}
    .field label{font-size:12px;font-weight:700;color:#405137}
    .field input,.field select,.field textarea{width:100%;border:1px solid rgba(32,41,34,.25);border-radius:9px;background:rgba(255,255,255,.45);padding:12px 13px;color:var(--ink);font-size:13px}
    .field textarea{min-height:100px;resize:vertical}
    .field input::placeholder,.field textarea::placeholder{color:#718066}
    .field input:invalid:not(:placeholder-shown){border-color:#a95045}
    .field input:disabled{opacity:.5;cursor:not-allowed}
    .checkline{display:flex;gap:8px;align-items:flex-start;font-size:11px;color:#53614c;grid-column:1/-1}
    .checkline input{margin-top:5px;accent-color:var(--deep)}
    footer{background:var(--deep);color:#e8ece4;padding:58px 0 25px}
    .footer-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:42px;padding-bottom:48px;border-bottom:1px solid #465146}
    .footer-brand p{max-width:330px;color:#aeb8ad;font-size:13px;line-height:1.9;margin-top:18px}
    footer .logo{color:#fff}
    footer h4{font-size:13px;margin:5px 0 15px;color:#fff}
    .footer-links{display:flex;flex-direction:column;gap:8px;color:#aeb8ad;font-size:12px}
    .footer-links a{transition:.2s}
    .footer-links a:hover{color:var(--accent)}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:22px;color:#89958a;font-size:11px;flex-wrap:wrap}
    .reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}
    .reveal.visible{opacity:1;transform:none}
    @media(max-width:1024px){
      .nav-links{gap:13px}
      .search-link{display:none}
      .hero-inner{grid-template-columns:1fr}
      .hero-copy{padding-right:24px;min-height:530px}
      .hero-visual{min-height:430px}
      .data-layout,.reading-layout,.faq-grid{grid-template-columns:1fr;gap:35px}
      .footer-top{grid-template-columns:1.6fr 1fr 1fr}
      .footer-top>div:last-child{grid-column:2}
    }
    @media(max-width:768px){
      .container{width:min(calc(100% - 32px),var(--container))}
      .nav{height:68px}
      .nav-links{display:none;position:absolute;top:68px;left:16px;right:16px;padding:16px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:2px}
      .nav-links.open{display:flex}
      .nav-links a{padding:10px 12px}
      .menu-btn{display:block}
      .hero-inner{padding-top:68px}
      .hero-copy{padding:58px 16px;min-height:500px}
      .hero-title{font-size:clamp(48px,15vw,78px)}
      .hero-visual{min-height:360px}
      .visual-card{right:16px;bottom:18px}
      .metric-strip{grid-template-columns:repeat(2,1fr)}
      .metric{border-bottom:1px solid var(--line)}
      .metric.primary{grid-column:1/-1}
      .index-layout,.spotlight,.article-layout,.cta-box{grid-template-columns:1fr}
      .index-grid,.team-list{grid-template-columns:1fr}
      .spotlight-image{min-height:360px}
      .article-preview.large{grid-row:auto}
      .subscribe-form{grid-template-columns:1fr}
      .field.full,.checkline{grid-column:auto}
      .cta-box{padding:30px 22px;gap:25px}
      .footer-top{grid-template-columns:1fr 1fr;gap:30px}
      .footer-top>div:last-child{grid-column:auto}
    }
    @media(max-width:520px){
      .section{padding-block:68px}
      .section-head{display:block;margin-bottom:28px}
      .section-intro{margin-top:16px}
      .hero-meta{gap:16px;flex-wrap:wrap}
      .metric{padding:21px 16px}
      .metric.primary strong{font-size:45px}
      .index-panel,.profile-card,.article-preview{padding:23px}
      .bar-row{grid-template-columns:75px 1fr 35px;gap:8px;font-size:11px}
      .footer-top{grid-template-columns:1fr}
      .footer-bottom{display:block}
      .footer-bottom span{display:block;margin-top:7px}
    }
    @media(prefers-reduced-motion:reduce){
      *,*:before,*:after{scroll-behavior:auto!important;transition:none!important}
      .reveal{opacity:1;transform:none}
    }
    @media print{
      .nav-wrap,.nav-tools,.hero-actions,.cta-box{display:none}
      .hero-inner{padding-top:0;background:#fff;color:#000}
      .hero-copy{min-height:auto}
      footer{background:#fff;color:#000}
    }

/* roulang page: category6 */
:root{
      --bg:#f2f0eb;
      --bg-soft:#e9e7e0;
      --ink:#1b211d;
      --muted:#6d746c;
      --deep:#202922;
      --line:#d6d5cc;
      --accent:#b7d84b;
      --accent-hover:#c9ed5b;
      --card:#fbfaf6;
      --shadow:0 18px 45px rgba(31,40,31,.08);
      --radius:18px;
      --container:1240px;
      --space:clamp(72px,9vw,132px);
      --title-weight:800;
      --body-leading:1.85;
      --breakpoint:1024px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      background:var(--bg);
      color:var(--ink);
      font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
      line-height:var(--body-leading);
      overflow-x:hidden
    }
    a{color:inherit;text-decoration:none}
    img{display:block;width:100%;max-width:100%;object-fit:cover}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    .container{width:min(calc(100% - 48px),var(--container));margin-inline:auto}
    .eyebrow{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
    .eyebrow:before{content:"";display:block;width:24px;height:2px;background:var(--accent)}
    .section{padding-block:var(--space)}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:42px}
    .section-title{font-size:clamp(30px,4vw,58px);line-height:1.08;letter-spacing:-.06em;font-weight:var(--title-weight);margin:0}
    .section-intro{max-width:540px;color:var(--muted);font-size:15px;line-height:1.9}
    .nav-wrap{position:fixed;z-index:40;top:0;left:0;width:100%;transition:.3s ease}
    .nav-wrap.scrolled{background:rgba(242,240,235,.95);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
    .nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:26px}
    .logo{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:900;letter-spacing:-.05em;white-space:nowrap}
    .logo-mark{width:30px;height:30px;display:grid;place-items:center;background:var(--accent);border-radius:9px;font-size:12px;font-weight:900}
    .nav-links{display:flex;align-items:center;gap:22px;font-size:13px;color:#535b53}
    .nav-links a{position:relative;padding:8px 0;transition:.25s}
    .nav-links a:after{content:"";position:absolute;left:0;right:100%;bottom:1px;height:2px;background:var(--accent);transition:.25s}
    .nav-links a:hover,.nav-links a.active{color:var(--ink);font-weight:700}
    .nav-links a.active:after,.nav-links a:hover:after{right:0}
    .nav-tools{display:flex;align-items:center;gap:10px}
    .search-link,.menu-btn{border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--ink);padding:9px 13px;font-size:12px;transition:.25s}
    .search-link:hover,.menu-btn:hover{border-color:var(--ink);background:var(--card)}
    .menu-btn{display:none}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:46px;padding:0 19px;border-radius:10px;border:1px solid transparent;font-size:13px;font-weight:700;transition:.25s ease}
    .btn:focus,.search-link:focus,.menu-btn:focus,input:focus,select:focus,textarea:focus,summary:focus{outline:3px solid rgba(183,216,75,.55);outline-offset:3px}
    .btn:active{transform:scale(.97)}
    .btn-primary{background:var(--accent);color:var(--deep)}
    .btn-primary:hover{background:var(--accent-hover);transform:translateY(-2px)}
    .btn-outline{border-color:#59645a;color:#f7f6f0}
    .btn-outline:hover{background:#f7f6f0;color:var(--deep);border-color:#f7f6f0}
    .btn-dark{background:var(--deep);color:#f7f6f0}
    .btn-dark:hover{background:#354238;transform:translateY(-2px)}
    .btn-arrow{padding:0;background:none;color:var(--ink);min-height:auto}
    .btn-arrow span{transition:.25s}
    .btn-arrow:hover span{transform:translateX(5px)}
    .tag{display:inline-flex;padding:5px 9px;border-radius:6px;background:#e2e4db;color:#526050;font-size:11px;line-height:1.2;font-weight:700}
    .tag.accent{background:var(--accent);color:var(--deep)}
    .hero-inner{padding-top:76px;min-height:690px;display:grid;grid-template-columns:52% 48%;background:var(--deep);color:#f7f6f0}
    .hero-copy{padding:78px max(30px,calc((100vw - var(--container))/2)) 72px max(30px,calc((100vw - var(--container))/2));display:flex;flex-direction:column;justify-content:center}
    .hero-copy .eyebrow{color:#bbc3b9}
    .hero-title{font-size:clamp(46px,6.8vw,94px);font-weight:900;line-height:1.02;letter-spacing:-.085em;margin:24px 0 26px}
    .hero-title em{font-style:normal;color:var(--accent)}
    .hero-desc{max-width:530px;color:#bdc5bc;font-size:16px;line-height:1.95}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
    .hero-note{display:flex;align-items:center;gap:12px;margin-top:28px;color:#aeb7ae;font-size:12px}
    .live-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px rgba(183,216,75,.12)}
    .hero-visual{position:relative;min-height:614px;overflow:hidden}
    .hero-visual img{height:100%;filter:saturate(.78);object-position:center}
    .hero-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--deep),transparent 25%),linear-gradient(0deg,rgba(14,20,15,.68),transparent 58%)}
    .visual-card{position:absolute;z-index:2;right:8%;bottom:8%;width:min(330px,82%);padding:24px;background:rgba(32,41,34,.88);border:1px solid rgba(232,239,224,.22);border-radius:16px;backdrop-filter:blur(8px)}
    .visual-card h2{font-size:25px;line-height:1.25;margin:12px 0 8px;letter-spacing:-.04em}
    .visual-card p{font-size:13px;color:#c8d0c6;margin:0}
    .status-line{display:flex;justify-content:space-between;border-top:1px solid #5a675a;margin-top:19px;padding-top:14px;color:#aeb8ad;font-size:12px}
    .status-line strong{color:var(--accent)}
    .metric-strip{background:var(--card);border-bottom:1px solid var(--line);display:grid;grid-template-columns:1.25fr repeat(4,1fr)}
    .metric{padding:29px 27px;border-right:1px solid var(--line)}
    .metric:last-child{border-right:0}
    .metric strong{display:block;font-size:clamp(28px,3vw,46px);line-height:1.05;letter-spacing:-.07em}
    .metric span{display:block;color:var(--muted);font-size:12px;margin-top:9px}
    .metric small{display:block;color:#8a9287;font-size:11px;margin-top:3px}
    .surface{background:var(--bg-soft)}
    .panel-grid{display:grid;grid-template-columns:5fr 7fr;gap:20px}
    .panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:32px}
    .panel.dark{background:var(--deep);color:#f7f6f0;border-color:var(--deep)}
    .panel h3{font-size:27px;line-height:1.25;letter-spacing:-.05em;margin:13px 0 10px}
    .panel p{color:var(--muted);font-size:14px;line-height:1.85;margin:0}
    .dark p{color:#bec8bd}
    .option-list{display:grid;gap:0;margin-top:25px}
    .option{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:14px;border-top:1px solid var(--line);padding:18px 0}
    .option-num{font-size:12px;color:var(--muted);font-weight:800}
    .option strong{display:block;font-size:15px}
    .option small{color:var(--muted);font-size:12px}
    .option-mark{width:24px;height:24px;border:1px solid var(--line);border-radius:7px;display:grid;place-items:center;color:var(--deep);font-size:12px}
    .option:hover .option-mark{background:var(--accent);border-color:var(--accent)}
    .content-grid{display:grid;grid-template-columns:7fr 5fr;gap:48px;align-items:start}
    .reading-copy{font-size:16px;line-height:2.05;color:#3d463e}
    .reading-copy p{margin:0 0 21px}
    .reading-copy p:last-child{margin-bottom:0}
    .aside-note{border-left:3px solid var(--accent);padding:7px 0 7px 24px;color:var(--muted);font-size:14px;line-height:1.9}
    .aside-note strong{display:block;color:var(--ink);font-size:25px;line-height:1.2;margin-bottom:9px}
    .step-list{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .step{padding:27px;background:var(--card);border:1px solid var(--line);border-radius:14px;transition:.25s}
    .step:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#a9bf68}
    .step-index{font-size:12px;color:#829175;font-weight:800}
    .step h3{font-size:20px;margin:17px 0 7px;line-height:1.3}
    .step p{margin:0;color:var(--muted);font-size:13px;line-height:1.8}
    .form-section{background:var(--deep);color:#f7f6f0}
    .form-layout{display:grid;grid-template-columns:4fr 7fr;gap:70px;align-items:start}
    .form-section .section-intro{color:#bbc5ba}
    .form-copy h2{font-size:clamp(34px,4vw,56px);line-height:1.08;letter-spacing:-.065em;margin:17px 0 19px}
    .form-copy p{color:#bbc5ba;font-size:14px;line-height:1.9}
    .privacy{font-size:12px!important;color:#8f9c8f!important;margin-top:23px}
    .subscribe-form{background:var(--card);color:var(--ink);border-radius:var(--radius);padding:30px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
    .field{display:flex;flex-direction:column;gap:7px}
    .field.full{grid-column:1/-1}
    .field label{font-size:12px;font-weight:700}
    .field input,.field select,.field textarea{width:100%;border:1px solid var(--line);background:#fffefa;color:var(--ink);border-radius:9px;padding:12px 13px;font-size:13px;transition:.2s}
    .field textarea{min-height:105px;resize:vertical}
    .field input::placeholder,.field textarea::placeholder{color:#a1a69d}
    .field input:hover,.field select:hover,.field textarea:hover{border-color:#a4b275}
    .field input:disabled{background:#ecece6;color:#aaa;cursor:not-allowed}
    .field-error{font-size:11px;color:#aa4b3f;display:none}
    .field.invalid input{border-color:#c36b5e;background:#fff6f3}
    .field.invalid .field-error{display:block}
    .check-line{grid-column:1/-1;display:flex;align-items:flex-start;gap:9px;font-size:12px;color:var(--muted);line-height:1.6}
    .check-line input{accent-color:#719019;margin-top:4px}
    .form-actions{grid-column:1/-1;display:flex;align-items:center;gap:18px;margin-top:4px}
    .form-message{font-size:12px;color:#69861e;display:none}
    .form-message.show{display:block}
    .rss-panel{display:grid;grid-template-columns:1fr 1fr;gap:20px}
    .rss-card{padding:30px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}
    .rss-card.featured{background:#dfe8bc;border-color:#c5d68c}
    .rss-card h3{font-size:27px;line-height:1.25;letter-spacing:-.05em;margin:14px 0 10px}
    .rss-card p{font-size:14px;color:var(--muted);line-height:1.85;margin:0 0 23px}
    .feedback-layout{display:grid;grid-template-columns:4fr 8fr;gap:48px}
    .feedback-list{border-top:1px solid var(--line)}
    .feedback-item{display:grid;grid-template-columns:125px 1fr auto;gap:20px;padding:20px 0;border-bottom:1px solid var(--line);align-items:start}
    .feedback-item time{font-size:12px;color:var(--muted)}
    .feedback-item h3{font-size:16px;line-height:1.45;margin:0 0 4px}
    .feedback-item p{font-size:13px;color:var(--muted);margin:0;line-height:1.7}
    .faq-grid{display:grid;grid-template-columns:4fr 8fr;gap:70px}
    .faq-list{border-top:1px solid var(--line)}
    details{border-bottom:1px solid var(--line);padding:18px 0}
    summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;font-size:15px;font-weight:700}
    summary::-webkit-details-marker{display:none}
    summary:after{content:"+";font-size:21px;font-weight:400;color:#7e897a}
    details[open] summary:after{content:"−"}
    details p{color:var(--muted);font-size:14px;line-height:1.9;margin:12px 30px 3px 0}
    .cta-band{padding:54px 0;background:var(--accent)}
    .cta-content{display:flex;justify-content:space-between;align-items:center;gap:30px}
    .cta-content h2{font-size:clamp(28px,4vw,52px);line-height:1.08;letter-spacing:-.06em;margin:0 0 10px}
    .cta-content p{margin:0;color:#4d5e29;font-size:14px}
    footer{background:#182019;color:#f1f3eb;padding:68px 0 25px}
    .footer-top{display:grid;grid-template-columns:2.2fr 1fr 1fr 1fr;gap:48px;padding-bottom:52px}
    .footer-brand p{max-width:340px;color:#aab5a8;font-size:13px;line-height:1.9;margin-top:18px}
    footer h4{font-size:13px;margin:5px 0 17px;color:#f1f3eb}
    .footer-links{display:grid;gap:9px;color:#aab5a8;font-size:13px}
    .footer-links a{transition:.2s}
    .footer-links a:hover{color:var(--accent)}
    .footer-bottom{border-top:1px solid #39453b;padding-top:20px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:#899589;font-size:11px}
    .reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}
    .reveal.visible{opacity:1;transform:none}
    @media(max-width:1024px){
      .nav-links{gap:13px}
      .search-link{display:none}
      .hero-inner{grid-template-columns:1fr}
      .hero-copy{padding:115px 24px 60px;min-height:510px}
      .hero-visual{min-height:420px}
      .metric-strip{grid-template-columns:repeat(3,1fr)}
      .metric:first-child{grid-column:span 3}
      .metric:nth-child(3){border-right:0}
      .form-layout,.faq-grid{grid-template-columns:1fr;gap:34px}
      .footer-top{grid-template-columns:2fr 1fr 1fr}
      .footer-brand{grid-column:1/-1}
    }
    @media(max-width:768px){
      .container{width:min(calc(100% - 32px),var(--container))}
      .nav{height:68px}
      .nav-links{display:none;position:absolute;top:68px;left:16px;right:16px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:15px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:2px}
      .nav-links.open{display:flex}
      .nav-links a{padding:11px 9px}
      .menu-btn{display:block}
      .hero-inner{padding-top:68px}
      .hero-title{font-size:clamp(44px,13vw,72px)}
      .hero-visual{min-height:360px}
      .metric-strip{grid-template-columns:1fr 1fr}
      .metric:first-child{grid-column:span 2}
      .metric:nth-child(3){border-right:1px solid var(--line)}
      .metric:nth-child(2n){border-right:0}
      .panel-grid,.content-grid,.rss-panel,.feedback-layout{grid-template-columns:1fr;gap:20px}
      .step-list{grid-template-columns:1fr}
      .subscribe-form{grid-template-columns:1fr}
      .field.full,.check-line,.form-actions{grid-column:auto}
      .form-actions{flex-wrap:wrap}
      .feedback-item{grid-template-columns:1fr;gap:5px}
      .feedback-item .tag{width:max-content}
      .section-head{display:block;margin-bottom:28px}
      .section-intro{margin-top:17px}
      .cta-content{display:block}
      .cta-content .btn{margin-top:24px}
      .footer-top{grid-template-columns:1fr 1fr;gap:30px}
    }
    @media(max-width:520px){
      .hero-copy{padding-inline:16px}
      .hero-actions .btn{width:100%}
      .visual-card{right:16px;left:16px;width:auto}
      .metric{padding:22px 16px}
      .panel,.rss-card{padding:24px}
      .footer-top{grid-template-columns:1fr}
      .footer-bottom{display:block}
      .footer-bottom span{display:block;margin-bottom:8px}
    }
    @media(prefers-reduced-motion:reduce){
      *,*:before,*:after{scroll-behavior:auto!important;transition:none!important}
      .reveal{opacity:1;transform:none}
    }
    @media print{
      .nav-wrap,.hero-actions,.subscribe-form,.cta-band{display:none}
      body{background:#fff;color:#000}
      .section{padding-block:35px}
    }