/* Youth's Online — reference SVG rounded CTA, restricted to the same two links.
   No stage, no white background, no dependencies or extra scripts. */
a.yo-3d-button {
  --yo-cta-main:#f97316;
  --yo-cta-top:#ff9f13;
  --yo-cta-bottom:#fa5d12;
  position:relative;
  isolation:isolate;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.4em;
  box-sizing:border-box;
  overflow:visible;
  color:#fff!important;
  font-weight:800;
  border-radius:17px!important;
  border:0!important;
  background:var(--yo-cta-main)!important;
  box-shadow:0 7px 17px rgba(194,88,19,.17)!important;
  text-shadow:none!important;
  transform:translateY(0);
  transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease!important;
  text-decoration:none;
  -webkit-tap-highlight-color:transparent;
}
/* The uploaded SVG has two small offset ellipses behind an orange pill. */
a.yo-3d-button::before,
a.yo-3d-button::after {
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:-1;
  border-radius:50%;
  transition:transform .26s ease;
}
a.yo-3d-button::before {
  left:14%;top:-10%;width:32%;height:52%;background:var(--yo-cta-top);
}
a.yo-3d-button::after {
  right:12%;bottom:-10%;width:25%;height:50%;background:var(--yo-cta-bottom);
}
/* WhatsApp alone is green; both links retain the same SVG-inspired form. */
a.yo-3d-button.nav-cta {
  --yo-cta-main:#16a34a;
  --yo-cta-top:#4ade80;
  --yo-cta-bottom:#15803d;
  box-shadow:0 7px 17px rgba(21,128,61,.19)!important;
}
a.yo-3d-button:hover,a.yo-3d-button:focus-visible {
  color:#fff!important;
  transform:translateY(-3px);
  box-shadow:0 11px 22px rgba(15,65,49,.22)!important;
}
a.yo-3d-button:hover::before,a.yo-3d-button:focus-visible::before {transform:translate(-6px,-4px) scale(1.12);}
a.yo-3d-button:hover::after,a.yo-3d-button:focus-visible::after {transform:translate(7px,4px) scale(1.13);}
a.yo-3d-button:active {transform:translateY(1px) scale(.985);}
a.yo-3d-button:focus-visible {outline:3px solid #164fc4;outline-offset:4px;}
@media(prefers-reduced-motion:reduce) {
 a.yo-3d-button,a.yo-3d-button::before,a.yo-3d-button::after {transition:none!important;}
}
