/* =========================================================
   Eroul-calendar de handbal — același sistem ca la fotbal
   (erou-fotbal.css): echipa decupată stă pe banda cu tăietura
   diagonală, sub calendar, și urcă peste el.
   ========================================================= */
.erou-handbal {
  /* banda de jos rezervată echipei (de la ea pornesc diagonala și centrul) */
  --jucatori-inalt: clamp(380px, 60vh, 640px);

  /* ============ SCARA ECHIPEI — modifică DOAR cifra asta ============
     Imaginea e ancorată JOS (tălpile pe marginea eroului) și crește în
     sus, peste calendar. 1 = cât banda; 1.5 = cu 50% mai mare; 1.8 = și
     mai sus peste calendar.
     Măsurat la 1290×870: 1.2 urca 130px peste grilă (2,4 rânduri de
     calendar) — prea mult, cum a spus Teo; 1.06 urcă 57px, adică un rând,
     „puțin peste”. Prețul: fetele sunt cu ~12% mai mici. */
  --echipa-scara: 1.06;
}

/* centrarea din margin-left, ca la fotbal (transformul rămâne al GSAP):
   0.449 = jumătate din raportul nativ al PNG-ului de handbal (898/1000) */
.erou-handbal .erou-echipa {
  height: calc(var(--jucatori-inalt) * var(--echipa-scara));
  margin-left: calc(var(--jucatori-inalt) * var(--echipa-scara) * -0.449);
}

@media (max-width: 880px) {
  /* în flux, sub calendar — grupul e îngust, nu-l lățim pe tot ecranul */
  .erou-handbal .erou-echipa {
    height: auto;
    width: min(88%, 520px);
    margin: 20px auto 0;
  }
}