.yaka-tools-hub{
    min-height:calc(100vh - 108px);
    padding:62px 24px 90px;
    color:#eef4fa;
    background:
        radial-gradient(circle at 82% 5%,rgba(38,82,119,.18),transparent 34%),
        #06182b;
}

.tools-hub-shell{
    width:min(1180px,100%);
    margin:0 auto;
}

.tools-hub-head{
    max-width:760px;
    margin-bottom:42px;
}

.tools-hub-eyebrow{
    color:#d9ae5f;
    font-size:11px;
    font-weight:700;
    letter-spacing:.14em;
    margin-bottom:11px;
}

.tools-hub-head h1{
    margin:0 0 13px;
    color:#fff;
    font-size:clamp(34px,4vw,50px);
    line-height:1.08;
    font-weight:700;
}

.tools-hub-head p{
    margin:0;
    color:#9cafc1;
    font-size:14px;
    line-height:1.7;
}

.tools-list-title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:13px;
}

.tools-list-title span{
    color:#8297aa;
    font-size:10px;
    font-weight:700;
    letter-spacing:.13em;
}

.tools-list-title small{
    color:#667d92;
    font-size:10px;
}

.yaka-tool-card{
    display:grid;
    grid-template-columns:70px minmax(0,1fr) auto;
    gap:22px;
    align-items:center;

    padding:28px;

    text-decoration:none;

    background:linear-gradient(
        135deg,
        rgba(13,42,70,.98),
        rgba(7,27,47,.98)
    );

    border:1px solid rgba(255,255,255,.085);
    border-radius:14px;

    box-shadow:0 22px 55px rgba(0,0,0,.14);

    transition:.18s ease;
}

.yaka-tool-card:hover{
    transform:translateY(-2px);
    border-color:rgba(217,174,95,.40);
}

.yaka-tool-icon{
    width:58px;
    height:58px;

    display:grid;
    place-items:center;

    border-radius:12px;

    color:#efcb82;
    background:#07192c;
    border:1px solid rgba(217,174,95,.24);

    font-size:25px;
    font-weight:650;
}

.yaka-tool-content{
    min-width:0;
}

.yaka-tool-topline{
    display:flex;
    align-items:center;
    gap:11px;
    margin-bottom:8px;
}

.yaka-tool-topline h2{
    margin:0;
    color:#fff;
    font-size:20px;
    font-weight:650;
}

.yaka-tool-status{
    padding:4px 7px;

    border-radius:4px;

    color:#e0bc72;
    background:rgba(217,174,95,.09);
    border:1px solid rgba(217,174,95,.18);

    font-size:8px;
    font-weight:750;
    letter-spacing:.10em;
}

.yaka-tool-content p{
    max-width:720px;
    margin:0 0 14px;

    color:#91a6b9;
    font-size:12px;
    line-height:1.65;
}

.yaka-tool-features{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}

.yaka-tool-features span{
    padding:5px 8px;

    border-radius:5px;

    color:#a9b9c8;
    background:rgba(255,255,255,.035);
    border:1px solid rgba(255,255,255,.055);

    font-size:9px;
}

.yaka-tool-arrow{
    white-space:nowrap;

    color:#d9ae5f;
    font-size:11px;
    font-weight:650;
}

.yaka-tool-arrow span{
    margin-left:7px;
    font-size:16px;
}

@media(max-width:760px){

    .yaka-tools-hub{
        padding:42px 15px 65px;
    }

    .yaka-tool-card{
        grid-template-columns:55px minmax(0,1fr);
        padding:20px;
    }

    .yaka-tool-icon{
        width:50px;
        height:50px;
    }

    .yaka-tool-arrow{
        grid-column:2;
    }
}

@media(max-width:520px){

    .yaka-tool-card{
        grid-template-columns:1fr;
    }

    .yaka-tool-arrow{
        grid-column:auto;
    }
}