/* Original visual adaptation of Ali Imam's public Liquid Glass preview:
   https://21st.dev/@designali-in/components/liquid-glass-button
   CSS interaction with locally saved Replicate-generated decorative video. */
.theme-02 .button{
  position:relative;isolation:isolate;overflow:hidden;border-radius:999px;
  min-height:48px;padding:14px 25px;border:1px solid #bcb0e0;
  background:linear-gradient(145deg,#8062d0,#7256c1 64%,#6345b0);
  color:#fff;box-shadow:inset 0 1px 1px #ffffffe0,inset 1px 0 3px #ffffff45,inset 0 -2px 4px #bba3ff65,0 5px 14px #28213e22;
  backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);
  text-decoration:none;text-shadow:0 1px 2px #10091f80;
  transition:transform .25s ease,box-shadow .3s ease,border-color .3s ease;
}
.theme-02 .button>*{position:relative;z-index:2}
.theme-02 .button::before{
  content:'';position:absolute;z-index:-1;inset:0;pointer-events:none;border-radius:inherit;
  background:radial-gradient(ellipse at var(--glass-x,25%) var(--glass-y,0%),#9a79e650,transparent 62%),linear-gradient(180deg,#ffffff24,transparent 48%,#7256c125);
}
.theme-02 .button::after{
  content:'';position:absolute;z-index:-1;inset:-70% -50%;pointer-events:none;
  background:linear-gradient(115deg,transparent 38%,#ffffff08 43%,#ffffff40 49%,#d1c2ff18 54%,transparent 60%);
  transform:translateX(-55%);opacity:0;
}
.theme-02 .button:is(:hover,:focus-visible){border-color:#d5c8f6;box-shadow:inset 0 1px 2px #fff,inset 0 -2px 5px #bca5ff85,0 7px 18px #49337230;transform:translateY(-2px)}
.theme-02 .button:is(:hover,:focus-visible)::after{animation:glass-reflection 1.1s ease-out both}
.theme-02 .button:active{transform:translateY(1px) scale(.985)}
.theme-02 .button:focus-visible{outline:3px solid #7256c1;outline-offset:4px}
.theme-02 .button:disabled{transform:none;opacity:.5}
.theme-02 .header-cta{min-height:44px;padding:12px 21px}
@keyframes glass-reflection{0%{transform:translateX(-55%);opacity:0}25%{opacity:.7}100%{transform:translateX(55%);opacity:0}}
@media(prefers-reduced-motion:reduce){.theme-02 .button,.theme-02 .button::after{animation:none!important;transition:none!important;transform:none!important}}

/* Replicate texture stays decorative and below the readable label. */
.theme-02 .button>.glass-video{position:absolute;z-index:0;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;pointer-events:none;opacity:0;filter:grayscale(1) contrast(.8);mix-blend-mode:screen;transition:opacity .35s ease}
.theme-02 .button.glass-playing>.glass-video{opacity:.24}
@media(prefers-reduced-motion:reduce){.theme-02 .button>.glass-video{display:none}}