/* v0.4.3 live: Newsy Elementor blocks -> compact native card grid (2/3/4 cols). Drafted by free coder model, reviewed. */
html body .ak-block .ak-block-posts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
html body .ak-block .ak-block-bottom-posts { display: grid; gap: 18px; }
html body .ak-block .ak-block-posts:has(.ak-block-bottom-posts) .ak-block-bottom-posts {
  display: contents;
}
html body .ak-block article.ak-module {
  position: static;
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  height: auto;
  background: var(--card);
  border: 2px solid var(--line);
  border-radius: var(--r);
  box-shadow: var(--sh);
}
html body .ak-block .ak-module-grid-wrap,
html body .ak-block .ak-module-details,
html body .ak-block .ak-featured-cover,
html body .ak-block .ak-featured-link {
  position: static;
  height: auto;
}
html body .ak-block .ak-module-grid-wrap { display: contents; }
html body .ak-block .ak-module-featured { position: relative; }
html body .ak-block .ak-featured-cover,
html body .ak-block .ak-featured-link { display: block; }
html body .ak-block .ak-featured-thumb {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  padding-bottom: 0 !important;
  overflow: hidden;
  background: var(--soft);
}
html body .ak-block .ak-featured-thumb img,
html body .ak-block .ak-featured-thumb [data-bgset] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-position: center;
  background-size: cover;
}
html body .ak-block .ak-module-details { padding: 12px 14px 14px; }
html body .ak-block .ak-module-title {
  display: -webkit-box;
  overflow: hidden;
  margin: 0 0 6px;
  color: var(--ink);
  font: 700 15px/1.3 "Bricolage Grotesque","Space Grotesk",system-ui,sans-serif;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
html body .ak-block .ak-module-title a { color: var(--ink); text-decoration: none; }
html body .ak-block .ak-module-title a:hover { color: var(--red); }
html body .ak-block .ak-module-meta { color: var(--muted); font: 12px var(--body); }
html body .ak-block .ak-module-author,
html body .ak-block .ak-module-summary,
html body .ak-block .ak-module-badges,
html body .ak-block .ak-module-comments,
html body .ak-block i.ak-icon,
html body .ak-block .ak-module-featured-meta { display: none; }
html body .ak-block .ak-module-terms.badge {
  position: absolute;
  z-index: 1;
  top: 8px;
  left: 8px;
}
html body .ak-block .ak-module-terms.badge a {
  display: inline-block;
  padding: 4px 8px;
  border-radius: var(--pill);
  background: var(--red);
  color: #fff;
  font: 700 10px/1 var(--body);
  text-decoration: none;
  text-transform: uppercase;
}
html body .ak-block .ak-pagination {
  margin: 24px 0;
  text-align: center;
}
html body .ak-block .ak-pagination-btn-load-more {
  display: inline-block;
  padding: 10px 20px;
  border: 2px solid var(--ink);
  border-radius: var(--pill);
  background: var(--red);
  box-shadow: var(--sh1);
  color: #fff;
  font: 700 14px var(--body);
  text-decoration: none;
  cursor: pointer;
}
html body .ak-block .ak-pagination-btn-load-more:hover {
  background: var(--red-dk);
}
html body .ak-block .ak-pagination-btn-loading,
html body .ak-block .ak-pagination-btn-no-more { display: none; }
html body .ak-block.is-loading .ak-pagination-btn-loading,
html body .ak-block.is-done .ak-pagination-btn-no-more { display: inline-block; }
html body .ak-block.is-done .ak-pagination-btn-load-more { display: none; }

@media (min-width: 760px) {
  html body .ak-block .ak-block-posts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1100px) {
  html body .ak-block .ak-block-posts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  html body .ak-block .ak-module-title { font-size: 16px; }
}

/* 2026-10-24 news grid fix: Newsy grid blocks are a mosaic again (grid_3 = 1 big + 4 small, grid_5 = 2 big).
   Big cards span 2 columns (and 2 rows from 760px), so 5 or 2 posts always fill whole rows. Specificity beats the
   page-level 3-column rule in ads-targets.css without touching that file. */
html body .ak-block.ak-block-grid .ak-block-inner .ak-block-posts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
html body .ak-block.ak-block-grid .ak-block-inner .ak-module-grid-big { grid-column: span 2; }
@media (min-width: 760px) {
  html body .ak-block.ak-block-grid .ak-block-inner .ak-block-posts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  html body .ak-block.ak-block-grid .ak-block-inner .ak-module-grid-big { grid-row: span 2; }
  html body .ak-block.ak-block-grid .ak-module-grid-big .ak-module-inner,
  html body .ak-block.ak-block-grid .ak-module-grid-big .ak-module-featured,
  html body .ak-block.ak-block-grid .ak-module-grid-big .ak-featured-cover,
  html body .ak-block.ak-block-grid .ak-module-grid-big .ak-featured-link { display: flex; flex: 1 1 auto; flex-direction: column; }
  html body .ak-block.ak-block-grid .ak-module-grid-big .ak-featured-thumb { flex: 1 1 auto; aspect-ratio: auto; min-height: 220px; }
  html body .ak-block.ak-block-grid .ak-module-grid-big .ak-module-title { font-size: 20px; }
}
