/* --- Box Universale con animazione hover (tema #7B68EE) --- */
.box_docs_search {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 280px;
  height: 180px;
  margin: 15px;
  padding: 20px;
  background: rgba(47, 39, 94, 0.85); /* viola scuro trasparente */
  border-radius: 20px;
  box-shadow: 0 6px 18px rgba(123,104,238,0.3); /* neon base */
  color: #fff;
  cursor: pointer;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Effetto hover (animazione principale) */
.box_docs_search:hover {
  transform: translateY(-10px) scale(1.03);
  box-shadow: 0 0 20px rgba(123,104,238,0.6),
              0 0 40px rgba(123,104,238,0.4); /* glow neon */
}

/* Contenuto interno */
.box_docs_search-content {
  text-align: center;
  z-index: 2;
}

.box_docs_search-icon {
  font-size: 40px;           /* dimensione uniforme per tutte le icone font */
  width: 40px;               /* larghezza fissa se usi <img> */
  height: 40px;              /* altezza fissa se usi <img> */
  margin-bottom: 10px;
  display: inline-flex;      /* mantiene icona centrata */
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease, text-shadow 0.3s ease;
  color: #FFFFFF;            /* colore icona */
}

.box_docs_search:hover .box_docs_search-icon {
  transform: rotate(8deg) scale(1.1);
  text-shadow: 0 0 8px rgba(123,104,238,0.8),
               0 0 16px rgba(123,104,238,0.6); /* glow icona */
}

.box_docs_search-title {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 6px;
  color: #FFFFFF;
}

.box_docs_search-text {
  font-size: 14px;
  opacity: 0.8;
  color: #D9D5F0; /* testo lilla chiaro */
}

/* --- Effetto luce in hover (sfondo animato) --- */
.box_docs_search::before {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle,
    rgba(123,104,238,0.25) 0%,
    rgba(179,168,249,0.15) 40%,
    transparent 70%);
  transform: rotate(25deg);
  transition: opacity 0.4s ease;
  opacity: 0;
  z-index: 1;
}

.box_docs_search:hover::before {
  opacity: 1;
}

#choose {
  display: flex;
  justify-content: center;
  align-items: center;  /* allinea verticalmente */
  gap: 32px;
  flex-wrap: wrap;
}


