.card-wrapper:before{content:"";position:absolute;top:-5px;left:-5px;right:-5px;bottom:-5px;background:linear-gradient(90deg,#44ff9a,#44b0ff 23%,#8b44ff 49%,#ff6644 74%,#ebff70);border-radius:15px;filter:blur(10px);opacity:.25}.card{margin:0 auto;width:300px;padding:4px;background:white;text-align:left;border-radius:10px;position:relative;isolation:isolate;overflow:hidden}@property --angle{syntax:"<angle>";initial-value:0deg;inherits:false}.card:after,.card:before{content:"";position:absolute;inset:-3px;background-image:conic-gradient(from var(--angle),#61031d70,#a33a5670,#ffff0070,#77042570,#a33a5670,#ffff0070,#77042570,#a33a5870);border-radius:12px;z-index:-1;opacity:0;animation:spin 5s linear infinite;animation-play-state:paused;transition:opacity .3s ease}.card:before{filter:blur(6.5rem);opacity:0}.card:hover:after,.card:hover:before{opacity:1;animation-play-state:running}@keyframes spin{0%{--angle:0deg}to{--angle:360deg}}.card{transition:transform .3s ease,box-shadow .3s ease}.card:hover{transform:translateY(-6px);box-shadow:0 20px 40px rgba(0,0,0,.18),0 0 35px rgba(212,61,104,.25)}.heritage-bar{height:10px;width:10px;border-radius:9999px;background-color:#ff6900;position:relative;overflow:hidden;transition:width .3s ease}.heritage-bar.active{width:40px;background-color:#ffffff}@media screen and (max-width:640px){.heritage-bar{width:8px;height:8px}.heritage-bar.active{width:25px}}.heritage-bar.completed{background-color:#ff6900}.heritage-bar:after{content:"";position:absolute;inset:0;width:0;background:linear-gradient(90deg,#ff6900,#ff6900)}.heritage-bar.active:after{animation:heritage-progress 3s linear forwards}@keyframes heritage-progress{0%{width:0}to{width:100%}}