/* Blog styles — matches the main site. Accent is filled per client at build time. */
:root{
  --bg:#17191C; --panel:#1E2125; --ink:#ECEAE6; --muted:#9AA0A6; --line:#2C3036;
  --clay:#C2632E; --ember:#FF8217;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"IBM Plex Sans",system-ui,-apple-system,sans-serif;
  line-height:1.7; -webkit-font-smoothing:antialiased;
}
a{color:var(--ember); text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:760px; margin:0 auto; padding:0 22px}

/* header */
.site-head{
  position:sticky; top:0; z-index:10; background:rgba(23,25,28,.85);
  backdrop-filter:blur(10px); border-bottom:1px solid var(--line);
}
.site-head .wrap{display:flex; align-items:center; justify-content:space-between; height:64px}
.brand{display:flex; align-items:center; gap:11px; color:var(--ink)}
.brand:hover{text-decoration:none}
.brand img{width:34px; height:34px; border-radius:7px}
.brand b{font-family:"Archivo",sans-serif; font-weight:700; letter-spacing:.02em; text-transform:uppercase; font-size:.95rem}
.book-btn{
  background:var(--clay); color:#fff; padding:9px 16px; border-radius:8px;
  font-weight:600; font-size:.9rem; white-space:nowrap;
}
.book-btn:hover{background:var(--ember); text-decoration:none}

/* article */
main{padding:48px 0 24px}
.eyebrow{
  font-family:"IBM Plex Mono",monospace; font-size:.72rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--ember);
}
.post-date{font-family:"IBM Plex Mono",monospace; font-size:.8rem; color:var(--muted); margin-top:6px}
article h1{
  font-family:"Archivo",sans-serif; font-weight:800; line-height:1.15;
  font-size:clamp(1.9rem,5vw,2.7rem); margin:.5rem 0 1.2rem;
}
article h2{font-family:"Archivo",sans-serif; font-weight:700; font-size:1.5rem; margin:2.2rem 0 .8rem}
article h3{font-family:"Archivo",sans-serif; font-weight:600; font-size:1.2rem; margin:1.8rem 0 .6rem}
article p{margin:0 0 1.2rem}
article ul,article ol{margin:0 0 1.2rem; padding-left:1.3rem}
article li{margin:.4rem 0}
article img{max-width:100%; height:auto; border-radius:10px; margin:1.4rem 0}
article blockquote{
  margin:1.6rem 0; padding:.4rem 0 .4rem 1.3rem; border-left:3px solid var(--clay);
  color:var(--ink); font-style:italic;
}
article code{
  font-family:"IBM Plex Mono",monospace; font-size:.88em;
  background:var(--panel); padding:.12em .4em; border-radius:5px;
}
article strong{color:#fff}
hr{border:none; border-top:1px solid var(--line); margin:2.4rem 0}

/* CTA + back */
.cta{
  margin:2.6rem 0 1rem; padding:24px; border-radius:14px;
  background:linear-gradient(180deg,rgba(194,99,46,.12),rgba(194,99,46,.04));
  border:1px solid var(--line);
}
.cta h3{margin:.2rem 0 .5rem; font-family:"Archivo",sans-serif}
.cta p{margin:0 0 1rem; color:var(--muted)}
.back{display:inline-block; margin-top:1.6rem; font-family:"IBM Plex Mono",monospace; font-size:.85rem}

/* index list */
.page-head{padding:48px 0 8px}
.page-head h1{font-family:"Archivo",sans-serif; font-weight:800; font-size:clamp(2rem,5vw,2.8rem); margin:.5rem 0 .4rem}
.page-head p{color:var(--muted); margin:0}
.post-list{list-style:none; padding:0; margin:28px 0}
.post-card{padding:24px 0; border-top:1px solid var(--line)}
.post-card:last-child{border-bottom:1px solid var(--line)}
.post-card .date{font-family:"IBM Plex Mono",monospace; font-size:.78rem; color:var(--muted)}
.post-card h2{font-family:"Archivo",sans-serif; font-weight:700; font-size:1.4rem; margin:.4rem 0 .5rem}
.post-card h2 a{color:var(--ink)}
.post-card h2 a:hover{color:var(--ember); text-decoration:none}
.post-card p{margin:0 0 .6rem; color:var(--muted)}
.read{font-family:"IBM Plex Mono",monospace; font-size:.82rem}

/* footer */
.site-foot{border-top:1px solid var(--line); margin-top:40px; padding:32px 0; color:var(--muted); font-size:.85rem}
.site-foot a{color:var(--muted)}
.site-foot a:hover{color:var(--ember)}