/* Blog listing + article styles. Reads tokens.css. */
.blog-head{padding:140px 0 30px;text-align:left}
.blog-head h1{font-size:clamp(34px,4.6vw,52px);max-width:18ch}
.blog-head p{color:var(--text-mid);font-size:18px;margin-top:16px;max-width:54ch}

/* library: search, count, pagination */
.lib-controls{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-top:34px;flex-wrap:wrap}
.search{position:relative;flex:1 1 280px;max-width:440px}
.search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:17px;height:17px;color:var(--text-dim);pointer-events:none}
.search input{width:100%;font-family:var(--font-body);font-size:15px;color:var(--text);background:var(--bg-elev);border:1px solid var(--line);border-radius:11px;padding:12px 14px 12px 42px;outline:none;transition:border-color .2s}
.search input::placeholder{color:var(--text-dim)}
.search input:focus{border-color:var(--text-dim)}
.lib-count{font-family:var(--font-mono);font-size:12px;color:var(--text-dim);white-space:nowrap}
.lib-empty{margin:54px 4px 90px;color:var(--text-mid);font-size:16px}
.pager{display:flex;gap:6px;justify-content:center;align-items:center;margin:30px 0 90px}
.pager button{font-family:var(--font-mono);font-size:13px;min-width:42px;height:42px;padding:0 12px;border:1px solid var(--line);background:var(--bg-elev);color:var(--text-mid);border-radius:9px;cursor:pointer;transition:border-color .2s,color .2s,background .2s}
.pager button:hover:not(:disabled){border-color:var(--text-dim);color:var(--text)}
.pager button[aria-current=page]{background:var(--signal);color:#fff;border-color:var(--signal)}
.pager button:disabled{opacity:.4;cursor:default}

.lindex{list-style:none;margin:20px 0 0;border-bottom:1px solid var(--line-soft)}
.lrow{display:grid;grid-template-columns:1fr auto;gap:26px;align-items:baseline;padding:24px 4px;border-top:1px solid var(--line-soft);transition:padding-left .3s}
.lrow .cat{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--signal);display:block;margin-bottom:9px}
.lrow h2{font-size:clamp(19px,2.2vw,25px);line-height:1.18;transition:color .25s;font-weight:600}
.lrow .rmeta{font-family:var(--font-mono);font-size:11.5px;color:var(--text-dim);text-align:right;white-space:nowrap}
.lrow:hover{padding-left:14px}
.lrow:hover h2{color:var(--signal)}

/* article */
.article{max-width:720px;margin:0 auto;padding:140px 32px 40px}
.article .cat{font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--signal)}
.article h1{font-size:clamp(30px,4.4vw,46px);margin:16px 0 18px;line-height:1.08}
.article .meta{font-family:var(--font-mono);font-size:12.5px;color:var(--text-dim);margin-bottom:36px}
.article .meta a{color:var(--text-mid);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
.article .meta a:hover{color:var(--signal)}
.article .answer{font-size:19px;color:var(--text);background:var(--bg-elev);border-left:2px solid var(--signal);border-radius:0 10px 10px 0;padding:20px 24px;margin-bottom:36px}
.article h2{font-size:clamp(22px,2.8vw,30px);margin:42px 0 14px;font-weight:600}
.article p{color:var(--text-mid);font-size:17px;margin-bottom:18px}
.article p strong{color:var(--text)}
.article ul{color:var(--text-mid);font-size:17px;margin:0 0 18px 22px}
.article li{margin-bottom:9px}
.article .faq{margin-top:50px;border-top:1px solid var(--line-soft);padding-top:30px}
.article .faq h3{font-family:var(--font-display);font-size:19px;margin:22px 0 8px}
.article .cta-box{margin:50px 0 10px;padding:28px;background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--radius);text-align:center}
.article .cta-box p{color:var(--text);font-size:18px;margin-bottom:18px}
.article .related{margin:46px 0 10px;border-top:1px solid var(--line-soft);padding-top:26px}
.article .related .kicker{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-dim)}
.article .related ul{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-direction:column;gap:2px}
.article .related li{margin:0}
.article .related a{display:inline-block;font-size:16px;font-weight:500;color:var(--text);text-decoration:none;padding:7px 0}
.article .related a:hover{color:var(--signal);text-decoration:underline;text-underline-offset:3px}
.article .sources{margin:44px 0 0;border-top:1px solid var(--line-soft);padding-top:26px}
.article .sources .kicker{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-dim)}
.article .sources ul{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-direction:column;gap:9px}
.article .sources li{margin:0;font-size:14px;line-height:1.5;color:var(--text-mid);padding-left:16px;position:relative}
.article .sources li::before{content:"·";position:absolute;left:3px;color:var(--text-dim)}
.article .sources a{color:var(--text);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px;text-decoration-color:var(--line)}
.article .sources a:hover{color:var(--signal);text-decoration-color:var(--signal)}
.article .editorial-note{margin:44px 0 0;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.02em}
.article .editorial-note a{color:var(--text-dim);text-decoration:none}
.article .editorial-note a:hover{color:var(--signal);text-decoration:underline;text-underline-offset:2px}
.article .editorial-note + .disclaimer{margin-top:24px}
.article .disclaimer{margin-top:46px;padding-top:22px;border-top:1px solid var(--line-soft);font-size:12.5px;color:var(--text-dim);line-height:1.7}