/* Aplicamos la fuente Inter a todo el cuerpo del documento */
/* Fondo animado con tonos Frigidaire (azul, rojo y gris claro) */
body {
  background:
    url('data:image/svg+xml;utf8,<svg width="1920" height="1080" viewBox="0 0 1920 1080" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0 900 Q480 1020 960 900 T1920 900 V1080 H0 Z" fill="%231b3764" fill-opacity="0.13"/><path d="M0 120 Q600 40 1200 120 T1920 120 V0 H0 Z" fill="%23e2233a" fill-opacity="0.10"/><path d="M0 600 Q960 700 1920 600 V660 H0 Z" fill="%23f5f7fa" fill-opacity="0.10"/><ellipse cx="1700" cy="200" rx="120" ry="60" fill="%231b3764" fill-opacity="0.10"/><ellipse cx="300" cy="900" rx="160" ry="40" fill="%23e2233a" fill-opacity="0.10"/><ellipse cx="1000" cy="400" rx="90" ry="90" fill="%231b3764" fill-opacity="0.08"/></svg>'),
    linear-gradient(120deg, #f5f7fa 0%, #ffaae3 100%);
  background-repeat: no-repeat, no-repeat;
  background-size: 200% 250%, 200% 250%;
  background-attachment: fixed;
  background-position: 100% 50%, 0% 50%;
  animation: gradientMove 25s ease-in-out infinite;
  position: relative;
  min-height: 100vh;
}

@keyframes gradientMove {
  0%   { background-position: 0% 50%, 0% 50%; }
  50%  { background-position: 100% 50%, 100% 50%; }
  100% { background-position: 0% 50%, 0% 50%; }
}

header {
  backdrop-filter: blur(8px);
  background: rgba(255,255,255,0.85);
}

/* Estilo para las animaciones de scroll */
.reveal {
    position: relative;
    transform: translateY(100px);
    opacity: 0;
    transition: 1s all ease;
}
.reveal.active {
    transform: translateY(0);
    opacity: 1;
}

/* Animación para el menú móvil */
.mobile-menu {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height 0.4s, opacity 0.3s;
}
.mobile-menu.open {
  max-height: 500px;
  opacity: 1;
}
@media (min-width: 768px) {
  .mobile-menu {
    max-height: none;
    opacity: 1;
    overflow: visible;
    display: flex !important;
  }
}

/*estilos slider*/
.slide .slide-content{
    transition-property: opacity, transform;
}

/* SVG superior */
.bg-abstract-top {
  position: relative;
  overflow: hidden;
}
.bg-abstract-top::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url('data:image/svg+xml;utf8,<svg width="1440" height="180" viewBox="0 0 1440 180" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0,80 C360,0 1080,160 1440,80 L1440,180 L0,180 Z" fill="%236c757d" opacity="0.18"/><path d="M0,120 C480,40 960,200 1440,120 L1440,180 L0,180 Z" fill="%23b0b3b8" opacity="0.22"/></svg>');
  background-repeat: no-repeat;
  background-size: cover;
  pointer-events: none;
}
.bg-abstract-top > * {
  position: relative;
  z-index: 1;
}

/* SVG medio */
.bg-abstract-middle {
  position: relative;
  overflow: hidden;
}
.bg-abstract-middle::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url('data:image/svg+xml;utf8,<svg width="1440" height="180" viewBox="0 0 1440 180" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0,90 C360,180 1080,0 1440,90 L1440,180 L0,180 Z" fill="%236c757d" opacity="0.13"/><path d="M0,140 C480,60 960,200 1440,140 L1440,180 L0,180 Z" fill="%23b0b3b8" opacity="0.18"/></svg>');
  background-repeat: no-repeat;
  background-size: cover;
  pointer-events: none;
}
.bg-abstract-middle > * {
  position: relative;
  z-index: 1;
}

/* SVG inferior */
.bg-abstract-bottom {
  position: relative;
  overflow: hidden;
}
.bg-abstract-bottom::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url('data:image/svg+xml;utf8,<svg width="1440" height="180" viewBox="0 0 1440 180" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0,160 C360,180 1080,20 1440,160 L1440,180 L0,180 Z" fill="%236c757d" opacity="0.22"/><path d="M0,180 C480,100 960,180 1440,180 L1440,180 L0,180 Z" fill="%23b0b3b8" opacity="0.18"/></svg>');
  background-repeat: no-repeat;
  background-size: cover;
  pointer-events: none;
}
.bg-abstract-bottom > * {
  position: relative;
  z-index: 1;
}

/* Subrayado animado para enlaces */
.underline-anim {
  position: relative;
  overflow: hidden;
}
.underline-anim::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 0; height: 2px;
  background: #003366;
  transition: width 0.3s;
}
.underline-anim:hover::after,
.underline-anim:focus::after {
  width: 100%;
}

/* Animación de Pulso para WhatsApp (Verde) */
@keyframes pulse-green {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(197, 34, 42, 0.7);
  }
  70% {
    box-shadow: 0 0 0 16px rgba(34, 197, 94, 0);
  }
}

/* Animación de Pulso para Teléfono (Azul Maytag) */
@keyframes pulse-blue {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(0, 51, 102, 0.7);
  }
  70% {
    box-shadow: 0 0 0 16px rgba(0, 51, 102, 0);
  }
}

.animate-pulse-green {
  animation: pulse-green 2s infinite;
}

.animate-pulse-blue {
  animation: pulse-blue 2s infinite;
}