
:root{--burg:#7a2231;--cream:#faf7f2;--forest:#22483a;--gold:#a98544;--char:#2f2b28;
  --rule:#ded3c4;--panel:#f2ece1}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--char);
  font:400 17px/1.76 "Source Serif 4",Georgia,serif}
img{max-width:100%;display:block;height:auto}
h1,h2,h3,h4{font-family:Lora,Georgia,serif;color:var(--burg);line-height:1.2;
  margin:0 0 .55em;font-weight:600}
h1{font-size:clamp(2.1rem,4.6vw,3.4rem)}
h2{font-size:clamp(1.6rem,3vw,2.3rem)}
h3{font-size:1.25rem;color:var(--forest)}
p{margin:0 0 1.2em}
a{color:var(--burg)}
a:hover{color:var(--forest)}
.wrap{max-width:1060px;margin:0 auto;padding:0 28px}
.narrow{max-width:790px;margin:0 auto}

/* ---- classical centred masthead ---- */
.top{background:var(--cream);border-bottom:1px solid var(--rule);text-align:center}
.masthead{padding:26px 0 16px}
.masthead img{width:250px;margin:0 auto}
.rule2{border:0;border-top:2px solid var(--gold);border-bottom:1px solid var(--gold);
  height:3px;margin:0}
nav{padding:12px 0 14px}
nav ul{display:flex;list-style:none;gap:0;margin:0;padding:0;flex-wrap:wrap;
  justify-content:center}
nav li+li:before{content:"";display:inline-block;width:1px;height:12px;
  background:var(--rule);margin:0 2px;vertical-align:middle}
nav a{font-family:Lora,Georgia,serif;font-size:14px;letter-spacing:.05em;
  text-decoration:none;color:var(--char);padding:6px 15px;display:inline-block}
nav a:hover,nav a:focus-visible{color:var(--burg);text-decoration:underline;
  text-underline-offset:4px}
nav a[aria-current]{color:var(--burg);font-weight:600}

/* ---- sections ---- */
.sec{padding:62px 0}
.sec.panel{background:var(--panel);border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule)}
.sec.burg{background:var(--burg);color:#f3e3e0}
.sec.burg h1,.sec.burg h2,.sec.burg h3{color:#fff}
.sec.burg a{color:#f0d4a8}
.centre{text-align:center}
.centre p{margin-left:auto;margin-right:auto;max-width:66ch}
.two{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}
.cols{column-count:2;column-gap:44px}
.cols p{margin-top:0}

/* ---- ornament ---- */
.orn{text-align:center;color:var(--gold);font-size:16px;letter-spacing:.6em;
  margin:0 0 26px}
.orn:before{content:"\2766"}
h2.dec{text-align:center;position:relative;margin-bottom:34px}
h2.dec:after{content:"";display:block;width:70px;height:0;border-top:2px solid var(--gold);
  border-bottom:1px solid var(--gold);margin:16px auto 0;padding-bottom:2px}

/* ---- framed and matted images ---- */
.slot{margin:0;position:relative;aspect-ratio:var(--ratio,4/3);overflow:hidden;
  background:#e6ddcd;border:1px solid var(--gold);outline:7px solid var(--cream);
  outline-offset:-8px;box-shadow:0 0 0 8px var(--cream),0 1px 5px rgba(47,43,40,.16)}
.slot img{width:100%;height:100%;object-fit:cover}
.slot::after{content:"Plate " attr(data-slot);position:absolute;inset:auto 0 14px 0;
  text-align:center;font:400 11px/1 "Source Serif 4",Georgia,serif;letter-spacing:.18em;
  text-transform:uppercase;color:#a3947c}
.slot:has(img)::after{display:none}
figure.plate{margin:0 0 30px}
figure.plate figcaption{text-align:center;font-size:13px;font-style:italic;
  color:#6f6558;margin-top:16px}

/* ---- bordered information boxes ---- */
.note{border:1px solid var(--rule);border-left:4px solid var(--burg);background:#fff;
  padding:24px 26px;margin:0 0 26px}
.note h3{margin-top:0}
.note p:last-child{margin-bottom:0}
.ledger{width:100%;border-collapse:collapse;font-size:16px}
.ledger th,.ledger td{text-align:left;padding:13px 14px;border-bottom:1px solid var(--rule);
  vertical-align:top}
.ledger th{font-family:Lora,serif;color:var(--burg);width:34%;font-weight:600}
.smallcaps{font-variant:small-caps;letter-spacing:.06em}

/* ---- quotes ---- */
.testimonial{text-align:center;max-width:660px;margin:0 auto}
.testimonial p{font-family:Lora,Georgia,serif;font-size:1.3rem;line-height:1.55;
  font-style:italic;color:var(--forest)}
.testimonial cite{display:block;margin-top:14px;font-style:normal;font-size:13px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}

/* ---- buttons / forms ---- */
.btn{display:inline-block;font-family:Lora,Georgia,serif;font-size:15px;letter-spacing:.08em;
  text-decoration:none;color:var(--cream);background:var(--burg);padding:14px 32px;
  border:1px solid var(--burg)}
.btn:hover,.btn:focus-visible{background:var(--forest);border-color:var(--forest);color:#fff}
.btn.o{background:transparent;color:var(--burg)}
.btn.o:hover{background:var(--burg);color:var(--cream)}
.sec.burg .btn{background:var(--cream);color:var(--burg);border-color:var(--cream)}
.sec.burg .btn:hover{background:#fff;color:var(--burg)}
form label{display:block;font-family:Lora,serif;font-size:14px;color:var(--burg);margin:0 0 7px}
form input,form textarea,form select{width:100%;font:400 16px/1.6 "Source Serif 4",Georgia,serif;
  padding:12px 14px;border:1px solid var(--rule);background:#fff;color:var(--char);
  margin-bottom:20px;border-radius:0}
form input:focus,form textarea:focus,form select:focus{outline:none;border-color:var(--burg)}
.ok{border:1px solid var(--forest);border-left:4px solid var(--forest);background:#fff;
  padding:18px 22px;margin-bottom:20px;color:var(--forest)}

/* ---- footer ---- */
footer{background:var(--forest);color:#cbd9d0;padding:52px 0 36px}
footer h4{color:#fff;font-family:Lora,serif;font-size:16px;margin:0 0 14px;
  font-variant:small-caps;letter-spacing:.06em}
footer ul{list-style:none;margin:0;padding:0}
footer li{margin-bottom:9px;font-size:15px}
footer a{color:#cbd9d0;text-decoration:none}
footer a:hover,footer a:focus-visible{color:#fff;text-decoration:underline}
.fine{border-top:1px solid #3d6152;margin-top:36px;padding-top:22px;font-size:13.5px;
  text-align:center;color:#9fb5a8}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;position:fixed;z-index:99;background:var(--burg);
  color:#fff;padding:12px 18px}

@media(max-width:880px){
  .two,.three{grid-template-columns:1fr;gap:30px}
  .cols{column-count:1}
  .sec{padding:42px 0}
  .masthead img{width:210px}
  nav a{padding:6px 10px;font-size:13px}
}
