:root{
  --bg:#F5F7EC;
  --bg2:#EAEFDA;
  --moss:#26331C;
  --moss2:#3E5127;
  --main:#7AA33A;
  --main-d:#5F842A;
  --main-l:#DCE8C4;
  --accent:#DC6435;
  --hl:#F2B705;
  --ink:#2A2E24;
  --ink2:#5C6350;
  --line:#CFD8B8;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",Arial,sans-serif;
  font-size:16px;
  line-height:1.75;
  color:var(--ink);
  background:var(--bg);
}
img{max-width:100%;height:auto;display:block;border:0}
h1,h2,h3,p,ul,ol,dl,dd,dt,figure,figcaption,blockquote,table,th,td{margin:0;padding:0}
ul,ol{list-style:none}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1120px;margin:0 auto;padding-left:22px;padding-right:22px}
.sec{padding-top:64px;padding-bottom:64px}
.sec--alt{background:var(--bg2)}
.sec__h{position:relative;display:inline-block;z-index:0;font-size:27px;line-height:1.4;font-weight:700;color:var(--moss)}
.sec__h::before{content:"";position:absolute;left:-6px;right:-6px;bottom:3px;height:11px;background:rgba(122,163,60,.34);z-index:-1}
.sec__p{margin-top:10px;font-size:15.5px;color:var(--ink2);max-width:52em}

.top{position:sticky;top:0;z-index:30;background:#fff;border-bottom:3px solid var(--moss)}
.top__in{display:flex;align-items:center;gap:14px;padding-top:10px;padding-bottom:10px}
.brand{display:flex;align-items:center;gap:9px;flex:none;color:var(--moss)}
.brand:hover{text-decoration:none}
.brand__logo{width:40px;height:40px;border-radius:8px}
.brand__name{display:flex;flex-direction:column;font-size:19px;font-weight:700;line-height:1.2}
.brand__sub{font-size:11px;font-weight:400;letter-spacing:.6px;color:var(--ink2)}
.nav{display:flex;flex-wrap:nowrap;align-items:center;gap:4px;margin-left:auto}
.nav__link{padding:8px 11px;border-radius:4px;font-size:15px;color:var(--ink);white-space:nowrap}
.nav__link:hover{background:var(--bg2);text-decoration:none}
.nav__link[aria-current="page"]{background:var(--moss);color:#fff}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:9px 16px;border:2px solid transparent;border-radius:4px;
  font-size:15px;font-weight:700;line-height:1.2;white-space:nowrap;
}
.btn:hover{text-decoration:none}
.btn--dl{background:var(--main);color:#fff;border-color:var(--moss);box-shadow:3px 3px 0 rgba(38,51,28,.22)}
.btn--dl:hover{background:var(--main-d)}
.btn--big{padding:13px 24px;font-size:17px}
.btn--ghost{background:#fff;color:var(--moss);border-color:var(--moss)}
.btn--ghost:hover{background:var(--bg2)}

.hero{position:relative;padding-top:56px;padding-bottom:60px;border-bottom:2px dashed var(--line);background:var(--bg)}
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(45deg,rgba(122,163,60,.10) 0 10px,rgba(122,163,60,0) 10px 26px);
}
.hero__in{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:46px;align-items:center}
.hero__in>*{min-width:0}
.hero__kick{
  display:inline-block;padding:5px 12px;border:2px solid var(--moss);border-radius:3px;
  background:var(--hl);color:var(--moss);font-size:13px;font-weight:700;
}
h1{font-size:40px;line-height:1.24;font-weight:700;color:var(--moss);margin-top:14px}
.hero__lead{margin-top:16px;font-size:16.5px;color:var(--ink);max-width:44em}
.hero__acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.hero__note{margin-top:18px;padding-left:12px;border-left:4px solid var(--main);font-size:14px;color:var(--ink2)}
.hero__shot{margin:0}
.hero__shot img{width:100%;max-width:320px;height:auto;margin:0 auto;border-radius:6px;box-shadow:0 0 0 6px #fff,0 0 0 8px var(--moss)}
.hero__shot figcaption{margin-top:16px;font-size:13px;color:var(--ink2);text-align:center}

.strip{padding-top:4px;padding-bottom:4px;background:#fff;border-bottom:2px dashed var(--line)}
.chips{display:flex;flex-wrap:wrap;gap:10px;padding-top:16px;padding-bottom:16px}
.chip{display:inline-flex;align-items:baseline;gap:7px;padding:6px 13px;border:2px solid var(--moss);border-radius:4px;background:var(--bg2)}
.chip__n{font-size:17px;font-weight:700;color:var(--main-d)}
.chip__l{font-size:13px;color:var(--ink2)}

.grid{display:grid;gap:20px;margin-top:30px}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.card{position:relative;min-width:0;padding:24px 20px 20px;border:2px solid var(--moss);border-radius:5px;background:#fff}
.card__tape{
  position:absolute;top:-9px;left:50%;width:74px;height:18px;
  transform:translateX(-50%);background:var(--hl);opacity:.95;
  clip-path:polygon(8% 0,92% 0,100% 100%,0 100%);
}
.card__n{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;margin-bottom:12px;border-radius:50%;background:var(--moss);color:var(--hl);font-size:14px;font-weight:700}
.card__t{margin-bottom:8px;font-size:18px;font-weight:700;color:var(--moss)}
.card__d{font-size:15px;color:var(--ink2)}

.shots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;margin-top:30px}
.shot{min-width:0;margin:0}
.shot img{width:100%;max-width:340px;height:auto;margin:0 auto;border-radius:5px;box-shadow:0 0 0 5px #fff,0 0 0 7px var(--line)}
.shot figcaption{margin-top:14px;font-size:13.5px;color:var(--ink2);text-align:center}
.shot--down{margin-top:46px}
.shot--wide{max-width:380px;margin:34px auto 0}
.shot--wide img{max-width:100%}

.deep{display:block;min-width:0;padding:24px 20px 20px;border:2px solid var(--moss);border-radius:5px;background:#fff;color:inherit}
.deep:hover{background:var(--bg2);text-decoration:none}
.deep__n{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;margin-bottom:12px;border-radius:50%;background:var(--main);color:#fff;font-size:14px;font-weight:700}
.deep__h{margin-bottom:8px;font-size:17.5px;font-weight:700;color:var(--moss)}
.deep__p{margin-bottom:14px;font-size:14.5px;color:var(--ink2)}
.deep__go{font-size:14px;font-weight:700;color:var(--accent)}

.revs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:30px}
.rev{min-width:0;margin:0;padding:20px 18px;border:2px solid var(--moss);border-left:8px solid var(--accent);border-radius:5px;background:#fff}
.rev--wide{grid-column:span 2}
.rev__q{font-size:15px;color:var(--ink)}
.rev__by{margin-top:14px;font-size:13.5px;color:var(--ink2)}
.stars{margin-right:6px;color:var(--hl);letter-spacing:2px}

.faq{display:grid;gap:12px;margin-top:26px}
.faq details{padding:0 18px;border:2px solid var(--moss);border-radius:5px;background:#fff}
.faq summary{position:relative;padding:15px 28px 15px 0;font-size:16px;font-weight:700;color:var(--moss);cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"＋";position:absolute;right:0;top:13px;color:var(--main-d);font-weight:700}
.faq details[open] summary::after{content:"－"}
.faq details p{margin-top:0;padding-bottom:16px;font-size:15px;color:var(--ink2)}
.more{margin-top:20px;font-size:15px}

.page-hero{padding-top:46px;padding-bottom:44px;border-bottom:2px dashed var(--line);background:linear-gradient(150deg,#EFF3E0,#F6F9ED 60%,#E9F0DA)}
.page-hero__lead{margin-top:16px;font-size:16px;color:var(--ink2);max-width:56em}
.prose{max-width:900px;margin-left:auto;margin-right:auto}
.prose p{margin-top:16px;font-size:15.5px;color:var(--ink2)}
.prose h2{position:relative;margin-top:46px;margin-bottom:16px;padding-left:16px;font-size:25px;font-weight:700;color:var(--moss)}
.prose h2::before{content:"";position:absolute;left:0;top:.2em;bottom:.2em;width:7px;background:var(--main)}
.prose>h2:first-child{margin-top:0}
.prose b{color:var(--moss)}
.prose .tbl-note{margin-top:10px;font-size:13.5px;color:var(--ink2)}
.tbl-scroll{margin-top:22px;overflow-x:auto}
.tbl{width:100%;min-width:560px;border-collapse:collapse;border:2px solid var(--moss);background:#fff;font-size:14.5px}
.tbl th{padding:11px 14px;background:var(--moss);color:#fff;font-size:14px;font-weight:700;text-align:left}
.tbl td{padding:11px 14px;border-top:1px solid var(--line);color:var(--ink2);vertical-align:top}
.tbl-note{margin-top:10px;font-size:13.5px;color:var(--ink2)}
.steps{counter-reset:st;display:grid;gap:14px;margin-top:22px}
.steps>li{position:relative;counter-increment:st;min-width:0;padding:16px 18px 16px 62px;border:2px solid var(--moss);border-radius:5px;background:#fff;font-size:15px;color:var(--ink2)}
.steps>li::before{
  content:counter(st,decimal-leading-zero);position:absolute;left:16px;top:15px;
  display:flex;align-items:center;justify-content:center;width:30px;height:30px;
  border-radius:50%;background:var(--main);color:#fff;font-size:13px;font-weight:700;
}
.steps b{display:block;margin-bottom:4px;font-size:16px;color:var(--moss)}
.ticks{display:grid;gap:12px;margin-top:20px}
.ticks li{position:relative;padding-left:24px;font-size:15px;color:var(--ink2)}
.ticks li::before{content:"";position:absolute;left:2px;top:.55em;width:9px;height:9px;background:var(--main);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.ticks b{color:var(--moss)}

.cta{padding-top:52px;padding-bottom:56px;background:linear-gradient(135deg,#26331C,#3E5127)}
.cta__in{text-align:center}
.cta__h{font-size:26px;font-weight:700;color:#fff}
.cta__p{margin:12px auto 0;max-width:44em;font-size:15.5px;color:var(--main-l)}
.cta .btn{margin-top:24px;color:#fff}
.cta .btn--dl{background:var(--hl);color:var(--moss);border-color:#E7C55A;box-shadow:3px 3px 0 rgba(0,0,0,.25)}
.cta .btn--dl:hover{background:#E0A800;color:var(--moss)}

.foot{padding-top:48px;padding-bottom:28px;background:#1B2414;color:#C9D3B4}
.foot__in{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr);gap:28px}
.foot__brand{display:grid;grid-template-columns:36px minmax(0,1fr);gap:6px 12px;align-items:start;min-width:0}
.foot__brand img{grid-row:span 2;width:36px;height:36px;border-radius:7px}
.foot__name{font-size:17px;font-weight:700;color:#fff}
.foot__note{font-size:13.5px;line-height:1.7;color:#A9B694}
.foot__col{display:flex;flex-direction:column;gap:8px;min-width:0}
.foot__h{margin-bottom:2px;font-size:13px;font-weight:700;letter-spacing:.5px;color:#8B9A76}
.foot__col a{font-size:14.5px;color:#C9D3B4}
.foot__col a:hover{color:var(--hl)}
.foot .btn--dl{display:inline-flex;align-self:flex-start;padding:9px 16px;border:2px solid #E7C55A;background:var(--hl);color:var(--moss);font-weight:700;box-shadow:none}
.foot .btn--dl:hover{background:#E0A800;color:var(--moss)}
.foot__disc{margin-top:34px;padding-top:18px;border-top:1px solid #33421F;font-size:13.5px;color:#A9B694}
.foot__copy{margin-top:8px;font-size:13px;color:#8B9A76}

@keyframes stampin{
  from{opacity:0;transform:translateY(14px) scale(.95)}
  to{opacity:1;transform:none}
}
.stamp{animation:stampin .5s cubic-bezier(.2,.75,.3,1) both}
.stamp--d1{animation-delay:.1s}
.stamp--d2{animation-delay:.2s}

@media (max-width:980px){
  h1{font-size:33px}
  .hero__in{grid-template-columns:minmax(0,1fr);gap:36px}
  .hero__shot img{max-width:300px}
  .grid--2,.grid--3,.revs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rev--wide{grid-column:span 2}
  .shot--down{margin-top:0}
  .foot__in{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:620px){
  .top__in{flex-wrap:wrap;row-gap:8px}
  .brand{order:1}
  .top .btn--dl{order:2;margin-left:auto}
  .nav{order:3;flex:1 0 100%;flex-wrap:nowrap;margin-left:0;overflow-x:auto;padding-bottom:2px}
  .nav__link{padding:7px 9px;font-size:14px}
  .brand__sub{display:none}
  h1{font-size:27px}
  .hero{padding-top:34px;padding-bottom:38px}
  .sec{padding-top:44px;padding-bottom:44px}
  .sec__h{font-size:22px}
  .grid--2,.grid--3,.revs,.shots{grid-template-columns:minmax(0,1fr)}
  .rev--wide{grid-column:span 1}
  .hero__shot img{max-width:262px}
  .shot img{max-width:300px}
  .prose h2{font-size:21px}
  .steps>li{padding-left:54px}
  .foot__in{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){
  .stamp,.stamp--d1,.stamp--d2{animation:none;opacity:1;transform:none}
}
