/* ====================================================== */
/* VARIABLES Y ESTILOS GLOBALES */
/* ====================================================== */
:root {
    --primary-color: #0A2F5B;   /* Azul oscuro corporativo */
    --secondary-color: #00A896; /* Verde azulado para acentos */
    --light-gray-color: #f4f7f6;
    --dark-gray-color: #333333;
    --text-color: #555555;
    --white-color: #ffffff;
    
    /* Nuevos colores para la sección "Por qué elegirnos" */
    --accent-purple: #6A44A3;
    --section-bg-light-blue: #D4F8F3;

    --font-primary: 'Montserrat', sans-serif;
    --font-headings: 'Montserrat', serif;
    /*--font-headings: 'Playfair Display', serif;*/
    
    --container-width: 1200px;
    --border-radius: 25px;
    --transition-speed: 0.3s ease;
}

/* /assets/css/servicios.css (VERSIÓN CORREGIDA CON ALTURA UNIFORME) */

/* --- Sección Slider de Servicios --- */
.services-slider-section {
    padding: 80px 0;
    background-color: #2D3748; /* Fondo oscuro */

}
.services-slider-section .section-header {
    text-align: center;
    margin-bottom: 60px;
}
.services-slider-section .section-header .pre-title {
    color: #00A896;
    background-color: rgba(237, 100, 166, 0.1);
}
.services-slider-section .section-header h2 {
    color: #fff;
    font-size: 2.8rem;
}

/* ===== CAMBIOS CLAVE PARA ALTURA UNIFORME ===== */
.services-slider .swiper-slide {
    height: auto; /* Permite que el slide crezca según el contenido */
    display: flex; /* Activa Flexbox */
}

.service-card {
    background-color: #4A5568;
    color: #A0AEC0;
    padding: 40px;
    border-radius: 16px;
    width: 100%; /* Asegura que la tarjeta ocupe todo el slide */
    display: flex; /* Activa Flexbox dentro de la tarjeta */
    flex-direction: column; /* Apila los elementos verticalmente */
}
/* ===== FIN DE LOS CAMBIOS CLAVE ===== */

.service-icon {
    font-size: 3rem;
    color: var(--secondary-color);
    margin-bottom: 20px;
}
.service-number {
    font-size: 1.5rem;
    font-weight: bold;
    color: #718096;
    margin-bottom: 15px;
}
.service-card h3 {
    font-family: var(--font-primary);
    font-size: 1.5rem;
    color: #fff;
    margin-bottom: 15px;
}
.service-card p {
    flex-grow: 1; /* Esto es clave: hace que el párrafo ocupe todo el espacio disponible, empujando el enlace hacia abajo */
    line-height: 1.7;
}
.service-link {
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    margin-top: 20px;
}
.service-link i {
    margin-left: 5px;
    transition: transform 0.3s ease;
}
.service-link:hover i {
    transform: translateX(5px);
}

/* Responsividad para esta página */
@media (max-width: 768px) {
    .services-slider-section .section-header h2 {
        font-size: 2rem;
    }
}