/* Shared product showroom: original photography, tonal surfaces. */
/* Crop only the embedded studio margins; keep original product pixels and colors. */
img[src$="/p003-1.webp"] { object-view-box: inset(20.45% 19% 22.9% 21.75%); }
img[src$="/p048-1.webp"] { object-view-box: inset(3.5% 19.9% 4.4% 22.2%); }
.np-image img[src$="/p003-1.webp"] { clip-path: inset(18.2% 0 18.2% round 4px); }
.np-image img[src$="/p048-1.webp"] { clip-path: inset(0 26% 0 26% round 5px); }
.np-catalog { --showroom: #c3c8ba; }
.np-catalog-heading { padding-bottom: 12px; }
.np-search input { border-radius: 30px; padding: 15px 22px; background: transparent; }
.np-filters { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-top: 30px; }
.np-filters button { position: relative; display: grid; grid-template-columns: 36px 1fr; align-items: center; gap: 5px 14px; min-height: 100px; padding: 20px; text-align: left; border-radius: 14px; background: linear-gradient(130deg,var(--bg-soft),var(--bg)); color: var(--text); transition: border-color .2s,background .2s,transform .2s; }
.np-category-icon { grid-row: span 2; color: var(--accent); }
.np-category-icon svg { width: 29px; height: 29px; }
.np-category-label { font-size: 12px; line-height: 1.5; padding-right: 14px; }
.np-category-count { font-size: 10px; color: var(--muted); letter-spacing: .08em; }
.np-category-arrow { position: absolute; right: 15px; top: 15px; font-size: 14px; opacity: .4; }
.np-filters button:hover { border-color: var(--accent); transform: translateY(-2px); }
.np-filters button[aria-pressed="true"] { color: #172119; background: linear-gradient(120deg,#e6d5af,#c9b381); border-color: #d9c398; box-shadow: 0 8px 28px #00000012; }
.np-filters button[aria-pressed="true"] .np-category-icon,.np-filters button[aria-pressed="true"] .np-category-count { color: #42513e; }
.np-filters button[aria-pressed="true"] .np-category-arrow { opacity: 1; }
.np-results { padding-block: 30px 22px; letter-spacing: .03em; }
.np-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 26px; }
.np-card { border-radius: 20px; overflow: hidden; border: 1px solid var(--line); background: var(--bg-soft); transition: transform .25s,box-shadow .25s,border-color .25s; }
.np-card:hover { transform: translateY(-5px); box-shadow: 0 20px 40px #00000014; border-color: #b39b6c80; }
.np-image { isolation: isolate; border: 0; border-radius: 0; padding: 38px; background: radial-gradient(ellipse at 45% 30%,#e3e5db 0%,#c6ccbd 55%,#aeb8a7 100%); }
.np-card:nth-child(3n+2) .np-image { background: radial-gradient(ellipse at 45% 30%,#e9e0ce,#d6c7ad 60%,#beb298); }
.np-card:nth-child(3n+3) .np-image { background: radial-gradient(ellipse at 45% 30%,#e3e5e4,#c5cbc8 60%,#aeb8b3); }
.np-image::after { content: ''; position: absolute; left: 25%; right: 25%; bottom: 14%; height: 10%; background: #314333; border-radius: 50%; filter: blur(17px); opacity: .16; z-index: -1; }
.np-image img { mix-blend-mode: normal; filter: none; opacity: 1; transition: transform .5s cubic-bezier(.2,.7,.3,1); }
.np-image:hover img { transform: translateY(-5px) scale(1.07); }
.np-zoom { display: grid; place-items: center; width: 36px; height: 36px; right: 16px; bottom: 16px; border: 1px solid #354b3930; border-radius: 50%; background: #ffffff35; backdrop-filter: blur(8px); color: #283e2f; }
.np-card-copy { padding: 23px 25px 25px; }
.np-card-copy > span { text-transform: uppercase; letter-spacing: .12em; font-size: 9px; }
.np-card h3 { font-size: 19px; min-height: 53px; margin-top: 11px; }
.np-card-copy a { padding-top: 15px; font-size: 11px; }
.np-dialog { border-radius: 24px; }
.np-gallery { padding: 15px; background: radial-gradient(ellipse at top,#e3e5db,#b9c3b0); border-radius: 18px; }
#np-detail-image { background: transparent; mix-blend-mode: normal; filter: none; opacity: 1; }
.np-thumbs button { background: #ffffff40; border-radius: 10px; }
.np-thumbs img { mix-blend-mode: normal; filter: none; opacity: 1; }
.np-hero-art { border-radius: 24px; background: radial-gradient(ellipse at 35% 25%,#e2e4d7,#bac5ad); }
.np-hero-art img { mix-blend-mode: normal; filter: none; opacity: 1; }
html[data-theme="light"] .np-card { background: #f0eee6; box-shadow: 0 4px 20px #303a2e05; }
@media(max-width:1050px) { .np-grid { gap: 18px; } .np-filters { grid-template-columns: repeat(3,minmax(0,1fr)); } .np-filters button { padding: 16px; } .np-image { padding: 25px; } .np-card-copy { padding: 20px; } }
@media(max-width:700px) { .np-filters { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; } .np-filters button { grid-template-columns: 24px 1fr; gap: 4px 9px; padding: 14px 11px; min-height: 92px; } .np-category-icon svg { width: 23px; height: 23px; } .np-category-label { font-size: 10px; padding-right: 6px; } .np-category-count { font-size: 9px; } .np-category-arrow { top: 7px; right: 8px; font-size: 11px; } .np-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px 10px; } .np-image { padding: 19px; } .np-card { border-radius: 14px; } .np-card-copy { padding: 16px 12px; } .np-card h3 { font-size: 14px; min-height: 59px; } .np-card-copy > span { font-size: 7px; } .np-card-copy a { font-size: 9px; } .np-zoom { width: 26px; height: 26px; right: 8px; bottom: 8px; font-size: 15px; } }
@media(prefers-reduced-motion:reduce) { .np-card,.np-image img,.np-filters button { transition: none; transform: none !important; } }
