/* Post / Ghost content styling for SYS_THEME */

.post{padding:36px 0 80px}
.post-header{padding-top:24px}
.post-title{
  margin:10px 0 10px;
  font-family:var(--mono);
  font-weight:600;
  font-size:34px;
  letter-spacing:0.01em;
}
.post-meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  color:var(--fg2);
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:0.08em;
  text-transform:uppercase;
}
.meta-sep{opacity:0.55}

.post-hero{
  margin:22px 0 0;
  border-radius:var(--r);
  overflow:hidden;
  border:1px solid var(--line);
}
.post-hero img{width:100%; height:auto}

.post-content{padding-top:26px}

.post-content .kg-width-wide,
.post-content .kg-width-full{max-width:1100px; margin-left:auto; margin-right:auto}

.post-content h1,
.post-content h2,
.post-content h3,
.post-content h4{
  font-family:var(--mono);
  font-weight:600;
  letter-spacing:0.01em;
  margin:28px 0 12px;
}
.post-content h2{font-size:24px}
.post-content h3{font-size:18px}
.post-content h4{font-size:15px}

.post-content p,
.post-content li{
  color:var(--fg2);
  line-height:1.85;
  font-size:16px;
}

.post-content a{
  text-decoration:none;
  border-bottom:1px solid rgba(255,200,0,0.35);
  transition: border-color 180ms var(--ease);
}
.post-content a:hover{border-bottom-color:rgba(255,200,0,0.75)}

.post-content ul,
.post-content ol{padding-left:22px}
.post-content li{margin:0 0 8px}

.post-content blockquote{
  margin:20px 0;
  padding:14px 16px;
  border-left:2px solid var(--accent);
  background:rgba(0,0,0,0.12);
  border-radius:12px;
}
html.theme-light .post-content blockquote{background:rgba(247,247,247,0.65)}
.post-content blockquote p{margin:0; color:var(--fg)}

.post-content hr{
  border:0;
  border-top:1px solid var(--line2);
  margin:26px 0;
}

.post-content pre{
  margin:18px 0;
  padding:14px 14px;
  border-radius:var(--r);
  border:1px solid var(--line);
  overflow:auto;
  background:rgba(0,0,0,0.18);
}
html.theme-light .post-content pre{background:rgba(247,247,247,0.75)}
.post-content code{font-size:13px; color:var(--fg)}
.post-content :not(pre) > code{
  border:1px solid var(--line2);
  border-radius:10px;
  padding:2px 6px;
  background:rgba(0,0,0,0.10);
}
html.theme-light .post-content :not(pre) > code{background:rgba(247,247,247,0.7)}

.post-content figure{margin:22px 0}
.post-content figcaption{
  margin-top:8px;
  color:var(--fg2);
  font-family:var(--mono);
  font-size:12px;
}

.kg-image-card img.kg-image {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 14px;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.post-content img{
  border-radius:var(--r);
  border:1px solid var(--line2);
}

.post-content .kg-callout-card{
  border:1px solid var(--line);
  border-radius:var(--r);
  padding:14px 14px;
  background:rgba(0,0,0,0.12);
}
html.theme-light .post-content .kg-callout-card{background:rgba(247,247,247,0.65)}

.post-content iframe,
.post-content video{
  width:100%;
  border:1px solid var(--line2);
  border-radius:var(--r);
}