/* The shader paints only the rim. A separate opaque layer owns the lens color. */
.liquid-button.liquid-button {
  --liquid-fill: var(--violet, var(--accent));
  --liquid-ink: oklch(17% .018 300);
  position: relative; isolation: isolate; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center; gap: 18px;
  min-height: 48px; max-width: 100%; padding: 13px 22px;
  border: 0; border-radius: 999px; background: transparent;
  color: var(--liquid-ink); font: 600 14px/1.45 var(--sans);
  text-decoration: none; text-transform: none; letter-spacing: 0;
  box-shadow: 0 5px 14px oklch(12% .01 295 / .16);
  transition: transform .25s cubic-bezier(.16,1,.3,1);
}
.liquid-button.liquid-button::before {
  content: ""; position: absolute; inset: 0; z-index: -3;
  padding: 0; border-radius: inherit; mask: none; -webkit-mask: none;
  background: linear-gradient(135deg,oklch(95% .008 260),oklch(34% .008 260) 25%,oklch(85% .008 260) 47%,oklch(29% .008 260) 73%,oklch(96% .008 260));
}
.liquid-button.liquid-button::after {
  content: ""; position: absolute; inset: 2px; z-index: -1;
  border-radius: inherit; background: var(--liquid-fill);
  pointer-events: none;
}
.liquid-button.liquid-button > .liquid-stroke {
  position: absolute; display: block; inset: 0; z-index: -2;
  border-radius: inherit; overflow: hidden; pointer-events: none;
  transform: none; transition: none;
}
.liquid-stroke canvas { display: block; width: 100% !important; height: 100% !important; }
.liquid-button.liquid-button > span:not(.liquid-stroke) { color: inherit; }
.liquid-button.liquid-button:hover { color: var(--liquid-ink); background: transparent; transform: translateY(-2px); }
.liquid-button.liquid-button:active { transform: translateY(0); }
.liquid-button.liquid-button:focus-visible { outline: 2px solid var(--ink); outline-offset: 5px; }
.liquid-button.liquid-button:disabled { opacity: .65; cursor: wait; transform: none; }
body[data-theme="light"][data-lens="strategy"] .liquid-button,
body[data-theme="light"]:not([data-lens]) .liquid-button { --liquid-ink: oklch(98% .006 300); }
@media(prefers-reduced-motion:reduce) {
  .liquid-button.liquid-button { transition: none; }
  .liquid-button.liquid-button:hover { transform: none; }
}

/* ABOUT PROFILE CTA WIDTH */
a.case-cta.about-profile-cta.liquid-button {
  width: auto !important;
  max-width: max-content !important;
  display: inline-flex !important;
}
a.case-cta.about-profile-cta.liquid-button .liquid-stroke,
a.case-cta.about-profile-cta.liquid-button .liquid-stroke canvas {
  width: 100% !important;
  height: 100% !important;
  border-radius: inherit !important;
}
