.section-billboard {
  text-align: center;
  background-image: url(/wp-content/uploads/background/home/billboard.jpg),
      url(/wp-content/uploads/background/home/billboard.min_.jpg);
  background-repeat: no-repeat;
  background-position: bottom;
  background-size: cover;
  padding: 34px 41px;
  min-height: 600px;
}

/* Desktop or Tablet */
@media (min-width: 700px) {
  .section-billboard {
    background-image: url(/wp-content/uploads/background/home/billboard.desktop.jpg),
        url(/wp-content/uploads/background/home/billboard.desktop.min_.jpg);
  }
}

.section-billboard .section-billboard-item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}

.section-billboard .billboard-header {
  text-shadow: #333 1px 1px 4px;
}

.section-billboard .headline {
  padding: 20px 0 10px;
}

.section-billboard .copy {
  padding: 15px 0 15px;
}

.section-billboard .form {
  padding: 20px;
  width: 100%;
  box-sizing: border-box;
  background-color: white;
  border-radius: 15px;
  color: var(--primary-dark);
}

.section-billboard .button-submit {
  width: 100%;
  max-width: 269px;
  margin-bottom: 12px;
}

/**
 * For positioning billboard background image.
 */

 @media (min-width: 480px) {
  .section-billboard {
    background-position: right;
  }
}

/**
 * Tablet.
 */

 @media (min-width: 700px) {
  .section-billboard {
    flex-direction: row;
    justify-content: space-around;
    background-position: right;
    min-height: 760px; /* Accomodate larger fonts/spacing on form/copy */
  }

  .section-billboard .section-billboard-item {
    width: 50%;
    box-sizing: content-box;
    white-space: nowrap;
  }

  .section-billboard .headline {
    font-size: 3.75rem;
  }

  .section-billboard .copy {
    font-size: 1.25rem;
  }

  .section-billboard .form {
    box-sizing: content-box;
  }

  .section-billboard .form .link-default {
    font-size: 1rem;
  }

  .section-billboard .copy {
    max-width: 35ch;
    margin: 0 auto;
  }
}

/**
 * Min desktop.
 */

@media (min-width: 1000px) {

  .section-billboard {
    min-height: 900px; /* Accomodate larger padding around form/copy */
    padding: 80px;
  }

  .section-billboard .section-billboard-item {
    /* After clearing the faces, no need to vertically stretch. */
    justify-content: flex-start;
  }

  .section-billboard .form {
    padding: 31px 31px 14px 31px;
    margin-top: 42px;
    border-radius: 10px;
  }
}

@media (min-width: 1300px) {

  .section-billboard {
     padding: 100px;
  }
}