.footer .icon {
  color: #F2F2F2;
  font-size: 28px;
  margin-right: 15px;
}

/* Títulos */
.footer h4 {
  color: #F2F2F2;
  font-weight: 600;
}

/* Texto del footer */
.footer p,
.footer span,
.footer strong,
.footer .credits,
.footer .copyright {
  color: #ffffff;
}

/* Fondo del footer (opcional) */
.footer {
  background: #1b1b1b;
}

.floating-btn,
.scroll-top {
  position: fixed;
  right: 10px;
  width: 60px !important;
  height: 60px !important;
  min-width: 50px;
  min-height: 50px;
  padding: 0 !important;
  border-radius: 50%;
  display: flex !important;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border: none !important;
  outline: none !important;
  color: #fff !important;
  transition: all .3s ease;
  z-index: 9999;
}

/* WhatsApp */
.floating-btn.whatsapp {
  bottom: 160px;
  background: #28d166;
  box-shadow:
    0 4px 12px rgba(0, 0, 0, .25),
    0 0 8px rgba(37, 211, 102, .35),
    0 0 16px rgba(37, 211, 102, .18);
  animation: pulse-whatsapp 3s ease-in-out infinite;
}

/* Correo */
.floating-btn.email {
  bottom: 90px;
  background: #05C7F2;
  box-shadow:
    0 4px 12px rgba(0, 0, 0, .25),
    0 0 8px rgba(5, 199, 242, .35),
    0 0 16px rgba(5, 199, 242, .18);
  animation: pulse-email 3s ease-in-out infinite;
}

/* Scroll Top */
.scroll-top {
  bottom: 20px;
  background: #ed3e4d !important;
  visibility: visible !important;
  opacity: 1 !important;
  box-shadow:
    0 4px 12px rgba(0, 0, 0, .25),
    0 0 8px rgba(237, 62, 77, .35),
    0 0 16px rgba(237, 62, 77, .18);
  animation: pulse-scrolltop 3s ease-in-out infinite;
}

/* Iconos */
.floating-btn i,
.scroll-top i {
  font-size: 28px !important;
  line-height: 1;
}

/* Hover */
.floating-btn:hover,
.scroll-top:hover {
  transform: translateY(-4px);
  color: #fff !important;
}

/* Quitar borde negro */
.floating-btn.whatsapp:focus,
.floating-btn.whatsapp:active {
  outline: none !important;
  border: none !important;
  box-shadow:
    0 4px 12px rgba(0, 0, 0, .25),
    0 0 8px rgba(37, 211, 102, .35),
    0 0 16px rgba(37, 211, 102, .18) !important;
}

.floating-btn.email:focus,
.floating-btn.email:active {
  outline: none !important;
  border: none !important;
  box-shadow:
    0 4px 12px rgba(0, 0, 0, .25),
    0 0 8px rgba(5, 199, 242, .35),
    0 0 16px rgba(5, 199, 242, .18) !important;
}

.scroll-top:focus,
.scroll-top:active {
  outline: none !important;
  border: none !important;
  box-shadow:
    0 4px 12px rgba(0, 0, 0, .25),
    0 0 8px rgba(237, 62, 77, .35),
    0 0 16px rgba(237, 62, 77, .18) !important;
}

/* Animaciones de pulso neón (muy sutiles) */
@keyframes pulse-whatsapp {

  0%,
  100% {
    box-shadow:
      0 4px 12px rgba(0, 0, 0, .25),
      0 0 8px rgba(37, 211, 102, .35),
      0 0 16px rgba(37, 211, 102, .18);
  }

  50% {
    box-shadow:
      0 4px 12px rgba(0, 0, 0, .25),
      0 0 10px rgba(37, 211, 102, .45),
      0 0 20px rgba(37, 211, 102, .25);
  }
}

@keyframes pulse-email {

  0%,
  100% {
    box-shadow:
      0 4px 12px rgba(0, 0, 0, .25),
      0 0 8px rgba(5, 199, 242, .35),
      0 0 16px rgba(5, 199, 242, .18);
  }

  50% {
    box-shadow:
      0 4px 12px rgba(0, 0, 0, .25),
      0 0 10px rgba(5, 199, 242, .45),
      0 0 20px rgba(5, 199, 242, .25);
  }
}

@keyframes pulse-scrolltop {

  0%,
  100% {
    box-shadow:
      0 4px 12px rgba(0, 0, 0, .25),
      0 0 8px rgba(237, 62, 77, .35),
      0 0 16px rgba(237, 62, 77, .18);
  }

  50% {
    box-shadow:
      0 4px 12px rgba(0, 0, 0, .25),
      0 0 10px rgba(237, 62, 77, .45),
      0 0 20px rgba(237, 62, 77, .25);
  }
}

/* Hover: leve intensificación */
.floating-btn.whatsapp:hover {
  box-shadow:
    0 4px 12px rgba(0, 0, 0, .25),
    0 0 10px rgba(37, 211, 102, .5),
    0 0 22px rgba(37, 211, 102, .28) !important;
}

.floating-btn.email:hover {
  box-shadow:
    0 4px 12px rgba(0, 0, 0, .25),
    0 0 10px rgba(5, 199, 242, .5),
    0 0 22px rgba(5, 199, 242, .28) !important;
}

.scroll-top:hover {
  box-shadow:
    0 4px 12px rgba(0, 0, 0, .25),
    0 0 10px rgba(237, 62, 77, .5),
    0 0 22px rgba(237, 62, 77, .28) !important;
}

/* Responsive */
@media (max-width: 768px) {

  .floating-btn,
  .scroll-top {
    width: 50px !important;
    height: 50px !important;
    min-width: 50px;
    min-height: 50px;
    right: 15px;
  }

  .floating-btn.whatsapp {
    bottom: 145px;
  }

  .floating-btn.email {
    bottom: 82px;
  }

  .scroll-top {
    bottom: 20px;
  }

  .floating-btn i,
  .scroll-top i {
    font-size: 24px !important;
  }
}

/* ===========================
   REDES SOCIALES
   =========================== */

.footer .social-links {
  display: flex;
  gap: 10px;
}

.footer .social-links a {
  width: 42px;
  height: 42px;
  border: 2px solid #F2F2F2;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #F2F2F2;
  font-size: 18px;
  text-decoration: none;
  transition: all .3s ease;
}

/* Hover */
.footer .social-links a:hover {
  background: #F2F2F2;
  color: #ffffff;
  border-color: #F2F2F2;
}

/* Línea de copyright */
.footer .copyright {
  border-top: 1px solid rgba(255, 255, 255, .15);
  margin-top: 30px;
  padding-top: 20px;
}

/* Si BootstrapMade sobrescribe los colores */
.footer .icon,
.footer .social-links a,
.footer .social-links a i {
  color: #F2F2F2 !important;
}

.footer .social-links a {
  border-color: #F2F2F2 !important;
}

.footer .social-links a:hover {
  background: #F2F2F2 !important;
  border-color: #F2F2F2 !important;
}

.footer .social-links a:hover i {
  color: #ffffff !important;
}

/* ==================================
   CARRUSEL VERTICAL DEL LOGO
   ================================== */

.header .logo-animado {
  position: relative;
  width: 220px;
  height: 70px;
  display: block;
  overflow: hidden;
  flex-shrink: 0;
}

/* Configuración general de ambas imágenes */
.header .logo-animado .logo-imagen {
  position: absolute;
  top: 50%;
  left: 0;

  width: 220px !important;
  height: auto !important;
  max-height: 65px !important;

  object-fit: contain;
  object-position: left center;

  margin: 0 !important;
  display: block;

  opacity: 0;
}

/* Logo principal */
.header .logo-animado .logo-principal {
  animation: carrusel-logo-principal 10s ease-in-out infinite;
}

/* Logo de 60 años */
.header .logo-animado .logo-aniversario {
  animation: carrusel-logo-aniversario 10s ease-in-out infinite;
  transform-origin: left center;
}

/* CONASH:
   visible, sale por arriba y vuelve a entrar desde abajo */
@keyframes carrusel-logo-principal {

  0%,
  40% {
    opacity: 1;
    transform: translateY(-50%);
  }

  48% {
    opacity: 0;
    transform: translateY(-140%);
  }

  49%,
  92% {
    opacity: 0;
    transform: translateY(50%);
  }

  100% {
    opacity: 1;
    transform: translateY(-50%);
  }
}

/* 60 años:
   entra desde abajo, queda visible y sale por arriba */
@keyframes carrusel-logo-aniversario {

  0%,
  40% {
    opacity: 0;
    transform: translateY(50%) scale(1.9);
  }

  48%,
  90% {
    opacity: 1;
    transform: translateY(-50%) scale(1.9);
  }

  98% {
    opacity: 0;
    transform: translateY(-140%) scale(1.9);
  }

  99%,
  100% {
    opacity: 0;
    transform: translateY(50%) scale(1.9);
  }
}

/* Hover del menú */
.navmenu a:hover {
    color: var(--accent-color) !important;
}