/* Free tools hub (/free-tools). Cards reuse the site .card; this only adds the
 * small name label, the reassurance note and a button pinned to the card foot. */
.ft-card { display: flex; flex-direction: column; gap: 10px; }
.ft-card .h3 { margin: 0; }
.ft-card p { margin: 0; }
.ft-name { font-size: .85rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #174c92; }
.ft-note { font-size: .92rem; color: #4a5a72; }
.ft-btn { align-self: flex-start; margin-top: auto; min-height: 48px; display: inline-flex; align-items: center; }
.ft-card .ft-btn { margin-top: 8px; }
@media (max-width: 600px) { .ft-btn { align-self: stretch; justify-content: center; } }

/* Tools in the dark hero band (owner 2026-10-08: "should it not be like a header"). */
body.ap.ft-page main .hero:not(.rh) { padding-bottom: 56px; }
body.ap.ft-page .ft-hero-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; max-width: 980px; margin: 32px auto 0; text-align: left; }
body.ap.ft-page .ft-tile { display: flex; flex-direction: column; gap: 10px; background: #fff; border: 1px solid #cbd5e3; border-top: 4px solid #d4a84f; border-radius: 12px; padding: 24px; box-shadow: 0 16px 40px #0004; }
body.ap.ft-page main .hero:not(.rh) .hero-copy .ft-tile p { margin: 0; opacity: 1; }
body.ap.ft-page main .hero:not(.rh) .hero-copy .ft-tile .ft-name { font-size: .82rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #174c92; }
body.ap.ft-page main .hero:not(.rh) .hero-copy .ft-tile .ft-q { margin: 0; font-size: 1.3rem; line-height: 1.3; letter-spacing: -.01em; color: #142238; }
body.ap.ft-page main .hero:not(.rh) .hero-copy .ft-tile .ft-body { font-size: 1rem; line-height: 1.55; color: #263449; }
body.ap.ft-page main .hero:not(.rh) .hero-copy .ft-tile .ft-note { font-size: .92rem; color: #445168; }
body.ap.ft-page .ft-tile .ft-btn { align-self: flex-start; margin-top: auto; background: #124f9e; color: #fff; min-height: 48px; display: inline-flex; align-items: center; }
body.ap.ft-page .ft-tile .ft-btn:hover { background: #0d3d7d; color: #fff; }
body.ap.ft-page .ft-tile .ft-btn:focus-visible { outline: 3px solid #175ed2; outline-offset: 3px; }
@media (max-width: 760px) { body.ap.ft-page .ft-hero-grid { grid-template-columns: 1fr; max-width: 640px; } }
@media (max-width: 760px) { body.ap.ft-page .ft-tile { padding: 20px; } body.ap.ft-page .ft-tile .ft-btn { align-self: stretch; justify-content: center; } }
