:root{
  --paper:#f4efe3;       /* warm ivory */
  --paper-2:#efe8d9;
  --ink:#2a2420;         /* warm near-black */
  --ink-soft:#6b5f52;    /* muted sepia */
  --rule:#cabfa8;        /* faint line */
  --mat:#fbf8f1;         /* print mat */
  --accent:#7a2e22;      /* oxblood */
  --serif:"EB Garamond", Georgia, "Times New Roman", serif;
  --display:"Playfair Display", Georgia, serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--serif);
  font-size:19px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  background-image:radial-gradient(circle at 50% 0,rgba(0,0,0,.015),transparent 60%);
}
.wrap{max-width:1040px;margin:0 auto;padding:0 24px 72px}
a{color:var(--accent)}

/* ===== Top bar / brand / nav ===== */
.topbar{border-bottom:1px solid var(--rule);text-align:center;padding:26px 24px 0}
.brand{display:inline-block}
.brand a{
  font-family:var(--display);font-weight:600;font-size:30px;letter-spacing:.01em;
  color:var(--ink);text-decoration:none;display:block;line-height:1}
.brand .brand-sub{
  display:block;font-style:italic;color:var(--ink-soft);font-size:15px;margin-top:4px}
.site-nav{
  display:flex;flex-wrap:wrap;justify-content:center;gap:6px 30px;
  margin:18px 0 0;padding:14px 0 16px}
.site-nav a{
  font-variant:small-caps;letter-spacing:.2em;font-size:14px;text-transform:lowercase;
  color:var(--ink-soft);text-decoration:none;padding-bottom:3px;border-bottom:1px solid transparent}
.site-nav a:hover{color:var(--ink)}
.site-nav a.current{color:var(--accent);border-bottom-color:var(--accent)}

/* ===== Home: hero ===== */
.hero{text-align:center;padding:62px 0 8px}
.hero .eyebrow{
  font-variant:small-caps;letter-spacing:.32em;text-transform:lowercase;
  font-size:14px;color:var(--ink-soft);margin:0 0 16px}
.hero h1{
  font-family:var(--display);font-weight:600;font-size:clamp(34px,6.5vw,56px);
  line-height:1.08;margin:0;max-width:16ch;margin-inline:auto}
.hero .lede{max-width:600px;margin:24px auto 0;font-style:italic;color:var(--ink-soft);font-size:19px}
.hero .cta{margin-top:30px}
.btn{
  display:inline-block;font-variant:small-caps;letter-spacing:.16em;font-size:15px;
  color:var(--accent);text-decoration:none;border:1px solid var(--accent);
  border-radius:2px;padding:9px 22px;transition:background .15s,color .15s}
.btn:hover{background:var(--accent);color:var(--paper)}

/* ===== Section heading (shared) ===== */
.sec-head{text-align:center;margin-top:70px}
.sec-head h2{font-family:var(--display);font-weight:600;font-size:27px;margin:0}
.sec-head .meta{
  font-variant:small-caps;letter-spacing:.2em;color:var(--ink-soft);font-size:14px;margin:8px 0 0}
.divider{height:1px;background:var(--rule);max-width:220px;margin:20px auto 40px;position:relative}
.divider::after{content:"";position:absolute;left:50%;top:-3px;width:7px;height:7px;transform:translateX(-50%) rotate(45deg);background:var(--paper);border:1px solid var(--rule)}

/* ===== Plates / gallery ===== */
.collection{margin-top:14px}
.plates{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:40px 34px;align-items:start}
figure.plate{margin:0;text-align:center}
.frame{
  background:var(--mat);padding:16px 16px 18px;border:1px solid #e4dcc9;
  box-shadow:0 2px 2px rgba(60,45,25,.06),0 14px 30px rgba(60,45,25,.11);
  display:inline-block;max-width:100%}
.frame img{display:block;max-width:100%;height:auto;border:1px solid #d8cfb9}
figcaption{margin:14px 4px 0}
figcaption .title{font-style:italic;font-size:19px}
figcaption .cap-meta{font-variant:small-caps;letter-spacing:.14em;font-size:13px;color:var(--ink-soft);margin-top:4px}
figcaption .tags{margin-top:7px}
figcaption .tags a,figcaption .tags span{
  display:inline-block;font-size:12.5px;color:var(--accent);text-decoration:none;
  border:1px solid #e0d2bf;border-radius:2px;padding:1px 8px;margin:2px 2px 0;
  font-variant:small-caps;letter-spacing:.08em}

/* ===== About (home) ===== */
.about{max-width:680px;margin:0 auto}
.about p{margin:0 0 18px}
.about p:first-of-type::first-letter{
  font-family:var(--display);font-size:3.1em;line-height:.8;float:left;
  padding:4px 10px 0 0;color:var(--accent)}

/* ===== Footer ===== */
footer{margin-top:80px;border-top:1px solid var(--rule);padding-top:26px;text-align:center;color:var(--ink-soft)}
footer .note{font-style:italic;max-width:620px;margin:0 auto;font-size:16px}
footer .fine{font-variant:small-caps;letter-spacing:.2em;font-size:12.5px;margin-top:18px}

/* ===== Support: counters ===== */
.counts{display:flex;flex-wrap:wrap;justify-content:center;gap:44px 80px;margin:6px auto 4px}
.count{text-align:center;min-width:180px}
.count .num{font-family:var(--display);font-weight:600;font-size:clamp(46px,9vw,76px);line-height:1;color:var(--accent);font-variant-numeric:tabular-nums}
.count .lab{font-variant:small-caps;letter-spacing:.2em;font-size:14px;color:var(--ink-soft);margin-top:12px}
.count .sub{font-style:italic;font-size:14px;color:var(--ink-soft);margin-top:6px}

@media (max-width:560px){ body{font-size:18px} .hero{padding-top:44px} .site-nav{gap:4px 18px} .counts{gap:34px} }

/* ===== Collections: full archive ===== */
.selected-head{margin-top:110px}
.albums{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:34px 30px}
.album{display:block;text-decoration:none;color:var(--ink);background:var(--mat);padding:12px 12px 16px;
  border:1px solid #e4dcc9;box-shadow:0 2px 2px rgba(60,45,25,.06),0 12px 26px rgba(60,45,25,.1);
  transition:transform .15s,box-shadow .15s;text-align:center}
.album:hover,.album:focus-visible{transform:translateY(-3px);box-shadow:0 2px 2px rgba(60,45,25,.06),0 18px 34px rgba(60,45,25,.15)}
.album-previews{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.album-previews img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border:1px solid #d8cfb9;background:var(--paper-2)}
.album h3{font-family:var(--display);font-weight:500;font-size:20px;margin:14px 0 0;line-height:1.25}
.album .meta{font-variant:small-caps;letter-spacing:.16em;color:var(--ink-soft);font-size:13px;margin:6px 0 0}
.crumb{margin:28px 0 0;font-variant:small-caps;letter-spacing:.16em;font-size:14px}
.crumb a{text-decoration:none}
.album-head{margin-top:30px}
.album-nav{display:flex;justify-content:space-between;gap:20px;margin-top:56px;padding-top:22px;border-top:1px solid var(--rule);
  font-variant:small-caps;letter-spacing:.12em;font-size:15px}
.album-nav a{text-decoration:none}
.album-nav .next{text-align:right}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.thumb{display:block;background:var(--mat);padding:6px;border:1px solid #e4dcc9;
  box-shadow:0 1px 2px rgba(60,45,25,.06),0 6px 14px rgba(60,45,25,.08);transition:transform .15s}
.thumb:hover,.thumb:focus-visible{transform:translateY(-2px)}
.thumb img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border:1px solid #d8cfb9;background:var(--paper-2)}
#viewer{border:none;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100vw;height:100vh;margin:0}
#viewer::backdrop{background:rgba(24,20,17,.92)}
#viewer[open]{display:flex;flex-direction:column;align-items:center;justify-content:center}
#viewer img{max-width:92vw;max-height:82vh;object-fit:contain;background:var(--mat);padding:10px}
#viewer .v-cap{color:#d9cfbd;font-style:italic;font-size:16px;margin:14px 16px 0;text-align:center}
#viewer button{position:absolute;background:none;border:none;color:#efe6d4;font-size:46px;line-height:1;cursor:pointer;padding:12px 18px;font-family:var(--serif)}
#viewer button:hover,#viewer button:focus-visible{color:#fff}
#viewer .v-close{top:8px;right:8px;font-size:40px}
#viewer .v-prev{left:4px;top:50%;transform:translateY(-50%)}
#viewer .v-next{right:4px;top:50%;transform:translateY(-50%)}
@media (prefers-reduced-motion:reduce){.thumb,.album{transition:none}.thumb:hover,.album:hover{transform:none}}
@media (max-width:560px){.thumbs{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}.thumb{padding:4px}}
