/* Blog styling. Same tokens as the landing page so the two read as one site -
   deliberately duplicated rather than imported, because a blog post that fails
   to render when one stylesheet 404s is worse than 3KB of repetition, and
   these pages have to work as standalone documents for Google. */
:root{
  --ground:#050706; --surface:#0D120E; --surface-2:#121A14;
  --ink:#EDF3EB; --ink-2:#B4C2B1; --muted:#778775;
  --line:#1B261A; --line-2:#2B3A29;
  --green:#6EE04A; --green-2:#9BF57C; --red:#E5484D; --blue:#8FD0FF;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--ground); color:var(--ink);
  font-family:"Source Sans 3",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased;
}
a{color:var(--green); text-decoration:none}
a:hover{text-decoration:underline; text-underline-offset:2px}
.wrap{max-width:44rem; margin:0 auto; padding:0 1.25rem}
header.site{border-bottom:1px solid var(--line); padding:1.1rem 0}
header.site .wrap{display:flex; align-items:center; gap:1rem}
.brand{font-family:"Sora",system-ui,sans-serif; font-weight:700; font-size:1.05rem; color:var(--ink); letter-spacing:-.01em}
.brand span{color:var(--green)}
header.site nav{margin-left:auto; display:flex; gap:1.1rem; font-size:.9rem}
header.site nav a{color:var(--ink-2)}
.cta{
  display:inline-block; background:var(--green); color:#04240A; font-weight:700;
  padding:.55rem 1rem; border-radius:8px; font-size:.9rem;
}
.cta:hover{background:var(--green-2); text-decoration:none}
h1{font-family:"Sora",system-ui,sans-serif; font-size:2.1rem; line-height:1.18; letter-spacing:-.02em; margin:2.2rem 0 .6rem}
h2{font-family:"Sora",system-ui,sans-serif; font-size:1.3rem; line-height:1.3; margin:2.4rem 0 .7rem}
h3{font-family:"Sora",system-ui,sans-serif; font-size:1.08rem; margin:1.8rem 0 .5rem}
.meta{color:var(--muted); font-size:.85rem; margin:0 0 2rem}
article p{margin:0 0 1.15rem; color:var(--ink-2)}
article strong{color:var(--ink)}
article ul,article ol{color:var(--ink-2); padding-left:1.2rem}
article li{margin:0 0 .5rem}
blockquote{margin:1.6rem 0; padding:.9rem 1.1rem; border-left:3px solid var(--green); background:var(--surface); color:var(--ink-2)}
figure{margin:1.8rem 0}
figure img{width:100%; height:auto; display:block; border:1px solid var(--line); border-radius:10px}
figcaption{color:var(--muted); font-size:.82rem; margin-top:.5rem}
table{border-collapse:collapse; width:100%; font-size:.92rem; margin:1.4rem 0; display:block; overflow-x:auto}
th,td{border-bottom:1px solid var(--line); padding:.5rem .7rem; text-align:left; white-space:nowrap}
th{color:var(--muted); font-weight:600; font-size:.8rem; text-transform:uppercase; letter-spacing:.04em}
code{background:var(--surface-2); padding:.1rem .35rem; border-radius:4px; font-size:.9em}
pre{background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:1rem; overflow-x:auto; font-size:.85rem}
pre code{background:none; padding:0}
.post-list{list-style:none; padding:0; margin:2rem 0 0}
.post-list li{border-bottom:1px solid var(--line); padding:1.3rem 0}
.post-list li:last-child{border-bottom:none}
.post-list h2{font-size:1.18rem; margin:0 0 .3rem}
.post-list h2 a{color:var(--ink)}
.post-list p{margin:.3rem 0 0; color:var(--ink-2); font-size:.95rem}
.post-list .meta{margin:.45rem 0 0; font-size:.8rem}
.endcap{margin:3rem 0 1rem; padding:1.4rem; border:1px solid var(--line-2); border-radius:12px; background:var(--surface)}
.endcap p{margin:0 0 .9rem; color:var(--ink-2); font-size:.95rem}
footer.site{border-top:1px solid var(--line); margin-top:3.5rem; padding:2rem 0 3rem; color:var(--muted); font-size:.82rem}
footer.site p{margin:0 0 .7rem; max-width:46rem}
footer.site a{color:var(--ink-2); text-decoration:underline; text-underline-offset:2px}
@media (max-width:640px){
  h1{font-size:1.65rem}
  body{font-size:16px}
  header.site nav{gap:.8rem; font-size:.85rem}
}