:root{--primary-blue:#6db5f9;--primary-purple:#bb5eed;--bright-blue:#4db6ff;--dark-blue:#131d30;--dark-gray:#374151}.variantCard{color:var(--dark-blue);cursor:pointer;border-radius:50px;justify-content:center;align-items:center;padding:16px 24px;font-size:17px;font-weight:700;text-decoration:none;transition:all .4s cubic-bezier(.34,1.56,.64,1);display:flex;position:relative;overflow:hidden}.variantCard:after{content:"";mix-blend-mode:normal;background:radial-gradient(circle at center, rgba(var(--subject-rgb), .2) 0%, rgba(var(--subject-rgb), .1) 25%, transparent 50%);opacity:0;z-index:0;width:200%;height:200%;transition:all .5s cubic-bezier(.34,1.56,.64,1);position:absolute;top:-50%;left:-50%;transform:scale(.5)rotate(0)}.variantCard>*{z-index:2;position:relative}@media (hover:hover){.variantCard:hover{color:rgb(var(--subject-rgb))}.variantCard:hover:after{opacity:1;transform:scale(1)rotate(180deg)}}@media (max-width:1600px){.variantCard{padding:14px 20px;font-size:15px}}@media (max-width:1280px){.variantCard{padding:13px 18px;font-size:15px}}@media (max-width:1024px){.variantCard{min-height:54px;padding:14px 20px;font-size:15px}}@media (max-width:768px){.variantCard{border-radius:40px;min-height:50px;padding:12px 16px;font-size:15px}}@media (max-width:640px){.variantCard{border-radius:30px;min-height:48px;padding:12px 14px;font-size:14px}}@media (max-width:480px){.variantCard{border-radius:24px;min-height:44px;padding:10px 12px;font-size:14px}}