/* GENERATED by tools/build_nvy.py from the Nvy theme skeleton, 2026-10-17T11:41:40Z. Do not edit. */
/* ── MVS Card Grid ───────────────────────────────────────── */

.mvs-card-grid {
  display: grid;
  grid-template-columns: repeat(var(--cg-cols, 3), 1fr);
  gap: var(--molecule-standard);
  align-items: stretch;
  width: 100%;
}

/* Column variants */
.mvs-card-grid--col-2 { --cg-cols: 2; }
.mvs-card-grid--col-3 { --cg-cols: 3; }
.mvs-card-grid--col-4 { --cg-cols: 4; }



/* ── Slider mode ─────────────────────────────────────────── */

.mvs-card-grid--slider {
  display: flex;
  flex-direction: column;
  gap: var(--molecule-standard);
  --slider-color: var(--mvs-controls-color-o, var(--mvs-title-color-o, var(--title-color, var(--heading-color))));
}

.mvs-card-grid__track {
  display: grid;
  grid-template-columns: repeat(var(--cg-cols, 3), 1fr);
  gap: var(--molecule-standard);
  align-items: stretch;
  width: 100%;
}

/* ── Card animations ─────────────────────────────────────── */

@keyframes mvsCGCard-out {
  from { opacity: 1; transform: translateY(0); }
  to   { opacity: 0; transform: translateY(20%); }
}

@keyframes mvsCGCard-in {
  from { opacity: 0; transform: translateY(-20%); }
  to   { opacity: 1; transform: translateY(0); }
}

/* All items sit in row 1 — JS toggles visibility per page */
.mvs-card-grid__item {
  grid-row: 1;
  opacity: 0;
  visibility: hidden;
}

.mvs-card-grid__item.is-visible {
  opacity: 1;
  visibility: visible;
}

/* Leaving — animate out with left-to-right stagger */
.mvs-card-grid__item.is-leaving {
  visibility: visible;
  pointer-events: none;
  animation: mvsCGCard-out 0.4s ease both;
  animation-delay: calc(var(--col-index, 0) * 0.08s);
}

/* Entering — drop in after leaving has started, same stagger direction */
.mvs-card-grid__item.is-entering {
  visibility: visible;
  pointer-events: none;
  animation: mvsCGCard-in 0.4s ease both;
  animation-delay: calc(0.28s + var(--col-index, 0) * 0.08s);
}

.mvs-card-grid__controls {
  display: none;
  justify-content: center;
}


/* ── HubSpot editor placeholder suppression ─────────────── */

.mvs-card-grid [style*="grid-area:content"] { display: none !important; }


/* ── Responsive ──────────────────────────────────────────── */

@container mv2Module (768px <= width < 1024px) {
  .mvs-card-grid--col-3,
  .mvs-card-grid--col-4 { --cg-cols: 2; }
}

@container mv2Module (width < 768px) {
  .mvs-card-grid--col-2,
  .mvs-card-grid--col-3,
  .mvs-card-grid--col-4 { --cg-cols: 1; }
}