:root{
  --ink:#16202c; --mut:#5b6678; --line:#e3e7ee; --bg:#ffffff; --soft:#f6f8fb;
  --accent:#1f6feb; --accent-dark:#0c447c; --good:#0f7b4f;
  --serif:Georgia,"Iowan Old Style","Palatino Linotype","Times New Roman",serif;
  --maxw:760px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0; background:var(--bg); color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.65; font-size:17px;}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}

.site-header{border-bottom:1px solid var(--line); background:var(--bg); position:sticky; top:0; z-index:10}
.site-header .wrap{max-width:var(--maxw); margin:0 auto; padding:.7rem 1.1rem; display:flex; align-items:center; gap:1rem; flex-wrap:wrap}
.brand{font-weight:700; font-size:1.05rem; color:var(--ink); white-space:nowrap}
.brand:hover{text-decoration:none}
.brand span{color:var(--accent)}
.nav{display:flex; gap:1.1rem; flex-wrap:wrap; font-size:.93rem; margin-left:auto}
.nav a{color:var(--mut)}
.nav a:hover{color:var(--ink); text-decoration:none}

main{max-width:var(--maxw); margin:0 auto; padding:1.4rem 1.1rem 2.5rem}
main h1{font-family:var(--serif); font-size:2.05rem; line-height:1.18; margin:.3rem 0 .5rem; letter-spacing:-.012em; font-weight:600}
main h2{font-family:var(--serif); font-size:1.4rem; margin:2rem 0 .6rem; letter-spacing:-.01em; font-weight:600}
main h3{font-family:var(--serif); font-size:1.12rem; margin:1.4rem 0 .4rem; font-weight:600}
main p{margin:.7rem 0}
main ul,main ol{margin:.7rem 0; padding-left:1.3rem}
main li{margin:.35rem 0}
main strong{font-weight:650}

.byline{display:flex; align-items:center; gap:9px; font-size:.86rem; color:var(--mut); margin:.2rem 0 1.1rem; flex-wrap:wrap}
.byline .av{width:26px; height:26px; border-radius:50%; background:#e6f1fb; color:var(--accent-dark); display:inline-flex; align-items:center; justify-content:center; font-size:.72rem; font-weight:600}
.byline em{font-style:normal}
.byline .chip{display:inline-flex; align-items:center; gap:5px; font-size:.74rem; color:var(--accent-dark); background:#e6f1fb; border-radius:20px; padding:2px 10px}

main .byline + p{font-size:1.12rem; line-height:1.6; color:#222e3c}

blockquote{margin:1rem 0; padding:.6rem 1rem; border-left:3px solid var(--accent); background:var(--soft); color:var(--mut)}

.table-wrap{overflow-x:auto; margin:1.1rem 0}
table{border-collapse:collapse; width:100%; font-size:.92rem}
th,td{border:1px solid var(--line); padding:.55rem .7rem; text-align:left; vertical-align:top}
thead th{background:var(--soft); font-weight:650; font-size:.82rem; text-transform:uppercase; letter-spacing:.02em; color:var(--mut)}
hr{border:0; border-top:1px solid var(--line); margin:2rem 0}
code{background:var(--soft); padding:.1em .35em; border-radius:4px; font-size:.9em}

.hub{margin:1.6rem 0 .4rem}
.hub .eyebrow{font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:#9098a6; margin-bottom:.7rem}
.hub .tiles{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:11px}
.hub .tile{border:1px solid var(--line); border-radius:10px; padding:13px 15px; display:block; color:var(--ink)}
.hub .tile:hover{border-color:#c7d2e0; text-decoration:none; background:#fcfdff}
.hub .tile .ti{font-size:19px; color:var(--mut)}
.hub .tile .t{font-weight:600; font-size:.95rem; margin-top:7px}
.hub .tile .d{font-size:.82rem; color:var(--mut); margin-top:2px}
.hub .calc{grid-column:1 / -1; border:2px solid var(--accent); background:#f7fbff; display:flex; align-items:center; gap:14px}
.hub .calc .ti{font-size:30px; color:var(--accent)}
.hub .calc .t{font-size:1rem}
.hub .calc .go{margin-left:auto; font-size:.9rem; color:var(--accent); white-space:nowrap}

.site-footer{border-top:1px solid var(--line); background:var(--soft); margin-top:2rem}
.site-footer .wrap{max-width:var(--maxw); margin:0 auto; padding:1.4rem 1.1rem; font-size:.88rem; color:var(--mut)}
.trust-row{display:flex; gap:20px; flex-wrap:wrap; font-size:.8rem; color:var(--mut); padding-bottom:1.1rem; margin-bottom:1rem; border-bottom:1px solid var(--line)}
.trust-row .ti{color:var(--good); font-size:14px; vertical-align:-2px; margin-right:5px}
.site-footer .cols{display:flex; gap:2rem; flex-wrap:wrap; margin-bottom:1rem}
.site-footer .col h4{font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--mut); margin:0 0 .5rem}
.site-footer .col a{display:block; color:var(--mut); margin:.25rem 0}
.site-footer .col a:hover{color:var(--ink)}
.site-footer .legal{font-size:.82rem; line-height:1.5}

@media(max-width:560px){
  body{font-size:16px}
  main h1{font-size:1.6rem}
  .nav{width:100%; margin-left:0; gap:.9rem}
  main .byline + p{font-size:1.05rem}
}