.cards{

    width:100%;
    max-width:360px;

    margin:-315px auto 40px;

    padding:0 12px;

    position:relative;
    z-index:50;

}


.card{

    display:flex;

    align-items:center;

    gap:12px;

    text-decoration:none;

    color:#fff;

    background:rgba(16,22,32,.92);

    border:1px solid rgba(255,255,255,.10);

    border-radius:22px;

    padding:12px;
	
	margin-bottom:5px;

    backdrop-filter:blur(15px);

    box-shadow:0 12px 35px rgba(0,0,0,.35);

    transition:.25s;

}

.card:hover{

    transform:translateY(-3px);

    border-color:#f4b400;

    box-shadow:0 15px 40px rgba(244,180,0,.20);
.card:hover .icon{

    box-shadow:

        0 0 18px rgba(244,180,0,.9),

        0 0 35px rgba(244,180,0,.45),

        inset 0 0 10px rgba(244,180,0,.25);

}
}

.card:active{

    transform:scale(.98);

}



.cabinet-card{

    width:100%;

    margin-bottom:18px;

}

.card .icon{

    width:42px;

    height:42px;

    display:flex;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

    border-radius:14px;

    background:rgba(244,180,0,.12);

}

.card .icon img{

    width:30px;

    height:30px;

    display:block;

    object-fit:contain;

}

.card h3{

    margin:0;

    font-size:18px;

    font-weight:600;

    line-height:1.1;

}

.card p{

    margin:5px 0 0;

    color:#b8bcc6;

    font-size:12px;

    line-height:1.2;

}

.card .icon{

    width:52px;

    height:52px;

    display:flex;

    justify-content:center;

    align-items:center;

    flex-shrink:0;

    border-radius:16px;

    color:#F4B400;

    background:rgba(244,180,0,.08);

    border:1px solid rgba(244,180,0,.25);

    box-shadow:

        0 0 8px rgba(244,180,0,.35),

        inset 0 0 8px rgba(244,180,0,.15);

    transition:.3s;

}

.card .icon svg{

    width:26px;

    height:26px;

    display:block;

}

.card::after{

    content:"›";

    position:absolute;

    right:18px;

    top:50%;

    transform:translateY(-50%);

    color:#f4b400;

    font-size:34px;

    font-weight:300;

    opacity:.9;

    transition:.25s;

    text-shadow:
        0 0 6px rgba(244,180,0,.8),
        0 0 14px rgba(244,180,0,.5);

}

.card:hover::after{

    right:14px;

    text-shadow:
        0 0 10px rgba(244,180,0,1),
        0 0 24px rgba(244,180,0,.8);

}