:root{
  --bg:#F5F0E6;
  --paper:#FFFFFF;
  --ink:#241B16;
  --ink2:#3A2C24;
  --red:#8E2B33;
  --red2:#B8454A;
  --blue:#3F7FA6;
  --blue2:#5FA3C4;
  --mustard:#D8A72C;
  --line:#D9CFBE;
  --muted:#6E6055;
  --wrap:1120px;
}

*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth}

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",Arial,sans-serif;
  font-size:16px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;height:auto;display:block}
figure,figcaption,blockquote,dl,dd,table{margin:0}
h1,h2,h3,h4,p,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
a{color:var(--red);text-decoration:none}
a:hover{color:var(--red2)}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding-left:22px;padding-right:22px}

@keyframes fadeSlide{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:none}}
@keyframes stampIn{from{opacity:0;transform:scale(.94) rotate(-1.6deg)}to{opacity:1;transform:none}}
.anim{animation:fadeSlide .55s cubic-bezier(.2,.7,.3,1) both}
.anim.d1{animation-delay:.07s}
.anim.d2{animation-delay:.14s}
.stamp{animation:stampIn .5s cubic-bezier(.2,.8,.3,1) both}
.stamp.d1{animation-delay:.1s}
.stamp.d2{animation-delay:.2s}
@media (prefers-reduced-motion:reduce){
  .anim,.stamp{animation:none;opacity:1;transform:none}
}

.top{background:var(--paper);border-bottom:2px solid var(--ink)}
.top__in{display:flex;align-items:center;gap:18px;padding-top:14px;padding-bottom:14px;flex-wrap:nowrap}
.brand{display:inline-flex;align-items:center;gap:10px;flex:0 0 auto;order:1}
.brand__logo{width:40px;height:40px}
.brand__name{font-size:21px;font-weight:700;letter-spacing:.5px;color:var(--ink)}
.nav{display:flex;align-items:center;gap:4px;margin-left:auto;order:2}
.nav a{
  display:block;padding:7px 12px;font-size:15px;color:var(--ink2);
  border-bottom:2px solid transparent;white-space:nowrap;
}
.nav a:hover{color:var(--red);border-bottom-color:var(--red)}
.nav a[aria-current="page"]{color:var(--red);font-weight:700;border-bottom-color:var(--red)}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:10px 22px;font-size:15px;font-weight:700;white-space:nowrap;
  background:linear-gradient(135deg,var(--red),var(--red2));
  color:#fff;border:1.5px solid var(--ink);cursor:pointer;
}
.btn.btn-primary{color:#fff;background:linear-gradient(135deg,var(--red),var(--red2))}
.btn.btn-primary:hover{color:#fff;background:linear-gradient(135deg,var(--red2),var(--red))}
.btn.btn-ghost{color:var(--ink);background:transparent}
.btn.btn-ghost:hover{color:var(--red);background:transparent}
.top__cta{order:3;flex:0 0 auto;margin-left:6px}

.hero{background:var(--ink);color:#F3EDE4;clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - 44px));padding-top:58px;padding-bottom:112px;position:relative}
.hero__in{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:44px;align-items:center}
.hero__kicker{display:inline-block;font-size:13px;letter-spacing:2px;color:var(--mustard);border-bottom:1px solid rgba(216,167,44,.5);padding-bottom:3px}
.hero h1{font-size:40px;line-height:1.25;margin-top:16px;color:#fff;font-weight:700}
.hero__lead{margin-top:18px;font-size:16px;color:#D8CDBE;max-width:560px}
.hero__meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.hero__meta span{font-size:13px;color:#EADFCE;border:1px solid rgba(234,223,206,.45);padding:4px 10px}
.hero__act{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:28px}
.hero__shot{text-align:center}
.hero__shot img{width:100%;max-width:300px;height:auto;margin:0 auto;box-shadow:0 0 0 6px #fff,0 20px 44px rgba(0,0,0,.42)}

.chapters{background:var(--paper);border-bottom:1.5px solid var(--ink)}
.chapters__in{display:flex;flex-wrap:wrap;gap:8px;padding-top:14px;padding-bottom:14px;justify-content:center}
.chapters a{font-size:14px;color:var(--ink2);border:1.5px solid var(--line);padding:6px 14px}
.chapters a:hover{color:var(--red);border-color:var(--red)}

.sec{padding-top:62px;padding-bottom:62px}
.sec.alt{background:var(--paper);border-top:1.5px solid var(--line);border-bottom:1.5px solid var(--line)}
.sec__h{position:relative;font-size:27px;line-height:1.35;padding-left:32px;font-weight:700}
.sec__h::before{
  content:"";position:absolute;left:0;top:8px;width:17px;height:17px;
  transform:rotate(45deg);background:linear-gradient(135deg,var(--red) 0 50%,var(--blue) 50% 100%);
}
.sec__sub{margin-top:10px;padding-left:32px;font-size:15px;color:var(--muted)}
.sec__body{margin-top:30px}

.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.stats>*{min-width:0}
.stat{background:var(--paper);border:1.5px solid var(--ink);padding:20px 18px}
.stat__n{font-size:29px;font-weight:700;color:var(--blue);line-height:1.2}
.stat__l{margin-top:6px;font-size:14px;color:var(--muted)}

.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.cards>*{min-width:0}
.fcard{position:relative;background:var(--paper);border:1.5px solid var(--ink);padding:24px 22px 22px}
.fcard::before{content:"";position:absolute;left:0;top:0;width:9px;height:9px;background:var(--red)}
.fcard h3{font-size:18px;font-weight:700;margin-top:10px}
.fcard p{margin-top:9px;font-size:15px;color:var(--ink2)}
.fcard a{display:inline-block;margin-top:14px;font-size:14px;font-weight:700;border-bottom:1.5px solid var(--red)}

.shots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.shots>*{min-width:0}
.shot{background:var(--paper);border:1.5px solid var(--ink);padding:14px}
.shot img{width:100%;height:auto;box-shadow:0 0 0 4px #fff,0 8px 20px rgba(36,27,22,.14)}
.shot figcaption{margin-top:12px;font-size:14px;color:var(--muted);text-align:center;line-height:1.6}

.entries{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.entries>*{min-width:0}
.entry{background:var(--paper);border:1.5px solid var(--ink);padding:24px;display:flex;flex-direction:column}
.entry h3{font-size:19px;font-weight:700}
.entry p{margin-top:10px;font-size:15px;color:var(--ink2);flex:1 1 auto}
.entry a{margin-top:16px;font-size:14px;font-weight:700;border-bottom:1.5px solid var(--blue);align-self:flex-start;color:var(--blue)}
.entry a:hover{color:var(--red);border-bottom-color:var(--red)}

.quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.quotes>*{min-width:0}
.quote{background:var(--paper);border:1.5px solid var(--ink);border-left:6px solid var(--mustard);padding:22px}
.quote p{font-size:15px;color:var(--ink2)}
.quote footer{margin-top:14px;font-size:13px;color:var(--muted)}

.faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 20px}
.faq>*{min-width:0}
.qa{background:var(--paper);border:1.5px solid var(--ink);padding:16px 18px}
.qa summary{cursor:pointer;font-size:16px;font-weight:700;list-style:none}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";float:right;color:var(--red);font-weight:700}
.qa[open] summary::after{content:"–"}
.qa p{margin-top:10px;font-size:15px;color:var(--ink2)}

.cta{background:var(--ink2);color:#F3EDE4;padding-top:56px;padding-bottom:56px}
.cta__in{display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between}
.cta h2{font-size:26px;color:#fff;font-weight:700}
.cta__sub{margin-top:8px;font-size:15px;color:#D3C6B6}
.cta .btn{border-color:var(--mustard)}
.cta .btn.btn-primary{color:#241B16;background:linear-gradient(135deg,var(--mustard),#E9C468)}
.cta .btn.btn-primary:hover{color:#241B16;background:linear-gradient(135deg,#E9C468,var(--mustard))}
.cta .btn.btn-ghost{color:#F3EDE4;background:transparent}
.cta .btn.btn-ghost:hover{color:var(--mustard);background:transparent}

.foot{background:var(--paper);border-top:2px solid var(--ink);padding-top:52px;padding-bottom:34px}
.foot__in{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:32px}
.foot__in>*{min-width:0}
.foot__brand p{margin-top:12px;font-size:14px;color:var(--muted);max-width:420px}
.foot h3{font-size:15px;font-weight:700;color:var(--ink)}
.foot ul{margin-top:12px}
.foot li{margin-bottom:8px}
.foot a{font-size:14px;color:var(--ink2)}
.foot a:hover{color:var(--red)}
.foot__legal{margin-top:36px;padding-top:22px;border-top:1.5px solid var(--line);font-size:13px;color:var(--muted)}
.foot__legal p{margin-bottom:8px}

.page-hero{background:var(--ink);color:#F3EDE4;padding-top:46px;padding-bottom:52px;clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - 34px))}
.page-hero h1{font-size:32px;line-height:1.3;color:#fff;font-weight:700}
.page-hero .lead{margin-top:16px;font-size:16px;color:#D8CDBE;max-width:820px}

.lead{font-size:17px;color:var(--ink2);line-height:1.8}

.narrow{max-width:820px}
.prose{margin-top:26px;font-size:16px;color:var(--ink2)}
.prose h2{font-size:23px;font-weight:700;color:var(--ink);margin-top:38px;padding-left:30px;position:relative}
.prose h2::before{content:"";position:absolute;left:0;top:6px;width:15px;height:15px;transform:rotate(45deg);background:linear-gradient(135deg,var(--blue) 0 50%,var(--mustard) 50% 100%)}
.prose h3{font-size:18px;font-weight:700;color:var(--ink);margin-top:26px}
.prose p{margin-top:14px}
.prose ul{margin-top:14px}
.prose li{position:relative;padding-left:20px;margin-top:9px}
.prose li::before{content:"";position:absolute;left:2px;top:11px;width:8px;height:8px;background:var(--red)}
.prose figure{margin-top:26px;background:var(--paper);border:1.5px solid var(--ink);padding:14px}
.prose figure img{width:100%;max-width:340px;height:auto;margin:0 auto;box-shadow:0 0 0 4px #fff,0 8px 20px rgba(36,27,22,.14)}
.prose figcaption{margin-top:12px;font-size:14px;color:var(--muted);text-align:center;line-height:1.6}

.steps{counter-reset:st;margin-top:22px}
.steps li{counter-increment:st;position:relative;padding-left:52px;margin-top:18px;font-size:16px;color:var(--ink2)}
.steps li::before{
  content:counter(st,decimal-leading-zero);position:absolute;left:0;top:1px;
  width:34px;height:34px;line-height:34px;text-align:center;font-size:14px;font-weight:700;
  color:#fff;background:var(--blue);transform:rotate(0deg);
}
.steps li b{color:var(--ink)}

.tblwrap{margin-top:22px;overflow-x:auto}
table{border-collapse:collapse;width:100%;min-width:520px;background:var(--paper);border:1.5px solid var(--ink)}
th,td{border:1px solid var(--line);padding:11px 14px;font-size:15px;text-align:left;vertical-align:top}
th{background:#EFE7D9;color:var(--ink);font-weight:700}

.rel{margin-top:44px;background:var(--paper);border:1.5px solid var(--ink);padding:24px}
.rel h2{font-size:19px;font-weight:700;color:var(--ink)}
.rel ul{margin-top:14px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.rel li{min-width:0;border-left:4px solid var(--mustard);padding-left:12px}
.rel a{font-size:15px;font-weight:700;color:var(--blue)}
.rel a:hover{color:var(--red)}
.rel span{display:block;margin-top:4px;font-size:13px;color:var(--muted)}

.note{margin-top:20px;background:#EFE7D9;border-left:6px solid var(--mustard);padding:16px 18px;font-size:15px;color:var(--ink2)}

@media (max-width:980px){
  .hero__in{grid-template-columns:1fr;gap:34px}
  .hero{padding-top:48px;padding-bottom:92px}
  .hero h1{font-size:33px}
  .cards,.shots,.quotes,.stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stats{gap:14px}
  .foot__in{grid-template-columns:1fr 1fr}
  .foot__brand{grid-column:1 / -1}
  .rel ul{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:620px){
  .top__in{flex-wrap:wrap;gap:10px;padding-top:12px}
  .brand{order:1}
  .top__cta{order:2;margin-left:auto}
  .nav{order:3;flex:1 0 100%;flex-wrap:wrap;justify-content:center;margin-left:0;gap:2px}
  .nav a{padding:6px 9px;font-size:14px}
  .hero h1{font-size:28px}
  .hero__lead{font-size:15px}
  .hero__shot img{max-width:260px}
  .sec{padding-top:46px;padding-bottom:46px}
  .sec__h{font-size:22px;padding-left:28px}
  .sec__h::before{width:14px;height:14px;top:6px}
  .sec__sub{padding-left:28px}
  .cards,.shots,.quotes,.stats,.entries,.faq,.foot__in,.rel ul{grid-template-columns:1fr}
  .page-hero h1{font-size:25px}
  .prose h2{font-size:20px}
  .cta__in{flex-direction:column;align-items:flex-start}
  .prose figure img{max-width:100%}
  table{min-width:480px}
}
