/* Anchor target for /partners, which redirects to /#partners. The site header
   (.cust-nav) is Bootstrap .fixed-top at 78px, so the jump has to clear that
   or it lands with the heading behind the header. The admin bar occludes a
   further 32px for logged-in users, 46px on small screens. */
#partners {
  scroll-margin-top: 11rem;
}

.admin-bar #partners {
  scroll-margin-top: 14.2rem;
}

@media (max-width: 782px) {
  .admin-bar #partners {
    scroll-margin-top: 15.6rem;
  }
}

/* Partner logo tiles (home page).
   Logos are cropped to their artwork, so one rule sizes them consistently:
   wide wordmarks hit the width cap, stacked marks hit the height cap. */
.partner-section {
  padding-bottom: 2rem;
}

.partner-tiles {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2.5rem;
  max-width: 86rem;
  margin: 0 auto;
}

.partner-tile {
  position: relative;
  flex: 0 0 24rem;
  height: 15rem;
  background: #fff;
  border: 1px solid #F5F5F5;
  box-shadow: 0 5px 25px #52575D0F;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2.5rem;
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.partner-tile:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 30px #52575D1F;
}

/* Only rendered on tiles that actually link somewhere - an arrow on an inert
   tile promises a destination that is not there yet. */
.partner-arrow {
  position: absolute;
  bottom: 1.2rem;
  right: 1.4rem;
  width: 2.2rem;
  height: auto;
  opacity: 0.85;
}

.partner-tile:hover .partner-arrow {
  opacity: 1;
}

.partner-tile .partner-logo {
  max-width: 15rem;
  max-height: 5.5rem;
  width: auto;
  height: auto;
  object-fit: contain;
}



@media (max-width: 575px) {
  .partner-tile {
    flex: 0 0 100%;
  }
}
