
*{margin:0;padding:0;box-sizing:border-box}
:root{--ink:#1a2332;--mut:#5a6a7e;--acc:#0d5eff;--acc2:#0047b3;--bg:#f7f9fc;--card:#fff;--ok:#0a8f4e;--line:#e3e9f2}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg);line-height:1.55}
header.site{background:#fff;border-bottom:1px solid var(--line);padding:14px 24px;display:flex;align-items:center;gap:28px;position:sticky;top:0;z-index:50}
header.site .logo{font-size:22px;font-weight:800;color:var(--acc);text-decoration:none;letter-spacing:-.5px}
header.site .logo span{color:var(--ink)}
header.site nav{display:flex;gap:20px;flex-wrap:wrap}
header.site nav a{color:var(--mut);text-decoration:none;font-size:14px;font-weight:600}
header.site nav a:hover{color:var(--acc)}
.hero{background:linear-gradient(135deg,#0a1e42,#123a7a 60%,#0d5eff);color:#fff;padding:64px 24px 56px;text-align:center}
.hero h1{font-size:clamp(28px,5vw,46px);font-weight:800;letter-spacing:-1px;max-width:900px;margin:0 auto 14px}
.hero p.sub{font-size:clamp(15px,2.2vw,19px);opacity:.92;max-width:760px;margin:0 auto 8px}
.hero .stats{display:flex;gap:34px;justify-content:center;margin-top:30px;flex-wrap:wrap}
.hero .stats div b{display:block;font-size:30px;font-weight:800}
.hero .stats div span{font-size:13px;opacity:.8}
.wrap{max-width:1080px;margin:0 auto;padding:34px 24px}
h2{font-size:26px;font-weight:800;letter-spacing:-.4px;margin-bottom:6px}
p.lead{color:var(--mut);margin-bottom:22px}
.stategrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;margin:18px 0 8px}
.statecard{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:18px;text-decoration:none;color:var(--ink);transition:.15s;display:block}
.statecard:hover{border-color:var(--acc);box-shadow:0 4px 16px rgba(13,94,255,.10)}
.statecard b{font-size:17px}
.statecard .m{font-size:12.5px;color:var(--mut);margin-top:6px}
.statecard .m b{color:var(--ok);font-size:12.5px}
.calc{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:28px;margin:26px 0}
.calc .row{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.calc label{font-size:13px;font-weight:700;color:var(--mut);display:block;margin-bottom:5px}
.calc select,.calc input{padding:10px 12px;border:1.5px solid var(--line);border-radius:9px;font-size:15px;background:#fff;min-width:150px}
.calc input[type=number]{width:130px}
.opt{display:flex;flex-wrap:wrap;gap:10px}
.opt label{display:flex;align-items:center;gap:6px;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px 12px;font-size:13px;color:var(--ink);font-weight:600;cursor:pointer}
.opt input{accent-color:var(--acc)}
.calc button{background:var(--acc);color:#fff;border:0;padding:13px 30px;border-radius:10px;font-size:16px;font-weight:700;cursor:pointer}
.calc button:hover{background:var(--acc2)}
#result{margin-top:20px;padding:22px;border-radius:12px;background:linear-gradient(135deg,#eaf1ff,#f4f8ff);border:1px solid #cdddff;display:none}
#result .big{font-size:clamp(22px,4vw,34px);font-weight:800;color:var(--acc2)}
#result .unit{color:var(--mut);font-size:14px;margin-top:4px}
#result .fine{font-size:12.5px;color:var(--mut);margin-top:10px}
.disclaimer{font-size:12.5px;color:var(--mut);background:var(--bg);border-left:3px solid var(--acc);padding:10px 14px;border-radius:0 8px 8px 0;margin-top:14px}
table.dir{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;font-size:13.5px}
table.dir th{background:#eef3fb;text-align:left;padding:10px 12px;font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--mut);border-bottom:1px solid var(--line)}
table.dir td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
table.dir tr:last-child td{border-bottom:0}
table.dir .nm{font-weight:700}
table.dir .cat{display:inline-block;background:#eaf1ff;color:var(--acc2);font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px}
table.dir a{color:var(--acc);text-decoration:none}
table.dir a:hover{text-decoration:underline}
.mut{color:var(--mut)}
.feature{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px}
.feature h3{font-size:17px;margin-bottom:6px}
.feature p{font-size:14px;color:var(--mut)}
.featgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin:16px 0}
footer{border-top:1px solid var(--line);background:#fff;padding:28px 24px;text-align:center;color:var(--mut);font-size:13px;margin-top:40px}
footer a{color:var(--mut)}
.crumbs{font-size:13px;color:var(--mut);margin-bottom:14px}
.crumbs a{color:var(--mut)}
.back{display:inline-block;margin-top:18px;color:var(--acc);font-weight:700;text-decoration:none;font-size:14px}
@media(max-width:640px){table.dir{font-size:12px}table.dir td,table.dir th{padding:8px 8px}}
