/* Savannah Peptide — home hero 'Shop the Catalog' button, variant C.
   Load AFTER savannah-dark.css. Scoped to the hero so other .sp-btn buttons are unaffected. */
/* Variant C — "Shine Sweep": polished gloss with a light rim; on hover it lifts and a soft diagonal light streak glides across. */
body.sp-dark.sp-hero-dark .sp-hero-full .sp-btn{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate;
  background:
    linear-gradient(180deg,rgba(255,255,255,.2) 0%,rgba(255,255,255,.05) 45%,rgba(255,255,255,0) 62%),
    linear-gradient(180deg,#2cc6b5 0%,#17b3a3 60%,#11998a 100%)!important;
  color:#04121f!important;
  border:0!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.45),
    inset 0 0 0 1px rgba(255,255,255,.14),
    inset 0 -2px 0 rgba(4,18,31,.16),
    0 2px 4px rgba(0,0,0,.4),
    0 12px 28px -6px rgba(0,0,0,.55),
    0 14px 32px -6px rgba(23,179,163,.45)!important;
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease,background .3s ease!important;
}
body.sp-dark.sp-hero-dark .sp-hero-full .sp-btn::after{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  top:-20%;bottom:-20%;left:-60%;width:40%;
  background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.18) 30%,rgba(255,255,255,.5) 50%,rgba(255,255,255,.18) 70%,rgba(255,255,255,0) 100%);
  transform:skewX(-20deg);
  opacity:0;
}
body.sp-dark.sp-hero-dark .sp-hero-full .sp-btn:hover,body.sp-dark.sp-hero-dark .sp-hero-full .sp-btn:focus-visible{
  background:
    linear-gradient(180deg,rgba(255,255,255,.26) 0%,rgba(255,255,255,.07) 45%,rgba(255,255,255,0) 62%),
    linear-gradient(180deg,#45d6c6 0%,#2ac4b3 60%,#17a898 100%)!important;
  color:#04121f!important;
  transform:translateY(-3px) scale(1.015);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 0 0 1px rgba(255,255,255,.18),
    inset 0 -2px 0 rgba(4,18,31,.14),
    0 4px 8px rgba(0,0,0,.3),
    0 20px 38px -8px rgba(0,0,0,.6),
    0 22px 44px -8px rgba(63,207,191,.6)!important;
}
body.sp-dark.sp-hero-dark .sp-hero-full .sp-btn:hover::after,body.sp-dark.sp-hero-dark .sp-hero-full .sp-btn:focus-visible::after{opacity:1;left:120%;transition:left .75s cubic-bezier(.3,.6,.3,1),opacity .1s}
body.sp-dark.sp-hero-dark .sp-hero-full .sp-btn:active{transform:translateY(-1px);transition-duration:.08s!important}
@media (prefers-reduced-motion:reduce){body.sp-dark.sp-hero-dark .sp-hero-full .sp-btn,body.sp-dark.sp-hero-dark .sp-hero-full .sp-btn:hover,body.sp-dark.sp-hero-dark .sp-hero-full .sp-btn:focus-visible,body.sp-dark.sp-hero-dark .sp-hero-full .sp-btn:active{transform:none!important;transition:background .2s,box-shadow .2s!important}body.sp-dark.sp-hero-dark .sp-hero-full .sp-btn::after{display:none}}


/* Savannah Peptide - DEALS page (/deals/, page 550) hero button 'View available products', variant 3.
   Variant 3 - "Glow Ring": dark navy glass pill with a slowly rotating teal-to-cyan light ring around the edge (gold glint), white text.
   Hover: the pill fills with teal, the ring brightens and the button lifts with a teal glow. Load AFTER the inline dark CSS. Scoped to .sp-deals-hero only. */
@property --sp-ring{syntax:'<angle>';inherits:false;initial-value:0deg}
body.sp-dark .sp-deals-hero .sp-btn{
  position:relative!important;isolation:isolate;
  border:2px solid transparent!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,0) 55%) padding-box,
    linear-gradient(#0f1f33,#0a1626) padding-box,
    conic-gradient(from var(--sp-ring),rgba(23,179,163,.25) 0deg,#17b3a3 70deg,#7ff0e2 110deg,#c9a96e 135deg,#17b3a3 165deg,rgba(23,179,163,.25) 240deg,rgba(23,179,163,.25) 360deg) border-box!important;
  color:#f1f5f9!important;
  box-shadow:0 2px 4px rgba(0,0,0,.4),0 12px 28px -8px rgba(0,0,0,.6),0 0 22px -4px rgba(23,179,163,.45)!important;
  animation:spRingSpin 4s linear infinite;
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease,color .2s!important;
}
@keyframes spRingSpin{to{--sp-ring:360deg}}
body.sp-dark .sp-deals-hero .sp-btn:hover,body.sp-dark .sp-deals-hero .sp-btn:focus-visible{
  background:
    linear-gradient(180deg,rgba(255,255,255,.2),rgba(255,255,255,0) 58%) padding-box,
    linear-gradient(180deg,#2cc6b5,#17b3a3 60%,#11998a) padding-box,
    conic-gradient(from var(--sp-ring),#5fe0d1 0deg,#ffffff 90deg,#c9a96e 130deg,#5fe0d1 180deg,#17b3a3 270deg,#5fe0d1 360deg) border-box!important;
  color:#04121f!important;
  transform:translateY(-3px);
  animation-duration:1.6s;
  box-shadow:0 4px 8px rgba(0,0,0,.35),0 20px 38px -8px rgba(0,0,0,.6),0 0 34px -2px rgba(63,207,191,.65)!important;
}
body.sp-dark .sp-deals-hero .sp-btn:active{transform:translateY(-1px);transition-duration:.08s!important}
@media (prefers-reduced-motion:reduce){
  body.sp-dark .sp-deals-hero .sp-btn,body.sp-dark .sp-deals-hero .sp-btn:hover,body.sp-dark .sp-deals-hero .sp-btn:focus-visible{animation:none!important;--sp-ring:200deg;transform:none!important;transition:background .2s,box-shadow .2s,color .2s!important}
}

/* Product cards: after Add to cart, WooCommerce's "View cart" link = small one-line teal text link (not a pill). Scoped to product grids only. */
body ul.products li.product a.added_to_cart,
body.sp-dark ul.products li.product a.added_to_cart{
  display:block!important;width:fit-content!important;margin:.55em 0 0 10px!important;padding:0!important;
  background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;
  color:#2fc4b4!important;font-size:.8125rem!important;font-weight:600!important;line-height:1.4!important;
  text-align:left!important;white-space:nowrap!important;text-decoration:none!important;
  min-height:0!important;height:auto!important;transform:none!important;
}
body ul.products li.product a.added_to_cart::after,
body.sp-dark ul.products li.product a.added_to_cart::after{
  content:"\00a0\2192"!important;font-family:inherit!important;font-weight:inherit!important;margin:0!important;display:inline!important;
}
body ul.products li.product a.added_to_cart:hover,
body ul.products li.product a.added_to_cart:focus-visible,
body.sp-dark ul.products li.product a.added_to_cart:hover,
body.sp-dark ul.products li.product a.added_to_cart:focus-visible{
  background:none!important;color:#5fe0d1!important;text-decoration:underline!important;text-underline-offset:3px;text-decoration-thickness:1px;
}
@media (min-width:768px){body ul.products li.product a.added_to_cart,body.sp-dark ul.products li.product a.added_to_cart{margin-left:12px!important}}
