.loyalty {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: 9%;
  align-items: center;
  background: #e8e1d3;
}

.loyalty::after {
  content: "";
  position: absolute;
  width: 360px;
  height: 360px;
  border: 1px solid rgba(159, 113, 69, .22);
  border-radius: 50%;
  right: -190px;
  top: -190px;
}

.coin-mark {
  justify-self: center;
  width: 230px;
  height: 230px;
  border: 1px solid #a9865b;
  border-radius: 50%;
  display: grid;
  place-items: center;
  position: relative;
  color: #80603d;
  background: rgba(246, 243, 235, .4);
  box-shadow: 0 0 0 12px rgba(169, 134, 91, .08);
}

.coin-mark::before {
  content: "";
  position: absolute;
  inset: 17px;
  border: 1px solid rgba(128, 96, 61, .38);
  border-radius: 50%;
}

.coin-mark span {
  font: italic 54px Georgia, serif;
  letter-spacing: -3px;
}

.coin-mark i {
  position: absolute;
  width: 5px;
  height: 5px;
  background: #a9865b;
  border-radius: 50%;
}

.coin-mark i:nth-of-type(1) { top: 27px; }
.coin-mark i:nth-of-type(2) { bottom: 27px; left: 62px; }
.coin-mark i:nth-of-type(3) { bottom: 27px; right: 62px; }
.loyalty-copy { max-width: 720px; }
.loyalty-copy > p:not(.eyebrow) { color: #596154; max-width: 640px; }
.loyalty-note { font: italic 18px/1.55 Georgia, serif; color: #53604c !important; margin: 27px 0 32px; }
.loyalty-status { display: inline-block; border-top: 1px solid #b7a98f; border-bottom: 1px solid #b7a98f; padding: 10px 2px; font-size: 11px; letter-spacing: 1.8px; text-transform: uppercase; }

@media (max-width: 760px) {
  .loyalty { grid-template-columns: 1fr; gap: 44px; }
  .coin-mark { width: 170px; height: 170px; justify-self: start; }
  .coin-mark::before { inset: 13px; }
  .coin-mark span { font-size: 42px; }
  .coin-mark i:nth-of-type(1) { top: 20px; }
  .coin-mark i:nth-of-type(2) { bottom: 20px; left: 45px; }
  .coin-mark i:nth-of-type(3) { bottom: 20px; right: 45px; }
  .loyalty h2 br { display: none; }
  .loyalty-note { font-size: 17px; }
}