/* Buyers-first discovery: Find box, search results, private listing teaser and page.
   Uses the colour and spacing tokens at the top of site.css. White page, navy and green only. */

.find-band { padding-block: var(--s5) var(--s4); }
.find-band .find-head { display: flex; align-items: center; justify-content: space-between; gap: var(--s4); margin-bottom: var(--s3); }
.find-band h2 { font-family: var(--display); font-size: var(--fs-h2); line-height: 1.15; color: var(--navy); margin: 0; }
.find-band .find-sub { color: var(--ink-2); font-size: var(--fs-md); margin: var(--s1) 0 0; }

.find-box { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s3); max-width: 760px; }
.find-box *, .find-box { box-sizing: border-box; }
.find-box > * { min-width: 0; }
.find-top { display: grid; grid-template-columns: minmax(104px, 34%) minmax(0, 1fr); gap: var(--s3); align-items: end; }
.find-top label { display: grid; gap: var(--s1); font-size: var(--fs-sm); font-weight: 600; color: var(--ink-2); }
.find-top select, .find-top input { width: 100%; height: 56px; border: 2px solid var(--navy); border-radius: 14px; background-color: #fff; font: inherit; font-size: 1.0625rem; color: var(--ink); padding: 0 var(--s3); outline: 0; }
.find-top select { font-weight: 700; color: var(--navy); appearance: none; -webkit-appearance: none; padding-right: 36px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%2303294e' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; }
.find-top select:focus, .find-top input:focus { box-shadow: 0 0 0 4px rgba(255, 200, 0, .28); }
.find-top input::placeholder { color: var(--ink-3); }
.find-search { display: flex; align-items: center; gap: var(--s2); border: 2px solid var(--navy); border-radius: 14px; background: #fff; padding: 0 var(--s2) 0 var(--s4); min-height: 56px; }
.find-search:focus-within { box-shadow: 0 0 0 4px rgba(255, 200, 0, .28); }
.find-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 1.125rem; color: var(--ink); height: 52px; }
.find-search input::placeholder { color: var(--ink-3); }
.find-go { flex: none; width: 44px; height: 44px; border: 0; border-radius: 10px; background: var(--green); color: var(--navy-deep); display: grid; place-items: center; cursor: pointer; }
.find-go:hover { background: var(--green-dark); }
.find-menus { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s3); }
.find-menus label { display: grid; gap: var(--s1); font-size: var(--fs-sm); font-weight: 600; color: var(--ink-2); }
.find-menus select { width: 100%; height: 52px; border: 2px solid var(--line-strong); border-radius: 12px; background-color: #fff; padding: 0 40px 0 var(--s3); font: inherit; font-size: 1rem; font-weight: 600; color: var(--navy); appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%2303294e' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; }
.find-menus select:focus { outline: 0; border-color: var(--navy); box-shadow: 0 0 0 4px rgba(255, 200, 0, .28); }
.find-menus select:disabled { color: var(--ink-3); background-color: var(--surface-2); }
.find-show { width: 100%; min-height: 52px; font-size: 1.0625rem; }
@media (max-width: 560px) { .find-menus { grid-template-columns: minmax(0, 1fr); } .find-band h2 { font-size: 1.5rem; } }

.private-teaser { display: flex; align-items: center; gap: var(--s3); background: var(--navy); color: #fff; border-radius: 14px; padding: var(--s3) var(--s4); text-decoration: none; max-width: 760px; margin-top: var(--s4); position: relative; overflow: hidden; border: 1px solid var(--navy-soft); }
.private-teaser:hover { background: var(--navy-soft); }
.private-teaser .pt-lock { flex: none; width: 44px; height: 44px; border-radius: 12px; background: rgba(255, 255, 255, .14); display: grid; place-items: center; color: #fff; }
.private-teaser .pt-text { display: grid; gap: 2px; min-width: 0; }
.private-teaser strong { font-size: 1.0625rem; }
.private-teaser .pt-text span { font-size: var(--fs-sm); color: #dbe6f2; line-height: 1.35; }
.private-teaser .pt-go { margin-left: auto; flex: none; color: var(--marker); }

.find-results-hero .find-box { margin-top: var(--s4); }
.find-after { margin-top: var(--s6); }

.private-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: var(--s6); align-items: start; }
.private-cards { display: grid; gap: var(--s4); }
.private-steps { display: grid; gap: var(--s4); }
@media (max-width: 860px) { .private-grid { grid-template-columns: 1fr; } }

/* Lot cards on the boards: the picture fills its column and is never cropped */
.lot-card:not(.feat-card) { grid-template-columns: 116px minmax(0, 1fr); }
.lot-card:not(.feat-card) .lot-pic { align-self: stretch; width: 116px; min-height: 124px; border-right: 1px solid var(--line); background: var(--surface-2); }
.lot-card:not(.feat-card) .lot-pic > span { display: block; width: 100%; height: 100%; min-height: 124px; }
.lot-card:not(.feat-card) .lot-pic img { width: 100%; height: 100%; object-fit: contain; object-position: center; background: var(--surface-2); }
.lot-card .lot-pic img[alt^="Sample"] { background: #fff; padding: 6px 4px 22px; }
.lot-card .lot-pic span[style] > span { font-size: 10px !important; left: 4px !important; bottom: 4px !important; }
.lot-card footer { background: var(--white); }
@media (max-width: 359px) { .lot-card:not(.feat-card) { grid-template-columns: 96px minmax(0, 1fr); } .lot-card:not(.feat-card) .lot-pic { width: 96px; } }
.want-deal { flex-wrap: wrap; }
.want-deal p { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px var(--s2); }
.want-deal .lot-price { font-size: .95rem; }
.want-actions { display: flex; flex-wrap: wrap; gap: var(--s2); }
@media (min-width: 768px) { .want-actions { flex-direction: column; } }

/* Brand images */
.brand-logo { display: block; height: 44px; width: auto; max-width: 56vw; }
.brand-tile-logo { padding: 6px 10px; }
.brand-tile-logo .brand-logo { height: 40px; }
.brand-banner { display: block; width: 100%; height: auto; border-radius: 16px; border: 1px solid var(--line); margin: var(--s4) 0; background: #fff; }
.banner-strip { padding-block: var(--s2) var(--s4); }
.banner-strip .brand-banner { margin: 0 auto; max-width: 760px; }

/* lot-row pictures: never crop, fixed neat box */
.lot-row { align-items: start; }
.lot-row-pic { align-self: start; width: 100%; height: auto; min-height: 0; aspect-ratio: 1 / 1; background: #fff; border-right: 1px solid var(--border, #e3e8ee); display: flex; align-items: center; justify-content: center; }
.lot-row-pic > img, .lot-row-pic > span:not(.lot-row-nopic) { width: 100%; height: 100%; }
.lot-row-pic img { width: 100%; height: 100%; object-fit: contain; background: #fff; display: block; }
.lot-row-pic > span:not(.lot-row-nopic) { display: block; position: relative; }
.lot-row-pic .lot-row-nopic { min-height: 0; height: 100%; }
@media (min-width: 760px) { .lot-row-pic { max-width: 150px; } }