:root{
  --bg:#efeae1; --paper:#faf7f1; --ink:#22201c; --mute:#6f675c;
  --accent:#3f5d4a; --line:#d8d0c2;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:16px/1.7 Charter,Georgia,"Times New Roman",serif}
.wrap{max-width:900px;margin:0 auto;padding-inline:24px}
a{color:inherit}

.hdr{border-bottom:2px solid var(--ink);background:var(--paper)}
.hdr .wrap{display:flex;align-items:flex-end;justify-content:space-between;padding-block:20px 16px;gap:16px;flex-wrap:wrap}
.logo{text-decoration:none;line-height:1.1}
.logo b{display:block;font-size:22px;letter-spacing:.02em}
.logo i{display:block;font-style:normal;font-size:11px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--mute);margin-top:4px}
.hdr nav a{margin-left:20px;font-size:14px;text-decoration:none;color:var(--mute);
  border-bottom:1px solid transparent;padding-bottom:2px}
.hdr nav a:hover,.hdr nav a.on{color:var(--accent);border-bottom-color:var(--accent)}

main .wrap{padding-block:46px}
h1{margin:0 0 16px;font-size:clamp(26px,4.2vw,38px);line-height:1.2;text-wrap:balance}
.lead{margin:0 0 30px;color:var(--mute);max-width:60ch;font-size:17px}
h2{margin:36px 0 12px;font-size:21px}
p{margin:0 0 14px;max-width:64ch}
.mute{color:var(--mute)}

.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:26px;margin-top:8px}
.box{background:var(--paper);border:1px solid var(--line);padding:20px}
.box h3{margin:0 0 6px;font-size:16px}
.box p{margin:0;font-size:14px;color:var(--mute)}

.price{width:100%;border-collapse:collapse;font-size:15px;margin-top:10px}
.price th{text-align:left;font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--mute);font-weight:600;padding:8px 10px;border-bottom:2px solid var(--ink)}
.price td{padding:11px 10px;border-bottom:1px solid var(--line)}
.price td:last-child{text-align:right;white-space:nowrap}

.note{border-left:3px solid var(--accent);padding:4px 0 4px 16px;margin:24px 0;color:var(--mute);font-size:15px}

dl.c{margin:0}
dl.c dt{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin-top:16px}
dl.c dt:first-child{margin-top:0}
dl.c dd{margin:3px 0 0;font-size:16px}

.ftr{border-top:1px solid var(--line);margin-top:20px}
.ftr .wrap{padding-block:20px;color:var(--mute);font-size:13px;
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

@media (max-width:620px){
  .hdr .wrap{flex-direction:column;align-items:flex-start}
  .hdr nav a{margin-left:0;margin-right:16px}
  .price{display:block;overflow-x:auto}
}