/* 
   tool overview page
   dependency on /resources/global.css for all else
 */
.tools-hero {padding:100px 40px 70px;max-width:1180px;margin:0 auto;background-image:url('/resources/tools.webp');background-size:contain;background-position:bottom right;background-repeat:no-repeat;}
.tools-hero-inner {max-width:640px;}
.tools-hero h1 {font-family:'Fraunces',serif;font-weight:300;font-size:clamp(38px,5.6vw,64px);line-height:1.04;letter-spacing:-0.01em;margin:0 0 22px;}
.tools-hero h1 em {font-style:normal;}
.tools-hero p {font-size:17px;line-height:1.6;color:var(--slate);max-width:52ch;margin:0;}
.tools-grid-wrap {max-width:1180px;margin:0 auto;padding:0 40px 100px;}
.tools-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.tool-card {display:block;text-decoration:none;color:inherit;border:1px solid var(--line);border-radius:2px;padding:26px;background:var(--paper);transition:border-color .15s ease, transform .1s ease;}
a.tool-card:hover {border-color:var(--spot);transform:translateY(-2px);}
.tool-card h2 {font-family:'Fraunces',serif;font-weight:300;font-size:22px;margin:0 0 10px;}
.tool-card p {font-size:14px;line-height:1.55;color:var(--slate);margin:0;}
@media (max-width:860px) {.tools-hero {padding:70px 22px 50px;background-image:none;} .tools-grid-wrap {padding:0 22px 70px;} .tools-grid {grid-template-columns:1fr 1fr;gap:16px;}}
@media (max-width:520px) {.tools-grid {grid-template-columns:1fr;}}