/* HOMEPAGE HERO — extra breathing room below the fixed header.
   Other pages (browse-by-page, news-details) get this spacing for free
   from their breadcrumb strip sitting above .hero-zone; the homepage's
   hero-zone is the first element after the header, so it needs its own
   top padding on top of the header-clearing offset. */
.hero-zone{padding-top:calc(var(--header-offset, 105px) + 56px);}

/* CTA "Student Clubs" card — overlapping stacks of real, linked club logos
   (5 per row), fetched live from /api/clubs/ (see index.js). Each row
   scrolls horizontally (scrollbar hidden) if it doesn't all fit. */
.cta-club-logos{display:flex;flex-direction:column;gap:10px;margin:14px 0;}
.cta-club-logos-row{display:flex;flex-wrap:nowrap;align-items:center;overflow-x:auto;padding:8px 4px;scrollbar-width:none;}
.cta-club-logos-row::-webkit-scrollbar{display:none;}
.cta-club-logos-row a{
  display:block;width:100px;height:100px;min-width:100px;border-radius:50%;flex-shrink:0;
  border:3px solid var(--surface);box-shadow:0 4px 10px rgba(0,0,0,0.15);
  background:var(--paper-2);overflow:hidden;position:relative;z-index:1;
  margin-left:-34px;transition:transform .2s ease,box-shadow .2s ease;
}
.cta-club-logos-row a:first-child{margin-left:0;}
.cta-club-logos-row a:hover{transform:translateY(-6px) scale(1.08);box-shadow:0 10px 20px rgba(0,0,0,0.22);z-index:5;}
.cta-club-logos-row img{width:100%;height:100%;object-fit:cover;display:block;}