.box,
.box--no-padding {
  padding: var(--gutter, 1.5rem);
  color: var(--color-text-body);
  background-color: var(--box-deafult);
  border-radius: var(--border-radius-xl);
  border: var(--border)
}

.box--xs {
  max-width: 20ch;
}

.box--s {
  max-width: 30ch;
}

.box--m {
  max-width: 40ch;
}

.box--l {
  max-width: 50ch;
}

.box--no-padding {
  padding: 0;
  overflow: hidden;
}

a .box,
a.box {
  cursor: pointer;
  color: var(--color-dark) !important;
}

a .box:hover,
a.box:hover {
  background-color: var(--color-gray-1);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}
