:root {
  --paper: #f3ead8;
  --ink: #1c1410;
  --wine: #7a1f2b;
  --wine2: #4a1218;
  --rule: #cbbca4;
  --muted: #6a5e50;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--paper);
  color: var(--ink);
  font-family: Manrope, "Segoe UI", sans-serif;
  font-size: 17px;
  line-height: 1.65;
}
a { color: var(--wine); }
.paper {
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image: radial-gradient(rgba(28,20,16,.03) 1px, transparent 1px);
  background-size: 18px 18px;
  z-index: 0;
}
.mast, .cover, .figures, .chapter, .colophon, footer { position: relative; z-index: 1; }

.mast {
  padding: 22px 8vw 0;
  border-bottom: 3px solid var(--ink);
}
.mast-row { display: flex; justify-content: space-between; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.wordmark {
  display: block;
  font-family: "Cormorant Garamond", serif;
  font-size: clamp(42px, 8vw, 92px);
  font-weight: 600;
  color: var(--ink);
  text-decoration: none;
  text-align: center;
  line-height: .9;
  margin: 12px 0 8px;
}
.wordmark em { font-style: italic; color: var(--wine); }
.mast-sub { text-align: center; color: var(--muted); font-size: 13px; margin-bottom: 18px; }
.chapters {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 18px;
  padding: 12px 0 16px;
  font-size: 13px;
}
.chapters a { color: var(--ink); text-decoration: none; }
.chapters a:hover { color: var(--wine); }
.lang button {
  background: none;
  border: 0;
  font: inherit;
  color: var(--muted);
  cursor: pointer;
  letter-spacing: .12em;
}
.lang button.is-on { color: var(--wine); font-weight: 700; }
.menu-btn {
  display: none;
  margin: 0 auto 12px;
  background: var(--ink);
  color: var(--paper);
  border: 0;
  padding: 8px 16px;
  font: inherit;
}

.cover { padding: 64px 8vw 48px; max-width: 1200px; }
.kicker { letter-spacing: .22em; text-transform: uppercase; font-size: 12px; color: var(--wine); margin-bottom: 16px; }
.cover h1 {
  font-family: "Cormorant Garamond", serif;
  font-size: clamp(40px, 6vw, 76px);
  font-weight: 600;
  line-height: 1.02;
  max-width: 16ch;
}
.standfirst { max-width: 62ch; margin: 24px 0 36px; font-size: 19px; color: var(--muted); }
.cover-meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; border-top: 1px solid var(--rule); padding-top: 20px; }
.cover-meta b { display: block; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--wine); }
.cover-meta span { font-family: "Cormorant Garamond", serif; font-size: 22px; }

.figures {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
}
.figures figure { padding: 28px 8vw 28px 32px; border-right: 1px solid var(--rule); }
.figures figure:last-child { border-right: 0; }
.figures b { font-family: "Cormorant Garamond", serif; font-size: 42px; color: var(--wine); }
.figures figcaption { color: var(--muted); font-size: 14px; }

.chapter { padding: 72px 8vw; }
.chapter.linen { background: #efe4ce; }
.chapter header { display: flex; gap: 18px; align-items: baseline; margin-bottom: 28px; border-bottom: 1px solid var(--rule); padding-bottom: 12px; }
.chapter header span {
  font-family: "Cormorant Garamond", serif;
  font-size: 42px;
  color: var(--wine);
  font-style: italic;
}
.chapter h2 { font-family: "Cormorant Garamond", serif; font-size: clamp(32px, 4vw, 48px); font-weight: 600; }
.columns { columns: 2; column-gap: 40px; }
.columns p { margin-bottom: 16px; }
.drop::first-letter {
  font-family: "Cormorant Garamond", serif;
  font-size: 68px;
  float: left;
  line-height: .7;
  padding: 8px 10px 0 0;
  color: var(--wine);
}
.lead { max-width: 70ch; font-size: 20px; margin-bottom: 28px; font-family: "Cormorant Garamond", serif; font-style: italic; }

.practices { list-style: none; counter-reset: pr; display: grid; grid-template-columns: 1fr 1fr; gap: 28px 40px; }
.practices li { counter-increment: pr; }
.practices li::before {
  content: counter(pr, lower-roman) ".";
  color: var(--wine);
  font-family: "Cormorant Garamond", serif;
  font-size: 22px;
}
.practices h3 { font-family: "Cormorant Garamond", serif; font-size: 28px; margin: 4px 0 8px; }
.practices p { color: var(--muted); }

.imprint-grid, .notebooks, .folios, .people, .essays {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.imprint-grid article, .notebooks article, .folios article, .people article, .essays article {
  padding: 24px 0;
  border-top: 1px solid var(--ink);
}
.imprint-grid small { letter-spacing: .18em; color: var(--wine); font-size: 11px; }
.imprint-grid h3, .notebooks h3, .folios h3, .people h3, .essays h3 {
  font-family: "Cormorant Garamond", serif;
  font-size: 28px;
  margin: 6px 0 8px;
}
.folios span { font-style: italic; color: var(--wine); }

.atelier { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.atelier h3 { font-family: "Cormorant Garamond", serif; font-size: 28px; margin-bottom: 12px; }
.atelier li { margin: 8px 0 8px 18px; color: var(--muted); }
blockquote {
  margin-top: 32px;
  padding: 20px 0;
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  font-family: "Cormorant Garamond", serif;
  font-size: 28px;
  font-style: italic;
  line-height: 1.3;
}

.notes details { border-bottom: 1px solid var(--rule); padding: 14px 0; }
.notes summary { cursor: pointer; font-family: "Cormorant Garamond", serif; font-size: 24px; }
.notes p { margin-top: 8px; color: var(--muted); max-width: 80ch; }

.colophon { padding: 72px 8vw; background: var(--wine2); color: #f3ead8; }
.colophon header span { color: #e8c9a0; }
.colophon h2 { color: #f3ead8; }
.colo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.vcard p { margin-bottom: 16px; }
.vcard span { display: block; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: #e8c9a0; }
.vcard a, .vcard strong { color: #f3ead8; font-size: 20px; text-decoration: none; }
.fine { font-size: 15px !important; color: #d7c4a8 !important; max-width: 50ch; }

form { display: grid; gap: 12px; }
form label { display: grid; gap: 6px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: #e8c9a0; }
form input, form select, form textarea {
  background: transparent;
  border: 0;
  border-bottom: 1px solid #e8c9a0;
  color: #f3ead8;
  padding: 10px 0;
  font: inherit;
}
form button {
  margin-top: 8px;
  background: #f3ead8;
  color: var(--wine2);
  border: 0;
  padding: 14px;
  font-family: "Cormorant Garamond", serif;
  font-size: 22px;
  cursor: pointer;
}
.form-ok { color: #e8c9a0; }

footer {
  padding: 28px 8vw;
  display: flex;
  justify-content: space-between;
  gap: 24px;
  font-size: 13px;
  color: var(--muted);
  border-top: 1px solid var(--ink);
}

@media (max-width: 900px) {
  .columns { columns: 1; }
  .figures, .cover-meta, .practices, .imprint-grid, .notebooks, .folios, .people, .essays, .atelier, .colo-grid, footer {
    grid-template-columns: 1fr;
  }
  .figures { display: grid; }
  .chapters { display: none; }
  .chapters.open { display: flex; flex-direction: column; }
  .menu-btn { display: block; }
}
