/* Catalogo 3M DI-NOC sfogliabile, dentro IconicDress.
   Copia di assets/css/pagine/catalogo.css di Iconicoriginal/-iconicoriginal-website.
   Qui le due variabili del sito le riempiono i colori e i caratteri di IconicDress,
   e c'e .sr-only, che nell'app non c'era. */
.cv{--color-accent:var(--iconic-gold,#d6b75f);--serif:Manrope,sans-serif}
/* IconicDress veste <header> per la sua testata: alto 70-86px, bianco, con
   ombra e padding suoi. Il componente usa <header class="cv-top"> dentro la
   finestra, e quelle regole gli arrivavano addosso: barra chiara, testo bianco
   su bianco, il select e la x invisibili. Qui gliele si toglie con una
   specificita piu alta. Nei fogli dell'app non si tocca niente. */
.cv .cv-top{height:auto;min-height:0;background:transparent;color:inherit;position:static;z-index:auto;box-shadow:none;padding:.8rem clamp(1rem,2.5vw,2rem);border-bottom:1px solid rgba(255,255,255,.12)}
.cv .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
html.cv-open,html.cv-open body{overflow:hidden}
.cv-host{position:fixed;inset:0;z-index:1000}
.cv{display:flex;flex-direction:column;height:100%;background:#0e0d0c;color:#fff}
.cv-modal{animation:cvIn .35s ease both}
@keyframes cvIn{from{opacity:0}to{opacity:1}}
.cv-top{display:flex;align-items:center;gap:1rem;padding:.8rem clamp(1rem,2.5vw,2rem);border-bottom:1px solid rgba(255,255,255,.12);flex-wrap:wrap}
.cv-title{margin:0 auto 0 0;display:flex;flex-direction:column;line-height:1.2}
.cv-title span{font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;color:var(--color-accent,#ae8963)}
.cv-title b{font:400 clamp(1.1rem,1.6vw,1.5rem) var(--serif,Georgia);letter-spacing:-.02em}
.cv-fam select,.cv-search input{height:2.6rem;box-sizing:border-box;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.22);color:#fff;font:inherit;font-size:.85rem;padding:0 .9rem;border-radius:0}
.cv-fam select{min-width:12rem;cursor:pointer}
.cv-fam option{color:#111}
.cv-search{position:relative}
.cv-search input{width:min(17rem,60vw)}
.cv-fam select:focus,.cv-search input:focus{outline:none;border-color:var(--color-accent,#ae8963)}
.cv-res{position:absolute;right:0;top:calc(100% + .4rem);z-index:5;list-style:none;margin:0;padding:.4rem;width:min(22rem,86vw);max-height:60svh;overflow:auto;background:#1b1a18;border:1px solid rgba(255,255,255,.18);box-shadow:0 1.5rem 3rem rgba(0,0,0,.5)}
.cv-res button{display:flex;justify-content:space-between;width:100%;padding:.6rem .7rem;background:transparent;border:0;color:#fff;font:inherit;font-size:.85rem;cursor:pointer;text-align:left}
.cv-res button:hover{background:rgba(255,255,255,.08);color:var(--color-accent,#ae8963)}
.cv-res span{opacity:.55}
.cv-none{padding:.6rem .7rem;font-size:.85rem;opacity:.6}
.cv-pdf{color:#fff;text-decoration:none;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;border-bottom:1px solid rgba(255,255,255,.35)}
.cv-close{width:2.6rem;height:2.6rem;border:1px solid rgba(255,255,255,.25);background:transparent;color:#fff;font-size:1.4rem;line-height:1;cursor:pointer}
.cv-close:hover,.cv-nav:hover{border-color:var(--color-accent,#ae8963);color:var(--color-accent,#ae8963)}
.cv-stage{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 40%,#2a2724,#0e0d0c 70%)}
.cv-book-wrap{position:relative}
.cv-page{background:#fff;overflow:hidden}
.cv-page img{display:block;width:100%;height:100%;object-fit:cover;user-select:none}
.cv-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:3.2rem;height:3.2rem;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(14,13,12,.6);color:#fff;font-size:1.6rem;line-height:1;cursor:pointer}
.cv-prev{left:clamp(.5rem,2vw,2rem)}.cv-next{right:clamp(.5rem,2vw,2rem)}
.cv-loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;font-size:.85rem;color:rgba(255,255,255,.6)}
.cv-bottom{display:flex;align-items:center;gap:1rem;padding:.7rem clamp(1rem,2.5vw,2rem);border-top:1px solid rgba(255,255,255,.12)}
.cv-bottom input{flex:1;accent-color:var(--color-accent,#ae8963)}
.cv-count{font-size:.8rem;color:rgba(255,255,255,.7);min-width:6.5rem;text-align:right;font-variant-numeric:tabular-nums}
@media(max-width:700px){.cv-title{width:100%}.cv-fam,.cv-fam select{flex:1;min-width:0;width:100%}.cv-search{flex:1}.cv-search input{width:100%}.cv-pdf{display:none}.cv-nav{width:2.6rem;height:2.6rem;font-size:1.3rem;background:rgba(14,13,12,.75)}.cv-top{gap:.6rem}}