@media screen and (min-width: 600px) {
  .en__component--row--2 .en__component--column,
  .en__component--advcolumn .en__component--column {
    padding: 0 1.5rem;
   }
}
.en__component--row--2 .en__component--column:first-child,
.en__component--advcolumn .en__component--column:first-child {
    padding-left: 0;
}
.en__component--row--2 .en__component--column:last-child,
.en__component--advcolumn .en__component--column:last-child{
    padding-right: 0;
}

.signup-iframe {
  .en__field--default-opt-in,
  .en__field--sms-opt-in {
    display: none;
  }

  .en__component--formblock {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;

    > * {
      min-width: 0;
    }

    /* Row 1: email + phone each span 2 of 4 columns */
    .en__field--emailAddress,
    .en__field--phoneNumber2 {
      grid-column: span 2;
    }

    /* Row 2: first name, state, zip each span 1 column */
    .en__field--firstName,
    .en__field--region,
    .en__field--postcode {
      grid-column: span 1;
    }

    /* Submit sits in the 4th column, aligned to the bottom of the row */
    .en__submit {
      grid-column: span 1;
      align-self: end;
      padding-bottom: 18px;

      button {
        width: 100%;
        padding: 10px 14px;
        border: 2px solid #fff;
        font-size: 1.40625rem;
        font-weight: 400;
        line-height: 1;
        position: relative;
        top: -2px;
        &:hover {
          background-color: #438F00;
        }

      }
    }
  }

  .en__field__label,
  .en__field__error {
    color: #fff;
  }

  select {
    background-color: #fff;
    min-width: 0;
    width: 100%;
  }

  .en__mandatory > label {
    &::after {
      color: #cd4d05;
    }
  }

  &.signup-modal {
    .en__field__label,
    .en__field__error {
      color: #cd4d05;
    }

  }
}

@media (max-width: 595px) {
  .signup-iframe .en__component--formblock {
    grid-template-columns: repeat(6, 1fr);
  }
  .signup-iframe .en__component--formblock .en__field--emailAddress,
  .signup-iframe .en__component--formblock .en__field--phoneNumber2 {
    grid-column: span 3;
  }
  .signup-iframe .en__component--formblock .en__field--firstName,
  .signup-iframe .en__component--formblock .en__field--region,
  .signup-iframe .en__component--formblock .en__field--postcode {
    grid-column: span 2;
  }
  .signup-iframe .en__component--formblock .en__submit {
    grid-column: 1 / -1;
  }
}

@media (max-width: 449px) {
  .signup-iframe .en__component--formblock {
    grid-template-columns: 1fr;
  }
  .signup-iframe .en__component--formblock .en__field--emailAddress,
  .signup-iframe .en__component--formblock .en__field--phoneNumber2,
  .signup-iframe .en__component--formblock .en__field--firstName,
  .signup-iframe .en__component--formblock .en__field--region,
  .signup-iframe .en__component--formblock .en__field--postcode,
  .signup-iframe .en__component--formblock .en__submit {
    grid-column: 1 / -1;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .signup-iframe .en__component--formblock .en__submit button {
    font-size: 1.2rem;
    padding: 11px 14px;
  }
}

.signup-thanks {
  h2, p {
    color: #fff;
  }
}
