/* ===== Read Latest News pill (CSS) ===== */
:root{
  --brand-500:#38b000; /* bright green */
  --brand-700:#2a7a00; /* deep green  */
}

.topnewbanner, .innertopnewbanner{ position: relative; } /* anchor container */

.cta-news{
  position:absolute; right:14px; top:14px; z-index: 50;
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 14px;
  border-radius:999px;
  text-decoration:none;
  background: linear-gradient(90deg, var(--brand-700), var(--brand-500));
  color:#fff;
  border:1px solid rgba(255,255,255,.35);
  box-shadow: 0 8px 24px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.15);
  transform: translateZ(0);
  transition: transform .15s ease, box-shadow .15s ease, opacity .2s ease;
}
.cta-news:hover{ transform: translateY(-1px); box-shadow: 0 12px 28px rgba(0,0,0,.22); }
.cta-news:active{ transform: translateY(0); }

.cta-news__icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:30px; height:30px; border-radius:999px;
  background: rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.28);
}

.cta-news__text{ display:flex; flex-direction:column; line-height:1.1; }
.cta-news__text strong{ font-size:.98rem; letter-spacing:.2px; }
.cta-news__sub{
  font-style:normal; font-size:.83rem; opacity:.9;
  white-space:nowrap; text-overflow:ellipsis; overflow:hidden; max-width:46ch;
}

/* Optional gentle pulse badge */
.cta-news::after{
  content:""; margin-left:6px; width:8px; height:8px; border-radius:999px;
  background:#fff; opacity:.85; box-shadow: 0 0 0 0 rgba(255,255,255,.7);
  transition: box-shadow .6s ease-in-out;
}
.cta-news:hover::after{ box-shadow: 0 0 0 8px rgba(255,255,255,0); }

@media (max-width: 720px){
  .cta-news{ right:10px; top:10px; padding:9px 12px; }
  .cta-news__text strong{ font-size:.94rem; }
  .cta-news__sub{ display:none; } /* keep it compact on small screens */
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .cta-news, .cta-news:hover, .cta-news:active{ transition:none; }
  .cta-news::after{ display:none; }
}

/* If your header is sticky and the pill should scroll with it, you're set.
   If the header is NOT sticky and you want a global sticky pill, swap to:  */
/*
.cta-news{
  position: fixed; right:14px; top:14px;
}
body { padding-top: 56px; } 
*/
