/* VARIABLES GLOBALES */
:root { 
    --azul-mg: #001d3d; 
    --naranja-ventas: #e67e51; 
}

body { 
    font-family: 'Segoe UI', sans-serif; 
    padding-top: 85px; /* Altura fija para el Header global */
    background-color: #f8f9fa;
}

/* NAVBAR GLOBAL (Compacto y con Relieve) */
.navbar {
    background: white;
    height: 80px;
    padding: 0;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

/* --- AJUSTE GLOBAL DEL LOGO --- */
.navbar-brand img {
    /* 1. TAMAÑO: Subimos de los 52px anteriores a 65px para que se note el cambio */
    height: 75px !important; 
    width: auto;
    
    /* 2. EFECTO RELIEVE Y SOMBRA: 
       Usamos drop-shadow para que la sombra siga la forma de las letras MG 
       y no sea un cuadrado genérico. */
    filter: drop-shadow(2px 4px 6px rgba(0, 29, 61, 0.45)) !important;
    
    /* Suavizado para que no se vea pixelado al agrandar */
    transition: all 0.3s ease-in-out;
}

/* --- AJUSTE DEL HEADER PARA QUE EL LOGO NO QUEDE APRETADO --- */
.navbar {
    min-height: 85px !important; /* Le damos aire al logo más grande */
    padding: 5px 0 !important;
    background-color: #ffffff !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05); /* Sombra sutil de la barra */
}

/* --- COMPENSACIÓN DEL CUERPO --- */
body { 
    /* Si agrandamos el header, hay que bajar el body para que no se tape el carrusel */
    padding-top: 90px !important; 
}

.nav-link-custom {
    color: var(--azul-mg) !important;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 0.85rem;
    text-decoration: none;
}

.btn-cotizar {
    background: linear-gradient(45deg, #FF6B35, #ff8c61);
    color: white !important;
    border-radius: 50px;
    padding: 10px 25px;
    font-weight: 700;
    box-shadow: 0 4px 10px rgba(255, 107, 53, 0.3);
    border: none;
    text-decoration: none;
}

/* FOOTER GLOBAL */
.footer-slim { padding: 10px 0; font-size: 0.75rem; }
.footer-slim img { height: 25px; filter: grayscale(1); opacity: 0.6; }

/* WHATSAPP FLOAT */
.wsp-float { position: fixed; width: 55px; height: 55px; bottom: 20px; right: 20px; z-index: 2000; }

/* ============================================================
   ESTÁNDAR HÍBRIDO MGS (Equilibrio Impacto/Espacio)
   ============================================================ */

.mgs-card-link {
    text-decoration: none !important;
    color: inherit !important;
    display: block;
    height: 100%;
}

.mgs-card {
    background-color: #ffffff;
    border: none;
    border-radius: 15px; /* Bordes un poco más cerrados, más técnico */
    padding: 30px 20px;   /* Mix: Ni los 45px de movilidad ni los 15px básicos */
    text-align: center;
    height: 100%;
    display: flex; 
    flex-direction: column; 
    justify-content: space-between;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.05);
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

/* Efecto MGS: Elevación sutil */
.mgs-card-link:hover .mgs-card {
    transform: translateY(-8px);
    box-shadow: 0 15px 35px rgba(0, 29, 61, 0.12);
}

/* Iconos Font Awesome: Tamaño equilibrado */
.mgs-card i {
    display: block;
    font-size: 2.5rem; /* Bajamos de 3.5 a 2.5: Impacto sin saturar */
    margin-bottom: 15px;
    color: #001d3d;
    transition: 0.3s ease;
}

.mgs-card-link:hover i {
    color: #FF6B35 !important;
    transform: scale(1.1);
}

.mgs-card h3 {
    font-weight: 800;
    color: #001d3d;
    text-transform: uppercase;
    font-size: 0.95rem; /* Un poco más chico que el index para mayor elegancia */
    margin-bottom: 10px;
    letter-spacing: 0.5px;
}

.mgs-card p {
    font-size: 0.8rem;
    line-height: 1.4;
    color: #777;
    margin-bottom: 15px;
}

/* Botón Slim MGS */
.mgs-btn-card {
    background: linear-gradient(45deg, #FF6B35, #ff8c61);
    color: white !important;
    padding: 5px 18px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 0.65rem;
    text-transform: uppercase;
    display: inline-block;
    align-self: center;
}

/* AJUSTE PARA CELULARES (Crítico para MGS) */
@media (max-width: 768px) {
    .mgs-card {
        padding: 20px 15px; /* Reducimos aire en móvil */
    }
    .mgs-card i {
        font-size: 2.2rem; /* Icono aún más compacto en celular */
        margin-bottom: 10px;
    }
}
