/* The offers page uses the site's existing dark, gold and mint palette. */
#plans > .member-heading {
  display: grid;
  grid-template-columns: minmax(250px, 1fr) minmax(380px, 1.45fr) auto;
  align-items: center;
  gap: 28px;
}
.offers-notice {
  padding: 18px 22px;
  border-left: 2px solid #dfc17d;
  background: linear-gradient(105deg, #dfc17d0d, transparent);
}
.offers-kicker {
  display: block;
  margin: 0 0 8px;
  color: #dfc17d;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .06em;
}
.offers-notice h3 { margin: 0 0 9px; color: #f4e3b9; font-size: 22px; line-height: 1.45; }
#plans .offers-notice p { margin: 0; color: #c1d0c5; font-size: 13px; line-height: 1.8; }
.offers-notice-bottom { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 18px; margin-top: 9px; color: #a5eeb3; font-size: 12px; }
.offers-text-button { min-height: 32px; padding: 3px 0; border: 0; background: none; color: #dfc17d; font-size: 12px; text-underline-offset: 4px; }
.offers-text-button:hover { text-decoration: underline; }
#plans .offers-payment-note { margin: 0; font-size: 12px; }
.community-promo-heading { display: grid; grid-template-columns: 1fr auto 1fr; }
.community-promo-heading > .community-promo-entry { justify-self: end; }
.community-promo-heading > .community-promo-restore { grid-column: 3; justify-self: end; }
.offers-open-button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 36px;
  min-height: 48px;
  padding: 12px 24px;
  border: 1px solid #dfc17d;
  border-radius: 8px;
  background: #dfc17d;
  color: #14201a;
  font-size: 16px;
  font-weight: 600;
  transition: background .15s ease;
}
.offers-open-button:hover { background: #f0d599; }
.offers-open-button span { font-size: 20px; font-weight: 400; }
.offers-dialog {
  width: min(780px, calc(100% - 32px));
  max-width: none;
  max-height: min(90dvh, 940px);
  padding: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #827c6c #263443;
  border: 1px solid #5c5843;
  border-radius: 16px;
  background: #101814;
  color: #eef0ed;
  box-shadow: 0 28px 100px #0008;
}
.offers-dialog::backdrop { background: #060c09d6; }
.offers-dialog::-webkit-scrollbar { width: 9px; }
.offers-dialog::-webkit-scrollbar-track { background: #263443; border-radius: 10px; }
.offers-dialog::-webkit-scrollbar-thumb { background: #827c6c; border: 2px solid #263443; border-radius: 10px; }
.offers-dialog::-webkit-scrollbar-thumb:hover { background: #dfc17d; }
.offers-dialog-header { display: flex; align-items: start; justify-content: space-between; gap: 18px; padding: 28px 30px 22px; }
.offers-dialog-header h2 { margin: 0; font: 500 26px/1.5 "Segoe UI", "Microsoft YaHei UI", sans-serif; }
.offers-dialog-header h2:focus { outline: none; }
.offers-close { display: grid; place-items: center; flex: none; width: 44px; height: 44px; margin: -6px -10px 0 0; border: 0; border-radius: 8px; background: transparent; color: #b6c8b9; font-size: 28px; }
.offers-close:hover { color: #eef0ed; background: #26392e; }
.offers-dialog-body { padding: 0 30px; }
.offers-dialog h3 { margin: 0; font-size: 17px; line-height: 1.6; }
.offers-dialog p { font-size: 13px; line-height: 1.85; }
.offers-dialog .offers-kicker { font-size: 11px; line-height: 1.6; }
.offers-section-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; }
.offers-tag { color: #a5eeb3; font-size: 11px; font-weight: 500; }
.offers-cashback { padding: 20px 22px; border: 1px solid #60573b; border-radius: 10px; background: #dfc17d08; }
.offers-cashback h3 { color: #f4e3b9; }
.offers-cashback > p { color: #d5dfd8; margin: 10px 0 0; }
.offers-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding: 16px 0; margin: 16px 0 0; border-top: 1px solid #dfc17d25; list-style: none; }
.offers-steps li { display: block; padding: 0; border: 0; font-size: 12px; line-height: 1.75; }
.offers-steps span { display: block; margin-bottom: 4px; color: #dfc17d; font: 12px Consolas, monospace; }
.offers-dialog .offers-fineprint { margin: 10px 0 0; color: #a7b1b5; font-size: 11px; line-height: 1.8; }
.offers-benefits { display: grid; grid-template-columns: 1fr 1fr; margin: 24px 0; }
.offers-benefits > section { padding: 0 22px; }
.offers-benefits > section:first-child { padding-left: 0; border-right: 1px solid #333d3d; }
.offers-benefits > section:last-child { padding-right: 0; }
.offers-dialog .offers-value { margin: 12px 0 0; color: #dfc17d; font-size: 19px; }
.offers-value strong { font-size: 30px; font-weight: 500; }
.offers-benefits section > p:not([class]) { margin: 4px 0; color: #d5dfd8; }
.offers-checkin { display: flex; justify-content: space-between; gap: 12px; margin-top: 18px; }
.offers-checkin span { display: block; color: #a7b1b5; font-size: 11px; }
.offers-checkin strong { display: block; margin-top: 4px; color: #a5eeb3; font-size: 24px; font-weight: 500; }
.offers-checkin small { font-size: 12px; font-weight: 400; }
.offers-referral { display: flex; align-items: center; gap: 28px; padding: 20px 0 24px; border-top: 1px solid #333d3d; }
.offers-referral > div { flex: 1; }
.offers-referral p { margin: 8px 0 0; color: #d5dfd8; }
.offers-tag-manual { color: #b4beb7; border: 1px solid #46534a; border-radius: 4px; padding: 1px 6px; }
.offers-referral-value { flex: none; color: #dfc17d; font-size: 15px; }
.offers-referral-value strong { margin-left: 3px; font: 36px/1.3 Georgia, serif; }
.offers-referral-value small { display: block; margin-top: 5px; color: #a7b1b5; font-size: 11px; text-align: right; }
.offers-dialog-footer { padding: 18px 30px 24px; border-top: 1px solid #333d3d; background: #17231d; }
.offers-dialog-footer > p { margin: 0 0 14px; color: #a7b1b5; font-size: 11px; }
.offers-dialog-footer > div { display: flex; justify-content: flex-end; gap: 12px; }
.offers-dismiss, .offers-community-link { display: inline-flex; justify-content: center; align-items: center; gap: 12px; min-height: 44px; padding: 10px 16px; border: 1px solid #49684f; border-radius: 8px; font-size: 13px; text-decoration: none; }
.offers-dismiss { background: transparent; color: #c5d9ca; }
.offers-community-link { border-color: #a5eeb3; background: #a5eeb3; color: #14201a; font-weight: 600; }
.offers-community-link:hover { background: #bdf7c8; }
.offers-dismiss:hover { border-color: #a5eeb3; }
.offers-open-button:focus-visible, .offers-text-button:focus-visible, .offers-dialog button:focus-visible, .offers-dialog a:focus-visible { outline: 2px solid #a5eeb3; outline-offset: 4px; }
html.offers-modal-open { overflow: hidden; }
@media (max-width: 1199px) {
  #plans > .member-heading { grid-template-columns: 1fr auto; gap: 18px 24px; }
  .offers-notice { grid-column: 1 / -1; grid-row: 2; }
}
@media (max-width: 680px) {
  #plans > .member-heading { grid-template-columns: 1fr; gap: 12px; }
  #plans > .member-heading h2 { font-size: 28px; }
  #plans .offers-payment-note { grid-row: 2; }
  .offers-notice { grid-row: 3; margin-top: 4px; padding: 16px; }
  .offers-notice h3 { font-size: 20px; }
  .community-promo-heading { grid-template-columns: 1fr auto; gap: 16px 12px; }
  .community-promo-heading > div:first-child { grid-column: 1 / -1; }
  .community-promo-heading > .community-promo-restore { grid-column: 1 / -1; }
  .offers-open-button { gap: 26px; padding: 10px 20px; font-size: 15px; }
  .offers-dialog { max-height: 92dvh; border-radius: 12px; }
  .offers-dialog-header { padding: 20px 20px 18px; }
  .offers-dialog-header h2 { font-size: 21px; }
  .offers-dialog-body { padding: 0 20px; }
  .offers-cashback { padding: 16px; }
  .offers-steps { grid-template-columns: 1fr; gap: 8px; padding-bottom: 5px; }
  .offers-steps span { display: inline; margin-right: 10px; }
  .offers-benefits { grid-template-columns: 1fr; gap: 20px; }
  .offers-benefits > section { padding: 0; }
  .offers-benefits > section:first-child { border-right: 0; padding-bottom: 20px; border-bottom: 1px solid #333d3d; }
  .offers-checkin { justify-content: flex-start; gap: 34px; }
  .offers-referral { align-items: flex-start; gap: 16px; }
  .offers-referral-value { display: none; }
  .offers-dialog-footer { padding: 18px 20px 20px; }
  .offers-dialog-footer > div { flex-wrap: wrap; }
  .offers-community-link { flex: 1; }
}
@media (prefers-reduced-motion: reduce) { .offers-open-button { transition: none; } }