/* Elenco articoli */
.blog-eroe{padding-bottom:clamp(36px,5vw,64px)}
.blog-temi{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:clamp(22px,3.4vh,36px);padding-top:14px;border-top:1px solid var(--filo);font-size:.96rem;font-weight:500}
.blog-temi a{transition:color .2s}
.blog-temi a:hover{color:var(--oro)}
.blog-temi b{margin-left:3px;font-size:.76rem;font-weight:700;color:var(--oro)}
.blog-gruppo{padding:0}
.blog-griglia{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:18px clamp(28px,4.4vw,64px);padding-top:clamp(40px,5.4vw,72px);padding-bottom:clamp(40px,5.4vw,72px)}
.blog-griglia::before{content:"";grid-column:1/-1;grid-row:1;height:1px;margin:calc(-1*clamp(40px,5.4vw,72px)) 0 0;background:var(--filo)}
.blog-griglia>*{grid-row:2}
.blog-eroe+.blog-gruppo .blog-griglia::before{display:none}
.blog-eroe+.blog-gruppo .blog-griglia{padding-top:0}
.blog-cat{position:sticky;top:104px;align-self:start;font-size:clamp(1.3rem,2.1vw,1.8rem);font-weight:900;line-height:1.1;letter-spacing:-.01em}
.blog-griglia>div{align-self:start}
.blog-griglia>div .blog-cat{position:static}
.blog-griglia>div .etichetta-riga{margin-bottom:10px}
.blog-tutti{margin-top:8px}
.blog-lista{border-top:1px solid var(--filo)}
.blog-lista a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 24px;align-items:baseline;padding:clamp(14px,1.8vw,22px) 0;border-bottom:1px solid var(--filo)}
.blog-t{font-size:clamp(1.14rem,1.9vw,1.55rem);font-weight:800;line-height:1.18;letter-spacing:-.008em;transition:color .2s}
.blog-m{font-size:.84rem;font-weight:500;white-space:nowrap;color:rgba(255,255,255,.62);font-variant-numeric:tabular-nums}
.blog-d{grid-column:1;grid-row:2;max-width:680px;font-size:1rem;line-height:1.45;color:var(--spento)}
.blog-lista a:hover .blog-t{color:var(--oro)}

/* Articolo */
.art-eroe{padding-top:clamp(108px,13vw,150px);padding-bottom:clamp(30px,4.4vw,56px)}
.art-briciole ol{display:flex;flex-wrap:wrap;gap:4px 8px;margin-bottom:clamp(14px,2.2vw,24px);font-size:.88rem;color:rgba(255,255,255,.62)}
.art-briciole li+li::before{content:"/";margin-right:8px;color:rgba(255,255,255,.34)}
.art-briciole a{transition:color .2s}
.art-briciole a:hover{color:var(--oro)}
.art-titolo{max-width:21em;font-size:clamp(1.9rem,4.4vw,3.7rem);font-weight:900;line-height:1.06;letter-spacing:-.016em}
.art-dati{display:flex;flex-wrap:wrap;gap:4px 22px;margin-top:clamp(14px,2vw,22px);font-size:.94rem;color:var(--spento)}
.art-dati a{color:#fff;text-decoration:underline;text-decoration-color:var(--oro);text-underline-offset:3px}
.art-sezione{padding:clamp(36px,5vw,72px) 0 clamp(48px,6vw,88px)}
.art-griglia{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,720px);gap:clamp(22px,2.4vw,30px) clamp(28px,5vw,72px);align-items:start}
.art-indice{grid-column:1;grid-row:1/3;position:sticky;top:96px;font-size:.92rem;line-height:1.35}
.art-indice p{margin-bottom:10px;font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--spento-chiaro)}
.art-indice li{border-top:1px solid var(--filo-chiaro)}
.art-indice a{display:block;padding:8px 0;font-weight:500;color:#34373c;transition:color .2s}
.art-indice a:hover{color:var(--oro-scuro)}
.art-testo{grid-column:2;grid-row:2;min-width:0;font-size:clamp(1.06rem,1.3vw,1.16rem);line-height:1.68;color:#25282c}
.art-testo>p{margin-top:1em}
.art-testo>p:first-child{margin-top:0}
.art-testo h2{margin-top:clamp(36px,4vw,52px);font-size:clamp(1.45rem,2.5vw,2rem);font-weight:900;line-height:1.14;letter-spacing:-.012em;color:var(--ink);scroll-margin-top:96px}
.art-testo h3{margin-top:clamp(22px,2.6vw,32px);font-size:clamp(1.12rem,1.6vw,1.28rem);font-weight:800;line-height:1.25;color:var(--ink)}
.art-testo h3+p{margin-top:.45em}
.art-testo ul,.art-testo ol{margin-top:1em;padding-left:1.3em}
.art-testo ul{list-style:square}
.art-testo ol{list-style:decimal}
.art-testo li{margin-top:.5em;padding-left:.2em}
.art-testo li::marker{color:var(--oro-scuro);font-weight:700}
.art-testo a{color:var(--ink);font-weight:500;text-decoration:underline;text-decoration-color:var(--oro);text-decoration-thickness:2px;text-underline-offset:3px;transition:color .2s}
.art-testo a:hover{color:var(--oro-scuro)}
.art-breve{grid-column:2;grid-row:1;padding:clamp(16px,2vw,24px);background:#f7f5ef;border-left:4px solid var(--oro);font-size:clamp(1.08rem,1.35vw,1.2rem);line-height:1.55;color:#25282c}
.art-breve b{display:block;margin-bottom:4px;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--spento-chiaro)}
.art-nota{padding:clamp(14px,1.8vw,20px) clamp(16px,2vw,24px);border:1px solid var(--filo-chiaro);border-left:4px solid var(--ink);font-weight:500;margin-top:1.4em!important}
.art-tabella{overflow-x:auto;margin-top:1.4em}
.art-tabella table{width:100%;min-width:480px;border-collapse:collapse;font-size:.94em;line-height:1.4}
.art-tabella th{padding:8px 12px 8px 0;text-align:left;font-weight:800;border-bottom:2px solid var(--ink)}
.art-tabella td{padding:9px 12px 9px 0;vertical-align:top;border-bottom:1px solid var(--filo-chiaro)}
.art-tabella tr>:first-child{min-width:7.5em}
.art-fonti{font-size:.94em}
.art-firma{margin-top:clamp(28px,3.4vw,44px)!important;padding-top:16px;border-top:1px solid var(--filo-chiaro);font-size:.92em;color:var(--spento-chiaro)}

@media (max-width:900px){
  .blog-griglia{grid-template-columns:minmax(0,1fr)}
  .blog-griglia>*{grid-row:auto}
  .blog-cat{position:static}
  .blog-lista a{grid-template-columns:minmax(0,1fr)}
  .blog-m{grid-row:3}
  .art-griglia{grid-template-columns:minmax(0,1fr)}
  .art-indice,.art-breve,.art-testo{grid-column:1;grid-row:auto}
  .art-indice{position:static}
}

/* Indice: i percorsi con la linea del tempo */
.vis-nascosto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.blog-cerca{max-width:560px;margin-top:clamp(18px,2.6vw,30px)}
.blog-cerca label{position:relative;display:flex;align-items:center;gap:10px;border-bottom:1px solid rgba(255,255,255,.4)}
.blog-cerca label:focus-within{border-color:var(--oro)}
.blog-cerca input{width:100%;min-height:50px;background:none;border:0;outline:0;color:#fff;font:inherit;font-size:1.1rem}
.blog-cerca input::placeholder{color:rgba(255,255,255,.55)}
.blog-cerca svg{width:20px;height:20px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2}
.blog-percorsi{padding:0 0 clamp(40px,6vw,88px)}
.blog-percorsi [hidden]{display:none!important}
.percorso{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.4fr);gap:18px clamp(28px,4.4vw,64px);padding:clamp(40px,5.4vw,72px) 0;border-top:1px solid var(--filo)}
.percorso-testa{position:sticky;top:104px;align-self:start}
.percorso-testa h2{font-size:clamp(1.7rem,3vw,2.6rem);font-weight:900;line-height:1.06;letter-spacing:-.016em}
.percorso-testa em{font-weight:400;font-style:italic;color:var(--c)}
.percorso-meta{margin-top:12px;font-size:.88rem;font-weight:500;color:rgba(255,255,255,.62);font-variant-numeric:tabular-nums}
.percorso{--c:var(--oro)}
.linea{--p:clamp(16px,2vw,26px);margin:0;padding:0;list-style:none}
.linea li{position:relative;padding-left:clamp(38px,4vw,54px)}
.linea li::before{content:"";position:absolute;left:0;top:calc(var(--p) + 4px);width:15px;height:15px;box-sizing:border-box;border:2px solid var(--c);background:var(--ink);transition:background .2s}
.linea li::after{content:"";position:absolute;left:7px;top:calc(var(--p) + 19px);bottom:calc(-1 * (var(--p) + 4px));width:1px;background:color-mix(in srgb,var(--c) 50%,transparent)}
.linea li:last-child::after,.linea li.ultima::after{display:none}
.linea li:hover::before,.linea li:focus-within::before{background:var(--c)}
.linea a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 24px;align-items:baseline;padding:var(--p) 0}
.linea-n{grid-column:1;font-size:.76rem;font-weight:700;letter-spacing:.14em;color:var(--c)}
.linea-t{grid-column:1;font-size:clamp(1.14rem,1.9vw,1.5rem);font-weight:800;line-height:1.18;letter-spacing:-.008em;transition:color .2s}
.linea-d{grid-column:1;max-width:620px;font-size:1rem;line-height:1.45;color:var(--spento)}
.linea-m{grid-column:2;grid-row:2;font-size:.84rem;font-weight:500;white-space:nowrap;color:rgba(255,255,255,.62);font-variant-numeric:tabular-nums}
.linea a:hover .linea-t,.linea a:focus-visible .linea-t{color:var(--c)}
.blog-niente{padding:40px 0;font-size:1.2rem;color:var(--spento)}
@media (max-width:820px){
  .percorso{grid-template-columns:minmax(0,1fr)}
  .percorso-testa{position:static}
  .linea-m{grid-column:1;grid-row:auto}
}
@media (prefers-reduced-motion:reduce){.linea li::before,.linea-t{transition:none}}

.blog-eroe .pagina-titolo span{display:block}
