/* =====================================================================
   FF Theme · archivio degli articoli (/articoli/), dopo pagina.css e blog.css
   Dal concept pagine/federicofloris-articoli-concept.html («ARCHIVIO ARTICOLI»):
   in evidenza (una scheda grande e due di lato), barra dei filtri ferma sotto l'header, griglia di schede.
   ===================================================================== */

/* mini indice degli argomenti nell'apertura: il numero di articoli al posto della freccia */
.ff-ar-jump i{font:400 .7rem/1 var(--ff-mono)!important}

/* ===== In evidenza: uno grande a sinistra, due a destra ===== */
.ff-ar-feat{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);grid-template-rows:repeat(2,auto);gap:clamp(16px,1.8vw,28px);margin-top:clamp(40px,7vh,72px)}
.ff-post--big{grid-row:span 2}
.ff-post--big .ff-post-b b{font-size:clamp(1.6rem,2.6vw,2.4rem);letter-spacing:-.03em;line-height:1.08}
.ff-post--big .ff-post-b{padding:clamp(20px,2.4vw,32px)}
.ff-post--side a{grid-template-columns:minmax(0,.9fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
/* la copertina riempie tutta l'altezza della scheda laterale (alta metà della scheda grande) */
.ff-post--side .ff-cov{border-bottom:0;border-right:1px solid var(--line);aspect-ratio:auto;height:100%;min-height:9rem}

/* ===== Barra dei filtri: ferma sotto l'header ===== */
.ff-ar-elenco{scroll-margin-top:var(--ff-head)}
.ff-ar-bar{position:sticky;top:var(--ff-head);z-index:3;display:flex;align-items:center;gap:16px 28px;margin-top:clamp(56px,9vh,96px);padding:14px 0;background:var(--bg);border-bottom:1px solid var(--line)}
.ff-ar-tabs{display:flex;gap:6px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
.ff-ar-tabs::-webkit-scrollbar{display:none}
.ff-ar-tabs.ff-ovf{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--fl,0px),#000 calc(100% - var(--fr,36px)),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 var(--fl,0px),#000 calc(100% - var(--fr,36px)),transparent 100%)}
.ff-ar-tabs button{flex:none;padding:9px 14px;border:1px solid var(--line);background:none;color:var(--fg);font:500 .92rem/1 var(--ff-sans);cursor:pointer;white-space:nowrap;transition:background-color var(--ff-t-fast),color var(--ff-t-fast),border-color var(--ff-t-fast)}
.ff-ar-tabs button small{margin-left:4px;font:400 .68rem/1 var(--ff-mono);color:var(--muted)}
.ff-ar-tabs button:hover{border-color:var(--fg)}
.ff-ar-tabs button[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.ff-ar-tabs button[aria-pressed="true"] small{color:inherit;opacity:.7}
.ff-ar-bar .ff-fsearch{flex:0 1 18rem;min-width:12rem}
.ff-ar-count{margin:18px 0 0;font-size:.68rem;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.ff-ar-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,1.8vw,28px);margin-top:18px}
.ff-ar-empty{margin:24px 0 0;color:var(--muted)}
.ff-ar-empty .ff-link{color:var(--fg)}
.ff-ar-more{display:flex;justify-content:center;margin-top:clamp(32px,5vh,48px)}
.ff-ar-more small{margin-left:8px;font:400 .68rem/1 var(--ff-mono);color:var(--muted)}
/* schede nascoste dai filtri o oltre il blocco di 12 */
.ff-ar-grid .ff-post[hidden]{display:none}

/* senza JavaScript: niente barra (filtri e ricerca non farebbero nulla), si vedono tutti gli articoli */
html:not(.ff-js) .ff-ar-bar{display:none}
html:not(.ff-js) .ff-ar-count{margin-top:clamp(56px,9vh,96px)}

@media (max-width:1180px){
  .ff-ar-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ff-ar-feat{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .ff-post--big{grid-column:1/-1;grid-row:auto}
  .ff-post--big a{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);grid-template-rows:none}
  /* scheda grande orizzontale (tablet): la copertina riempie tutta l'altezza della scheda */
  .ff-post--big .ff-cov{border-bottom:0;border-right:1px solid var(--line);aspect-ratio:auto;align-self:stretch;min-height:16rem}
  .ff-post--side a{grid-template-columns:none;grid-template-rows:auto 1fr}
  .ff-post--side .ff-cov{border-right:0;border-bottom:1px solid var(--line);aspect-ratio:16/10;min-height:0}
}
@media (max-width:899px){
  /* barra a tutta larghezza, argomenti sopra e ricerca sotto */
  .ff-ar-bar{flex-direction:column;align-items:stretch;gap:10px;margin-left:calc(var(--ff-pad-l) * -1);margin-right:calc(var(--ff-pad-r) * -1);padding:10px var(--ff-pad-r) 10px var(--ff-pad-l)}
  .ff-ar-bar .ff-fsearch{flex:none;min-width:0}
}
@media (max-width:599px){
  .ff-ar-grid,.ff-ar-feat{grid-template-columns:1fr}
  .ff-post--big a{grid-template-columns:none;grid-template-rows:auto 1fr}
  .ff-post--big .ff-cov{border-right:0;border-bottom:1px solid var(--line);aspect-ratio:16/10;min-height:0}
  .ff-ar-jump{display:none}
  .ff-page .ff-scene.ff-hero .ff-actions{flex-wrap:wrap;overflow:visible;-webkit-mask-image:none;mask-image:none;margin-inline:0;padding-inline:0}
}
