#delivery .cards--delivery { gap: 14px; }
#delivery .cards--delivery .card { padding: 0; }

#delivery .section__title--lg { margin-top: 20px; }
@media (min-width: 1024px) {
  #delivery .section__title--lg { margin-top: 20px; }
}

@media (min-width: 1024px) {
  #delivery .section__title--lg { margin-bottom: 56px; }
}

#delivery .bonus__title { margin-top: 16px; }

#delivery .bonus { margin-top: clamp(44px, calc(6vw + 4px), 76px); }

#delivery .card__name,
#delivery .card__note,
#delivery .bonus__mark,
#delivery .bonus__amount,
#delivery .bonus__note,
#delivery .bonus__act .btn { line-height: normal; }

#delivery h2,
#delivery .card,
#delivery .bonus,
#delivery .bonus__act .btn { scroll-margin-top: 88px; }

#delivery .bonus__act .btn {
  transition: background .25s, color .25s, transform .25s, box-shadow .25s;
}
#delivery .bonus__act .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .4);
}
@media (prefers-reduced-motion: reduce) {
  #delivery .bonus__act .btn:hover { transform: none; }
}

@media (max-width: 767px) {
  #delivery .section__eyebrow { font-size: 11px; line-height: normal; }
  #delivery .section__title.section__title--lg { margin: 18px 0 32px; }
  #delivery .card__name { font-size: 17px; }
  #delivery .card__text { font-size: 13.5px; line-height: 1.6; }
  #delivery .card--media { border-radius: 22px; }

  #delivery .card--media .card__body { padding: 20px 22px 24px; }

  #delivery .bonus { display: flex; flex-direction: column; padding: 28px 24px; border-radius: 24px; }
  #delivery .bonus__top { display: contents; }
  #delivery .bonus__lead { order: 1; }

  #delivery .bonus__grid { order: 2; margin-top: 22px; border-radius: 16px; grid-template-columns: 1fr; }
  #delivery .bonus__act { order: 3; margin-top: 20px; gap: 10px; align-items: stretch; }

  #delivery .bonus__act .btn { width: 100%; font-size: 14.5px; letter-spacing: 0; }

  #delivery .bonus__note { color: rgba(245, 240, 232, .62); text-align: center; }

  #delivery .bonus__eyebrow { color: var(--accent-gold); font-size: 11px; line-height: normal; }
  #delivery .bonus__title { margin-top: 14px; font-size: 26px; }
  #delivery .bonus__text { margin-top: 12px; font-size: 13.5px; }

  #delivery .bonus__cell {
    display: flex;
    gap: 16px;
    align-items: baseline;
    padding: 16px 18px;
  }
  #delivery .bonus__amount { flex: none; min-width: 64px; font-size: 19px; }
  #delivery .bonus__cell-text { margin-top: 0; font-size: 12.5px; }

  #delivery .bonus__mark { font-size: 130px; right: -24px; bottom: -44px; }
}

@media (min-width: 768px) and (max-width: 1023px) {

  #delivery { padding: 72px 0; }
  #delivery .section__eyebrow { line-height: normal; }
  #delivery .section__title.section__title--lg { margin: 20px 0 40px; font-size: 38px; }
  #delivery .card__body { padding: 24px; }
  #delivery .card__text { line-height: 1.6; }

  #delivery .bonus { margin-top: 50px; padding: 40px; }
  #delivery .bonus__eyebrow { color: var(--accent-gold); line-height: normal; }
  #delivery .bonus__title { font-size: 36px; }

  #delivery .bonus__top {
    gap: 40px;
    margin-bottom: 32px;
    flex-wrap: nowrap;
    align-items: center;
  }

  #delivery .bonus__lead { flex: 1 1 auto; min-width: 0; }
  #delivery .bonus__act { flex: none; align-items: flex-end; text-align: right; }
  #delivery .bonus__cell { padding: 24px; }
  #delivery .bonus__amount { font-size: 27px; }

  #delivery .bonus__act .btn { letter-spacing: 0; }
  #delivery .bonus__note { color: rgba(245, 240, 232, .62); }
  #delivery .bonus__mark { font-size: 180px; right: -30px; bottom: -58px; }
}

@media (min-width: 768px) {
  #delivery .bonus__grid { grid-template-columns: repeat(3, 1fr); }
}
