@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&family=Italiana&display=swap');

:root { --ink:#171714; --paper:#f4f1ea; --white:#fbfaf7; --line:#d8d3c8; --muted:#716e66; --accent:#b59a66; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:'DM Sans',sans-serif; }
button, input, select { font:inherit; }
button { color:inherit; }
.announcement { height:30px; display:grid; place-items:center; background:var(--ink); color:#fff; font-size:9px; letter-spacing:.24em; }
.site-header { height:90px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 5vw; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:20; background:rgba(244,241,234,.94); backdrop-filter:blur(14px); }
.wordmark { color:inherit; text-decoration:none; font-family:'Italiana',serif; font-size:24px; letter-spacing:.09em; }
.wordmark span { font-family:'DM Sans'; font-size:10px; vertical-align:top; margin-left:4px; letter-spacing:0; }
nav { display:flex; gap:34px; }
.nav-link,.search-toggle { border:0; background:none; cursor:pointer; }
.nav-link { padding:10px 2px; text-transform:uppercase; font-size:10px; letter-spacing:.18em; color:var(--muted); border-bottom:1px solid transparent; }
.nav-link.active { color:var(--ink); border-color:var(--ink); }
.search-toggle { justify-self:end; font-size:25px; transform:rotate(-18deg); }
.hero { min-height:calc(100vh - 120px); padding:9vw 8vw 6vw; position:relative; display:flex; flex-direction:column; justify-content:center; overflow:hidden; }
.hero::after { content:'M'; position:absolute; right:-1vw; bottom:-18vw; font-family:'Italiana'; font-size:58vw; color:rgba(23,23,20,.025); pointer-events:none; }
.eyebrow { margin:0 0 24px; color:var(--muted); font-size:9px; letter-spacing:.25em; }
.hero h1 { max-width:950px; margin:0; font-family:'Italiana',serif; font-size:clamp(54px,8.8vw,132px); font-weight:400; line-height:.85; letter-spacing:-.035em; }
.hero h1 em { color:var(--accent); font-weight:400; }
.hero-copy { width:min(430px,80vw); margin:42px 0 36px 37%; color:var(--muted); font-size:14px; line-height:1.8; }
.scroll-link { margin-left:37%; color:var(--ink); width:max-content; text-decoration:none; padding-bottom:7px; border-bottom:1px solid var(--ink); text-transform:uppercase; font-size:10px; letter-spacing:.14em; }
.scroll-link span { margin-left:26px; }
.hero-number { position:absolute; right:6vw; top:13%; font-family:'Italiana'; font-size:18px; }
.catalog { background:var(--white); padding:110px 5vw 120px; }
.catalog-heading { display:flex; justify-content:space-between; align-items:end; padding-bottom:50px; border-bottom:1px solid var(--ink); }
.catalog-heading h2 { margin:0; font-family:'Italiana'; font-size:clamp(48px,7vw,95px); font-weight:400; }
.count { text-align:right; margin:0; }
.count strong { display:block; font-family:'Italiana'; font-size:42px; font-weight:400; }
.count span { color:var(--muted); text-transform:uppercase; font-size:9px; letter-spacing:.2em; }
.toolbar { display:grid; grid-template-columns:1fr 260px auto; gap:28px; padding:28px 0; border-bottom:1px solid var(--line); }
.toolbar label { display:flex; align-items:center; gap:18px; }
.toolbar label>span { font-size:9px; text-transform:uppercase; letter-spacing:.16em; color:var(--muted); }
.toolbar input,.toolbar select { width:100%; border:0; outline:0; background:transparent; color:var(--ink); font-size:13px; }
.toolbar select { cursor:pointer; }
.clear-button { border:0; background:none; text-decoration:underline; cursor:pointer; font-size:10px; }
.brand-rail { display:flex; gap:8px; padding:28px 0; overflow-x:auto; scrollbar-width:none; }
.brand-chip { flex:none; border:1px solid var(--line); background:transparent; padding:11px 17px; border-radius:50px; font-size:9px; letter-spacing:.1em; text-transform:uppercase; cursor:pointer; transition:.2s; }
.brand-chip:hover,.brand-chip.active { background:var(--ink); color:#fff; border-color:var(--ink); }
.product-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:50px 18px; padding-top:30px; }
.product-card { min-width:0; }
.product-image { display:block; width:100%; padding:0; border:0; cursor:pointer; aspect-ratio:4/5; background:#ece8df; position:relative; overflow:hidden; }
.product-image img { width:100%; height:100%; object-fit:cover; transition:transform .65s cubic-bezier(.2,.7,.2,1); }
.product-image:hover img { transform:scale(1.035); }
.open-icon { position:absolute; top:14px; right:14px; width:32px; height:32px; display:grid; place-items:center; background:rgba(251,250,247,.9); border-radius:50%; transform:translateY(-50px); transition:.25s; }
.product-image:hover .open-icon { transform:none; }
.product-meta { padding:16px 2px 0; }
.product-brand { margin:0 0 8px; color:var(--accent); font-size:9px; text-transform:uppercase; letter-spacing:.17em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.product-name { margin:0; font-size:13px; line-height:1.45; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.product-link { display:inline-block; padding:0; border:0; background:none; cursor:pointer; margin-top:10px; color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.12em; text-decoration:none; }
.product-link:hover { color:var(--ink); }
.gallery-modal[hidden] { display:none; }
.gallery-modal { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:18px; }
.gallery-backdrop { position:absolute; inset:0; background:rgba(15,15,13,.78); backdrop-filter:blur(12px); }
.gallery-panel { position:relative; z-index:1; width:min(1180px,96vw); height:min(900px,94vh); display:grid; grid-template-rows:auto 1fr auto; background:var(--paper); box-shadow:0 30px 100px rgba(0,0,0,.35); }
.gallery-header { display:flex; align-items:center; justify-content:space-between; padding:20px 24px; border-bottom:1px solid var(--line); }
.gallery-header p { margin:0 0 5px; color:var(--accent); font-size:9px; letter-spacing:.16em; text-transform:uppercase; }
.gallery-header h2 { margin:0; max-width:80vw; font-size:15px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gallery-close { width:40px; height:40px; border:1px solid var(--line); border-radius:50%; background:none; cursor:pointer; font-size:24px; line-height:1; }
.gallery-stage { min-height:0; position:relative; display:grid; place-items:center; padding:20px 72px; overflow:hidden; background:#e9e5dc; }
.gallery-stage>img { width:100%; height:100%; object-fit:contain; }
.gallery-arrow { position:absolute; top:50%; transform:translateY(-50%); z-index:2; width:42px; height:42px; border:0; border-radius:50%; background:rgba(251,250,247,.9); cursor:pointer; font-size:18px; }
.gallery-prev { left:18px; }.gallery-next { right:18px; }
.gallery-counter { position:absolute; right:18px; bottom:14px; padding:7px 10px; background:rgba(23,23,20,.8); color:#fff; font-size:9px; letter-spacing:.12em; }
.gallery-thumbs { display:flex; gap:8px; overflow-x:auto; padding:12px 16px; background:var(--white); border-top:1px solid var(--line); }
.gallery-thumb { flex:0 0 64px; width:64px; height:64px; padding:0; border:2px solid transparent; background:#e7e3da; cursor:pointer; opacity:.58; }
.gallery-thumb.active { border-color:var(--ink); opacity:1; }
.gallery-thumb img { width:100%; height:100%; object-fit:cover; }
body.gallery-open { overflow:hidden; }
.load-more { display:flex; align-items:center; justify-content:space-between; width:260px; margin:70px auto 0; padding:16px 0; border:0; border-bottom:1px solid var(--ink); background:none; cursor:pointer; text-transform:uppercase; font-size:10px; letter-spacing:.15em; }
.empty-state { text-align:center; padding:100px 0; }
.empty-state p { font-family:'Italiana'; font-size:40px; margin:0 0 10px; }
.empty-state span { color:var(--muted); font-size:12px; }
footer { padding:70px 5vw 40px; background:var(--ink); color:#f4f1ea; display:grid; grid-template-columns:1fr 1fr 1fr auto; align-items:end; gap:30px; }
footer p { margin:0; color:#aaa79f; font-size:11px; }
footer a { color:#fff; font-size:10px; text-transform:uppercase; letter-spacing:.14em; }
.wordmark-footer { font-size:30px; }
@media (max-width:1000px) { .product-grid{grid-template-columns:repeat(3,1fr)} footer{grid-template-columns:1fr 1fr}.source-note{display:none} }
@media (max-width:700px) { .site-header{height:72px;padding:0 20px}.wordmark{font-size:19px}nav{gap:14px}.hero{padding:90px 24px 70px;min-height:78vh}.hero-copy,.scroll-link{margin-left:0}.hero-copy{margin-top:34px}.catalog{padding:75px 20px 90px}.catalog-heading{align-items:center}.count strong{font-size:30px}.toolbar{grid-template-columns:1fr}.clear-button{justify-self:start}.product-grid{grid-template-columns:repeat(2,1fr);gap:38px 10px}.product-name{font-size:11px}.product-link{font-size:8px}.open-icon{transform:none}.brand-rail{margin-right:-20px}.load-more{width:220px}footer{grid-template-columns:1fr;padding:55px 20px}.hero-number{display:none}.gallery-modal{padding:0}.gallery-panel{width:100vw;height:100dvh}.gallery-header{padding:14px 16px}.gallery-stage{padding:12px 48px}.gallery-arrow{width:34px;height:34px}.gallery-prev{left:8px}.gallery-next{right:8px}.gallery-thumb{flex-basis:54px;width:54px;height:54px} }
@media (max-width:380px) { .product-grid{grid-template-columns:1fr} }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.product-image img{transition:none} }