/* 1. FONDO GENERAL Y DE CABECERA (Azul Acero / Gris Azulado Suave) */
body, .header-section, .hero-container {
    background-color: #f4f6f9 !important; /* Fondo gris claro/limpio para los bloques de contenido */
    color: #1e2d3d !important; /* Texto en azul pizarra muy oscuro para lectura perfecta */
}

.hero-section {
    background: linear-gradient(135deg, #1a2a3a 0%, #2c3e50 100%) !important; /* Fondo azul corporativo sobrio y suave para la portada */
    color: #ffffff !important;
    padding: 60px 20px !important;
}

/* 2. LOGOTIPO Y MENÚ (Centrado y Limpio) */
.brand-logo-container {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 20px auto !important;
}

/* 3. BOTONES DE ACCIÓN (Rojo Corporativo de Red Sur) */
/* Reemplaza '.btn-primary' por la clase específica del botón de tu Sitio Simple si es necesario */
.btn-primary, .button-main, .cta-button {
    background-color: #b82329 !important; /* Rojo idéntico al del logo */
    border-color: #b82329 !important;
    color: #ffffff !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    border-radius: 4px !important;
    transition: background 0.3s ease !important;
}

.btn-primary:hover, .button-main:hover {
    background-color: #911b1f !important; /* Rojo un poco más oscuro al pasar el cursor */
    border-color: #911b1f !important;
}

/* 4. BOTÓN FLOTANTE DE WHATSAPP (Verde Universal, esquina inferior derecha) */
.whatsapp-float {
    position: fixed !important;
    bottom: 25px !important;
    right: 25px !important;
    background-color: #25d366 !important;
    color: #ffffff !important;
    border-radius: 50px !important;
    text-align: center !important;
    font-size: 30px !important;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3) !important;
    z-index: 9999 !important;
    width: 60px !important;
    height: 60px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-decoration: none !important;
}

.whatsapp-float:hover {
    background-color: #128c7e !important;
    transform: scale(1.05);
    transition: all 0.2s ease;
}/* FILTRO MONOCROMÁTICO SUAVE PARA LAS TRES IMÁGENES DE LÍNEA */
.tarjeta-linea img, .bloque-cubiertas img {
    filter: grayscale(100%) contrast(110%) !important; /* Convierte a blanco y negro profesional */
    mix-blend-mode: multiply !important;
    opacity: 0.85 !important; /* Las vuelve tenues para que no saturen */
    transition: all 0.3s ease !important;
}

/* CONTENEDOR CON EL DEGRADADO SUAVE DE RED SUR (AZUL ACERO Y ROJO TENUE) */
.columna-producto {
    background: linear-gradient(135deg, rgba(26, 42, 58, 0.15) 0%, rgba(184, 35, 41, 0.08) 100%) !important;
    border-radius: 8px;
    padding: 15px;
}

/* EFECTO HOVER: Cuando el cliente pasa el mouse, la imagen cobra un poco más de vida */
.tarjeta-linea:hover img, .bloque-cubiertas:hover img {
    filter: grayscale(40%) !important;
    opacity: 1 !important;
    transform: scale(1.02);
}