/* =============================================================================
   PAGINA ARTICOLO
   Registro rassegna. La priorita' qui e' una sola: la lettura lunga.
   Tutto il resto — colonna dei dati, tassonomie, correlati — sta intorno alla
   colonna di testo senza restringerla.
   ========================================================================== */

/* --- intestazione ----------------------------------------------------------- */
.lm-art__intestazione{
  padding-block:calc(var(--lm-sp-7) * var(--lm-densita)) var(--lm-sp-6);
  border-bottom:var(--lm-bordo) solid var(--lm-riga);
}
.lm-art__rubriche{
  display:flex; flex-wrap:wrap; gap:var(--lm-sp-1) var(--lm-sp-3);
  font-family:var(--lm-font-ui); font-size:var(--lm-passo-000); font-weight:var(--lm-peso-forte);
  letter-spacing:var(--lm-cren-etichetta); text-transform:uppercase;
}
.lm-art__rubriche a{ color:var(--lm-accento-testo); text-decoration:none; display:inline-flex; align-items:center; min-height:24px; }
.lm-art__rubriche a:hover{ text-decoration:underline; }
.lm-art__titolo{
  font-family:var(--lm-font-titolo); font-weight:var(--lm-titolo-peso);
  font-size:var(--lm-passo-5); line-height:var(--lm-int-stretta);
  letter-spacing:var(--lm-titolo-cren); margin:var(--lm-sp-3) 0 0;
  max-width:22ch;                     /* misura da titolo, non da paragrafo */
  overflow-wrap:break-word;
}
.lm-art__sommario{
  font-size:var(--lm-passo-3); line-height:1.44; color:var(--lm-testo-2);
  margin-top:var(--lm-sp-4); max-width:52ch;
}
.lm-art__meta{
  display:flex; flex-wrap:wrap; gap:var(--lm-sp-2) var(--lm-sp-5);
  margin-top:var(--lm-sp-5);
  font-family:var(--lm-font-ui); font-size:var(--lm-passo-000);
  letter-spacing:.13em; text-transform:uppercase; color:var(--lm-testo-3);
  font-variant-numeric:tabular-nums;
}
.lm-art__meta b{ color:var(--lm-testo); font-weight:var(--lm-peso-forte); }

/* --- immagine di apertura ---------------------------------------------------- */
.lm-art__figura{ margin:0; padding-block:var(--lm-sp-6); border-bottom:var(--lm-bordo) solid var(--lm-riga); }
.lm-art__figura img{
  width:100%; height:auto; display:block; margin-inline:auto;
  /* come in homepage: l'immagine non si taglia e non si deforma.
     E non si ingrandisce: --lm-figura-max porta la larghezza naturale
     dell'allegato, cosi' un originale da 500px non viene stirato a 1192.
     Il valore lo scrive il PHP, che le dimensioni le conosce. */
  max-width:min(100%, var(--lm-figura-max, 100%));
  object-fit:contain; background:var(--lm-superficie-cava);
}
.lm-art__figura--verticale img{ width:auto; max-width:min(100%, var(--lm-figura-max, 460px), 460px); }
.lm-art__figura figcaption{
  font-family:var(--lm-font-ui); font-size:var(--lm-passo-00); color:var(--lm-testo-3);
  margin-top:var(--lm-sp-3); padding-top:var(--lm-sp-2);
  border-top:var(--lm-bordo) solid var(--lm-riga-tenue); max-width:var(--lm-misura);
}

/* --- corpo: colonna dei dati + colonna di lettura ---------------------------- */
.lm-art__corpo{
  display:grid;
  /* La colonna centrale si dimensiona sul max-width dell'elemento di lettura,
     che e' l'unico posto dove --lm-misura si risolve col corpo giusto. */
  grid-template-columns:var(--lm-colonna-dati) minmax(0,auto) minmax(0,1fr);
  gap:0 var(--lm-sp-7);
  padding-block:calc(var(--lm-sp-7) * var(--lm-densita));
  align-items:start;
}
.lm-art__dati{ position:sticky; top:var(--lm-sp-5); }
.lm-art__dato{
  padding-block:var(--lm-sp-3);
  border-top:var(--lm-bordo) solid var(--lm-riga-tenue);
  font-family:var(--lm-font-ui); font-size:var(--lm-passo-000);
  letter-spacing:.13em; text-transform:uppercase; color:var(--lm-testo-3);
}
.lm-art__dato:first-child{ border-top:var(--lm-bordo-forte) solid var(--lm-testo); }
.lm-art__dato b{
  display:block; font-family:var(--lm-font-titolo); font-weight:var(--lm-titolo-peso);
  font-size:var(--lm-passo-3); letter-spacing:0; text-transform:none;
  color:var(--lm-testo); margin-top:var(--lm-sp-1);
  font-variant-numeric:lining-nums tabular-nums;
}
.lm-art__dato small{ display:block; font-size:var(--lm-passo-000); color:var(--lm-testo-3); text-transform:none; letter-spacing:0; margin-top:2px; }

@media (max-width:1024px){
  .lm-art__corpo{ grid-template-columns:minmax(0,1fr); gap:var(--lm-sp-5); }
  .lm-art__dati{ position:static; display:flex; flex-wrap:wrap; gap:var(--lm-sp-6); }
  .lm-art__dato{ border-top:0; padding-block:0; }
  .lm-art__dato:first-child{ border-top:0; }
  .lm-art__dato b{ font-size:var(--lm-passo-2); }
  .lm-art__dati{ padding-bottom:var(--lm-sp-4); border-bottom:var(--lm-bordo) solid var(--lm-riga); }
}

/* --- il testo ---------------------------------------------------------------- */
.lm-art__testo{
  font-size:var(--lm-passo-2); line-height:var(--lm-int-lettura); color:var(--lm-testo-2);
  max-width:var(--lm-misura);        /* unico punto in cui la misura si applica */
}
/* Azzeramento dei margini nativi PRIMA della regola di ritmo, e dentro :where()
   per non alzare la specificita': con «.lm-art__testo p{margin:0}» (0,1,1) la
   regola di spaziatura (0,1,0) perdeva e i paragrafi restavano attaccati. */
.lm-art__testo :where(p, ul, ol, blockquote, figure, pre){ margin:0; }
.lm-art__testo > * + *{ margin-top:var(--lm-sp-5); }
.lm-art__testo h2{
  font-family:var(--lm-font-titolo); font-weight:var(--lm-titolo-peso);
  font-size:var(--lm-passo-4); line-height:var(--lm-int-media);
  letter-spacing:var(--lm-titolo-cren); color:var(--lm-testo);
  margin-top:var(--lm-sp-7);          /* piu' aria sopra che sotto: lega il titolo al suo testo */
  max-width:26ch;
}
.lm-art__testo h2 + p{ margin-top:var(--lm-sp-4); }
.lm-art__testo h3{
  font-family:var(--lm-font-titolo); font-size:var(--lm-passo-3);
  color:var(--lm-testo); margin-top:var(--lm-sp-6);
}
.lm-art__testo a{ color:var(--lm-testo); text-decoration:underline; text-decoration-color:var(--lm-accento); text-underline-offset:.18em; }
.lm-art__testo a:hover{ color:var(--lm-accento-testo); text-decoration-thickness:2px; }
.lm-art__testo strong{ color:var(--lm-testo); font-weight:var(--lm-peso-forte); }
.lm-art__testo ul, .lm-art__testo ol{ padding-left:1.4em; margin-block:0; }
.lm-art__testo li + li{ margin-top:var(--lm-sp-2); }
.lm-art__testo img{ width:100%; height:auto; margin-block:var(--lm-sp-5); }
.lm-art__testo blockquote{
  font-family:var(--lm-font-titolo); font-size:var(--lm-passo-4); font-style:italic;
  line-height:1.26; color:var(--lm-testo); max-width:var(--lm-misura-stretta);
  margin-block:var(--lm-sp-6); padding-left:var(--lm-sp-5);
  border-left:var(--lm-bordo-forte) solid var(--lm-accento);
}
/* Capolettera sul primo paragrafo, solo in rassegna.
   first-child e non first-of-type: tre articoli d'archivio cominciano con un
   sottotitolo, e li' first-of-type metteva il capolettera sul paragrafo DOPO
   il titolo, cioe' in mezzo all'articolo. Un articolo che si apre con un
   titolo non vuole il capolettera: sono 80 su 83 quelli che si aprono con un
   paragrafo, e sono quelli che lo prendono. */
.registro-rassegna .lm-art__testo > p:first-child::first-letter{
  font-family:var(--lm-font-titolo); font-size:3.4em; float:left;
  line-height:.84; padding:.06em .26em 0 0; color:var(--lm-accento);
}

/* Schermi molto stretti: sotto i 360px una colonna da 280px a 19px dava 30
   caratteri per riga, sotto la soglia comoda per la lettura lunga (32-52 su
   mobile). Un gradino in meno porta la riga a 33 caratteri. Sopra i 360px il
   corpo resta a 19px: li' la misura e' gia' giusta. */
@media (max-width:360px){
  .lm-art__testo{ font-size:var(--lm-passo-1); }
}

/* --- tassonomie in coda ------------------------------------------------------- */
.lm-art__tassonomie{
  padding-block:var(--lm-sp-6);
  border-top:var(--lm-bordo) solid var(--lm-riga);
  display:flex; flex-wrap:wrap; gap:var(--lm-sp-5);
}
.lm-art__gruppo{ flex:1 1 260px; min-width:0; }
.lm-art__gruppo h2{
  font-family:var(--lm-font-ui); font-size:var(--lm-passo-000); font-weight:var(--lm-peso-forte);
  letter-spacing:var(--lm-cren-etichetta); text-transform:uppercase; color:var(--lm-testo-3);
  margin:0 0 var(--lm-sp-3);
}
.lm-art__etichette{ display:flex; flex-wrap:wrap; gap:var(--lm-sp-2); list-style:none; margin:0; padding:0; }
.lm-art__etichette a{
  display:inline-flex; align-items:center; min-height:24px;
  font-family:var(--lm-font-ui); font-size:var(--lm-passo-00);
  padding:var(--lm-sp-1) var(--lm-sp-3);
  border:var(--lm-bordo) solid var(--lm-riga); border-radius:var(--lm-raggio);
  color:var(--lm-testo-2); text-decoration:none;
}
.lm-art__etichette a:hover{ border-color:var(--lm-accento); color:var(--lm-accento-testo); }

/* --- box autore ---------------------------------------------------------------- */
.lm-autore{
  display:grid; grid-template-columns:96px minmax(0,1fr); gap:var(--lm-sp-5);
  padding-block:var(--lm-sp-6); border-top:var(--lm-bordo) solid var(--lm-riga);
  align-items:start;
}
.lm-autore__ritratto{ width:96px; height:96px; border-radius:50%; object-fit:cover; }
.lm-autore__etichetta{
  font-family:var(--lm-font-ui); font-size:var(--lm-passo-000); font-weight:var(--lm-peso-forte);
  letter-spacing:var(--lm-cren-etichetta); text-transform:uppercase; color:var(--lm-testo-3);
}
.lm-autore__nome{
  font-family:var(--lm-font-titolo); font-weight:var(--lm-titolo-peso);
  font-size:var(--lm-passo-3); margin:var(--lm-sp-1) 0 0;
}
.lm-autore__bio{ font-size:var(--lm-passo-1); color:var(--lm-testo-2); margin-top:var(--lm-sp-2); max-width:60ch; line-height:1.6; }
@media (max-width:640px){
  .lm-autore{ grid-template-columns:1fr; }
  .lm-autore__ritratto{ width:72px; height:72px; }
}

/* --- correlati ------------------------------------------------------------------ */
.lm-correlati{ padding-block:calc(var(--lm-sp-7) * var(--lm-densita)); border-top:var(--lm-bordo-forte) solid var(--lm-testo); }
.lm-correlati__lista{
  list-style:none; margin:var(--lm-sp-5) 0 0; padding:0;
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0;
}
.lm-correlati__voce{
  padding:0 var(--lm-sp-5); border-right:var(--lm-bordo) solid var(--lm-riga); min-width:0;
}
.lm-correlati__voce:first-child{ padding-left:0; }
.lm-correlati__voce:last-child{ padding-right:0; border-right:0; }
@media (max-width:1024px){
  .lm-correlati__lista{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--lm-sp-5) 0; }
  .lm-correlati__voce:nth-child(2n){ border-right:0; padding-right:0; }
  .lm-correlati__voce:nth-child(2n+1){ padding-left:0; }
}
@media (max-width:640px){
  .lm-correlati__lista{ grid-template-columns:1fr; }
  .lm-correlati__voce{ padding:var(--lm-sp-5) 0; border-right:0; border-bottom:var(--lm-bordo) solid var(--lm-riga); }
  .lm-correlati__voce:last-child{ border-bottom:0; padding-bottom:0; }
}

/* Senza ritratto la griglia dell'autore torna a una colonna sola: riservare
   la traccia da 96px lasciava un vuoto alla sinistra del testo. Il ritratto,
   quando ci sarà, è un allegato della Media Library — mai un avatar remoto. */
.lm-autore--senza-ritratto{ grid-template-columns: minmax(0,1fr); }