/** Shopify CDN: Minification failed

Line 42:25 The "+" operator only works if there is whitespace on both sides

**/
.subscription-form {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  position: relative;
}

@media screen and (min-width: 750px) {
  .subscription-form {
    align-items: flex-start;
    margin: 0 auto;
    max-width: 38rem;
  }
}

.subscription-form__input-group {
  width: 100%;
}

.subscription-form__input-group .input-box__field {
    -webkit-appearance: none;
    appearance: none;
    background-color: rgb(var(--color-background));
    color: rgb(var(--color-foreground));
    font-family: var(--font-body-family);
    font-style: var(--font-body-style);
    font-weight: var(--font-body-weight);
    font-size: 1.6rem;
    width: 80%;
    box-sizing: border-box;
    transition: box-shadow var(--duration-short)ease;
    border-radius: var(--inputs-radius);
    height: 4.5rem;
    min-height: calc(var(--inputs-border-width)* 2);
    min-width: calc(7rem +(var(--inputs-border-width)* 2));
    position: relative;
  margin-bottom: 10px;
  padding: 10px;
  border-width: 1px;
  border-style: solid;
  border-color: rgba(var(--color-button), var(--alpha-button-background));

}

.subscription-form__note {
  justify-content: center;
  margin-bottom: 0;
}

.subscription-form__note--success {
  margin-top: 1.8rem;
}

@media screen and (min-width: 750px) {
  .subscription-form__note {
    justify-content: flex-start;
  }
}

.subscription-form__submit {
  width: 4.2rem;
  margin: 0;
}

.subscription-form__submit .icon {
  width: 1.4rem;
}

.subscription-modal.invisible {
  display: none !important;
}

.modal-wrapper {
  display: none;
  position: fixed;
  z-index: 120;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  transform: translate(-50%, -50%);
  justify-content: center;
  pointer-events: none;
  --modal-max-width: 100vw;
  --modal-max-height: 100vh;
  --media-width: 34rem;
  --modal-width: 860px;
  --modal-padding: 2rem;
}

.modal-wrapper[data-placement="bottom-left"] {
  justify-content: flex-start;
}
.modal-wrapper[data-placement="bottom-right"] {
  justify-content: flex-end;
}
@media screen and (max-width: 749px) {
  .modal-wrapper[data-placement="center"],
  .modal-wrapper[data-placement="bottom-left"],
  .modal-wrapper[data-placement="bottom-right"] {
    justify-content: flex-end;
  }
}

.modal-wrapper.is-visible {
  display: flex;
  animation: fade-in var(--duration-long) ease;
}

.modal-wrapper.is-hiding {
  animation: fade-out var(--duration-long) ease;
}

.modal-subscription__content {
  pointer-events: auto;
  z-index: 35;
  position: relative;
  display: none;
  flex-direction: column;
  align-items: center;
  align-self: flex-end;
  width: 100%;
  max-width: var(--modal-max-width);
  max-height: var(--modal-max-height);
}

@media screen and (min-width: 750px) {
  .modal-subscription__content {
    width: auto;
  }
}

.modal-wrapper.is-visible .modal-subscription__content {
  display: flex;
  animation: modal-appear var(--duration-long) ease;
}

.modal-wrapper.is-hiding .modal-subscription__content {
  animation: modal-disappear var(--duration-long) ease;
}

@keyframes modal-appear {
  0% { transform: scale(0.95); }
  to { transform: scale(1); }
}

@keyframes modal-disappear {
  0% { transform: scale(1); }
  to { transform: scale(0.95); }
}

@media screen and (min-width: 750px) {
  .modal-open {
    overflow: hidden;
  }
  .modal-wrapper {
    padding: 4rem;
    --modal-max-width: calc(120vw - 8rem);
    --modal-max-height: calc(100vh - 8rem);
  }
  .modal-wrapper[data-placement="bottom-left"],
  .modal-wrapper[data-placement="bottom-right"] {
    padding: 1.5rem;
  }
  .modal-wrapper[data-placement="center"] .modal-subscription__content {
    align-self: center;
  }
}

.modal-subscription__inner {
  height: 100%;
  display: flex;
  align-items: stretch;
  position: relative;
}

.modal-subscription__backdrop {
  pointer-events: auto;
  display: block !important;
  position: absolute;
  z-index: 20;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(30, 32, 35, 0.6);
}

.modal-wrapper[data-placement="center"] .modal-subscription__inner {
  padding-left: 0;
  transition: all 0.3s ease-in-out;
}
.modal-wrapper[data-placement="center"].has-image .modal-subscription__inner {
  padding-left: 34rem;
}
.modal-wrapper[data-placement="center"] .modal-subscription__inner .modal-subscription__media {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
}
.modal-subscription__image {
  width: 0;
  height: 100%;
  transition: all 0.3s ease-in-out;
}
.modal-wrapper.has-image .modal-subscription__image {
  width: 34rem;
}
.modal-subscription__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.modal-wrapper[data-placement="bottom-left"] .modal-subscription__media,
.modal-wrapper[data-placement="bottom-right"] .modal-subscription__media {
  display: none;
}
@media screen and (max-width: 749px) {
  .modal-subscription__media {
    display: none;
  }
  .modal-wrapper[data-placement="center"].has-image .modal-subscription__inner {
    padding-left: 0;
  }
}

.modal-subscription__body {
  background: var(--gradient-background);
  background-color: rgb(var(--color-background));
  max-width: calc(min(var(--modal-width), var(--modal-max-width)) - var(--media-width));
}

@media screen and (max-width: 749px) {
  .modal-subscription__inner {
    width: 100%;
  }
  .modal-subscription__body {
    max-width: 100%;
    width: 100%;
  }
  .modal-subscription__body .subscription__container {
    padding: 3rem 3rem;
        text-align: center;
  }
}
@media screen and (min-width: 750px) {
  .modal-subscription__body .subscription__container {
    padding: var(--modal-padding);
  }
}

.modal-subscription__dismiss {
  display: flex !important;
  align-items: center;
  justify-content: center;
  position: absolute;
  height: 1rem;
  width: 2rem;
  border-radius: 50%;
  top: 0.8rem;
  right: 0.8rem;
  color: rgb(var(--color-foreground));
  background-color: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  z-index: 10;
}

.modal-subscription__dismiss::after {
  content: '';
  z-index: -1;
  position: absolute;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background-color: rgb(var(--color-background));
  box-shadow: 0 0 3rem rgba(var(--color-foreground), 0.15);
}

.modal-subscription__dismiss .icon {
  pointer-events: none;
  position: relative;
  width: 1.5rem;
  height: 1.5rem;
  transition: transform var(--duration-default) ease;
  transform: scale(1) rotate(0deg);
}

@media screen and (hover: hover) {
  .modal-subscription__dismiss:hover .icon {
    transform: scale(0.85) rotate(45deg);
  }
}

.modal-subscription__body .subscription-form {
  max-width: none;
}
.modal-subscription__body .subscription.center .subscription-form {
  align-items: center;
}
.modal-subscription__body .subscription.left .subscription-form {
  align-items: flex-start;
}
.modal-subscription__body .subscription.right .subscription-form {
  align-items: flex-end;
}

.modal-subscription__body .subscription__container .subscription-form__input-group {
  max-width: 100%;
}
.modal-subscription__body .subscription__container .subscription-form__submit {
  min-width: auto;
  width: auto;
      display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 0;
    padding: 8px 3rem;
    margin-top: 15px;
    border-radius: var(--buttons-radius);
    cursor: pointer;
    font: inherit;
    font-size: 1.5rem;
    text-decoration: none;
    color: rgb(var(--color-button-text));
    transition: box-shadow var(--duration-short)ease;
    -webkit-appearance: none;
    appearance: none;
    background-color: rgba(var(--color-button), var(--alpha-button-background));
}
@media screen and (min-width: 750px) and (max-width: 850px) {
  .modal-subscription__body .subscription__container .subscription-form__input-group .input-box {
    flex-wrap: wrap;
    gap: 8px;
  }
  .modal-subscription__body .subscription__container .subscription-form__input-group .input-box__field {
    padding-right: 1rem;
  }
  .modal-subscription__body .subscription__container .subscription-form__input-group .subscription-form__submit {
    width: 100%;
  }
}
@media screen and (max-width: 475px) {
  .modal-subscription__body .subscription__container .subscription-form__input-group .input-box {
    flex-wrap: wrap;
    gap: 8px;
  }
  .modal-subscription__body .subscription__container .subscription-form__input-group .input-box__field {
    padding-right: 1rem;
  }
  .modal-subscription__body .subscription__container .subscription-form__input-group .subscription-form__submit {
    width: 100%;
  }
}
.modal-subscription__body .subscription__container .subscription-form__input-group {
  display: flex;
    flex-wrap: wrap;
    gap: 8px;
    flex-direction: column;
}

.modal-wrapper svg  {
      width: 20px;
    margin-bottom: -3px;
}