/* Shared styles for static article pages (/clanky/*). Landing page is rendered by React. */
body{ font-family:"Open Sans", sans-serif; color:#555; line-height:1.75; background:#fff }
.article-wrap{ max-width:820px; margin:0 auto; padding:50px 20px 100px }
.crumbs{ font-size:14px; color:#888; margin-bottom:28px }
.crumbs a{ color:#5ca9fb }
h1{ font-size:34px; font-weight:800; color:#222; line-height:1.2; margin:0 0 10px }
h2{ font-size:22px; font-weight:700; color:#222; margin:40px 0 12px }
h3{ font-size:18px; font-weight:700; color:#222; margin:24px 0 8px }
p, li{ font-size:16px }
ul, ol{ padding-left:22px; margin:0 0 16px }
li{ margin-bottom:8px }
a{ color:#5ca9fb }
.meta{ color:#888; font-size:14px; margin-bottom:28px }
.lead{ font-size:19px; color:#444 }
table{ width:100%; border-collapse:collapse; margin:20px 0 }
th, td{ text-align:left; padding:10px 12px; border:1px solid #e5e7eb; font-size:15px; vertical-align:top }
th{ background:#f8fafc }
.cta{ margin-top:48px; padding:28px; border-radius:14px; background:linear-gradient(135deg,#0f172a,#1e3a8a); color:#fff; text-align:center }
.cta h2{ color:#fff; margin-top:0 }
.cta p{ color:rgba(255,255,255,.9) }
.cta a.btn{ display:inline-block; padding:14px 30px; border-radius:40px; background:#fff; color:#1e3a8a; font-weight:800; text-decoration:none; font-size:16px; margin:6px }
footer.mini{ border-top:1px solid #eee; margin-top:60px; padding-top:20px; font-size:14px; color:#888 }
.list article{ border:1px solid #e5e7eb; border-radius:14px; padding:24px; margin-bottom:20px; background:#fff }
.list article h2{ margin:0 0 8px; font-size:22px }
.list article p{ margin:0 0 10px }
.tip{ background:#f8fafc; border-left:4px solid #5ca9fb; padding:14px 18px; border-radius:0 10px 10px 0; margin:20px 0 }