.mobile-comparison-guide{background:#fff;color:#101816}
.mj-wrap{max-width:1100px;width:calc(100% - 64px);margin:auto;font-size:18px;line-height:1.65}
.mj-wrap h1,.mj-wrap h2,.mj-wrap h3{color:#101816;letter-spacing:-.025em;text-wrap:balance}
.mj-wrap h1{font-size:clamp(30px,3vw,42px);line-height:1.14;margin:17px 0 20px}
.mj-wrap h2{font-size:28px;line-height:1.23;margin:0 0 15px}
.mj-wrap h3{font-size:21px;line-height:1.35;margin:0 0 10px}
.mj-wrap p{margin:0 0 14px;max-width:76ch}
.mj-wrap a{color:#176a49;text-decoration:underline;text-underline-offset:4px}
.mj-wrap a:hover{color:#10221c}
.mj-wrap :focus-visible{outline:3px solid #aa5800;outline-offset:4px}
.mj-wrap ::selection{background:#d5e9dd;color:#101816}
.mj-hero{display:grid;grid-template-columns:1.4fr 1fr;gap:34px;align-items:center;padding:28px 0 30px}
.mj-breadcrumb{font-size:14px;color:#4b5b54;line-height:1.5}
.mj-quick{border-top:1px solid #dfe7e2;padding-top:14px}
.mj-quick strong{display:block;color:#176a49;font-size:16px;margin-bottom:5px}
.mj-wrap .mj-checks{font-size:16px;color:#4b5b54;line-height:1.5;margin-bottom:0}
.mj-hero figure{margin:0;min-width:0}
.mj-hero img{display:block;width:100%;height:320px;object-fit:contain}
.mj-hero figcaption{font-size:14px;color:#4b5b54;line-height:1.5;margin-top:6px}
.mj-section{padding:28px 0;border-top:1px solid #dfe7e2}
.mj-scroll{max-width:100%;overflow-x:auto;scrollbar-color:#64726d #f3f5f2}
.mj-wrap table{width:100%;border-collapse:collapse;font-size:16px;line-height:1.5;font-variant-numeric:tabular-nums}
.mj-wrap .mj-table-caption{font-size:15px;text-align:left;color:#4b5b54;margin-bottom:10px}
.mj-wrap th,.mj-wrap td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid #dfe7e2}
.mj-wrap thead{color:#fff;background:#10221c}
.mj-wrap tbody th{background:#f3f5f2;width:19%}
.mj-comparison{min-width:640px;table-layout:fixed}
.mj-comparison thead th:first-child{width:20%}
.mj-reference{min-width:760px}
.mj-reference tbody th{width:auto;white-space:nowrap}
.mj-wrap .mj-note{font-size:15px;color:#4b5b54;line-height:1.6;margin-top:13px}
.mj-scroll-hint{display:none}
.mj-materials{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin:20px 0 6px}
.mj-flow{margin:20px 0 0}
.mj-flow figcaption{font-size:15px;font-weight:700;color:#176a49;margin-bottom:12px}
.mj-flow ol{list-style:none;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:22px;padding:0;margin:0}
.mj-flow li{position:relative;background:#f3f5f2;border-top:2px solid #176a49;padding:12px 7px;font-size:15px;line-height:1.4;text-align:center;align-content:center}
.mj-flow li:not(:last-child)::after{content:'→';position:absolute;left:calc(100% + 4px);top:50%;transform:translateY(-50%);color:#176a49}
.mj-related nav{display:flex;flex-direction:column;gap:10px}
@media(max-width:720px){
 .mj-wrap{width:calc(100% - 36px);font-size:16.5px;line-height:1.62}
 .mj-hero{grid-template-columns:1fr;gap:12px;padding:20px 0 24px}
 .mj-wrap h1{font-size:29px;line-height:1.16;margin:14px 0 16px}
 .mj-wrap h2{font-size:25px;line-height:1.24}
 .mj-wrap h3{font-size:20px}
 .mj-hero img{height:190px}
 .mj-section{padding:25px 0}
 .mj-wrap table{font-size:15px}
 .mj-wrap th,.mj-wrap td{padding:11px 12px}
 .mj-wrap .mj-scroll-hint{display:block;font-size:14px;color:#4b5b54;margin:0 0 10px}
 .mj-materials{grid-template-columns:1fr;gap:12px;margin-top:16px}
 .mj-flow ol{display:flex;flex-direction:column;gap:20px}
 .mj-flow li{font-size:16px;padding:8px 12px;border-top:0;border-bottom:1px solid #dfe7e2}
 .mj-flow li:not(:last-child)::after{content:'↓';left:50%;top:100%;transform:translateX(-50%);line-height:20px}
}
