:root{--blue:#145da0;--navy:#17324d;--pale:#eef6fc;--line:#dce7f0;--text:#1d2939;--muted:#667085;--white:#fff}
*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;background:#f6f9fc;color:var(--text)}
header{background:linear-gradient(135deg,var(--navy),var(--blue));color:white;padding:22px 5%}
.brand{font-size:22px;font-weight:900}.tag{opacity:.9;margin-top:4px}.wrap{max-width:1180px;margin:auto;padding:28px 20px}
.hero{background:white;border-radius:22px;padding:34px;box-shadow:0 10px 35px #17324d14;margin-bottom:22px}
.hero h1{font-size:36px;margin:0 0 10px;color:var(--navy)}.hero p{font-size:18px;color:var(--muted);max-width:760px;line-height:1.5}
.badge{display:inline-block;background:var(--pale);color:var(--blue);font-weight:800;border-radius:999px;padding:7px 12px;margin-bottom:15px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{background:white;border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:0 7px 24px #17324d0d}
.card h2{color:var(--navy);margin-top:5px}.card p{color:var(--muted);line-height:1.5}.icon{font-size:34px}
a.btn,button{display:inline-block;background:var(--blue);color:white;text-decoration:none;border:0;border-radius:10px;padding:12px 16px;font-weight:800;cursor:pointer}
.secondary{background:white!important;color:var(--blue)!important;border:1px solid var(--blue)!important}
.topnav{float:right}.topnav a{color:white;margin-left:15px;text-decoration:none;font-weight:700}
table{width:100%;border-collapse:collapse;background:white}th,td{padding:11px;border-bottom:1px solid var(--line);text-align:left}th{background:var(--pale);color:var(--navy)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.metric{font-size:28px;font-weight:900;color:var(--blue)}
label{font-weight:800;display:block;margin:12px 0 5px}input,select,textarea{width:100%;padding:11px;border:1px solid #cfd8e3;border-radius:9px;background:white}
.product{display:grid;grid-template-columns:1fr 90px 80px;gap:10px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line)}
.notice{background:#fff8e8;border:1px solid #f1d391;padding:12px;border-radius:10px;color:#694d00}
footer{text-align:center;color:var(--muted);padding:30px}
@media(max-width:800px){.cards,.grid2{grid-template-columns:1fr}.hero h1{font-size:29px}.topnav{float:none;display:block;margin-top:12px}.product{grid-template-columns:1fr 70px 65px}}