
*{box-sizing:border-box}
body{margin:0;font-family:Arial,sans-serif;background:#f5f7fb;color:#172033}
.container{max-width:1100px;margin:auto;padding:0 20px}
header{background:#fff;border-bottom:1px solid #e5e7eb}
.header{height:70px;display:flex;align-items:center;justify-content:space-between}
.logo{font-size:25px;font-weight:800;text-decoration:none;color:#172033}
nav a{margin-left:20px;text-decoration:none;color:#4b5563}
.hero{text-align:center;padding:55px 20px 30px}
.hero h1{font-size:38px;margin:0 0 12px}
.hero p{color:#667085;font-size:17px}
.toolbox{background:#fff;padding:28px;border-radius:16px;box-shadow:0 8px 30px rgba(0,0,0,.06);margin:20px auto 50px}
label{display:block;font-weight:700;margin:14px 0 7px}
textarea,input,select{width:100%;padding:13px;border:1px solid #d7dce5;border-radius:9px;font-size:15px}
textarea{min-height:220px;resize:vertical}
.controls{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0}
button{border:0;border-radius:9px;padding:12px 20px;cursor:pointer;font-weight:700;background:#172033;color:#fff}
button.secondary{background:#e9edf3;color:#172033}
footer{text-align:center;padding:30px;color:#667085}

.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px;margin-bottom:60px}
.tool-card{display:block;background:#fff;padding:25px;border-radius:15px;text-decoration:none;color:#172033;box-shadow:0 8px 25px rgba(0,0,0,.06)}
.tool-card h2{margin-top:0}.tool-card p{color:#667085;line-height:1.5}.tool-card span{font-weight:700}
