.card-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));gap:2rem;margin-top:3rem;list-style:none}.card{position:relative;display:flex;flex-direction:column;padding:2.5rem 2rem;background:hsla(0,0%,100%,.02);border:1px solid hsla(0,0%,100%,.05);border-radius:16px;backdrop-filter:blur(10px);overflow:hidden;transition:all .4s cubic-bezier(0.175, 0.885, 0.32, 1.275);z-index:1}.card::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--primary-color) 20%, transparent), transparent 70%);opacity:0;transition:opacity .5s ease;z-index:-1;pointer-events:none}.card:hover{transform:translateY(-8px);border-color:color-mix(in srgb, var(--primary-color) 50%, transparent);background:hsla(0,0%,100%,.04);box-shadow:0 15px 30px -10px color-mix(in srgb, var(--primary-color) 20%, transparent)}.card:hover::before{opacity:1}.card h2{font-size:1.75rem}.card h3{font-size:1.4rem}.card h4{font-size:1.25rem}.card h5{font-size:1rem}.card h6{font-size:.875rem}.card h2,.card h3,.card h4,.card h5,.card h6{color:var(--text-color, #ffffff);transition:color .3s ease}.card h2::after,.card h3::after,.card h4::after,.card h5::after,.card h6::after{content:"";display:block;width:35px;height:3px;background:var(--primary-color);margin-top:1rem;border-radius:2px;transition:width .3s ease}.card p{margin:0;line-height:1.6;color:hsla(0,0%,100%,.7);font-size:1rem}.card .btn{margin-top:1rem}.card:hover h2::after,.card:hover h3::after,.card:hover h4::after,.card:hover h5::after,.card:hover h6::after{width:60px}