.page .wrap { max-width: 1180px; margin: 0 auto; padding: calc(var(--top) + 40px) var(--pad) 64px; }
.page h1 { font-size: var(--sc-t-2xl); max-width: 20ch; }
.lead { color: var(--sc-ink-soft); max-width: 58ch; font-size: var(--sc-t-lg); margin: 0 0 28px; }
.filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; }
.filters button { font: 500 14px var(--sc-font-text); height: 38px; padding: 0 16px; border-radius: 999px; border: 1px solid rgb(17 20 24 / 0.2); background: transparent; cursor: pointer; color: var(--sc-ink); }
.filters button[aria-pressed="true"] { background: var(--sc-ink); color: var(--sc-canvas); border-color: var(--sc-ink); }
.catalog { list-style: none; margin: 0; padding: 0; display: grid; gap: 44px; }
.item { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 28px; align-items: start; padding-bottom: 44px; border-bottom: 1px solid var(--line); scroll-margin-top: calc(var(--top) + 20px); }
.shots { display: grid; grid-template-columns: 2fr 1fr; gap: 8px; }
.shots img { width: 100%; height: 100%; object-fit: cover; border-radius: 4px; aspect-ratio: 4 / 3; }
.shots img:first-child { grid-row: span 2; aspect-ratio: auto; }
.label { display: grid; grid-template-columns: 96px 1fr; gap: 8px 14px; margin: 0; font-size: 15px; }
.label dt { font: 500 12px var(--sc-font-mono); text-transform: uppercase; letter-spacing: 0.06em; color: var(--sc-ink-soft); padding-top: 3px; }
.label dd { margin: 0; } .label .price { font: 500 20px var(--sc-font-mono); }
.ask { display: inline-grid; place-items: center; padding: 0 22px; text-decoration: none; margin-top: 18px; width: max-content; }
.two { display: grid; grid-template-columns: 1.1fr minmax(320px, 480px); gap: 48px; align-items: start; }
.facts { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 12px; max-width: 48ch; }
.facts b { font-family: var(--sc-font-mono); color: var(--sc-accent); margin-right: 6px; }
.side { border-radius: 6px; max-height: 420px; object-fit: cover; }
.invited { color: var(--sc-accent); font-weight: 500; }
.prose { max-width: 760px; } .prose h2 { font-size: var(--sc-t-lg); margin: 28px 0 8px; } .prose p { color: var(--sc-ink-soft); }
.notice { padding: 12px 14px; background: #fff4d6; color: #7a4b00 !important; border-radius: 6px; }
@media (max-width: 800px) { .item, .two { grid-template-columns: 1fr; } }
