.home { max-width:1240px; padding-top:44px; }
.intro { text-align:center; margin:0 auto 30px; }
.intro h1 { max-width:1000px; margin:0 auto 14px; font-size:clamp(2rem,3.4vw,2.625rem); font-weight:700; }
.intro .lead { max-width:790px; margin:0 auto; font-size:1.125rem; line-height:1.65; }
.tool-filters { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin:0 0 28px; }
.tool-filters button { min-height:40px; padding:8px 20px; border-radius:24px; border:1px solid var(--line); background:white; color:#54545f; font-size:.875rem; font-weight:600; }
.tool-filters button:hover { border-color:#94949f; background:#fafafd; }
.tool-filters button[aria-pressed=true] { color:white; background:#33333b; border-color:#33333b; }
.directory-heading { display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin:0 0 14px; }
.directory-heading h2 { margin:0; font-size:.875rem; font-weight:600; color:var(--muted); letter-spacing:0; }
.directory-heading p { margin:0; color:var(--muted); font-size:.8125rem; }
.tool-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.tool-card { display:flex; flex-direction:column; min-width:0; padding:28px 24px 22px; border:1px solid var(--line); border-radius:16px; background:#fff; color:var(--ink); text-decoration:none; transition:border-color .18s,box-shadow .18s,background .18s; }
.tool-card:hover { border-color:#ababbb; background:#fefeff; box-shadow:0 8px 24px rgba(51,51,59,.06); }
.tool-card:focus-visible { outline-offset:5px; }
.tool-card-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
.tool-icon { display:grid; place-items:center; width:52px; height:52px; border-radius:12px; }
.tool-icon .icon { width:34px; height:34px; }
.tool-category { font-size:.75rem; color:var(--muted); }
.tool-copy { flex:1; }
.tool-copy h3 { font-size:1.25rem; line-height:1.35; letter-spacing:-.25px; margin:0 0 12px; }
.tool-copy p { font-size:.875rem; line-height:1.6; color:var(--muted); margin:0 0 22px; }
.tool-card-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:16px; border-top:1px solid #eeeef4; }
.tool-action { font-size:.875rem; font-weight:600; }
.tool-card-footer .icon { width:20px; height:20px; color:var(--accent); transition:transform .18s; }
.tool-card:hover .tool-card-footer .icon { transform:translateX(3px); }
.trust-strip { display:flex; flex-wrap:wrap; justify-content:center; gap:16px 40px; margin:32px 0 52px; color:var(--muted); font-size:.8125rem; }
.trust-strip span { display:inline-flex; align-items:center; gap:8px; }
.trust-strip .icon { color:var(--positive); width:19px; height:19px; }
.closing-note { border-top:1px solid var(--line); text-align:center; padding:38px 24px 4px; }
.closing-note h2 { font-size:1.5rem; margin-bottom:12px; }
.closing-note p { max-width:640px; margin:0 auto 16px; color:var(--muted); font-size:.9375rem; line-height:1.65; }
.closing-note a { color:var(--accent); font-size:.875rem; font-weight:600; }
@media(max-width:800px) { .home { padding-top:32px; } .intro { margin-bottom:24px; } .intro .lead { font-size:1rem; } .tool-grid { grid-template-columns:1fr; gap:14px; } .tool-card { padding:22px; } .tool-card-top { margin-bottom:14px; } .tool-copy p { margin-bottom:18px; } .tool-card-footer { padding-top:12px; } .trust-strip { gap:12px 20px; margin:28px 0 32px; } .closing-note { padding:28px 0 0; } }
@media(max-width:400px) { .tool-filters { gap:8px; } .tool-filters button { padding:8px 14px; min-height:44px; font-size:.8125rem; } .intro h1 { font-size:1.875rem; } .directory-heading { flex-wrap:wrap; gap:4px; } .tool-card { padding:20px; } }