/* ============================================================
   BELLERRIMO — L'ago nel pagliaio
   Modernariato & Vintage · Monza
   Design system art déco: seppia profondo, oro, senape, avorio
   ============================================================ */

:root{
  --avorio:      #f4eee0;
  --avorio-2:    #ede5d2;
  --carta:       #fbf8ef;
  --seppia:      #221a0d;
  --seppia-2:    #2e2413;
  --seppia-3:    #3a2f1b;
  --seppia-soft: #5a4d33;
  --oro:         #c9a227;
  --oro-chiaro:  #e3c563;
  --oro-scuro:   #a8861d;
  --senape:      #eec52f;
  --arancio:     #e07b39;
  --grigio:      #7a7060;
  --linea:       rgba(34,26,13,.14);
  --linea-oro:   rgba(201,162,39,.45);
  --ombra:       0 24px 60px -22px rgba(34,26,13,.35);
  --font-serif:  "Cormorant Garamond", Georgia, serif;
  --font-sans:   "Jost", "Century Gothic", Verdana, sans-serif;
  --font-script: "Pinyon Script", cursive;
  --maxw: 1240px;
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }

body{
  font-family:var(--font-sans);
  font-size:17px; line-height:1.7;
  color:var(--seppia-3);
  background:var(--avorio);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

/* grana carta sulle sezioni chiare */
body::before{
  content:""; position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0.16 0 0 0 0 0.12 0 0 0 0 0.05 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
::selection{ background:var(--senape); color:var(--seppia); }

.container{ max-width:var(--maxw); margin:0 auto; padding:0 28px; position:relative; z-index:2; }

/* ---------- tipografia ---------- */
h1,h2,h3,.serif{ font-family:var(--font-serif); font-weight:600; line-height:1.08; color:var(--seppia); }
h1{ font-size:clamp(2.6rem,6vw,5rem); letter-spacing:-.01em; }
h2{ font-size:clamp(2rem,4.2vw,3.4rem); }
h3{ font-size:1.5rem; }
em.oro{ font-style:italic; color:var(--oro-scuro); }
.script{ font-family:var(--font-script); font-weight:400; color:var(--oro-scuro); font-size:clamp(1.6rem,2.6vw,2.3rem); line-height:1; display:block; }

.eyebrow{
  display:inline-flex; align-items:center; gap:1rem;
  font-size:.74rem; letter-spacing:.4em; text-transform:uppercase;
  color:var(--oro-scuro); font-weight:500; white-space:nowrap;
}
.eyebrow::before,.eyebrow::after{
  content:""; width:38px; height:1px; background:var(--linea-oro); flex:none;
}
.lead{ font-size:1.14rem; color:var(--seppia-soft); font-weight:300; }

/* ---------- ornamento déco ---------- */
.rombo{ color:var(--oro); font-size:.8rem; letter-spacing:.6em; text-align:center; display:block; }
.filo-oro{ width:70px; height:1px; background:linear-gradient(90deg,transparent,var(--oro),transparent); margin:1.6rem auto 0; position:relative; }
.filo-oro::after{ content:"◆"; position:absolute; top:-9px; left:50%; transform:translateX(-50%); color:var(--oro); font-size:.55rem; }

/* ---------- bottoni ---------- */
.btn{
  position:relative; display:inline-block; padding:1rem 2.6rem;
  font-family:var(--font-sans); font-size:.78rem; font-weight:500;
  letter-spacing:.28em; text-transform:uppercase;
  border:1px solid var(--seppia); color:var(--seppia);
  background:transparent; cursor:pointer; overflow:hidden;
  transition:color .35s ease, border-color .35s ease;
  z-index:1;
}
.btn::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:var(--seppia); transform:scaleX(0); transform-origin:right;
  transition:transform .35s cubic-bezier(.65,0,.35,1);
}
.btn:hover{ color:var(--senape); }
.btn:hover::before{ transform:scaleX(1); transform-origin:left; }

.btn-oro{ background:var(--seppia); color:var(--senape); border-color:var(--seppia); }
.btn-oro::before{ background:var(--oro-scuro); }
.btn-oro:hover{ color:var(--carta); border-color:var(--oro-scuro); }

.btn-chiaro{ border-color:var(--oro-chiaro); color:var(--oro-chiaro); }
.btn-chiaro::before{ background:var(--senape); }
.btn-chiaro:hover{ color:var(--seppia); border-color:var(--senape); }

/* ---------- topbar + header ---------- */
.topbar{
  background:var(--seppia); color:#cfc4a8;
  font-size:.74rem; letter-spacing:.18em; text-align:center;
  padding:.55rem 1rem; position:relative; z-index:101;
  border-bottom:1px solid rgba(201,162,39,.25);
}
.topbar a{ color:var(--senape); }

header.site{
  position:sticky; top:0; z-index:100;
  background:rgba(244,238,224,.92); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--linea);
  transition:box-shadow .3s;
}
header.site.scrolled{ box-shadow:0 10px 30px -18px rgba(34,26,13,.35); }
.nav{
  max-width:var(--maxw); margin:0 auto; padding:.7rem 28px;
  display:flex; align-items:center; justify-content:space-between; gap:1.2rem;
}
.nav .logo img{ height:66px; width:auto; transition:height .3s; }
header.site.scrolled .logo img{ height:54px; }

.nav-links{ display:flex; align-items:center; gap:2.4rem; list-style:none; }
.nav-links a{
  position:relative; font-size:.78rem; letter-spacing:.26em; text-transform:uppercase; font-weight:500;
  padding:.4rem 0; color:var(--seppia-3);
}
.nav-links a::after{
  content:""; position:absolute; left:0; bottom:0; height:1px; width:100%;
  background:var(--oro); transform:scaleX(0); transform-origin:right;
  transition:transform .3s ease;
}
.nav-links a:hover::after,.nav-links a.attivo::after{ transform:scaleX(1); transform-origin:left; }
.nav-links a.attivo{ color:var(--oro-scuro); }

.lang-switch{ display:flex; border:1px solid var(--linea); overflow:hidden; }
.lang-switch button{
  border:0; background:transparent; cursor:pointer;
  font-family:var(--font-sans); font-size:.7rem; font-weight:600; letter-spacing:.12em;
  padding:.4rem .7rem; color:var(--grigio); transition:all .25s;
}
.lang-switch button.attivo{ background:var(--seppia); color:var(--senape); }

.hamburger{ display:none; border:0; background:none; cursor:pointer; font-size:1.8rem; color:var(--seppia); line-height:1; }

/* ---------- HERO ---------- */
.hero{
  position:relative; overflow:hidden;
  background:radial-gradient(120% 130% at 78% 30%, #4a3b1c 0%, var(--seppia-2) 42%, var(--seppia) 100%);
  color:#e9dfc6;
}
.hero .raggiera{
  position:absolute; inset:0; pointer-events:none; opacity:.5;
}
.hero-inner{
  position:relative; z-index:2;
  max-width:var(--maxw); margin:0 auto; padding:6.5rem 28px 7rem;
  display:grid; grid-template-columns:1.12fr .88fr; gap:4rem; align-items:center;
  min-height:min(88vh, 860px);
}
.hero .script{ color:var(--oro-chiaro); margin-bottom:.6rem; }
.hero h1{ color:var(--carta); margin:.4rem 0 1.6rem; }
.hero h1 em{ font-style:italic; color:var(--senape); }
.hero p{ max-width:33rem; font-size:1.14rem; font-weight:300; color:#cfc2a2; margin-bottom:2.6rem; }
.hero-azioni{ display:flex; flex-wrap:wrap; gap:1.1rem; }

.hero-figura{ position:relative; justify-self:center; width:min(100%,440px); }
.hero-figura .cornice{
  position:relative; padding:14px; background:transparent;
  border:1px solid var(--linea-oro);
}
.hero-figura .cornice::before{
  content:""; position:absolute; inset:6px; border:1px solid rgba(201,162,39,.28); pointer-events:none;
}
.hero-figura img{
  width:100%; box-shadow:0 40px 80px -30px rgba(0,0,0,.7);
  transition:transform .5s ease;
}
.hero-figura .angolo{
  position:absolute; width:26px; height:26px; border-color:var(--oro); border-style:solid; z-index:3;
}
.hero-figura .angolo.tl{ top:-7px; left:-7px; border-width:2px 0 0 2px; }
.hero-figura .angolo.tr{ top:-7px; right:-7px; border-width:2px 2px 0 0; }
.hero-figura .angolo.bl{ bottom:-7px; left:-7px; border-width:0 0 2px 2px; }
.hero-figura .angolo.br{ bottom:-7px; right:-7px; border-width:0 2px 2px 0; }

.hero-etichetta{
  position:absolute; bottom:-26px; left:50%; transform:translateX(-50%);
  background:var(--senape); color:var(--seppia); white-space:nowrap;
  font-size:.68rem; letter-spacing:.34em; text-transform:uppercase; font-weight:600;
  padding:.55rem 1.6rem; box-shadow:0 14px 30px -12px rgba(0,0,0,.5);
}

.hero-scroll{
  position:absolute; bottom:2rem; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:.5rem; z-index:2;
  color:rgba(233,223,198,.55); font-size:.62rem; letter-spacing:.4em; text-transform:uppercase;
}
.hero-scroll::after{
  content:""; width:1px; height:44px; background:linear-gradient(var(--oro), transparent);
  animation:scorri 2.2s ease-in-out infinite;
}
@keyframes scorri{ 0%,100%{ transform:scaleY(.4); opacity:.4 } 50%{ transform:scaleY(1); opacity:1 } }

/* ---------- MARQUEE ---------- */
.marquee{
  background:var(--senape); color:var(--seppia); overflow:hidden; position:relative; z-index:2;
  border-top:1px solid var(--seppia); border-bottom:1px solid var(--seppia);
  padding:.85rem 0;
}
.marquee-track{
  display:flex; gap:3.2rem; width:max-content;
  animation:marquee 36s linear infinite;
  font-family:var(--font-serif); font-size:1.15rem; font-style:italic;
  letter-spacing:.12em; text-transform:uppercase; white-space:nowrap;
}
.marquee-track span::after{ content:"◆"; margin-left:3.2rem; font-size:.55rem; vertical-align:middle; color:var(--seppia-3); }
@keyframes marquee{ to{ transform:translateX(-50%); } }

/* ---------- NUMERI ---------- */
.numeri{
  background:var(--avorio-2); border-bottom:1px solid var(--linea);
}
.numeri-grid{
  display:grid; grid-template-columns:repeat(4,1fr);
}
.numero{
  text-align:center; padding:3.2rem 1.4rem; position:relative;
}
.numero + .numero::before{
  content:""; position:absolute; left:0; top:26%; bottom:26%; width:1px;
  background:linear-gradient(transparent,var(--linea-oro),transparent);
}
.numero .cifra{
  font-family:var(--font-serif); font-size:clamp(2.6rem,4.4vw,3.8rem); font-weight:600; color:var(--seppia);
  line-height:1;
}
.numero .cifra sup{ color:var(--oro-scuro); font-size:.5em; }
.numero .etichetta{
  margin-top:.7rem; font-size:.7rem; letter-spacing:.3em; text-transform:uppercase; color:var(--grigio);
}

/* ---------- sezioni ---------- */
section{ padding:6.5rem 0; position:relative; z-index:2; }
.sezione-testa{ text-align:center; max-width:50rem; margin:0 auto 4rem; }
.sezione-testa h2{ margin:1rem 0 1.1rem; }
.sezione-testa .script{ margin-bottom:.2rem; }

/* ---------- CAPITOLI (valori / chi siamo) ---------- */
.capitoli{ counter-reset:cap; max-width:60rem; margin:0 auto; }
.capitolo{
  display:grid; grid-template-columns:110px 1fr; gap:2.4rem; align-items:start;
  padding:3rem 0; border-top:1px solid var(--linea); position:relative;
}
.capitolo:last-child{ border-bottom:1px solid var(--linea); }
.capitolo .num{
  font-family:var(--font-serif); font-style:italic; font-size:3.6rem; color:var(--oro);
  line-height:1; position:relative; top:-6px;
}
.capitolo h3{ font-size:1.85rem; margin-bottom:.7rem; }
.capitolo p{ color:var(--seppia-soft); max-width:44rem; }
.capitolo .eyebrow{ margin-bottom:.6rem; }
.capitolo .eyebrow::before{ display:none; }

/* ---------- CATEGORIE ---------- */
.categorie-grid{
  display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:270px; gap:1.4rem;
}
.cat-card{
  position:relative; overflow:hidden; grid-column:span 2; cursor:pointer;
  border:1px solid var(--linea);
}
.cat-card.larga{ grid-column:span 3; }
.cat-card img{
  width:100%; height:100%; object-fit:cover;
  transition:transform .7s cubic-bezier(.25,.46,.45,.94), filter .7s;
  filter:saturate(.92);
}
.cat-card:hover img{ transform:scale(1.07); filter:saturate(1.05); }
.cat-card::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(185deg, rgba(34,26,13,0) 40%, rgba(34,26,13,.82) 100%);
  transition:background .4s;
}
.cat-card:hover::after{ background:linear-gradient(185deg, rgba(34,26,13,.08) 30%, rgba(34,26,13,.9) 100%); }
.cat-card .cat-info{
  position:absolute; left:1.6rem; right:1.6rem; bottom:1.3rem; z-index:2; color:var(--carta);
  display:flex; align-items:flex-end; justify-content:space-between; gap:1rem;
}
.cat-card .cat-info h3{ color:var(--carta); font-size:1.6rem; font-style:italic; }
.cat-card .cat-info small{
  font-size:.66rem; letter-spacing:.3em; text-transform:uppercase; color:var(--oro-chiaro); display:block; margin-top:.2rem;
}
.cat-card .freccia{
  width:40px; height:40px; border:1px solid var(--linea-oro); border-radius:50%;
  display:grid; place-items:center; color:var(--senape); flex:none;
  transition:background .3s, transform .3s;
}
.cat-card:hover .freccia{ background:var(--senape); color:var(--seppia); transform:rotate(-45deg); }

/* ---------- EVIDENZA (spotlight + griglia) ---------- */
.evidenza-grid{
  display:grid; grid-template-columns:1.05fr 1fr; gap:1.6rem; align-items:stretch;
}
.spotlight{
  position:relative; overflow:hidden; cursor:pointer; border:1px solid var(--linea); min-height:560px;
  background:var(--carta);
}
.spotlight img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform .8s cubic-bezier(.25,.46,.45,.94);
}
.spotlight:hover img{ transform:scale(1.05); }
.spotlight::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(200deg, rgba(34,26,13,0) 45%, rgba(34,26,13,.88) 100%);
}
.spotlight .sp-info{
  position:absolute; left:2rem; right:2rem; bottom:1.8rem; z-index:2; color:var(--carta);
}
.spotlight .sp-info h3{ color:var(--carta); font-size:1.9rem; font-style:italic; margin:.3rem 0 .4rem; }
.spotlight .sp-info .prezzo{ color:var(--senape); font-size:.86rem; letter-spacing:.18em; font-weight:600; text-transform:uppercase; }

.mini-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:1.6rem;
}

/* ---------- schede prodotto ---------- */
.griglia{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(255px,1fr)); gap:1.7rem;
}
.scheda{
  background:var(--carta); border:1px solid var(--linea);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s;
  cursor:pointer; position:relative;
}
.scheda:hover{ transform:translateY(-6px); box-shadow:var(--ombra); border-color:var(--linea-oro); }
.scheda .foto{ aspect-ratio:1/1; overflow:hidden; background:var(--avorio-2); position:relative; }
.scheda .foto img{
  width:100%; height:100%; object-fit:cover;
  transition:transform .6s cubic-bezier(.25,.46,.45,.94);
}
.scheda:hover .foto img{ transform:scale(1.06); }
.scheda .foto::after{
  content:""; position:absolute; inset:0; background:rgba(201,162,39,.14); opacity:0; transition:opacity .4s;
}
.scheda:hover .foto::after{ opacity:1; }
.scheda .info{ padding:1.15rem 1.25rem 1.35rem; border-top:1px solid var(--linea); }
.scheda .info h3{ font-size:1.14rem; line-height:1.3; margin-bottom:.5rem; font-weight:600; }
.scheda .prezzo{ font-size:.8rem; letter-spacing:.14em; color:var(--oro-scuro); font-weight:600; text-transform:uppercase; }
.badge{
  position:absolute; top:.9rem; left:.9rem; z-index:2;
  font-size:.62rem; letter-spacing:.24em; text-transform:uppercase; font-weight:600;
  padding:.32rem .8rem; background:var(--senape); color:var(--seppia);
}
.badge.venduto{ background:rgba(34,26,13,.82); color:#d8cdb2; }

/* ---------- QUOTE ---------- */
.quote{
  background:var(--avorio-2); text-align:center; position:relative; overflow:hidden;
}
.quote .virgolette{
  font-family:var(--font-serif); font-size:9rem; line-height:.4; color:var(--oro); opacity:.5; display:block; margin-bottom:1.4rem;
}
.quote blockquote{
  font-family:var(--font-serif); font-style:italic; font-weight:500;
  font-size:clamp(1.7rem,3.4vw,2.7rem); line-height:1.35; color:var(--seppia);
  max-width:52rem; margin:0 auto;
}
.quote cite{
  display:block; margin-top:2rem; font-family:var(--font-sans); font-style:normal;
  font-size:.72rem; letter-spacing:.4em; text-transform:uppercase; color:var(--oro-scuro);
}

/* ---------- FASCIA SCURA ---------- */
.fascia{
  background:radial-gradient(90% 140% at 50% -20%, #4a3b1c 0%, var(--seppia) 70%);
  color:#d8cdb2; text-align:center; position:relative; overflow:hidden;
}
.fascia h2{ color:var(--carta); margin:1rem 0 1.2rem; }
.fascia h2 em{ color:var(--senape); font-style:italic; }
.fascia .script{ color:var(--oro-chiaro); }
.fascia p{ max-width:40rem; margin:0 auto 2.4rem; font-weight:300; }
.fascia .raggiera{ position:absolute; inset:0; opacity:.35; pointer-events:none; }

/* ---------- PUNTO DI RITIRO ---------- */
.ritiro-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center;
}
.cornice-doppia{
  position:relative; padding:16px; border:1px solid var(--linea-oro);
}
.cornice-doppia::before{ content:""; position:absolute; inset:7px; border:1px solid var(--linea); pointer-events:none; z-index:2; }
.cornice-doppia img,.cornice-doppia iframe{ width:100%; display:block; }
.info-orari{ list-style:none; margin:1.8rem 0 2.2rem; display:grid; gap:.9rem; }
.info-orari li{
  display:flex; justify-content:space-between; gap:2rem; padding-bottom:.9rem;
  border-bottom:1px dashed var(--linea); font-size:.98rem; color:var(--seppia-soft);
}
.info-orari li strong{ color:var(--seppia); font-weight:500; letter-spacing:.08em; }

/* ---------- filtri collezione ---------- */
.filtri{
  display:flex; flex-wrap:wrap; justify-content:center; gap:0; margin-bottom:1.2rem;
  border-top:1px solid var(--linea); border-bottom:1px solid var(--linea);
}
.filtri button{
  position:relative; font-family:var(--font-sans); font-size:.74rem; letter-spacing:.22em; text-transform:uppercase;
  padding:1.05rem 1.5rem; border:0; background:transparent;
  color:var(--seppia-soft); cursor:pointer; transition:color .25s;
}
.filtri button::after{
  content:""; position:absolute; left:20%; right:20%; bottom:-1px; height:2px;
  background:var(--oro); transform:scaleX(0); transition:transform .3s;
}
.filtri button:hover{ color:var(--seppia); }
.filtri button.attivo{ color:var(--seppia); font-weight:600; }
.filtri button.attivo::after{ transform:scaleX(1); }

.filtri-riga{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:2.8rem;
  font-size:.8rem; letter-spacing:.12em; color:var(--grigio);
}
.filtro-check{ display:flex; align-items:center; gap:.55rem; cursor:pointer; }
.filtro-check input{ accent-color:var(--oro-scuro); width:1rem; height:1rem; }
#conteggio{ font-style:italic; font-family:var(--font-serif); font-size:1.05rem; }

/* ---------- blocchi chi siamo ---------- */
.blocco{
  display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center;
  padding:4rem 0;
}
.blocco + .blocco{ border-top:1px solid var(--linea); }
.blocco:nth-child(even) .blocco-foto{ order:2; }
.blocco h3{ font-size:2.1rem; margin:.8rem 0 1rem; }
.blocco h3 em{ color:var(--oro-scuro); font-style:italic; }
.blocco p{ color:var(--seppia-soft); }
.blocco .num-cap{
  font-family:var(--font-serif); font-style:italic; font-size:1.1rem; color:var(--oro-scuro); letter-spacing:.2em;
}

/* drop cap */
.dropcap::first-letter{
  font-family:var(--font-serif); font-size:3.4em; float:left; line-height:.82;
  padding:.06em .12em 0 0; color:var(--oro-scuro);
}

/* ---------- contatti ---------- */
.contatti-grid{ display:grid; grid-template-columns:.92fr 1.08fr; gap:4rem; align-items:start; }
.info-lista{ list-style:none; display:grid; gap:1.5rem; margin-top:2rem; }
.info-lista li{ padding-left:1.8rem; position:relative; color:var(--seppia-soft); }
.info-lista li::before{ content:"◆"; position:absolute; left:0; top:.45rem; color:var(--oro); font-size:.5rem; }
.info-lista strong{ color:var(--seppia); display:block; font-size:.72rem; letter-spacing:.3em; text-transform:uppercase; margin-bottom:.2rem; }
.info-lista a{ color:var(--oro-scuro); border-bottom:1px solid transparent; transition:border-color .25s; }
.info-lista a:hover{ border-bottom-color:var(--oro-scuro); }

form.contatto{
  background:var(--carta); border:1px solid var(--linea); padding:2.8rem; display:grid; gap:1.3rem;
  position:relative;
}
form.contatto::before{
  content:""; position:absolute; inset:8px; border:1px solid var(--linea-oro); pointer-events:none;
}
form.contatto > *{ position:relative; z-index:2; }
form.contatto label{ font-size:.72rem; letter-spacing:.26em; text-transform:uppercase; font-weight:600; color:var(--seppia); }
form.contatto input, form.contatto textarea{
  width:100%; padding:.8rem .2rem; margin-top:.2rem;
  font-family:var(--font-sans); font-size:1rem; color:var(--seppia);
  border:0; border-bottom:1px solid var(--linea); background:transparent; outline:none;
  transition:border-color .3s;
}
form.contatto input:focus, form.contatto textarea:focus{ border-bottom-color:var(--oro); }
form.contatto textarea{ min-height:120px; resize:vertical; }

/* ---------- footer ---------- */
footer.site{
  background:var(--seppia); color:#b9ad8f; padding:0; font-size:.94rem; position:relative; z-index:2;
}
.footer-mega{
  text-align:center; padding:4.5rem 28px 3rem; border-bottom:1px solid rgba(201,162,39,.2);
}
.footer-mega .wordmark{
  font-family:var(--font-serif); font-style:italic; font-weight:600;
  font-size:clamp(3rem,9vw,6.5rem); color:var(--carta); line-height:1;
}
.footer-mega .payoff{
  margin-top:.8rem; font-size:.72rem; letter-spacing:.5em; text-transform:uppercase; color:var(--oro);
}
.footer-grid{
  display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:2.6rem;
  padding:3.4rem 0 2.6rem;
}
footer.site h4{
  font-family:var(--font-sans); font-size:.7rem; letter-spacing:.32em; text-transform:uppercase;
  color:var(--senape); margin-bottom:1.1rem; font-weight:600;
}
footer.site ul{ list-style:none; display:grid; gap:.5rem; }
footer.site a{ transition:color .25s; }
footer.site a:hover{ color:var(--senape); }
.footer-bottom{
  border-top:1px solid rgba(201,162,39,.2); padding:1.5rem 0 2rem;
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem; font-size:.78rem; letter-spacing:.08em;
}

/* ---------- lightbox ---------- */
.lightbox{
  position:fixed; inset:0; z-index:300; display:none;
  background:rgba(18,13,4,.93); align-items:center; justify-content:center; padding:2rem;
}
.lightbox.aperto{ display:flex; }
.lightbox figure{ max-width:min(90vw,780px); text-align:center; position:relative; }
.lightbox img{ max-height:72vh; margin:0 auto; border:1px solid var(--linea-oro); padding:10px; }
.lightbox figcaption{ color:var(--carta); font-family:var(--font-serif); font-style:italic; font-size:1.5rem; margin-top:1.2rem; }
.lightbox .lb-prezzo{ color:var(--senape); font-size:.8rem; letter-spacing:.3em; text-transform:uppercase; margin-top:.3rem; }
.lightbox .chiudi{
  position:absolute; top:1.2rem; right:1.6rem; border:0; background:none; cursor:pointer;
  color:var(--carta); font-size:2.4rem; line-height:1; z-index:2;
}
.lightbox .lb-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:52px; height:52px; border:1px solid var(--linea-oro); border-radius:50%;
  background:none; color:var(--carta); font-size:1.4rem; cursor:pointer;
  display:grid; place-items:center; transition:background .3s, color .3s;
}
.lightbox .lb-nav:hover{ background:var(--senape); color:var(--seppia); border-color:var(--senape); }
.lightbox .lb-prev{ left:1.2rem; }
.lightbox .lb-next{ right:1.2rem; }

/* ---------- reveal ---------- */
.reveal{ opacity:0; transform:translateY(34px); transition:opacity .8s cubic-bezier(.25,.46,.45,.94), transform .8s cubic-bezier(.25,.46,.45,.94); }
.reveal.visibile{ opacity:1; transform:none; }

/* ---------- intestazione pagine interne ---------- */
.pagina-testa{
  position:relative; overflow:hidden; text-align:center;
  background:radial-gradient(110% 160% at 50% -30%, #4a3b1c 0%, var(--seppia) 75%);
  color:#d8cdb2; padding:5.2rem 28px 5.6rem;
}
.pagina-testa .raggiera{ position:absolute; inset:0; opacity:.4; pointer-events:none; }
.pagina-testa h1{ color:var(--carta); margin-top:.6rem; position:relative; z-index:2; }
.pagina-testa h1 em{ color:var(--senape); font-style:italic; }
.pagina-testa .script{ color:var(--oro-chiaro); position:relative; z-index:2; }
.pagina-testa .lead{ position:relative; z-index:2; color:#cfc2a2; max-width:44rem; margin:1.2rem auto 0; }

/* ---------- responsive ---------- */
@media (max-width: 1020px){
  .hero-inner{ grid-template-columns:1fr; padding:4.5rem 28px 6rem; gap:3.4rem; min-height:0; }
  .hero-figura{ width:min(100%,380px); }
  .numeri-grid{ grid-template-columns:1fr 1fr; }
  .numero:nth-child(3)::before{ display:none; }
  .categorie-grid{ grid-template-columns:1fr 1fr; grid-auto-rows:240px; }
  .cat-card,.cat-card.larga{ grid-column:span 1; }
  .evidenza-grid{ grid-template-columns:1fr; }
  .spotlight{ min-height:420px; }
  .blocco,.ritiro-grid{ grid-template-columns:1fr; gap:2.2rem; }
  .blocco:nth-child(even) .blocco-foto{ order:0; }
  .contatti-grid{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .capitolo{ grid-template-columns:70px 1fr; gap:1.4rem; }
}
@media (max-width: 820px){
  .nav-links{
    display:none; position:absolute; top:100%; left:0; right:0;
    background:var(--avorio); border-bottom:1px solid var(--linea);
    flex-direction:column; padding:1.6rem 28px; gap:1.2rem;
  }
  .nav-links.aperto{ display:flex; }
  .hamburger{ display:block; }
  section{ padding:4.5rem 0; }
}
@media (max-width: 560px){
  .footer-grid{ grid-template-columns:1fr; }
  .nav .logo img{ height:52px; }
  .categorie-grid{ grid-template-columns:1fr; }
  .mini-grid{ grid-template-columns:1fr; }
  .numeri-grid{ grid-template-columns:1fr 1fr; }
  .lightbox .lb-prev{ left:.3rem; }
  .lightbox .lb-next{ right:.3rem; }
}

/* riduzione movimento */
@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; }
  .reveal{ opacity:1; transform:none; }
}

/* ============================================================
   LIVELLO 3 — bot "Ago", preloader, epoche, entrances
   ============================================================ */

/* ---------- entrata hero ---------- */
@keyframes salita{ from{ opacity:0; transform:translateY(36px); } to{ opacity:1; transform:none; } }
.hero .script,
.hero h1,
.hero p,
.hero-azioni{ opacity:0; animation:salita .9s cubic-bezier(.22,1,.36,1) forwards; }
.hero .script{ animation-delay:.15s; }
.hero h1{ animation-delay:.3s; }
.hero p{ animation-delay:.5s; }
.hero-azioni{ animation-delay:.68s; }
.hero-figura{ opacity:0; animation:salita 1.1s cubic-bezier(.22,1,.36,1) .45s forwards; }
.hero-figura .cornice{ will-change:transform; transition:transform .2s ease-out; }

/* ---------- preloader ---------- */
#preloader{
  position:fixed; inset:0; z-index:999; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:1rem;
  background:var(--seppia); transition:opacity .6s ease, visibility .6s;
}
#preloader .pre-nome{
  font-family:var(--font-script); font-size:clamp(3rem,8vw,5rem); color:var(--carta);
  opacity:0; animation:salita 1s ease .1s forwards;
}
#preloader .pre-filo{
  width:0; height:1px; background:var(--oro); animation:filo 1.1s ease .4s forwards;
}
@keyframes filo{ to{ width:150px; } }
#preloader.via{ opacity:0; visibility:hidden; }

/* ---------- timeline epoche ---------- */
.epoche{ background:var(--avorio-2); }
.epoche-track{
  display:grid; grid-template-columns:repeat(5,1fr); gap:0; position:relative; margin-top:1rem;
}
.epoche-track::before{
  content:""; position:absolute; left:4%; right:4%; top:11px; height:1px;
  background:linear-gradient(90deg,transparent,var(--linea-oro) 12%,var(--linea-oro) 88%,transparent);
}
.epoca{ text-align:center; padding:0 1.1rem; position:relative; }
.epoca .nodo{
  width:23px; height:23px; margin:0 auto 1.1rem; position:relative; z-index:2;
  background:var(--avorio-2); border:1px solid var(--oro); transform:rotate(45deg);
  transition:background .3s, transform .3s;
}
.epoca:hover .nodo{ background:var(--senape); transform:rotate(225deg); }
.epoca .anni{
  font-family:var(--font-serif); font-style:italic; font-size:1.05rem; color:var(--oro-scuro);
}
.epoca h3{ font-size:1.28rem; margin:.3rem 0 .5rem; }
.epoca p{ font-size:.9rem; color:var(--seppia-soft); line-height:1.55; }

/* ---------- back to top ---------- */
#torna-su{
  position:fixed; bottom:2rem; left:2rem; z-index:90;
  width:48px; height:48px; border-radius:50%;
  border:1px solid var(--linea-oro); background:rgba(244,238,224,.92); color:var(--seppia);
  cursor:pointer; font-size:1.1rem; display:grid; place-items:center;
  opacity:0; visibility:hidden; transform:translateY(12px);
  transition:all .35s ease; backdrop-filter:blur(6px);
}
#torna-su.visibile{ opacity:1; visibility:visible; transform:none; }
#torna-su:hover{ background:var(--seppia); color:var(--senape); }

/* ---------- BOT “Ago” ---------- */
#ago-bot{ position:fixed; bottom:2rem; right:2rem; z-index:250; font-family:var(--font-sans); }

.ago-toggle{
  display:flex; align-items:center; gap:.7rem;
  background:var(--seppia); color:var(--senape); border:1px solid var(--oro);
  padding:.85rem 1.5rem .85rem 1.1rem; border-radius:999px; cursor:pointer;
  box-shadow:0 18px 44px -14px rgba(34,26,13,.55);
  transition:transform .3s ease, background .3s;
}
.ago-toggle:hover{ transform:translateY(-3px); background:var(--seppia-2); }
.ago-icona{ display:grid; place-items:center; }
.ago-label{ font-size:.74rem; letter-spacing:.24em; text-transform:uppercase; font-weight:600; }

.ago-panel{
  position:absolute; bottom:calc(100% + 1rem); right:0;
  width:min(390px, calc(100vw - 3rem)); height:min(560px, 72vh);
  background:var(--avorio); border:1px solid var(--linea-oro);
  box-shadow:0 40px 90px -25px rgba(18,13,4,.6);
  display:flex; flex-direction:column; overflow:hidden;
  opacity:0; visibility:hidden; transform:translateY(16px) scale(.98);
  transition:all .35s cubic-bezier(.22,1,.36,1);
}
#ago-bot.aperto .ago-panel{ opacity:1; visibility:visible; transform:none; }
#ago-bot.aperto .ago-toggle{ transform:scale(.92); }

.ago-testa{
  display:flex; align-items:center; gap:.9rem; padding:1.1rem 1.3rem;
  background:var(--seppia); color:var(--carta);
  border-bottom:1px solid var(--linea-oro);
}
.ago-avatar{
  width:42px; height:42px; border-radius:50%; border:1px solid var(--oro);
  display:grid; place-items:center; color:var(--senape); font-size:.85rem; flex:none;
  background:radial-gradient(circle at 30% 30%, #4a3b1c, var(--seppia));
}
.ago-nome{ font-family:var(--font-serif); font-style:italic; font-size:1.35rem; line-height:1.1; }
.ago-ruolo{ font-size:.62rem; letter-spacing:.28em; text-transform:uppercase; color:var(--oro-chiaro); }
.ago-chiudi{
  margin-left:auto; border:0; background:none; color:var(--carta); font-size:1.7rem;
  cursor:pointer; line-height:1; opacity:.8;
}
.ago-chiudi:hover{ opacity:1; }

.ago-corpo{
  flex:1; overflow-y:auto; padding:1.2rem; display:flex; flex-direction:column; gap:.8rem;
  scrollbar-width:thin; scrollbar-color:var(--oro) transparent;
}
.ago-msg{
  max-width:86%; padding:.8rem 1.05rem; font-size:.92rem; line-height:1.55;
  animation:salita .4s ease both;
}
.ago-msg.bot{
  align-self:flex-start; background:var(--carta); border:1px solid var(--linea);
  border-left:2px solid var(--oro); color:var(--seppia-3);
}
.ago-msg.utente{
  align-self:flex-end; background:var(--seppia); color:var(--carta);
}
.ago-msg a{ color:var(--oro-scuro); text-decoration:underline; text-underline-offset:3px; }
.ago-msg.utente a{ color:var(--senape); }

.ago-typing{ display:flex; gap:.3rem; padding:.9rem 1.05rem; }
.ago-typing span{
  width:6px; height:6px; border-radius:50%; background:var(--oro);
  animation:puntini 1.2s infinite;
}
.ago-typing span:nth-child(2){ animation-delay:.18s; }
.ago-typing span:nth-child(3){ animation-delay:.36s; }
@keyframes puntini{ 0%,60%,100%{ opacity:.25; transform:none } 30%{ opacity:1; transform:translateY(-4px) } }

.ago-chips{ display:flex; flex-wrap:wrap; gap:.5rem; }
.ago-chips button{
  border:1px solid var(--linea-oro); background:transparent; color:var(--seppia-3);
  font-family:var(--font-sans); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase;
  padding:.45rem 1rem; cursor:pointer; transition:all .25s;
}
.ago-chips button:hover{ background:var(--seppia); color:var(--senape); border-color:var(--seppia); }

.ago-pezzi{ display:grid; gap:.6rem; }
.ago-pezzo{
  display:flex; align-items:center; gap:.85rem; text-align:left;
  background:var(--carta); border:1px solid var(--linea); padding:.55rem;
  cursor:pointer; transition:border-color .25s, transform .25s;
  font-family:var(--font-sans);
}
.ago-pezzo:hover{ border-color:var(--oro); transform:translateX(3px); }
.ago-pezzo img{ width:56px; height:56px; object-fit:cover; flex:none; }
.ago-pezzo-info strong{
  display:block; font-family:var(--font-serif); font-size:.98rem; font-weight:600;
  color:var(--seppia); line-height:1.25;
}
.ago-pezzo-info em{
  font-style:normal; font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--oro-scuro);
}

.ago-input{
  display:flex; border-top:1px solid var(--linea); background:var(--carta);
}
.ago-input input{
  flex:1; border:0; background:transparent; padding:1rem 1.2rem; outline:none;
  font-family:var(--font-sans); font-size:.95rem; color:var(--seppia);
}
.ago-input button{
  border:0; background:transparent; color:var(--oro-scuro); font-size:1.1rem;
  padding:0 1.2rem; cursor:pointer; transition:color .25s;
}
.ago-input button:hover{ color:var(--seppia); }

@media (max-width:560px){
  #ago-bot{ bottom:1.2rem; right:1.2rem; }
  .ago-label{ display:none; }
  .ago-toggle{ padding:.95rem; }
  #torna-su{ display:none; }
  .epoche-track{ grid-template-columns:1fr; gap:2rem; }
  .epoche-track::before{ display:none; }
}
@media (max-width:1020px) and (min-width:561px){
  .epoche-track{ grid-template-columns:repeat(3,1fr); row-gap:2.4rem; }
  .epoche-track::before{ display:none; }
}

/* ============================================================
   LIVELLO 4 — omino 3D "Ago" + raffinamento galleria
   ============================================================ */

/* ---------- omino: il pulsante diventa il personaggio ---------- */
.ago-toggle{
  display:block; background:none; border:0; padding:0; cursor:pointer;
  position:relative; box-shadow:none; border-radius:0;
}
.ago-toggle:hover{ transform:none; background:none; }
.ago-icona{ display:none; }

.ago-omino{
  width:118px; height:auto; display:block;
  filter:drop-shadow(0 18px 26px rgba(10,7,2,.45));
  animation:fluttua 3.8s ease-in-out infinite;
  transform-origin:50% 100%;
}
@keyframes fluttua{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-6px); }
}
.omino-ombra{ animation:ombra 3.8s ease-in-out infinite; transform-origin:center; }
@keyframes ombra{
  0%,100%{ transform:scaleX(1); opacity:1; }
  50%{ transform:scaleX(.82); opacity:.65; }
}
.omino-testa{
  animation:inclina 7s ease-in-out infinite; transform-origin:70px 80px;
}
@keyframes inclina{
  0%,100%{ transform:rotate(0deg); } 30%{ transform:rotate(-2.5deg); } 65%{ transform:rotate(2deg); }
}
.omino-occhi{
  animation:sbatti 4.6s infinite; transform-origin:70px 52px;
}
@keyframes sbatti{
  0%, 90%, 100%{ transform:scaleY(1); }
  93%, 96%{ transform:scaleY(.08); }
}
.omino-lente{
  animation:scruta 5.2s ease-in-out infinite; transform-origin:92px 100px;
}
@keyframes scruta{
  0%,100%{ transform:rotate(0deg); } 40%{ transform:rotate(-8deg); } 70%{ transform:rotate(4deg); }
}
.ago-toggle:hover .omino-lente{ animation:saluta .9s ease-in-out infinite; }
@keyframes saluta{
  0%,100%{ transform:rotate(0deg); } 50%{ transform:rotate(-16deg); }
}

/* fumetto */
.ago-fumetto{
  position:absolute; bottom:calc(100% - 6px); right:72%;
  background:var(--carta); border:1px solid var(--linea-oro);
  padding:.5rem 1rem; white-space:nowrap;
  box-shadow:0 14px 30px -14px rgba(34,26,13,.4);
  animation:fluttua 3.8s ease-in-out infinite;
}
.ago-fumetto::after{
  content:""; position:absolute; bottom:-6px; right:16px;
  width:10px; height:10px; background:var(--carta);
  border-right:1px solid var(--linea-oro); border-bottom:1px solid var(--linea-oro);
  transform:rotate(45deg);
}
.ago-label{
  font-family:var(--font-serif); font-style:italic; font-size:1.02rem;
  letter-spacing:.04em; text-transform:none; color:var(--seppia); font-weight:600;
}
#ago-bot.aperto .ago-fumetto{ opacity:0; visibility:hidden; transition:opacity .3s; }
#ago-bot.aperto .ago-toggle{ transform:scale(.94); }

/* avatar nel pannello: la testa dell'omino */
.ago-avatar{
  background:radial-gradient(circle at 32% 28%, #4a3b1c, var(--seppia));
  overflow:hidden; padding:2px;
}
.ago-avatar svg{ width:100%; height:100%; display:block; }

/* ---------- marquee: da fiera a galleria ---------- */
.marquee{
  background:var(--seppia-2); color:var(--oro-chiaro);
  border-top:1px solid rgba(201,162,39,.4); border-bottom:1px solid rgba(201,162,39,.4);
  padding:1rem 0;
}
.marquee-track{
  animation-duration:70s;
  font-family:var(--font-sans); font-style:normal; font-size:.78rem;
  letter-spacing:.42em; font-weight:500;
}
.marquee-track span::after{ color:var(--oro); }

/* ---------- hero: opera incorniciata + déco ---------- */
.hero-figura{ width:min(100%,460px); }
.hero-figura .cornice.grande img{
  aspect-ratio:3/3.6; object-fit:cover;
}
.hero-figura .cornice.piccola{
  position:absolute; left:-56px; bottom:-38px; width:172px; z-index:3;
  padding:8px; background:var(--seppia-2);
  border:1px solid var(--oro); transform:rotate(-5deg);
  box-shadow:0 30px 60px -20px rgba(0,0,0,.75);
  animation:salita 1.1s cubic-bezier(.22,1,.36,1) .8s backwards;
}
.hero-figura .cornice.piccola::before{ display:none; }
.hero-figura .cornice.piccola img{ box-shadow:none; }

/* ---------- capolavoro / pezzo del mese ---------- */
.capolavoro{ background:var(--avorio-2); position:relative; overflow:hidden; }
.capolavoro .container{
  display:grid; grid-template-columns:1.05fr .95fr; gap:4.5rem; align-items:center;
}
.capolavoro .cornice-doppia{ background:var(--carta); }
.capolavoro .cornice-doppia img{ aspect-ratio:4/4.4; object-fit:cover; }
.cartellino{
  background:var(--carta); border:1px solid var(--linea);
  padding:2.6rem 2.6rem 2.2rem; position:relative; margin-top:2rem;
}
.cartellino::before{
  content:"◆"; position:absolute; top:-9px; left:50%; transform:translateX(-50%);
  color:var(--oro); font-size:.7rem; background:var(--carta); padding:0 .7rem;
}
.cartellino .lotto{
  font-size:.66rem; letter-spacing:.4em; text-transform:uppercase; color:var(--grigio);
}
.cartellino h3{ font-size:1.75rem; font-style:italic; margin:.6rem 0 1.2rem; }
.cartellino dl{
  display:grid; grid-template-columns:auto 1fr; gap:.5rem 1.6rem; margin-bottom:1.8rem;
}
.cartellino dt{
  font-size:.68rem; letter-spacing:.3em; text-transform:uppercase; color:var(--grigio); padding-top:.2rem;
}
.cartellino dd{
  font-family:var(--font-serif); font-size:1.08rem; color:var(--seppia);
  border-bottom:1px dashed var(--linea); padding-bottom:.4rem;
}
.cartellino dd.oro{ color:var(--oro-scuro); font-weight:600; }

/* ---------- schede: etichetta da museo ---------- */
.scheda{ border:0; box-shadow:0 1px 0 var(--linea), 0 0 0 1px var(--linea); }
.scheda .foto{ aspect-ratio:4/4.6; }
.scheda .info{
  text-align:center; padding:1.3rem 1.2rem 1.5rem; border-top:0; position:relative;
}
.scheda .info::before{
  content:""; position:absolute; top:0; left:50%; transform:translateX(-50%);
  width:44px; height:1px; background:var(--oro);
}
.scheda .info h3{
  font-style:italic; font-weight:600; font-size:1.18rem;
}
.scheda .prezzo{ font-size:.72rem; letter-spacing:.28em; }
.mini-grid .scheda .foto{ aspect-ratio:4/3.4; }

/* ---------- respiro tipografico ---------- */
section{ padding:7rem 0; }
.sezione-testa{ margin-bottom:4.5rem; }

@media (max-width:1020px){
  .capolavoro .container{ grid-template-columns:1fr; gap:2.4rem; }
  .hero-figura .cornice.piccola{ left:-14px; }
}
@media (max-width:560px){
  .ago-omino{ width:92px; }
  .hero-figura .cornice.piccola{ width:130px; bottom:-26px; }
  section{ padding:4.5rem 0; }
  .cartellino{ padding:1.8rem 1.4rem; }
}

/* ============================================================
   LIVELLO 5 — la quadreria, cursore d'oro, corridoio, polvere
   ============================================================ */

/* ---------- cursore personalizzato (solo puntatori fini) ---------- */
body.cursore-attivo, body.cursore-attivo a, body.cursore-attivo button,
body.cursore-attivo .scheda, body.cursore-attivo input, body.cursore-attivo textarea,
body.cursore-attivo label{ cursor:none; }
#cursore-punto{
  position:fixed; z-index:9999; width:7px; height:7px; border-radius:50%;
  background:var(--oro); pointer-events:none; top:0; left:0;
  transform:translate(-50%,-50%); transition:opacity .3s;
  mix-blend-mode:difference;
}
#cursore-anello{
  position:fixed; z-index:9998; width:34px; height:34px; border-radius:50%;
  border:1px solid var(--oro); pointer-events:none; top:0; left:0;
  transform:translate(-50%,-50%); opacity:.7;
  transition:width .3s ease, height .3s ease, background .3s, opacity .3s;
}
#cursore-anello.su-link{
  width:56px; height:56px; background:rgba(201,162,39,.12); opacity:1;
}

/* ---------- hero quadreria ---------- */
.quadreria{
  position:relative; width:100%; max-width:520px; height:540px; justify-self:center;
  perspective:900px;
}
.quadro{
  position:absolute; background:var(--seppia-2);
  border:1px solid var(--oro); padding:10px;
  box-shadow:0 34px 70px -24px rgba(0,0,0,.75);
  will-change:transform;
}
.quadro::before{
  content:""; position:absolute; inset:4px; border:1px solid rgba(201,162,39,.35); pointer-events:none;
}
.quadro img{ width:100%; height:100%; object-fit:cover; display:block; }
/* gancio e filo del quadro */
.quadro::after{
  content:""; position:absolute; left:50%; bottom:100%; width:1px; height:46px;
  background:linear-gradient(to top, rgba(201,162,39,.55), transparent);
}
.quadro.q1{ right:6px; top:60px; width:300px; height:360px; z-index:2; }
.quadro.q2{ left:0; top:0; width:190px; height:230px; z-index:1; }
.quadro.q3{ left:26px; bottom:14px; width:170px; height:200px; z-index:3; transform:rotate(-3deg); }
.quadro .targhetta{
  position:absolute; left:50%; top:calc(100% + 8px); transform:translateX(-50%);
  background:var(--carta); color:var(--seppia); white-space:nowrap;
  font-size:.56rem; letter-spacing:.28em; text-transform:uppercase; font-weight:600;
  padding:.3rem .9rem; border:1px solid var(--linea-oro);
}
.omino-scena{
  position:absolute; right:-30px; bottom:-40px; width:150px; z-index:4;
  filter:drop-shadow(0 16px 22px rgba(0,0,0,.55));
  animation:salita 1.2s cubic-bezier(.22,1,.36,1) 1.1s backwards;
}
.omino-scena svg{ width:100%; height:auto; }

.hero-inner{ align-items:center; }
@media (max-width:1020px){
  .quadreria{ max-width:420px; height:460px; }
  .quadro.q1{ width:250px; height:300px; }
  .quadro.q2{ width:150px; height:185px; }
  .quadro.q3{ width:140px; height:165px; }
  .omino-scena{ right:-8px; }
}
@media (max-width:560px){
  .quadreria{ height:400px; }
  .quadro.q1{ width:210px; height:260px; right:0; }
  .quadro.q2{ width:125px; height:155px; }
  .quadro.q3{ width:115px; height:140px; }
  .omino-scena{ width:110px; bottom:-22px; }
}

/* ---------- pulviscolo dorato ---------- */
#polvere{
  position:absolute; inset:0; z-index:1; pointer-events:none;
}

/* ---------- corridoio di galleria ---------- */
.corridoio{
  background:
    linear-gradient(to bottom,
      var(--seppia) 0%, var(--seppia) 62%,
      #171107 62%, #171107 63.5%,
      #241b0e 63.5%, #1a1309 100%);
  color:#d8cdb2; overflow:hidden;
}
.corridoio .sezione-testa h2{ color:var(--carta); }
.corridoio-track{
  display:flex; gap:3.6rem; overflow-x:auto; padding:3.2rem 6vw 4.6rem;
  scroll-snap-type:x mandatory; scrollbar-width:none; cursor:grab;
}
.corridoio-track::-webkit-scrollbar{ display:none; }
.corridoio-track.trascina{ cursor:grabbing; scroll-snap-type:none; }
.quadro-corridoio{
  flex:0 0 auto; scroll-snap-align:center; position:relative;
  width:250px; background:#0f0a04; border:6px solid transparent;
  border-image:linear-gradient(135deg,#e3c563,#96781a 40%,#e3c563 70%,#7a6215) 1;
  box-shadow:0 30px 50px -18px rgba(0,0,0,.85), inset 0 0 24px rgba(0,0,0,.6);
  transition:transform .4s ease;
}
.quadro-corridoio:hover{ transform:translateY(-8px); }
.quadro-corridoio img{
  width:100%; aspect-ratio:4/4.8; object-fit:cover; display:block;
  filter:sepia(.15) saturate(.9) brightness(.96);
}
.quadro-corridoio:hover img{ filter:none; }
.quadro-corridoio .placca{
  position:absolute; left:50%; top:calc(100% + 14px); transform:translateX(-50%);
  width:82%; text-align:center;
  background:linear-gradient(180deg,#e9cd77,#b8933b); color:#241b0e;
  font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; font-weight:600;
  padding:.4rem .6rem; border-radius:1px;
  box-shadow:0 4px 10px rgba(0,0,0,.5);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.quadro-corridoio .lume{
  position:absolute; left:50%; bottom:100%; transform:translateX(-50%);
  width:130%; height:80px; pointer-events:none;
  background:radial-gradient(60% 100% at 50% 0%, rgba(238,197,47,.22), transparent 75%);
}
.corridoio-hint{
  text-align:center; font-size:.7rem; letter-spacing:.4em; text-transform:uppercase;
  color:var(--oro-chiaro); opacity:.8; padding-bottom:3rem;
}
.corridoio-hint span{ display:inline-block; animation:scivola 2.4s ease-in-out infinite; }
@keyframes scivola{ 0%,100%{ transform:translateX(0) } 50%{ transform:translateX(10px) } }

/* ---------- armonizzazione fotografica ---------- */
.scheda .foto img, .cat-card img, .capolavoro .cornice-doppia img, .quadro img{
  filter:sepia(.12) saturate(.92) contrast(1.02);
}
.scheda:hover .foto img, .cat-card:hover img{ filter:none; }

/* ---------- riflesso oro sui corsivi dei titoli ---------- */
h1 em, .fascia h2 em, .sezione-testa h2 em.oro{
  background:linear-gradient(100deg, var(--senape) 20%, #fff4c2 38%, var(--senape) 55%, var(--oro) 80%);
  background-size:220% 100%;
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  animation:riflesso 6s ease-in-out infinite;
}
.sezione-testa h2 em.oro, h2 em.oro{
  background:linear-gradient(100deg, var(--oro-scuro) 20%, #e8cc6a 40%, var(--oro-scuro) 60%, var(--oro-scuro) 100%);
  background-size:220% 100%;
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  animation:riflesso 6s ease-in-out infinite;
}
@keyframes riflesso{ 0%,100%{ background-position:0% 0 } 50%{ background-position:100% 0 } }

/* ---------- transizione di pagina ---------- */
body{ opacity:1; transition:opacity .28s ease; }
body.esce{ opacity:0; }

/* ---------- cornice interna sulle schede in hover ---------- */
.scheda .foto::before{
  content:""; position:absolute; inset:10px; z-index:2; pointer-events:none;
  border:1px solid rgba(201,162,39,0); transition:border-color .4s, inset .4s;
}
.scheda:hover .foto::before{ border-color:rgba(201,162,39,.75); }

@media (prefers-reduced-motion: reduce){
  #cursore-punto,#cursore-anello{ display:none; }
  body.cursore-attivo, body.cursore-attivo *{ cursor:auto; }
}

/* il bot fisso si nasconde finché l'omino della hero è in scena */
#ago-bot{ transition:opacity .4s ease, visibility .4s; }
#ago-bot.nascosto{ opacity:0; visibility:hidden; }
.omino-scena:hover .omino-lente{ animation:saluta .9s ease-in-out infinite; }

/* ---------- azioni nel lightbox ---------- */
.lb-azioni{ display:flex; gap:.8rem; justify-content:center; margin-top:1.3rem; flex-wrap:wrap; }
.lb-btn{ padding:.75rem 1.8rem; font-size:.7rem; }
.lb-btn-sec{ border-color:rgba(233,223,198,.4); color:#e9dfc6; }
.lb-btn-sec:hover{ color:var(--seppia); }

/* ---------- voce "Gestione" nel menù ---------- */
.nav-links a.link-gestione{ color:var(--oro-scuro); }
.nav-links a.link-gestione::before{ content:"⚿ "; font-size:.9em; }

/* ---------- blocco pagina gestione per non autenticati ---------- */
body.gestione-bloccata section,
body.gestione-bloccata .pagina-testa,
body.gestione-bloccata footer.site{
  filter:blur(14px); pointer-events:none; user-select:none;
}
#gestione-login{
  position:fixed; inset:0; z-index:400; display:flex; align-items:center; justify-content:center;
  background:rgba(34,26,13,.55); padding:2rem;
}
#gestione-login .scrigno{
  background:var(--avorio); border:1px solid var(--linea-oro);
  padding:3rem 2.8rem; max-width:420px; text-align:center;
  box-shadow:0 40px 90px -25px rgba(18,13,4,.6);
}
#gestione-login .scrigno .script{ font-size:1.8rem; }
#gestione-login .scrigno h2{ font-size:1.9rem; margin:.5rem 0 1rem; }
#gestione-login .scrigno p{ color:var(--seppia-soft); font-size:.95rem; margin-bottom:1.8rem; }

/* ============================================================
   CARRELLO — richiesta d'acquisto
   ============================================================ */

/* icona nel menù */
.carrello-toggle{
  position:relative; border:1px solid var(--linea); background:transparent;
  color:var(--seppia); cursor:pointer; padding:.45rem .6rem; display:grid; place-items:center;
  transition:border-color .25s, color .25s;
}
.carrello-toggle:hover{ border-color:var(--oro); color:var(--oro-scuro); }
.badge-carrello{
  position:absolute; top:-7px; right:-7px; width:18px; height:18px; border-radius:50%;
  background:var(--oro-scuro); color:var(--carta); font-size:.62rem; font-weight:600;
  display:none; place-items:center; line-height:1;
}

/* bottone "aggiungi al carrello" */
.btn-carrello{
  border:1px solid var(--linea-oro); background:transparent; color:var(--oro-scuro);
  font-family:var(--font-sans); font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; font-weight:600;
  padding:.55rem 1rem; cursor:pointer; transition:all .25s; width:100%;
}
.btn-carrello:hover{ background:var(--seppia); color:var(--senape); border-color:var(--seppia); }
.btn-carrello.dentro{ background:var(--avorio-2); color:var(--seppia-soft); border-color:var(--linea); }
.scheda .btn-carrello{ margin-top:.8rem; }
.lb-azioni .btn-carrello{ width:auto; padding:.75rem 1.6rem; font-size:.7rem;
  border-color:var(--oro-chiaro); color:var(--oro-chiaro); }
.lb-azioni .btn-carrello:hover{ background:var(--senape); color:var(--seppia); border-color:var(--senape); }
.lb-azioni .btn-carrello.dentro{ background:transparent; color:#b9ad8f; border-color:rgba(233,223,198,.3); }
.cartellino .btn-carrello{ width:auto; padding:.95rem 1.8rem; font-size:.72rem; }

/* cassetto */
#carrello-drawer{ position:fixed; inset:0; z-index:350; pointer-events:none; }
#carrello-drawer .car-velo{
  position:absolute; inset:0; background:rgba(18,13,4,.55);
  opacity:0; transition:opacity .35s;
}
#carrello-drawer .car-pannello{
  position:absolute; top:0; right:0; bottom:0; width:min(430px,100vw);
  background:var(--avorio); border-left:1px solid var(--linea-oro);
  display:flex; flex-direction:column;
  transform:translateX(100%); transition:transform .4s cubic-bezier(.22,1,.36,1);
  box-shadow:-30px 0 80px -20px rgba(18,13,4,.5);
}
#carrello-drawer.aperto{ pointer-events:auto; }
#carrello-drawer.aperto .car-velo{ opacity:1; }
#carrello-drawer.aperto .car-pannello{ transform:none; }

.car-testa{
  display:flex; align-items:center; gap:.9rem; padding:1.2rem 1.4rem;
  background:var(--seppia); color:var(--carta); border-bottom:1px solid var(--linea-oro);
}
.car-testa .script{ color:var(--oro-chiaro); }
.car-titolo{ font-size:1.35rem; font-style:italic; color:var(--carta); }
.car-chiudi{ margin-left:auto; border:0; background:none; color:var(--carta); font-size:1.8rem; cursor:pointer; line-height:1; opacity:.85; }
.car-chiudi:hover{ opacity:1; }

.car-corpo{ flex:1; overflow-y:auto; padding:1.2rem 1.4rem; scrollbar-width:thin; }
.car-riga{
  display:flex; gap:1rem; align-items:center; padding:.8rem 0;
  border-bottom:1px dashed var(--linea);
}
.car-riga img{ width:62px; height:62px; object-fit:cover; border:1px solid var(--linea-oro); flex:none; }
.car-info strong{ display:block; font-family:var(--font-serif); font-size:1.02rem; font-weight:600; color:var(--seppia); line-height:1.3; }
.car-info em{ font-style:normal; font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--oro-scuro); }
.car-rimuovi{
  margin-left:auto; border:0; background:none; color:var(--grigio); font-size:1.3rem; cursor:pointer; line-height:1;
}
.car-rimuovi:hover{ color:#a33; }

.car-vuoto{ text-align:center; padding:3rem 1rem; display:grid; gap:1rem; justify-items:center; }
.car-vuoto p{ color:var(--seppia-soft); font-size:.95rem; }

.car-piede{ border-top:1px solid var(--linea); padding:1.2rem 1.4rem; background:var(--carta); }
.car-nota{ font-size:.82rem; color:var(--seppia-soft); margin-bottom:.9rem; }
.car-form{ display:grid; gap:.7rem; }
.car-form input, .car-form textarea{
  width:100%; padding:.65rem .8rem; border:1px solid var(--linea); background:var(--avorio);
  font-family:var(--font-sans); font-size:.92rem; color:var(--seppia); outline:none;
}
.car-form input:focus, .car-form textarea:focus{ border-color:var(--oro); }

@media (max-width:560px){
  .carrello-toggle{ padding:.4rem .5rem; }
}

/* ---------- carrello: conferma e richieste inviate ---------- */
.car-grazie{
  text-align:center; padding:1.4rem 1rem; margin-bottom:1rem;
  background:var(--carta); border:1px solid var(--linea-oro);
}
.car-grazie p{ color:var(--seppia-soft); font-size:.9rem; margin-top:.4rem; }
.car-inviate{ margin-top:1.6rem; padding-top:1rem; border-top:1px solid var(--linea); }
.car-inviate h3{ font-size:1.1rem; font-style:italic; margin-bottom:.4rem; color:var(--seppia-soft); }
.car-riga.inviata{ opacity:.85; }
.car-riga.inviata img{ filter:sepia(.25) saturate(.8); }
.car-riga.inviata .car-info em{ color:var(--seppia-soft); }

/* ---------- badge Prenotato ---------- */
.badge.prenotato{ background:var(--oro-scuro); color:var(--carta); }

/* ---------- prenota trattativa per pezzo ---------- */
.btn-prenota, .btn-acquista{
  margin-top:.55rem; display:inline-block;
  border:1px solid var(--oro-scuro); background:var(--seppia); color:var(--senape);
  font-family:var(--font-sans); font-size:.64rem; letter-spacing:.2em; text-transform:uppercase; font-weight:600;
  padding:.5rem 1rem; cursor:pointer; transition:all .25s;
}
.btn-prenota:hover, .btn-acquista:hover{ background:var(--oro-scuro); color:var(--carta); }
.btn-prenota:disabled, .btn-acquista:disabled{ opacity:.5; cursor:wait; }
.car-form input.manca, .car-form textarea.manca{ border-color:#a33; background:#fdf3f0; }
.car-avviso{ color:#a33; font-size:.8rem; font-style:italic; }

/* ---------- passo 1/2 nel carrello ---------- */
.btn-prenota.btn-richiesta{ background:transparent; color:var(--oro-scuro); }
.btn-prenota.btn-richiesta:hover{ background:var(--seppia); color:var(--senape); }
.tag-richiesta{
  display:block; font-size:.66rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--seppia-soft); margin:.5rem 0 .1rem;
}

/* ---------- pulsante invia richiesta disattivato ---------- */
.car-form .btn[disabled]{ opacity:.4; cursor:not-allowed; }
.car-form .btn[disabled]:hover{ color:var(--senape); }
.car-form .btn[disabled]:hover::before{ transform:scaleX(0); }

/* ---------- riga in trattativa ---------- */
.car-riga.riga-trattativa{ background:var(--carta); margin:0 -.4rem; padding:.8rem .4rem; border-left:2px solid var(--oro); }
.tag-richiesta.trattativa{ color:var(--oro-scuro); font-weight:600; }

/* ---------- epoca sulla scheda ---------- */
.scheda .epoca-tag{
  font-size:.62rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--oro-scuro); margin:-.2rem 0 .35rem;
}
.filtri.filtri-epoche{ margin-top:.7rem; }
.filtri.filtri-epoche button{ font-size:.66rem; }
