/* Moiz Digital Solutions — Blog stylesheet, editorial redesign
   Ink #1C1B19 / Paper #F6F4EE / Paper-alt #ECE7D9 / Line #D6CFBB
   Olive accent #56624A / Brass accent #A9752E
   Display: Fraunces / Body: Source Serif 4 / Meta: IBM Plex Mono
*/

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,500;1,9..144,600&family=Source+Serif+4:ital,wght@0,400;0,500;0,600;1,400&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --ink:#1C1B19;
  --paper:#F6F4EE;
  --paper-alt:#ECE7D9;
  --line:#D6CFBB;
  --olive:#56624A;
  --brass:#A9752E;
  --stone:#6E6656;
  --max: 700px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Source Serif 4', Georgia, serif;
  font-size:18px;
  line-height:1.68;
  -webkit-font-smoothing:antialiased;
}

a{color:var(--ink); text-decoration-color:var(--brass); text-underline-offset:3px;}
a:hover{color:var(--brass);}
a:focus-visible, button:focus-visible{outline:2px solid var(--brass); outline-offset:3px;}

.kicker{
  font-family:'IBM Plex Mono', monospace; font-size:0.72rem; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--stone); margin:0;
}

/* ---------- Masthead (newspaper-style, no color hero band) ---------- */
.site-header{
  border-bottom:3px double var(--ink);
  background:var(--paper);
}
.site-header .top{
  max-width:1040px; margin:0 auto; padding:22px 24px 16px;
  text-align:center;
}
.site-header .top .kicker{letter-spacing:0.22em;}
.brand{
  display:block; font-family:'Fraunces', serif; font-style:italic; font-weight:500;
  font-size:2.1rem; color:var(--ink); text-decoration:none; margin:6px 0 0;
}
.brand:hover{color:var(--ink);}
.site-header .navrow{
  max-width:1040px; margin:0 auto; padding:12px 24px;
  border-top:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; gap:32px;
}
.nav-links{display:flex; gap:32px; align-items:center;}
.nav-links a{
  font-family:'IBM Plex Mono', monospace; font-size:0.78rem; letter-spacing:0.05em;
  text-transform:uppercase; color:var(--ink); text-decoration:none; font-weight:500;
}
.nav-links a:hover{color:var(--brass);}
.nav-links a.current{color:var(--brass); border-bottom:1px solid var(--brass); padding-bottom:3px;}
.nav-links a.nav-cta{
  border:1px solid var(--ink); padding:7px 14px; text-transform:none; font-family:'Source Serif 4', serif;
  font-size:0.85rem; font-style:italic;
}
.nav-links a.nav-cta:hover{background:var(--ink); color:var(--paper); border-color:var(--ink);}

/* ---------- Blog index ---------- */
.blog-hero{padding:52px 24px 8px; text-align:center;}
.blog-hero .wrap{max-width:640px; margin:0 auto;}
.blog-hero h1{
  font-family:'Fraunces', serif; font-weight:500; font-size:2.4rem; line-height:1.2;
  margin:12px 0 14px;
}
.blog-hero p{color:var(--stone); font-size:1.05rem; margin:0; font-style:italic;}

.blog-list{max-width:760px; margin:0 auto; padding:44px 24px 90px;}
.post-row{
  display:grid; grid-template-columns:44px 1fr; gap:20px;
  padding:26px 0; border-bottom:1px solid var(--line);
}
.post-row:first-child{padding-top:0;}
.post-num{font-family:'IBM Plex Mono', monospace; color:var(--line); font-size:1.4rem; padding-top:2px;}
.post-meta{font-family:'IBM Plex Mono', monospace; font-size:0.72rem; color:var(--stone); letter-spacing:0.03em; text-transform:uppercase;}
.post-meta .cat{color:var(--brass); font-weight:500;}
.post-title{
  font-family:'Fraunces', serif; font-weight:500; font-size:1.5rem; margin:8px 0 8px;
  color:var(--ink); line-height:1.3;
}
.post-title a{text-decoration:none;}
.post-title a:hover{color:var(--brass);}
.post-excerpt{color:var(--stone); font-size:0.98rem; margin:0; max-width:56ch; font-style:italic;}

@media (max-width:640px){
  .blog-hero h1{font-size:1.9rem;}
  .post-row{grid-template-columns:28px 1fr;}
}

/* ---------- Article page ---------- */
.article-hero{padding:48px 24px 8px; text-align:center; border-bottom:1px solid var(--line);}
.article-hero .wrap{max-width:var(--max); margin:0 auto; padding-bottom:36px;}
.article-hero .kicker .cat{color:var(--brass);}
.article-hero h1{
  font-family:'Fraunces', serif; font-weight:500; font-size:2.15rem; line-height:1.22;
  margin:16px 0 0;
}
.byline{
  max-width:var(--max); margin:22px auto 0; padding:0 24px;
  text-align:center; font-family:'IBM Plex Mono', monospace; font-size:0.76rem;
  color:var(--stone); text-transform:uppercase; letter-spacing:0.04em;
}

article.post-body{
  max-width:var(--max); margin:0 auto; padding:44px 24px 40px;
}
article.post-body > p:first-of-type::first-letter{
  font-family:'Fraunces', serif; font-weight:600; font-size:3.6rem; float:left;
  line-height:0.8; padding:8px 8px 0 0; color:var(--ink);
}
article.post-body p{margin:0 0 22px; color:#2A2822;}
article.post-body h2{
  font-family:'Fraunces', serif; font-style:italic; font-weight:500; font-size:1.5rem; color:var(--ink);
  margin:42px 0 16px; padding-top:2px;
}
article.post-body h3{
  font-family:'Fraunces', serif; font-weight:500; font-size:1.15rem; color:var(--ink);
  margin:28px 0 12px;
}
article.post-body ul, article.post-body ol{margin:0 0 22px; padding-left:22px; color:#2A2822;}
article.post-body li{margin-bottom:9px;}
article.post-body strong{color:var(--ink);}
article.post-body blockquote{
  border:none; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  margin:36px 0; padding:20px 8px; text-align:center;
  color:var(--ink); font-family:'Fraunces', serif; font-style:italic; font-size:1.25rem; line-height:1.5;
}

.cta-band{
  max-width:var(--max); margin:56px auto 0; padding:28px 26px;
  border:1px solid var(--ink); text-align:center;
}
.cta-band h3{font-family:'Fraunces', serif; font-style:italic; font-size:1.25rem; margin:0 0 8px; font-weight:500;}
.cta-band p{color:var(--stone); margin:0 0 18px; font-size:0.96rem;}
.cta-band a.btn{
  display:inline-block; background:var(--ink); color:var(--paper); padding:10px 22px;
  font-family:'IBM Plex Mono', monospace; font-size:0.8rem; letter-spacing:0.04em; text-transform:uppercase;
  text-decoration:none;
}
.cta-band a.btn:hover{background:var(--brass);}

.related{max-width:760px; margin:0 auto; padding:50px 24px 80px;}
.related h4{
  font-family:'IBM Plex Mono', monospace; font-size:0.72rem; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--stone); margin:0 0 18px; text-align:center;
  border-top:1px solid var(--line); padding-top:24px;
}
.related-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.related-grid a{
  display:block; padding:0; font-family:'Fraunces', serif; font-style:italic; font-size:1.02rem;
  color:var(--ink); text-decoration:none; line-height:1.4;
}
.related-grid a:hover{color:var(--brass);}
@media (max-width:640px){
  .related-grid{grid-template-columns:1fr; gap:18px;}
  .article-hero h1{font-size:1.65rem;}
}

/* ---------- Footer ---------- */
.site-footer{
  border-top:3px double var(--ink); padding:34px 24px; text-align:center;
  font-family:'IBM Plex Mono', monospace; font-size:0.76rem; color:var(--stone);
}
.site-footer .flinks{margin-top:12px;}
.site-footer .flinks a{color:var(--stone); margin:0 12px; text-decoration:none; text-transform:uppercase; letter-spacing:0.03em;}
.site-footer .flinks a:hover{color:var(--brass);}