
/* Page-specific, like welcome.html's: the weight — type, colour, buttons, nav,
   footer — is subscribe.css. The terms strip and the numbered steps are the
   same shapes welcome.html draws, so an invited reader meets one design twice. */
.inv { max-width: 720px; margin: 0 auto; }
.inv-card { border: 1px solid var(--rule); border-radius: 14px; padding: 22px 24px; background: var(--card, transparent); }
.inv-code { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: end; }
.inv-code input { font-family: "IBM Plex Mono", ui-monospace, Menlo, monospace; font-size: 20px; letter-spacing: .12em;
  text-transform: uppercase; padding: 12px 14px; }
.inv-code .plan-cta { width: auto; margin: 0; min-width: 12rem; }
.inv-who { margin: 0 0 4px; font-size: 14px; color: var(--text-dim); }
.inv-who b { font-family: "IBM Plex Mono", ui-monospace, Menlo, monospace; color: var(--text); }
.inv-terms { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1px; margin: 18px 0 0;
  background: var(--rule); border: 1px solid var(--rule); border-radius: 10px; overflow: hidden; }
.inv-terms > div { background: var(--bg, #fff); padding: 12px 14px; }
.inv-terms .k { display: block; font: 600 10px/1.4 "IBM Plex Mono", ui-monospace, monospace; letter-spacing: .1em; text-transform: uppercase; opacity: .62; }
.inv-terms .v { display: block; font-weight: 600; margin-top: 4px; }
.inv-plans { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 18px 0 0; }
.inv-plan { position: relative; display: block; border: 1px solid var(--rule); border-radius: 10px; padding: 14px 16px 14px 44px; cursor: pointer; }
.inv-plan input { position: absolute; left: 16px; top: 17px; accent-color: var(--brand-d, #1D6BB4); }
.inv-plan b { display: block; }
.inv-plan span { display: block; font-size: 14px; color: var(--text-dim); margin-top: 2px; }
.inv-plan.is-on { border-color: var(--brand-d, #1D6BB4); box-shadow: 0 0 0 1px var(--brand-d, #1D6BB4) inset; }
.inv-go { margin: 20px 0 0; }
.inv-go .plan-cta { width: auto; min-width: 16rem; }
.inv-moves { margin: 34px 0 0; display: grid; gap: 14px; }
.inv-move { display: flex; gap: 12px; align-items: flex-start; }
.inv-move i { flex: 0 0 22px; height: 22px; border-radius: 50%; background: var(--brand-d, #1D6BB4); color: #fff;
  font: 600 11px/22px "IBM Plex Mono", monospace; text-align: center; font-style: normal; }
.inv-move b { display: block; }
.inv-move span { display: block; opacity: .78; font-size: 14px; margin-top: 2px; }
.inv-fine { font-size: 13px; opacity: .72; margin: 18px 0 0; max-width: 62ch; }
/* A display value outranks the user agent's [hidden] rule; name the attribute. */
.inv-card[hidden], .inv-plans[hidden], .inv-moves[hidden] { display: none; }
@media (max-width: 560px) {
  .inv-code { grid-template-columns: 1fr; }
  .inv-code .plan-cta, .inv-go .plan-cta { width: 100%; }
  .inv-plans { grid-template-columns: 1fr; }
}

.iv-offer,.iv-body{overflow-wrap:anywhere} .iv-offer{max-width:100%;box-sizing:border-box}