.card-spotlight{--mouse-x:50%;--mouse-y:50%;--spotlight-color:#ffffff0d;background-color:#111;border:1px solid #222;border-radius:1.5rem;padding:2rem;transition:box-shadow .3s;position:relative;overflow:hidden}.card-spotlight.custom-spotlight-card{-webkit-backdrop-filter:blur(24px)saturate(180%);isolation:isolate;background:linear-gradient(135deg,#1e1e26eb 0%,#191920e0 100%);border:none;border-radius:2.5rem;width:100%;height:100%;padding:0;position:relative;box-shadow:0 28px 60px -20px #00000073,0 18px 40px -15px #00000059}.card-spotlight:before{content:"";background:radial-gradient(circle 300px at var(--mouse-x) var(--mouse-y), var(--spotlight-color), transparent 70%);opacity:0;pointer-events:none;z-index:1;transition:opacity .5s,background .3s;position:absolute;inset:0;transform:translateZ(0)}.card-spotlight:hover:before,.card-spotlight:focus-within:before{opacity:.8;background:radial-gradient(circle 350px at var(--mouse-x) var(--mouse-y), var(--spotlight-color), transparent 65%)}.card-spotlight:after{content:"";background:radial-gradient(circle 150px at var(--mouse-x) var(--mouse-y), #ffffff26, transparent 60%);opacity:0;pointer-events:none;z-index:2;mix-blend-mode:overlay;transition:opacity .4s;position:absolute;inset:0}.card-spotlight:hover:after{opacity:1}.card-spotlight.custom-spotlight-card:hover{box-shadow:0 40px 90px -20px #000000a6,0 28px 60px -15px #0000008c}:root:not(.dark) .card-spotlight{background-color:#e8e8e8;border:1px solid #0000001a}:root:not(.dark) .card-spotlight.custom-spotlight-card{-webkit-backdrop-filter:blur(24px)saturate(180%);--spotlight-color:#00000008;background:linear-gradient(135deg,#e8e8e8f2 0%,#ebebebe6 100%);box-shadow:0 28px 60px -20px #00000014,0 18px 40px -15px #0000000f,inset 0 1px #fffc}:root:not(.dark) .card-spotlight.custom-spotlight-card:hover{box-shadow:0 40px 90px -20px #0000001f,0 28px 60px -15px #0000001a,inset 0 1px #ffffffe6}