/* Approved catalogue layout, shared by homepage and related mushroom carousels. */
.gm-related {
  --pale: #f5f9fc;
  --blue: #4988f3;
  --shadow: 0 0 21px rgba(217, 224, 234, .55);
  color: #000;
}
.gm-related .surface {
  position: relative;
  border: 0 solid transparent;
  border-radius: var(--radius, 20px);
  isolation: isolate;
}
.gm-related .surface > .surface-contour {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
  overflow: visible;
}
.gm-related .surface:not(img) > :not(.surface-contour) { z-index: 1; }
.gm-related .icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  vertical-align: middle;
  pointer-events: none;
}
.gm-related .mushroom-card {
  width: 100%;
  min-width: 0;
  flex: none;
  color: inherit;
  text-decoration: none;
}
body .gm-home .mushroom-copy h3,
body.gm-mushroom-fonts .gm-related .mushroom-copy h3 {
  font-family: "Graphik Compact", Arial, sans-serif;
  font-weight: 400;
  margin: 0;
  text-transform: none;
  letter-spacing: normal;
}

/* Round the actual photo rather than only the larger letterboxed frame. */
:is(.gm-home,.gm-related) .mushroom-image {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 204px;
  max-width: calc(100% - 20px);
  height: auto;
  aspect-ratio: 1;
  align-self: center;
}
:is(.gm-home,.gm-related) .mushroom-image img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  flex: none;
  object-fit: contain;
}

/* Figma: fixed square photo, bottom text group; row height follows its fullest card. */
:is(.gm-home,.gm-related) .mushroom-card {
  height: auto;
  justify-content: space-between;
  gap: 0;
  margin: 0;
}
:is(.gm-home,.gm-related) .mushroom-copy {
  flex: none;
  margin-top: 10px;
}
:is(.gm-home,.gm-related) .mushroom-copy .more { margin: 0; }

:is(.gm-home,.gm-related) .card-badges:empty { display: none; }

@media (max-width: 620px) {
  :is(.gm-home,.gm-related) .mushroom-image { width: 150px; max-width: calc(100% - 16px); }
  :is(.gm-home,.gm-related) .mushroom-copy { margin-top: 12px; }
}

/* Stretch each related slide around its fixed photo and bottom copy group. */
.gm-related .splide__list { align-items: stretch; }
.gm-related .mushroom-related__slide { display: flex; height: auto; }
.gm-related .mushroom-card { height: 100%; font-family: "Graphik Compact", Arial, sans-serif; font-weight: 400; }

/* A single featured story has no carousel navigation. */
.gm-home .featured:is([data-featured-count="0"],[data-featured-count="1"]) :is(.featured-prev,.featured-next,.featured-dots) { display: none; }
