/* Move down content because we have a fixed navbar that is 50px tall */
body {
    padding-top: 50px;
    padding-bottom: 20px;
    /* Tipografía base y tamaño homogéneo en todo el sitio */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.6;
}
/* Navbar menu: strong white text, corporate color on hover, subtle active bg */
.site-navbar .nav > li > a {
    color: #ffffff; /* texto del menú: blanco fuerte por defecto */
    padding: 12px 16px;
    transition: color 160ms ease-in-out, background 160ms ease-in-out;
}
/* hover y estado activo: color corporativo */
.site-navbar .nav > li > a:hover,
.site-navbar .nav > li.active > a,
.site-navbar .nav > li > a:focus {
    color: #d22373 !important; /* asegurar prioridad sobre reglas bootstrap */
    background: rgba(255,255,255,0.06);
    border-radius:4px;
}

/* Fallback selectors to ensure menu links show white and switch to corporate color on hover/active */
.navbar-collapse .nav > li > a {
    color: #ffffff !important;
    padding: 12px 16px;
    transition: color 160ms ease-in-out, background 160ms ease-in-out;
}
.navbar-collapse .nav > li > a:hover,
.navbar-collapse .nav > li > a:focus,
.navbar-collapse .nav > li.active > a {
    color: #d22373 !important;
    background: rgba(255,255,255,0.06);
    border-radius: 4px;
}

/* Custom styles for department panels using corporate accent color */
.dept-panel {
    border: 1px solid #eee;
    border-radius: 4px;
    background: #fff;
    margin-bottom: 20px;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}
.dept-panel .panel-heading {
    border-bottom: 1px solid #eee;
    padding: 12px 15px;
    /* fondo suave a juego con las 'feature-pill' */
    background: rgba(210,34,115,0.08);
    border-radius: 6px;
    margin-bottom: 10px;
}
.dept-panel .panel-title {
    color: #d22373; /* color del logotipo */
    font-weight: 700;
    margin: 0;
}
.dept-panel .panel-body {
    padding: 15px;
    color: #333;
    /* ensure floated images don't overflow the panel */
    overflow: auto;
}

/* Reduce use of bright bootstrap contextual colors site-wide */
.panel-primary, .panel-success, .panel-warning, .panel-info {
    border-color: #e6e6e6;
}
.panel-primary > .panel-heading, .panel-success > .panel-heading, .panel-warning > .panel-heading, .panel-info > .panel-heading {
    background: transparent;
    color: inherit;
}

/* Headings tuned to corporate color */
h1, .display-4 {
    color: #d22373;
}

/* Normalizar tamaños de texto */
p, li, dd, dt {
    font-size: 16px;
    line-height: 1.6;
    color: #333;
}

.lead {
    font-size: 18px; /* ligeramente mayor para leads */
}

h1 { font-size: 36px; }
h2 { font-size: 28px; }
h3 { font-size: 22px; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
h6 { font-size: 14px; }

/* Forzar tamaño de párrafos dentro de paneles y dept-content para sobreescribir inline styles */
.panel-body p, .dept-content p, .body-content p {
    font-size: 16px !important;
}

/* Evitar saltos de línea extra por estilos inline */
.panel-body .lead, .dept-content .lead { font-size: 18px !important; }

/* Department image and content layout */
.dept-img {
    /* float image so text wraps to its right and below; slightly larger */
    float: left;
    width: 160px;
    max-width: 40%;
    height: auto;
    border-radius: 6px;
    margin: 0 15px 10px 0; /* right margin for text, small bottom gap */
    display: block;
}
.dept-img-right {
    /* optional helper to float image to the right */
    float: right;
    width: 160px;
    max-width: 40%;
    height: auto;
    border-radius: 6px;
    margin: 0 0 10px 15px; /* left margin for text, small bottom gap */
    display: block;
}
.dept-content {
    /* allow text to flow around floated image */
    display: block;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Impact and CTA styles for BI page */
.impact-section {
    background: linear-gradient(90deg, #fff 0%, #fff 60%);
    padding: 30px 15px;
    margin-bottom: 30px;
}
.impact-lead {
    font-size: 20px;
    font-weight: 700;
    color: #222;
    margin-bottom: 10px;
}
.feature-pill {
    display: inline-block;
    background: rgba(210,34,115,0.08);
    color: #d22373;
    padding: 8px 12px;
    border-radius: 20px;
    margin: 6px 6px 6px 0;
    font-weight: 600;
}
.service-box {
    border-left: 4px solid #d22373;
    background: #fff;
    padding: 18px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.03);
}
.impact-cta {
    background: #d22373;
    color: #fff;
    border-color: #d22373;
}
.impact-cta:hover { background:#b01b5c; color:#fff; }
.impact-high { font-size:1.15em; font-weight:700; color:#333; }

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set widths on the form inputs since otherwise they're 100% wide */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="select"] {
    max-width: 280px;
}

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .jumbotron {
        margin-top: 20px;
    }
    .body-content {
        padding: 0;
    }
}