.page-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.page-nav a { display: inline-flex; align-items: center; min-height: 38px; padding: 7px 11px; border: 1px solid #4a607a; border-radius: 9px; background: #1d2a3b; color: #d7edff; font-size: .82rem; font-weight: 750; text-decoration: none; }
.page-nav a:hover { border-color: #68b4ff; background: #263b53; color: #fff; }
.page-nav a[aria-current="page"] { border-color: #68b4ff; background: #dff3ff; color: #104e91; }
.tools-home { width: min(100% - 24px, 880px); margin: 0 auto; padding: 28px 0 48px; }
.tools-home .home-hero { padding: 8px 4px 24px; }
.tools-home .home-eyebrow { margin: 0 0 8px; color: #62e6d0; font-size: .86rem; font-weight: 800; letter-spacing: .1em; }
.tools-home h1 { margin: 0; color: #fff; font-size: clamp(1.8rem, 6vw, 2.7rem); line-height: 1.25; }
.tools-home .home-hero > p:last-child { margin: 10px 0 0; color: #a9b7c8; line-height: 1.65; }
.tools-home .page-nav { margin-top: 18px; }
.tool-list { display: grid; gap: 12px; }
.tool-card { display: block; padding: 20px; border: 1px solid #2e3d51; border-radius: 16px; background: #151e2a; color: #fff; text-decoration: none; box-shadow: 0 8px 24px rgb(0 0 0 / 22%); }
.tool-card:hover { border-color: #68b4ff; background: #1d2a3b; }
.tool-card strong { display: block; color: #fff; font-size: 1rem; line-height: 1.45; }
.tool-card small { display: block; margin-top: 7px; color: #a9b7c8; font-size: .86rem; font-weight: 500; line-height: 1.55; }
.tools-home .home-note { margin: 16px 4px 0; color: #8496aa; font-size: .78rem; line-height: 1.55; }
@media (min-width: 760px) { .tools-home { padding-top: 42px; } }
@media (max-width: 440px) { .tools-home { width: min(100% - 16px, 880px); padding-top: 16px; } .tools-home .home-hero { padding-left: 2px; padding-right: 2px; } .tool-card { padding: 16px; } }