/* Announcements carousel — height */
.announcements-section .carousel { position: relative; }
.announcements-section .carousel .carousel-inner { min-height: 180px; }
@media (min-width: 768px){
  .announcements-section .carousel .carousel-inner { min-height: 220px; }
}

/* 1) Κάνε τα βελάκια ορατά και όμορφα, χωρίς να «σκεπάζουν» το slide */
.announcements-section .carousel-control-prev,
.announcements-section .carousel-control-next{
  width: 3rem;              /* default 15% → μικρό, δεν εμποδίζει τα CTA */
  opacity: .9;
}
.announcements-section .carousel-control-prev:hover,
.announcements-section .carousel-control-next:hover{ opacity: 1; }

.announcements-section .carousel-control-prev-icon,
.announcements-section .carousel-control-next-icon{
  width: 2.25rem;
  height: 2.25rem;
  background-color: rgba(0,0,0,.35);  /* κύκλος πίσω από το άσπρο βελάκι */
  border-radius: 50%;
  background-size: 60% 60%;
  background-position: center;
  background-repeat: no-repeat;
}

/* 2) Εξασφάλισε ότι το κουμπί CTA είναι πάντα clickable πάνω από τα controls */
.announcements-section .btn-brand{
  position: relative;
  z-index: 3;
}

/* 3) Δείξε ξεκάθαρα τους «κύκλους» ένδειξης (indicators) */
.announcements-section .carousel-indicators{ bottom: .5rem; }
.announcements-section .carousel-indicators [data-bs-target]{
  width: 10px; height: 10px; border-radius: 50%;
  background-color: #0f4f65;  /* χρώμα brand */
  opacity: .25;
}
.announcements-section .carousel-indicators .active{ opacity: .9; }