.modal__trigger {
  --modal-trigger-appearance: none;
  --modal-trigger-background: transparent;
  --modal-trigger-padding: 0;
  --modal-trigger-position: relative;
  --modal-trigger-width: 100%;
  --modal-trigger-height: auto;

  appearance: var(--modal-trigger-appearance);
  position: var(--modal-trigger-position);
  width: var(--modal-trigger-width);
  height: var(--modal-trigger-height);
  padding: var(--modal-trigger-padding);
  background: var(--modal-trigger-background);
  cursor: pointer;
}

.modal__trigger img {
  --modal-trigger-img-width: 100%;
  --modal-trigger-img-height: auto;

  display: block;
  width: var(--modal-trigger-img-width);
  height: var(--modal-trigger-img-height);
}

.modal__trigger .field--name-field-trigger-label {
  --modal-trigger-label-position: static;
  --modal-trigger-label-padding: 10px;
  --modal-trigger-label-border-radius: none;
  --modal-trigger-label-background: var(--primary-color);
  --modal-trigger-label-color: var(--base-white);
  --modal-trigger-label-font-family: var(--font-primary);
  --modal-trigger-label-font-size: 16px;
  --modal-trigger-label-font-weight: inherit;
  --modal-trigger-label-line-height: 1.25;
  --modal-trigger-label-text-align: center;

  position: var(--modal-trigger-label-position);
  padding: var(--modal-trigger-label-padding);
  border-radius: var(--modal-trigger-label-border-radius);
  background: var(--modal-trigger-label-background);
  color: var(--modal-trigger-label-color);
  font-family: var(--modal-trigger-label-font-family);
  font-size: var(--modal-trigger-label-font-size);
  font-weight: var(--modal-trigger-label-font-weight);
  line-height: var(--modal-trigger-label-line-height);
  text-align: var(--modal-trigger-label-text-align);
}