/* VARIABLES INSTITUCIONALES GLOBAL */
:root {
    --azul-corporativo: #0046c7;
    --azul-oscuro: #0a192f;
    --dark-navy: #071122;
    --bg-footer: #040a14;
    --light-gray: #f8fafc;
    --dark-light: #1e293b;
    --texto-suave: #64748b;
}

body {
    font-family: 'Inter', sans-serif;
    color: #1e293b;
    background-color: #ffffff;
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6, .font-heading {
    font-family: 'Montserrat', sans-serif;
}

/* Clases Útiles Generales */
.py-6 {
    padding-top: 5rem;
    padding-bottom: 5rem;
}
.bg-dark-navy { background-color: var(--dark-navy); }
.bg-footer { background-color: var(--bg-footer); }
.bg-light-gray { background-color: var(--light-gray); }
.text-blue { color: var(--azul-corporativo); }
.text-blue-light { color: #3b82f6; }
.text-white-80 { color: rgba(255, 255, 255, 0.8); }
.text-white-30 { color: rgba(255, 255, 255, 0.3); }
.border-dark-light { border-color: rgba(255, 255, 255, 0.08) !important; }
.max-h-50 { max-height: 50px; }
.max-h-500 { max-height: 500px; }
.fs-7 { font-size: 0.8rem; }
.fs-8 { font-size: 0.72rem; }

.hover-white:hover {
    color: #ffffff !important;
    transition: color 0.2s ease;
}

/* Títulos de sección */
.section-title {
    font-size: 2.25rem;
    letter-spacing: -0.5px;
}

.logo-header {
    height: 75px !important; /* Forzamos una altura notable para que el texto "DICA" sea legible */
    width: auto !important;
    object-fit: contain;
    padding: 5px 0; /* Evita que toque los bordes del contenedor */
}

/* Opcional: Si notas que la navbar se ve muy ajustada, le damos aire */
.navbar {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

/* Limita el ancho del texto explicativo para una lectura cómoda */
.max-w-600 {
    max-width: 600px;
}

/* Efecto hover suave para el botón de estilo moderno en fondo oscuro */
.btn-outline-modern {
    border: 2px solid #00d2ff;
    color: #ffffff;
    transition: all 0.3s ease;
}

.btn-outline-modern:hover {
    background: linear-gradient(45deg, #0046c7, #00d2ff);
    border-color: transparent;
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 210, 255, 0.3);
}