
/* v4 Effects Layer — safe visual enhancements only */

/* primary CTA breathing glow */
.btn.red{
  position:relative;
  overflow:hidden;
  animation:redPulse 2.8s ease-in-out infinite;
}
.btn.red::before{
  content:"";
  position:absolute;
  top:-120%;
  left:-40%;
  width:45%;
  height:340%;
  transform:rotate(24deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),transparent);
  transition:left .55s ease;
}
.btn.red:hover::before{
  left:120%;
}
@keyframes redPulse{
  0%,100%{box-shadow:0 12px 30px rgba(255,49,84,.20),0 0 0 rgba(255,49,84,0)}
  50%{box-shadow:0 14px 34px rgba(255,49,84,.30),0 0 22px rgba(255,49,84,.13)}
}

/* card hover lift */
.card,
.v3-metric,
.v3-step,
.v3-feature,
.v3-mini-stat{
  transition:transform .24s ease, border-color .24s ease, box-shadow .24s ease, background .24s ease;
}
.card:hover,
.v3-step:hover,
.v3-feature:hover{
  transform:translateY(-5px);
  border-color:rgba(255,255,255,.16) !important;
  box-shadow:0 20px 55px rgba(0,0,0,.34),0 0 28px rgba(255,49,84,.05);
}
.v3-metric:hover,
.v3-mini-stat:hover{
  transform:translateY(-3px);
  border-color:rgba(255,255,255,.15);
}

/* subtle animated border for core selling point */
.v3-ad-card{
  position:relative;
}
.v3-ad-card::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:21px;
  padding:1px;
  background:linear-gradient(115deg,rgba(255,49,84,.8),rgba(111,76,255,.45),rgba(255,49,84,.15),rgba(255,49,84,.8));
  background-size:240% 240%;
  animation:borderFlow 5s linear infinite;
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
}
@keyframes borderFlow{
  0%{background-position:0% 50%}
  100%{background-position:240% 50%}
}

/* Hero image breathing glow without moving/cropping */
.v3-hero-art{
  transition:box-shadow .35s ease, border-color .35s ease;
}
.v3-hero-art:hover{
  border-color:rgba(255,72,99,.38) !important;
  box-shadow:
    0 28px 76px rgba(0,0,0,.46),
    0 0 52px rgba(255,42,78,.12) !important;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none !important;transition:none !important}
}
