@charset "UTF-8";

/*作者：搭客佬*/
/*官网：https://www.jm4pro.cn/*/

:root { --paper:#fffdfa; --ink:#202020; --orange:#ff7600; --line:#ded9d2; --muted:#756f68; --dark:#202020; --radius:5px; --content:1180px; --header:72px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body,h1,h2,h3,p,figure,ul,ol { margin:0; }
body { min-width:320px; padding-top:var(--header); overflow-x:hidden; background:var(--paper); color:var(--ink); font-family:"Microsoft YaHei","PingFang SC",sans-serif; }
a,button { -webkit-tap-highlight-color:transparent; }
a { color:inherit; text-decoration:none; }
button { border:0; cursor:pointer; font:inherit; }
img { display:block; max-width:100%; }
ul,ol { padding:0; list-style:none; }
.page-width,.nav-shell { width:min(calc(100% - 48px),var(--content)); margin:0 auto; }
.icon { display:inline-grid; place-items:center; line-height:1; }
.icon::before { display:block; width:1em; height:1em; content:""; background:center / contain no-repeat; }
.icon-download::before { background-image:url("../icons/download.svg"); }.icon-menu::before { background-image:url("../icons/menu.svg"); }.icon-book::before { background-image:url("../icons/book.svg"); }.icon-route::before { background-image:url("../icons/route.svg"); }.icon-comment::before { background-image:url("../icons/comment.svg"); }.icon-refresh::before { background-image:url("../icons/refresh.svg"); }.icon-chevron::before { background-image:url("../icons/chevron.svg"); }.icon-globe::before { background-image:url("../icons/globe.svg"); }
.site-header { position:fixed; z-index:20; top:0; right:0; left:0; height:var(--header); border-bottom:1px solid var(--line); background:rgba(255,253,250,.98); transform:translateZ(0); }
.nav-shell { position:relative; display:flex; min-height:var(--header); align-items:center; justify-content:space-between; gap:20px; }.brand { display:flex; min-width:195px; align-items:center; gap:9px; font-size:19px; font-weight:900; }.brand img { width:41px; height:41px; border-radius:var(--radius); object-fit:cover; }.site-nav ul { display:flex; gap:clamp(20px,3vw,42px); }.site-nav a { font-size:14px; font-weight:700; }.site-nav a:hover { color:var(--orange); }.nav-actions { display:flex; gap:9px; }.nav-download,.button { display:inline-flex; min-height:42px; align-items:center; justify-content:center; gap:8px; border-radius:var(--radius); font-size:14px; font-weight:800; }.nav-download { padding:0 15px; border:1px solid var(--orange); color:var(--orange); }.nav-download:hover { background:var(--orange); color:#fff; }.menu-toggle { display:none; }
.eyebrow { color:var(--orange); font-size:12px; font-weight:900; letter-spacing:.11em; }.hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(400px,.8fr); gap:74px; min-height:600px; align-items:center; padding:53px 0; }.hero h1 { margin-top:19px; font-size:clamp(45px,5.4vw,70px); line-height:1; letter-spacing:-.06em; }.hero h2 { margin-top:15px; font-size:clamp(28px,3.2vw,40px); white-space:nowrap; }.hero-lead { max-width:470px; margin-top:17px; color:var(--muted); font-size:15px; line-height:1.8; }.primary-button { min-width:202px; margin-top:24px; padding:0 17px; border:1px solid var(--orange); box-shadow:4px 4px 0 #e8e1da; }.primary-button:hover { background:var(--orange); color:#fff; }.hero-facts { display:grid; gap:0; max-width:400px; margin-top:28px; }.hero-facts li { display:grid; grid-template-columns:25px 1fr; gap:10px; padding:12px 0; border-bottom:1px solid var(--line); }.hero-facts .icon { color:var(--orange); font-size:20px; }.hero-facts span { color:var(--muted); font-size:12px; }.hero-facts strong { display:block; margin-top:3px; color:var(--ink); font-size:14px; }.hero-visual { position:relative; display:flex; min-height:490px; justify-content:flex-end; align-items:center; }.phone-frame { display:flex; width:294px; height:475px; align-items:center; justify-content:center; padding:8px; border:7px solid #292929; border-radius:var(--radius); background:#292929; box-shadow:16px 20px 28px rgba(0,0,0,.16); }.phone-frame img { width:100%; height:100%; object-fit:contain; }.hero-note { position:absolute; z-index:2; bottom:55px; left:0; width:240px; padding:14px; border-radius:var(--radius); background:#272727; color:#fff; box-shadow:8px 9px 0 #ece5dc; }.hero-note header { display:flex; align-items:center; gap:8px; }.hero-note img { width:31px; height:31px; border-radius:var(--radius); object-fit:cover; }.hero-note p { margin:8px 0; color:#ddd; font-size:12px; }.hero-note li { padding:4px 0; color:#ddd; font-size:12px; }.hero-note li::before { color:var(--orange); content:"✓ "; }
.index-section { padding:52px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.number-heading { display:flex; align-items:center; gap:20px; }.number-heading > b { color:var(--ink); font-family:Georgia,serif; font-size:52px; line-height:1; }.number-heading h2 { margin-top:6px; font-size:clamp(28px,3.3vw,42px); line-height:1.1; }.number-heading > span { margin-left:auto; padding:7px 10px; border:1px solid var(--orange); border-radius:var(--radius); color:var(--orange); font-size:12px; font-weight:800; }.index-columns { display:grid; grid-template-columns:repeat(3,1fr); margin-top:28px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.index-columns article { min-height:160px; padding:24px; border-right:1px solid var(--line); }.index-columns article:last-child { border:0; }.index-columns .icon { color:var(--orange); font-size:22px; }.index-columns h3 { margin-top:15px; font-size:16px; }.index-columns p { margin-top:8px; color:var(--muted); font-size:14px; line-height:1.7; }
.screens { padding:58px 0; background:#fff4e9; }.screen-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:15px; margin-top:27px; }.screen-grid figure { overflow:hidden; border:1px solid #efd9c2; border-radius:var(--radius); background:#fff; }.screen-grid figure > div { display:flex; aspect-ratio:9/16; align-items:center; justify-content:center; padding:6px; }.screen-grid img { width:100%; height:100%; object-fit:contain; }.screen-grid figcaption { display:grid; grid-template-columns:auto 1fr; column-gap:8px; padding:12px; border-top:1px solid #efd9c2; }.screen-grid figcaption b { grid-row:span 2; color:var(--orange); font-size:12px; }.screen-grid strong { font-size:14px; }.screen-grid span { margin-top:3px; color:var(--muted); font-size:12px; }
.record { padding:72px 0; }.record-layout { display:grid; grid-template-columns:430px minmax(0,1fr); gap:75px; align-items:center; margin-top:32px; }.record-layout figure { display:flex; height:500px; align-items:center; justify-content:center; padding:7px; border:1px solid var(--line); border-radius:var(--radius); }.record-layout figure img { width:100%; height:100%; object-fit:contain; }.notebook { padding:25px; border:1px solid var(--line); border-left:4px solid var(--orange); border-radius:var(--radius); }.notebook h3 { margin-top:18px; font-size:16px; }.notebook h3:first-child { margin-top:0; }.notebook p { margin-top:8px; color:var(--muted); font-size:14px; line-height:1.7; }.tags { display:flex; flex-wrap:wrap; gap:7px; margin-top:10px; }.tags span { padding:5px 8px; border:1px solid #e8c39f; border-radius:var(--radius); color:#995100; font-size:12px; }.meter { display:flex; align-items:center; gap:10px; margin-top:11px; }.meter i { display:block; width:70%; height:7px; background:linear-gradient(to right,var(--orange) 62%,#eee2d7 62%); }.meter b { color:var(--orange); font-size:18px; }
.faq { padding-top:60px; border-top:1px solid var(--line); }.faq-list { display:grid; width:min(100%,790px); gap:9px; margin:25px auto 0; }.faq article { overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:#fff; }.faq button,.official-toggle { display:flex; width:100%; min-height:54px; align-items:center; justify-content:space-between; padding:11px 15px; background:transparent; font-size:14px; font-weight:800; text-align:left; }.faq button:hover,.official-toggle:hover { background:#fff7f0; }.faq .icon,.official-toggle .icon:last-child { color:var(--orange); }.faq button[aria-expanded="true"] .icon,.official-toggle[aria-expanded="true"] .icon:last-child { transform:rotate(180deg); }.faq p { padding:0 15px 15px; color:var(--muted); font-size:13px; line-height:1.7; }.official { padding:20px 0 65px; }.official .number-heading { margin-bottom:17px; }.official-toggle { border:1px solid var(--ink); border-radius:var(--radius); }.official-toggle .icon:first-child { margin-right:9px; color:var(--orange); }.official-toggle span { margin-right:auto; }.official > a { display:block; padding:14px; border:1px solid var(--ink); border-top:0; color:var(--orange); font-size:14px; }.official > a[hidden] { display:none; }
.reviews { padding:62px 0; background:#fff8f1; border-top:1px solid var(--line); }.review-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:27px; }.review-grid article { display:flex; min-height:205px; flex-direction:column; padding:15px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; }.review-grid span { display:grid; width:27px; height:27px; place-items:center; border:1px solid var(--ink); border-radius:var(--radius); font-size:12px; }.review-grid p { margin-top:12px; color:#655f59; font-size:13px; line-height:1.7; }.review-grid time { margin-top:auto; padding-top:11px; color:var(--muted); font-size:12px; }.download { display:flex; min-height:150px; align-items:center; justify-content:space-between; gap:30px; margin:60px auto 52px; padding:30px 42px; border-top:1px solid var(--orange); border-bottom:1px solid var(--orange); }.download h2 { margin-top:8px; font-size:clamp(26px,3vw,39px); }.download .button { min-width:175px; padding:0 18px; border:1px solid var(--ink); }.download .button:hover { background:var(--ink); color:#fff; }
.site-footer { padding:42px 0 18px; background:var(--dark); color:#fff; }.footer-grid { display:grid; grid-template-columns:1.7fr repeat(3,.8fr); gap:28px; }.footer-brand img { width:43px; height:43px; border-radius:var(--radius); object-fit:cover; }.footer-brand strong { display:block; margin-top:8px; font-size:17px; }.footer-brand p,.site-footer a,.site-footer > p { color:#c9c5bf; font-size:12px; }.footer-brand p { margin-top:6px; }.site-footer h2 { font-size:14px; }.site-footer li+li { margin-top:9px; }.site-footer > p { width:min(calc(100% - 48px),var(--content)); margin:29px auto 0; padding-top:15px; border-top:1px solid #555; text-align:center; }
@media (max-width:900px) { .site-nav { display:none; }.menu-toggle { display:grid; width:40px; height:40px; place-items:center; border:1px solid var(--orange); border-radius:var(--radius); background:transparent; color:var(--orange); }.site-nav.is-open { position:absolute; top:calc(100% + 8px); right:0; left:0; display:block; padding:8px; border:1px solid var(--orange); border-radius:var(--radius); background:#fff; box-shadow:6px 7px 0 #f3dac2; }.site-nav.is-open ul { display:grid; gap:3px; }.site-nav.is-open a { display:block; padding:11px; border-left:3px solid transparent; font-size:14px; font-weight:800; }.site-nav.is-open a:hover { border-left-color:var(--orange); background:#fff6ed; }.hero { gap:34px; }.record-layout { grid-template-columns:340px 1fr; gap:36px; }.record-layout figure { height:440px; } }
@media (max-width:720px) { :root { --header:64px; }.page-width,.nav-shell,.site-footer > p { width:min(calc(100% - 32px),var(--content)); }.brand { min-width:0; font-size:16px; }.brand img { width:35px; height:35px; }.nav-download { min-height:37px; padding:0 9px; font-size:12px; }.nav-download .icon { display:none; }.menu-toggle { width:37px; height:37px; }.hero { display:flex; min-height:0; flex-direction:column; gap:0; padding:45px 0 53px; text-align:center; }.hero h1 { font-size:clamp(39px,12vw,52px); }.hero h2 { font-size:clamp(23px,6.5vw,29px); }.hero-lead { margin-right:auto; margin-left:auto; font-size:14px; }.hero-facts { margin:25px auto 0; text-align:left; }.hero-visual { order:2; width:100%; min-height:462px; margin-top:36px; justify-content:flex-end; }.phone-frame { width:270px; height:440px; }.hero-note { bottom:45px; left:0; width:min(238px,calc(100vw - 48px)); text-align:left; }.number-heading { gap:13px; }.number-heading > b { font-size:40px; }.number-heading h2 { font-size:clamp(27px,8vw,34px); }.index-section,.screens,.reviews { padding:51px 0; }.index-columns { grid-template-columns:1fr; }.index-columns article { min-height:0; border-right:0; border-bottom:1px solid var(--line); }.index-columns article:last-child { border:0; }.screen-grid { grid-template-columns:repeat(2,1fr); gap:9px; }.screen-grid figcaption span { display:none; }.record { padding:52px 0; }.record-layout { grid-template-columns:1fr; gap:27px; }.record-layout figure { width:min(100%,320px); height:450px; }.notebook { width:100%; }.faq { padding-top:51px; }.official { padding-bottom:52px; }.review-grid { grid-template-columns:1fr; gap:9px; }.review-grid article { min-height:0; }.review-grid p { margin-bottom:15px; }.download { display:block; min-height:0; margin:49px auto 42px; padding:28px 22px; }.download .button { width:100%; margin-top:20px; }.footer-grid { grid-template-columns:repeat(2,1fr); }.footer-brand { grid-column:1/-1; } }

.review-grid header { display:flex; align-items:center; gap:9px; }
.review-grid header b { color:var(--ink); font-size:13px; }

@media (max-width:720px) {
  .record-layout figure { margin-right:auto; margin-left:auto; }
  .footer-grid { grid-template-columns:repeat(3,1fr); }
  .footer-brand { grid-column:1/-1; display:flex; flex-direction:column; align-items:center; text-align:center; }
  .site-footer nav { text-align:center; }
}