:root{
  --ink:#2b2118;
  --muted:#7a6a5c;
  --paper:#faf6f1;
  --line:#e6ddd2;
  --accent:#8c5a32;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  color:var(--ink);
  background:var(--paper);
  line-height:1.65;
}
.wrap{max-width:980px;margin:0 auto;padding:0 24px}
header{border-bottom:1px solid var(--line);background:#fff}
.bar{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.brand img{width:38px;height:38px}
.brand span{font-size:21px;letter-spacing:.04em;font-weight:700}
nav a{
  margin-left:26px;text-decoration:none;color:var(--muted);
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif;font-size:15px;
}
nav a:hover,nav a.on{color:var(--accent)}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding:56px 0}
.hero h1{font-size:40px;line-height:1.2;margin:0 0 16px}
.hero p{color:var(--muted);font-size:18px;margin:0 0 24px}
.btn{
  display:inline-block;background:var(--accent);color:#fff;text-decoration:none;
  padding:12px 22px;border-radius:2px;font-family:system-ui,sans-serif;font-size:15px;
}
.btn:hover{background:#74471f}
h2{font-size:26px;margin:48px 0 6px}
.lead{color:var(--muted);margin:0 0 26px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;padding-bottom:16px}
.card{background:#fff;border:1px solid var(--line);border-radius:3px;overflow:hidden}
.card img{width:100%;display:block;background:#f2ebe2}
.card .body{padding:16px 18px 20px}
.card h3{margin:0 0 6px;font-size:19px}
.card p{margin:0 0 12px;color:var(--muted);font-size:15px}
.price{font-family:system-ui,sans-serif;font-size:15px;color:var(--ink)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;padding:16px 0 8px}
table{border-collapse:collapse;width:100%;font-family:system-ui,sans-serif;font-size:15px}
td,th{text-align:left;padding:9px 0;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--muted);font-weight:400;width:40%}
footer{margin-top:64px;border-top:1px solid var(--line);background:#fff}
footer .wrap{
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;
  padding-top:26px;padding-bottom:34px;
  font-family:system-ui,sans-serif;font-size:14px;color:var(--muted);
}
footer a{color:var(--muted)}
@media(max-width:760px){
  .hero,.split{grid-template-columns:1fr;gap:24px;padding:32px 0}
  .grid{grid-template-columns:1fr}
  .hero h1{font-size:31px}
  nav a{margin-left:16px}
}