/* ---------------------------------------------------------- caruselul campaniilor
   Folosit de ambele profiluri: cel simplu (beta1, beta3) si cel modern (beta2, beta4).
   Cerut de Zamfir pe 24.09.2026: intai „cele pare mai moderne, cu carusel", apoi
   „ce este o de pus si la beta impare caruselul cu campaniile".

   Reguli tinute: merge si fara JavaScript (fara script, toate slide-urile raman
   vizibile, unul sub altul), nu porneste singur daca omul a cerut mai putina miscare,
   butoanele sunt butoane reale, cu eticheta citita de cititorul de ecran, iar culorile
   vin din variabilele temei, ca sa treaca contrastul si pe tema intunecata. */
.carusel { position: relative; margin-top: 1rem; }
.carusel__pista {
  border: 1px solid var(--c-linie);
  border-radius: 14px;
  background: var(--c-fundal);
  padding: 1.6rem 1.8rem;
  min-height: 12.5rem;
  box-shadow: 0 1px 2px rgba(0,0,0,.05);
}
.carusel__slide { animation: carusel-apare .28s ease-out; }
@keyframes carusel-apare { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
/* Fara JavaScript slide-urile stau unul sub altul; despartitorul apare doar atunci. */
.carusel__slide + .carusel__slide { margin-top: 1.4rem; border-top: 1px solid var(--c-linie); padding-top: 1.4rem; }
.carusel__nr {
  margin: 0 0 .35rem; font-size: .8rem; letter-spacing: .06em; text-transform: uppercase;
  color: var(--c-text-slab);
}
.carusel__titlu { margin: 0 0 .3rem; font-size: 1.35rem; }
.carusel__sub { margin: 0 0 .6rem; font-size: .92rem; color: var(--c-text-slab); }
.carusel__text { margin: 0; }
.carusel__comenzi { display: flex; align-items: center; gap: .75rem; margin-top: .9rem; }
.carusel__sageata {
  min-width: 2.75rem; min-height: 2.75rem; border-radius: 50%;
  border: 1px solid var(--c-linie); background: var(--c-fundal);
  font-size: 1.4rem; line-height: 1; cursor: pointer; color: inherit;
}
.carusel__sageata:hover { background: var(--c-fundal-slab); }
.carusel__puncte { display: flex; gap: .45rem; flex: 1; justify-content: center; }
.carusel__punct {
  width: .85rem; height: .85rem; padding: 0; border-radius: 50%; cursor: pointer;
  border: 1px solid var(--c-accent); background: transparent;
}
.carusel__punct[aria-selected="true"] { background: var(--c-accent); }
.carusel__toate { margin-top: .7rem; font-size: .95rem; }
@media (prefers-reduced-motion: reduce) { .carusel__slide { animation: none; } }
@media (max-width: 640px) {
  .carusel__pista { padding: 1.2rem; min-height: 14rem; }
  .carusel__titlu { font-size: 1.15rem; }
}