/* BETA-030: hero/auth CTAs = catalog filter chips (#requests .filters .chip). */
:root{
  --chip-face:#f6fff8;
  --chip-face-2:#e3f3e8;
  --chip-line:#8fc9a0;
  --chip-ink:#1c4a38;
  --chip-edge:#2a6b4a;
  --chip-glow:rgba(72,210,130,.42);
}

.cta-pill,
.auth-pill{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
  gap:10px !important;
  border-radius:0 !important;
}
.cta-pill__need,
.cta-pill__help,
.auth-pill__signup,
#joinBtn{
  flex:1 1 0;
  min-height:48px;
  padding:10px 18px !important;
  border-radius:999px !important;
  font-weight:800 !important;
  letter-spacing:.02em;
  color:var(--chip-ink) !important;
  background:linear-gradient(#f6fff8,#e3f3e8) !important;
  border:1px solid var(--chip-line) !important;
  box-shadow:
    inset 0 1px 0 #fff,
    0 4px 0 var(--chip-edge),
    0 10px 18px rgba(30,80,50,.18),
    0 0 16px 5px var(--chip-glow) !important;
  text-shadow:none !important;
  transform:translateY(0);
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
  filter:none !important;
}
.cta-pill__need:hover,
.cta-pill__help:hover,
.auth-pill__signup:hover,
#joinBtn:hover,
.cta-pill__need:focus-visible,
.cta-pill__help:focus-visible,
.auth-pill__signup:focus-visible,
#joinBtn:focus-visible{
  transform:translateY(-2px);
  outline:3px solid #246449;
  outline-offset:3px;
  box-shadow:
    inset 0 1px 0 #fff,
    0 6px 0 #245c40,
    0 14px 22px rgba(30,80,50,.22),
    0 0 22px 7px rgba(80,230,140,.55) !important;
}
.cta-pill__need:active,
.cta-pill__help:active,
.auth-pill__signup:active,
#joinBtn:active{
  transform:translateY(3px);
  box-shadow:
    inset 0 2px 5px rgba(0,0,0,.12),
    0 1px 0 var(--chip-edge) !important;
}
html.is-phone .cta-pill .cta-pill__need,
html.is-phone .cta-pill .cta-pill__help,
html.is-phone .auth-pill .auth-pill__signup,
html.is-phone #joinBtn.auth-pill__signup,
html.is-phone .cta-pill__need,
html.is-phone .cta-pill__help{
  border-radius:999px !important;
  box-shadow:
    inset 0 1px 0 #fff,
    0 4px 0 var(--chip-edge),
    0 10px 18px rgba(30,80,50,.18),
    0 0 16px 5px var(--chip-glow) !important;
}
.auth-pill__login{border-right:0 !important;}