/* Alderbed Meadow — site styles */
:root{
  --paper:#F4F0E8; --mount:#E7E0D3; --mount-grey:#9C968A;
  --ink:#2B2823; --ink-soft:#6B6357; --rule:#CFC6B6;
  --gilt:#A07D4A; --sage:#6F7358;
  --serif:"EB Garamond",Garamond,Georgia,"Times New Roman",serif;
  --display:"Sorts Mill Goudy","EB Garamond",Georgia,serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:auto}
body{background:var(--paper);color:var(--ink);
  font:400 19px/1.7 var(--serif);-webkit-font-smoothing:antialiased}
a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--gilt)}
a:hover{color:var(--ink-soft);border-bottom-color:var(--ink-soft)}
img{display:block;max-width:100%;height:auto}

/* ---- header ---- */
.site-header{padding:9vh 7vw 0;display:flex;flex-direction:column;gap:2.4rem}
.masthead{display:flex;flex-direction:column;gap:.5rem}
.site-header h1{font:400 44px/1.15 var(--display);letter-spacing:.005em}
.site-header h1 a{border:0;color:inherit}
.strap{font-size:19px;color:var(--ink-soft)}
nav{display:flex;gap:2.6rem;align-items:baseline;flex-wrap:wrap}
nav a{font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink-soft);border-bottom:1px solid transparent;padding-bottom:2px}
nav a:hover{color:var(--ink)}
nav a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--gilt)}

/* ---- prose ---- */
.intro{padding:7vh 7vw 0;max-width:600px}
.intro p+p{margin-top:1.2rem}
.aside{padding:5vh 7vw 0;max-width:600px;font-style:italic;font-size:16px;color:var(--ink-soft)}
.closing{padding:12vh 7vw 0;max-width:600px;font-style:italic;color:var(--ink-soft)}
.page{padding:8vh 7vw 0;max-width:640px}
.page h2{font:400 30px/1.25 var(--display);padding-bottom:.6rem;
  border-bottom:1px solid var(--gilt);margin-bottom:1.8rem}
.page.leaf h2{border-bottom-color:var(--sage)}
.page p+p{margin-top:1.2rem}
.page .standfirst{font-style:italic;color:var(--ink-soft)}
.page .note{font-style:italic;color:var(--sage)}

/* ---- the plate ---- */
figure.plate{background:var(--mount);padding:13vh 0 15vh;
  display:flex;flex-direction:column;align-items:center;margin-top:14vh}
figure.plate:first-of-type{margin-top:10vh}
.plate .unit{display:flex;flex-direction:column;align-items:flex-start}
.plate .mount{background:var(--paper)}
.plate.tone-grey .mount{background:var(--mount-grey)}
.plate img{width:100%;height:auto}
.plate figcaption{font-style:italic;font-size:16px;color:var(--ink-soft);margin-top:1.4rem}

/* scale: image width per aspect, own floor per class */
.plate.panoramic .mount{width:max(60vw,min(88vw,520px))}
.plate.landscape .mount{width:max(54.8vw,min(75vw,441px))}
.plate.square    .mount{width:max(39.2vw,min(53vw,315px))}
.plate.portrait  .mount{width:max(33.4vw,min(45vw,269px))}
/* mount padding proportional to image width, foot deeper than head */
.plate .mount{padding:10% 10% 13.5%}

/* ---- available ---- */
.pieces{display:flex;flex-direction:column;gap:3.2rem;margin-top:2.4rem}
.piece h3{font:500 19px/1.4 var(--serif);margin-bottom:.3rem}
.piece .meta{color:var(--ink-soft)}
.piece .provenance{font-style:italic;color:var(--ink-soft);margin-top:.5rem}
.piece .price{margin-top:.6rem}
.piece .status{color:var(--ink-soft)}
.piece img{margin-bottom:1rem;border:0}
.piece--placeholder{color:var(--ink-soft);font-style:italic}


/* ---- section subheads and lists in prose pages ---- */
.page h3{font:400 13px/1.4 var(--serif);letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-soft);margin:2.6rem 0 .7rem}
.page h3:first-of-type{margin-top:1.8rem}
.page ul{list-style:none;margin:.4rem 0 0}
.page li{padding-left:1.1rem;position:relative;margin-bottom:.35rem}
.page li::before{content:"";position:absolute;left:0;top:.72em;
  width:5px;height:1px;background:var(--gilt)}
.page .sources{font-size:15.5px;color:var(--ink-soft);margin-top:1rem}
.page .sources li{margin-bottom:.7rem;line-height:1.55}

/* ---- the drawn plan ---- */
figure.plan{background:var(--mount);margin:4vh 0 1rem;padding:5% 5% 4%;
  border:1px solid var(--rule)}
figure.plan img{width:100%}
figure.plan figcaption{font-style:italic;font-size:15.5px;color:var(--ink-soft);
  margin-top:1.1rem}
.page--wide{max-width:1060px}
.page--wide .prose{max-width:640px}

/* ---- footer ---- */
footer{margin-top:14vh;border-top:1px solid var(--rule);
  padding:2.4rem 7vw 12vh;display:flex;justify-content:space-between;
  gap:1.5rem;flex-wrap:wrap;font-size:16px;color:var(--ink-soft)}
footer .right{font-style:italic}

@media (max-width:820px){
  .site-header{padding:6vh 7vw 0;gap:1.8rem}
  .site-header h1{font-size:32px}
  nav{gap:1.6rem}
  figure.plate{padding:8vh 0 9vh;margin-top:9vh}
  .plate .mount{padding:8% 8% 11%}
  .plate.panoramic .mount,.plate.landscape .mount{width:82vw}
  .plate.square .mount{width:70vw}
  .plate.portrait .mount{width:62vw}
}
@media print{ figure.plate{background:none;page-break-inside:avoid} nav{display:none} }

/* ---- prints ---- */
figure.framed{margin:3vh 0 1rem;max-width:600px}
figure.framed figcaption{font-style:italic;font-size:15.5px;color:var(--ink-soft);margin-top:.9rem}
.page .enquire{margin-top:1.4rem}
.page .enquire a{display:inline-block;padding:.55rem 1.2rem;border:1px solid var(--gilt);
  font-size:13px;letter-spacing:.18em;text-transform:uppercase}
.page .enquire a:hover{border-color:var(--ink-soft)}
.page .links li{margin-bottom:.8rem;line-height:1.55}
