/* Blog: article layout */
.post-head{background:var(--ink)}
.post-head .wrap{padding-top:72px;padding-bottom:72px;display:flex;flex-direction:column;gap:20px}
.post-head .kicker{color:var(--coral);font-size:17px;font-weight:700}
.post-head h1{color:#fff;font-size:clamp(32px,4vw,56px);line-height:1.3;font-weight:900;max-width:22ch}
.post-head .lead{color:var(--line);font-size:clamp(17px,1.5vw,21px);line-height:1.85;max-width:760px}
.post-head .meta{color:var(--mid);font-size:15px}
.crumbs{font-size:15px;color:var(--mid)}
.crumbs a{color:var(--line)}
.crumbs a:hover{color:#fff}
.post-body{max-width:860px;padding-top:64px;padding-bottom:88px;display:flex;flex-direction:column;gap:22px}
.post-body h2{font-size:clamp(26px,2.4vw,34px);line-height:1.4;margin-top:22px}
.post-body p,.post-body li{font-size:19px;line-height:1.95;color:#2b2d31}
.post-body ul{margin:0;padding-inline-start:24px;display:flex;flex-direction:column;gap:8px}
.post-body li::marker{color:var(--red-text)}
.post-body a{color:var(--red-text);text-decoration:underline;text-underline-offset:3px}
.post-body .box{background:var(--soft);border-inline-start:4px solid var(--red-text);border-radius:14px;padding:22px 24px}
.tbl{overflow-x:auto;border:1px solid var(--line);border-radius:16px}
.tbl table{width:100%;border-collapse:collapse;min-width:560px;font-size:17px}
.tbl th,.tbl td{padding:14px 18px;text-align:start;border-bottom:1px solid var(--line);line-height:1.6}
.tbl thead th{background:var(--ink);color:#fff;font-weight:700}
.tbl tbody th{font-weight:700;background:var(--soft)}
.tbl tr:last-child th,.tbl tr:last-child td{border-bottom:0}
.post-cta{margin-top:30px;background:var(--ink);border-radius:24px;padding:40px;display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.post-cta h2{color:#fff;margin:0;font-size:clamp(24px,2.2vw,30px)}
.post-cta p{color:var(--line)!important}
.post-cta .btn{font-size:18px;padding:16px 30px;text-decoration:none;color:#fff}
.more-posts{background:var(--soft);padding:80px 0}
.more-posts .wrap{display:flex;flex-direction:column;gap:28px}
.cards.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.card .num{font-size:15px;color:var(--red-text);font-weight:700}
@media (max-width:860px){
.post-head .wrap{padding-top:44px;padding-bottom:48px}
.post-body{padding-top:40px;padding-bottom:64px}
.post-body p,.post-body li{font-size:17px}
.post-cta{padding:28px 22px;align-items:stretch}
.post-cta .btn{text-align:center}
.cards.two{grid-template-columns:1fr}
.more-posts{padding:56px 0}
}