
:root { color-scheme: light; font-family: Arial, sans-serif; color: #28211e; background: #faf5ec; }
* { box-sizing: border-box; }
body { margin: 0; }
.wrap { width: min(1100px, calc(100% - 36px)); margin-inline: auto; }
header { border-bottom: 1px solid #d8ccbd; }
header .wrap, nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 20px; }
a { color: #781f39; text-underline-offset: 4px; }
.brand, .eyebrow { font-size: .8rem; letter-spacing: .13em; text-transform: uppercase; font-weight: bold; }
.brand { text-decoration: none; }
.back { display: inline-block; margin-block: 30px 20px; }
.eyebrow { color: #80591c; }
h1, h2 { margin: 0; font-family: Georgia, serif; font-weight: normal; color: #781f39; }
h1 { font-size: clamp(2.8rem, 8vw, 5.4rem); }
h2 { font-size: clamp(1.25rem, 4vw, 1.7rem); }
.intro { line-height: 1.6; margin-bottom: 28px; }
.collection { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
figure { margin: 0; border: 1px solid #d8ccbd; background: #fffaf2; }
.art { aspect-ratio: 4 / 3; display: grid; place-items: center; background: #ede4d8; }
.art img { display: block; width: 100%; height: 100%; object-fit: contain; }
.empty { color: #80591c; font-family: Georgia, serif; letter-spacing: .25em; }
figcaption { padding: 15px; }
figcaption p { margin: 7px 0 0; font-size: .85rem; }
.button { display: inline-block; padding: 12px 16px; background: #80591c; color: #fffaf2; text-decoration: none; }
footer { margin-top: 30px; border-top: 1px solid #d8ccbd; padding-block: 22px; font-size: .8rem; }
@media (max-width: 480px) { .collection { grid-template-columns: 1fr; } }
