:root{color-scheme:light;--ink:#181716;--muted:#6f6b66;--paper:#f5f3ef;--card:#fff;--line:#dedad3;--accent:#694634}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
.topbar{position:sticky;z-index:10;top:0;padding:20px clamp(16px,4vw,56px) 14px;border-bottom:1px solid var(--line);background:rgba(245,243,239,.96);backdrop-filter:blur(12px)}
.heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px;max-width:1500px;margin:0 auto 16px}
.brand-title{display:flex;align-items:center;gap:14px}.brand-logo{display:block;width:70px;height:70px;border-radius:10px;object-fit:contain;background:#fff}
h1{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.75rem,3vw,2.55rem);font-weight:500;letter-spacing:-.025em}.heading p{margin:0;color:var(--muted);font-size:.92rem;white-space:nowrap}
.filters{display:flex;gap:8px;max-width:1500px;margin:auto;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}.filters::-webkit-scrollbar{display:none}
.filter{flex:0 0 auto;min-height:42px;padding:10px 15px;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink);font:inherit;font-size:.9rem;cursor:pointer}.filter:hover{border-color:var(--accent)}.filter[aria-pressed=true]{border-color:var(--ink);background:var(--ink);color:#fff}
main{padding:clamp(18px,3vw,42px) clamp(12px,4vw,56px) 60px}.catalogue{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:clamp(12px,2vw,22px);max-width:1500px;margin:auto}
.product{display:block;min-width:0;padding:0;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--card);color:inherit;text-align:left;cursor:zoom-in;transition:transform .18s ease,box-shadow .18s ease}.product:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(36,29,25,.11)}
.product:focus-visible,.filter:focus-visible,.viewer button:focus-visible{outline:3px solid #a97758;outline-offset:3px}.product img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:#e8e4dd}.product span{display:block;padding:11px 13px 12px;font-size:.88rem;font-weight:650;letter-spacing:.04em}
.viewer{width:min(94vw,1120px);height:min(92vh,880px);padding:0;border:0;border-radius:14px;background:#111;color:#fff}.viewer::backdrop{background:rgba(0,0,0,.82)}.viewer figure{display:grid;grid-template-rows:minmax(0,1fr) auto;width:100%;height:100%;margin:0}.viewer img{width:100%;height:100%;min-height:0;object-fit:contain}.viewer figcaption{display:flex;justify-content:space-between;gap:20px;padding:14px 58px;color:#eee;font-size:.92rem}
.viewer-close,.viewer-nav{position:absolute;z-index:2;border:0;border-radius:999px;background:rgba(0,0,0,.62);color:#fff;cursor:pointer}.viewer-close{top:14px;right:14px;width:44px;height:44px;font-size:1.8rem}.viewer-nav{top:50%;width:48px;height:58px;margin-top:-29px;font-size:2.4rem}.viewer-nav.previous{left:12px}.viewer-nav.next{right:12px}
@media(max-width:620px){.topbar{padding-top:10px}.heading{align-items:center;margin-bottom:10px}.brand-title{gap:9px}.brand-logo{width:50px;height:50px;border-radius:7px}.heading p{font-size:.8rem}.catalogue{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.product{border-radius:8px}.product span{padding:9px 10px;font-size:.78rem}.viewer{width:100vw;height:100vh;max-width:none;max-height:none;border-radius:0}.viewer figcaption{padding:12px 56px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.product{transition:none}}