.m-card__style1 {
  --card__padding: 1rem;
  --card__radius: var(--v-border-radius__md);
  --card__border-color: var(--v-color__border);
  --card__bg: var(--v-color__white);
  --card__shadow: var(--v-shadow__sm);
  --card__shadow--hover: var(--v-shadow__md);
  --card__lift: -5px;

  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;

  border: 1px solid var(--card__border-color);
  border-radius: var(--card__radius);

  background-color: var(--card__bg);
  box-shadow: var(--card__shadow);

  color: inherit;
  text-decoration: none;

  transition: var(--v-transition__default);
}

.m-card__style1:hover {
  transform: translateY(var(--card__lift));
  box-shadow: var(--card__shadow--hover);
}

@media (min-width: 700px) {
  .m-card__style1 {
    --card__padding: 1.5rem;
  }
}