/*
 * Archivo de estilos CSS para la página de aterrizaje de SEO Cloud.
 * Aquí se definen los estilos personalizados que complementan a Tailwind CSS.
 */
 @import "tailwindcss";

body {
    font-family: 'Inter', sans-serif;
}



title{
    background-color: #022b43;
}

/* Color de fondo azul oscuro para la barra de navegación y otros elementos clave */
.bg-custom-blue {
    background-color: #022b43;
}

/* Estilos para el efecto de sombra y fondo degradado en la sección hero */
.hero-section {
    background: linear-gradient(to bottom right, #fdfefe, #066ff0);
}

/* Estilos para la sección de tarjetas con fondo degradado */
.card-section {
    background: linear-gradient(to top left, #e0f2fe, #e7edf3);
}

/* Animación para las imágenes en la sección "Conoce más de Nosotros" */
.animate-image {
    animation: pulse-subtle-v2 3s infinite ease-in-out;
}

/* Keyframes para la animación de pulsación sutil */
@keyframes pulse-subtle-v2 {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.02);
    }
}

/* Keyframes para el CHATBOT */
@keyframes slight-bounce {
    0% { transform: translateY(0); }
    100% { transform: translateY(-8px); }
}

/* --------------------------------------------------------Estilos generales del pie de página */

/* Media query para pantallas más pequeñas */
@media (max-width: 768px) {
    .footer-container {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
}
@keyframes scroll-slow {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.animate-scroll-slow {
    display: flex;
    animation: scroll-slow 30s linear infinite;
}

/* Animación para hacer aparecer el texto de abajo hacia arriba */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 40px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

/* Aplicación de la animación a la cabecera 'NUESTROS SERVICIOS' */
.animate-fadeInUp {
    animation: fadeInUp 0.8s ease-out forwards;
}
/* Añade esto a tu archivo CSS local para eliminar el subrayado de todos los enlaces */
a {
    /* Elimina el subrayado por defecto en todos los estados */
    text-decoration: none !important; 
    /* Opcional: define el color si no quieres que sea el azul por defecto */
    /* color: inherit; */ 
}

/* Opcional: define el estilo para cuando el usuario pasa el ratón por encima (hover) */
a:hover {
    text-decoration: none !important;
}

/* Estilos para los botones desplegables del navbar */
.dropdown-btn {
    position: relative;
    padding-right: 1.25rem;
}

.dropdown-btn::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid currentColor;
    transition: transform 0.3s ease;
    pointer-events: none;
}

.group:hover .dropdown-btn::after {
    transform: translateY(-50%) rotate(180deg);
}
/* Estilos para el menú desplegable */

