:root{
  --bg:#292A2F;
  --band:#313239;
  --deep:#212227;
  --card:#FBF7F1;
  --ink:#2C2D33;
  --ink2:#5F6068;
  --on:#F4F1EC;
  --on2:#BCBDC5;
  --on3:#8E8F98;
  --br:#FF7A1A;
  --br-d:#E05505;
  --br-l:#FFE3CE;
  --link:#C24A00;
  --sky:#4FA3FF;
  --line:rgba(255,255,255,.12);
  --r:16px;
  --w:1140px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--on);
  font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",Arial,sans-serif;
  font-size:16px;
  line-height:1.75;
}
figure,figcaption,blockquote,dl,dd,table,h1,h2,h3,h4,p,ul,ol{margin:0}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul,ol{padding:0;list-style:none}
.wrap{max-width:var(--w);margin:0 auto;padding:0 22px}

@keyframes wipe{
  from{opacity:0;clip-path:inset(0 100% 0 0)}
  to{opacity:1;clip-path:inset(0 0 0 0)}
}
.wipe{animation:wipe .5s cubic-bezier(.2,.7,.3,1) both}
.wipe.d1{animation-delay:.09s}
.wipe.d2{animation-delay:.18s}
@media (prefers-reduced-motion:reduce){
  .wipe{animation:none;opacity:1;clip-path:none}
}

.top{position:sticky;top:0;z-index:40;background:rgba(41,42,47,.95);border-bottom:1px solid var(--line)}
.top__in{display:flex;align-items:center;gap:14px;flex-wrap:wrap;max-width:var(--w);margin:0 auto;padding:9px 22px}
.brand{order:1;display:flex;align-items:center;gap:10px}
.brand img{width:42px;height:42px;border-radius:12px;box-shadow:0 0 0 1px rgba(255,255,255,.14)}
.brand__name{font-size:18px;font-weight:700;letter-spacing:.6px;color:#fff}
.nav{order:2;display:flex;flex-wrap:wrap;gap:4px;margin-left:auto}
.nav a{padding:7px 11px;border-radius:999px;font-size:13.5px;color:var(--on2);white-space:nowrap}
.nav a:hover{color:#fff;background:rgba(255,255,255,.08)}
.nav a[aria-current="page"]{color:#fff;background:rgba(255,122,26,.18);box-shadow:inset 0 0 0 1px rgba(255,122,26,.55)}
.top__dl{order:3}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 21px;border-radius:999px;border:0;cursor:pointer;white-space:nowrap;
  font-size:15px;font-weight:700;
  background:linear-gradient(135deg,#FF8A2B,#E05505);color:#fff;
}
.btn:hover{background:linear-gradient(135deg,#FF9C4A,#C74A03);color:#fff}
.btn--sm{padding:8px 15px;font-size:13.5px}
.btn--ghost{background:transparent;color:var(--on);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.38)}
.btn--ghost:hover{background:rgba(255,255,255,.1);color:#fff}

.hero{position:relative;overflow:hidden;padding:58px 0 64px}
.hero::before{content:"";position:absolute;left:-170px;bottom:-210px;width:580px;height:580px;border-radius:50%;background:radial-gradient(circle,rgba(255,122,26,.30),rgba(255,122,26,0) 68%);pointer-events:none}
.hero::after{content:"";position:absolute;right:-130px;top:-150px;width:440px;height:440px;border-radius:50%;background:radial-gradient(circle,rgba(79,163,255,.16),rgba(79,163,255,0) 70%);pointer-events:none}
.hero__in{position:relative;z-index:1;display:grid;grid-template-columns:1.14fr .86fr;gap:42px;align-items:center;max-width:var(--w);margin:0 auto;padding:0 22px}
.hero h1{margin-bottom:16px;font-size:40px;line-height:1.24;letter-spacing:.5px;color:#fff}
.hero__lead{margin-bottom:24px;max-width:580px;font-size:16.5px;line-height:1.85;color:var(--on2)}
.hero__act{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.hero__meta{margin-top:16px;font-size:13px;color:var(--on3)}
.hero__shot{max-width:300px;margin:0 auto}
.hero__shot img{width:100%;height:auto;border-radius:22px;box-shadow:0 0 0 6px rgba(251,247,241,.92),0 18px 40px rgba(0,0,0,.35)}

.facts{background:var(--band);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.facts__in{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:var(--w);margin:0 auto;padding:24px 22px}
.fact b{display:block;font-size:27px;line-height:1.3;color:#fff}
.fact span{font-size:13.5px;color:var(--on3)}

.sec{padding:58px 0 64px}
.sec--band{background:var(--band)}
.sec__hd{margin-bottom:26px}
h2{margin-bottom:12px;font-size:26px;line-height:1.4;letter-spacing:.3px;color:#fff}
h2::after{content:"";display:block;width:46px;height:4px;margin-top:11px;border-radius:2px;background:linear-gradient(90deg,var(--br),var(--br-d))}
.sub{max-width:760px;color:var(--on2);font-size:15px;line-height:1.8}

.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{position:relative;background:var(--card);color:var(--ink);border-radius:var(--r);padding:25px 22px 24px;overflow:hidden}
.card::before{content:"";position:absolute;top:0;left:0;width:38%;height:4px;background:linear-gradient(90deg,var(--br),rgba(255,122,26,0))}
.card::after{content:"";position:absolute;right:16px;bottom:14px;width:7px;height:7px;border-radius:50%;background:var(--sky)}
.card h3{margin-bottom:9px;font-size:17.5px;color:var(--ink)}
.card p{font-size:14.5px;line-height:1.85;color:var(--ink2)}
.card p+p{margin-top:9px}
.card a{color:var(--link);text-decoration:underline;text-underline-offset:3px}

.shots__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.shots__grid img{width:100%;height:auto;border-radius:14px;box-shadow:0 0 0 4px rgba(251,247,241,.9)}
.shots__grid figcaption{margin-top:10px;font-size:12.5px;line-height:1.65;color:var(--on3)}

.entry{position:relative;display:block;background:var(--card);color:var(--ink);border-radius:var(--r);padding:23px 22px 22px;overflow:hidden}
.entry::before{content:"";position:absolute;top:0;left:0;width:38%;height:4px;background:linear-gradient(90deg,var(--br),rgba(255,122,26,0))}
.entry__k{display:block;margin-bottom:6px;font-size:12px;font-weight:700;letter-spacing:1.2px;color:#B25A18}
.entry h3{margin-bottom:8px;font-size:17.5px;color:var(--ink)}
.entry p{font-size:14.5px;line-height:1.8;color:var(--ink2)}
.entry__more{display:inline-block;margin-top:12px;font-size:14px;font-weight:700;color:var(--link)}
.entry:hover{background:#fff}

.rev{background:var(--card);color:var(--ink);border-radius:var(--r);padding:22px}
.rev__hd{display:flex;align-items:center;gap:11px;margin-bottom:11px}
.rev__av{flex:0 0 38px;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;color:#fff;background:linear-gradient(135deg,#FF8A2B,#E05505)}
.rev__nm{font-size:14.5px;font-weight:700}
.rev__st{display:block;font-size:12.5px;color:var(--br-d)}
.rev p{font-size:14.5px;line-height:1.85;color:var(--ink2)}

.faq__list{display:grid;gap:12px;max-width:900px}
details{background:var(--card);color:var(--ink);border-radius:14px;padding:16px 19px}
summary{cursor:pointer;font-size:15.5px;font-weight:700;list-style:none}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";float:right;font-weight:700;color:var(--br-d)}
details[open] summary::after{content:"-"}
details p{margin-top:10px;font-size:14.5px;line-height:1.85;color:var(--ink2)}
details a{color:var(--link);text-decoration:underline;text-underline-offset:3px}

.cta{padding:50px 0;background:linear-gradient(135deg,#FF8A2B,#DC5203)}
.cta__in{display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between;max-width:var(--w);margin:0 auto;padding:0 22px}
.cta h2{margin-bottom:0;font-size:24px;color:#2A1500}
.cta h2::after{display:none}
.cta__note{margin-top:7px;font-size:14.5px;color:#3B2100}
.cta .btn{background:#26272C;color:#fff}
.cta .btn:hover{background:#15161A;color:#fff}
.cta .btn--ghost{background:transparent;color:#2A1500;box-shadow:inset 0 0 0 1.5px rgba(42,21,0,.5)}
.cta .btn--ghost:hover{background:rgba(42,21,0,.1);color:#2A1500}

.foot{background:var(--deep);border-top:1px solid var(--line);padding:48px 0 26px}
.foot__in{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:28px;max-width:var(--w);margin:0 auto;padding:0 22px}
.foot h4{margin-bottom:11px;font-size:14px;letter-spacing:.6px;color:#fff}
.foot p{margin-bottom:9px;font-size:13.5px;line-height:1.85;color:var(--on3)}
.foot li{margin-bottom:7px}
.foot a{display:block;padding:2px 0;font-size:13.5px;color:var(--on3)}
.foot a:hover{color:var(--br)}
.foot .btn{display:inline-flex;padding:9px 16px;background:linear-gradient(135deg,#FF8A2B,#E05505);color:#fff}
.foot .btn:hover{color:#fff}
.foot__btm{max-width:var(--w);margin:24px auto 0;padding:16px 22px 0;border-top:1px solid var(--line);font-size:12.5px;line-height:1.85;color:var(--on3)}
.disc{margin-bottom:6px}

.page-hero{background:var(--band);border-bottom:1px solid var(--line);padding:46px 0 38px}
.crumb{margin-bottom:14px;font-size:12.5px;color:var(--on3)}
.crumb a{color:var(--sky)}
.page-hero h1{margin-bottom:14px;font-size:33px;line-height:1.3;color:#fff}
.page-hero__lead{max-width:840px;font-size:16px;line-height:1.85;color:var(--on2)}

.prose p{margin-bottom:16px;font-size:15.5px;line-height:1.9;color:var(--on2)}
.prose h3{margin:28px 0 10px;font-size:18px;color:#fff}
.prose ul{margin-bottom:16px}
.prose ul li{position:relative;padding-left:18px;margin-bottom:7px;font-size:15.5px;line-height:1.9;color:var(--on2)}
.prose ul li::before{content:"";position:absolute;left:2px;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--sky)}
.prose a{color:var(--br);text-decoration:underline;text-underline-offset:3px}
.prose strong{color:#fff}
.prose h3+p{margin-top:0}
.note{margin-bottom:18px;padding:16px 19px;border-left:3px solid var(--br);border-radius:0 12px 12px 0;background:rgba(255,122,26,.09);font-size:14.5px;line-height:1.85;color:var(--on2)}

.steps{counter-reset:s;display:grid;gap:13px;margin-bottom:18px}
.steps li{position:relative;list-style:none;padding:16px 18px 16px 60px;background:var(--card);color:var(--ink2);border-radius:14px;font-size:14.5px;line-height:1.85}
.steps li::before{counter-increment:s;content:counter(s);position:absolute;left:17px;top:15px;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;background:linear-gradient(135deg,#FF8A2B,#E05505)}
.steps b{color:var(--ink)}

.tbl{width:100%;border-collapse:collapse;margin-bottom:18px;font-size:14.5px}
.tbl th,.tbl td{padding:11px 13px;border:1px solid var(--line);text-align:left;color:var(--on2);vertical-align:top}
.tbl th{background:rgba(255,255,255,.05);color:#fff}
.tbl a{color:var(--br);text-decoration:underline;text-underline-offset:3px}

.fig-wide{max-width:400px;margin:26px auto}
.fig-wide img{width:100%;height:auto;border-radius:18px;box-shadow:0 0 0 5px rgba(251,247,241,.9)}
.fig-wide figcaption{margin-top:11px;text-align:center;font-size:12.5px;line-height:1.7;color:var(--on3)}

@media (max-width:980px){
  .hero__in{grid-template-columns:1fr;gap:30px}
  .hero h1{font-size:33px}
  .hero__shot{max-width:280px}
  .facts__in{grid-template-columns:repeat(2,1fr)}
  .grid3{grid-template-columns:repeat(2,1fr)}
  .shots__grid{grid-template-columns:repeat(2,1fr)}
  .foot__in{grid-template-columns:1fr 1fr}
}

@media (max-width:620px){
  .top__in{row-gap:8px;padding:9px 22px}
  .brand{order:1}
  .top__dl{order:2;margin-left:auto}
  .nav{order:3;flex:1 0 100%;flex-wrap:nowrap;overflow-x:auto;gap:6px;margin-left:0;padding-bottom:3px}
  .nav a{font-size:12px;padding:5px 6px}
  .hero{padding:36px 0 46px}
  .hero h1{font-size:26px}
  .hero__lead{font-size:15.5px}
  .hero__shot{max-width:250px}
  .facts__in{grid-template-columns:repeat(2,1fr);gap:14px;padding:20px 22px}
  .fact b{font-size:22px}
  .sec{padding:40px 0 46px}
  h2{font-size:21px}
  .page-hero{padding:34px 0 30px}
  .page-hero h1{font-size:25px}
  .page-hero__lead{font-size:15px}
  .grid2,.grid3{grid-template-columns:1fr}
  .shots__grid{grid-template-columns:repeat(2,1fr)}
  .cta{padding:38px 0}
  .cta h2{font-size:20px}
  .foot__in{grid-template-columns:1fr}
}
