/*------------------------------------------------------------
NEWSLETTER
====================================*/

/* Variables Custom */
$newsletter-font-weight: $font-weight-light;
$newsletter-color: $white;
$newsletter-bg: $dark;
$newsletter-padding-y-mobile: 3rem;
$newsletter-padding-x-mobile: 1.5rem;
$newsletter-padding-y-desktop: 4rem;
$newsletter-padding-x-desktop: 3rem;

$newsletter-title-font-size-mobile: 1.6rem;
$newsletter-title-font-size-desktop: 2.6rem;
$newsletter-title-font-weight: $font-weight-sbold;
$newsletter-title-font-color: $white;

$newsletter-form-max-width: 540px;
/***************************************/

.newsletter-container {
  margin-bottom: 90px;
}
.newsletter-wrapper {
  position: relative;
  padding: $newsletter-padding-y-mobile $newsletter-padding-x-mobile;
  text-align: center;
  font-weight: $newsletter-font-weight;
  color: $newsletter-color;
  background: $dark;
  form {
    margin: 15px auto 0;
    max-width: $newsletter-form-max-width;
  }
  &:before {
    content: '';
    display: block;
    position: absolute;
    left: -15px;
    right: -15px;
    bottom: -40px;
    height: 150px;
    background: {
      image: url('../../media/icons/pattern.svg');
      size: 60px;
    }
  }
  & > * {
    position: relative;
  }
}
.newsletter-title {
  font-size: $newsletter-title-font-size-mobile;
  font-weight: $newsletter-title-font-weight;
  color: $newsletter-title-font-color;
}

/* RESPONSIVE */
/***************************************/
@include media-breakpoint-up(lg) {
  .newsletter-wrapper {
    padding: $newsletter-padding-y-desktop $newsletter-padding-x-desktop;
    &:before {
      left: 30px;
      right: -30px;
      bottom: -30px;
      height: 90%;
    }
  }
  .newsletter-title {
    font-size: $newsletter-title-font-size-desktop;
  }
}
