:root {
  --paper:#fbf7f1;
  --sand:#eee2d5;
  --ink:#302620;
  --clay:#884633;
  --line:#dfd4c8;
  --serif:Georgia, "Songti SC", SimSun, serif;
}
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:15px/1.65 system-ui,"Microsoft YaHei",sans-serif; }
a { color:inherit; text-decoration:none; }
a:focus-visible { outline:2px solid var(--clay); outline-offset:3px; }
img { display:block; width:100%; }
h1,h2,p { margin:0; }
h1,h2 { font-family:var(--serif); font-weight:500; line-height:1.16; }
.bar { background:var(--ink); color:#fff4e8; text-align:center; padding:7px; font-size:10px; letter-spacing:.18em; }
header,footer { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 5vw; min-height:72px; border-bottom:1px solid var(--line); }
header nav { display:flex; gap:26px; }
header nav a:hover,.section-head a:hover { text-decoration:underline; text-underline-offset:5px; }
.logo { width:max-content; font:700 36px/1 Georgia,serif; letter-spacing:-.075em; }
.logo span,h1 span,.eyebrow { color:var(--clay); }
.extra { justify-self:end; font-size:13px; }
.hero { display:grid; grid-template-columns:1fr 1fr; background:var(--sand); min-height:min(650px,65vw); }
.intro { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; padding:48px 8vw; }
.eyebrow { font-size:11px; font-weight:650; letter-spacing:.17em; }
.hero h1 { font-size:clamp(46px,6.5vw,96px); letter-spacing:-.055em; margin:21px 0; }
.lead { margin-bottom:24px; color:#594a40; }
.button { display:inline-flex; gap:26px; padding:11px 17px; min-height:46px; align-items:center; background:var(--ink); color:white; }
.button:hover { background:var(--clay); }
.hero-photo,.detail-photo { position:relative; }
.hero-photo img { position:absolute; height:100%; object-fit:cover; object-position:center 43%; }
.hero-photo small,.detail-photo small { position:absolute; right:14px; bottom:14px; background:var(--paper); padding:6px 10px; font-size:11px; }
.wrap { width:min(90%,1360px); margin-inline:auto; }
.block { padding-block:55px; }
.block + .block { border-top:1px solid var(--line); }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:12px; margin:8px 0 24px; }
.section-head h2 { font-size:clamp(30px,4vw,52px); }
.section-head a { font-size:13px; }
.grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:26px 16px; }
.card img { aspect-ratio:4/5; object-fit:cover; background:var(--sand); transition:filter .2s; }
.card:hover img { filter:brightness(.91); }
.card small { display:block; margin-top:8px; color:var(--clay); font-size:11px; letter-spacing:.08em; }
.card strong { display:block; font-size:16px; font-weight:550; }
footer { display:flex; justify-content:space-between; align-items:start; gap:28px; flex-wrap:wrap; padding-block:32px; background:var(--sand); }
.footer-brand { display:grid; gap:12px; }
.footer-contact { min-width:min(100%,260px); }
.footer-contact h2 { font-size:23px; }
.footer-contact dl { margin:12px 0 0; }
.footer-contact dl div { display:grid; grid-template-columns:3em minmax(0,1fr); gap:10px; }
.footer-contact dd { margin:0; overflow-wrap:anywhere; }
.collection-title { text-align:center; background:var(--sand); padding:45px 5vw; }
.collection-title h1,.detail h1 { font-size:clamp(37px,5vw,68px); margin:10px 0; }
.listing { padding-block:25px 60px; }
.filters { display:flex; gap:7px; flex-wrap:wrap; border-bottom:1px solid var(--line); padding-bottom:16px; }
.filters a { border:1px solid var(--line); padding:7px 12px; font-size:13px; }
.filters a:hover,.filters [aria-current] { color:white; background:var(--ink); }
.count,.crumb { margin:15px 0; font-size:13px; color:#66564b; }
.crumb { display:flex; flex-wrap:wrap; gap:8px; }
.crumb a { text-decoration:underline; }
.detail { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:6vw; align-items:center; }
.detail-photo { display:block; background:var(--sand); }
.detail-photo img { max-height:720px; object-fit:contain; }
.detail dl { margin:22px 0; }
.detail dl div { display:flex; justify-content:space-between; border-top:1px solid var(--line); padding:8px 0; }
.detail dd { margin:0; }
@media(max-width:760px) {
  header { grid-template-columns:1fr auto; min-height:60px; }
  .extra { display:none; }
  .hero,.detail { grid-template-columns:1fr; }
  .intro { padding:34px 6vw; }
  .hero h1 { margin:12px 0; }
  .hero-photo { aspect-ratio:1.15; }
  .grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 12px; }
  .block { padding-block:38px; }
}
@media(prefers-reduced-motion:reduce) { .card img { transition:none; } }
