:root{
  --ivory:#F4EEE2; --ivory-2:#E7DECB;
  --espresso:#332A25; --bronze:#A98F4F; --bronze-ink:#7E6837; --bronze-light:#C3B587;
  --graphite:#3E362F; --graphite-soft:#6B5F53;
  --rule:rgba(51,42,37,0.16); --rule-dark:rgba(244,238,226,0.20);
  --display:'Playfair Display','Georgia',serif;
  --sans:'Lato',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --ease:cubic-bezier(.22,.68,.28,1);
}
*{box-sizing:border-box;}
body{margin:0;background:var(--ivory);color:var(--graphite);font-family:var(--sans);
  font-weight:400;font-size:16px;line-height:1.85;-webkit-font-smoothing:antialiased;}
h1,h2{font-family:var(--display);font-weight:400;margin:0;letter-spacing:-0.005em;}
a{color:inherit;}
.wrap{max-width:820px;margin:0 auto;padding:0 40px;}

.topbar{background:var(--espresso);border-bottom:1px solid var(--rule-dark);}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding-top:18px;padding-bottom:18px;max-width:1180px;}
.brand{display:flex;align-items:center;line-height:0;text-decoration:none;}
.brand img{height:40px;width:auto;display:block;transition:opacity .35s var(--ease);}
.brand:hover img{opacity:.78;}
.close{font-size:10.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;
  color:var(--bronze-light);text-decoration:none;border:1px solid var(--bronze);padding:11px 20px;
  transition:background .4s var(--ease),color .4s var(--ease);white-space:nowrap;}
.close:hover{background:var(--bronze);color:var(--espresso);}

header.page{background:var(--ivory-2);border-bottom:1px solid var(--rule);}
header.page .wrap{padding-top:64px;padding-bottom:56px;}
.eyebrow{display:block;font-size:10.5px;font-weight:500;letter-spacing:.3em;
  text-transform:uppercase;color:var(--bronze-ink);margin-bottom:20px;}
header.page h1{font-size:40px;line-height:1.18;color:var(--espresso);}
.updated{margin:18px 0 0;font-size:12px;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:var(--graphite-soft);}

main .wrap{padding-top:56px;padding-bottom:76px;}
main h2{font-size:21px;color:var(--espresso);margin:44px 0 14px;}
main h2:first-of-type{margin-top:0;}
main p{margin:0 0 16px;font-weight:300;line-height:1.9;}
main ul{margin:0 0 18px;padding-left:20px;}
main li{margin-bottom:9px;font-weight:300;line-height:1.85;}
main strong{font-weight:500;color:var(--espresso);}
main a{color:var(--bronze-ink);text-underline-offset:4px;}
.note{border-left:1px solid var(--bronze);padding:6px 0 6px 20px;margin:0 0 24px;
  font-size:13.5px;line-height:1.8;color:var(--graphite-soft);}
.contact{border:1px solid var(--rule);padding:26px 28px;margin-top:44px;background:var(--ivory-2);}
.contact p{margin:0;font-size:14.5px;line-height:1.95;}

footer{background:var(--espresso);color:rgba(244,241,237,.5);}
footer .wrap{padding:34px 40px;max-width:1180px;display:flex;justify-content:space-between;
  gap:16px;flex-wrap:wrap;font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;}
footer a{color:var(--bronze-light);text-decoration:none;}
footer a:hover{opacity:.7;}

a:focus-visible{outline:1px solid var(--bronze);outline-offset:4px;}

@media (max-width:860px){
  .wrap{padding:0 24px;}
  header.page .wrap{padding-top:44px;padding-bottom:38px;}
  header.page h1{font-size:28px;}
  main .wrap{padding-top:40px;padding-bottom:56px;}
  main h2{font-size:18px;margin-top:34px;}
  .brand img{height:32px;}
  .close{padding:9px 14px;letter-spacing:.14em;}
  footer .wrap{padding:26px 24px;}
}
