/* Fine Line — blog index and post layout.
   Shares the site palette: amber #FCB12B is the only accent. */
*{margin:0;padding:0;box-sizing:border-box}
.blog-main{flex:1;max-width:1240px;width:100%;margin:0 auto;padding:0 clamp(20px,4vw,48px);}
.blog-head{padding:clamp(48px,7vw,86px) 0 clamp(26px,4vw,40px);border-bottom:1px solid rgba(26,25,23,.15);}
/* Amber carries the accent as a rule rather than as the text itself: amber type on the
   cream background does not reach the contrast threshold, and the accepted exceptions on
   About and Campaigns are not a licence to add more. */
.blog-kicker{display:flex;align-items:center;gap:10px;font:600 11px/1 'IBM Plex Mono',monospace;letter-spacing:.18em;text-transform:uppercase;color:#57534A;margin-bottom:16px;}
.blog-kicker::before{content:'';flex:none;width:24px;height:3px;background:#FCB12B;}
.blog-h1{margin:0;font:400 clamp(34px,6vw,60px)/1.04 'Anton',sans-serif;letter-spacing:.02em;text-transform:uppercase;color:#1A1917;}
.blog-lede{margin:18px 0 0;max-width:70ch;font:400 clamp(15px,1.6vw,17px)/1.7 'Archivo',sans-serif;color:#57534A;}

/* index listing */
.blog-list{list-style:none;margin:0;padding:0;display:grid;gap:0;}
.blog-item{border-bottom:1px solid rgba(26,25,23,.12);}
.blog-item a{display:grid;grid-template-columns:150px 1fr;gap:clamp(16px,3vw,34px);align-items:baseline;padding:26px 0;text-decoration:none;color:inherit;}
.blog-date{font:500 11px/1.6 'IBM Plex Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:#6E6A60;}
.blog-item h2{margin:0 0 7px;font:600 clamp(17px,2vw,21px)/1.35 'Archivo',sans-serif;color:#1A1917;}
.blog-item p{margin:0;max-width:68ch;font:400 14.5px/1.7 'Archivo',sans-serif;color:#57534A;}
.blog-tag{display:inline-block;margin-top:10px;font:600 10px/1 'IBM Plex Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#6E6A60;border:1px solid rgba(26,25,23,.22);padding:6px 9px;}
@media (hover:hover) and (pointer:fine){
  .blog-item a:hover h2{color:#FCB12B;}
}
.blog-item a:focus-visible{outline:2px solid #FCB12B;outline-offset:3px;}
@media(max-width:640px){
  .blog-item a{grid-template-columns:1fr;gap:8px;}
}

/* post body */
.post-body{max-width:72ch;padding:clamp(30px,5vw,48px) 0 10px;}
.post-body h2{margin:40px 0 14px;font:400 clamp(22px,3vw,30px)/1.2 'Anton',sans-serif;letter-spacing:.02em;text-transform:uppercase;color:#1A1917;}
.post-body h3{margin:28px 0 10px;font:600 16.5px/1.45 'Archivo',sans-serif;color:#1A1917;}
.post-body p,.post-body li{font:400 15.5px/1.8 'Archivo',sans-serif;color:#43403A;}
.post-body ul{padding-left:22px;margin:14px 0;}
.post-body li{margin:7px 0;}
.post-body a{color:#1A1917;border-bottom:1px solid #FCB12B;text-decoration:none;padding-bottom:1px;}
.post-body strong{color:#1A1917;}
.post-note{margin:24px 0;padding:18px 20px;background:#F7F4EC;border-left:4px solid #FCB12B;font:400 14.5px/1.75 'Archivo',sans-serif;color:#57534A;}

/* calls to action */
.post-cta{display:flex;flex-wrap:wrap;gap:14px;margin:34px 0 8px;}
.post-cta a{display:inline-flex;align-items:center;height:48px;padding:0 22px;font:600 12px/1 'IBM Plex Mono',monospace;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border:1px solid #1A1917;color:#1A1917;white-space:nowrap;}
.post-cta a.primary{background:#FCB12B;border-color:#FCB12B;color:#1A1917;}
@media (hover:hover) and (pointer:fine){
  .post-cta a:hover{background:#1A1917;color:#F1EDE4;border-color:#1A1917;}
  .post-cta a.primary:hover{background:#1A1917;color:#FCB12B;}
}

/* on-page FAQ */
.post-faq{margin:16px 0 40px;display:grid;gap:10px;}
.post-faq details{background:#F7F4EC;border:1px solid rgba(26,25,23,.1);border-left:4px solid #FCB12B;}
.post-faq summary{cursor:pointer;padding:16px 20px;font:600 15px/1.45 'Archivo',sans-serif;color:#1A1917;}
.post-faq h3{margin:0;display:inline;font:inherit;color:inherit;}
.post-faq div{padding:0 20px 18px;font:400 14.5px/1.75 'Archivo',sans-serif;color:#57534A;}
.post-meta{padding:8px 0 0;font:500 11px/1.7 'IBM Plex Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:#6E6A60;}
.post-back{display:inline-block;margin:26px 0 60px;font:600 11px/1 'IBM Plex Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:#1A1917;text-decoration:none;border-bottom:1px solid #FCB12B;padding-bottom:3px;}
