.sbx-app-showcase { padding: 8px 0 32px; background: linear-gradient(180deg, #fff, #f2f6f9); }
.sbx-app-showcase-container { width: calc(100% - var(--sbx-gutter) - var(--sbx-gutter)); max-width: var(--sbx-content-width); margin-inline: auto; }
.sbx-app-showcase-heading { margin-bottom: 26px; text-align: center; }
.sbx-app-showcase .sbx-app-showcase-title { margin: 0; color: #102e46; font-size: clamp(24px, 2.4vw, 30px); font-weight: 700; line-height: 1.25; letter-spacing: -.4px; }
.sbx-app-showcase-description { margin: 8px 0 0; color: #566a80; font-size: 16px; line-height: 24px; }
.sbx-app-platforms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.sbx-app-platform { position: relative; min-width: 0; min-height: 288px; overflow: hidden; padding: 24px; border: 1px solid #e0e8ef; border-radius: 12px; background: linear-gradient(135deg, #fff 55%, #f0f7fc); box-shadow: 0 5px 18px rgb(34 69 94 / 5%); }
.sbx-app-platform-copy { position: relative; z-index: 1; width: 55%; max-width: 260px; }
.sbx-app-platform-icon { width: 60px; height: 60px; }
.sbx-app-platform-title { margin: 14px 0 8px; color: #122e47; font-size: 24px; font-weight: 700; line-height: 1.12; letter-spacing: -.6px; }
.sbx-app-platform-title span { display: block; }
.sbx-app-platform-description { margin: 0 0 16px; color: #566a80; font-size: 14px; line-height: 20px; }
.sbx-app-store-link { display: inline-flex; align-items: center; gap: 10px; min-width: 184px; min-height: 46px; padding: 10px 14px; border: 1px solid #007bb9; border-radius: 7px; background: linear-gradient(180deg, #007bb9, #006aa3); box-shadow: 0 3px 8px rgb(0 120 185 / 15%); color: #fff; font-size: 15px; font-weight: 700; line-height: 22px; text-decoration: none; white-space: nowrap; }
.sbx-app-store-icon { flex: 0 0 24px; width: 24px; height: 24px; }
.sbx-app-store-arrow { flex: 0 0 16px; width: 16px; height: 16px; margin-left: auto; }
.sbx-app-store-link:hover { background: #007bb9; border-color: #006ba6; box-shadow: 0 4px 12px rgb(0 100 160 / 22%); }
.sbx-app-store-link:focus-visible { outline: 2px solid var(--sbx-brand); outline-offset: 3px; }
.sbx-app-phone { position: absolute; top: 14px; right: 0; width: 52%; max-width: 330px; height: auto; pointer-events: none; }
@media (max-width: 850px) {
  .sbx-app-platforms { grid-template-columns: minmax(0, 1fr); max-width: 680px; margin-inline: auto; gap: 16px; }
}
@media (max-width: 480px) {
  .sbx-app-showcase { padding-bottom: 24px; }
  .sbx-app-showcase-heading { margin-bottom: 20px; }
  .sbx-app-showcase-description { font-size: 14px; line-height: 21px; }
  .sbx-app-platform { min-height: 266px; padding: 20px 16px; border-radius: 10px; }
  .sbx-app-platform-copy { width: 65%; }
  .sbx-app-platform-icon { width: 48px; height: 48px; }
  .sbx-app-platform-title { margin: 12px 0 6px; font-size: 20px; }
  .sbx-app-platform-description { margin-bottom: 12px; font-size: 13px; line-height: 18px; }
  .sbx-app-store-link { gap: 7px; min-width: 150px; min-height: 42px; padding: 9px 11px; font-size: 13px; line-height: 20px; }
  .sbx-app-store-icon { flex-basis: 20px; width: 20px; height: 20px; }
  .sbx-app-store-arrow { flex-basis: 14px; width: 14px; height: 14px; }
  .sbx-app-phone { top: 50px; right: -24px; }
}
