/* Blog styles — extends main site design system */
:root{
  --limestone:#EFEAE0;
  --jungle:#13241A;
  --canopy:#2F5C41;
  --cave:#0A0D0B;
  --ochre:#C8902F;
  --stone-line:#D8D0C0;
  --max:800px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Archivo',sans-serif;background:var(--limestone);color:var(--jungle);line-height:1.75;font-size:17px}
::selection{background:var(--ochre);color:var(--cave)}
img{max-width:100%;display:block}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}

/* Typography */
h1,h2,h3{font-family:'Gloock',serif;font-weight:400;line-height:1.15;letter-spacing:-0.01em}
h1{font-size:clamp(2rem,5vw,3.2rem);margin-bottom:1rem}
h2{font-size:clamp(1.6rem,3.5vw,2.2rem);margin:2.5rem 0 1rem}
h3{font-size:1.2rem;margin:1.5rem 0 0.75rem}
.mono{font-family:'IBM Plex Mono',monospace;font-size:0.78rem;letter-spacing:0.12em;text-transform:uppercase}
.eyebrow{color:var(--canopy);margin-bottom:12px}
p{margin-bottom:1.2em}
a{color:var(--canopy);text-decoration:underline;text-underline-offset:3px}
a:hover{color:var(--ochre)}
ul,ol{margin:0 0 1.5em 1.5em}
li{margin-bottom:0.5em}
blockquote{border-left:3px solid var(--ochre);padding-left:1.2em;margin:1.5em 0;color:#3a5a44;font-style:italic}
strong{font-weight:600}

/* Header */
.blog-header{background:var(--jungle);color:var(--limestone);padding:40px 0 32px;border-bottom:4px solid var(--ochre)}
.blog-header h1{color:var(--limestone);margin-bottom:8px}
.blog-header .mono{color:var(--ochre)}
.back-link{display:inline-block;margin-top:16px;color:rgba(239,234,224,.75);text-decoration:none;font-family:'IBM Plex Mono',monospace;font-size:0.82rem;letter-spacing:0.1em;text-transform:uppercase}
.back-link:hover{color:var(--ochre)}

/* Article card (index page) */
.article-list{padding:64px 0}
.article-card{padding:32px 0;border-bottom:1px solid var(--stone-line)}
.article-card:first-child{padding-top:0}
.article-card h2{font-size:clamp(1.4rem,3vw,1.8rem);margin:0 0 8px}
.article-card h2 a{color:var(--jungle);text-decoration:none}
.article-card h2 a:hover{color:var(--ochre)}
.article-card .mono{color:var(--canopy);display:block;margin-bottom:8px}
.article-card p{opacity:.85;margin-bottom:0}

/* Article page */
.article-body{padding:48px 0 64px}
.article-meta{padding:20px 0;border-bottom:1px solid var(--stone-line);margin-bottom:32px}
.article-meta .mono{color:var(--canopy)}
.article-body h2:first-of-type{margin-top:0}
.article-body img{border:1px solid var(--stone-line);margin:2rem 0}

/* CTA box */
.cta-box{background:var(--jungle);color:var(--limestone);padding:32px 28px;margin:48px 0;border-left:4px solid var(--ochre)}
.cta-box h3{color:var(--ochre);margin-top:0}
.cta-box p{opacity:.9;margin-bottom:1em}
.cta-box .btn{display:inline-block;font-family:'IBM Plex Mono',monospace;font-size:0.82rem;letter-spacing:0.1em;text-transform:uppercase;text-decoration:none;padding:14px 24px;background:var(--ochre);color:var(--cave);margin-top:8px}
.cta-box .btn:hover{background:transparent;color:var(--ochre);outline:1.5px solid var(--ochre)}

/* Footer */
.blog-footer{background:var(--cave);color:rgba(239,234,224,.5);padding:28px 0;font-size:.82rem;text-align:center}
.blog-footer a{color:rgba(239,234,224,.7)}
