/* The Collection — public catalogue pages. Builds on legal.css (palette, type, header, footer). */
.lg-lang.cl-wide { max-width: 1180px; }
.cl-main { padding-top: clamp(32px, 6vw, 64px); }
.cl-head { max-width: 720px; margin: 0 0 clamp(32px, 5vw, 56px); }
.cl-head h1, .cl-info h1 { margin: 0 0 14px; font: 300 clamp(38px, 6vw, 64px)/1.05 var(--serif); letter-spacing: -0.01em; color: #f6efe4; }
.cl-lead { margin: 0; color: var(--mute); font-size: 16.5px; line-height: 1.75; }
.cl-empty { padding: 40px 0 20px; border-top: 1px solid var(--hair); color: var(--mute); max-width: 640px; }

.cl-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: clamp(32px, 4vw, 48px) clamp(18px, 2.4vw, 28px); }
.cl-card a { display: flex; flex-direction: column; gap: 6px; color: inherit; text-decoration: none; }
.cl-card__media { position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; margin-bottom: 10px; background: #160b0e; outline: 1px solid var(--hair); outline-offset: -1px; }
.cl-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1), filter 0.6s; }
.cl-card a:hover .cl-card__media img, .cl-card a:focus-visible .cl-card__media img { transform: scale(1.035); }
.cl-card.is-sold .cl-card__media img { filter: saturate(0.55) brightness(0.78); }
.cl-card__ref { font: 500 11px/1.4 var(--sans); letter-spacing: 0.24em; text-transform: uppercase; color: var(--gold); }
.cl-card__name { font: 400 clamp(21px, 2.2vw, 24px)/1.25 var(--serif); color: #f6efe4; }
.cl-card__meta { font: 400 14px/1.5 var(--sans); color: var(--mute); }
.cl-card__price { font: 400 15px/1.4 var(--sans); color: var(--gold-light); }
.cl-card a:focus-visible { outline: 1px solid var(--gold); outline-offset: 6px; }

.cl-badge { display: inline-block; padding: 7px 12px 6px; font: 500 10.5px/1 var(--sans); letter-spacing: 0.28em; text-transform: uppercase; color: var(--gold-light); background: rgba(11, 9, 9, 0.78); border: 1px solid rgba(201, 163, 95, 0.55); }
.cl-card__media .cl-badge { position: absolute; inset-block-start: 14px; inset-inline-start: 14px; backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.cl-badge--sold { color: #0b0909; background: var(--gold); border-color: var(--gold); }
.cl-info > .cl-badge { margin: 4px 0 18px; }

.cl-back { margin: 0 0 clamp(20px, 3vw, 32px); }
.cl-back a { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: var(--mute); text-decoration: none; font: 400 14px/1 var(--sans); letter-spacing: 0.08em; }
.cl-back a::before { content: "←"; color: var(--gold); }
[dir="rtl"] .cl-back a::before { content: "→"; }
.cl-back a:hover { color: var(--ink); }

.cl-piece { display: grid; gap: clamp(28px, 4vw, 56px); align-items: start; }
@media (min-width: 900px) { .cl-piece { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); } .cl-gallery { position: sticky; top: 24px; } }
.cl-track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; background: #160b0e; outline: 1px solid var(--hair); outline-offset: -1px; }
.cl-track::-webkit-scrollbar { display: none; }
.cl-slide { flex: 0 0 100%; margin: 0; scroll-snap-align: center; aspect-ratio: 4 / 5; display: flex; align-items: center; justify-content: center; }
.cl-slide a { display: block; width: 100%; height: 100%; cursor: zoom-in; }
.cl-slide img { width: 100%; height: 100%; object-fit: contain; display: block; }
.cl-thumbs { display: flex; gap: 10px; margin-top: 12px; overflow-x: auto; scrollbar-width: none; }
.cl-thumbs a { flex: 0 0 64px; height: 80px; outline: 1px solid var(--hair); outline-offset: -1px; opacity: 0.75; transition: opacity 0.3s; }
.cl-thumbs a:hover, .cl-thumbs a:focus-visible { opacity: 1; outline-color: var(--gold); }
.cl-thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }

.cl-info .lg-eyebrow { margin-bottom: 12px; }
.cl-price { margin: 0 0 22px; font: 400 22px/1.3 var(--serif); color: var(--gold-light); }
.cl-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 0; margin: 0 0 26px; border-top: 1px solid var(--hair); }
.cl-facts div { padding: 14px 0; border-bottom: 1px solid var(--hair); }
.cl-facts dt { font: 500 10.5px/1.4 var(--sans); letter-spacing: 0.24em; text-transform: uppercase; color: var(--gold); }
.cl-facts dd { margin: 6px 0 0; color: var(--ink); }
.cl-desc p { margin: 0 0 14px; color: var(--mute); }
.cl-h2 { margin: 28px 0 10px; font: 400 22px/1.3 var(--serif); color: var(--gold-light); }

.cl-enquire { margin-top: 32px; padding-top: 26px; border-top: 1px solid var(--hair); }
.cl-enquire h2 { margin: 0 0 14px; font: 500 11.5px/1.4 var(--sans); letter-spacing: 0.28em; text-transform: uppercase; color: var(--gold); }
.cl-enquire ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.cl-soldnote { margin: 0 0 18px; color: var(--mute); }
.cl-wa { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; padding: 0 18px; border: 1px solid rgba(201, 163, 95, 0.55); color: var(--ink); text-decoration: none; font: 400 16px/1.2 var(--sans); transition: background 0.3s, border-color 0.3s; }
.cl-wa small { font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--mute); }
.cl-wa:hover, .cl-wa:focus-visible { background: rgba(201, 163, 95, 0.12); border-color: var(--gold); }
.cl-wa--solo { display: inline-flex; margin-top: 8px; }
:is(:lang(ar), :lang(ur)) :is(.cl-card__ref, .cl-badge, .cl-facts dt, .cl-enquire h2, .cl-wa small) { letter-spacing: 0; text-transform: none; }

@media (prefers-reduced-motion: reduce) { .cl-card__media img { transition: none; } .cl-card a:hover .cl-card__media img { transform: none; } }