/* Basic blog-post layout for guide pages — pairs with base.css */
body.blog{background:#fff}
.post{max-width:720px;margin:0 auto;padding:72px 24px 90px}
.post .gnum{font-size:clamp(56px,8vw,92px);margin-bottom:-22px}
.post .mic{margin-bottom:20px}
.post h1{font-size:clamp(36px,5vw,54px);font-weight:300;line-height:1.08}
.post .plede{font-size:17.5px;line-height:1.85;color:var(--soft);margin-top:22px}
.pbyline{display:flex;align-items:center;gap:13px;margin:34px 0 0;padding:22px 0;border-top:1px solid var(--line)}
.pbyline img{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:none}
.pbyline span{font-size:13px;color:var(--soft);line-height:1.5}
.pbyline b{color:var(--ink);font-weight:400}
.pfig{margin:36px 0 0}
.pfig img{width:100%;height:clamp(260px,36vw,420px);object-fit:cover;display:block}
.pfig figcaption{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--soft);margin-top:12px}
.post ul.pstages{display:grid;grid-template-columns:repeat(5,1fr);margin:0;padding:0;gap:0;list-style:none;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pstages li{border-left:1px solid var(--line)}
.pstages li:first-child{border-left:none}
.post .pstages a{display:flex;flex-direction:column;gap:6px;padding:16px 14px;text-decoration:none}
.pstages .n{font-family:var(--serif);font-size:13px;color:var(--soft)}
.pstages .s{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--soft)}
.pstages a:hover .s{color:var(--ink)}
.pstages .on a{background:var(--bone)}
.pstages .on .s,.pstages .on .n{color:var(--ink)}
@media(max-width:640px){.post ul.pstages{grid-template-columns:1fr}.pstages li{border-left:none;border-top:1px solid var(--line)}.pstages li:first-child{border-top:none}.post .pstages a{flex-direction:row;align-items:baseline;padding:12px 14px}}
.post h2{font-size:clamp(26px,3.4vw,34px);font-weight:300;line-height:1.15;margin:64px 0 18px}
.post h3{font-size:20px;font-weight:400;font-family:var(--serif);margin:36px 0 10px}
.post p{font-size:16px;line-height:1.9;color:var(--soft);margin:0 0 18px}
.post p b,.post li b{color:var(--ink);font-weight:400}
.post a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line)}
.post a:hover{text-decoration-color:var(--ink)}
.post ul,.post ol{padding-left:22px;margin:0 0 18px;display:flex;flex-direction:column;gap:10px}
.post li{font-size:15.5px;line-height:1.8;color:var(--soft)}
.post dl{margin:0 0 18px}
.post dt{font-size:15.5px;color:var(--ink);margin-top:16px}
.post dd{font-size:15px;line-height:1.75;color:var(--soft);margin:4px 0 0}
.pwhy{font-size:14px;color:var(--soft);border-left:1px solid var(--ink);padding-left:16px;margin:0 0 18px}
.pemail{border:1px solid var(--line);background:var(--bone);margin:26px 0}
.pemail .h{padding:14px 20px;border-bottom:1px solid var(--line);font-size:12.5px;color:var(--soft)}
.pemail .h b{color:var(--ink);font-weight:400}
.pemail .b{padding:20px 22px;font-size:14.5px;line-height:1.75;color:var(--soft);white-space:pre-wrap}
.pcta{border:1px solid var(--line);background:var(--bone);padding:36px 32px;margin:40px 0;text-align:center}
.pcta h2,.post .pcta h2{margin:0 0 12px;font-size:clamp(24px,3vw,30px)}
.pcta p{max-width:46ch;margin:0 auto 22px}
.pcta .btn{display:inline-block}
.pcta .pr{display:block;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--soft);margin-top:16px}
.pcta.dark{background:var(--ink2);border-color:var(--ink2)}
.pcta.dark h2{color:var(--bone)}
.pcta.dark p{color:rgba(248,245,239,.72)}
.pcta.dark .btn{border-color:var(--bone);background:var(--bone);color:var(--ink)}
.pcta.dark .btn:hover{background:transparent;color:var(--bone)}
.pcta.dark .pr{color:rgba(248,245,239,.6)}
.btn-hblogo{height:16px;width:auto;vertical-align:-3px;margin-right:9px;display:inline}
.post ul.pmore{list-style:none;padding:0;margin:0;gap:0;border-top:1px solid var(--line)}
.pmore li{border-bottom:1px solid var(--line)}
.post .pmore a{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:16px 2px;text-decoration:none}
.pmore .t{font-family:var(--serif);font-size:19px;color:var(--ink)}
.pmore .k{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--soft);flex:none}
.post table{width:100%;border-collapse:collapse;margin:0 0 18px;font-size:14.5px}
.post th,.post td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);color:var(--soft);vertical-align:top}
.post thead th{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--ink)}
.post tbody th{color:var(--ink);font-weight:400}
.post td.win{color:var(--ink)}
.post td .tick{margin-right:6px}
.post .tblwrap{margin:0 0 18px}
@media(max-width:560px){.post .tblwrap{overflow-x:auto}.post .tblwrap table{min-width:520px;margin:0}}
@media(max-width:640px){.post{padding:44px 20px 64px}.post h2{margin-top:48px}}
