:root{
  --rvnx-brand:#003A78;
  --rvnx-brand-rgb:0,58,120;
  --rvnx-action-start:#f97316;
  --rvnx-action-end:#ea580c;
}

#rvnx-widget-area.rvnx-smart-cta{
  position:relative;
  margin:40px 0 20px;
  padding:24px;
  border-radius:20px;
  background:#fff;
  border:1px solid rgba(var(--rvnx-brand-rgb),.10);
  box-shadow:0 15px 40px -10px rgba(var(--rvnx-brand-rgb),.12);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  gap:20px;
  isolation:isolate;
  direction:rtl;
  font-family:inherit;
}

#rvnx-widget-area.rvnx-smart-cta::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(var(--rvnx-brand-rgb),.05) 0%, rgba(255,255,255,0) 70%);
  z-index:-1;
  pointer-events:none;
}

#rvnx-widget-area .rvnx-content{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}

#rvnx-widget-area .rvnx-badge{
  background:rgba(var(--rvnx-brand-rgb),.08);
  color:var(--rvnx-brand);
  font-size:12px;
  font-weight:700;
  padding:4px 12px;
  border-radius:50px;
  margin-bottom:12px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  line-height:1.5;
}

#rvnx-widget-area .rvnx-badge::before{
  content:'';
  width:7px;
  height:7px;
  background:var(--rvnx-brand);
  border-radius:50%;
  animation:rvnx-blink 2s infinite;
}

#rvnx-widget-area .rvnx-title{
  margin:0 !important;
  padding:0 !important;
  font-size:18px !important;
  font-weight:800 !important;
  color:#1f2937 !important;
  line-height:1.6 !important;
  text-align:right !important;
}

#rvnx-widget-area a.rvnx-btn{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  background:linear-gradient(135deg, var(--rvnx-action-start) 0%, var(--rvnx-action-end) 100%);
  color:#fff !important;
  text-decoration:none !important;

  padding:14px 24px;
  border-radius:14px;
  font-weight:700;
  font-size:16px;

  min-height:56px;
  width:100%;
  box-sizing:border-box;

  box-shadow:0 8px 20px -5px rgba(249,115,22,.40);
  transition:transform .25s cubic-bezier(.4,0,.2,1), box-shadow .25s cubic-bezier(.4,0,.2,1);
  overflow:hidden;
  border:none !important;
}

#rvnx-widget-area a.rvnx-btn:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 25px -5px rgba(249,115,22,.50);
  color:#fff !important;
}

#rvnx-widget-area a.rvnx-btn:active{transform:translateY(0)}

#rvnx-widget-area a.rvnx-btn::after{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:50%;
  height:100%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
  transform:skewX(-20deg);
  animation:rvnx-shimmer 3s infinite;
  pointer-events:none;
}

#rvnx-widget-area .rvnx-icon svg{
  width:20px;
  height:20px;
  stroke-width:2.5;
  display:block;
  stroke:currentColor;
}

@keyframes rvnx-blink{0%,100%{opacity:1}50%{opacity:.4}}
@keyframes rvnx-shimmer{0%{left:-100%}20%{left:200%}100%{left:200%}}

@media (min-width:768px){
  #rvnx-widget-area.rvnx-smart-cta{flex-direction:row;align-items:center;justify-content:space-between;text-align:right}
  #rvnx-widget-area .rvnx-content{flex:1;padding-left:20px}
  #rvnx-widget-area a.rvnx-btn{width:auto;min-width:250px}
}

@media (prefers-reduced-motion:reduce){
  #rvnx-widget-area .rvnx-badge::before,
  #rvnx-widget-area a.rvnx-btn::after{animation:none !important}
}
