:root {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #222326;
  background: #f3f4f5;
  font-synthesis: none;
  --red: #cf202d;
  --muted: #62656b;
}
* { box-sizing: border-box; }
body { margin: 0; font-size: 1rem; line-height: 1.55; }
main { width: min(100% - 2.5rem, 52rem); margin: 2.5rem auto; padding: 2.25rem 3rem; background: #fff; border: 1px solid #e0e1e4; border-radius: 1rem; }
.brand-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-bottom: 2rem; border-bottom: 1px solid #e9eaec; }
.brand { color: var(--red); font-weight: 750; font-size: 2.5rem; line-height: 1; letter-spacing: -.07em; }
.invitation-label { color: var(--muted); font-size: .875rem; text-align: right; }
.introduction { padding: 2.25rem 0 1.75rem; }
.eyebrow { margin: 0 0 .75rem; color: var(--red); font-size: .9375rem; }
h1 { margin: 0; font-size: clamp(2.1rem, 5vw, 3.25rem); font-weight: 650; letter-spacing: -.04em; line-height: 1.14; }
.lead { max-width: 39rem; margin: 1.25rem 0 1.5rem; color: #4b4e54; font-size: 1.0625rem; }
.downloads { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.download-button { display: flex; flex-direction: column; gap: .15rem; padding: .875rem 1.125rem; background: #222326; color: #fff; border: 2px solid #222326; border-radius: .5rem; text-decoration: none; }
.download-button:hover { background: #3c3e43; border-color: #3c3e43; }
.platform { font-size: .875rem; color: #e0e1e4; }
.store-name { font-size: 1rem; font-weight: 600; }
a:focus-visible, summary:focus-visible { outline: 3px solid var(--red); outline-offset: 4px; }
.open-app { display: inline-block; color: #34373d; margin-top: 1rem; font-size: .9375rem; text-underline-offset: .2em; }
.store-note { margin: 1.25rem 0 0; padding: .875rem 1rem; background: #faf1f2; border-left: 3px solid var(--red); color: #513236; font-size: .9375rem; }
.benefits { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; padding: 1.25rem 0 1.75rem; border-bottom: 1px solid #e9eaec; }
.benefit { padding: 1.125rem; border: 1px solid #e2e3e6; border-radius: .5rem; }
.benefit p { margin: 0; }
.benefit-label { color: #4b4e54; font-size: .9375rem; }
.discount { color: var(--red); font-size: 2.75rem; font-weight: 650; line-height: 1.3; letter-spacing: -.04em; }
.discount span { font-size: 1.375rem; margin-left: .15rem; }
.benefit p:last-child { color: var(--muted); font-size: .875rem; }
.business-note { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: .9375rem; }
.activation { padding: 2rem 0; border-bottom: 1px solid #e9eaec; }
h2 { margin: 0 0 1.25rem; font-size: 1.375rem; line-height: 1.35; font-weight: 650; letter-spacing: -.02em; }
ol { padding: 0; margin: 0; list-style: none; display: grid; gap: 1.25rem; }
li { display: grid; grid-template-columns: 2rem 1fr; gap: .875rem; }
.step-number { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: #f4f4f5; font-size: .9375rem; color: #4b4e54; }
h3 { margin: .1rem 0 .25rem; font-size: 1rem; font-weight: 600; line-height: 1.4; }
li p { margin: 0; font-size: .9375rem; color: var(--muted); }
details { margin-top: 1.5rem; padding: 1rem; background: #f6f6f7; border-radius: .5rem; }
summary { cursor: pointer; font-size: .9375rem; }
details p { margin: .875rem 0 0; color: var(--muted); font-size: .9375rem; }
.locations { padding: 1.75rem 0; }
.location-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.locations p { margin: .25rem 0 0; font-size: .9375rem; color: var(--muted); }
footer { display: flex; justify-content: space-between; gap: 1rem; padding-top: 1.25rem; border-top: 1px solid #e9eaec; color: var(--muted); font-size: .875rem; }
footer a { color: inherit; text-underline-offset: .15em; }
@media (max-width: 600px) {
  main { width: 100%; margin: 0; padding: 1.5rem 1.25rem; border: 0; border-radius: 0; }
  .brand-row { padding-bottom: 1.5rem; }
  .brand { font-size: 2.25rem; }
  .invitation-label { max-width: 9rem; }
  .introduction { padding-top: 1.75rem; }
  .downloads, .location-grid { grid-template-columns: 1fr; }
  .benefits { gap: .75rem; }
  .benefit { padding: .875rem; }
  footer { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: no-preference) {
  .download-button { transition: background-color .15s ease; }
}