.card-reactive{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(16px);box-shadow:0 4px 20px var(--shadow-light);cursor:default;border-radius:18px;transition:all .4s;position:relative;overflow:hidden}[data-theme=light] .card-reactive{box-shadow:0 4px 20px #00000014,0 0 0 1px var(--card-border)}[data-theme=light] .card-reactive:hover{box-shadow:0 12px 40px #0000001f,0 0 0 1px var(--accent)}.card-reactive:before{content:"";border-radius:inherit;background:radial-gradient(circle at var(--mouse-x,50%)var(--mouse-y,50%),var(--hover-color,#38bdf84d)0%,transparent 70%);opacity:0;pointer-events:none;padding:1px;transition:opacity .35s,background .45s;position:absolute;inset:0}.card-reactive:hover:before{opacity:1}.card-reactive[data-color=cyan]{--hover-color:#38bdf859}.card-reactive[data-color=purple]{--hover-color:#a855f759}.card-reactive[data-color=teal]{--hover-color:#2dd4bf59}.card-reactive[data-color=pink]{--hover-color:#ec489959}.card-reactive[data-color=indigo]{--hover-color:#6366f159}.card-reactive:after{content:"";border-radius:inherit;opacity:.7;pointer-events:none;background:radial-gradient(circle at 20% 20%,#ffffff0d,#0000 70%);transition:opacity .4s;position:absolute;inset:0}.card-reactive:hover{transform:translateY(-3px);box-shadow:0 10px 30px #00000040}.card-reactive .content{z-index:2;position:relative}.footer-reactive{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(14px);box-shadow:0 4px 20px var(--shadow-light);border-radius:16px;transition:all .4s;position:relative;overflow:hidden}[data-theme=light] .footer-reactive{box-shadow:0 4px 20px #0000000f,0 0 0 1px var(--card-border)}[data-theme=light] .footer-reactive:hover{box-shadow:0 8px 30px #0000001a,0 0 0 1px var(--accent)}.footer-reactive:before{content:"";border-radius:inherit;background:radial-gradient(circle at var(--mouse-x,50%)var(--mouse-y,50%),#38bdf840 0%,transparent 70%);opacity:0;pointer-events:none;transition:opacity .4s,background .5s;position:absolute;inset:0}.footer-reactive:hover:before{opacity:1}.footer-reactive p{z-index:2;position:relative}
