/* Offer page (/offer) box styling. The boxes share the .boxes-wrapper
   markup with the landing page, but /offer overrides the chrome below with
   a warm theme — scoped to .august so the landing page boxes (styled in
   boxes.css) are unaffected. */

/* Page header, above the boxes. */
.offer-title {
  text-align: center;
}

.offer-notice {
  text-align: center;
  font-weight: bold;
}

.august {
  margin-top: 25px;
  margin-bottom: 25px;
}

/* Warm box chrome — overrides the shared boxes.css .boxes-wrapper style. */
.august .boxes-wrapper {
  background: #FFF6E6;
  border: solid 2px #E0A45C;
  border-radius: 10px;

  h2 {
    color: #B5701A;
  }
}

.august-content {
  padding: 16px;

  hr {
    border: 1px solid #777;
  }
}

/* Emphasised lead paragraph inside an offer box. */
.offer-lead {
  font-weight: bold;
}

.offer-lead.is-italic {
  font-style: italic;
}

@media (prefers-color-scheme: dark) {
  .august .boxes-wrapper {
    background: #2B2620;
    border-color: #7A5A2E;

    h2 {
      color: #E8C48A;
    }
  }

  .august-content hr {
    border-color: #444;
  }
}