
/* Recipe Hub tidy-up.
   1. Recipe cards become small SQUARE tiles: a 1:1 image with a compact caption,
      sized so a row holds more of them and every card is the same height.
   2. Heading scale fixed. Recipe titles were 25.6px against 29.6px section
      headings — near enough to read as equals, so the page had no hierarchy.
      Section h2 stays the anchor; card titles drop well below it. */

/* ---------- square recipe tiles ---------- */
#page-recipe-hub .rd-trend-side{
  /* 2x2 beside the feature card. Four-across squeezed the tiles to 96px at 1440,
     and auto-fill wrapped to a second row and made the page taller — 2x2 gives
     ~200px square tiles and keeps the section to one block */
  grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  gap:12px !important;
  align-items:stretch;          /* equalise each row rather than letting titles ragged them */
}
#page-recipe-hub .rd-trend-side .rd-card{ border-radius:16px !important; height:100%; }
#page-recipe-hub .rd-trend-side .rd-card .rd-img{ aspect-ratio:1 / 1 !important; }
#page-recipe-hub .rd-trend-side .rd-card-b{ padding:10px 11px 12px !important; gap:3px !important; }
/* the category eyebrow is dropped in the tiles — the square image plus title and
   time is enough, and it keeps the card close to square */
#page-recipe-hub .rd-trend-side .rd-cat{ display:none !important; }
#page-recipe-hub .rd-trend-side .rd-title{
  font-size:.88rem !important; line-height:1.25 !important;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
#page-recipe-hub .rd-trend-side .rd-meta{ font-size:.72rem !important; gap:8px !important; }
/* the 2-line clamp left 1-line titles 17px shorter, so rows looked ragged */
#page-recipe-hub .rd-trend-side .rd-title{ min-height:2.2em; }
/* meta was wrapping to two lines on some cards, leaving rows 5px uneven */
#page-recipe-hub .rd-trend-side .rd-meta{
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block;
}
#page-recipe-hub .rd-trend-side .rd-save{ width:34px !important; height:34px !important; font-size:.8rem !important; }

/* ---------- heading scale ---------- */
#page-recipe-hub .rd-feature .rd-title{
  font-size:clamp(1.05rem, 1.5vw, 1.3rem) !important;   /* was 25.6px, now well under the h2 */
}
#page-recipe-hub .rd-side-card .rd-title{ font-size:.92rem !important; }
#page-recipe-hub .rd-compact .rd-title{ font-size:.86rem !important; }
#page-recipe-hub .rd-gk-dish b{ font-size:.88rem !important; }

/* the section headings keep a single consistent size and rhythm */
#page-recipe-hub #rdDisc .rd-h2,
#page-recipe-hub #rdExplore .rd-h2{
  font-size:clamp(1.25rem, 2vw, 1.6rem) !important;
  line-height:1.18 !important;
  margin-bottom:6px !important;
}
#page-recipe-hub .rd-sub{ margin-bottom:14px !important; }

/* ---------- tighter vertical rhythm ---------- */
#page-recipe-hub #rdDisc .rd-sec{ padding-block:clamp(26px, 3.6vw, 44px) !important; }

@media (max-width:1024px){
  #page-recipe-hub .rd-trend-side{ grid-template-columns:repeat(4, minmax(0,1fr)) !important; }
}
@media (max-width:640px){
  #page-recipe-hub .rd-trend-side{ grid-template-columns:repeat(2, minmax(0,1fr)) !important; }
}
