
/* ============================================================
   CENTERSPREAD v6.2 — SITE-WIDE GRADIENT BUTTON ANIMATION
   Visible animated color change, no contour/ring lines.
============================================================ */

:root{
  --cs-btn-dark-gradient:
    linear-gradient(
      108deg,
      #6d0f8a 0%,
      #8e2192 24%,
      #b62b84 45%,
      #d83e68 63%,
      #ed5547 81%,
      #ff7517 100%
    );

  --cs-btn-light-gradient:
    linear-gradient(
      108deg,
      #ffffff 0%,
      #fbf1fc 24%,
      #fff7f0 46%,
      #f8ecfb 68%,
      #fff3e8 86%,
      #ffffff 100%
    );
}

/* ALL regular CTA buttons get animated color movement. */
:is(
  .cs-global-header .header-cta,
  body a.btn,
  body button.btn,
  body input.btn[type="submit"],
  body .wp-block-button__link,
  body a.cs-premium-btn,
  body button.cs-premium-btn
){
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
  background-size:240% 240% !important;
  animation:csButtonGradientV62 7s ease-in-out infinite !important;
  transition:
    transform .30s cubic-bezier(.16,1,.3,1),
    box-shadow .30s ease,
    filter .30s ease !important;
}

/* Primary / colored buttons */
:is(
  .cs-global-header .header-cta,
  body .btn-primary,
  body a.cs-gradient-btn,
  body button.cs-gradient-btn,
  body .wp-block-button:not(.is-style-outline) .wp-block-button__link
){
  color:#fff !important;
  background-image:var(--cs-btn-dark-gradient) !important;
  background-color:#8e2192 !important;
}

/*
 * Secondary / outline / white CTA buttons stay light,
 * but now have a clearly visible soft animated lilac/peach gradient.
 */
:is(
  body .btn-secondary,
  body .btn-outline,
  body a.cs-outline-btn,
  body button.cs-outline-btn,
  body .wp-block-button.is-style-outline .wp-block-button__link
){
  background-image:var(--cs-btn-light-gradient) !important;
  background-color:#fff !important;
  background-size:260% 260% !important;
}

/* Remove all previous pseudo-element line / sweep layers. */
:is(
  .cs-global-header .header-cta,
  body a.btn,
  body button.btn,
  body .wp-block-button__link,
  body a.cs-premium-btn,
  body button.cs-premium-btn
)::before,
:is(
  .cs-global-header .header-cta,
  body a.btn,
  body button.btn,
  body .wp-block-button__link,
  body a.cs-premium-btn,
  body button.cs-premium-btn
)::after{
  content:none !important;
  display:none !important;
  animation:none !important;
}

/* Keep text/icons above the animated background. */
:is(
  .cs-global-header .header-cta,
  body a.btn,
  body button.btn,
  body .wp-block-button__link,
  body a.cs-premium-btn,
  body button.cs-premium-btn
) > *{
  position:relative !important;
  z-index:2 !important;
}

@media(hover:hover) and (pointer:fine){
  :is(
    .cs-global-header .header-cta,
    body a.btn,
    body button.btn,
    body .wp-block-button__link,
    body a.cs-premium-btn,
    body button.cs-premium-btn
  ):hover{
    transform:translateY(-3px) !important;
    filter:saturate(1.055) brightness(1.02) !important;
  }
}

@keyframes csButtonGradientV62{
  0%,100%{
    background-position:0% 50%;
  }
  33%{
    background-position:48% 35%;
  }
  66%{
    background-position:100% 58%;
  }
}

/* Functional controls remain static. */
.cs-insights-exact .filter-btn,
.cs-insights-exact .sort-select,
.cs-global-header .mobile-menu summary,
.cs-services-v2 .menu,
.cs-urban-glo-v50 .play,
button.play,
button.menu{
  animation:none !important;
  background-image:none !important;
}

/* Disabled buttons stop moving. */
:is(
  button.btn:disabled,
  input.btn:disabled,
  .wp-block-button__link[aria-disabled="true"]
){
  animation:none !important;
}

@media(prefers-reduced-motion:reduce){
  :is(
    .cs-global-header .header-cta,
    body a.btn,
    body button.btn,
    body input.btn[type="submit"],
    body .wp-block-button__link,
    body a.cs-premium-btn,
    body button.cs-premium-btn
  ){
    animation:none !important;
    background-position:50% 50% !important;
  }
}
