.filtre{display:flex;gap:12px;flex-wrap:wrap;margin-top:40px}
.filtru{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 24px;
  border:1px solid var(--linie);font:500 11px/1 var(--f);letter-spacing:.18em;text-transform:uppercase;
  text-decoration:none;color:var(--fum);transition:var(--t)}
.filtru:hover{border-color:var(--aur);color:var(--alb)}
.filtru[aria-current=page]{background:var(--aur);border-color:var(--aur);color:var(--negru)}
/* Fișa de încheiere: umple locurile rămase pe ultimul rând și devine o chemare,
   nu o celulă goală. Se întinde exact peste cât a rămas liber. */
.piesa.incheiere{background:transparent;border-color:var(--aur);display:flex;align-items:center}
.piesa.incheiere:hover{background:rgba(187,157,123,.05)}
.piesa.incheiere .text{padding:40px 36px}
.piesa.incheiere .nume{font-weight:200;font-size:clamp(24px,2.6vw,34px);line-height:1.15;margin:0 0 16px}
.piesa.incheiere .spec{font-family:var(--f);font-size:16px;line-height:1.7;max-width:42ch;color:var(--fum)}
.piesa.incheiere .semn{display:inline-block;margin-top:24px;font:500 11px var(--f);
  letter-spacing:.18em;text-transform:uppercase;color:var(--aur);
  padding-bottom:4px;border-bottom:1px solid var(--aur)}

/* ---------- grilele de piese pe ecran mic ----------
   O coloana inseamna nouasprezece ecrane de derulat pentru douazeci si sapte de
   piese: nimeni nu ajunge la capat. Doua coloane injumatatesc drumul. Regulile
   acopera toate cele trei grile de piese: colectia, piesele alese de pe pagina
   de deschidere si cele inrudite de pe fisa.
   Pana la 900 de pixeli, doua coloane. Banda dintre 641 si 900, unde grila
   generala trece deja pe o coloana, era cea mai rea de pe tot site-ul: pe o
   tableta in picioare, o fisa de 604 pixeli pe rand insemna douazeci si opt de
   ecrane de derulat. */
@media(max-width:900px){
  #lista-piese.g3,
  #piese-alese.g4,
  #alte-piese.g4{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Sub 640, fisa scade sub doua sute de pixeli si textul se stramteaza cu ea. */
@media(max-width:640px){
  #lista-piese.g3,
  #piese-alese.g4,
  #alte-piese.g4{gap:12px}

  #lista-piese .piesa .text,
  #piese-alese .piesa .text,
  #alte-piese .piesa .text{padding:14px 14px 16px}

  #lista-piese .piesa .nivel,
  #piese-alese .piesa .nivel,
  #alte-piese .piesa .nivel{font-size:9px;letter-spacing:.14em;margin-bottom:5px}

  #lista-piese .piesa .nume,
  #piese-alese .piesa .nume,
  #alte-piese .piesa .nume{font-size:15px;line-height:1.25;margin-bottom:5px}

  #lista-piese .piesa .spec,
  #piese-alese .piesa .spec,
  #alte-piese .piesa .spec{font-size:11px;line-height:1.5}

  /* fisa de incheiere ramane o chemare, deci isi pastreaza aerul */
  #lista-piese .piesa.incheiere .text{padding:28px 22px}
  #lista-piese .piesa.incheiere .nume{font-size:24px}
  #lista-piese .piesa.incheiere .spec{font-size:15px}
}