.tools-page { max-width: 960px; margin: 32px auto 64px; padding: 0 20px; }
.tools-page h1 { font-size: 1.75rem; margin-bottom: 8px; color: var(--text); }
.tools-page .lead { color: var(--text-dim); margin-bottom: 32px; line-height: 1.6; max-width: 640px; }
.tools-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.tool-card {
    background: rgba(40,40,40,0.85);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 24px;
    transition: border-color 0.2s, box-shadow 0.2s;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.tool-card:hover { border-color: rgba(22,163,74,0.45); box-shadow: 0 4px 24px rgba(0,0,0,0.25); }
.tool-card.disabled { opacity: 0.55; pointer-events: none; }
.tool-card-icon { width: 40px; height: 40px; color: var(--primary); }
.tool-card h2 { font-size: 1.15rem; margin: 0; color: var(--text); }
.tool-card p { color: var(--text-dim); font-size: 0.92rem; line-height: 1.55; margin: 0; flex: 1; }
.tool-card .btn-tool {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 10px 18px; background: var(--primary); color: #fff; text-decoration: none;
    border-radius: 8px; font-weight: 600; font-size: 0.9rem; border: none; cursor: pointer;
}
.tool-card .btn-tool.secondary { background: transparent; border: 1px solid var(--border); color: var(--text); }
.tool-badge-soon { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-dim); }