/* Guides, carrier pages, About, Contact, Privacy and 404. The header matches the calculator page. */
:root{--bg:#e6e8eb;--paper:#fff;--ink:#111;--muted:#545454;--line:#c9cdd3;--tape:#ffd21f;--focus:#2a62ff;--dim:#b23a0c;--sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;--gut:clamp(14px,3vw,28px)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 var(--sans)}
a{color:var(--ink);text-underline-offset:3px}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:4px 16px;padding:6px var(--gut);background:#111;color:#fff}
.logo{display:flex;align-items:center;gap:10px;font:800 21px var(--mono);letter-spacing:-.03em;text-decoration:none;min-height:44px;color:#fff}
.tape{width:30px;height:14px;background:var(--tape);transform:rotate(-8deg)}
.nav{display:flex;flex-wrap:wrap;gap:0 4px}
.nav a{color:#e9e9e9;text-decoration:none;font:600 14px var(--sans);padding:0 10px;min-height:44px;display:inline-flex;align-items:center;border-bottom:3px solid transparent}
.nav a:hover{color:#fff;text-decoration:underline}
.nav a[aria-current="page"]{color:#fff;border-bottom-color:var(--tape)}
main{width:min(760px,calc(100% - 32px));margin:auto;padding:34px 0 48px;min-width:0}
h1{font-size:clamp(28px,4vw,38px);line-height:1.15;letter-spacing:-.02em;margin:0 0 16px}
h2{font-size:20px;line-height:1.3;margin:30px 0 8px}
p{margin:0 0 12px}
ul,ol{margin:0 0 14px;padding-left:22px}
li{margin:0 0 6px}
code{font:14px var(--mono);background:#dfe2e7;padding:1px 5px;border-radius:4px}
.lead{font-size:18px;line-height:1.55}
.updated{color:var(--muted);font-size:15px;margin-top:28px}
.aside{border-left:4px solid var(--tape);background:var(--paper);padding:10px 14px;font-size:15px}
.formula,.sample{font:14px/1.6 var(--mono);background:var(--paper);border:1px solid var(--line);padding:12px 14px;overflow-x:auto;white-space:pre;margin:0 0 14px}
.tbl{overflow-x:auto;margin:0 0 14px;background:var(--paper);border:1px solid var(--line)}
table{border-collapse:collapse;width:100%;font-size:15px}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
td{white-space:nowrap}
td:last-child{white-space:normal;min-width:200px}
thead th{font:700 12px var(--mono);text-transform:uppercase;letter-spacing:.03em;background:#f3f4f6}
tbody th,tfoot th{font-weight:600}
tfoot th,tfoot td{border-bottom:0;background:#f3f4f6}
.facts{display:grid;gap:0;margin:0 0 22px;background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--tape);font-size:15px}
.facts div{display:grid;grid-template-columns:minmax(110px,30%) 1fr;gap:4px 14px;padding:8px 14px;border-bottom:1px solid var(--line)}
.facts div:last-child{border-bottom:0}
.facts dt{font-weight:700}
.facts dd{margin:0;min-width:0;overflow-wrap:anywhere}
@media (max-width:480px){.facts div{grid-template-columns:1fr;gap:0}}
.try{margin:4px 0 18px}
.btn{display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;background:#111;color:#fff;font-weight:700;text-decoration:none;border:2px solid #111}
.btn:hover{background:#333}
.cards{list-style:none;padding:0;display:grid;gap:12px}
.cards li{background:var(--paper);border:1px solid var(--line);padding:14px 16px;margin:0}
.cards a{font-weight:700;font-size:18px}
.cards p{margin:4px 0 0;color:var(--muted);font-size:15px}
.calc{background:var(--paper);border:2px solid #111;padding:16px;margin:8px 0 26px}
.calc h2{margin:0 0 10px;font-size:18px}
.calc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:10px 12px;margin-bottom:14px}
.calc label{display:flex;flex-direction:column;gap:4px;font-size:14px;font-weight:600}
.calc label i{font-style:normal;font-weight:400;color:var(--muted)}
.calc input,.calc select{font:inherit;font-weight:400;min-height:44px;padding:6px 10px;border:2px solid #111;background:#fff;color:var(--ink);width:100%;min-width:0}
.calc-out{border-top:1px solid var(--line);padding-top:12px;min-height:250px}
.calc-total{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin-bottom:8px}
.calc-total small{font:700 12px var(--mono);text-transform:uppercase;letter-spacing:.04em;width:100%}
.calc-total strong{font:800 34px/1.1 var(--sans)}
.calc-total span{font-size:15px}
.calc-steps{font-size:15px}
.calc-more{font-size:15px}
.calc-note,.calc-err{font-size:14px;color:var(--muted);margin:0}
.calc-err{color:var(--dim);font-weight:600}
.calc-warn{border-left:4px solid var(--dim);background:#fff4ef;padding:8px 12px;font-size:15px;margin:0 0 10px}
.contact-details a{overflow-wrap:anywhere}
.usage-toggle{font:inherit;font-weight:700;color:var(--ink);background:#fff;border:2px solid var(--ink);border-radius:6px;min-height:44px;padding:8px 14px;cursor:pointer}
.usage-toggle:disabled{opacity:.7;cursor:default}
.foot{width:min(760px,calc(100% - 32px));margin:auto;border-top:1px solid var(--line);padding:16px 0 28px;display:flex;flex-wrap:wrap;gap:4px 22px;color:var(--muted);font-size:15px}
.foot span{width:100%}
.foot a{min-height:40px;display:inline-flex;align-items:center}
@media (max-width:560px){.top{padding:4px 12px 0}.nav{width:100%;margin:0 -7px}.nav a{padding:0 7px}h2{font-size:19px}}
@media print{.top,.foot,.try,.calc-more{display:none}body{background:#fff}main{width:auto;padding:0}.tbl,.calc{border-color:#999}}
