:root{--hero-gradient:conic-gradient(from 90deg at 50% 50%, #75f0bf4d, #75f0bf80, #75f0bfb3, #75f0bf, #75f0bfb3, #75f0bf80, #75f0bf4d)}.hero-banner-card{--start:0;padding:40px 32px;transition:border-color .3s ease-in-out,opacity 1s ease-in-out;position:relative}.hero-banner-card:before{content:"";background:var(--hero-gradient);width:100%;height:100%;-webkit-mask:linear-gradient(#0000, #0000), conic-gradient(from calc((var(--start) - (20 * 1.1)) * 1deg), #ffffff1f 0deg, white, #fff0 100deg);mask:linear-gradient(#0000, #0000), conic-gradient(from calc((var(--start) - (20 * 1.1)) * 1deg), #ffffff1f 0deg, white, #fff0 100deg);opacity:0;background-attachment:fixed;border:2px solid #0000;border-radius:8px;transition:all .5s;position:absolute;top:0;-webkit-mask-clip:padding-box,border-box;mask-clip:padding-box,border-box;-webkit-mask-composite:source-in;mask-composite:intersect}.hero-banner-glow{pointer-events:none;filter:blur(14px);width:103%;height:107%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.hero-banner-glow:before{content:"";background:var(--hero-gradient);width:98%;height:98%;-webkit-mask:linear-gradient(#0000, #0000), conic-gradient(from calc((var(--start) - (20 * 1.1)) * 1deg), #ffffff1f 0deg, white, #fff0 100deg);mask:linear-gradient(#0000, #0000), conic-gradient(from calc((var(--start) - (20 * 1.1)) * 1deg), #ffffff1f 0deg, white, #fff0 100deg);opacity:0;background-attachment:fixed;border:15px solid #0000;border-radius:8px;transition:all 1s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-webkit-mask-clip:padding-box,border-box;mask-clip:padding-box,border-box;-webkit-mask-composite:source-in;mask-composite:intersect}.hero-banner-card:hover>.hero-banner-glow:before{opacity:1}.hero-banner-card:hover:before{opacity:.6}