.four-card-grid{align-items:start;display:grid;gap:24px;grid-template-columns:repeat(2,1fr);margin:0 auto;max-width:1200px;padding:40px 20px}.card{background-color:#f0f1f5;border-radius:12px;cursor:pointer;overflow:hidden;position:relative;transition:transform .4s ease,background-color .3s ease}.card,.short-card{height:220px}.align-bottom{align-self:end}.card-bg{background-position:50%;background-size:cover;inset:0;opacity:.15;position:absolute;transition:opacity .3s ease}.card-icon{height:44px;left:20px;position:absolute;top:20px;width:44px;z-index:3}.icon-circle{align-items:center;background-color:#35368f;border-radius:50%;display:flex;height:44px;justify-content:center;width:44px}.icon-circle svg{color:#fff!important;fill:#fff!important;height:22px;width:22px}.card-content{display:flex;flex-direction:column;inset:0;justify-content:flex-end;padding:20px;position:absolute;transition:all .3s ease}.card-headline{color:#000;font-size:1.7rem;font-weight:600;line-height:1.2;margin:0;transition:all .3s ease;word-wrap:break-word;max-width:90%;white-space:normal}.card-body{color:#f0f1f5;font-size:18px;font-weight:500;left:50%;line-height:1.5;opacity:0;position:absolute;text-align:left;top:50%;transform:translate(-50%,60%);transition:all .6s ease;width:80%}.card:hover .card-body{opacity:1;transform:translate(-50%,-50%)}.card:hover{background-color:#35368f;transform:translateY(-6px)}.card:hover .card-bg{opacity:0}.card:hover .card-headline{opacity:0;transform:translateY(-10px)}.card:hover .card-icon{opacity:0;transition:opacity .3s ease}@media (max-width:768px){.four-card-grid{gap:32px;grid-template-columns:1fr;max-width:90%}.card{height:220px}.short-card{height:160px}}