:root{
  --ink:#1E3B33;
  --ink-2:#132520;
  --linen:#E8DCC8;
  --paper:#F7F1E7;
  --clay:#C97B4A;
  --rail:88px;
  --rule:rgba(30,59,51,.14);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;
  padding-left:var(--rail);
  background:var(--paper);
  color:#26302B;
  font-family:'Raleway',system-ui,-apple-system,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;
  font-size:16px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:'Lora','Songti SC',Georgia,serif;font-weight:600;line-height:1.3;color:var(--ink)}
img{max-width:100%}
a{color:inherit}

/* ---------- 左侧固定竖排导航 ---------- */
.rail{
  position:fixed;
  top:0;left:0;bottom:0;
  width:var(--rail);
  z-index:60;
  background:var(--ink);
  color:var(--linen);
  display:flex;
  flex-direction:column;
  box-shadow:2px 0 0 rgba(19,37,32,.35);
}
.mark{
  display:flex;align-items:center;justify-content:center;
  height:var(--rail);flex:0 0 auto;
  text-decoration:none;
  border-bottom:1px solid rgba(232,220,200,.18);
}
.mark__img{width:34px;height:34px;border-radius:10px;object-fit:cover;display:block}
.mark__txt{
  width:36px;height:36px;border-radius:10px;
  background:var(--clay);color:#fff;
  display:grid;place-items:center;
  font-family:'Lora',serif;font-size:15px;font-weight:600;
}
.rail-nav{flex:1 1 auto;padding:12px 0;min-height:0}
.rail-nav ul{list-style:none;margin:0;padding:0}
.rail-nav>ul>li{position:relative}
.rail-nav a{
  display:flex;align-items:center;justify-content:center;
  min-height:44px;
  padding:10px 8px;
  font-size:15px;line-height:1.3;text-align:center;
  text-decoration:none;
  color:rgba(232,220,200,.84);
  transition:background .25s ease,color .25s ease;
}
.rail-nav a:hover,.rail-nav a:focus-visible{background:rgba(232,220,200,.13);color:#fff}
.rail-nav>ul>li>a{border-left:2px solid transparent}
.rail-nav>ul>li>a:hover,.rail-nav>ul>li>a:focus-visible{border-left-color:var(--clay)}
.sub{
  position:absolute;left:100%;top:0;
  min-width:158px;
  padding:6px;
  margin:0;
  background:var(--ink-2);
  border-radius:0 10px 10px 0;
  display:block;
  opacity:0;visibility:hidden;
  transform:translateX(-6px);
  transition:opacity .24s ease,transform .24s ease,visibility .24s;
  z-index:5;
}
.grp:hover .sub,.grp:focus-within .sub{opacity:1;visibility:visible;transform:none}
.sub a{justify-content:flex-start;text-align:left;border-radius:8px;font-size:15px}

/* ---------- 首屏 ---------- */
.hero{
  position:relative;
  margin-left:calc(-1 * var(--rail));
  min-height:100vh;
  min-height:100svh;
  display:flex;
  align-items:flex-end;
  justify-content:flex-end;
  overflow:hidden;
  padding:120px 56px 92px calc(var(--rail) + 48px);
  background:linear-gradient(155deg,#1E3B33,#0E1A16 72%);
  color:var(--linen);
}
.hero__fig{
  position:absolute;top:-8%;left:0;right:0;bottom:0;
  margin:0;z-index:0;
  will-change:transform;
}
.hero__img{width:100%;height:100%;object-fit:cover;display:block;border-radius:0}
.hero__veil{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(270deg,rgba(14,26,22,.92) 10%,rgba(14,26,22,.58) 52%,rgba(30,59,51,.78) 100%);
}
.hero__body{position:relative;z-index:2;text-align:right;max-width:640px}
.badge{
  display:inline-block;
  padding:6px 15px;border-radius:999px;
  background:var(--clay);color:#fff;
  font-size:14px;letter-spacing:.14em;
}
.hero h1{
  font-size:clamp(30px,4.4vw,56px);
  margin:20px 0 14px;
  color:var(--linen);
  text-wrap:balance;
}
.hero__desc{
  margin:0 0 24px;
  font-size:16px;
  color:rgba(232,220,200,.85);
}
.hero__cue{
  display:inline-flex;align-items:center;
  min-height:44px;padding:10px 20px;
  border-radius:999px;
  background:rgba(232,220,200,.15);
  color:var(--linen);
  font-size:15px;
  text-decoration:none;
  transition:background .25s ease;
}
.hero__cue:hover{background:rgba(232,220,200,.28)}

/* ---------- 正文与右栏 ---------- */
.cols{
  display:grid;
  grid-template-columns:minmax(0,1fr) 232px;
  gap:48px;
  max-width:1180px;
  margin:0 auto;
  padding:0 32px 72px;
}
.stream{min-width:0}
.stream div{
  padding:60px 0 44px;
  border-top:1px solid var(--rule);
  scroll-margin-top:24px;
}
.stream div:first-child{border-top:0;padding-top:56px}
.stream h2{font-size:clamp(21px,2.3vw,28px);margin:0 0 14px}
.stream h3{font-size:19px;margin:26px 0 10px}
.stream h2 span,.stream h3 span{display:inline-block;padding-bottom:4px;border-bottom:2px solid rgba(201,123,74,.45)}
.stream p{margin:0 0 15px}
.stream p,.stream li{max-width:68ch}
.stream ul,.stream ol{padding-left:22px;margin:0 0 18px}
.stream li{margin:0 0 8px}
.stream a{text-decoration:underline;text-decoration-color:var(--clay);text-underline-offset:3px}
.stream figure{margin:26px 0}
.stream figcaption{font-size:14px;color:#5B6A62;text-align:center}
.stream img{display:block;margin:0 auto;border-radius:10px}
.stream blockquote{
  margin:24px 0;padding:16px 20px;
  background:var(--linen);
  border-radius:10px;
  color:#2E3A34;
}
.stream time{display:inline-block;font-size:14px;letter-spacing:.04em;color:#6C7A72}
.stream table{width:100%;border-collapse:collapse;margin:20px 0;font-size:15px}
.stream th,.stream td{padding:10px 12px;border-bottom:1px solid var(--rule);text-align:left}

.side{
  position:sticky;top:28px;align-self:start;
  margin-top:56px;
  padding:22px 18px;
  background:var(--linen);
  border-radius:10px;
}
.side h2{font-size:17px;margin:0 0 12px;letter-spacing:.02em}
.side h2 span{display:block}
.side ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.side a{
  display:flex;align-items:center;
  min-height:40px;padding:8px 10px;
  font-size:15px;line-height:1.35;
  text-decoration:none;color:#3A4A42;
  border-left:2px solid transparent;
  border-radius:8px;
  transition:background .24s ease,border-color .24s ease;
}
.side a:hover,.side a:focus-visible{background:rgba(30,59,51,.09);border-left-color:var(--clay)}

/* ---------- 页脚 ---------- */
.foot{margin-top:24px;background:var(--ink-2);color:rgba(232,220,200,.8);padding-top:56px}
.foot__grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:32px;max-width:1000px;margin:0 auto;padding:0 28px;
}
.foot h2{font-size:16px;color:var(--linen);margin:0 0 14px;letter-spacing:.12em}
.foot h2 span{display:block}
.foot ul{list-style:none;margin:0;padding:0}
.foot li a{
  display:inline-flex;align-items:center;
  min-height:40px;padding:4px 0;
  font-size:15px;text-decoration:none;
  color:rgba(232,220,200,.76);
  transition:color .24s ease;
}
.foot li a:hover,.foot li a:focus-visible{color:#fff}
.foot__brand{font-family:'Lora',serif;font-size:18px;color:var(--linen);margin:0 0 6px}
.form{display:flex;flex-wrap:wrap;gap:8px}
.form input{
  flex:1 1 150px;min-height:44px;
  padding:10px 12px;border:0;border-radius:10px;
  background:rgba(232,220,200,.13);color:var(--linen);
  font:inherit;font-size:15px;
}
.form input::placeholder{color:rgba(232,220,200,.6)}
.form button{
  min-height:44px;padding:10px 20px;border:0;border-radius:10px;
  background:var(--clay);color:#fff;font:inherit;font-size:15px;cursor:pointer;
}
.form button:hover{background:#b76a3d}
.foot__base{
  margin-top:40px;padding:22px 24px;
  text-align:center;font-size:14px;
  border-top:1px solid rgba(232,220,200,.14);
}

/* ---------- 揭示动画 ---------- */
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .72s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}

/* ---------- 断点 ---------- */
@media (max-width:1080px){
  .cols{grid-template-columns:minmax(0,1fr);gap:0;padding-bottom:56px}
  .side{position:static;margin-top:0}
  .side ul{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}
}
@media (max-width:860px){
  body{padding-left:0}
  .rail{
    position:static;width:auto;
    flex-direction:row;flex-wrap:wrap;align-items:center;
    padding:6px 10px;
    box-shadow:0 2px 0 rgba(19,37,32,.3);
  }
  .mark{height:48px;width:48px;border-bottom:0}
  .rail-nav{flex:1 1 100%;order:3;padding:2px 0 6px}
  .rail-nav>ul{display:flex;flex-wrap:wrap;gap:2px}
  .rail-nav>ul>li.grp{display:contents}
  .sub{position:static;display:contents;opacity:1;visibility:visible;transform:none;background:none}
  .rail-nav a{justify-content:flex-start;text-align:left;border-radius:8px;padding:10px 12px}
  .rail-nav>ul>li>a{border-left:0}
  .hero{
    margin-left:0;
    min-height:calc(100svh - 172px);
    padding:48px 20px 52px 20px;
    align-items:flex-end;
  }
  .hero h1{font-size:clamp(26px,7.2vw,36px)}
  .hero__body{max-width:none}
  .hero__desc{font-size:16px}
  .cols{padding:0 18px 48px}
  .stream div{padding:44px 0 32px;scroll-margin-top:156px}
  .stream div:first-child{padding-top:40px}
  .foot__grid{grid-template-columns:1fr;gap:24px;padding:0 20px}
  .foot{padding-top:44px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none;transition:none}
  .hero__fig{will-change:auto}
  .rail-nav a,.side a,.foot li a,.hero__cue,.form button{transition:none}
}

button[aria-expanded]{min-width:44px;min-height:44px}