/* Blog index. Loaded after shared.css.

   Moved out of an inline <style> block in blog.html: inline CSS sits outside
   the shared.css → <page>.css order, is invisible to tools/stamp-assets.js, and
   has no wp_enqueue_style() equivalent in the WordPress port. */

/* ---------------------------------------------------------------------------
   PAGE-LOCAL LAYOUT — belongs in shared.css.
   .postcard, .link-more and .cnav are all shared components already; the only
   thing missing from the shared layer is the archive GRID that arranges them
   (and the two clamps that keep the four card rows aligned across a row, which
   the design draws with fixed 80px/50px boxes). Kept here rather than editing
   shared.css from this branch — see the build report's sharedGaps.
   In WordPress this is template-parts/post-grid.php's enqueued style.
--------------------------------------------------------------------------- */
.postlist{ margin-top: var(--section-y); }
.postlist__grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 60px var(--sp-5);          /* 24px gutter, 60px row gap — the artboard */
}
/* The artboard draws the card photo at 409x286; the shared .postcard ships
   16/10 for the homepage's shorter card. */
.postlist .postcard__img{ aspect-ratio: 409 / 286; }
/* The artboard fixes the date/title/excerpt/link boxes so the four rows line
   up across the three columns. Clamps + min-heights reproduce that without
   hard-coding a card height, so a long Hungarian compound cannot overflow. */
.postlist .postcard__title{
  min-height: calc(3 * var(--lh-head) * var(--t-h4));
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden;
  hyphens: auto; overflow-wrap: break-word;
}
.postlist .postcard__excerpt{
  min-height: calc(2 * var(--lh-snug) * var(--t-body-lg));
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
  flex: 0 0 auto;
  hyphens: auto; overflow-wrap: break-word;
}
.postlist .postcard__title a{ color: inherit; }
.postlist .postcard:hover .postcard__title a{ color: var(--primary-700); }
/* The whole card is clickable, but only the title is in the tab order — nine
   identical "Tovább" links would otherwise all read the same. */
.postlist .postcard{ position: relative; }
.postlist .postcard__title a::after{ content: ""; position: absolute; inset: 0; }

.postlist__pager{
  display: flex; justify-content: center;
  margin-top: 78px;
}
.postlist__pager .cnav{ gap: 15px; }

@media (max-width: 1180px){
  .postlist__grid{ grid-template-columns: repeat(2, 1fr); gap: 48px var(--sp-5); }
}
@media (max-width: 720px){
  .postlist__grid{ grid-template-columns: 1fr; gap: 40px; }
  /* below 720 the cards no longer sit beside each other, so the boxes that
     kept them aligned only truncate copy for no reason */
  .postlist .postcard__title,
  .postlist .postcard__excerpt{
    min-height: 0; display: block; -webkit-line-clamp: none; overflow: visible;
  }
}