/* wgf-home-news.css - the front-page WoW News board (wgf_home_news.py, owner 2026-10-31).
   Lives inside the home command column (.hm-cmd__main, ~780px) in the standard .wgf-window
   .hm-board frame. Story cards are whole-card links with a 16:9 picture plate, a kind chip, the
   title and a dateline; the lead card is twice the size and carries the deck. Palette = the
   tokens only (docs/ui-ux/17-blizzard-palette.md: no green chrome, no pills, no emoji).
   Bump wgf_home_news.CSS_VERSION on any edit. */
.hm-news .hp-head{align-items:baseline}
.hm-news .hm-board__more{flex:0 0 auto;font-family:var(--font-game);font-size:var(--text-sm,.875rem);color:var(--wgf-gold-link,var(--wgf-gold));text-decoration:none;white-space:nowrap}
.hm-news .hm-board__more:hover{color:var(--wgf-gold-bright);text-decoration:underline}

/* The grid: 3 columns; the lead spans 2x2, five more fill the rest. */
.hm-news__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(0,auto);gap:var(--space-3,12px)}
.hm-news__card{
  grid-column:span 1;display:flex;flex-direction:column;min-width:0;color:inherit;text-decoration:none;
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(0,0,0,.28)),var(--wgf-plate,#15161b);
  border:1px solid var(--wgf-metal-soft,rgba(160,150,120,.35));border-radius:4px;overflow:hidden;
  transition:border-color .15s ease,transform .15s ease;
}
.hm-news__card:hover,.hm-news__card:focus-visible{border-color:var(--wgf-gold-bright);outline:none}
.hm-news__card:focus-visible{box-shadow:var(--focus-ring)}
.hm-news__card--lead{grid-column:span 2;grid-row:span 2}

/* Picture plate: fixed 16:9 so the grid never shifts while images load. */
.hm-news__media{display:block;position:relative;aspect-ratio:16/9;background:var(--wgf-plate-deep,#0e0f13);overflow:hidden}
.hm-news__media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .25s ease}
.hm-news__card:hover .hm-news__media img{transform:scale(1.03)}
/* No publisher picture: the first-party stone plate with the kind set in the game face. */
.hm-news__media--plate{
  display:flex;align-items:center;justify-content:center;
  background:
    linear-gradient(180deg,rgba(0,0,0,.25),rgba(0,0,0,.55)),
    var(--wgf-guide-surface,url("/assets/ui/classhall-stone-tile.png") center/256px repeat);
}
.hm-news__plate-kind{font-family:var(--font-game);font-size:clamp(1rem,2.4vw,1.5rem);font-variant:small-caps;letter-spacing:.06em;color:var(--wgf-gold)}

/* Body: chip, title, (deck), meta. */
.hm-news__body{display:flex;flex-direction:column;gap:var(--space-1,4px);padding:var(--space-2,8px) 12px var(--space-3,12px);min-width:0}
.hm-news__kind{
  align-self:flex-start;font-family:var(--font-game);font-size:10.5px;font-variant:small-caps;letter-spacing:.06em;line-height:1.3;
  padding:1px 6px;border:1px solid var(--wgf-metal-soft,rgba(160,150,120,.35));border-radius:2px;color:var(--wgf-gold-muted,var(--wgf-gold));
}
.hm-news__card--k-hotfixes .hm-news__kind,.hm-news__card--k-build .hm-news__kind{color:var(--wgf-gold-bright);border-color:var(--wgf-gold-dim,var(--wgf-gold))}
.hm-news__title{font-family:var(--font-game);font-weight:700;font-size:var(--text-base,1rem);line-height:1.3;color:var(--wgf-gold-link,var(--wgf-gold));display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hm-news__card--lead .hm-news__title{font-size:var(--text-xl,1.3rem);-webkit-line-clamp:2}
.hm-news__card:hover .hm-news__title{color:var(--wgf-gold-bright)}
.hm-news__deck{font-size:var(--text-sm,.875rem);line-height:1.45;color:var(--wgf-ink-soft,rgba(230,222,200,.8));display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hm-news__meta{display:flex;gap:var(--space-2,8px);align-items:baseline;flex-wrap:wrap;margin-top:auto;padding-top:var(--space-1,4px);font-size:var(--text-xs,.75rem);color:var(--wgf-ink-muted,rgba(230,222,200,.6))}
.hm-news__src{font-family:var(--font-game);font-variant:small-caps;letter-spacing:.04em}

/* Blue posts strip under the cards (rows are blue_tracker_render's .wgf-blue, styled in
   wgf-news-panels.css; only the heading is ours). */
.hm-news__blue{margin-top:var(--space-4,16px);padding-top:var(--space-3,12px);border-top:1px solid var(--wgf-metal-soft,rgba(160,150,120,.35))}
.hm-news__h{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3,12px);margin:0 0 var(--space-2,8px);font-family:var(--font-game);font-size:var(--text-base,1rem);font-variant:small-caps;letter-spacing:.05em;color:var(--wgf-gold)}
.hm-news__h-link{font-size:var(--text-sm,.875rem);font-variant:normal;letter-spacing:0;color:var(--wgf-gold-link,var(--wgf-gold));text-decoration:none}
.hm-news__h-link:hover{color:var(--wgf-gold-bright);text-decoration:underline}

/* Narrow column (the command grid collapses to one column under 900px): two columns, then one. */
@media (max-width:640px){
  .hm-news__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hm-news__card--lead{grid-column:span 2;grid-row:auto}
}
@media (max-width:440px){
  .hm-news__grid{grid-template-columns:minmax(0,1fr)}
  .hm-news__card--lead{grid-column:auto}
}