:root{--ink:#17202a;--mute:#5b6b7c;--line:#dde3ea;--accent:#1f6f8b}
*{box-sizing:border-box}body{margin:0;font:16px/1.6 system-ui,sans-serif;color:var(--ink)}
header{display:flex;gap:1.5rem;align-items:center;padding:1rem 1.5rem;border-bottom:1px solid var(--line);flex-wrap:wrap}
.brand{font-weight:700;font-size:1.25rem;text-decoration:none;color:var(--accent)}
nav{display:flex;gap:1rem;flex-wrap:wrap}nav a{color:var(--ink)}
main{max-width:70rem;margin:0 auto;padding:1.5rem}
h1{font-size:1.9rem;margin:.2rem 0 1rem}h2{margin-top:2rem}
.lede{font-size:1.1rem;color:var(--mute)}
.crumb{color:var(--mute);font-size:.9rem}
table{border-collapse:collapse;width:100%;margin:1rem 0}
th,td{text-align:left;padding:.5rem .6rem;border-bottom:1px solid var(--line)}
dl{display:grid;grid-template-columns:12rem 1fr;gap:.35rem 1rem}dt{font-weight:600}dd{margin:0}
.cards{list-style:none;padding:0;display:grid;gap:.5rem}
.price{color:var(--mute)}
form{display:grid;gap:.75rem;max-width:28rem;margin:1rem 0}
label{display:grid;gap:.25rem}
input,select,button{font:inherit;padding:.5rem;border:1px solid var(--line);border-radius:.25rem}
button{background:var(--accent);color:#fff;border-color:var(--accent);cursor:pointer}
footer{border-top:1px solid var(--line);padding:1rem 1.5rem;color:var(--mute);font-size:.9rem}
@media(min-width:40rem){.cards{grid-template-columns:repeat(2,1fr)}}