/* ==========================================================================
   Block: Image Card Grid
   ========================================================================== */
.spektrix-image-card-grid {
  --spektrix-image-card-grid-gap: var(--wp--style--block-gap, 1.5rem);
  --spektrix-image-card-grid-wide-size: var(--wp--style--global--wide-size, 1200px);
  --spektrix-image-card-grid-content-size: var(--wp--style--global--content-size, 800px);
  --spektrix-image-card-grid-radius: 24px;
  --spektrix-image-card-grid-image-radius: 12px;
  --spektrix-image-card-grid-media-size: 407px;
  --spektrix-image-card-grid-media-inset: 40px;
  --spektrix-image-card-grid-image-max-width: 327px;
  --spektrix-image-card-grid-image-max-height: 306px;
  --spektrix-image-card-grid-content-gap: 1.5rem;
  background-color: var(--wp--preset--color--white);
  padding: calc(var(--spektrix-image-card-grid-gap) * 2.75) var(--spektrix-image-card-grid-gap);
}
.spektrix-image-card-grid.spektrix-block-spacing--pt-compact {
  padding-top: calc(var(--spektrix-image-card-grid-gap) * 1.5);
}
.spektrix-image-card-grid.spektrix-block-spacing--pt-comfortable {
  padding-top: calc(var(--spektrix-image-card-grid-gap) * 2);
}
.spektrix-image-card-grid.spektrix-block-spacing--pt-spacious {
  padding-top: calc(var(--spektrix-image-card-grid-gap) * 4);
}
.spektrix-image-card-grid.spektrix-block-spacing--pt-extra-spacious {
  padding-top: calc(var(--spektrix-image-card-grid-gap) * 5);
}
.spektrix-image-card-grid.spektrix-block-spacing--pt-maximum {
  padding-top: calc(var(--spektrix-image-card-grid-gap) * 6);
}
.spektrix-image-card-grid.spektrix-block-spacing--pt-none {
  padding-top: 0;
}
.spektrix-image-card-grid.spektrix-block-spacing--pb-compact {
  padding-bottom: calc(var(--spektrix-image-card-grid-gap) * 1.5);
}
.spektrix-image-card-grid.spektrix-block-spacing--pb-comfortable {
  padding-bottom: calc(var(--spektrix-image-card-grid-gap) * 2);
}
.spektrix-image-card-grid.spektrix-block-spacing--pb-spacious {
  padding-bottom: calc(var(--spektrix-image-card-grid-gap) * 4);
}
.spektrix-image-card-grid.spektrix-block-spacing--pb-extra-spacious {
  padding-bottom: calc(var(--spektrix-image-card-grid-gap) * 5);
}
.spektrix-image-card-grid.spektrix-block-spacing--pb-maximum {
  padding-bottom: calc(var(--spektrix-image-card-grid-gap) * 6);
}
.spektrix-image-card-grid.spektrix-block-spacing--pb-none {
  padding-bottom: 0;
}
.spektrix-image-card-grid__container {
  width: 100%;
  max-width: min(100%, var(--spektrix-image-card-grid-wide-size));
  margin: 0 auto;
}
.spektrix-image-card-grid__header {
  max-width: var(--spektrix-image-card-grid-content-size);
  margin: 0 auto calc(var(--spektrix-image-card-grid-gap) * 2.5);
  text-align: center;
}
.spektrix-image-card-grid__heading {
  max-width: 48rem;
  margin: 0 auto var(--spektrix-image-card-grid-gap);
  color: var(--wp--preset--color--text-dark);
}
.spektrix-image-card-grid__intro {
  max-width: 44rem;
  margin: 0 auto;
  color: var(--wp--preset--color--text-dark);
}
.spektrix-image-card-grid__intro p {
  margin: 0;
}
.spektrix-image-card-grid__items {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spektrix-image-card-grid-gap);
  margin: 0;
  padding: 0;
  list-style: none;
}
.spektrix-image-card-grid__item {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: stretch;
  gap: var(--spektrix-image-card-grid-content-gap);
}
.spektrix-image-card-grid__media {
  display: flex;
  width: 100%;
  max-width: var(--spektrix-image-card-grid-media-size);
  aspect-ratio: 1/1;
  align-items: center;
  justify-content: center;
  padding: var(--spektrix-image-card-grid-media-inset);
  background-color: var(--wp--preset--color--bright-bg, #F1F1F1);
  border-radius: var(--spektrix-image-card-grid-radius);
}
.spektrix-image-card-grid__media--bg-bright-bg {
  background-color: var(--wp--preset--color--bright-bg);
}
.spektrix-image-card-grid__media--bg-white {
  background-color: var(--wp--preset--color--white);
}
.spektrix-image-card-grid__media--bg-accent-lime-100 {
  background-color: var(--wp--preset--color--accent-lime-100);
}
.spektrix-image-card-grid__media--bg-accent-pink-100 {
  background-color: var(--wp--preset--color--accent-pink-100);
}
.spektrix-image-card-grid__media--bg-accent-blue-100 {
  background-color: var(--wp--preset--color--accent-blue-100);
}
.spektrix-image-card-grid__media--bg-accent-lime {
  background-color: var(--wp--preset--color--accent-lime);
}
.spektrix-image-card-grid {
  /* Shrink-wrap the photo so the credit chip sits on the image, not the padded media frame. */
}
.spektrix-image-card-grid__image {
  display: block;
  width: fit-content;
  max-width: 100%;
  height: fit-content;
  max-height: 100%;
  margin: 0;
}
.spektrix-image-card-grid__image-element {
  display: block;
  width: auto;
  height: auto;
  max-width: min(100%, var(--spektrix-image-card-grid-image-max-width));
  max-height: min(100%, var(--spektrix-image-card-grid-image-max-height));
  object-fit: contain;
  border-radius: var(--spektrix-image-card-grid-image-radius);
}
.spektrix-image-card-grid__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  max-width: var(--spektrix-image-card-grid-media-size);
  padding: 0;
}
.spektrix-image-card-grid__card-title {
  margin: 0 0 calc(var(--spektrix-image-card-grid-gap) * 0.75);
  color: var(--wp--preset--color--text-dark);
}
.spektrix-image-card-grid__card-body {
  margin: 0;
  color: var(--wp--preset--color--text-dark);
}
.spektrix-image-card-grid__card-body p {
  margin: 0;
}
.spektrix-image-card-grid__card-body p + p {
  margin-top: 1em;
}
.spektrix-image-card-grid__link {
  margin-top: calc(var(--spektrix-image-card-grid-gap) * 1.1);
}
.spektrix-image-card-grid__placeholder {
  max-width: var(--spektrix-image-card-grid-content-size);
  margin: 0 auto;
  padding: var(--spektrix-image-card-grid-gap);
  border: 1px dashed var(--wp--preset--color--border);
  border-radius: 12px;
  text-align: center;
}
@media (min-width: 768px) {
  .spektrix-image-card-grid__items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (min-width: 920px) {
  .spektrix-image-card-grid__items {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/*# sourceMappingURL=style.css.map */
