/* roulang page: index */
:root{
      --ink:#242321;
      --muted:#77736d;
      --paper:#f7f4ef;
      --white:#fffdf9;
      --line:#ded8cf;
      --coral:#df6e55;
      --coral-dark:#b9513d;
      --sage:#8ea99a;
      --plum:#625568;
      --night:#28252c;
      --cream:#eee6da;
      --radius-sm:12px;
      --radius-md:22px;
      --radius-lg:34px;
      --shadow:0 18px 48px rgba(47,39,30,.09);
      --shadow-soft:0 8px 24px rgba(47,39,30,.06);
      --ease:cubic-bezier(.22,.61,.36,1);
    }
    *,*::before,*::after{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--ink);
      background:var(--paper);
      font-family:"Noto Sans SC","Microsoft YaHei","PingFang SC","Hiragino Sans GB",Arial,sans-serif;
      font-size:16px;
      line-height:1.85;
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none;transition:color .25s var(--ease)}
    a:hover{color:var(--coral-dark)}
    img{display:block;width:100%;max-width:100%;object-fit:cover}
    button,input,textarea{font:inherit}
    button{cursor:pointer}
    .container{max-width:1240px;padding-left:24px;padding-right:24px}
    .section{padding:104px 0}
    .section-tight{padding:78px 0}
    .eyebrow{
      display:inline-flex;align-items:center;gap:9px;
      color:var(--coral-dark);font-size:12px;font-weight:800;
      letter-spacing:.16em;text-transform:uppercase;
    }
    .eyebrow::before{content:"";display:block;width:28px;height:2px;background:var(--coral)}
    h1,h2,h3,h4{font-weight:800;letter-spacing:-.045em;line-height:1.22;margin:0 0 20px}
    h1{font-size:clamp(42px,6vw,82px)}
    h2{font-size:clamp(32px,4vw,54px)}
    h3{font-size:clamp(21px,2vw,28px)}
    p{margin:0 0 18px;color:var(--muted)}
    .lead{font-size:18px;line-height:2;color:#5e5953}
    .btn{
      min-height:50px;padding:11px 22px;border-radius:999px;
      font-weight:750;border:1px solid transparent;transition:all .25s var(--ease);
    }
    .btn:focus-visible,.form-control:focus-visible,.search-box:focus-within,a:focus-visible{
      outline:3px solid rgba(223,110,85,.28);outline-offset:3px;
    }
    .btn-primary{background:var(--coral);border-color:var(--coral);color:#fff}
    .btn-primary:hover{background:var(--coral-dark);border-color:var(--coral-dark);color:#fff;transform:translateY(-2px);box-shadow:0 10px 22px rgba(185,81,61,.22)}
    .btn-primary:active{transform:translateY(0);box-shadow:none}
    .btn-outline{background:transparent;border-color:#bcb4aa;color:var(--ink)}
    .btn-outline:hover{background:var(--ink);border-color:var(--ink);color:#fff;transform:translateY(-2px)}
    .btn-text{padding-left:0;padding-right:0;color:var(--coral-dark);background:none}
    .btn-text:hover{color:var(--ink);transform:translateX(4px)}
    .btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}
    .site-header{
      position:sticky;top:0;z-index:1000;background:rgba(247,244,239,.94);
      border-bottom:1px solid rgba(222,216,207,.85);backdrop-filter:blur(10px);
    }
    .navbar{min-height:82px}
    .brand{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:850;white-space:nowrap}
    .brand-mark{
      width:34px;height:34px;border-radius:12px 12px 12px 4px;background:var(--coral);
      position:relative;transform:rotate(-7deg);display:inline-block;
    }
    .brand-mark::after{content:"";position:absolute;width:11px;height:11px;border:2px solid #fff;border-radius:50%;left:11px;top:9px}
    .nav-center{flex:1;display:flex;justify-content:center;padding:0 38px}
    .search-box{
      width:min(440px,100%);height:48px;display:flex;align-items:center;
      gap:10px;padding:0 16px;border:1px solid var(--line);border-radius:999px;
      background:var(--white);transition:all .25s var(--ease);
    }
    .search-box:focus-within{border-color:var(--coral);box-shadow:0 0 0 5px rgba(223,110,85,.1)}
    .search-box svg{width:18px;flex:0 0 auto;color:var(--coral-dark)}
    .search-box input{border:0;outline:0;background:transparent;width:100%;min-width:0;color:var(--ink)}
    .search-box input::placeholder{color:#aaa39a}
    .nav-links{display:flex;align-items:center;gap:4px}
    .nav-links .nav-link{padding:9px 11px;border-radius:999px;font-size:14px;color:#69635c;white-space:nowrap}
    .nav-links .nav-link:hover,.nav-links .nav-link.active{background:var(--cream);color:var(--ink)}
    .navbar-toggler{border:1px solid var(--line);border-radius:10px;padding:8px 11px}
    .hero{
      min-height:690px;padding:86px 0 92px;position:relative;overflow:hidden;
      background:var(--paper);
    }
    .hero::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:#eaded2;right:-180px;top:-160px;opacity:.62}
    .hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:70px;align-items:center;position:relative;z-index:1}
    .hero-copy{max-width:650px}
    .hero-copy h1{max-width:680px;margin-top:24px}
    .hero-copy h1 span{color:var(--coral-dark)}
    .hero-copy .lead{max-width:600px;font-size:19px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:32px 0 35px}
    .hero-meta{display:flex;gap:28px;flex-wrap:wrap}
    .meta-item{border-left:2px solid var(--coral);padding-left:13px}
    .meta-item strong{font-size:24px;display:block;line-height:1.2}
    .meta-item small{color:var(--muted);font-size:13px}
    .hero-art{position:relative}
    .hero-photo{height:520px;border-radius:var(--radius-lg);box-shadow:var(--shadow);object-position:center}
    .hero-note{
      position:absolute;left:-28px;bottom:28px;background:var(--white);padding:18px 20px;
      width:220px;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-soft);
      animation:floatIn 6s ease-in-out infinite alternate;
    }
    .hero-note b{display:block;font-size:25px;color:var(--coral-dark);line-height:1.25}
    .hero-note span{font-size:13px;color:var(--muted)}
    .hero-stamp{position:absolute;right:-20px;top:28px;background:var(--night);color:#fff;padding:16px;border-radius:50%;width:98px;height:98px;display:grid;place-items:center;text-align:center;font-size:12px;line-height:1.45;transform:rotate(10deg)}
    @keyframes floatIn{to{transform:translateY(-8px)}}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:42px}
    .section-head p{max-width:560px;margin-bottom:4px}
    .feature-row{display:grid;grid-template-columns:1.15fr .9fr .9fr;gap:18px}
    .feature-item{padding:28px;border-top:2px solid var(--ink);min-height:220px}
    .feature-item:nth-child(2){background:var(--cream);border-radius:0 25px 25px 25px}
    .feature-item:nth-child(3){background:var(--night);color:#fff;border-radius:25px 0 25px 25px}
    .feature-item:nth-child(3) p,.feature-item:nth-child(3) .feature-kicker{color:#cfc7c8}
    .feature-kicker{color:var(--coral-dark);font-weight:800;font-size:14px}
    .feature-number{font-size:48px;font-weight:800;color:var(--coral);line-height:1;margin:22px 0 16px}
    .feature-item h3{font-size:24px}
    .feature-item p{font-size:15px}
    .vertical-section{background:#e9e2d8}
    .vertical-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:72px;align-items:start}
    .vertical-intro{position:sticky;top:120px}
    .vertical-intro h2{max-width:450px}
    .vertical-intro p{max-width:410px}
    .portrait-stack{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
    .portrait-card{position:relative;min-height:410px;overflow:hidden;border-radius:26px;background:var(--night)}
    .portrait-card:first-child{grid-row:span 2;min-height:620px}
    .portrait-card img{height:100%;position:absolute;inset:0;transition:transform .6s var(--ease);opacity:.88}
    .portrait-card:hover img{transform:scale(1.05)}
    .portrait-card::after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(25,22,27,.8))}
    .portrait-content{position:absolute;z-index:1;bottom:22px;left:22px;right:22px;color:#fff}
    .portrait-content p{color:#eee7e0;font-size:14px;margin:0}
    .tag{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;background:#f0d8cd;color:#9d493c;font-size:12px;font-weight:750;margin-bottom:12px}
    .tag.sage{background:#dce7df;color:#52705e}.tag.dark{background:rgba(255,255,255,.16);color:#fff}
    .hot-section{background:var(--white)}
    .hot-layout{display:grid;grid-template-columns:1.08fr .92fr;gap:26px}
    .hot-main{position:relative;min-height:530px;border-radius:var(--radius-lg);overflow:hidden;background:var(--night)}
    .hot-main img{height:100%;position:absolute;inset:0;opacity:.72;transition:transform .6s var(--ease)}
    .hot-main:hover img{transform:scale(1.04)}
    .hot-main::after{content:"";position:absolute;inset:25% 0 0;background:linear-gradient(transparent,rgba(24,21,25,.9))}
    .hot-main-content{position:absolute;z-index:1;bottom:30px;left:32px;right:32px;color:#fff}
    .hot-main-content p{color:#eee6de;max-width:520px}
    .hot-list{border-top:1px solid var(--line)}
    .hot-entry{display:grid;grid-template-columns:58px 1fr auto;gap:17px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}
    .hot-entry .rank{font-size:28px;font-weight:850;color:var(--coral)}
    .hot-entry h3{font-size:20px;margin:0 0 5px}
    .hot-entry p{font-size:14px;margin:0}
    .arrow{font-size:22px;color:var(--coral-dark)}
    .category-section{background:var(--paper)}
    .category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .category-card{border:1px solid var(--line);padding:26px;background:var(--white);border-radius:16px;transition:all .3s var(--ease)}
    .category-card:nth-child(2),.category-card:nth-child(5){transform:translateY(22px)}
    .category-card:hover{transform:translateY(-5px);border-color:var(--coral);box-shadow:var(--shadow-soft)}
    .category-card:nth-child(2):hover,.category-card:nth-child(5):hover{transform:translateY(17px)}
    .category-card img{height:155px;border-radius:11px;margin-bottom:22px}
    .category-card h3{font-size:22px}
    .category-card p{font-size:14px;min-height:58px}
    .category-link{font-weight:800;color:var(--coral-dark);font-size:14px}
    .calendar-section{background:var(--night);color:#fff}
    .calendar-section p{color:#cfc7c8}
    .calendar-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center}
    .calendar-intro h2{max-width:440px}
    .calendar-list{border-top:1px solid rgba(255,255,255,.2)}
    .calendar-item{display:grid;grid-template-columns:105px 1fr 90px;gap:20px;align-items:center;padding:20px 0;border-bottom:1px solid rgba(255,255,255,.2)}
    .calendar-date{color:#efa08d;font-weight:800}
    .calendar-item h3{font-size:18px;margin:0;color:#fff}
    .calendar-item p{font-size:13px;margin:3px 0 0}
    .calendar-state{font-size:12px;text-align:right;color:#cfc7c8}
    .scene-section{background:#dfe8e2}
    .scene-grid{display:grid;grid-template-columns:1fr 1.18fr;gap:70px;align-items:center}
    .scene-image-wrap{position:relative;padding:0 0 26px 26px}
    .scene-image-wrap::before{content:"";position:absolute;left:0;bottom:0;width:80%;height:78%;border:1px solid var(--sage);border-radius:24px;z-index:0}
    .scene-image{height:510px;border-radius:24px;position:relative;z-index:1}
    .scene-copy h2{max-width:500px}
    .scene-copy p{max-width:580px}
    .steps{display:grid;gap:0;margin-top:28px}
    .step{display:grid;grid-template-columns:45px 1fr;gap:17px;padding:18px 0;border-bottom:1px solid rgba(70,91,77,.25)}
    .step:last-child{border-bottom:0}
    .step-no{width:34px;height:34px;border-radius:50%;background:var(--sage);color:#fff;display:grid;place-items:center;font-weight:800}
    .step h3{font-size:18px;margin:0 0 4px}
    .step p{font-size:14px;margin:0}
    .viewpoint-section{background:var(--cream)}
    .viewpoint-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:22px}
    .quote-card{background:var(--white);padding:36px;border-radius:28px;min-height:300px;display:flex;flex-direction:column;justify-content:space-between}
    .quote-card blockquote{font-size:29px;line-height:1.5;font-weight:750;letter-spacing:-.04em;margin:0}
    .quote-card cite{font-style:normal;color:var(--muted);font-size:14px}
    .insight-column{display:grid;gap:18px}
    .insight-card{padding:24px;border:1px solid #d4c6b7;background:rgba(255,255,255,.42);border-radius:16px}
    .insight-card h3{font-size:20px;margin-bottom:8px}
    .insight-card p{font-size:14px;margin:0}
    .trust-section{padding:70px 0;background:var(--white)}
    .trust-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .trust-item{padding:28px 20px;border-right:1px solid var(--line)}
    .trust-item:last-child{border-right:0}
    .trust-item strong{display:block;font-size:38px;color:var(--coral-dark);line-height:1.2}
    .trust-item span{font-size:14px;color:var(--muted)}
    .news-section{background:var(--paper)}
    .news-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:60px}
    .news-list{border-top:2px solid var(--ink)}
    .news-item{display:grid;grid-template-columns:100px 1fr 90px;gap:20px;align-items:start;padding:24px 0;border-bottom:1px solid var(--line)}
    .news-date{font-size:13px;color:var(--coral-dark);font-weight:800;padding-top:4px}
    .news-item h3{font-size:21px;margin:0 0 7px}
    .news-item p{font-size:14px;margin:0;line-height:1.7}
    .news-more{font-size:13px;color:var(--coral-dark);padding-top:7px;text-align:right}
    .news-feature{background:var(--night);color:#fff;border-radius:26px;overflow:hidden}
    .news-feature img{height:220px}
    .news-feature-body{padding:28px}
    .news-feature-body p{color:#d9d0d0;font-size:14px}
    .brand-section{background:var(--white)}
    .brand-layout{display:grid;grid-template-columns:.64fr 1.36fr;gap:80px;align-items:start}
    .brand-markline{font-size:14px;color:var(--coral-dark);font-weight:800;letter-spacing:.12em}
    .brand-copy p{font-size:17px;line-height:2.05;color:#5d5852}
    .brand-copy p + p{margin-top:18px}
    .brand-index{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:25px}
    .index-item{padding:16px;border-left:2px solid var(--coral);background:var(--paper);font-size:14px}
    .feedback-section{background:#e7ddd4}
    .feedback-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:start}
    .feedback-copy h2{max-width:400px}
    .feedback-form{background:var(--white);padding:34px;border-radius:24px;box-shadow:var(--shadow-soft)}
    .form-label{font-size:14px;font-weight:750;margin-bottom:7px}
    .form-control{border:1px solid var(--line);border-radius:11px;background:#fffdfb;padding:13px 15px}
    .form-control:focus{border-color:var(--coral);box-shadow:0 0 0 .22rem rgba(223,110,85,.12)}
    .privacy{font-size:12px;color:#8a8379;margin:14px 0 0}
    .form-status{display:none;color:#55755e;background:#e0ece2;border-radius:10px;padding:10px 13px;font-size:13px;margin-top:14px}
    .faq-section{background:var(--paper)}
    .faq-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:75px}
    .faq-list .accordion-item{background:transparent;border:0;border-bottom:1px solid var(--line)}
    .faq-list .accordion-button{background:transparent;color:var(--ink);font-weight:750;padding:23px 0;box-shadow:none;font-size:17px}
    .faq-list .accordion-button:not(.collapsed){color:var(--coral-dark)}
    .faq-list .accordion-button::after{background-size:14px}
    .faq-list .accordion-body{padding:0 35px 24px 0;color:var(--muted);font-size:15px}
    .related-section{padding:82px 0;background:var(--white)}
    .related-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
    .related-card{padding:25px;border:1px solid var(--line);border-radius:18px;background:var(--paper)}
    .related-card h3{font-size:20px;margin-top:14px}
    .related-card p{font-size:14px;margin:0}
    .bottom-cta{padding:100px 0;background:var(--coral);color:#fff}
    .bottom-cta .eyebrow{color:#ffe5dc}.bottom-cta .eyebrow::before{background:#fff}
    .bottom-cta h2{max-width:650px}
    .bottom-cta p{color:#ffe9e1;max-width:680px;font-size:17px}
    .bottom-cta .btn-primary{background:var(--night);border-color:var(--night)}
    .bottom-cta .btn-primary:hover{background:#fff;color:var(--ink);border-color:#fff}
    .site-footer{background:var(--night);color:#fff;padding:60px 0 100px}
    .footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:50px;padding-bottom:42px;border-bottom:1px solid rgba(255,255,255,.15)}
    .footer-brand p{color:#bdb4b7;max-width:350px;font-size:14px}
    .footer-title{font-weight:800;margin-bottom:15px}
    .footer-links{display:grid;gap:7px;color:#c8c0c2;font-size:14px}
    .footer-links a:hover{color:#fff}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:22px;color:#aaa1a4;font-size:12px}
    .fixed-bar{position:fixed;z-index:1100;left:50%;bottom:18px;transform:translateX(-50%);width:min(760px,calc(100% - 40px));padding:12px 15px 12px 22px;border-radius:999px;background:rgba(40,37,44,.96);color:#fff;box-shadow:0 15px 40px rgba(20,18,22,.25);display:flex;align-items:center;justify-content:space-between;gap:18px}
    .fixed-bar small{color:#d8d0d1}
    .fixed-bar .btn{min-height:42px;padding:8px 18px;background:var(--coral);border-color:var(--coral)}
    .close-bar{border:0;background:transparent;color:#aaa;padding:5px;font-size:19px}
    .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
    .reveal.visible{opacity:1;transform:none}
    @media(max-width:1100px){
      .nav-center{padding:0 18px}.nav-links .nav-link{padding:8px 7px}
      .hero-grid,.scene-grid,.calendar-layout,.brand-layout,.feedback-layout,.faq-layout{gap:42px}
      .hero{min-height:auto}.hero-photo{height:470px}
    }
    @media(max-width:900px){
      .navbar{padding-top:14px;padding-bottom:14px}.nav-center{order:3;width:100%;padding:14px 0 0;flex-basis:100%}
      .nav-links{margin-left:auto}.hero-grid,.hot-layout,.news-layout,.viewpoint-grid,.vertical-grid{grid-template-columns:1fr}
      .vertical-intro{position:static}.portrait-stack{max-width:700px}
      .calendar-layout,.scene-grid,.brand-layout,.feedback-layout,.faq-layout{grid-template-columns:1fr}
      .trust-grid{grid-template-columns:repeat(2,1fr)}.trust-item:nth-child(2){border-right:0}.trust-item:nth-child(-n+2){border-bottom:1px solid var(--line)}
      .footer-grid{grid-template-columns:1fr 1fr}
      .footer-brand{grid-column:1/-1}
    }
    @media(max-width:620px){
      .container{padding-left:18px;padding-right:18px}.section{padding:70px 0}.section-tight{padding:55px 0}
      h1{font-size:43px}.hero{padding:60px 0 72px}.hero-copy .lead{font-size:16px}
      .hero-art{margin-top:12px}.hero-photo{height:380px}.hero-note{left:12px;bottom:14px;width:190px}
      .hero-stamp{right:10px;top:14px;width:78px;height:78px;font-size:10px}
      .section-head{display:block;margin-bottom:28px}.section-head p{margin-top:14px}
      .feature-row,.category-grid,.related-strip{grid-template-columns:1fr}.category-card:nth-child(2),.category-card:nth-child(5){transform:none}
      .category-card:nth-child(2):hover,.category-card:nth-child(5):hover{transform:translateY(-5px)}
      .portrait-stack{grid-template-columns:1fr}.portrait-card:first-child{grid-row:auto;min-height:430px}.portrait-card{min-height:300px}
      .hot-main{min-height:420px}.hot-main-content{left:22px;right:22px;bottom:22px}
      .calendar-item{grid-template-columns:78px 1fr}.calendar-state{display:none}
      .scene-image{height:360px}.scene-image-wrap{padding-left:14px}
      .quote-card{padding:26px;min-height:260px}.quote-card blockquote{font-size:23px}
      .trust-grid{grid-template-columns:1fr 1fr}.trust-item{padding:22px 12px}.trust-item strong{font-size:29px}
      .news-item{grid-template-columns:1fr;gap:4px}.news-more{text-align:left;padding-top:4px}
      .brand-index{grid-template-columns:1fr}.feedback-form{padding:24px}
      .footer-grid{grid-template-columns:1fr}.footer-brand{grid-column:auto}.footer-bottom{display:block}
      .fixed-bar{width:calc(100% - 22px);bottom:10px;padding:10px 12px 10px 16px}.fixed-bar small{font-size:12px}.fixed-bar .btn{font-size:13px;padding:7px 13px}
    }
    @media(prefers-reduced-motion:reduce){
      *,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}
      .reveal{opacity:1;transform:none}
    }

/* roulang page: category1 */
:root{
      --ink:#242321;
      --muted:#77736d;
      --paper:#f7f4ef;
      --white:#fffdf9;
      --line:#ded8cf;
      --coral:#df6e55;
      --coral-dark:#b9513d;
      --sage:#8ea99a;
      --plum:#625568;
      --night:#28252c;
      --cream:#eee6da;
      --radius-sm:12px;
      --radius-md:22px;
      --radius-lg:34px;
      --shadow:0 18px 48px rgba(47,39,30,.09);
      --shadow-soft:0 8px 24px rgba(47,39,30,.06);
      --ease:cubic-bezier(.22,.61,.36,1);
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;color:var(--ink);background:var(--paper);
      font-family:"Noto Sans SC","Microsoft YaHei","PingFang SC","Hiragino Sans GB",Arial,sans-serif;
      font-size:16px;line-height:1.85;overflow-x:hidden;
    }
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{font-weight:850;letter-spacing:-.045em}
    h1{font-size:clamp(42px,6vw,78px);line-height:1.12}
    h2{font-size:clamp(30px,4vw,48px);line-height:1.25}
    h3{font-size:23px;line-height:1.4}
    a{color:inherit;text-decoration:none;transition:color .25s var(--ease)}
    a:hover{color:var(--coral-dark)}
    img{display:block;width:100%;max-width:100%;object-fit:cover}
    button,input{font:inherit}
    button{cursor:pointer}
    .container{max-width:1240px;padding-left:24px;padding-right:24px}
    .section{padding:100px 0}
    .section-tight{padding:72px 0}
    .eyebrow{
      display:inline-flex;align-items:center;gap:9px;color:var(--coral-dark);
      font-size:12px;font-weight:850;letter-spacing:.16em
    }
    .eyebrow:before{content:"";width:28px;height:2px;background:var(--coral)}
    .lead{font-size:18px;line-height:2;color:#5e5953}
    .btn{
      min-height:50px;padding:11px 22px;border-radius:999px;font-weight:750;
      border:1px solid transparent;transition:all .25s var(--ease)
    }
    .btn:focus-visible,.search-box:focus-within,a:focus-visible{
      outline:3px solid rgba(223,110,85,.28);outline-offset:3px
    }
    .btn-primary{background:var(--coral);border-color:var(--coral);color:#fff}
    .btn-primary:hover{background:var(--coral-dark);border-color:var(--coral-dark);color:#fff;transform:translateY(-2px);box-shadow:0 10px 22px rgba(185,81,61,.22)}
    .btn-primary:active{transform:translateY(0);box-shadow:none}
    .btn-outline{background:transparent;border-color:#bcb4aa;color:var(--ink)}
    .btn-outline:hover{background:var(--ink);border-color:var(--ink);color:#fff;transform:translateY(-2px)}
    .btn-text{padding-left:0;padding-right:0;color:var(--coral-dark);background:none}
    .btn-text:hover{color:var(--ink);transform:translateX(4px)}
    .site-header{
      position:sticky;top:0;z-index:1000;background:rgba(247,244,239,.94);
      border-bottom:1px solid rgba(222,216,207,.85);backdrop-filter:blur(10px)
    }
    .navbar{min-height:82px}
    .brand{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:850;white-space:nowrap}
    .brand-mark{
      width:34px;height:34px;border-radius:12px 12px 12px 4px;background:var(--coral);
      position:relative;transform:rotate(-7deg);display:inline-block
    }
    .brand-mark:after{
      content:"";position:absolute;width:11px;height:11px;border:2px solid #fff;
      border-radius:50%;left:11px;top:9px
    }
    .nav-center{flex:1;display:flex;justify-content:center;padding:0 38px}
    .search-box{
      width:min(440px,100%);height:48px;display:flex;align-items:center;gap:10px;
      padding:0 16px;border:1px solid var(--line);border-radius:999px;background:var(--white);
      transition:all .25s var(--ease)
    }
    .search-box:focus-within{border-color:var(--coral);box-shadow:0 0 0 5px rgba(223,110,85,.1)}
    .search-box svg{width:18px;flex:0 0 auto;color:var(--coral-dark)}
    .search-box input{border:0;outline:0;background:transparent;width:100%;min-width:0;color:var(--ink)}
    .search-box input::placeholder{color:#aaa39a}
    .nav-links{display:flex;align-items:center;gap:4px}
    .nav-links .nav-link{padding:9px 11px;border-radius:999px;font-size:14px;color:#69635c;white-space:nowrap}
    .nav-links .nav-link:hover,.nav-links .nav-link.active{background:var(--cream);color:var(--ink)}
    .navbar-toggler{border:1px solid var(--line);border-radius:10px;padding:8px 11px}
    .navbar-toggler:focus{box-shadow:0 0 0 4px rgba(223,110,85,.15)}
    .page-hero{
      padding:76px 0 70px;background:#e9e2d8;position:relative;overflow:hidden
    }
    .page-hero:after{
      content:"";position:absolute;width:420px;height:420px;border:1px solid rgba(98,85,104,.2);
      border-radius:50%;right:-120px;top:-150px
    }
    .breadcrumb-line{font-size:13px;color:var(--muted);margin-bottom:32px}
    .breadcrumb-line a{color:var(--coral-dark)}
    .hero-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:end;position:relative;z-index:1}
    .hero-layout h1{max-width:680px;margin:20px 0 24px}
    .hero-layout .lead{max-width:650px}
    .hero-visual{position:relative}
    .hero-visual img{height:360px;border-radius:var(--radius-lg);box-shadow:var(--shadow);object-position:center}
    .visual-label{
      position:absolute;left:-22px;bottom:22px;background:var(--night);color:#fff;
      padding:18px 22px;border-radius:18px;max-width:230px;box-shadow:var(--shadow-soft)
    }
    .visual-label strong{display:block;color:#f0b2a3;font-size:26px;line-height:1.3}
    .visual-label span{font-size:13px;color:#d8d0d2}
    .topic-index{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}
    .topic-index a,.badge-soft{
      border:1px solid #cfc6bb;border-radius:999px;padding:7px 13px;font-size:13px;color:#6e665f;
      background:rgba(255,253,249,.55)
    }
    .topic-index a:hover{background:var(--coral);border-color:var(--coral);color:#fff}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:42px}
    .section-head p{max-width:570px;margin-bottom:4px;color:var(--muted)}
    .intro-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:start}
    .intro-copy{border-left:3px solid var(--coral);padding-left:25px}
    .intro-copy p{color:#625d57}
    .stat-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:30px}
    .stat-box{padding:20px;border-top:1px solid var(--ink);background:var(--white)}
    .stat-box strong{display:block;font-size:33px;color:var(--coral-dark);line-height:1.1}
    .stat-box span{display:block;color:var(--muted);font-size:13px;margin-top:8px}
    .news-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:20px}
    .feature-news,.news-list{background:var(--white);border:1px solid var(--line);box-shadow:var(--shadow-soft)}
    .feature-news{border-radius:var(--radius-lg);overflow:hidden}
    .feature-news img{height:300px}
    .feature-news-body{padding:28px 30px 30px}
    .news-tag{color:var(--coral-dark);font-size:12px;font-weight:800;letter-spacing:.08em}
    .feature-news h3{font-size:30px;margin:12px 0}
    .news-list{border-radius:20px;padding:12px 25px}
    .news-item{display:grid;grid-template-columns:95px 1fr;gap:18px;padding:20px 0;border-bottom:1px solid var(--line)}
    .news-item:last-child{border-bottom:0}
    .news-date{font-size:13px;color:var(--coral-dark);font-weight:750}
    .news-item h4{font-size:18px;margin-bottom:5px;letter-spacing:-.02em}
    .news-item p{font-size:14px;line-height:1.7;color:var(--muted);margin:0}
    .story-band{background:var(--night);color:#fff}
    .story-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center}
    .story-grid .lead{color:#d3ccd0}
    .story-grid img{height:430px;border-radius:var(--radius-md);object-position:center}
    .story-points{margin:26px 0 0;padding:0;list-style:none}
    .story-points li{padding:14px 0;border-bottom:1px solid rgba(255,255,255,.15);color:#e7e0e0}
    .story-points li:before{content:"—";color:#f0a08f;margin-right:12px}
    .topic-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:18px}
    .topic-card{position:relative;min-height:280px;border-radius:var(--radius-md);overflow:hidden;color:#fff;background:var(--night)}
    .topic-card:first-child{grid-row:span 2;min-height:580px}
    .topic-card img{height:100%;position:absolute;inset:0;transition:transform .6s var(--ease)}
    .topic-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 28%,rgba(20,18,20,.84))}
    .topic-card:hover img{transform:scale(1.05)}
    .topic-content{position:absolute;left:25px;right:25px;bottom:24px;z-index:1}
    .topic-content h3{margin:9px 0 7px;font-size:25px}
    .topic-content p{font-size:14px;color:#e4dcda;margin:0}
    .timeline{position:relative;max-width:920px;margin:0 auto}
    .timeline:before{content:"";position:absolute;left:105px;top:0;bottom:0;width:1px;background:var(--line)}
    .timeline-row{display:grid;grid-template-columns:105px 1fr;gap:36px;position:relative;padding:0 0 35px}
    .timeline-row:before{content:"";position:absolute;left:99px;top:7px;width:13px;height:13px;border-radius:50%;background:var(--coral);border:3px solid var(--paper)}
    .timeline-date{font-size:13px;color:var(--coral-dark);font-weight:800}
    .timeline-content{padding:0 0 0 28px}
    .timeline-content h3{font-size:21px;margin-bottom:6px}
    .timeline-content p{color:var(--muted);margin:0}
    .filter-bar{
      display:flex;align-items:center;justify-content:space-between;gap:20px;
      padding:16px 18px;border:1px solid var(--line);background:var(--white);border-radius:16px;margin-bottom:26px
    }
    .filter-actions{display:flex;gap:8px;flex-wrap:wrap}
    .filter-button{border:1px solid var(--line);background:transparent;border-radius:999px;padding:7px 14px;font-size:13px;color:var(--muted)}
    .filter-button:hover,.filter-button.active{background:var(--cream);color:var(--ink);border-color:#cbb9a8}
    .quote-section{background:#eee6da}
    .quote-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:35px;align-items:stretch}
    .quote-main{background:var(--coral);color:#fff;padding:38px;border-radius:var(--radius-lg) 0 var(--radius-lg) var(--radius-lg)}
    .quote-main blockquote{font-size:28px;line-height:1.5;font-weight:750;margin:20px 0 28px}
    .quote-main p{color:#ffe4dd;margin:0}
    .quote-side{display:grid;grid-template-columns:1fr 1fr;gap:14px}
    .quote-card{background:var(--white);padding:25px;border:1px solid var(--line);border-radius:16px}
    .quote-card strong{display:block;font-size:30px;color:var(--plum);line-height:1.2;margin-bottom:10px}
    .quote-card span{font-size:14px;color:var(--muted)}
    .faq-list{max-width:900px;margin:auto}
    .accordion-item{background:var(--white);border:1px solid var(--line)!important;margin-bottom:12px;border-radius:14px!important;overflow:hidden}
    .accordion-button{background:var(--white);color:var(--ink);font-weight:750;padding:20px 24px;box-shadow:none!important}
    .accordion-button:not(.collapsed){background:#f1e9df;color:var(--coral-dark)}
    .accordion-button:focus{box-shadow:0 0 0 4px rgba(223,110,85,.12)!important}
    .accordion-body{color:var(--muted);padding:0 24px 22px}
    .cta-section{padding:78px 0}
    .cta-box{background:var(--plum);color:#fff;border-radius:var(--radius-lg);padding:48px 55px;display:flex;justify-content:space-between;align-items:center;gap:30px}
    .cta-box p{color:#ddd4dd;max-width:590px;margin:10px 0 0}
    .site-footer{background:var(--night);color:#fff;padding:66px 0 28px}
    .footer-grid{display:grid;grid-template-columns:1.5fr .7fr .7fr;gap:60px}
    .footer-brand p{max-width:390px;color:#cfc7c8}
    .footer-title{font-size:14px;font-weight:800;color:#f3b0a0;margin-bottom:17px}
    .footer-links{display:grid;gap:8px;color:#d2cacc;font-size:14px}
    .footer-links a:hover{color:#fff}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid rgba(255,255,255,.14);padding-top:22px;margin-top:48px;color:#a9a1a5;font-size:13px}
    .fixed-bar{
      position:fixed;z-index:1050;right:24px;bottom:22px;display:flex;align-items:center;gap:18px;
      background:var(--white);border:1px solid var(--line);border-radius:999px;padding:9px 10px 9px 20px;
      box-shadow:0 14px 35px rgba(40,37,44,.16);font-size:14px
    }
    .fixed-bar button{border:0;background:transparent;color:var(--muted);font-size:20px;line-height:1;padding:5px}
    .reveal{animation:rise .7s var(--ease) both}
    @keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
    @media(max-width:1100px){
      .nav-center{padding:0 18px}.nav-links .nav-link{padding-left:8px;padding-right:8px}
      .hero-layout,.story-grid,.intro-grid{gap:40px}
    }
    @media(max-width:991px){
      .nav-center{order:3;width:100%;padding:15px 0 0}
      .nav-center .search-box{width:100%}
      .navbar-collapse{width:100%;order:4}
      .nav-links{display:flex;flex-wrap:wrap;padding:16px 0 4px}
      .hero-layout,.story-grid,.intro-grid,.news-layout{grid-template-columns:1fr}
      .hero-visual{max-width:720px;margin:auto;width:100%}
      .topic-grid{grid-template-columns:1fr 1fr}
      .topic-card:first-child{grid-row:auto;min-height:360px;grid-column:span 2}
      .footer-grid{grid-template-columns:1fr 1fr}
      .footer-brand{grid-column:span 2}
    }
    @media(max-width:767px){
      .container{padding-left:18px;padding-right:18px}
      .section{padding:70px 0}.section-tight{padding:54px 0}
      .page-hero{padding:48px 0 55px}
      .hero-layout h1{font-size:45px}
      .hero-visual img{height:270px}
      .visual-label{left:12px;bottom:12px}
      .section-head{display:block;margin-bottom:28px}
      .section-head p{margin-top:14px}
      .stat-strip{grid-template-columns:1fr}
      .feature-news img{height:220px}
      .feature-news-body{padding:23px}
      .feature-news h3{font-size:25px}
      .news-item{grid-template-columns:80px 1fr;gap:12px}
      .topic-grid{grid-template-columns:1fr}
      .topic-card:first-child{grid-column:auto;min-height:320px}
      .topic-card{min-height:240px}
      .timeline:before{left:77px}
      .timeline-row{grid-template-columns:77px 1fr;gap:18px}
      .timeline-row:before{left:71px}
      .timeline-content{padding-left:18px}
      .filter-bar{display:block}
      .filter-actions{margin-top:12px;flex-wrap:nowrap;overflow:auto;padding-bottom:3px}
      .quote-grid,.quote-side{grid-template-columns:1fr}
      .cta-box{display:block;padding:34px 25px}
      .cta-box .btn{margin-top:24px}
      .footer-grid{grid-template-columns:1fr;gap:34px}
      .footer-brand{grid-column:auto}
      .footer-bottom{display:block;line-height:2}
      .footer-bottom div+div{margin-top:8px}
      .fixed-bar{left:12px;right:12px;bottom:12px;justify-content:space-between;padding-left:16px}
      .fixed-bar .btn{min-height:43px;padding:8px 16px}
      body{padding-bottom:72px}
    }
    @media(prefers-reduced-motion:reduce){
      *,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}
    }

/* roulang page: category3 */
:root{
      --ink:#242321;
      --muted:#77736d;
      --paper:#f7f4ef;
      --white:#fffdf9;
      --line:#ded8cf;
      --coral:#df6e55;
      --coral-dark:#b9513d;
      --sage:#8ea99a;
      --plum:#625568;
      --night:#28252c;
      --cream:#eee6da;
      --radius-sm:12px;
      --radius-md:22px;
      --radius-lg:34px;
      --shadow:0 18px 48px rgba(47,39,30,.09);
      --shadow-soft:0 8px 24px rgba(47,39,30,.06);
      --ease:cubic-bezier(.22,.61,.36,1);
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--ink);
      background:var(--paper);
      font-family:"Noto Sans SC","Microsoft YaHei","PingFang SC","Hiragino Sans GB",Arial,sans-serif;
      font-size:16px;
      line-height:1.85;
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none;transition:color .25s var(--ease)}
    a:hover{color:var(--coral-dark)}
    img{display:block;width:100%;max-width:100%;object-fit:cover}
    button,input,textarea{font:inherit}
    button{cursor:pointer}
    h1,h2,h3,h4,p{margin-top:0}
    h1,h2,h3,h4{line-height:1.25;letter-spacing:-.035em}
    h1{font-size:clamp(42px,5.5vw,76px);font-weight:850}
    h2{font-size:clamp(30px,3.5vw,52px);font-weight:820}
    h3{font-size:24px;font-weight:780}
    .container{max-width:1240px;padding-left:24px;padding-right:24px}
    .section{padding:104px 0}
    .section-tight{padding:76px 0}
    .eyebrow{
      display:inline-flex;align-items:center;gap:9px;
      color:var(--coral-dark);font-size:12px;font-weight:800;
      letter-spacing:.16em;text-transform:uppercase
    }
    .eyebrow::before{content:"";display:block;width:28px;height:2px;background:var(--coral)}
    .lead{font-size:18px;line-height:2;color:#5e5953}
    .btn{
      min-height:50px;padding:11px 22px;border-radius:999px;
      font-weight:750;border:1px solid transparent;
      transition:all .25s var(--ease)
    }
    .btn:focus-visible,.form-control:focus-visible,.search-box:focus-within,a:focus-visible{
      outline:3px solid rgba(223,110,85,.28);outline-offset:3px
    }
    .btn-primary{background:var(--coral);border-color:var(--coral);color:#fff}
    .btn-primary:hover{background:var(--coral-dark);border-color:var(--coral-dark);color:#fff;transform:translateY(-2px);box-shadow:0 10px 22px rgba(185,81,61,.22)}
    .btn-primary:active{transform:translateY(0);box-shadow:none}
    .btn-outline{background:transparent;border-color:#bcb4aa;color:var(--ink)}
    .btn-outline:hover{background:var(--ink);border-color:var(--ink);color:#fff;transform:translateY(-2px)}
    .btn-text{padding-left:0;padding-right:0;color:var(--coral-dark);background:none}
    .btn-text:hover{color:var(--ink);transform:translateX(4px)}
    .btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}
    .site-header{
      position:sticky;top:0;z-index:1000;background:rgba(247,244,239,.94);
      border-bottom:1px solid rgba(222,216,207,.85);backdrop-filter:blur(10px)
    }
    .navbar{min-height:82px}
    .brand{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:850;white-space:nowrap}
    .brand-mark{
      width:34px;height:34px;border-radius:12px 12px 12px 4px;background:var(--coral);
      position:relative;transform:rotate(-7deg);display:inline-block
    }
    .brand-mark::after{content:"";position:absolute;width:11px;height:11px;border:2px solid #fff;border-radius:50%;left:11px;top:9px}
    .nav-center{flex:1;display:flex;justify-content:center;padding:0 38px}
    .search-box{
      width:min(440px,100%);height:48px;display:flex;align-items:center;gap:10px;
      padding:0 16px;border:1px solid var(--line);border-radius:999px;background:var(--white);
      transition:all .25s var(--ease)
    }
    .search-box:focus-within{border-color:var(--coral);box-shadow:0 0 0 5px rgba(223,110,85,.1)}
    .search-box svg{width:18px;flex:0 0 auto;color:var(--coral-dark)}
    .search-box input{border:0;outline:0;background:transparent;width:100%;min-width:0;color:var(--ink)}
    .search-box input::placeholder{color:#aaa39a}
    .nav-links{display:flex;align-items:center;gap:4px}
    .nav-links .nav-link{padding:9px 11px;border-radius:999px;font-size:14px;color:#69635c;white-space:nowrap}
    .nav-links .nav-link:hover,.nav-links .nav-link.active{background:var(--cream);color:var(--ink)}
    .navbar-toggler{border:1px solid var(--line);border-radius:10px;padding:8px 11px}
    .hero-inner{
      position:relative;padding:86px 0 84px;overflow:hidden;
      background:linear-gradient(100deg,#f7f4ef 0%,#f4eee7 58%,#eaded2 100%)
    }
    .hero-inner::after{
      content:"";position:absolute;width:440px;height:440px;border:1px solid rgba(223,110,85,.3);
      border-radius:50%;right:-120px;top:-150px
    }
    .hero-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center;position:relative;z-index:1}
    .hero-copy{max-width:580px}
    .hero-copy h1{margin:22px 0 22px}
    .hero-copy h1 span{color:var(--coral-dark)}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0 26px}
    .hero-note-line{display:flex;gap:16px;align-items:center;color:var(--muted);font-size:14px}
    .hero-note-line b{color:var(--ink);font-size:20px}
    .hero-visual{position:relative;min-height:470px}
    .hero-image{height:470px;border-radius:var(--radius-lg);object-position:center;box-shadow:var(--shadow)}
    .experience-board{
      position:absolute;left:-46px;bottom:28px;width:285px;background:var(--white);
      border:1px solid var(--line);padding:22px;border-radius:20px;box-shadow:var(--shadow-soft)
    }
    .board-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
    .board-label{font-size:13px;color:var(--muted)}
    .live-dot{width:9px;height:9px;background:var(--coral);border-radius:50%;display:inline-block;margin-right:5px}
    .people{display:flex;align-items:center;margin:15px 0}
    .person{width:34px;height:34px;border-radius:50%;border:3px solid var(--white);margin-left:-7px;background:var(--sage);display:grid;place-items:center;color:#fff;font-size:12px}
    .person:first-child{margin-left:0;background:var(--plum)}
    .person:nth-child(3){background:var(--coral)}
    .person-empty{background:var(--cream);border:2px dashed #baa99a;color:var(--coral-dark)}
    .board-progress{height:6px;border-radius:10px;background:var(--cream);overflow:hidden}
    .board-progress i{display:block;width:66%;height:100%;background:var(--coral)}
    .hero-tag{position:absolute;right:-22px;top:30px;background:var(--night);color:#fff;padding:15px 18px;border-radius:50%;width:104px;height:104px;display:grid;place-items:center;text-align:center;font-size:13px;line-height:1.45;transform:rotate(8deg)}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:40px}
    .section-head p{max-width:570px;margin-bottom:3px}
    .filter-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:30px}
    .filter-chip{
      border:1px solid var(--line);background:var(--white);color:#6a645c;
      border-radius:999px;padding:9px 17px;font-size:14px;transition:all .25s var(--ease)
    }
    .filter-chip:hover,.filter-chip.active{background:var(--ink);border-color:var(--ink);color:#fff}
    .filter-result{margin-left:auto;color:var(--muted);font-size:14px}
    .feature-layout{display:grid;grid-template-columns:1.25fr .75fr;gap:20px}
    .feature-main{min-height:510px;position:relative;overflow:hidden;border-radius:var(--radius-lg);color:#fff;background:var(--night)}
    .feature-main img{height:100%;min-height:510px;opacity:.72;transition:transform .6s var(--ease)}
    .feature-main:hover img{transform:scale(1.04)}
    .feature-overlay{position:absolute;inset:0;padding:34px;display:flex;flex-direction:column;justify-content:end;background:linear-gradient(0deg,rgba(24,21,25,.88),transparent 70%)}
    .feature-overlay p{max-width:580px;color:#e7e0dd}
    .tag{display:inline-flex;width:max-content;padding:5px 11px;border-radius:999px;background:var(--cream);color:var(--coral-dark);font-size:12px;font-weight:750}
    .feature-overlay .tag{background:rgba(255,253,249,.16);color:#fff}
    .feature-side{display:flex;flex-direction:column;gap:20px}
    .side-card{display:grid;grid-template-columns:125px 1fr;gap:18px;background:var(--white);border:1px solid var(--line);padding:16px;border-radius:18px;transition:all .3s var(--ease)}
    .side-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-soft);border-color:#cfa99d}
    .side-card img{height:140px;border-radius:12px}
    .side-card h3{font-size:20px;margin:10px 0 8px}
    .side-card p{font-size:14px;color:var(--muted);line-height:1.7;margin-bottom:8px}
    .dark-band{background:var(--night);color:#fff}
    .dark-band .lead,.dark-band .muted{color:#d1c9c9}
    .step-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid rgba(255,255,255,.22)}
    .step{padding:28px 22px 20px;border-right:1px solid rgba(255,255,255,.16);min-height:225px}
    .step:last-child{border-right:0}
    .step-number{font-size:15px;color:#e8917d;margin-bottom:32px}
    .step h3{font-size:21px;margin-bottom:12px}
    .step p{font-size:14px;color:#cfc7c8;line-height:1.8}
    .story-grid{display:grid;grid-template-columns:.84fr 1.16fr;gap:70px;align-items:start}
    .story-image{height:480px;border-radius:24px;object-position:center;box-shadow:var(--shadow)}
    .story-copy{padding-top:12px}
    .story-copy p{color:#625d56;font-size:17px;line-height:2}
    .quote-box{margin-top:28px;padding:22px 25px;border-left:3px solid var(--coral);background:var(--cream);font-size:19px;color:#514a45}
    .scenario-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px}
    .scenario{padding:28px;background:var(--white);border:1px solid var(--line);min-height:250px;transition:all .3s var(--ease)}
    .scenario:first-child{border-radius:28px 8px 8px 8px}
    .scenario:nth-child(2){border-radius:8px 28px 8px 8px;background:#e9e2d8}
    .scenario:nth-child(3){border-radius:8px 8px 28px 8px}
    .scenario:hover{transform:translateY(-5px);box-shadow:var(--shadow-soft)}
    .scenario-icon{width:46px;height:46px;border-radius:15px;background:var(--coral);color:#fff;display:grid;place-items:center;font-size:22px;margin-bottom:23px}
    .scenario:nth-child(2) .scenario-icon{background:var(--sage)}
    .scenario:nth-child(3) .scenario-icon{background:var(--plum)}
    .scenario p{color:var(--muted);font-size:15px}
    .activity-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:42px;align-items:center}
    .activity-panel{background:var(--cream);border-radius:28px;padding:30px}
    .activity-panel h3{font-size:28px}
    .activity-row{display:flex;gap:16px;padding:17px 0;border-bottom:1px solid rgba(36,35,33,.13)}
    .activity-row:last-child{border-bottom:0}
    .activity-badge{width:42px;height:42px;flex:0 0 42px;border-radius:13px;background:var(--white);display:grid;place-items:center;color:var(--coral-dark);font-weight:800}
    .activity-row strong{display:block}
    .activity-row span{font-size:13px;color:var(--muted)}
    .list-wrap{border-top:2px solid var(--ink)}
    .content-list{display:grid;grid-template-columns:repeat(2,1fr);gap:0 38px}
    .content-item{display:grid;grid-template-columns:82px 1fr;gap:18px;padding:24px 0;border-bottom:1px solid var(--line)}
    .content-item img{height:82px;border-radius:14px}
    .content-item h3{font-size:20px;margin:7px 0}
    .content-item p{font-size:14px;color:var(--muted);line-height:1.7;margin-bottom:8px}
    .content-meta{font-size:12px;color:var(--coral-dark)}
    .deep-copy{max-width:850px;margin:0 auto}
    .deep-copy p{font-size:17px;line-height:2.05;color:#5d5851}
    .deep-copy .dropcap:first-letter{font-size:52px;float:left;line-height:.9;padding:7px 9px 0 0;color:var(--coral-dark);font-weight:800}
    .accordion{--bs-accordion-bg:transparent;--bs-accordion-border-color:var(--line);--bs-accordion-btn-focus-box-shadow:0 0 0 3px rgba(223,110,85,.15);--bs-accordion-active-bg:var(--cream);--bs-accordion-active-color:var(--ink)}
    .accordion-item{border-left:0;border-right:0}
    .accordion-button{font-weight:750;padding:22px 4px;background:transparent}
    .accordion-button:not(.collapsed){box-shadow:none}
    .accordion-body{padding:0 36px 23px 4px;color:var(--muted);line-height:1.9}
    .cta-panel{background:var(--coral);color:#fff;border-radius:var(--radius-lg);padding:48px 54px;display:flex;justify-content:space-between;align-items:center;gap:30px;position:relative;overflow:hidden}
    .cta-panel::after{content:"";position:absolute;width:260px;height:260px;border:1px solid rgba(255,255,255,.28);border-radius:50%;right:-70px;top:-100px}
    .cta-panel h2{max-width:650px;margin-bottom:12px}
    .cta-panel p{color:#ffe6df;margin-bottom:0;max-width:650px}
    .cta-panel .btn{position:relative;z-index:1;background:#fff;color:var(--coral-dark)}
    .cta-panel .btn:hover{background:var(--ink);color:#fff}
    .site-footer{background:var(--night);color:#fff;padding:68px 0 28px}
    .footer-grid{display:grid;grid-template-columns:1.6fr .7fr .7fr;gap:60px}
    .footer-brand p{max-width:370px;color:#cfc7c8;font-size:14px}
    .footer-title{font-weight:800;margin-bottom:17px;color:#fff}
    .footer-links{display:flex;flex-direction:column;gap:8px}
    .footer-links a{color:#cfc7c8;font-size:14px}
    .footer-links a:hover{color:#fff}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid rgba(255,255,255,.15);margin-top:50px;padding-top:20px;color:#aaa2a4;font-size:13px}
    .fixed-bar{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:1030;width:min(740px,calc(100% - 40px));background:var(--white);border:1px solid var(--line);box-shadow:0 16px 45px rgba(40,33,28,.18);border-radius:999px;padding:9px 10px 9px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px}
    .fixed-bar span{font-size:14px;color:#625d56}
    .fixed-bar .btn{min-height:42px;padding:8px 18px}
    .fixed-close{border:0;background:transparent;color:var(--muted);font-size:20px;line-height:1;padding:4px}
    .reveal{animation:rise .75s var(--ease) both}
    @keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
    @keyframes floatIn{from{transform:translateY(0)}to{transform:translateY(-8px)}}
    @media (max-width:1199px){
      .nav-center{padding:0 18px}.nav-links .nav-link{padding:8px 7px;font-size:13px}
      .hero-grid{gap:38px}.experience-board{left:-18px}
    }
    @media (max-width:991px){
      .nav-center{order:3;flex-basis:100%;padding:16px 0 0}.nav-center .search-box{width:100%}
      .navbar{padding-top:14px;padding-bottom:14px}.nav-links{padding:18px 0 5px;flex-direction:column;align-items:stretch}
      .nav-links .nav-link{text-align:center}.hero-grid,.story-grid,.activity-layout,.feature-layout{grid-template-columns:1fr}
      .hero-inner{padding:68px 0}.hero-copy{max-width:760px}.hero-visual{max-width:720px;margin:0 auto;width:100%}
      .step-grid{grid-template-columns:repeat(2,1fr)}.step:nth-child(2){border-right:0}.step:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.16)}
      .story-image{height:400px}.scenario-grid{grid-template-columns:1fr 1fr}
      .feature-main{min-height:430px}.feature-main img{min-height:430px}
      .footer-grid{grid-template-columns:1.3fr 1fr 1fr;gap:28px}
    }
    @media (max-width:767px){
      .container{padding-left:18px;padding-right:18px}.section{padding:72px 0}.section-tight{padding:58px 0}
      h1{font-size:43px}.hero-inner{padding:54px 0 65px}.hero-copy .lead{font-size:16px}
      .hero-actions .btn{width:100%}.hero-visual{min-height:390px}.hero-image{height:390px}.experience-board{left:10px;bottom:18px;width:250px;padding:17px}.hero-tag{right:9px;top:16px;width:85px;height:85px;font-size:11px}
      .section-head{display:block;margin-bottom:28px}.section-head p{margin-top:14px}
      .filter-result{width:100%;margin-left:0}.scenario-grid,.content-list{grid-template-columns:1fr}
      .scenario{min-height:auto}.story-image{height:320px}.activity-layout{gap:22px}
      .step-grid{grid-template-columns:1fr}.step{border-right:0!important;border-bottom:1px solid rgba(255,255,255,.16)}
      .step:last-child{border-bottom:0}.cta-panel{display:block;padding:34px 25px}.cta-panel .btn{margin-top:24px}
      .footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.footer-bottom{display:block}.footer-bottom div+div{margin-top:8px}
      .fixed-bar{bottom:10px;width:calc(100% - 22px);padding-left:15px}.fixed-bar span{font-size:12px}.fixed-close{display:none}.fixed-bar .btn{font-size:13px;padding:8px 14px}
    }
    @media (max-width:520px){
      .brand{font-size:19px}.brand-mark{width:30px;height:30px}.brand-mark::after{left:9px;top:7px}
      .side-card{grid-template-columns:95px 1fr}.side-card img{height:108px}.side-card h3{font-size:18px}
      .content-item{grid-template-columns:70px 1fr;gap:13px}.content-item img{height:70px}.content-item h3{font-size:18px}
      .footer-grid{grid-template-columns:1fr}.footer-brand{grid-column:auto}
    }
    @media (prefers-reduced-motion:reduce){
      html{scroll-behavior:auto}.reveal,.hero-note{animation:none}.btn,.side-card,.scenario,.feature-main img{transition:none}
    }

/* roulang page: category2 */
:root{
      --ink:#242321;
      --muted:#77736d;
      --paper:#f7f4ef;
      --white:#fffdf9;
      --line:#ded8cf;
      --coral:#df6e55;
      --coral-dark:#b9513d;
      --sage:#8ea99a;
      --plum:#625568;
      --night:#28252c;
      --cream:#eee6da;
      --radius-sm:12px;
      --radius-md:22px;
      --radius-lg:34px;
      --shadow:0 18px 48px rgba(47,39,30,.09);
      --shadow-soft:0 8px 24px rgba(47,39,30,.06);
      --ease:cubic-bezier(.22,.61,.36,1);
    }
    html{scroll-behavior:smooth}
    *{box-sizing:border-box}
    body{margin:0;color:var(--ink);background:var(--paper);font-family:"Noto Sans SC","Microsoft YaHei","PingFang SC","Hiragino Sans GB",Arial,sans-serif;font-size:16px;line-height:1.85;overflow-x:hidden}
    a{color:inherit;text-decoration:none;transition:color .25s var(--ease)}
    a:hover{color:var(--coral-dark)}
    img{display:block;width:100%;max-width:100%;object-fit:cover}
    button,input,textarea{font:inherit}
    button{cursor:pointer}
    .container{max-width:1240px;padding-left:24px;padding-right:24px}
    .section{padding:96px 0}
    .section-tight{padding:68px 0}
    .eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--coral-dark);font-size:12px;font-weight:800;letter-spacing:.16em}
    .eyebrow:before{content:"";display:block;width:28px;height:2px;background:var(--coral)}
    h1,h2,h3,h4{font-weight:850;letter-spacing:-.035em;line-height:1.2}
    h1{font-size:clamp(42px,6vw,78px)}
    h2{font-size:clamp(30px,4vw,52px)}
    h3{font-size:24px}
    .lead{font-size:18px;line-height:2;color:#5e5953}
    .btn{min-height:50px;padding:11px 22px;border-radius:999px;font-weight:750;border:1px solid transparent;transition:all .25s var(--ease)}
    .btn:focus-visible,.search-box:focus-within,a:focus-visible,.form-control:focus-visible{outline:3px solid rgba(223,110,85,.28);outline-offset:3px}
    .btn-primary{background:var(--coral);border-color:var(--coral);color:#fff}
    .btn-primary:hover{background:var(--coral-dark);border-color:var(--coral-dark);color:#fff;transform:translateY(-2px);box-shadow:0 10px 22px rgba(185,81,61,.22)}
    .btn-primary:active{transform:translateY(0);box-shadow:none}
    .btn-outline{background:transparent;border-color:#bcb4aa;color:var(--ink)}
    .btn-outline:hover{background:var(--ink);border-color:var(--ink);color:#fff;transform:translateY(-2px)}
    .btn-text{padding-left:0;padding-right:0;color:var(--coral-dark);background:none}
    .btn-text:hover{color:var(--ink);transform:translateX(4px)}
    .btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
    .site-header{position:sticky;top:0;z-index:1000;background:rgba(247,244,239,.94);border-bottom:1px solid rgba(222,216,207,.85);backdrop-filter:blur(10px)}
    .navbar{min-height:82px}
    .brand{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:850;white-space:nowrap}
    .brand-mark{width:34px;height:34px;border-radius:12px 12px 12px 4px;background:var(--coral);position:relative;transform:rotate(-7deg);display:inline-block}
    .brand-mark:after{content:"";position:absolute;width:11px;height:11px;border:2px solid #fff;border-radius:50%;left:11px;top:9px}
    .nav-center{flex:1;display:flex;justify-content:center;padding:0 38px}
    .search-box{width:min(440px,100%);height:48px;display:flex;align-items:center;gap:10px;padding:0 16px;border:1px solid var(--line);border-radius:999px;background:var(--white);transition:all .25s var(--ease)}
    .search-box:focus-within{border-color:var(--coral);box-shadow:0 0 0 5px rgba(223,110,85,.1)}
    .search-box svg{width:18px;flex:0 0 auto;color:var(--coral-dark)}
    .search-box input{border:0;outline:0;background:transparent;width:100%;min-width:0;color:var(--ink)}
    .search-box input::placeholder{color:#aaa39a}
    .nav-links{display:flex;align-items:center;gap:4px}
    .nav-links .nav-link{padding:9px 11px;border-radius:999px;font-size:14px;color:#69635c;white-space:nowrap}
    .nav-links .nav-link:hover,.nav-links .nav-link.active{background:var(--cream);color:var(--ink)}
    .navbar-toggler{border:1px solid var(--line);border-radius:10px;padding:8px 11px}
    .navbar-toggler-icon{background-image:linear-gradient(var(--ink),var(--ink)),linear-gradient(var(--ink),var(--ink)),linear-gradient(var(--ink),var(--ink));background-size:22px 2px;background-position:center 6px,center 12px,center 18px;background-repeat:no-repeat}
    .breadcrumb-wrap{padding-top:32px}
    .breadcrumb{font-size:13px;color:var(--muted);margin-bottom:0}
    .breadcrumb-item+.breadcrumb-item:before{color:var(--coral)}
    .topic-hero{padding:46px 0 86px}
    .hero-panel{min-height:510px;background:var(--night);color:#fff;border-radius:var(--radius-lg);overflow:hidden;position:relative;display:grid;grid-template-columns:1.04fr .96fr;align-items:stretch;box-shadow:var(--shadow)}
    .hero-panel:before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(40,37,44,.98) 0%,rgba(40,37,44,.83) 48%,rgba(40,37,44,.25) 100%);z-index:1}
    .hero-panel:after{content:"HOT / 02";position:absolute;right:30px;top:25px;color:rgba(255,255,255,.55);font-size:12px;letter-spacing:.18em;z-index:3}
    .hero-panel>img{position:absolute;right:0;top:0;width:57%;height:100%;opacity:.82;object-position:center}
    .hero-content{position:relative;z-index:2;padding:76px 70px;max-width:700px}
    .hero-content .eyebrow{color:#f29a82}
    .hero-content .eyebrow:before{background:#f29a82}
    .hero-content h1{margin:23px 0 22px;max-width:620px}
    .hero-content h1 span{color:#f19a83}
    .hero-content .lead{color:#d7d0d1;max-width:590px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}
    .hero-actions .btn-outline{color:#fff;border-color:rgba(255,255,255,.4)}
    .hero-actions .btn-outline:hover{background:#fff;color:var(--night);border-color:#fff}
    .heat-badge{position:absolute;right:42px;bottom:36px;z-index:3;width:128px;height:128px;border:1px solid rgba(255,255,255,.4);border-radius:50%;display:grid;place-items:center;text-align:center;color:#fff;font-size:13px;line-height:1.5;transform:rotate(8deg);background:rgba(40,37,44,.46)}
    .heat-badge strong{display:block;color:#f29a82;font-size:27px;line-height:1.1}
    .topic-index{background:var(--cream);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .index-grid{display:grid;grid-template-columns:1.2fr repeat(4,1fr);gap:0}
    .index-intro{padding:28px 30px 28px 0}
    .index-item{padding:28px 20px;border-left:1px solid #d0c7bb;transition:background .25s var(--ease)}
    .index-item:hover{background:rgba(255,253,249,.55)}
    .index-item b{display:block;font-size:25px;color:var(--coral-dark)}
    .index-item span{font-size:13px;color:var(--muted)}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:40px}
    .section-head p{max-width:550px;margin:0 0 4px;color:var(--muted)}
    .spotlight{display:grid;grid-template-columns:1.13fr .87fr;gap:24px;align-items:stretch}
    .spotlight-main{position:relative;min-height:480px;border-radius:var(--radius-md);overflow:hidden;color:#fff;background:var(--night)}
    .spotlight-main img{position:absolute;inset:0;height:100%;transition:transform .6s var(--ease)}
    .spotlight-main:hover img{transform:scale(1.04)}
    .spotlight-main:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(22,20,24,.9),transparent 65%)}
    .spotlight-copy{position:absolute;z-index:1;left:34px;right:34px;bottom:30px}
    .tag{display:inline-flex;padding:5px 11px;border-radius:999px;background:#f4d5ca;color:var(--coral-dark);font-size:12px;font-weight:800}
    .tag.dark{background:rgba(255,255,255,.15);color:#fff}
    .spotlight-copy h3{font-size:33px;margin:17px 0 8px}
    .spotlight-copy p{margin:0;color:#e3dcdd;max-width:600px}
    .spotlight-side{display:flex;flex-direction:column;gap:14px}
    .mini-feature{display:grid;grid-template-columns:135px 1fr;gap:18px;padding:14px;border:1px solid var(--line);background:var(--white);border-radius:18px;transition:all .3s var(--ease)}
    .mini-feature:hover{transform:translateY(-4px);box-shadow:var(--shadow-soft);border-color:#c9a99e}
    .mini-feature img{height:128px;border-radius:12px}
    .mini-feature h4{font-size:18px;margin:10px 0 5px}
    .mini-feature p{font-size:13px;color:var(--muted);line-height:1.65;margin:0}
    .mini-date{font-size:12px;color:var(--coral-dark)}
    .filter-bar{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:16px 20px;border:1px solid var(--line);background:var(--white);border-radius:16px;margin-bottom:24px}
    .filter-links{display:flex;gap:8px;flex-wrap:wrap}
    .filter-btn{border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);padding:7px 14px;font-size:13px}
    .filter-btn:hover,.filter-btn.active{background:var(--ink);color:#fff;border-color:var(--ink)}
    .filter-note{font-size:13px;color:var(--muted);white-space:nowrap}
    .mag-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
    .mag-card{background:var(--white);border:1px solid var(--line);overflow:hidden;transition:all .3s var(--ease)}
    .mag-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#c7a39a}
    .mag-card:nth-child(1){grid-column:span 5;border-radius:28px 8px 28px 8px}
    .mag-card:nth-child(2){grid-column:span 4;border-radius:8px 28px 8px 28px}
    .mag-card:nth-child(3){grid-column:span 3;border-radius:28px 28px 8px 8px}
    .mag-card:nth-child(4),.mag-card:nth-child(5),.mag-card:nth-child(6){grid-column:span 4;border-radius:8px 8px 28px 28px}
    .mag-card img{height:190px;transition:transform .5s var(--ease)}
    .mag-card:hover img{transform:scale(1.05)}
    .mag-body{padding:22px}
    .mag-body h3{font-size:21px;margin:13px 0 8px}
    .mag-body p{font-size:14px;color:var(--muted);line-height:1.75;margin-bottom:18px}
    .card-meta{display:flex;justify-content:space-between;gap:10px;color:#948b81;font-size:12px}
    .dark-band{background:var(--night);color:#fff;position:relative;overflow:hidden}
    .dark-band:before{content:"";position:absolute;width:430px;height:430px;border:1px solid rgba(241,154,131,.3);border-radius:50%;right:-80px;top:-180px}
    .dark-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;align-items:start;position:relative}
    .dark-band .lead{color:#cbc3c5}
    .timeline{border-left:1px solid rgba(255,255,255,.25);padding-left:30px}
    .timeline-item{position:relative;padding:0 0 28px}
    .timeline-item:before{content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:#ef9077;left:-36px;top:11px;box-shadow:0 0 0 6px rgba(239,144,119,.12)}
    .timeline-item:last-child{padding-bottom:0}
    .timeline-item small{color:#ef9077;font-weight:800;letter-spacing:.08em}
    .timeline-item h3{font-size:22px;margin:6px 0}
    .timeline-item p{margin:0;color:#c9c1c3;font-size:15px}
    .reading-section{background:#e9e2d8}
    .reading-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:70px}
    .reading-aside{position:sticky;top:110px;height:max-content}
    .reading-aside .quote{font-size:31px;line-height:1.35;font-weight:800;margin:24px 0;color:var(--plum)}
    .reading-copy p{font-size:17px;color:#5e5953;margin-bottom:22px}
    .reading-copy p:first-child:first-letter{font-size:58px;float:left;line-height:.9;padding:8px 10px 0 0;color:var(--coral-dark);font-weight:850}
    .heat-board{display:grid;grid-template-columns:.9fr 1.1fr;gap:22px}
    .stat-board{background:var(--coral);color:#fff;border-radius:28px;padding:34px;display:flex;flex-direction:column;justify-content:space-between;min-height:330px}
    .stat-board h3{font-size:30px;max-width:300px}
    .big-stat{font-size:64px;font-weight:850;line-height:1}
    .stat-board small{color:#ffe4dc}
    .rank-list{background:var(--white);border:1px solid var(--line);border-radius:22px;padding:14px 24px}
    .rank-row{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:15px;padding:18px 0;border-bottom:1px solid var(--line)}
    .rank-row:last-child{border-bottom:0}
    .rank-num{font-size:24px;font-weight:850;color:var(--coral)}
    .rank-row h4{font-size:17px;margin:0 0 2px}
    .rank-row p{margin:0;color:var(--muted);font-size:13px}
    .rank-hot{font-size:12px;color:var(--coral-dark);white-space:nowrap}
    .faq-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px}
    .faq-wrap>div:first-child p{color:var(--muted);max-width:360px}
    .accordion-item{background:transparent;border:0;border-bottom:1px solid var(--line)}
    .accordion-button{background:transparent!important;color:var(--ink)!important;box-shadow:none!important;font-weight:750;padding:22px 0;font-size:17px}
    .accordion-button:after{background-size:14px}
    .accordion-body{padding:0 35px 22px 0;color:var(--muted);font-size:15px}
    .cta-section{padding:80px 0}
    .cta-box{background:var(--plum);color:#fff;border-radius:var(--radius-lg);padding:52px 58px;display:flex;justify-content:space-between;gap:30px;align-items:center;position:relative;overflow:hidden}
    .cta-box:after{content:"";position:absolute;width:280px;height:280px;border:1px solid rgba(255,255,255,.16);border-radius:50%;right:11%;top:-145px}
    .cta-box h2{max-width:620px;margin:0 0 13px}
    .cta-box p{color:#ded7dc;max-width:620px;margin:0}
    .cta-box .btn{position:relative;z-index:1;white-space:nowrap}
    .site-footer{background:var(--night);color:#fff;padding:66px 0 28px}
    .footer-grid{display:grid;grid-template-columns:1.5fr .7fr .7fr;gap:60px}
    .footer-brand p{color:#bdb5b8;max-width:390px;font-size:14px}
    .footer-title{font-weight:800;margin-bottom:16px}
    .footer-links{display:grid;gap:9px;color:#bdb5b8;font-size:14px}
    .footer-links a:hover{color:#fff}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid rgba(255,255,255,.14);margin-top:46px;padding-top:20px;color:#aaa2a6;font-size:12px}
    .fixed-bar{position:fixed;z-index:999;right:22px;bottom:22px;display:flex;align-items:center;gap:18px;padding:12px 14px 12px 20px;background:var(--white);border:1px solid var(--line);border-radius:999px;box-shadow:var(--shadow);font-size:14px}
    .fixed-bar button.close-bar{border:0;background:transparent;color:var(--muted);font-size:20px;line-height:1;padding:4px}
    .reveal{animation:rise .7s var(--ease) both}
    @keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
    @media(max-width:1100px){
      .nav-center{padding:0 18px}.nav-links .nav-link{padding:8px 7px;font-size:13px}
      .hero-content{padding:58px 48px}.hero-panel>img{width:54%}
      .index-grid{grid-template-columns:1fr repeat(4,1fr)}.index-intro{grid-column:1/-1;padding:25px 0 5px}
      .reading-grid,.faq-wrap{gap:40px}
    }
    @media(max-width:991px){
      .navbar{padding-top:15px;padding-bottom:15px}.nav-center{order:3;flex:0 0 100%;padding:14px 0 0}.nav-center .search-box{max-width:none}
      .navbar-collapse{flex-basis:100%;margin-top:12px}.nav-links{display:flex;flex-direction:column;align-items:stretch;padding:10px 0}.nav-links .nav-link{padding:11px 14px}
      .hero-panel{grid-template-columns:1fr;min-height:600px}.hero-panel>img{width:100%;opacity:.42}.hero-content{padding:70px 42px}.heat-badge{right:30px}
      .spotlight,.dark-grid,.heat-board,.reading-grid,.faq-wrap{grid-template-columns:1fr}.reading-aside{position:static}
      .dark-grid{gap:35px}.mag-card:nth-child(n){grid-column:span 6}
      .cta-box{align-items:flex-start;flex-direction:column}
    }
    @media(max-width:767px){
      .container{padding-left:18px;padding-right:18px}.section{padding:70px 0}.section-tight{padding:52px 0}
      h1{font-size:43px}.lead{font-size:16px}.hero-content{padding:60px 25px 100px}.hero-content h1{font-size:46px}.heat-badge{width:98px;height:98px;font-size:11px;right:20px;bottom:20px}.heat-badge strong{font-size:22px}
      .index-grid{display:flex;overflow-x:auto}.index-intro{min-width:230px;padding:24px 24px 24px 0}.index-item{min-width:125px}
      .section-head{display:block;margin-bottom:28px}.section-head p{margin-top:14px}
      .spotlight-main{min-height:390px}.spotlight-copy{left:23px;right:23px;bottom:22px}.spotlight-copy h3{font-size:27px}
      .mini-feature{grid-template-columns:105px 1fr}.mini-feature img{height:105px}
      .filter-bar{display:block}.filter-note{display:block;margin-top:13px}.filter-links{flex-wrap:nowrap;overflow-x:auto;padding-bottom:3px}
      .filter-btn{white-space:nowrap}.mag-card:nth-child(n){grid-column:span 12}.mag-card img{height:210px}
      .dark-grid{gap:28px}.reading-copy p{font-size:16px}.reading-aside .quote{font-size:26px}
      .stat-board{min-height:260px}.big-stat{font-size:52px}.rank-list{padding:8px 16px}
      .cta-box{padding:34px 25px}.cta-box h2{font-size:32px}.footer-grid{grid-template-columns:1fr;gap:30px}.footer-bottom{display:block;line-height:2.1}
      .fixed-bar{left:14px;right:14px;bottom:14px;justify-content:space-between;padding-left:16px;font-size:13px}
      .fixed-bar .btn{min-height:42px;padding:8px 15px}
    }
    @media(max-width:520px){
      .hero-actions .btn{width:100%;text-align:center}.hero-panel{border-radius:22px}.hero-content h1{font-size:39px}
      .brand{font-size:20px}.mini-feature h4{font-size:16px}.mini-feature p{font-size:12px}
      .rank-row{grid-template-columns:32px 1fr}.rank-hot{grid-column:2}.cta-section{padding:55px 0}
    }
    @media(prefers-reduced-motion:reduce){
      html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}
    }

/* roulang page: category5 */
:root{
 --ink:#242321;--muted:#77736d;--paper:#f7f4ef;--white:#fffdf9;--line:#ded8cf;
 --coral:#df6e55;--coral-dark:#b9513d;--sage:#8ea99a;--plum:#625568;--night:#28252c;
 --cream:#eee6da;--radius-sm:12px;--radius-md:22px;--radius-lg:34px;
 --shadow:0 18px 48px rgba(47,39,30,.09);--shadow-soft:0 8px 24px rgba(47,39,30,.06);
 --ease:cubic-bezier(.22,.61,.36,1)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--paper);font-family:"Noto Sans SC","Microsoft YaHei","PingFang SC","Hiragino Sans GB",Arial,sans-serif;font-size:16px;line-height:1.85;overflow-x:hidden}
a{color:inherit;text-decoration:none;transition:color .25s var(--ease)}
a:hover{color:var(--coral-dark)}
img{display:block;width:100%;max-width:100%;object-fit:cover}
button,input{font:inherit}
button{cursor:pointer}
.container{max-width:1240px;padding-left:24px;padding-right:24px}
.site-header{position:sticky;top:0;z-index:1000;background:rgba(247,244,239,.95);border-bottom:1px solid rgba(222,216,207,.85);backdrop-filter:blur(10px)}
.navbar{min-height:82px}
.brand{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:850;white-space:nowrap}
.brand-mark{width:34px;height:34px;border-radius:12px 12px 12px 4px;background:var(--coral);position:relative;transform:rotate(-7deg);display:inline-block}
.brand-mark:after{content:"";position:absolute;width:11px;height:11px;border:2px solid #fff;border-radius:50%;left:11px;top:9px}
.nav-center{flex:1;display:flex;justify-content:center;padding:0 38px}
.search-box{width:min(440px,100%);height:48px;display:flex;align-items:center;gap:10px;padding:0 16px;border:1px solid var(--line);border-radius:999px;background:var(--white);transition:all .25s var(--ease)}
.search-box:focus-within{border-color:var(--coral);box-shadow:0 0 0 5px rgba(223,110,85,.1)}
.search-box svg{width:18px;flex:0 0 auto;color:var(--coral-dark)}
.search-box input{border:0;outline:0;background:transparent;width:100%;min-width:0;color:var(--ink)}
.search-box input::placeholder{color:#aaa39a}
.nav-links{display:flex;align-items:center;gap:4px}
.nav-links .nav-link{padding:9px 11px;border-radius:999px;font-size:14px;color:#69635c;white-space:nowrap}
.nav-links .nav-link:hover,.nav-links .nav-link.active{background:var(--cream);color:var(--ink)}
.navbar-toggler{border:1px solid var(--line);border-radius:10px;padding:8px 11px}
.section{padding:92px 0}.section-tight{padding:64px 0}
.eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--coral-dark);font-size:12px;font-weight:800;letter-spacing:.16em}
.eyebrow:before{content:"";width:28px;height:2px;background:var(--coral)}
h1,h2,h3{letter-spacing:-.04em;line-height:1.2;font-weight:850}
h1{font-size:clamp(42px,6vw,78px);margin:20px 0}
h2{font-size:clamp(30px,4vw,52px);margin:12px 0 18px}
h3{font-size:24px}
.lead{font-size:18px;line-height:2;color:#5e5953}
.btn{min-height:50px;padding:11px 22px;border-radius:999px;font-weight:750;border:1px solid transparent;transition:all .25s var(--ease)}
.btn:focus-visible,.search-box:focus-within,a:focus-visible{outline:3px solid rgba(223,110,85,.28);outline-offset:3px}
.btn-primary{background:var(--coral);border-color:var(--coral);color:#fff}
.btn-primary:hover{background:var(--coral-dark);border-color:var(--coral-dark);color:#fff;transform:translateY(-2px);box-shadow:0 10px 22px rgba(185,81,61,.22)}
.btn-outline{background:transparent;border-color:#bcb4aa;color:var(--ink)}
.btn-outline:hover{background:var(--ink);border-color:var(--ink);color:#fff;transform:translateY(-2px)}
.btn-light{background:var(--white);color:var(--ink);border-color:var(--white)}
.btn-light:hover{background:var(--cream);color:var(--ink)}
.hero-event{position:relative;min-height:580px;display:flex;align-items:end;color:#fff;background:#302c32 url('/assets/images/backpic/back-2.webp') center/cover}
.hero-event:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(32,28,31,.88),rgba(32,28,31,.3) 72%)}
.hero-inner{position:relative;z-index:1;padding:105px 24px 75px}
.hero-inner .eyebrow{color:#f6b2a1}.hero-inner .eyebrow:before{background:#f6b2a1}
.hero-inner .lead{color:#eee6df;max-width:650px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0}
.countdown{display:flex;gap:10px;flex-wrap:wrap;margin-top:34px}
.count-box{min-width:92px;padding:12px 16px;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.1);border-radius:14px;text-align:center}
.count-box strong{display:block;font-size:27px;line-height:1;color:#fff}.count-box span{font-size:12px;color:#d8d0cd}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:38px}
.section-head p{max-width:580px;margin:0;color:var(--muted)}
.filter-bar{display:flex;gap:10px;flex-wrap:wrap;padding:16px 0;border-bottom:1px solid var(--line)}
.filter{border:1px solid var(--line);background:var(--white);border-radius:999px;padding:8px 17px;color:var(--muted);transition:.25s}
.filter:hover,.filter.active{background:var(--ink);border-color:var(--ink);color:#fff}
.feature-event{display:grid;grid-template-columns:1.05fr .95fr;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow)}
.feature-event img{height:100%;min-height:390px}
.feature-copy{padding:48px}
.badge{display:inline-block;padding:5px 11px;border-radius:99px;background:#f4d8cf;color:var(--coral-dark);font-size:12px;font-weight:800}
.event-meta{display:flex;gap:20px;flex-wrap:wrap;color:var(--muted);font-size:14px;margin:20px 0}
.event-meta span{padding-left:12px;border-left:2px solid var(--coral)}
.timeline{border-left:2px solid var(--coral);margin-left:12px;padding-left:30px}
.timeline-item{position:relative;padding:0 0 35px}
.timeline-item:before{content:"";position:absolute;left:-39px;top:10px;width:14px;height:14px;border-radius:50%;background:var(--paper);border:4px solid var(--coral)}
.timeline-item time{color:var(--coral-dark);font-weight:800;font-size:14px}
.activity-grid{display:grid;grid-template-columns:1.15fr .85fr .85fr;gap:18px}
.activity-card{background:var(--white);border:1px solid var(--line);overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s}
.activity-card:first-child{grid-row:span 2}
.activity-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.activity-card img{height:205px;transition:transform .5s var(--ease)}
.activity-card:first-child img{height:310px}
.activity-card:hover img{transform:scale(1.04)}
.card-body{padding:23px}
.card-body h3{font-size:22px;margin:12px 0}
.card-body p{color:var(--muted);font-size:14px;margin:0 0 14px}
.text-link{color:var(--coral-dark);font-weight:750}
.split-note{display:grid;grid-template-columns:.78fr 1.22fr;gap:55px;align-items:center;background:var(--cream)}
.split-note .container{width:100%}
.note-panel{padding:46px 0}
.quote{font-size:28px;line-height:1.5;font-weight:800;border-left:3px solid var(--coral);padding-left:22px}
.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line)}
.guide-item{padding:30px 24px;border-right:1px solid var(--line)}
.guide-item:last-child{border:0}
.guide-num{font-size:42px;color:var(--coral);font-weight:850}
.faq-wrap{max-width:850px;margin:auto}
.accordion-item{background:var(--white);border:1px solid var(--line)!important;margin-bottom:10px;border-radius:14px!important;overflow:hidden}
.accordion-button{background:var(--white);color:var(--ink);font-weight:750;padding:20px 22px;box-shadow:none!important}
.accordion-button:not(.collapsed){background:var(--cream);color:var(--coral-dark)}
.accordion-body{color:var(--muted);padding:0 22px 22px}
.cta-band{background:var(--night);color:#fff;border-radius:var(--radius-lg);padding:55px 64px;display:flex;justify-content:space-between;align-items:center;gap:30px}
.cta-band p{color:#d6ced0;max-width:620px;margin:0}
.site-footer{background:var(--night);color:#fff;margin-top:96px;padding:65px 0 25px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:50px}
.footer-brand p{color:#bdb5b7;max-width:390px}
.footer-title{font-weight:800;margin-bottom:17px;color:#fff}
.footer-links{display:grid;gap:9px;color:#bdb5b7;font-size:14px}
.footer-links a:hover{color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.15);margin-top:45px;padding-top:20px;color:#aaa1a4;font-size:13px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap}
.mobile-bar{display:none}
.reveal{animation:rise .7s var(--ease) both}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media(max-width:1100px){.nav-center{padding:0 18px}.nav-links .nav-link{padding:8px 7px;font-size:13px}.activity-grid{grid-template-columns:1fr 1fr}.activity-card:first-child{grid-row:auto}.activity-card:first-child img{height:205px}}
@media(max-width:768px){.navbar{padding-top:14px;padding-bottom:14px}.nav-center{order:3;flex-basis:100%;padding:14px 0 0}.navbar-collapse{width:100%}.nav-links{display:grid;grid-template-columns:repeat(2,1fr);padding-top:13px}.nav-links .nav-link{text-align:center}.hero-event{min-height:650px}.hero-inner{padding:85px 24px 55px}.feature-event,.split-note{grid-template-columns:1fr}.feature-event img{min-height:260px}.feature-copy{padding:32px}.section{padding:70px 0}.section-head{display:block}.section-head p{margin-top:15px}.guide-grid{grid-template-columns:1fr}.guide-item{border-right:0;border-bottom:1px solid var(--line)}.cta-band{padding:36px 27px;display:block}.cta-band .btn{margin-top:22px}.footer-grid{grid-template-columns:1fr 1fr;gap:30px}}
@media(max-width:520px){body{font-size:15px}.container{padding-left:18px;padding-right:18px}h1{font-size:43px}.hero-inner .lead{font-size:16px}.count-box{min-width:72px;padding:10px 8px}.count-box strong{font-size:22px}.activity-grid{grid-template-columns:1fr}.activity-card img,.activity-card:first-child img{height:220px}.footer-grid{grid-template-columns:1fr}.footer-bottom{padding-bottom:65px}.mobile-bar{display:flex;position:fixed;z-index:1100;bottom:0;left:0;right:0;background:rgba(40,37,44,.97);color:#fff;padding:10px 15px calc(10px + env(safe-area-inset-bottom));align-items:center;justify-content:space-between;gap:10px;box-shadow:0 -8px 24px rgba(0,0,0,.15)}.mobile-bar span{font-size:13px}.mobile-bar .btn{min-height:42px;padding:8px 15px;font-size:14px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* roulang page: category6 */
:root{
      --ink:#242321;--muted:#77736d;--paper:#f7f4ef;--white:#fffdf9;
      --line:#ded8cf;--coral:#df6e55;--coral-dark:#b9513d;--sage:#8ea99a;
      --plum:#625568;--night:#28252c;--cream:#eee6da;--radius-sm:12px;
      --radius-md:22px;--radius-lg:34px;--shadow:0 18px 48px rgba(47,39,30,.09);
      --shadow-soft:0 8px 24px rgba(47,39,30,.06);--ease:cubic-bezier(.22,.61,.36,1)
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;color:var(--ink);background:var(--paper);font-family:"Noto Sans SC","Microsoft YaHei","PingFang SC","Hiragino Sans GB",Arial,sans-serif;font-size:16px;line-height:1.85;overflow-x:hidden}
    a{color:inherit;text-decoration:none;transition:color .25s var(--ease)}
    a:hover{color:var(--coral-dark)}
    img{display:block;width:100%;max-width:100%;object-fit:cover}
    button,input,textarea{font:inherit}
    button{cursor:pointer}
    .container{max-width:1240px;padding-left:24px;padding-right:24px}
    .section{padding:92px 0}.section-tight{padding:62px 0}
    .eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--coral-dark);font-size:12px;font-weight:800;letter-spacing:.16em}
    .eyebrow:before{content:"";display:block;width:28px;height:2px;background:var(--coral)}
    h1,h2,h3{font-weight:850;letter-spacing:-.04em;line-height:1.2}
    h1{font-size:clamp(42px,6vw,76px);margin:18px 0}
    h2{font-size:clamp(30px,4vw,48px);margin:12px 0 18px}
    h3{font-size:23px}.lead{font-size:18px;line-height:2;color:#5e5953}
    .btn{min-height:50px;padding:11px 22px;border-radius:999px;font-weight:750;border:1px solid transparent;transition:all .25s var(--ease)}
    .btn:focus-visible,.search-box:focus-within,.form-control:focus-visible,a:focus-visible{outline:3px solid rgba(223,110,85,.28);outline-offset:3px}
    .btn-primary{background:var(--coral);border-color:var(--coral);color:#fff}
    .btn-primary:hover{background:var(--coral-dark);border-color:var(--coral-dark);color:#fff;transform:translateY(-2px);box-shadow:0 10px 22px rgba(185,81,61,.22)}
    .btn-primary:active{transform:translateY(0);box-shadow:none}
    .btn-outline{background:transparent;border-color:#bcb4aa;color:var(--ink)}
    .btn-outline:hover{background:var(--ink);border-color:var(--ink);color:#fff;transform:translateY(-2px)}
    .btn-text{padding:0;background:none;color:var(--coral-dark);border:0}.btn-text:hover{transform:translateX(4px);color:var(--ink)}
    .site-header{position:sticky;top:0;z-index:1000;background:rgba(247,244,239,.94);border-bottom:1px solid rgba(222,216,207,.85);backdrop-filter:blur(10px)}
    .navbar{min-height:82px}.brand{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:850;white-space:nowrap}
    .brand-mark{width:34px;height:34px;border-radius:12px 12px 12px 4px;background:var(--coral);position:relative;transform:rotate(-7deg);display:inline-block}
    .brand-mark:after{content:"";position:absolute;width:11px;height:11px;border:2px solid #fff;border-radius:50%;left:11px;top:9px}
    .nav-center{flex:1;display:flex;justify-content:center;padding:0 38px}
    .search-box{width:min(440px,100%);height:48px;display:flex;align-items:center;gap:10px;padding:0 16px;border:1px solid var(--line);border-radius:999px;background:var(--white);transition:all .25s var(--ease)}
    .search-box:focus-within{border-color:var(--coral);box-shadow:0 0 0 5px rgba(223,110,85,.1)}
    .search-box svg{width:18px;flex:0 0 auto;color:var(--coral-dark)}.search-box input{border:0;outline:0;background:transparent;width:100%;min-width:0;color:var(--ink)}
    .search-box input::placeholder{color:#aaa39a}.nav-links{display:flex;align-items:center;gap:4px}
    .nav-links .nav-link{padding:9px 11px;border-radius:999px;font-size:14px;color:#69635c;white-space:nowrap}
    .nav-links .nav-link:hover,.nav-links .nav-link.active{background:var(--cream);color:var(--ink)}
    .navbar-toggler{border:1px solid var(--line);border-radius:10px;padding:8px 11px}
    .page-banner{padding:64px 0 58px;background:#ebe3d8;border-bottom:1px solid var(--line);position:relative;overflow:hidden}
    .page-banner:after{content:"问";position:absolute;right:8%;top:-35px;font-size:280px;font-weight:900;color:rgba(223,110,85,.1);line-height:1}
    .banner-grid{display:grid;grid-template-columns:1fr 360px;gap:60px;align-items:end;position:relative;z-index:1}
    .banner-copy{max-width:720px}.banner-copy p{max-width:650px}
    .crumbs{font-size:13px;color:var(--muted);margin-bottom:24px}.crumbs a{color:var(--coral-dark)}
    .banner-note{border-left:2px solid var(--coral);padding-left:20px;color:#655e57}
    .banner-note strong{display:block;font-size:38px;line-height:1;color:var(--coral-dark)}
    .intro-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:72px;align-items:start}
    .intro-copy p{color:#5e5953}.intro-list{border-top:1px solid var(--line)}
    .intro-list div{display:flex;gap:22px;padding:18px 0;border-bottom:1px solid var(--line)}
    .intro-list b{color:var(--coral-dark);min-width:38px}.intro-list span{color:#625d56}
    .faq-layout{display:grid;grid-template-columns:280px 1fr;gap:64px}
    .side-index{position:sticky;top:112px;align-self:start}.side-index h3{font-size:18px;margin-bottom:18px}
    .side-index a{display:block;padding:10px 0;border-bottom:1px solid var(--line);color:var(--muted)}
    .side-index a:hover{padding-left:7px;color:var(--coral-dark)}
    .accordion-item{background:transparent;border:0;border-bottom:1px solid var(--line)}
    .accordion-button{padding:23px 4px;background:transparent;color:var(--ink);font-weight:750;font-size:18px;box-shadow:none!important}
    .accordion-button:not(.collapsed){color:var(--coral-dark);background:transparent}
    .accordion-button:after{background-size:14px}.accordion-body{padding:0 42px 24px 4px;color:#686159}
    .search-panel{background:var(--night);color:#fff;padding:34px;border-radius:var(--radius-md);box-shadow:var(--shadow)}
    .search-panel h2{font-size:30px}.search-panel p{color:#d4cdca}
    .filter-form{display:flex;gap:10px;max-width:700px}.filter-form input{flex:1;background:#fff;border:0;border-radius:999px;padding:13px 18px;min-width:0}
    .filter-result{margin-top:17px;color:#d9aaa0;font-size:14px;min-height:25px}
    .route-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:22px}
    .route-main{position:relative;min-height:390px;border-radius:var(--radius-lg);overflow:hidden;color:#fff}
    .route-main img{height:390px;filter:brightness(.72);transition:transform .5s var(--ease)}.route-main:hover img{transform:scale(1.04)}
    .route-main .overlay{position:absolute;inset:0;padding:32px;display:flex;flex-direction:column;justify-content:end;background:linear-gradient(transparent 35%,rgba(20,18,19,.8))}
    .route-side{background:var(--white);border:1px solid var(--line);padding:28px;border-radius:0 24px 24px 24px}
    .route-side li{padding:13px 0;border-bottom:1px solid var(--line);list-style:none}.route-side ul{padding:0;margin:8px 0 20px}
    .feedback{background:var(--cream);border-radius:var(--radius-lg);padding:42px}
    .feedback-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px}
    .form-control{border:1px solid #cfc6bb;border-radius:12px;background:var(--white);padding:12px 15px}
    .form-control:focus{border-color:var(--coral);box-shadow:0 0 0 4px rgba(223,110,85,.1)}
    .form-label{font-weight:700;font-size:14px}.privacy{font-size:12px;color:var(--muted)}
    .cta{background:var(--coral);color:#fff;padding:58px 0}.cta-grid{display:flex;justify-content:space-between;align-items:center;gap:30px}.cta p{color:#fff0eb;max-width:650px}
    .cta .btn-outline{border-color:rgba(255,255,255,.65);color:#fff}.cta .btn-outline:hover{background:#fff;color:var(--coral-dark);border-color:#fff}
    .site-footer{background:var(--night);color:#fff;padding:66px 0 28px}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:60px}
    .footer-brand p{color:#cfc7c8;max-width:390px}.footer-title{font-weight:800;margin-bottom:17px;color:#fff}.footer-links{display:grid;gap:8px;color:#cfc7c8;font-size:14px}.footer-links a:hover{color:#fff}
    .footer-bottom{border-top:1px solid #4a454b;margin-top:45px;padding-top:22px;display:flex;justify-content:space-between;gap:20px;color:#aaa2a4;font-size:13px}
    .mobile-cta{display:none}.reveal{animation:rise .7s var(--ease) both}@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
    @media(max-width:1100px){.nav-center{padding:0 18px}.nav-links .nav-link{padding:8px 7px;font-size:13px}.banner-grid{grid-template-columns:1fr 280px}}
    @media(max-width:768px){.navbar{padding:14px 0}.nav-center{order:3;flex-basis:100%;padding:14px 0 0}.nav-center .search-box{width:100%}.navbar-collapse{width:100%}.nav-links{display:grid;grid-template-columns:repeat(2,1fr);padding-top:12px}.nav-links .nav-link{text-align:center}.banner-grid,.intro-grid,.faq-layout,.route-grid,.feedback-grid{grid-template-columns:1fr;gap:34px}.page-banner{padding:46px 0}.side-index{position:static}.section{padding:65px 0}.feedback{padding:28px 20px}.cta-grid{display:block}.cta .btn{margin-top:18px}.footer-grid{grid-template-columns:1fr 1fr;gap:35px}.footer-brand{grid-column:1/-1}.footer-bottom{display:block}.footer-bottom div+div{margin-top:10px}.mobile-cta{display:flex;position:fixed;z-index:999;bottom:0;left:0;right:0;background:var(--white);border-top:1px solid var(--line);padding:10px 16px calc(10px + env(safe-area-inset-bottom));align-items:center;justify-content:space-between;gap:12px;box-shadow:0 -8px 25px rgba(40,37,44,.1)}.mobile-cta span{font-size:13px;color:var(--muted)}}
    @media(max-width:520px){h1{font-size:42px}.lead{font-size:16px}.banner-note strong{font-size:30px}.filter-form{display:block}.filter-form .btn{width:100%;margin-top:10px}.route-main,.route-main img{min-height:320px;height:320px}.footer-grid{grid-template-columns:1fr}.footer-brand{grid-column:auto}}
    @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{animation:none!important}.route-main img,.btn{transition:none}}

/* roulang page: category4 */
:root{
      --ink:#242321;
      --muted:#77736d;
      --paper:#f7f4ef;
      --white:#fffdf9;
      --line:#ded8cf;
      --coral:#df6e55;
      --coral-dark:#b9513d;
      --sage:#8ea99a;
      --plum:#625568;
      --night:#28252c;
      --cream:#eee6da;
      --radius-sm:12px;
      --radius-md:22px;
      --radius-lg:34px;
      --shadow:0 18px 48px rgba(47,39,30,.09);
      --shadow-soft:0 8px 24px rgba(47,39,30,.06);
      --ease:cubic-bezier(.22,.61,.36,1);
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--ink);
      background:var(--paper);
      font-family:"Noto Sans SC","Microsoft YaHei","PingFang SC","Hiragino Sans GB",Arial,sans-serif;
      font-size:16px;
      line-height:1.85;
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none;transition:color .25s var(--ease)}
    a:hover{color:var(--coral-dark)}
    img{display:block;width:100%;max-width:100%;object-fit:cover}
    button,input,textarea{font:inherit}
    button{cursor:pointer}
    .container{max-width:1240px;padding-left:24px;padding-right:24px}
    .section{padding:96px 0}
    .section-tight{padding:68px 0}
    .eyebrow{
      display:inline-flex;align-items:center;gap:9px;
      color:var(--coral-dark);font-size:12px;font-weight:800;
      letter-spacing:.16em;
    }
    .eyebrow::before{content:"";display:block;width:28px;height:2px;background:var(--coral)}
    h1,h2,h3,h4{font-weight:850;letter-spacing:-.045em;line-height:1.2}
    h1{font-size:clamp(42px,5.7vw,78px);margin:0}
    h2{font-size:clamp(30px,4vw,52px);margin:0}
    h3{font-size:22px;margin:0}
    p{color:#5e5953}
    .lead{font-size:18px;line-height:2;color:#5e5953}
    .btn{
      min-height:50px;padding:11px 22px;border-radius:999px;
      font-weight:750;border:1px solid transparent;
      transition:all .25s var(--ease);
    }
    .btn-primary{background:var(--coral);border-color:var(--coral);color:#fff}
    .btn-primary:hover{background:var(--coral-dark);border-color:var(--coral-dark);color:#fff;transform:translateY(-2px);box-shadow:0 10px 22px rgba(185,81,61,.22)}
    .btn-primary:active{transform:translateY(0);box-shadow:none}
    .btn-outline{background:transparent;border-color:#bcb4aa;color:var(--ink)}
    .btn-outline:hover{background:var(--ink);border-color:var(--ink);color:#fff;transform:translateY(-2px)}
    .btn-text{padding-left:0;padding-right:0;color:var(--coral-dark);background:none}
    .btn-text:hover{color:var(--ink);transform:translateX(4px)}
    .btn:focus-visible,.form-control:focus-visible,.search-box:focus-within,a:focus-visible{
      outline:3px solid rgba(223,110,85,.28);outline-offset:3px;
    }
    .btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}
    .site-header{
      position:sticky;top:0;z-index:1000;background:rgba(247,244,239,.94);
      border-bottom:1px solid rgba(222,216,207,.85);backdrop-filter:blur(10px)
    }
    .navbar{min-height:82px}
    .brand{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:850;white-space:nowrap}
    .brand-mark{
      width:34px;height:34px;border-radius:12px 12px 12px 4px;background:var(--coral);
      position:relative;transform:rotate(-7deg);display:inline-block
    }
    .brand-mark::after{content:"";position:absolute;width:11px;height:11px;border:2px solid #fff;border-radius:50%;left:11px;top:9px}
    .nav-center{flex:1;display:flex;justify-content:center;padding:0 34px}
    .search-box{
      width:min(440px,100%);height:48px;display:flex;align-items:center;gap:10px;
      padding:0 16px;border:1px solid var(--line);border-radius:999px;
      background:var(--white);transition:all .25s var(--ease)
    }
    .search-box:focus-within{border-color:var(--coral);box-shadow:0 0 0 5px rgba(223,110,85,.1)}
    .search-box svg{width:18px;flex:0 0 auto;color:var(--coral-dark)}
    .search-box input{border:0;outline:0;background:transparent;width:100%;min-width:0;color:var(--ink)}
    .search-box input::placeholder{color:#aaa39a}
    .nav-links{display:flex;align-items:center;gap:4px}
    .nav-links .nav-link{
      padding:9px 11px;border-radius:999px;font-size:14px;color:#69635c;white-space:nowrap
    }
    .nav-links .nav-link:hover,.nav-links .nav-link.active{background:var(--cream);color:var(--ink)}
    .navbar-toggler{border:1px solid var(--line);border-radius:10px;padding:8px 11px}
    .navbar-toggler:focus{box-shadow:0 0 0 4px rgba(223,110,85,.14)}
    .page-hero{
      position:relative;padding:74px 0 78px;overflow:hidden;
      background:#eee7de;border-bottom:1px solid var(--line)
    }
    .page-hero::after{
      content:"04";position:absolute;right:5%;bottom:-30px;
      font-size:210px;line-height:1;font-weight:900;color:rgba(98,85,104,.09)
    }
    .hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:end}
    .breadcrumb{margin:0 0 25px;font-size:13px;color:var(--muted)}
    .breadcrumb a{color:var(--coral-dark)}
    .page-hero h1{max-width:700px;margin-bottom:22px}
    .hero-side{display:grid;grid-template-columns:1fr 1fr;gap:14px}
    .hero-side img{height:190px;border-radius:24px}
    .hero-caption{grid-column:1/-1;padding:18px 20px;background:var(--white);border-left:3px solid var(--coral);border-radius:0 18px 18px 18px}
    .hero-caption strong{display:block;font-size:20px}
    .hero-caption span{font-size:13px;color:var(--muted)}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:38px}
    .section-head p{max-width:590px;margin:0}
    .tag-row{display:flex;gap:10px;flex-wrap:wrap}
    .tag{
      display:inline-flex;padding:6px 12px;border:1px solid var(--line);border-radius:999px;
      color:#6f675f;background:rgba(255,253,249,.55);font-size:13px
    }
    .tag.active{background:var(--night);border-color:var(--night);color:#fff}
    .filter-bar{display:flex;justify-content:space-between;align-items:center;gap:22px;margin-bottom:34px}
    .filter-search{max-width:280px}
    .filter-search .search-box{height:44px}
    .feature-layout{display:grid;grid-template-columns:1.35fr .8fr;gap:22px}
    .feature-card{position:relative;min-height:460px;overflow:hidden;border-radius:var(--radius-lg);background:var(--night);color:#fff}
    .feature-card img{height:100%;opacity:.72;transition:transform .6s var(--ease)}
    .feature-card:hover img{transform:scale(1.04)}
    .feature-overlay{position:absolute;inset:0;padding:32px;display:flex;flex-direction:column;justify-content:end;background:linear-gradient(0deg,rgba(25,23,27,.85),rgba(25,23,27,.04) 70%)}
    .feature-overlay p{color:#eee7df;max-width:550px}
    .feature-overlay h3{font-size:34px;max-width:560px}
    .mini-stack{display:grid;gap:16px}
    .mini-card{display:grid;grid-template-columns:130px 1fr;gap:18px;padding:16px;background:var(--white);border:1px solid var(--line);border-radius:20px;transition:all .3s var(--ease)}
    .mini-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-soft);border-color:#c9a69a}
    .mini-card img{height:132px;border-radius:14px}
    .mini-card h3{font-size:19px;margin:7px 0 6px}
    .mini-card p{font-size:14px;line-height:1.7;margin:0}
    .item-meta{font-size:12px;color:var(--coral-dark);font-weight:700}
    .recommend-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:20px}
    .recommend-card{background:var(--white);border:1px solid var(--line);overflow:hidden;transition:all .3s var(--ease)}
    .recommend-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:#cfa99e}
    .recommend-card:nth-child(1){grid-column:span 5;border-radius:28px 8px 28px 8px}
    .recommend-card:nth-child(2){grid-column:span 7;border-radius:8px 28px 8px 28px}
    .recommend-card:nth-child(3){grid-column:span 4;border-radius:22px}
    .recommend-card:nth-child(4){grid-column:span 4;border-radius:8px 22px 8px 22px}
    .recommend-card:nth-child(5){grid-column:span 4;border-radius:22px 8px 22px 8px}
    .recommend-card img{height:205px}
    .recommend-body{padding:22px}
    .recommend-body h3{margin:8px 0 9px}
    .recommend-body p{font-size:14px;line-height:1.8;margin-bottom:16px}
    .long-read{background:var(--cream)}
    .long-layout{display:grid;grid-template-columns:.78fr 1.22fr;gap:70px;align-items:start}
    .long-layout h2{max-width:420px}
    .long-copy p{font-size:17px;line-height:2.05;margin-top:0;margin-bottom:21px}
    .quote-box{margin-top:26px;padding:24px;background:var(--white);border-left:3px solid var(--plum);border-radius:0 20px 20px 20px}
    .quote-box strong{display:block;color:var(--plum);font-size:24px;line-height:1.4}
    .quote-box span{font-size:13px;color:var(--muted)}
    .timeline{position:relative;padding-left:28px}
    .timeline::before{content:"";position:absolute;left:5px;top:9px;bottom:10px;width:1px;background:#c8bdb1}
    .timeline-item{position:relative;padding:0 0 30px 18px}
    .timeline-item::before{content:"";position:absolute;left:-28px;top:10px;width:11px;height:11px;border-radius:50%;background:var(--coral);border:3px solid var(--cream)}
    .timeline-item small{color:var(--coral-dark);font-weight:800}
    .timeline-item h3{margin:7px 0 5px;font-size:21px}
    .timeline-item p{margin:0;font-size:15px}
    .score-section{background:var(--night);color:#fff}
    .score-section p{color:#d8d0c8}
    .score-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:70px;align-items:center}
    .score-number{font-size:100px;font-weight:900;line-height:1;color:#f2b19c}
    .score-label{font-size:18px;color:#fff}
    .score-list{display:grid;grid-template-columns:1fr 1fr;gap:16px}
    .score-item{padding:22px;border:1px solid rgba(255,255,255,.15);border-radius:18px}
    .score-item strong{font-size:28px;color:#fff;display:block}
    .score-item span{font-size:14px;color:#cfc6be}
    .activity-strip{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
    .activity{padding:24px;background:var(--white);border-top:2px solid var(--sage);border-radius:0 18px 18px 18px}
    .activity:nth-child(2){border-top-color:var(--coral)}
    .activity:nth-child(3){border-top-color:var(--plum)}
    .activity strong{font-size:26px;display:block;margin-bottom:4px}
    .activity p{font-size:14px;margin:0}
    .faq-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:70px}
    .faq-layout h2{max-width:400px}
    .accordion-item{background:transparent;border:0;border-bottom:1px solid var(--line)}
    .accordion-button{background:transparent!important;color:var(--ink);font-weight:750;padding:20px 0;box-shadow:none!important}
    .accordion-button::after{background-size:14px}
    .accordion-body{padding:0 35px 20px 0;color:#686159;font-size:15px}
    .final-cta{padding:78px 0;background:#e8d8d0}
    .cta-panel{display:flex;justify-content:space-between;align-items:center;gap:30px}
    .cta-panel p{max-width:560px;margin:13px 0 0}
    .site-footer{padding:64px 0 30px;background:var(--night);color:#fff}
    .site-footer p{color:#c9c1ba;font-size:14px;max-width:360px}
    .footer-grid{display:grid;grid-template-columns:1.6fr .7fr .7fr;gap:50px}
    .footer-title{font-weight:800;margin-bottom:15px;color:#fff}
    .footer-links{display:grid;gap:8px;color:#c9c1ba;font-size:14px}
    .footer-links a:hover{color:#f2b19c}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:35px;margin-top:45px;border-top:1px solid rgba(255,255,255,.15);font-size:13px;color:#bcb3ab}
    .floating-cta{
      position:fixed;right:22px;bottom:20px;z-index:999;
      display:flex;align-items:center;gap:14px;padding:12px 15px 12px 20px;
      background:var(--night);color:#fff;border-radius:999px;box-shadow:0 15px 35px rgba(28,24,27,.25)
    }
    .floating-cta span{font-size:14px}
    .floating-cta .btn{min-height:42px;padding:8px 17px;font-size:14px}
    .floating-close{border:0;background:transparent;color:#bfb7b0;font-size:20px;padding:3px 4px}
    .reveal{animation:reveal .75s var(--ease) both}
    @keyframes reveal{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
    @keyframes float{from{transform:translateY(0)}to{transform:translateY(-7px)}}
    .hero-side img:first-child{animation:float 5s ease-in-out infinite alternate}
    @media (max-width:1100px){
      .nav-center{padding:0 16px}
      .nav-links .nav-link{padding:8px 7px;font-size:13px}
      .hero-inner,.long-layout,.score-layout,.faq-layout{gap:40px}
    }
    @media (max-width:991px){
      .navbar{padding:16px 0}
      .nav-center{order:3;flex-basis:100%;padding:15px 0 0}
      .nav-center .search-box{width:100%}
      .nav-links{display:flex;flex-wrap:wrap;padding:18px 0 5px;gap:7px}
      .hero-inner,.long-layout,.score-layout,.faq-layout{grid-template-columns:1fr}
      .hero-side{max-width:620px}
      .feature-layout{grid-template-columns:1fr}
      .mini-stack{grid-template-columns:1fr 1fr}
      .score-layout{align-items:start}
      .score-number{font-size:76px}
    }
    @media (max-width:767px){
      .container{padding-left:18px;padding-right:18px}
      .section{padding:68px 0}
      .section-tight{padding:50px 0}
      .page-hero{padding:54px 0 60px}
      .page-hero::after{font-size:150px;right:-5px}
      .hero-inner{gap:34px}
      .hero-side{grid-template-columns:1fr 1fr;gap:10px}
      .hero-side img{height:150px}
      .section-head,.filter-bar,.cta-panel{display:block}
      .section-head p{margin-top:16px}
      .filter-search{margin-top:18px;max-width:none}
      .feature-card{min-height:390px}
      .mini-stack{grid-template-columns:1fr}
      .recommend-grid{display:grid;grid-template-columns:1fr}
      .recommend-card:nth-child(n){grid-column:auto}
      .recommend-card img{height:220px}
      .score-list,.activity-strip{grid-template-columns:1fr}
      .footer-grid{grid-template-columns:1fr 1fr;gap:30px}
      .footer-brand{grid-column:1/-1}
      .footer-bottom{display:block}
      .footer-bottom div+div{margin-top:10px}
      .floating-cta{left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));justify-content:space-between;padding-left:16px}
      .floating-cta span{font-size:13px}
    }
    @media (max-width:520px){
      h1{font-size:42px}
      h2{font-size:32px}
      .hero-side img{height:125px}
      .hero-caption{font-size:14px}
      .footer-grid{grid-template-columns:1fr}
      .footer-brand{grid-column:auto}
      .floating-cta span{max-width:150px;line-height:1.4}
    }
    @media (prefers-reduced-motion:reduce){
      *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
    }
