.tools-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:var(--gap);
width:100%;
max-width:var(--pw3);
margin:0 auto;
}
.tool-card{
display:flex;
align-items:center;
gap:var(--gd2);
padding:var(--gd2);
background-color:var(--bg2);
border:var(--bw1) solid var(--bc1);
border-radius:var(--br1);
color:var(--tx1);
box-shadow:var(--fbs);
}
.tool-card:hover{
background-color:var(--hv1);
border-color:var(--cl1);
}
.tool-card-icon{
width:48px;
height:48px;
min-width:48px;
display:flex;
align-items:center;
justify-content:center;
background-color:var(--bg3);
border-radius:var(--br2);
}
.tool-card-icon svg{
width:26px;
height:26px;
fill:var(--cl1);
}
.tool-card-content{
flex:1;
min-width:0;
}
.tool-card-content h2{
font-family:var(--ff2);
font-size:19px;
font-weight:700;
margin:0;
color:var(--tx1);
}
.tool-card-content p{
font-size:15px;
color:var(--tx2);
margin:4px 0 0;
line-height:1.4;
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
}
.tool-card-arrow{
flex-shrink:0;
}
.tool-card-arrow svg{
width:20px;
height:20px;
fill:var(--tx3);
}
.tool-card:hover .tool-card-arrow svg{
fill:var(--cl1);
}