/* roulang page: index */
:root{
  --paper:#f5f0e7;--paper-deep:#ebe2d4;--ink:#20231f;--muted:#70756c;
  --line:#d8cebf;--accent:#bd4c2e;--accent-dark:#91351f;--olive:#68715f;
  --white:#fffdf8;--radius:16px;--shadow:0 16px 40px rgba(54,43,30,.09);
  --container:1200px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Noto Sans SC","Microsoft YaHei",sans-serif;background:var(--paper);color:var(--ink);line-height:1.8}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
button{font:inherit;border:0;cursor:pointer}
:focus-visible{outline:3px solid rgba(189,76,46,.45);outline-offset:4px}
.container{width:min(calc(100% - 48px),var(--container));margin:auto}
.site-header{height:78px;border-bottom:1px solid var(--line);background:rgba(245,240,231,.94);position:relative;z-index:20}
.nav-wrap{height:78px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.logo{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.02em;white-space:nowrap}
.logo-mark{width:34px;height:34px;display:grid;place-items:center;background:var(--accent);color:#fff;border-radius:8px 8px 8px 2px;font-size:15px}
.logo-text{font-size:18px}.logo-text small{display:block;font-size:9px;letter-spacing:.18em;color:var(--muted);font-weight:600;line-height:1.2}
.nav-list{display:flex;align-items:center;gap:30px;list-style:none;font-size:14px}
.nav-list a{padding:8px 0;color:#53584f;position:relative;transition:.25s}
.nav-list a:after{content:"";position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--accent);transition:.25s}
.nav-list a:hover,.nav-list a.active{color:var(--accent-dark)}
.nav-list a:hover:after,.nav-list a.active:after{width:100%}
.nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 21px;border-radius:8px;background:var(--accent);color:#fff;font-size:14px;font-weight:700;transition:.25s;box-shadow:0 5px 14px rgba(189,76,46,.16)}
.nav-cta:hover,.btn:hover{background:var(--accent-dark);transform:translateY(-2px)}
.menu-toggle{display:none;background:none;color:var(--ink);font-size:24px}
.hero{padding:86px 0 94px;position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(245,240,231,.98) 15%,rgba(245,240,231,.72) 55%,rgba(245,240,231,.15)),url('/assets/images/backpic/back-1.webp') center/cover;opacity:.72;z-index:-1}
.hero-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:76px;align-items:center}
.eyebrow,.section-kicker{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);font-weight:800}
.hero h1{font-size:clamp(42px,5vw,70px);line-height:1.18;letter-spacing:-.055em;margin:20px 0 25px;max-width:680px}
.hero-copy{font-size:17px;line-height:2;color:#555b53;max-width:600px}
.actions{display:flex;gap:13px;margin-top:34px;flex-wrap:wrap}
.btn.secondary{background:transparent;color:var(--ink);border:1px solid #9f9688;box-shadow:none}
.btn.secondary:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.hero-art{min-height:405px;position:relative;display:flex;align-items:center;justify-content:center}
.hero-photo{width:365px;height:405px;object-fit:cover;border-radius:18px 18px 18px 72px;filter:saturate(.82);box-shadow:var(--shadow)}
.seal{position:absolute;right:4%;top:7%;width:106px;height:106px;border:1px solid var(--accent);border-radius:50%;display:grid;place-items:center;color:var(--accent);font-size:14px;font-weight:800;line-height:1.4;text-align:center;transform:rotate(9deg);background:rgba(245,240,231,.8)}
.art-note{position:absolute;bottom:16px;left:0;background:var(--ink);color:#fff;padding:16px 20px;border-radius:10px;font-size:13px;letter-spacing:.05em}
.section{padding:96px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:38px}
.section h2{font-size:clamp(28px,3.2vw,42px);line-height:1.3;letter-spacing:-.035em;margin-top:12px}
.section-intro{max-width:440px;color:var(--muted);font-size:15px}
.keyword-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0}
.keyword-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.keyword-label{font-size:12px;color:var(--muted);margin-right:12px}
.tag{display:inline-flex;align-items:center;padding:7px 14px;border:1px solid var(--line);border-radius:99px;color:#555b53;background:rgba(255,253,248,.48);font-size:13px}
.tag.strong{border-color:var(--accent);color:var(--accent-dark);background:#f7e6dc}
.feature-layout{display:grid;grid-template-columns:1.25fr .75fr;gap:28px}
.feature-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.3s}
.feature-card:hover,.index-item:hover,.info-panel:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.feature-img{height:300px;width:100%;object-fit:cover}
.feature-body{padding:28px 30px 30px}
.meta{display:flex;align-items:center;gap:13px;color:var(--muted);font-size:12px}
.meta .tag{padding:3px 9px;font-size:11px}
.feature-body h3{font-size:26px;line-height:1.45;margin:14px 0 10px}
.feature-body p{color:var(--muted);font-size:14px}
.text-link{display:inline-flex;margin-top:20px;color:var(--accent-dark);font-size:14px;font-weight:700;border-bottom:1px solid var(--accent)}
.index-list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.index-item{display:grid;grid-template-columns:45px 1fr;gap:12px;padding:19px 0;border-bottom:1px solid var(--line);transition:.25s}
.index-no{font-family:Georgia,serif;color:var(--accent);font-size:22px}
.index-item h4{font-size:16px;line-height:1.5;margin-bottom:5px}
.index-item p{font-size:12px;color:var(--muted)}
.split-section{background:var(--paper-deep)}
.split-grid{display:grid;grid-template-columns:.86fr 1.14fr;gap:80px;align-items:start}
.split-grid>div>p{color:var(--muted);font-size:16px;margin-top:22px;max-width:470px}
.info-panel{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:10px 28px;transition:.3s}
.info-row{display:grid;grid-template-columns:44px 1fr;gap:18px;padding:22px 0;border-bottom:1px solid var(--line)}
.info-row:last-child{border-bottom:0}
.info-row b{color:var(--accent);font-family:Georgia,serif;font-size:20px}
.info-row h4{font-size:16px;margin-bottom:3px}.info-row p{color:var(--muted);font-size:13px}
.updates{background:#faf7f0}
.update-list{border-top:1px solid var(--line)}
.update-item{display:grid;grid-template-columns:125px 1fr 100px;gap:25px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line);transition:.25s}
.update-item:hover{padding-left:10px;background:rgba(255,253,248,.55)}
.update-date{font-size:12px;color:var(--muted)}.update-title{font-size:17px;font-weight:700}.update-summary{font-size:13px;color:var(--muted);margin-top:3px}.update-arrow{color:var(--accent);text-align:right;font-size:13px;font-weight:700}
.empty-state{padding:34px 0;color:var(--muted);font-size:14px}
.faq-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px}
.faq-list{border-top:1px solid var(--line)}
details{border-bottom:1px solid var(--line);padding:20px 0}
summary{list-style:none;cursor:pointer;font-weight:700;padding-right:30px;position:relative}
summary::-webkit-details-marker{display:none}
summary:after{content:"＋";position:absolute;right:0;color:var(--accent);font-size:21px;font-weight:400}
details[open] summary:after{content:"－"}details p{color:var(--muted);font-size:14px;padding:12px 25px 0 0}
.cta-section{padding:25px 0 96px}.cta-box{background:var(--ink);color:#fff;border-radius:18px;padding:55px 62px;display:flex;justify-content:space-between;align-items:center;gap:30px}
.cta-box h2{font-size:clamp(25px,3vw,38px);line-height:1.4}.cta-box p{color:#bfc1b7;font-size:14px;margin-top:8px}.cta-box .btn{background:var(--accent);flex-shrink:0}
.site-footer{border-top:1px solid var(--line);padding:52px 0 25px;background:#eee7dc}
.footer-grid{display:grid;grid-template-columns:1.4fr .7fr .7fr;gap:50px;padding-bottom:40px}
.footer-brand p{color:var(--muted);font-size:13px;max-width:330px;margin-top:14px}
.footer-title{font-weight:800;font-size:14px;margin-bottom:14px}.footer-links{list-style:none;color:var(--muted);font-size:13px}.footer-links li{margin:7px 0}.footer-links a:hover{color:var(--accent)}
.footer-tags{display:flex;gap:7px;flex-wrap:wrap}.footer-tags .tag{font-size:11px;padding:4px 9px}
.copyright{border-top:1px solid var(--line);padding-top:20px;display:flex;justify-content:space-between;color:#858277;font-size:11px}
@media(max-width:992px){.hero-grid,.feature-layout,.split-grid,.faq-grid{gap:38px}.hero-grid{grid-template-columns:1fr .85fr}.split-grid{grid-template-columns:1fr 1fr}.nav-list{gap:17px}.nav-cta{padding:0 13px}.hero{padding:65px 0 75px}}
@media(max-width:768px){.container{width:min(calc(100% - 32px),var(--container))}.site-header,.nav-wrap{height:68px}.menu-toggle{display:block}.nav-list{display:none;position:absolute;top:68px;left:16px;right:16px;padding:12px 20px;background:var(--white);border:1px solid var(--line);border-radius:0 0 12px 12px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:3px}.nav-list.open{display:flex}.nav-list a{display:block;padding:10px}.nav-cta{display:none}.hero-grid,.feature-layout,.split-grid,.faq-grid{grid-template-columns:1fr}.hero-art{min-height:340px}.hero-photo{width:78%;height:340px}.section{padding:70px 0}.section-head{display:block}.section-intro{margin-top:16px}.cta-box{padding:38px 28px;display:block}.cta-box .btn{margin-top:24px}.footer-grid{grid-template-columns:1fr 1fr;gap:30px}.footer-brand{grid-column:1/-1}}
@media(max-width:520px){.hero h1{font-size:40px}.hero-copy{font-size:15px}.actions .btn{width:100%}.feature-img{height:220px}.feature-body{padding:22px}.update-item{grid-template-columns:82px 1fr;gap:10px}.update-arrow{display:none}.update-title{font-size:15px}.info-panel{padding:4px 18px}.footer-grid{grid-template-columns:1fr}.copyright{display:block}.copyright span{display:block;margin-top:7px}}

/* roulang page: article */
:root{
      --paper:#f5f0e7;
      --paper-deep:#ebe2d4;
      --ink:#20231f;
      --muted:#70756c;
      --line:#d8cebf;
      --accent:#bd4c2e;
      --accent-dark:#91351f;
      --olive:#68715f;
      --white:#fffdf8;
      --radius:16px;
      --shadow:0 16px 40px rgba(54,43,30,.09);
      --container:1200px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      background:var(--paper);
      color:var(--ink);
      font-family:"Noto Sans SC","Microsoft YaHei",sans-serif;
      line-height:1.8;
    }
    a{color:inherit;text-decoration:none}
    a:focus-visible,button:focus-visible{outline:3px solid rgba(189,76,46,.35);outline-offset:4px}
    img{display:block;max-width:100%;height:auto}
    button{font:inherit;border:0;cursor:pointer}
    .container{width:min(calc(100% - 48px),var(--container));margin:0 auto}
    .site-header{
      height:78px;
      border-bottom:1px solid var(--line);
      background:rgba(245,240,231,.96);
      position:relative;
      z-index:20;
    }
    .nav-wrap{
      height:78px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:28px;
    }
    .logo{
      display:flex;
      align-items:center;
      gap:12px;
      font-weight:800;
      letter-spacing:.02em;
      white-space:nowrap;
    }
    .logo-mark{
      width:34px;
      height:34px;
      display:grid;
      place-items:center;
      background:var(--accent);
      color:#fff;
      border-radius:8px 8px 8px 2px;
      font-size:15px;
    }
    .logo-text{font-size:18px}
    .logo-text small{
      display:block;
      color:var(--muted);
      font-size:9px;
      letter-spacing:.18em;
      font-weight:600;
      line-height:1.2;
    }
    nav[aria-label="主导航"]{margin-left:auto}
    .nav-list{
      display:flex;
      align-items:center;
      gap:30px;
      list-style:none;
      padding:0;
      margin:0;
      font-size:14px;
    }
    .nav-list a{
      padding:8px 0;
      color:#53584f;
      position:relative;
      transition:.25s;
    }
    .nav-list a:after{
      content:"";
      position:absolute;
      bottom:0;
      left:0;
      width:0;
      height:2px;
      background:var(--accent);
      transition:.25s;
    }
    .nav-list a:hover,.nav-list a.active{color:var(--accent-dark)}
    .nav-list a:hover:after,.nav-list a.active:after{width:100%}
    .nav-cta,.btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:46px;
      padding:0 21px;
      border-radius:8px;
      background:var(--accent);
      color:#fff;
      font-size:14px;
      font-weight:700;
      transition:.25s;
      box-shadow:0 5px 14px rgba(189,76,46,.16);
    }
    .nav-cta:hover,.btn:hover{background:var(--accent-dark);transform:translateY(-2px)}
    .menu-toggle{display:none;background:none;color:var(--ink);font-size:24px}
    .article-hero{
      padding:76px 0 64px;
      border-bottom:1px solid var(--line);
      background:
        linear-gradient(90deg,rgba(245,240,231,.98),rgba(245,240,231,.78)),
        url('/assets/images/backpic/back-2.png') center/cover;
    }
    .breadcrumb{
      display:flex;
      align-items:center;
      gap:10px;
      color:var(--muted);
      font-size:13px;
      margin-bottom:34px;
    }
    .breadcrumb span{color:var(--accent)}
    .article-head{
      display:grid;
      grid-template-columns:minmax(0,1fr) 370px;
      gap:70px;
      align-items:end;
    }
    .eyebrow,.section-kicker{
      color:var(--accent);
      font-size:12px;
      font-weight:800;
      letter-spacing:.16em;
      text-transform:uppercase;
    }
    .article-head h1{
      max-width:820px;
      font-size:clamp(36px,5vw,62px);
      line-height:1.25;
      letter-spacing:-.05em;
      margin:18px 0 22px;
      overflow-wrap:anywhere;
    }
    .article-summary{
      max-width:760px;
      color:#5d625a;
      font-size:17px;
      line-height:2;
      margin:0 0 25px;
    }
    .meta{
      display:flex;
      align-items:center;
      gap:13px;
      flex-wrap:wrap;
      color:var(--muted);
      font-size:12px;
    }
    .tag{
      display:inline-flex;
      align-items:center;
      padding:7px 14px;
      border:1px solid var(--line);
      border-radius:99px;
      color:#555b53;
      background:rgba(255,253,248,.55);
      font-size:13px;
    }
    .tag.strong{
      border-color:var(--accent);
      color:var(--accent-dark);
      background:#f7e6dc;
    }
    .article-cover{
      width:100%;
      height:270px;
      object-fit:cover;
      border-radius:18px 18px 18px 62px;
      box-shadow:var(--shadow);
      filter:saturate(.84);
    }
    .reading-layout{
      display:grid;
      grid-template-columns:minmax(0,820px) 280px;
      gap:70px;
      align-items:start;
      padding:78px 0 90px;
    }
    .article-content{
      min-width:0;
      color:#3e433d;
      font-size:16px;
      line-height:2;
    }
    .article-content h2{
      color:var(--ink);
      font-size:30px;
      line-height:1.4;
      margin:44px 0 16px;
      padding-left:18px;
      border-left:4px solid var(--accent);
    }
    .article-content h3{
      color:var(--ink);
      font-size:21px;
      line-height:1.5;
      margin:32px 0 12px;
    }
    .article-content p{margin:0 0 22px}
    .article-content ul,.article-content ol{
      margin:18px 0 25px;
      padding-left:28px;
    }
    .article-content li{margin:8px 0}
    .article-content blockquote{
      margin:30px 0;
      padding:22px 26px;
      background:var(--paper-deep);
      border-left:4px solid var(--olive);
      color:#555b53;
    }
    .article-content img{
      width:100%;
      margin:30px 0;
      border-radius:12px;
    }
    .article-content hr{
      border:0;
      border-top:1px solid var(--line);
      margin:42px 0;
    }
    .article-side{
      position:sticky;
      top:24px;
    }
    .side-panel{
      background:rgba(255,253,248,.6);
      border:1px solid var(--line);
      border-radius:var(--radius);
      padding:24px;
      margin-bottom:18px;
    }
    .side-title{
      font-size:14px;
      font-weight:800;
      margin-bottom:15px;
    }
    .side-list{
      list-style:none;
      padding:0;
      margin:0;
    }
    .side-list li{
      border-top:1px solid var(--line);
      padding:11px 0;
      color:#666b62;
      font-size:13px;
    }
    .side-list li:first-child{border-top:0;padding-top:0}
    .side-list a{transition:.2s}
    .side-list a:hover{color:var(--accent)}
    .keyword-cloud{display:flex;gap:8px;flex-wrap:wrap}
    .keyword-cloud .tag{font-size:11px;padding:5px 9px}
    .empty-state{
      background:var(--white);
      border:1px solid var(--line);
      border-radius:var(--radius);
      padding:60px 30px;
      text-align:center;
    }
    .empty-state h2{margin:0 0 12px;font-size:28px}
    .empty-state p{color:var(--muted);margin:0 0 24px}
    .article-bottom{
      padding:30px 0 88px;
      border-top:1px solid var(--line);
    }
    .bottom-row{
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:20px;
    }
    .btn.secondary{
      background:transparent;
      color:var(--ink);
      border:1px solid #9f9688;
      box-shadow:none;
    }
    .btn.secondary:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
    .cta-section{padding:0 0 96px}
    .cta-box{
      background:var(--ink);
      color:#fff;
      border-radius:18px;
      padding:52px 60px;
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:30px;
    }
    .cta-box h2{font-size:clamp(25px,3vw,38px);line-height:1.4;margin:0}
    .cta-box p{color:#bfc1b7;font-size:14px;margin:8px 0 0}
    .cta-box .btn{flex-shrink:0}
    .site-footer{
      border-top:1px solid var(--line);
      padding:52px 0 25px;
      background:#eee7dc;
    }
    .footer-grid{
      display:grid;
      grid-template-columns:1.4fr .7fr .7fr;
      gap:50px;
      padding-bottom:40px;
    }
    .footer-brand p{
      color:var(--muted);
      font-size:13px;
      max-width:330px;
      margin-top:14px;
    }
    .footer-title{font-weight:800;font-size:14px;margin-bottom:14px}
    .footer-links{
      list-style:none;
      padding:0;
      margin:0;
      color:var(--muted);
      font-size:13px;
    }
    .footer-links li{margin:7px 0}
    .footer-links a:hover{color:var(--accent)}
    .footer-tags{display:flex;gap:8px;flex-wrap:wrap}
    .copyright{
      border-top:1px solid var(--line);
      padding-top:20px;
      display:flex;
      justify-content:space-between;
      gap:20px;
      color:#85887f;
      font-size:12px;
    }
    @media(max-width:992px){
      .article-head{grid-template-columns:1fr 300px;gap:35px}
      .reading-layout{grid-template-columns:minmax(0,1fr) 240px;gap:35px}
      .nav-list{gap:17px}
      .nav-cta{display:none}
    }
    @media(max-width:768px){
      .container{width:min(calc(100% - 32px),var(--container))}
      .site-header,.nav-wrap{height:70px}
      .menu-toggle{display:block}
      nav[aria-label="主导航"]{
        display:none;
        position:absolute;
        left:16px;
        right:16px;
        top:66px;
        background:var(--white);
        border:1px solid var(--line);
        border-radius:12px;
        box-shadow:var(--shadow);
        padding:12px 20px;
      }
      nav[aria-label="主导航"].open{display:block}
      .nav-list{display:block}
      .nav-list li{border-bottom:1px solid var(--line)}
      .nav-list li:last-child{border-bottom:0}
      .nav-list a{display:block;padding:12px 0}
      .article-hero{padding:54px 0 45px}
      .article-head{display:block}
      .article-cover{height:240px;margin-top:32px}
      .reading-layout{display:block;padding:55px 0 65px}
      .article-side{position:static;margin-top:45px}
      .article-content h2{font-size:26px}
      .cta-box{padding:38px 28px;display:block}
      .cta-box .btn{margin-top:25px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:30px}
      .footer-brand{grid-column:1/-1}
      .copyright{display:block}
      .copyright span{display:block;margin-top:6px}
    }
    @media(max-width:520px){
      .logo-text{font-size:15px}
      .logo-mark{width:31px;height:31px}
      .article-head h1{font-size:35px}
      .article-summary{font-size:15px}
      .article-cover{height:195px;border-radius:14px 14px 14px 42px}
      .bottom-row{display:block}
      .bottom-row .btn{width:100%;margin-top:12px}
      .footer-grid{grid-template-columns:1fr}
      .footer-brand{grid-column:auto}
    }

/* roulang page: category1 */
:root{
      --paper:#f5f0e7;
      --paper-deep:#ebe2d4;
      --ink:#20231f;
      --muted:#70756c;
      --line:#d8cebf;
      --accent:#bd4c2e;
      --accent-dark:#91351f;
      --olive:#68715f;
      --white:#fffdf8;
      --radius:16px;
      --shadow:0 16px 40px rgba(54,43,30,.09);
      --container:1200px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:"Noto Sans SC","Microsoft YaHei",sans-serif;
      background:var(--paper);
      color:var(--ink);
      line-height:1.8;
    }
    h1,h2,h3,h4,p{margin-top:0}
    a{color:inherit;text-decoration:none}
    a:focus-visible,button:focus-visible{outline:3px solid rgba(189,76,46,.42);outline-offset:4px}
    img{display:block;max-width:100%;height:auto}
    button{font:inherit;border:0;cursor:pointer}
    .container{width:min(calc(100% - 48px),var(--container));margin:auto}
    .site-header{
      height:78px;
      border-bottom:1px solid var(--line);
      background:rgba(245,240,231,.96);
      position:relative;
      z-index:20;
    }
    .nav-wrap{
      height:78px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:28px;
    }
    .logo{
      display:flex;
      align-items:center;
      gap:12px;
      font-weight:800;
      letter-spacing:.02em;
      white-space:nowrap;
    }
    .logo-mark{
      width:34px;height:34px;display:grid;place-items:center;
      background:var(--accent);color:#fff;border-radius:8px 8px 8px 2px;font-size:15px;
    }
    .logo-text{font-size:18px}
    .logo-text small{
      display:block;font-size:9px;letter-spacing:.18em;color:var(--muted);
      font-weight:600;line-height:1.2;
    }
    .nav-list{
      display:flex;align-items:center;gap:30px;list-style:none;
      margin:0;padding:0;font-size:14px;
    }
    .nav-list a{
      padding:8px 0;color:#53584f;position:relative;transition:.25s
    }
    .nav-list a:after{
      content:"";position:absolute;bottom:0;left:0;width:0;height:2px;
      background:var(--accent);transition:.25s
    }
    .nav-list a:hover,.nav-list a.active{color:var(--accent-dark)}
    .nav-list a:hover:after,.nav-list a.active:after{width:100%}
    .nav-cta,.btn{
      display:inline-flex;align-items:center;justify-content:center;
      min-height:46px;padding:0 21px;border-radius:8px;background:var(--accent);
      color:#fff;font-size:14px;font-weight:700;transition:.25s;
      box-shadow:0 5px 14px rgba(189,76,46,.16)
    }
    .nav-cta:hover,.btn:hover{background:var(--accent-dark);color:#fff;transform:translateY(-2px)}
    .btn.secondary{
      background:transparent;color:var(--ink);border:1px solid #9f9688;box-shadow:none
    }
    .btn.secondary:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
    .menu-toggle{display:none;background:none;color:var(--ink);font-size:24px}
    .inner-hero{
      position:relative;
      overflow:hidden;
      padding:78px 0 74px;
      background:
        linear-gradient(90deg,rgba(245,240,231,.98) 12%,rgba(245,240,231,.78) 61%,rgba(245,240,231,.32)),
        url('/assets/images/backpic/back-2.png') center/cover;
    }
    .inner-hero:after{
      content:"指南 / 01";
      position:absolute;right:5%;bottom:30px;
      color:rgba(189,76,46,.32);font-size:13px;letter-spacing:.2em;
    }
    .breadcrumb{
      display:flex;gap:10px;align-items:center;color:var(--muted);
      font-size:13px;margin-bottom:30px
    }
    .breadcrumb span{color:#b2a89a}
    .eyebrow,.section-kicker{
      font-size:12px;letter-spacing:.16em;text-transform:uppercase;
      color:var(--accent);font-weight:800
    }
    .inner-hero h1{
      max-width:760px;font-size:clamp(36px,5vw,62px);
      line-height:1.22;letter-spacing:-.05em;margin:17px 0 20px
    }
    .inner-hero p{max-width:700px;color:#5f645c;font-size:17px;line-height:2}
    .hero-tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
    .tag{
      display:inline-flex;align-items:center;padding:7px 14px;
      border:1px solid var(--line);border-radius:99px;color:#555b53;
      background:rgba(255,253,248,.55);font-size:13px
    }
    .tag.strong{border-color:var(--accent);color:var(--accent-dark);background:#f7e6dc}
    .section{padding:88px 0}
    .section-head{
      display:flex;justify-content:space-between;align-items:end;
      gap:30px;margin-bottom:36px
    }
    .section h2{
      font-size:clamp(28px,3.2vw,42px);line-height:1.3;
      letter-spacing:-.035em;margin:12px 0 0
    }
    .section-intro{max-width:450px;color:var(--muted);font-size:15px}
    .guide-nav{
      display:flex;gap:10px;overflow-x:auto;padding:0 0 15px;
      border-bottom:1px solid var(--line);scrollbar-width:thin
    }
    .guide-nav a{
      flex:0 0 auto;padding:10px 17px;border-radius:7px;
      color:var(--muted);font-size:14px;transition:.25s
    }
    .guide-nav a:hover,.guide-nav a.current{background:var(--accent);color:#fff}
    .guide-layout{
      display:grid;grid-template-columns:1.22fr .78fr;gap:30px;align-items:start
    }
    .feature-panel{
      background:var(--white);border:1px solid var(--line);
      border-radius:var(--radius);overflow:hidden
    }
    .feature-panel img{width:100%;height:320px;object-fit:cover}
    .panel-body{padding:30px 34px 34px}
    .panel-body h3{font-size:28px;line-height:1.45;margin:13px 0 12px}
    .panel-body p{color:var(--muted);font-size:15px}
    .meta{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:12px}
    .meta .tag{padding:3px 9px;font-size:11px}
    .side-index{
      border-top:1px solid var(--line);background:rgba(255,253,248,.35)
    }
    .side-index a{
      display:grid;grid-template-columns:42px 1fr;gap:15px;
      padding:20px 5px;border-bottom:1px solid var(--line);transition:.25s
    }
    .side-index a:hover{padding-left:13px;color:var(--accent-dark)}
    .side-index b{color:var(--accent);font-family:Georgia,serif;font-size:19px}
    .side-index strong{font-size:15px;display:block;margin-bottom:4px}
    .side-index small{display:block;color:var(--muted);font-size:12px}
    .topic-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
    .topic-card{
      padding:25px 26px;background:var(--white);border:1px solid var(--line);
      border-radius:12px;min-height:190px;transition:.28s
    }
    .topic-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
    .topic-card .number{color:var(--accent);font:700 20px Georgia,serif}
    .topic-card h3{font-size:19px;margin:15px 0 8px}
    .topic-card p{font-size:13px;color:var(--muted);margin-bottom:18px}
    .topic-card a{font-size:13px;font-weight:700;color:var(--accent-dark);border-bottom:1px solid var(--accent)}
    .split-section{background:var(--paper-deep)}
    .split-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:80px;align-items:start}
    .split-grid>div>p{color:var(--muted);font-size:16px;margin-top:22px;max-width:470px}
    .info-panel{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:12px 28px;transition:.25s}
    .info-row{display:grid;grid-template-columns:44px 1fr;gap:18px;padding:21px 0;border-bottom:1px solid var(--line)}
    .info-row:last-child{border-bottom:0}
    .info-row b{color:var(--accent);font-family:Georgia,serif;font-size:20px}
    .info-row h4{font-size:16px;margin:0 0 3px}
    .info-row p{color:var(--muted);font-size:13px;margin:0}
    .faq-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:80px}
    .faq-list{border-top:1px solid var(--line)}
    .faq-item{border-bottom:1px solid var(--line)}
    .faq-question{
      width:100%;display:flex;justify-content:space-between;align-items:center;
      gap:20px;text-align:left;background:none;padding:20px 0;color:var(--ink);
      font-size:16px;font-weight:700
    }
    .faq-question span:last-child{color:var(--accent);font-size:24px;line-height:1;transition:.25s}
    .faq-answer{display:none;color:var(--muted);font-size:14px;padding:0 42px 20px 0}
    .faq-item.open .faq-answer{display:block}
    .faq-item.open .faq-question span:last-child{transform:rotate(45deg)}
    .cta-section{padding:25px 0 96px}
    .cta-box{
      background:var(--ink);color:#fff;border-radius:18px;padding:52px 60px;
      display:flex;justify-content:space-between;align-items:center;gap:30px
    }
    .cta-box h2{font-size:clamp(25px,3vw,38px);line-height:1.4;margin:0}
    .cta-box p{color:#bfc1b7;font-size:14px;margin:8px 0 0}
    .cta-box .btn{background:var(--accent);flex-shrink:0}
    .site-footer{border-top:1px solid var(--line);padding:52px 0 25px;background:#eee7dc}
    .footer-grid{display:grid;grid-template-columns:1.4fr .7fr .7fr;gap:50px;padding-bottom:40px}
    .footer-brand p{color:var(--muted);font-size:13px;max-width:330px;margin-top:14px}
    .footer-title{font-weight:800;font-size:14px;margin-bottom:14px}
    .footer-links{list-style:none;color:var(--muted);font-size:13px;margin:0;padding:0}
    .footer-links li{margin:7px 0}
    .footer-links a:hover{color:var(--accent-dark)}
    .footer-tags{display:flex;gap:7px;flex-wrap:wrap}
    .footer-tags .tag{font-size:11px;padding:5px 9px}
    .copyright{
      border-top:1px solid var(--line);padding-top:20px;color:var(--muted);
      display:flex;justify-content:space-between;gap:20px;font-size:12px
    }
    @media (max-width:992px){
      .guide-layout,.split-grid{grid-template-columns:1fr;gap:35px}
      .faq-grid{grid-template-columns:1fr;gap:30px}
      .split-grid{gap:35px}
      .nav-list{gap:18px}
      .nav-cta{display:none}
    }
    @media (max-width:768px){
      .container{width:min(calc(100% - 34px),var(--container))}
      .site-header,.nav-wrap{height:70px}
      .menu-toggle{display:block}
      .nav-list{
        display:none;position:absolute;top:70px;left:17px;right:17px;
        background:var(--white);border:1px solid var(--line);border-radius:10px;
        padding:12px 20px;box-shadow:var(--shadow);flex-direction:column;
        align-items:stretch;gap:2px
      }
      .nav-list.show{display:flex}
      .nav-list a{display:block;padding:12px 0}
      .inner-hero{padding:54px 0 60px}
      .inner-hero h1{font-size:clamp(34px,9vw,48px)}
      .section{padding:65px 0}
      .section-head{display:block;margin-bottom:25px}
      .section-intro{margin-top:15px}
      .topic-grid{grid-template-columns:1fr}
      .cta-box{display:block;padding:35px 28px}
      .cta-box .btn{margin-top:24px}
      .footer-grid{grid-template-columns:1fr;gap:28px}
      .copyright{display:block}
      .copyright span{display:block;margin-bottom:7px}
    }
    @media (max-width:520px){
      .logo-text{font-size:15px}
      .logo-mark{width:31px;height:31px}
      .inner-hero h1{letter-spacing:-.04em}
      .panel-body{padding:24px}
      .feature-panel img{height:220px}
      .info-panel{padding:8px 20px}
      .guide-nav a{padding:8px 12px;font-size:13px}
    }