/* Blog article typography - used by /blog/post.php (.content-body).
   The site has a global "* {margin:0;padding:0}" reset, so everything is defined here. */
.content-body{font-size:1.05rem;line-height:1.8;color:#334155;overflow-wrap:anywhere;word-break:normal}
.content-body>*:first-child{margin-top:0}
.content-body p{margin:0 0 1.15rem}
.content-body h2,.content-body h3,.content-body h4{color:#0f172a;line-height:1.3;scroll-margin-top:90px}
.content-body h2{font-size:1.55rem;margin:2.25rem 0 .9rem;padding-bottom:.4rem;border-bottom:2px solid #eef2ff}
.content-body h3{font-size:1.25rem;margin:1.75rem 0 .7rem}
.content-body h4{font-size:1.08rem;margin:1.4rem 0 .6rem}
.content-body a{color:var(--primary,#6366f1);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.content-body a:hover{color:var(--primary-dark,#4f52e0)}
.content-body strong,.content-body b{color:#0f172a;font-weight:700}

.content-body ul,.content-body ol{margin:0 0 1.25rem;padding-left:1.6rem}
.content-body ul{list-style:disc}
.content-body ol{list-style:decimal}
.content-body li{margin:.4rem 0;padding-left:.2rem}
.content-body li::marker{color:var(--primary,#6366f1)}
.content-body ul.checklist{list-style:none;padding-left:.2rem}
.content-body ul ul,.content-body ol ol,.content-body ul ol,.content-body ol ul{margin:.4rem 0 .4rem}

/* Tables - scroll sideways on phones instead of breaking the layout */
.content-body .table-wrap{margin:1.5rem 0;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid #e2e8f0;border-radius:.75rem;background:#fff;box-shadow:0 1px 3px rgba(15,23,42,.06)}
.content-body table{width:100%;min-width:520px;border-collapse:collapse;font-size:.95rem;line-height:1.55;margin:0}
.content-body th,.content-body td{padding:.75rem 1rem;text-align:left;vertical-align:top;border-bottom:1px solid #e2e8f0;border-right:1px solid #eef2f7}
.content-body th:last-child,.content-body td:last-child{border-right:0}
.content-body tr:last-child td{border-bottom:0}
.content-body th{background:#eef2ff;color:#312e81;font-weight:700;font-size:.9rem;white-space:nowrap;border-bottom:2px solid #c7d2fe;padding-bottom:.75rem}
.content-body tbody tr:nth-child(even) td,.content-body tr:nth-child(even) td{background:#f8fafc}
.content-body td:first-child{font-weight:600;color:#0f172a}

.content-body blockquote{margin:1.5rem 0;padding:1rem 1.25rem;background:#f5f3ff;border-left:4px solid var(--primary,#6366f1);border-radius:0 .6rem .6rem 0;color:#475569;font-style:italic}
.content-body blockquote p{margin:0}
.content-body blockquote footer{margin-top:.5rem;font-size:.85rem;font-style:normal;color:#64748b}
.content-body hr{border:0;height:1px;background:#e2e8f0;margin:2rem 0}
.content-body pre{background:#0f172a;color:#e2e8f0;padding:1rem 1.25rem;border-radius:.6rem;overflow-x:auto;margin:1.25rem 0;font-size:.88rem;line-height:1.6}
.content-body code{background:#f1f5f9;color:#be185d;padding:.12em .4em;border-radius:.3em;font-size:.88em}
.content-body pre code{background:none;color:inherit;padding:0}
.content-body mark{background:#fef08a;padding:0 .2em;border-radius:.2em}
.content-body figure{margin:1.5rem 0;text-align:center}
.content-body img{max-width:100%;height:auto;border-radius:.6rem;display:block;margin:0 auto}
.content-body figcaption{margin-top:.5rem;font-size:.85rem;color:#64748b}
.content-body iframe,.content-body video{max-width:100%}

@media (max-width:640px){
  .content-body{font-size:1rem;line-height:1.75}
  .content-body h2{font-size:1.35rem}
  .content-body h3{font-size:1.15rem}
  .content-body th,.content-body td{padding:.6rem .75rem}
}
