/* RESET */
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Arial', sans-serif; background: #eeeeee; color: #1a1a1a; line-height: 1.6; }

/* LAYOUT */
.container { width: 90%; max-width: 1400px; margin: 0 auto; }
.container-fluid { width: 96%; margin: 0 auto; }

/* HEADER & NAV */
.top-bar { background: #002955; color: #ffffff; padding: 10px 0; font-size: 13px; }
.top-nav { display: flex; justify-content: space-between; align-items: center; }
.external-links a { color: #ffffff; text-decoration: none; margin-right: 20px; font-weight: bold; }
.org-tag { font-weight: bold; opacity: 0.9; }

.main-nav { background: #ffffff; padding: 20px 0; border-bottom: 5px solid #ffcc00; position: sticky; top: 0; z-index: 1000; box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
.nav-wrapper { display: flex; justify-content: space-between; align-items: center; }
.brand { font-size: 26px; font-weight: 900; color: #002955; }
.menu a { color: #002955; text-decoration: none; font-weight: 700; margin-left: 25px; }
.btn-postular { background: #002955; color: #ffffff !important; padding: 10px 25px; border-radius: 4px; transition: 0.3s; }
.btn-postular:hover { background: #0056b3; }

/* HERO */
.hero { 
    background: url('https://images.unsplash.com/photo-1516321318423-f06f85e504b3?q=80&w=1600') center/cover no-repeat;
    height: 60vh; display: flex; align-items: center; text-align: center;
}
.hero-overlay { background: rgba(0, 41, 85, 0.85); width: 100%; height: 100%; display: flex; align-items: center; color: #ffffff; }
.hero h1 { font-size: 3.5rem; font-weight: 900; width: 100%; margin-bottom: 20px; }
.hero p { font-size: 1.2rem; max-width: 800px; margin: 0 auto; }
.btn-primary { background: #ffcc00; color: #002955; padding: 15px 40px; font-weight: 900; text-decoration: none; display: inline-block; margin-top: 30px; border-radius: 4px; transition: 0.3s; }
.btn-primary:hover { transform: scale(1.05); background: #f0f7ff; }

/* SECCIONES GENERALES */
.section { padding: 80px 0; background: #ffffff; border-bottom: 1px solid #ddd; }
.bg-light { background: #f8f9fa; }
.section-title { font-size: 36px; color: #002955; margin-bottom: 40px; font-weight: 900; }
.section-title.centered { text-align: center; }

/* CRONOGRAMA */
.timeline { display: flex; gap: 20px; flex-wrap: wrap; margin-top: 30px; }
.timeline-item { flex: 1; min-width: 280px; background: #ffffff; padding: 30px; border-top: 10px solid #002955; box-shadow: 0 5px 15px rgba(0,0,0,0.1); border-radius: 4px; }
.date { font-weight: 900; color: #002955; font-size: 20px; margin-bottom: 10px; display: block; }

/* HISTORIAL Y BOTONES DE DESCARGA */
.row-flex { display: flex; gap: 20px; justify-content: center; margin-top: 40px; flex-wrap: wrap; }
.btn-download { 
    border: 3px solid #002955; 
    color: #002955; 
    padding: 20px 35px; 
    font-weight: 800; 
    display: flex; 
    align-items: center; 
    gap: 12px; 
    text-decoration: none; 
    background: #ffffff; 
    transition: 0.3s;
}
.btn-download.primary { background: #002955; color: #ffffff; }
.btn-download:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.1); }

/* FOOTER */
.main-footer { background: #001a35; color: #ffffff; padding: 60px 0 20px; }
.footer-grid { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 30px; }
.sedes-info h4 { color: #ffcc00; margin-bottom: 15px; text-transform: uppercase; font-size: 16px; }
.sedes-info p { margin-bottom: 8px; font-size: 14px; }

/* LOGOS (SOLUCIÓN PANTALLA NEGRA) */
.logos-wrap { display: flex; gap: 20px; justify-content: center; flex-wrap: wrap; }
.logo-box { 
    background: #ffffff !important; 
    padding: 10px; border-radius: 8px; border: 1px solid #ddd;
    width: 170px; height: 85px; display: flex; align-items: center; justify-content: center;
    transition: 0.3s;
}
.logo-box:hover { transform: scale(1.05); }
.logo-box img { max-width: 100%; max-height: 100%; object-fit: contain; }

/* BOTÓN SUBIR */
.btn-scroll-top {
    position: fixed; bottom: 30px; right: 30px; background: #ffcc00; color: #002955;
    width: 50px; height: 50px; border-radius: 50%; display: none; align-items: center; justify-content: center;
    text-decoration: none; z-index: 2000; box-shadow: 0 4px 10px rgba(0,0,0,0.3); transition: 0.3s;
}
.btn-scroll-top:hover { background: #002955; color: #ffffff; }

/* RESPONSIVO */
@media (max-width: 768px) {
    .hero h1 { font-size: 2.5rem; }
    .footer-grid { flex-direction: column; text-align: center; }
    .footer-col { width: 100%; }
    .logos-wrap { justify-content: center; }
}