.boton-beca-fijo {
  position: fixed;
  top: 40%;
  right: 15px;
  transform: translateY(-50%) rotate(-90deg);
  transform-origin: right center;
  background-color: #00367e !important;
  color: white;
  padding: 0.6rem 1rem;
  z-index: 1050;
  transition: all 0.3s ease;
}

.boton-whatsapp-fijo {
  position: fixed;
  top: 60%;
  right: 15px;
  transform: translateY(-50%) rotate(-90deg);
  transform-origin: right center;
  background-color: #25D366 !important;
  border-color: #25D366 !important;
  color: white;
  padding: 0.6rem 1rem;
  z-index: 1050;
  transition: all 0.3s ease;
}

.boton-beca-fijo:hover {
  background-color: #012d6c !important;
}

.boton-whatsapp-fijo:hover {
  background-color: #1ebe5d !important;
}

.botones-flotantes-movil {
  display: none;
}

/* SOLO MOSTRAR BOTONES GIRADOS EN ESCRITORIO (≥992px) */
@media (min-width: 1792px) {
  .botones-flotantes {
    display: block;
  }
  .botones-flotantes-movil {
    display: none !important;
  }
}

/* MOSTRAR BOTONES INFERIORES EN MÓVIL (≤991px) */
@media (max-width: 1791px) {
  .botones-flotantes {
    display: none !important;
  }

  .botones-flotantes-movil {
    position: fixed;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1050;
    display: flex;
    gap: 10px;
    flex-wrap: nowrap;
    padding: 0 10px;
  }

  .boton-flotante-movil {
    border-radius: 30px;
    padding: 10px 14px;
    font-size: 0.9rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    white-space: nowrap;
    animation: aparecer-flotante 0.4s ease-out forwards;
    opacity: 0;
  }

  .btn-beca-movil {
    background-color: #00367e !important;
    color: white;
  }

  .btn-beca-movil:hover {
    background-color: #012d6c !important;
  }

  .btn-whatsapp-movil {
    background-color: #25D366 !important;
    border-color: #25D366 !important;
    color: white;
  }

  .btn-whatsapp-movil:hover {
    background-color: #1ebe5d !important;
  }

  .botones-flotantes-movil a:nth-child(1) {
    animation-delay: 0.2s;
  }

  .botones-flotantes-movil a:nth-child(2) {
    animation-delay: 0.3s;
  }

  @keyframes aparecer-flotante {
    from {
      opacity: 0;
      transform: translateY(10px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
}