/* Adapted from Greg's animated-gradient-cta-button.html. No external scripts.
   Explicit light/dark appearances share the same reversible interaction. */
.animated-cta {
  --cta-bg:#111111; --cta-fg:#ffffff;
  --cta-hover-bg:#ffffff; --cta-hover-fg:#111111;
  --cta-shimmer:255,255,255; --cta-glow:255,255,255;
  --cta-edge-strong:rgba(255,255,255,.9); --cta-edge-soft:rgba(255,255,255,.18);
  --cta-ease:cubic-bezier(.16,1,.3,1);
  position:relative; isolation:isolate; display:inline-flex;
  align-items:center; justify-content:center; min-height:44px; max-width:100%;
  padding:14px 28px; border:0; border-radius:999px; overflow:hidden;
  background:transparent; color:var(--cta-fg); text-decoration:none;
  font-family:inherit; font-size:12px; line-height:1.5; font-weight:600;
  letter-spacing:.1em; text-transform:uppercase; text-align:center;
  cursor:pointer; touch-action:manipulation;
  transition:color .4s var(--cta-ease),box-shadow .4s,transform .4s var(--cta-ease);
}
[data-mode="light"] .animated-cta, [data-theme="light"] .animated-cta,
.animated-cta[data-appearance="light"] {
  --cta-bg:#ffffff; --cta-fg:#111111;
  --cta-hover-bg:#111111; --cta-hover-fg:#ffffff;
  --cta-shimmer:0,0,0; --cta-glow:0,0,0;
  --cta-edge-strong:rgba(0,0,0,.8); --cta-edge-soft:rgba(0,0,0,.16);
}
[data-mode="dark"] .animated-cta, [data-theme="dark"] .animated-cta,
.animated-cta[data-appearance="dark"] {
  --cta-bg:#111111; --cta-fg:#ffffff;
  --cta-hover-bg:#ffffff; --cta-hover-fg:#111111;
  --cta-shimmer:255,255,255; --cta-glow:255,255,255;
  --cta-edge-strong:rgba(255,255,255,.9); --cta-edge-soft:rgba(255,255,255,.18);
}
.animated-cta::before {
  content:""; position:absolute; top:50%; left:50%; width:300%; aspect-ratio:1;
  z-index:-2; pointer-events:none; transform-origin:center;
  background:conic-gradient(var(--cta-edge-strong),var(--cta-edge-soft) 25%,var(--cta-edge-strong) 50%,var(--cta-edge-soft) 75%,var(--cta-edge-strong));
  animation:gb-cta-spin 4s linear infinite;
}
.animated-cta::after {
  content:""; position:absolute; inset:1.5px; border-radius:inherit; z-index:-1;
  pointer-events:none; background:var(--cta-bg); transition:background .4s var(--cta-ease);
}
.animated-cta .animated-cta-shimmer {
  position:absolute; inset:-50% auto auto -50%; width:40%; height:200%; z-index:0;
  pointer-events:none; color:inherit;
  background:radial-gradient(ellipse at center,rgba(var(--cta-shimmer),.24),transparent 70%);
  animation:gb-cta-shimmer 3.5s ease-in-out infinite;
}
.animated-cta .animated-cta-label { position:relative; z-index:1; display:inline-flex; align-items:center; justify-content:center; gap:10px; color:inherit; }
.animated-cta .animated-cta-label svg { flex-shrink:0; width:16px; height:16px; transition:transform .4s var(--cta-ease); }
.animated-cta:focus-visible { outline:2px solid currentColor; outline-offset:5px; }
.animated-cta:focus-visible:not(:disabled) { color:var(--cta-hover-fg); transform:translateY(-2px); box-shadow:0 0 24px rgba(var(--cta-glow),.16); }
.animated-cta:focus-visible:not(:disabled)::after { background:var(--cta-hover-bg); }
.animated-cta:focus-visible:not(:disabled) .animated-cta-label svg { transform:translateX(3px); }
@media(hover:hover) {
  .animated-cta:hover:not(:disabled) { background:transparent; color:var(--cta-hover-fg); transform:translateY(-2px); box-shadow:0 0 25px rgba(var(--cta-glow),.2),0 0 60px rgba(var(--cta-glow),.08); }
  .animated-cta:hover:not(:disabled)::after { background:var(--cta-hover-bg); }
  .animated-cta:hover:not(:disabled)::before { animation-duration:2s; }
  .animated-cta:hover:not(:disabled) .animated-cta-shimmer { animation-duration:1.8s; }
  .animated-cta:hover:not(:disabled) .animated-cta-label svg { transform:translateX(3px); }
}
.animated-cta:disabled { cursor:wait; opacity:.5; transform:none; box-shadow:none; }
.animated-cta:disabled::before,.animated-cta:disabled .animated-cta-shimmer { animation-play-state:paused; }
.animated-cta--compact { padding:10px 18px; font-size:10px; letter-spacing:.06em; }
@keyframes gb-cta-spin { from{transform:translate(-50%,-50%) rotate(0)} to{transform:translate(-50%,-50%) rotate(360deg)} }
@keyframes gb-cta-shimmer { 0%{transform:translateX(0);opacity:0} 15%{opacity:1} 50%{transform:translateX(425%);opacity:1} 65%,100%{transform:translateX(425%);opacity:0} }
@media(prefers-reduced-motion:reduce) {
  .animated-cta,.animated-cta::before,.animated-cta::after,.animated-cta * { animation:none!important; transition:none!important; }
  .animated-cta::before { transform:translate(-50%,-50%) rotate(45deg); }
  .animated-cta .animated-cta-shimmer { display:none; }
  .animated-cta:hover:not(:disabled),.animated-cta:focus-visible:not(:disabled) { transform:none; }
}
