






/* Insights, the list (sitemap 07): the line beside the featured article on an Ink card with its image, then every other article as image cards in one grid, newest first, then the close.
   The 12 articles are the live OCT Digest's (references/insights, read 17-Oct-26). No images: none of the live ones passes the photo rules.
   No topic filter: every article sits in one category, Back Office, so any topic would be invented. */
.il .wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(28px,5vw,96px);align-items:center}
.il .hx1{max-width:8em}
.il .lead{margin-top:clamp(16px,2.6svh,24px);max-width:24em}

/* the typographic card: the title on an Ink field, one organism field cropped past the edge (BB p.32, one field per composition) */
.tc{position:relative;overflow:hidden;border-radius:var(--r);background:var(--ink);color:var(--paper);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr)}
/* the featured image fills the card's left side, the words sit on plain Ink */
.tc .timg{display:block;width:100%;height:100%;min-height:100%;aspect-ratio:4/3;object-fit:cover}
.tc .tx{padding:clamp(24px,4.4svh,44px) clamp(24px,3vw,48px);align-self:center}
.tc .meta{display:flex;flex-wrap:wrap;gap:6px 16px;font-family:var(--mono);font-size:12.5px;color:#D1E1EA}
.tc h2{margin-top:clamp(14px,2.6svh,22px);max-width:16em;font-weight:600;font-size:clamp(26px,min(2.6vw,5svh),42px);line-height:1.08;letter-spacing:-.03em}
.tc p{margin-top:clamp(12px,2svh,16px);max-width:30em;color:#D9E6EE;font-size:var(--lead);line-height:1.5;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.tc .link{display:inline-flex;align-items:center;gap:8px;margin-top:clamp(18px,3svh,28px);color:var(--paper)}
.tc .link svg{width:14px;height:14px;fill:currentColor}
.tc .link:hover{color:var(--marine-tint)}

/* every other article: one grid of image cards, newest first, the date on every card */
.post .dl{display:inline-flex;align-items:center;gap:8px;margin-top:8px;align-self:flex-start;font-size:14.5px}
.post .dl svg{width:14px;height:14px;fill:currentColor}

/* close: the Ink close of Industries */
.ccl{padding:var(--sec-y) 0}
.ccl .wrap{grid-template-columns:minmax(0,7fr) minmax(0,4fr);align-items:end}
.ccl h2{white-space:normal!important;max-width:12em}
.ccl .btn{margin-top:clamp(20px,3.4svh,34px)}

@media (max-width:1100px){.posts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  .tc{grid-template-columns:1fr}
  .tc .timg{height:auto}
  .il .wrap,.ccl .wrap{grid-template-columns:1fr;gap:28px}
  .posts{grid-template-columns:1fr}
  .post p{-webkit-line-clamp:3}
  }
