/* =====================================================================
   1508 — Home Page Category Blocks. rp-UI white cards, 4 per row on desktop.
   Loaded by the catalog module (rp_home_blocks) via addStyle().
   ===================================================================== */
.rp-hblocks {
  --red:#db0f16; --red-dark:#b50c12; --ink:#1c1c1c; --muted:#6b6b68;
  --line:#e6e3de; --card:#ffffff; --bg-soft:#f4f2ee;
  font-family:'Outfit', sans-serif; margin:34px 0;
}
.rp-hblocks * { box-sizing:border-box; }

/* heading */
.rp-hblocks__head { text-align:center; max-width:760px; margin:0 auto 30px; }
.rp-hblocks__eyebrow { display:inline-block; font-size:13px; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:var(--red); margin:0 0 10px; }
.rp-hblocks__title { font-size:clamp(24px,2.6vw,34px); font-weight:800; line-height:1.1;
  letter-spacing:-.01em; color:var(--ink); margin:0; }
.rp-hblocks__intro { font-size:15px; line-height:1.6; color:var(--muted); margin:12px 0 0; }

/* grid: 4 -> 3 -> 2 -> 1 */
.rp-hblocks__grid { list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }

/* card */
.rp-hblocks__card { display:flex; flex-direction:column; height:100%;
  background:var(--card); border:1px solid var(--line); border-radius:16px; overflow:hidden;
  text-decoration:none; color:inherit; transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
a.rp-hblocks__card:hover { transform:translateY(-4px); box-shadow:0 16px 34px rgba(28,28,28,.10); border-color:#dcd7cf; }

.rp-hblocks__media { display:block; width:100%; aspect-ratio:5 / 4; overflow:hidden; background:var(--bg-soft); }
.rp-hblocks__media img { width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .4s ease; }
a.rp-hblocks__card:hover .rp-hblocks__media img { transform:scale(1.05); }

.rp-hblocks__name { display:block; text-align:center; font-size:17px; font-weight:700; line-height:1.28;
  color:var(--ink); padding:20px 18px 6px; }

.rp-hblocks__btn { align-self:center; margin:14px 0 22px; display:inline-flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--red);
  padding:9px 20px; border:2px solid var(--red); border-radius:999px; transition:background .15s, color .15s; }
a.rp-hblocks__card:hover .rp-hblocks__btn { background:var(--red); color:#fff; }

/* push the button to the bottom so uneven titles still align the CTA */
.rp-hblocks__name { flex:1 1 auto; }

@media (max-width:1024px){ .rp-hblocks__grid { grid-template-columns:repeat(3,1fr); gap:22px; } }
@media (max-width:720px){  .rp-hblocks__grid { grid-template-columns:repeat(2,1fr); gap:18px; }
  .rp-hblocks__name { font-size:15.5px; padding:16px 14px 4px; } }
@media (max-width:460px){  .rp-hblocks__grid { grid-template-columns:1fr; } }
