
body{margin:0;font-family:Arial,sans-serif;background:#f4f1ea;color:#17232d}
header,footer{background:#111d25;color:#fff;padding:16px 5%}
nav a,.brand{color:#fff;text-decoration:none;margin-right:14px}
.hero{background:linear-gradient(135deg,#111e27,#3c5663);color:#fff;padding:60px 5%}
.inner,.wrap{max-width:1150px;margin:auto}.wrap{padding:40px 5%}
.hero h1{font-size:clamp(42px,7vw,74px);line-height:.97;max-width:850px}
.hero p{max-width:760px;color:#d8e1e6;font-size:18px;line-height:1.5}
.ai{display:flex;max-width:900px;background:#fff;padding:8px;border-radius:12px}
.ai input{flex:1;border:0;padding:15px;font-size:16px;min-width:0}
.ai button,.btn{background:#c4934d;color:#fff;border:0;border-radius:8px;padding:12px 18px;font-weight:bold}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.card{background:#fff;border:1px solid #ddd6ca;border-radius:14px;padding:20px}.muted{color:#66747d;line-height:1.5}
.table{width:100%;border-collapse:collapse;background:#fff}.table th,.table td{padding:11px;border:1px solid #ddd}
@media(max-width:800px){.grid{grid-template-columns:1fr 1fr}}@media(max-width:600px){nav{display:none}.grid{grid-template-columns:1fr}.ai{flex-direction:column}}
