/* EasyClippers 13.14: the giveaway page's buttons on the public reading pages (guides, legal, referral pages), which
   site.css keeps dark navy on every theme. There a button is the main aqua pill; it gets the poster's outline and hard
   shadow that presses down, drawn in white because an ink edge disappears on navy (poster.css does the same for the
   app's dark theme; the owner, Nov 5: "make the shaddow or whatever white like the bottom part"). Loaded after site.css; the skin is set with !important because site.css styles these buttons
   twice (the plain pill and the liquid finish). */
.btn, .cta .btn {
  background: #2ee6d6 !important; color: #03141a !important; filter: none !important;
  border: 2px solid #ffffff !important; border-radius: 999px !important;
  box-shadow: 0 4px 0 #ffffff, 0 14px 30px -16px rgba(46, 230, 214, .55) !important;
  transition: transform .14s, box-shadow .14s, background-color .14s !important;
}
.btn:hover, .cta .btn:hover { background: #74f1e6 !important; transform: translateY(-1px); box-shadow: 0 5px 0 #ffffff, 0 14px 30px -16px rgba(46, 230, 214, .6) !important; }
.btn:active, .cta .btn:active { transform: translateY(3px) !important; box-shadow: 0 1px 0 #ffffff !important; }
.site-nav .btn { border-width: 1.5px !important; box-shadow: 0 3px 0 #ffffff !important; }
.site-nav .btn:hover { box-shadow: 0 4px 0 #ffffff !important; }
.site-nav .btn:active { transform: translateY(2px) !important; box-shadow: 0 1px 0 #ffffff !important; }
@media (prefers-reduced-motion: reduce) {
  .btn { transition: none !important; }
  .btn:is(:hover, :active) { transform: none !important; }
}
