/*
 * Image text block cards: flat cards per the design. The theme's global
 * .card chrome (radius, shadow, margin, hover scale) is reset here, and the
 * link uses body ink with a circled arrow icon.
 */

.ergostil-card-set .card {
  margin-right: 0;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
  transform: none;
}

.ergostil-card-set .card:hover {
  box-shadow: none;
  transform: none;
}

/* Clip the image to the ratio box so rounded corners apply. */
.ergostil-card-set__media {
  overflow: hidden;
}

.ergostil-card-set .card-body {
  padding: 0;
  margin-top: 1rem;
}

/* The link row is ~24px tall (arrow + text). Padding+margin compensation
   leaves a residual line-box shift (~4px), so the 44px tap target is grown
   with an absolutely positioned pseudo-element instead: it extends the hit
   area 10px above/below the link box without participating in layout, and
   the card stays pixel-identical. */
.ergostil-card-set__link {
  position: relative;
  color: var(--beo-body-color);
}

.ergostil-card-set__link::before {
  content: "";
  position: absolute;
  inset: -10px 0;
}

.ergostil-card-set__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 1.25rem;
  height: 1.25rem;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: 1rem;
  line-height: 1;
}
