/* [ALESENSO] AS3.5 — impaginazione delle pagine elenco. 20260923-3
   Unifica cinque copie identiche: arte-pubblica, interni, piccolo-formato,
   urbex e serie. Usato anche da archivio e shop. */
body{background:var(--cream);color:var(--ink);font-family:var(--ff-sans);font-weight:300;line-height:1.65;overflow-x:hidden}
.section-label{display:flex;align-items:center;gap:1rem; font-size:1.05rem;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:1.3rem}
.section-label::after{content:'';flex:0 0 34px;height:1px;background:var(--red)}
h2.s-title{font-family:var(--ff-serif);font-size:clamp(2rem,3.6vw,3.8rem); font-weight:300;line-height:1.05;letter-spacing:-.015em}
h2.s-title em{font-style:italic;color:var(--red)}
.btn-primary:hover{background:var(--red-lt);transform:translateY(-1px);box-shadow:0 6px 18px rgba(192,67,42,.28)}
.btn-outline-light{background:transparent;color:rgba(247,243,238,.75);border:1px solid rgba(247,243,238,.2)}
.arr-right{transform:rotate(0)}
.works-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}
.work-card{cursor:pointer;display:flex;flex-direction:column;text-decoration:none;transition:transform .3s var(--ease)}
.work-card:hover{transform:translateY(-4px)}
.wc-thumb{position:relative;overflow:hidden;border-radius:2px;background:var(--sand)}
.wc-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.wc-overlay{position:absolute;inset:0;background:rgba(28,25,22,0); display:flex;align-items:center;justify-content:center;transition:background .3s}
.work-card:hover .wc-overlay{background:rgba(28,25,22,.32)}
.ov-icon{opacity:0;transform:scale(.8);transition:all .28s var(--ease);width:44px;height:44px; background:rgba(247,243,238,.12);backdrop-filter:blur(6px);border-radius:50%; display:flex;align-items:center;justify-content:center}
.ov-icon svg{width:17px;height:17px;stroke:#fff;fill:none;stroke-width:1.5}
.work-card:hover .ov-icon{opacity:1;transform:scale(1)}
.wc-caption{padding:.8rem 0 .2rem}
.wc-title{font-family:var(--ff-serif);font-size:1.45rem;font-weight:300;font-style:italic; color:var(--ink);line-height:1.2;margin-bottom:.22rem;transition:color .22s}
.work-card:hover .wc-title{color:var(--red)}
.wc-meta{font-size:1.05rem;color:var(--ink-mid);line-height:1.5}
.wc-author{font-size:1.05rem;color:var(--red);margin-top:.2rem}
.wc-badge{position:absolute;top:.7rem;right:.7rem;padding:.2rem .6rem; background:rgba(192,67,42,.82);color:#fff;font-size:1.05rem; letter-spacing:.1em;text-transform:uppercase;border-radius:2px}
.filters-bar{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;margin-bottom:2.8rem}
.f-btn{padding:.36rem .9rem;font-family:var(--ff-sans);font-size:1.05rem;letter-spacing:.1em; text-transform:uppercase;background:transparent;border:1px solid var(--sand); color:var(--ink-mid);cursor:pointer;border-radius:2px;transition:all .22s}
.f-btn.active,.f-btn:hover{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.f-sep{width:1px;height:18px;background:var(--sand);margin:0 .3rem;flex-shrink:0}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rd4{transition-delay:.32s}
@keyframes morphBlob{ 0%{border-radius:40% 60% 55% 45%/50% 40% 60% 50%;transform:rotate(0deg)} 50%{border-radius:55% 45% 45% 55%/40% 60% 40% 60%} 100%{border-radius:45% 55% 60% 40%/55% 45% 55% 45%;transform:rotate(6deg)} }
@media(max-width:960px){ .container{padding:0 1.5rem} .works-grid{grid-template-columns:repeat(2,1fr);gap:1.1rem} }
@media(max-width:540px){.works-grid{grid-template-columns:1fr}}
.page-hero{padding:10rem 0 5rem;background:var(--ink);position:relative;overflow:hidden}
.page-hero-bg{position:absolute;inset:0; background:linear-gradient(150deg,#2A2018 0%,#1C1916 50%,#110E0C 100%); opacity:.97}
.page-hero-blob{position:absolute;inset:0}
.page-hero-blob::before{content:'';position:absolute;bottom:-10%;right:-5%;width:55%;aspect-ratio:1; background:radial-gradient(ellipse 60% 70% at 60% 50%,rgba(192,67,42,.12),transparent 65%); border-radius:45% 55% 50% 50%/50% 45% 55% 50%;animation:morphBlob 14s ease-in-out infinite alternate}
.page-hero-content{position:relative;z-index:2}
.page-eyebrow{font-size:1.05rem;letter-spacing:.12em;text-transform:uppercase; color:var(--red-lt);margin-bottom:1rem;opacity:0;animation:fadeUp .7s var(--ease) .1s forwards}
.page-title{font-family:var(--ff-serif);font-size:clamp(3.5rem,8vw,8rem);font-weight:300; line-height:.92;letter-spacing:-.02em;color:var(--cream); opacity:0;animation:fadeUp .9s var(--ease) .25s forwards}
.page-title em{font-style:italic;color:rgba(217,89,62,.85)}
.page-desc{font-size:1.15rem;color:rgba(247,243,238,.8);max-width:48ch;line-height:1.85; margin-top:1.5rem;opacity:0;animation:fadeUp .8s var(--ease) .4s forwards}
.page-stats{display:flex;gap:3rem;margin-top:2.5rem;padding-top:2rem; border-top:1px solid rgba(247,243,238,.1); opacity:0;animation:fadeUp .7s var(--ease) .55s forwards;flex-wrap:wrap}
.ps-num{font-family:var(--ff-serif);font-size:2.6rem;font-weight:300;color:var(--red-lt);line-height:1}
.ps-label{font-size:1.05rem;letter-spacing:.13em;text-transform:uppercase; color:rgba(247,243,238,.8);margin-top:.2rem}
.gallery-section{padding:5rem 0 7rem;background:var(--warm)}
.gallery-header{display:flex;justify-content:space-between;align-items:center; margin-bottom:2.8rem;flex-wrap:wrap;gap:1.2rem}
.gallery-count{font-family:var(--ff-serif);font-size:1rem;font-weight:300;color:var(--ink-mid)}
.gallery-count strong{color:var(--red);font-weight:300}
.work-card.span2{grid-column:span 2}
.work-card.span2 .wc-thumb{aspect-ratio:16/7!important}
@media(max-width:960px){.work-card.span2{grid-column:span 1}}

/* ── Archivio: filtri a due livelli ─────────────────────────────
   `hidden` da solo non basta: `.filters-bar{display:flex}` vince
   sull'attributo, come avvertiva già un commento in cms.js. */
.archivio-filtri [hidden]{display:none!important}
.archivio-filtri{display:flex;flex-direction:column;gap:.8rem;flex:1 1 auto}
.archivio-filtri #filtriTipologia{padding-left:1rem;border-left:1px solid var(--sand,#E8DDD0)}

/* ── Blocco delle serie, in testa a Piccolo formato ────────────
   Usato solo da quella categoria (decisione del 23/09/2026). Le
   classi riprendono quelle del pulsante già in uso sulla scheda
   opera: serie-link, sl-logo, sl-text, sl-eyebrow, sl-title,
   sl-years, sl-arrow. */
.serie-section{padding:4.5rem 0 1.5rem;background:var(--cream)}
.serie-heading{font-family:var(--ff-serif);font-size:1.6rem;font-weight:300;color:var(--ink);margin-bottom:1.6rem}
/* Stessa griglia di .works-grid: tre colonne, stesso interspazio e
   stessi punti di rottura, così i riquadri delle serie e le schede
   delle opere restano incolonnati. Con meno di tre serie i riquadri
   occupano le prime colonne e il resto della riga resta vuoto. */
.serie-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}
.serie-link{display:flex;align-items:center;gap:1rem;padding:.9rem 1.1rem; border:1px solid var(--sand);border-radius:3px;background:var(--cream); text-decoration:none;color:var(--ink); transition:border-color .25s var(--ease),transform .25s var(--ease)}
.serie-link:hover{border-color:var(--ink);transform:translateY(-2px)}
.sl-logo{flex:0 0 auto;display:block}
.sl-logo img{height:38px;width:auto;display:block}
.sl-text{display:flex;flex-direction:column;gap:.15rem;min-width:0}
/* Corpo e colore corretti nel primo passaggio tipografico: erano
   .58rem e --ink-lt, cioè 9,3px a 3,47:1 di contrasto. */
.sl-eyebrow{font-size:1.05rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mid)}
.sl-title{font-family:var(--ff-serif);font-size:1.05rem;line-height:1.2;overflow-wrap:anywhere}
.sl-years{font-size:1.05rem;color:var(--ink-mid)}
/* L'SVG del markup non porta attributi di tratto: li mette il CSS. */
.sl-arrow{width:12px;height:12px;flex:0 0 auto;margin-left:auto; fill:none;stroke:var(--ink-mid);stroke-width:1.5; transition:transform .25s var(--ease),stroke .25s}
.serie-link:hover .sl-arrow{stroke:var(--red);transform:translateX(3px)}
@media(max-width:960px){.serie-grid{grid-template-columns:repeat(2,1fr);gap:1.1rem}}
@media(max-width:540px){.serie-grid{grid-template-columns:1fr}}