:root{
  --max: 980px;
  --pad: 18px;
  --border: #eaeaea;
  --muted: #555;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  line-height:1.55;
  color:#111;
  background:#fff;
}
a{color:inherit}
header{
  position:sticky; top:0;
  background:#fff;
  border-bottom:1px solid var(--border);
  z-index:10;
}
.container{max-width:var(--max); margin:0 auto; padding: var(--pad);}
.nav{display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;}
.menu{display:flex; gap:10px; flex-wrap:wrap;}
.menu a{ text-decoration:none; padding:8px 10px; border-radius:10px;}
.menu a:hover{ background:#f4f4f4;}
.section{ padding: 22px 0; border-top:1px solid var(--border);}
h1{font-size:30px; line-height:1.15; margin:0 0 10px;}
h2{font-size:22px; margin:0 0 10px;}
h3{font-size:18px; margin:18px 0 8px;}
p{margin:0 0 10px; color:#333; max-width: 92ch;}
.small{font-size:14px; color:var(--muted);}
.figure{margin: 18px 0;}
.figure img{
  width:100%;
  height:auto;
  display:block;
  border:1px solid var(--border);
  border-radius:18px;
  background:#fff;
}
.figure.no-border img{border:none;}
.footer{
  border-top:1px solid var(--border);
  margin-top:26px;
  padding: 18px 0;
}
.footer .logo{
  display:flex;
  justify-content:center;
  margin-bottom:10px;
}
.footer .logo img{height:42px; width:auto; border:none;}
