/* Lavori: frase che cerca, 5 filtri, griglia con anteprime e sala di proiezione. */
/* Computer: frase e filtri in una colonna a sinistra che resta ferma, i lavori scorrono a destra */
.lv-corpo{display:grid;grid-template-columns:minmax(300px,31%) 1fr;gap:clamp(30px,4vw,72px);padding:22svh var(--margine) 0}
.lv-lato{position:sticky;top:104px;align-self:start}
.lv-lato h1{font-size:clamp(44px,4.6vw,96px);font-weight:900;line-height:.94;letter-spacing:-.04em}
.lv-cerca{position:relative;display:block;margin-top:.02em;font:900 clamp(44px,4.6vw,96px)/.94 'CULTO Sans',sans-serif;letter-spacing:-.04em;cursor:text}
.lv-cerca input{display:block;width:100%;padding:0;border:0;border-radius:0;background:none;color:var(--rosso);caret-color:var(--rosso);font:inherit;letter-spacing:inherit;outline:none;-webkit-appearance:none;appearance:none}
.lv-cerca input::-webkit-search-cancel-button{display:none}
/* Gli esempi si scrivono da soli, con la linetta che lampeggia; spariscono appena si scrive davvero */
.lv-scrive{position:absolute;left:0;top:0;display:flex;align-items:center;height:100%;color:rgba(0,0,0,.2);white-space:nowrap;pointer-events:none}
.lv-cerca.attiva .lv-scrive{visibility:hidden}
.lv-cursore{display:block;width:.07em;height:.78em;margin-left:.04em;background:var(--rosso);animation:lv-lampeggia 1.05s steps(1) infinite}
@keyframes lv-lampeggia{50%{opacity:0}}

.lv-filtri{display:flex;flex-direction:column;align-items:flex-start;gap:2px;margin-top:6svh}
.lv-filtro{position:relative;padding:.08em .08em;border:0;background:none;color:rgba(0,0,0,.28);font:900 clamp(22px,1.9vw,34px)/1.15 'CULTO Sans',sans-serif;letter-spacing:-.025em;text-align:left;cursor:pointer}
.lv-filtro[aria-pressed=true],.lv-filtro:hover{color:#000}
.lv-filtro .cerchio path{stroke-width:4}
.lv-filtro[aria-pressed=true] .cerchio path{stroke-dashoffset:0;opacity:1}
.lv-conta{min-height:1.4em;margin-top:3svh;color:rgba(0,0,0,.45);font-size:15px;font-variant-numeric:tabular-nums}

.lv-opere{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(22px,2.6vw,44px) clamp(10px,1.2vw,20px)}
.lv-opera{grid-column:span 4;display:block;color:#000}
.lv-opera.lv-cima{grid-column:span 6}
.lv-opera[hidden]{display:none}
.lv-img{position:relative;display:block;aspect-ratio:16/11;overflow:hidden;border-radius:20px;background:#eee}
.lv-img img,.lv-img video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lv-img video{opacity:0;transition:opacity .35s}
.lv-img video.va{opacity:1}
.lv-nome{display:block;margin-top:10px;font-size:clamp(18px,1.4vw,26px);font-weight:900;line-height:1.02;letter-spacing:-.02em}
.lv-cima .lv-nome{font-size:clamp(22px,2vw,36px)}
.lv-riga{display:block;margin-top:4px;color:rgba(0,0,0,.5);font-size:14px;line-height:1.3}
.lv-vuoto p{margin-bottom:18px;font-size:clamp(22px,2.4vw,40px);font-weight:900;letter-spacing:-.02em}
.lv .fine-pagina{margin-top:12svh}

/* Schermi stretti: la frase torna sopra, i filtri in riga */
@media (max-width:1000px){
  .lv-corpo{display:block;padding-top:18svh}
  .lv-lato{position:static}
  .lv-lato h1,.lv-cerca{font-size:clamp(44px,11vw,96px)}
  .lv-filtri{flex-direction:row;flex-wrap:wrap;gap:2px clamp(14px,2vw,26px);margin-top:4svh}
  .lv-conta{margin:2svh 0 4svh}
}

/* La sala: si guarda il lavoro e si passa al prossimo senza uscire */
.sala{position:fixed;inset:0;z-index:200;display:grid;grid-template-rows:auto 1fr auto auto;background:#000;color:#fff;overscroll-behavior:contain}
.sala[hidden]{display:none}
.sala-alto{display:flex;align-items:center;justify-content:space-between;min-height:72px;padding:12px var(--margine)}
.sala-chiudi{display:flex;align-items:center;min-height:44px;padding:0;border:0;background:none;color:#fff;cursor:pointer}
.sala-chiudi .cf{height:30px;width:auto}
.sala-conta{color:rgba(255,255,255,.55);font-size:15px;font-variant-numeric:tabular-nums}
.sala-schermo{position:relative;min-height:0;padding:0 var(--margine)}
.sala-schermo video,.sala-schermo iframe{display:block;width:100%;height:100%;border:0;border-radius:20px;background:#000;object-fit:contain}
.sala-schermo [hidden]{display:none}
.sala-chiudi:focus:not(:focus-visible){outline:none}
.sala-prima,.sala-dopo{position:absolute;top:0;bottom:56px;width:16%;border:0;background:none;cursor:pointer}
.sala-prima{left:0;cursor:w-resize}
.sala-dopo{right:0;cursor:e-resize}
.sala-basso{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:20px var(--margine) 14px}
.sala-testi h2{font-size:clamp(28px,3.6vw,64px);font-weight:900;line-height:1;letter-spacing:-.03em}
.sala-testi p{margin-top:6px;color:rgba(255,255,255,.6);font-size:15px}
.sala-tutto{flex:none;color:#fff}
.sala-tutto .cf{height:34px;width:auto}
.sala-tutto[hidden]{display:none}
.sala-striscia{display:flex;gap:6px;overflow-x:auto;padding:4px var(--margine) 14px;scrollbar-width:none}
.sala-striscia::-webkit-scrollbar{display:none}
.sala-striscia button{flex:none;width:64px;aspect-ratio:16/10;padding:0;border:0;border-radius:8px;background:#222 center/cover no-repeat;opacity:.35;cursor:pointer;transition:opacity .25s}
.sala-striscia button:hover{opacity:.7}
.sala-striscia button[aria-current=true]{opacity:1;outline:2px solid var(--rosso);outline-offset:2px}
body.sala-aperta{overflow:hidden}

@media (max-width:760px){
  .lv-opere{grid-template-columns:1fr 1fr}
  .lv-opera{grid-column:span 1}
  .lv-opera.lv-cima{grid-column:1/-1}
  .lv-nome{font-size:19px}
  .lv-riga{font-size:13px}
  .sala-alto{min-height:60px}
  .sala-schermo{padding:0}
  .sala-schermo video,.sala-schermo iframe{border-radius:0}
  .sala-prima,.sala-dopo{display:none}
  .sala-basso{flex-direction:column;align-items:flex-start;gap:8px}
  .sala-striscia button{width:52px}
}
