/* LV Gioielli - ricerca immersiva a tutto schermo (finestra dalla lente del menu e pagina /ricerca) */
.lv-so { --lv-so-gutter: clamp(16px, 2.2vw, 32px); background: var(--lv-surface); color: var(--lv-ink); }

/* finestra a tutto schermo */
.lv-so--overlay {
  position: fixed; inset: 0; z-index: 60; overflow-y: auto; overscroll-behavior: contain;
  opacity: 0; visibility: hidden; transform: translateY(-8px);
  transition: opacity 400ms var(--lv-ease-snap), transform 500ms var(--lv-ease-snap), visibility 0s linear 400ms;
}
.lv-so--overlay.is-open {
  opacity: 1; visibility: visible; transform: none;
  transition: opacity 400ms var(--lv-ease-snap), transform 500ms var(--lv-ease-snap), visibility 0s;
}
.lv-so__top { display: flex; align-items: center; justify-content: space-between; gap: var(--lv-space-4); padding: var(--lv-space-4) var(--lv-so-gutter) 0; }
.lv-so__top .lv-logo { font-size: 24px; }
.lv-so__close {
  display: inline-flex; align-items: center; gap: var(--lv-space-2); padding: var(--lv-space-2) var(--lv-space-3);
  border: 0; border-radius: var(--lv-radius-xs); background: transparent; color: var(--lv-ink); cursor: pointer;
  font: 600 12px/1 var(--lv-sans); letter-spacing: 0.12em; text-transform: uppercase;
}
.lv-so__close:hover { background: var(--lv-surface-2); }
.lv-so__close .material-symbols-outlined { font-size: 20px; }

/* barra sottile da bordo a bordo */
.lv-so__bar {
  display: flex; align-items: center; gap: var(--lv-space-3); margin: var(--lv-space-3) var(--lv-so-gutter) 0;
  padding: var(--lv-space-3) var(--lv-space-1); border-bottom: 1px solid rgba(30, 30, 28, 0.3);
  transition: border-color 300ms var(--lv-ease);
}
.lv-so__bar:focus-within { border-bottom-color: var(--lv-ink); }
.lv-so__bar > .material-symbols-outlined { font-size: 24px; color: var(--lv-ink); font-variation-settings: "wght" 300; }
.lv-so__input {
  flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; padding: 0;
  font: 500 clamp(18px, 1.6vw, 22px)/1.3 var(--lv-sans); letter-spacing: 0.02em; text-transform: none; color: var(--lv-ink);
}
.lv-so__input::placeholder { color: #7A746B; opacity: 1; }
.lv-so__input::-webkit-search-cancel-button { display: none; }
.lv-so__clear {
  width: 36px; height: 36px; border: 0; border-radius: var(--lv-radius-pill); background: var(--lv-surface-2); color: var(--lv-ink);
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
}
.lv-so__clear .material-symbols-outlined { font-size: 18px; }

.lv-so__chips { display: flex; align-items: center; gap: var(--lv-space-2); overflow-x: auto; scrollbar-width: none; padding: var(--lv-space-4) var(--lv-so-gutter) 2px; }
.lv-so__chips::-webkit-scrollbar { display: none; }
.lv-so__chips .lv-tone { padding: 8px 14px; font-size: 13px; }
.lv-so__chips-label { flex: none; margin-right: var(--lv-space-1); font: 500 13px/1 var(--lv-sans); color: var(--lv-muted); }

.lv-so__title {
  margin: var(--lv-space-6) 0 var(--lv-space-5); text-align: center;
  font-family: var(--lv-serif); font-weight: 500; font-size: clamp(26px, 2.6vw, 34px); line-height: 1.1; letter-spacing: 0.01em;
}
.lv-so__count { margin: var(--lv-space-5) var(--lv-so-gutter) var(--lv-space-4); font: 500 var(--lv-text-sm)/1 var(--lv-sans); color: var(--lv-muted); }
.lv-so__count:empty { display: none; }

/* griglia da bordo a bordo, senza spazi né angoli arrotondati */
.lv-so__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; }
@media (min-width: 768px) { .lv-so__grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1100px) { .lv-so__grid { grid-template-columns: repeat(5, 1fr); } }
.lv-so__card { display: grid; align-content: start; text-decoration: none; color: inherit; padding-bottom: var(--lv-space-5); }
.lv-so__img { display: block; aspect-ratio: 3 / 4; overflow: hidden; background: #e9e5dc; }
.lv-so__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 900ms var(--lv-ease); }
.lv-so__card:hover .lv-so__img img { transform: scale(1.03); }
.lv-so__meta { display: grid; gap: 4px; padding: var(--lv-space-3) var(--lv-space-3) 0; }
.lv-so__kind { font: 500 11px/1.3 var(--lv-sans); letter-spacing: 0.06em; text-transform: uppercase; color: var(--lv-muted); }
.lv-so__name { font-family: var(--lv-serif); font-weight: 600; font-size: 19px; line-height: 1.2; }
.lv-so__card:hover .lv-so__name { color: var(--lv-gold-ink); }
.lv-so__code { font: 500 11.5px/1 var(--lv-sans); letter-spacing: 0.06em; color: var(--lv-muted); }
.lv-so__empty { margin: 0; padding: var(--lv-space-7) var(--lv-so-gutter); text-align: center; color: var(--lv-muted); }

/* versione pagina: stessa esperienza, sotto l'header del sito */
.lv-so--page { padding-top: var(--lv-space-2); }

@media (prefers-reduced-motion: reduce) {
  .lv-so--overlay, .lv-so--overlay.is-open { transition: none; transform: none; }
}