/* Shared free-to-paid preview invitation from the retirement quick check. */
.upgrade-card {
  box-sizing: border-box;
  grid-column: 1 / -1;
  width: 100%;
  max-width: 1160px;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 34px;
  padding: 24px 26px;
  border: 1px solid #d7e0ea;
  border-left: 5px solid #22a53a;
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 4px 16px rgba(9, 31, 61, .055);
}
.upgrade-card > div { max-width: 750px; }
.upgrade-card .eyebrow { display: block; margin: 0; color: #16782b; font-size: .76rem; font-weight: 800; letter-spacing: .075em; text-transform: uppercase; }
.upgrade-card h2 { margin: 2px 0 0; color: #06254a; font-size: 1.34rem; line-height: 1.25; }
.upgrade-card p { margin: 8px 0 0; color: #465a70; font-size: 1rem; line-height: 1.5; }
.upgrade-card .primary-button { flex: 0 0 auto; display: inline-block; padding: 12px 17px; border-radius: 7px; color: #fff; background: #06254a; font-size: 1rem; font-weight: 700; line-height: 1.5; text-decoration: none; text-align: center; text-wrap: balance; }
.upgrade-card .primary-button:hover { background: #0b3769; }
.upgrade-card .primary-button:focus-visible { outline: 3px solid #77ce84; outline-offset: 2px; }
.upgrade-card-standalone { width: min(1160px, calc(100% - 40px)); margin: 0 auto 24px; }
.after-grid + .upgrade-card, .workspace + .upgrade-card { margin-top: 20px; }
.after-grid > .guide-card:only-child { grid-column: 1 / -1; }
@media (max-width: 820px) {
  .upgrade-card { display: block; padding: 20px 18px; }
  .upgrade-card .primary-button { display: block; margin-top: 18px; }
  .upgrade-card-standalone { width: min(calc(100% - 24px), 620px); }
}
