/* VP Peptides — motion & hover polish. Additive, hover-only, motion-safe. */
@media (prefers-reduced-motion: no-preference){

  /* Buttons: lift + gold shine sweep */
  .btn{transition:transform .25s ease, box-shadow .25s ease, filter .25s ease}
  .btn-gold{position:relative; overflow:hidden}
  .btn-gold:hover{transform:translateY(-2px); box-shadow:0 10px 26px -12px rgba(231,200,119,.6)}
  .btn-gold::after{content:""; position:absolute; top:0; left:-130%; width:55%; height:100%;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);
    transform:skewX(-18deg); pointer-events:none}
  .btn-gold:hover::after{animation:vpshine 1.05s ease forwards}
  @keyframes vpshine{from{left:-130%} to{left:150%}}
  .btn-ghost{transition:transform .25s ease, border-color .25s ease, color .25s ease}
  .btn-ghost:hover{transform:translateY(-2px)}
  .cta{transition:transform .25s ease, box-shadow .25s ease}
  .cta:hover{transform:translateY(-2px); box-shadow:0 10px 26px -12px rgba(231,200,119,.5)}

  /* Cards: subtle lift + gold glow ([class] lifts specificity to win over body <style>) */
  .card[class], .coa-card[class], .test[class], .level[class], .trio > .c[class]{
    transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease, border-color .35s ease}
  .card[class]:hover, .coa-card[class]:hover, .test[class]:hover, .level[class]:hover, .trio > .c[class]:hover{
    transform:translateY(-4px); box-shadow:0 16px 42px -20px rgba(201,162,75,.42)}

  /* Product photos: gentle zoom */
  img[src*="prod-"]{transition:transform .5s cubic-bezier(.2,.7,.2,1)}
  img[src*="prod-"]:hover{transform:scale(1.045)}

  /* Links: animated gold underline (replaces default underline on these) */
  .nav-links a, .foot-links a, footer a, .related a, .nav a.back{position:relative}
  .nav-links a::after, .foot-links a::after, footer a::after, .related a::after{
    content:""; position:absolute; left:0; bottom:-2px; width:0; height:1px;
    background:var(--gold-1,#E7C877); transition:width .3s ease}
  .nav-links a:hover::after, .foot-links a:hover::after, footer a:hover::after, .related a:hover::after{width:100%}
  .nav-links a:hover, .foot-links a:hover, footer a:hover, .related a:hover{text-decoration:none}
}
