/* RK UPSELL pop-up (lane R-UPSELL, shipped dark: nothing below is used until upsell.config.json says enabled).
   The kit's wide pop-up, with the owner's grey sketch border (card-border.png, 1406 x 1152, the same
   ratio as the wide frame) on the page's own dark board (#111). The laptop is the owner's frame with a
   transparent screen; the video sits under it at the measured opening. */
.ck-pop.rk-upsell { --ck-frame: url(/assets/promo/card-border.png?v=de5015bf85cc); }
.ck-pop.rk-upsell .ck-appinfo__board.ck-pop__board { background-color: #111; }
.rk-upsell__body { display: flex; flex-direction: column; align-items: center; gap: calc(var(--pu) * 1.5); min-height: 0; }
.rk-upsell__head { align-self: stretch; display: flex; align-items: flex-end; gap: calc(var(--pu) * 1.4); }
.rk-upsell__crown { display: inline-flex; flex-direction: column; align-items: center; flex: none; }
.rk-upsell__crown img { display: block; width: calc(var(--pu) * 6.4); height: auto; }
.rk-upsell__word { font-size: max(12px, calc(var(--pu) * 3.6)); line-height: 1; color: #fff; }
.rk-upsell__try { margin: 0 0 calc(var(--pu) * 0.5); font-weight: 400; font-size: max(14px, calc(var(--pu) * 4)); line-height: 1.1; color: #ff4124; }
.rk-upsell__laptop { position: relative; flex: none; width: calc(var(--pu) * 40); aspect-ratio: 2453 / 1485; }
.rk-upsell__video { position: absolute; left: 10.64%; top: 4.51%; width: 78.52%; height: 82.63%; object-fit: fill; background: #000; }
.rk-upsell__frame { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.rk-upsell__play { position: absolute; left: 10.64%; top: 4.51%; width: 78.52%; height: 82.63%; display: flex; align-items: center; justify-content: center; margin: 0; padding: 0; border: 0; background: transparent; cursor: pointer; }
.rk-upsell__play[hidden] { display: none; }
.rk-upsell__tri { position: relative; width: max(44px, calc(var(--pu) * 6)); height: max(44px, calc(var(--pu) * 6)); border: 3px solid #fff; border-radius: 50%; background: rgba(17, 17, 17, 0.7); }
.rk-upsell__tri::after { content: ""; position: absolute; left: 38%; top: 28%; border-style: solid; border-width: 0.9em 0 0.9em 1.5em; border-color: transparent transparent transparent #fff; font-size: max(7px, calc(var(--pu) * 1.1)); }
.rk-upsell__play:focus-visible, .rk-upsell__video:focus-visible { outline: 2px dashed #fff; outline-offset: 3px; }
.rk-upsell__text { margin: 0; align-self: stretch; text-align: center; font: 300 max(12px, calc(var(--pu) * 2.2)) / 1.42 var(--rk-font-body); color: #fff; }
.rk-upsell__acts { display: flex; justify-content: center; gap: calc(var(--pu) * 2); margin: 0; }
.rk-upsell__acts .ck-btn { min-width: max(96px, calc(var(--pu) * 13)); min-height: 44px; display: inline-flex; align-items: center; justify-content: center; font-size: max(14px, calc(var(--pu) * 2)); cursor: pointer; }
@media (max-width: 700px), (max-aspect-ratio: 1 / 1) {
  /* a portrait phone: the card is as wide as the window allows and as tall as its content */
  .ck-js .ck-pop.rk-upsell.is-open .ck-appinfo__board.ck-pop__board { width: min(98vw, 520px); height: auto; max-height: 96dvh; overflow-y: auto; }
  .ck-pop.rk-upsell .ck-pop__inner { --pu: 1px; position: relative; inset: auto; padding: 74px 58px 80px; overflow: visible; }
  .rk-upsell__body { gap: 14px; }
  .rk-upsell__crown img { width: 46px; }
  .rk-upsell__word { font-size: 24px; }
  .rk-upsell__try { font-size: 24px; }
  .rk-upsell__laptop { width: min(92%, 330px); }
  .rk-upsell__text { font-size: 15px; }
  .rk-upsell__acts { flex-wrap: wrap; gap: 12px; }
  .rk-upsell__acts .ck-btn { font-size: 15px; min-width: 120px; }
}
@media (prefers-reduced-motion: reduce) { .rk-upsell, .rk-upsell * { transition: none !important; animation: none !important; } }
