/* ===== S&G fastener blog ===== */
.blog-hero{padding-bottom:clamp(56px,7vw,90px)}
.post-meta{margin-top:16px;font-size:.92rem;color:#9fb3b9}
.blog-sec{padding-top:clamp(56px,7vw,96px)}
.bgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.bcard{display:flex;flex-direction:column;gap:10px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px 24px 18px;color:inherit;text-decoration:none;transition:border-color .25s var(--ease),box-shadow .25s var(--ease),transform .25s var(--ease)}
.bcard:hover{border-color:var(--teal-300);box-shadow:var(--shadow);transform:translateY(-3px)}
.bc-top{display:flex;align-items:center;gap:10px}
.bc-ico{width:44px;height:44px;border-radius:12px;background:var(--teal-50);color:var(--teal-600);display:grid;place-items:center}
.bc-ico svg{width:24px;height:24px}
.bc-cat{font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--teal-700)}
.bcard b{font-family:var(--font-head);font-size:1.12rem;font-weight:600;line-height:1.32;color:var(--ink)}
.bc-desc{font-size:.93rem;line-height:1.6;color:var(--muted);flex:1}
.bc-meta{display:flex;justify-content:space-between;font-size:.82rem;color:#8a9a9f;border-top:1px solid var(--line);padding-top:12px}
.bc-meta i{font-style:normal;color:var(--teal-600);font-weight:600}

.post-wrap{padding-top:clamp(48px,6vw,80px)}
.post-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:52px;align-items:start}
.post-body{min-width:0;max-width:780px;font-size:1.03rem;line-height:1.8;color:var(--text)}
.post-body h2{font-family:var(--font-head);font-size:1.55rem;font-weight:600;line-height:1.3;margin:42px 0 12px;color:var(--ink)}
.post-body h2:first-child{margin-top:0}
.post-body p{margin:0 0 16px}
.post-body ul,.post-body ol{margin:0 0 18px;padding-left:22px}
.post-body li{margin:6px 0}
.post-body a{color:var(--teal-600);text-decoration:underline;text-underline-offset:2px}
.post-body b{color:var(--ink);font-weight:600}
.post-body .small{font-size:.86rem;color:var(--muted);line-height:1.6}
.post-body .note{font-size:.97rem;background:var(--teal-50);border-left:4px solid var(--teal);border-radius:0 12px 12px 0;padding:14px 18px;margin:28px 0}
.post-body .tbl{overflow-x:auto;margin:8px 0 20px;border:1px solid var(--line);border-radius:14px;background:#fff}
.post-body table{border-collapse:collapse;width:100%;min-width:560px;font-size:.92rem;line-height:1.5}
.post-body th{background:var(--teal-50);color:var(--ink);font-weight:600;text-align:left;padding:11px 14px;font-size:.84rem}
.post-body td{padding:11px 14px;border-top:1px solid var(--line);vertical-align:top}
.post-body td b{font-size:inherit}
.post-body tbody tr:nth-child(even){background:var(--bg)}
.post-body .flow{list-style:none;padding:0;counter-reset:f;display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:24px 0 32px}
.post-body .flow li{counter-increment:f;position:relative;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 14px 14px 58px;margin:0;line-height:1.5}
.post-body .flow li::before{content:counter(f);position:absolute;left:14px;top:14px;width:30px;height:30px;border-radius:50%;background:var(--grad);color:#fff;font-weight:600;font-size:.9rem;display:grid;place-items:center}
.post-body .flow li b{display:block;font-size:.98rem}
.post-body .flow li span{display:block;font-size:.88rem;color:var(--muted)}
.post-disc{margin-top:36px;padding-top:18px;border-top:1px solid var(--line);font-size:.86rem;color:var(--muted);line-height:1.6}
.post-pn{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:28px}
.pn{display:block;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px;text-decoration:none!important;color:var(--ink)}
.pn:hover{border-color:var(--teal-300)}
.pn small{display:block;font-size:.8rem;color:var(--muted)}
.pn b{font-weight:600}
.pn.next{text-align:right;grid-column:2}
.post-side{position:sticky;top:110px;display:grid;gap:16px}
.ps-box{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px}
.ps-box h3{font-family:var(--font-head);font-size:1rem;font-weight:600;margin:0 0 10px;color:var(--ink)}
.ps-box ol{margin:0;padding-left:20px;font-size:.9rem;line-height:1.5}
.ps-box li{margin:7px 0}
.ps-box a{color:var(--text);text-decoration:none}
.ps-box a:hover,.ps-box a[aria-current]{color:var(--teal-600);font-weight:600}
.ps-cta p{font-size:.9rem;color:var(--muted);margin:0 0 14px;line-height:1.55}
.blog-cta{padding-top:0}
.bcta{display:flex;align-items:center;justify-content:space-between;gap:24px;background:var(--slate-900);color:#fff;border-radius:var(--radius-lg);padding:36px 40px}
.bcta h2{font-family:var(--font-head);font-size:clamp(1.3rem,2.4vw,1.8rem);margin:0 0 6px;color:#fff}
.bcta p{margin:0;color:#b9c9cd}
@media (max-width:1000px){.bgrid{grid-template-columns:1fr 1fr}.post-grid{grid-template-columns:minmax(0,1fr)}.post-side{position:static}}
@media (max-width:640px){.bgrid{grid-template-columns:1fr}.post-body .flow{grid-template-columns:1fr}.post-pn{grid-template-columns:1fr}.pn.next{grid-column:auto}.post-body{font-size:.98rem}.post-body h2{font-size:1.28rem}.bcta{flex-direction:column;align-items:flex-start;padding:28px 24px}}
.post-hero h1.h-xl{font-size:clamp(2rem,4.2vw,3.3rem);line-height:1.12}