/* rfm-wpe Promo Popup - self-contained component styles.
   Enqueued by Elementor only on pages where rfmwpe_promo_popup is placed.
   Uses CSS vars from the consumer theme (--primary, --navy, --gray*, etc.)
   with safe fallbacks so it renders even without theme tokens. */

@keyframes rfmwpePopupFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes rfmwpePopupSlideUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes rfmwpePopupPulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.5; transform: scale(1.3); } }

.promo-popup {
  position: fixed; inset: 0; background: rgba(1,22,39,0.78); backdrop-filter: blur(6px);
  z-index: 10002; display: none; align-items: center; justify-content: center; padding: 24px; overflow-y: auto;
}
.promo-popup.active { display: flex; animation: rfmwpePopupFadeIn 0.4s ease; }
.promo-popup__card {
  position: relative; width: 100%; max-width: 880px; background: var(--white, #fff); border-radius: 14px;
  overflow: hidden; box-shadow: 0 40px 100px rgba(0,0,0,0.5); display: grid; grid-template-columns: 1fr 1fr;
  animation: rfmwpePopupSlideUp 0.45s cubic-bezier(0.25,0.46,0.45,0.94);
}
.promo-popup__close {
  position: absolute; top: 14px; right: 14px; width: 38px; height: 38px; border-radius: 50%;
  background: rgba(255,255,255,0.95); color: var(--navy, #1B325F); border: none; font-size: 22px; line-height: 1;
  cursor: pointer; z-index: 3; display: flex; align-items: center; justify-content: center;
  transition: transform 0.25s ease, background 0.25s ease; box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.promo-popup__close:hover { background: var(--primary, #DD0000); color: #fff; transform: rotate(90deg); }
.promo-popup__image { position: relative; min-height: 100%; overflow: hidden; }
.promo-popup__image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.promo-popup__badge {
  position: absolute; top: 24px; left: 24px; background: var(--primary, #DD0000); color: #fff; padding: 12px 22px;
  border-radius: 50px; font-size: 14px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase;
  box-shadow: 0 8px 24px rgba(221,0,0,0.4);
}
.promo-popup__body { padding: 36px 36px 32px; display: flex; flex-direction: column; justify-content: center; }
.promo-popup__pill {
  display: inline-flex; align-items: center; gap: 8px; background: rgba(221,0,0,0.08);
  border: 1px solid rgba(221,0,0,0.25); padding: 6px 14px; border-radius: 50px; font-size: 10px;
  font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--primary, #DD0000);
  margin-bottom: 16px; align-self: flex-start;
}
.promo-popup__pill-dot { width: 7px; height: 7px; background: var(--primary, #DD0000); border-radius: 50%; animation: rfmwpePopupPulse 2s ease-in-out infinite; }
.promo-popup__title { font-family: var(--font-display, inherit); font-size: 1.65rem; font-weight: 700; line-height: 1.15; color: var(--navy, #1B325F); margin-bottom: 14px; }
.promo-popup__title em { font-style: normal; color: var(--primary, #DD0000); font-weight: 800; }
.promo-popup__sub { font-size: 14px; line-height: 1.6; color: var(--gray, #424242); margin-bottom: 18px; }
.promo-popup__sub strong { color: var(--navy, #1B325F); font-weight: 700; }
.promo-popup__features { list-style: none; padding: 0; margin: 0 0 22px; }
.promo-popup__features li { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--gray-dark, #3A3A3A); padding: 6px 0; }
.promo-popup__features li svg { width: 16px; height: 16px; color: var(--success, #16A34A); flex-shrink: 0; }
.promo-popup__cta { width: 100%; gap: 10px; padding: 16px 24px; font-size: 14px; }
.promo-popup__cta span { font-size: 18px; transition: transform 0.25s ease; }
.promo-popup__cta:hover span { transform: translateX(4px); }
.promo-popup__dismiss {
  background: none; border: none; color: var(--gray, #424242); font-size: 12px; margin-top: 12px;
  cursor: pointer; text-decoration: underline; transition: color 0.2s; font-family: inherit;
}
.promo-popup__dismiss:hover { color: var(--navy, #1B325F); }

@media (prefers-reduced-motion: reduce) {
  .promo-popup.active { animation: none; }
  .promo-popup__card { animation: none; }
  .promo-popup__pill-dot { animation: none; }
  .promo-popup__close { transition: none; }
  .promo-popup__cta span { transition: none; }
  .promo-popup__dismiss { transition: none; }
}

@media (max-width: 980px) {
  .promo-popup { padding: 12px; }
  .promo-popup__card { grid-template-columns: 1fr; max-width: 480px; }
  .promo-popup__image { min-height: 180px; max-height: 220px; }
  .promo-popup__body { padding: 24px 22px; }
  .promo-popup__title { font-size: 1.4rem; }
}