#values {
    border-top: 1px solid var(--border);

	.list {
	    display: grid;
	    grid-template-columns: repeat(4, 1fr);
	    border: 1px solid var(--border);
	    border-radius: 12px;
	    overflow: hidden;

        @media only screen and (max-width: 980px) {
            grid-template-columns: 1fr;
        } 

		.item {
            display: grid;
            align-content: baseline;
            gap: 16px;
            padding: 20px;
            border-right: 1px solid var(--border);
            border-bottom: 1px solid var(--border);
            background: #071228;
            
            @media only screen and (max-width: 980px) {
              	justify-content: center;
                justify-items: center;
                text-align: center;
            }            
            
            &:hover {
				background-color: rgba(255, 255, 255, 0.12);
        		backdrop-filter: blur(5px);
			}

		    i {
			    width: 36px;
			    height: 36px;
			    border-radius: 50%;
			    display: flex;
			    align-items: center;
			    justify-content: center;
			    background: #0B182A;
                background: radial-gradient(#c9a96147, transparent);
			    color: var(--primary);
			    border: 1px solid var(--primary);
		    }

		    .heading {
		    	text-transform: uppercase;
		    	color: var(--light);
		    	text-box: cap alphabetic;
		    }
		}
	}
}