/* Selected Original design. Every rule is scoped to section 6. */
#goals .usage-choices li:first-child > .callout-icon {
  background: #edf4ed;
  color: #3d7758;
}
#goals .usage-choices li:last-child > .callout-icon {
  background: #fbf1e7;
  color: #a4693d;
}

/* Keep the four duration cues in a compact box centered below the phone. */
#goals .awareness-legend {
  width: max-content;
  max-width: 100%;
  margin: 18px auto 0;
}
#goals .color-key {
  width: max-content;
  max-width: 100%;
  grid-template-columns: repeat(2, max-content);
  gap: 10px 18px;
  margin: 0;
  padding: 12px 16px;
  border-radius: 15px;
}

@media (max-width: 700px) {
  #goals .awareness-legend { margin-top: 14px; }
  #goals .color-key {
    grid-template-columns: 1fr;
    gap: 9px;
    padding: 11px 13px;
    border-radius: 13px;
  }
}
