.preview-catalog { max-width: 1280px; padding: 32px 24px 64px; margin: auto; }
.preview-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px 24px; }
.preview-tile { min-width: 0; }
.preview-tile[hidden] { display: none; }
.preview-tile a { display: block; text-decoration: none; }
.preview-tile img { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; background: var(--white); }
.preview-tile h2, .preview-tile h3 { font-family: var(--display); font-size: 23px; line-height: 1.25; font-weight: 600; margin: 16px 0 8px; }
.preview-tile p { margin: 0; font-size: 13px; color: var(--ink-soft); }
.preview-breadcrumbs, .preview-adjacent { max-width: 1280px; margin: auto; padding: 28px 24px; font-size: 13px; }
.preview-breadcrumbs { line-height: 1.8; }
.preview-breadcrumbs a, .preview-adjacent a { text-decoration: underline; text-underline-offset: 5px; }
.preview-detail { max-width: 1280px; margin: auto; padding: 16px 24px 64px; display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.preview-photo { margin: 0; }
.preview-photo img { width: 100%; height: auto; max-height: 780px; object-fit: contain; background: var(--white); }
.preview-photo figcaption { font-size: 12px; line-height: 1.7; margin-top: 16px; color: var(--ink-soft); max-width: 60ch; }
.preview-copy h1 { font-size: clamp(36px, 4vw, 60px); margin: 0 0 16px; overflow-wrap: anywhere; }
.preview-copy h2 { font-size: 28px; margin: 32px 0 12px; }
.preview-copy p, .preview-copy li { font-size: 16px; line-height: 1.8; }
.preview-copy p { margin: 0 0 20px; }
.preview-copy ul { padding-left: 20px; }
.preview-copy .preview-availability { color: var(--ink-soft); font-size: 13px; margin-bottom: 28px; }
.preview-intro { font-weight: 600; }
.preview-copy .preview-sales { color: var(--ink-soft); font-size: 14px; border-top: 1px solid var(--line); margin-top: 32px; padding-top: 24px; }
.preview-adjacent { display: flex; justify-content: space-between; gap: 24px; border-top: 1px solid var(--line); }
.catalog-search { margin-bottom: 32px; }
.catalog-search label { display: block; font-weight: 600; margin-bottom: 12px; }
.catalog-search input { width: min(100%, 520px); min-height: 48px; padding: 12px; border: 1px solid var(--line); background: var(--white); color: var(--charcoal); font: inherit; }
.catalog-search p { font-size: 13px; color: var(--ink-soft); }
.preview-all { text-align: center; margin-top: 40px; }
@media (max-width: 900px) { .preview-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .preview-detail { gap: 32px; } }
@media (max-width: 700px) { .preview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 16px; } .preview-tile h2, .preview-tile h3 { font-size: 19px; } .preview-detail { grid-template-columns: 1fr; } .preview-detail, .preview-breadcrumbs { padding-inline: 24px; } .preview-adjacent { flex-direction: column; } }
