
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Arial;
}

body{
background:#f2f2f2;
color:#222;
}

.top-header{
background:#7b0000;
color:white;
padding:10px 5%;
display:flex;
justify-content:space-between;
font-size:14px;
}

.navbar{
background:white;
padding:20px 5%;
display:flex;
justify-content:space-between;
align-items:center;
box-shadow:0 2px 10px rgba(0,0,0,.1);
}

.logo-area{
display:flex;
align-items:center;
gap:20px;
}

.logo-area img{
width:90px;
}

.logo-area h1{
font-size:35px;
color:#222;
}

.logo-area h2{
color:#8b0000;
}

nav{
display:flex;
align-items:center;
gap:20px;
}

nav a{
text-decoration:none;
color:#222;
font-weight:bold;
}

.btn-login{
background:#8b0000;
color:white;
padding:14px 20px;
border-radius:8px;
}

.hero-slider{
height:650px;
position:relative;
overflow:hidden;
}

.slide{
position:absolute;
inset:0;
background-size:cover;
background-position:center;
opacity:0;
transition:opacity 1s ease-in-out;
display:flex;
align-items:center;
padding:0 8%;
}

.slide.active{
opacity:1;
z-index:2;
}

.slider-btn{
position:absolute;
top:50%;
transform:translateY(-50%);
z-index:5;
width:48px;
height:48px;
border-radius:50%;
border:2px solid white;
background:rgba(0,0,0,.25);
color:white;
font-size:28px;
cursor:pointer;
transition:.3s;
}

.slider-btn:hover{
background:#8b0000;
}

.slider-btn.prev{
left:30px;
}

.slider-btn.next{
right:30px;
}

.slider-dots{
position:absolute;
bottom:25px;
left:50%;
transform:translateX(-50%);
z-index:6;
display:flex;
gap:10px;
}

.dot{
width:14px;
height:14px;
border-radius:50%;
background:white;
opacity:.6;
cursor:pointer;
}

.dot.active{
background:#8b0000;
opacity:1;
}

.overlay{
position:absolute;
inset:0;
background:rgba(0,0,0,.5);
}

.hero-content{
position:relative;
z-index:2;
max-width:700px;
color:white;
}

.hero-content h1{
font-size:70px;
margin-bottom:20px;
}

.hero-content p{
font-size:22px;
margin-bottom:30px;
}

.hero-buttons{
display:flex;
gap:20px;
}

.hero-buttons a{
background:#8b0000;
padding:16px 28px;
border-radius:8px;
text-decoration:none;
color:white;
font-weight:bold;
}

.hero-buttons .secondary{
background:transparent;
border:2px solid white;
}

.main-section{
padding:60px 5%;
display:grid;
grid-template-columns:3fr 1fr;
gap:30px;
}

.careers h2{
font-size:35px;
margin-bottom:30px;
}

.careers span{
color:#8b0000;
}

.cards{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
}

.card{
background:white;
padding:30px;
border-radius:15px;
box-shadow:0 5px 15px rgba(0,0,0,.08);
}

.icon{
font-size:50px;
margin-bottom:20px;
}

.card h3{
margin-bottom:15px;
color:#8b0000;
}

.sidebar{
display:flex;
flex-direction:column;
gap:20px;
}

.news-box,.quick-box{
background:white;
padding:25px;
border-radius:15px;
box-shadow:0 5px 15px rgba(0,0,0,.08);
}

.news-item{
margin-top:20px;
padding-bottom:15px;
border-bottom:1px solid #ddd;
}

.news-item h4{
color:#8b0000;
margin-bottom:8px;
}

.quick-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:20px;
margin-top:20px;
}

.quick-grid div{
background:#f7f7f7;
padding:20px;
text-align:center;
border-radius:10px;
font-size:25px;
}

.quick-grid span{
display:block;
font-size:14px;
margin-top:10px;
}

.bottom-section{
padding:0 5% 60px;
display:grid;
grid-template-columns:1fr 1fr 1fr;
gap:20px;
}

.video-box,.gallery-box,.map-box{
background:white;
padding:20px;
border-radius:15px;
box-shadow:0 5px 15px rgba(0,0,0,.08);
}

iframe{
width:100%;
height:300px;
border:none;
border-radius:10px;
margin-top:15px;
}

.gallery{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:10px;
margin-top:15px;
}

.gallery img{
width:100%;
border-radius:10px;
}

.pdf-section{
padding:0 5% 60px;
}

.pdf-section h2{
margin-bottom:20px;
}

.pdf-list{
display:flex;
flex-direction:column;
gap:20px;
}

.pdf-item{
background:white;
padding:20px;
border-radius:15px;
display:flex;
justify-content:space-between;
align-items:center;
box-shadow:0 5px 15px rgba(0,0,0,.08);
}

.pdf-item a{
background:#8b0000;
color:white;
padding:12px 18px;
border-radius:8px;
text-decoration:none;
}

footer{
background:#111;
color:white;
padding:30px;
text-align:center;
}

@media(max-width:1000px){

.cards{
grid-template-columns:repeat(2,1fr);
}

.main-section,
.bottom-section{
grid-template-columns:1fr;
}

.hero-content h1{
font-size:45px;
}

.navbar{
flex-direction:column;
gap:20px;
}

nav{
flex-wrap:wrap;
justify-content:center;
}
}

@media(max-width:700px){

.cards{
grid-template-columns:1fr;
}

.top-header{
flex-direction:column;
gap:10px;
text-align:center;
}

.hero-slider{
height:560px;
}

.slide{
padding:100px 5%;
}

.slider-btn{
width:40px;
height:40px;
font-size:22px;
}

.slider-btn.prev{
left:12px;
}

.slider-btn.next{
right:12px;
}

.hero-content h1{
font-size:38px;
}

.hero-buttons{
flex-direction:column;
}
}


.gallery img{
cursor:pointer;
transition:.3s;
}

.gallery img:hover{
transform:scale(1.03);
}

.lightbox{
display:none;
position:fixed;
inset:0;
background:rgba(0,0,0,.92);
z-index:9999;
justify-content:center;
align-items:center;
padding:30px;
}

.lightbox img{
max-width:90%;
max-height:90vh;
border-radius:15px;
box-shadow:0 10px 30px rgba(0,0,0,.5);
}

.cerrar{
position:absolute;
top:20px;
right:40px;
font-size:55px;
color:white;
cursor:pointer;
font-weight:bold;
}


.card-link{
text-decoration:none;
color:inherit;
display:block;
}

.detail-page{
min-height:100vh;
background:#f5f5f5;
}

.detail-hero{
background:linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.6)),
url('https://images.unsplash.com/photo-1523050854058-8df90110c9f1?auto=format&fit=crop&w=1400&q=80');
background-size:cover;
background-position:center;
padding:120px 8%;
color:white;
}

.detail-content{
max-width:1200px;
margin:auto;
padding:60px 5%;
}

.info-box{
background:white;
padding:35px;
border-radius:15px;
box-shadow:0 5px 20px rgba(0,0,0,.08);
margin-bottom:30px;
}

.info-box h2{
color:#8b0000;
margin-bottom:20px;
}

.back-btn{
display:inline-block;
margin-top:25px;
padding:14px 22px;
background:#8b0000;
color:white;
text-decoration:none;
border-radius:8px;
}


/* NUEVO DISEÑO MODERNO DE CARRERAS */
.section-head{
margin-bottom:35px;
}

.section-head p{
color:#8b0000;
font-weight:900;
letter-spacing:2px;
font-size:14px;
}

.section-head h2{
font-size:44px;
color:#1f1f1f;
margin:6px 0;
}

.section-head span{
font-size:18px;
color:#666;
}

.modern-careers{
grid-template-columns:repeat(2,1fr)!important;
gap:28px!important;
}

.career-modern{
background:white;
border-radius:24px;
overflow:hidden;
text-decoration:none;
color:#222;
box-shadow:0 15px 35px rgba(0,0,0,.12);
transition:.35s;
display:grid;
grid-template-columns:170px 1fr;
min-height:200px;
border:1px solid #eee;
}

.career-modern:hover{
transform:translateY(-8px);
box-shadow:0 25px 55px rgba(123,0,0,.22);
}

.career-img{
background-size:cover;
background-position:center;
min-height:200px;
position:relative;
}

.career-img::after{
content:"";
position:absolute;
inset:0;
background:linear-gradient(180deg,transparent,rgba(0,0,0,.25));
}

.career-info{
padding:28px;
position:relative;
}

.career-icon{
width:58px;
height:58px;
border-radius:18px;
display:grid;
place-items:center;
font-size:30px;
background:#fff3cd;
margin-bottom:15px;
}

.career-info h3{
font-size:24px;
color:#7b0000;
margin-bottom:12px;
line-height:1.2;
}

.career-info p{
color:#555;
font-size:16px;
margin-bottom:18px;
}

.career-btn{
display:inline-block;
font-weight:900;
color:#8b0000;
}

/* PÁGINAS DE DETALLE MÁS PROFESIONALES */
.detail-page{
background:#f4f4f4;
}

.detail-hero{
min-height:430px;
display:flex;
align-items:center;
position:relative;
overflow:hidden;
}

.detail-hero::after{
content:"";
position:absolute;
inset:0;
background:radial-gradient(circle at right,rgba(246,194,26,.35),transparent 35%);
}

.detail-hero h1,
.detail-hero p{
position:relative;
z-index:2;
max-width:900px;
}

.detail-hero h1{
font-size:56px;
line-height:1.05;
margin-bottom:18px;
}

.detail-hero p{
font-size:22px;
color:#eee;
}

.detail-content{
display:grid;
grid-template-columns:1fr 1fr 1fr;
gap:24px;
}

.info-box{
border-radius:24px!important;
border-top:7px solid #8b0000;
transition:.3s;
}

.info-box:hover{
transform:translateY(-6px);
box-shadow:0 20px 40px rgba(0,0,0,.14);
}

.info-box h2{
font-size:26px;
}

.back-btn{
grid-column:1/-1;
width:max-content;
font-weight:bold;
}

@media(max-width:1000px){
.modern-careers{
grid-template-columns:1fr!important;
}

.detail-content{
grid-template-columns:1fr;
}
}

@media(max-width:700px){
.career-modern{
grid-template-columns:1fr;
}

.section-head h2{
font-size:34px;
}

.detail-hero h1{
font-size:38px;
}
}


/* Ajuste visual imágenes carreras */
.career-img{
height:200px;
}

.career-info{
padding:22px;
}

.career-info h3{
font-size:21px;
}

.career-info p{
font-size:15px;
}


/* PANEL ADMINISTRADOR PROFESIONAL */
.admin-body{background:#f4f1ef;min-height:100vh;}
.login-card{width:min(450px,92%);margin:70px auto;background:white;padding:38px;border-radius:26px;box-shadow:0 25px 60px rgba(0,0,0,.16);text-align:left;border-top:8px solid #8b0000;}
.login-logo{width:105px;display:block;margin:0 auto 18px;}
.login-card h1{text-align:center;color:#7b0000;font-size:28px;}
.login-card p{text-align:center;color:#666;margin-bottom:24px;}
.login-card label,.admin-card label{font-weight:bold;color:#333;display:block;margin-bottom:6px;}
.login-card input,.admin-card input,.admin-card textarea{width:100%;padding:14px;border:1px solid #ddd;border-radius:12px;margin-bottom:16px;font-size:15px;outline:none;}
.admin-card textarea{min-height:120px;resize:vertical;}
.admin-btn{background:linear-gradient(135deg,#7b0000,#b21d24);color:white;border:none;border-radius:12px;padding:14px 20px;font-weight:bold;cursor:pointer;box-shadow:0 10px 22px rgba(123,0,0,.25);transition:.3s;}
.admin-btn:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(123,0,0,.32);}
.admin-btn.full{width:100%;}
.admin-sidebar{position:fixed;left:0;top:0;bottom:0;width:270px;background:linear-gradient(180deg,#7b0000,#3d0000);padding:28px 20px;color:white;z-index:100;}
.admin-brand{text-align:center;margin-bottom:30px;}
.admin-brand img{width:95px;background:white;border-radius:50%;padding:8px;margin-bottom:12px;}
.admin-brand h2{font-size:24px;}
.admin-brand p{font-size:14px;opacity:.8;}
.admin-sidebar a{display:block;color:white;text-decoration:none;padding:15px 16px;border-radius:14px;margin-bottom:10px;font-weight:bold;transition:.3s;}
.admin-sidebar a:hover{background:rgba(255,255,255,.16);padding-left:22px;}
.admin-main{margin-left:270px;padding:35px;}
.admin-top{background:white;padding:28px;border-radius:24px;box-shadow:0 12px 30px rgba(0,0,0,.08);margin-bottom:24px;}
.admin-top h1{color:#7b0000;font-size:34px;}
.admin-alert{padding:16px 18px;border-radius:14px;margin-bottom:22px;font-weight:bold;}
.admin-alert.ok{background:#dcfce7;color:#166534;}
.admin-alert.error{background:#fee2e2;color:#991b1b;}
.admin-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:25px;}
.admin-stats div{background:white;padding:24px;border-radius:22px;box-shadow:0 10px 25px rgba(0,0,0,.08);border-left:7px solid #8b0000;}
.admin-stats strong{display:block;font-size:40px;color:#7b0000;}
.admin-stats span{font-weight:bold;color:#555;}
.admin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:25px;}
.admin-card,.admin-list-card{background:white;padding:26px;border-radius:24px;box-shadow:0 12px 30px rgba(0,0,0,.08);margin-bottom:24px;}
.admin-card h2,.admin-list-card h2{color:#7b0000;margin-bottom:18px;}
.admin-table-wrap{overflow-x:auto;}
.admin-table{width:100%;border-collapse:collapse;}
.admin-table th{background:#7b0000;color:white;padding:14px;text-align:left;}
.admin-table td{padding:14px;border-bottom:1px solid #eee;}
.delete-link{color:#b91c1c;font-weight:bold;text-decoration:none;}
.admin-gallery-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:18px;}
.admin-photo-item{background:#f8f8f8;border-radius:18px;padding:12px;text-align:center;}
.admin-photo-item img{width:100%;height:120px;object-fit:cover;border-radius:14px;margin-bottom:10px;}
@media(max-width:1100px){.admin-grid{grid-template-columns:1fr;}.admin-stats{grid-template-columns:1fr;}}
@media(max-width:800px){.admin-sidebar{position:relative;width:100%;height:auto;}.admin-main{margin-left:0;padding:18px;}}


/* VIDEOS ADMINISTRABLES */
.video-admin-grid{
display:grid;
grid-template-columns:1fr;
gap:18px;
margin-top:15px;
}

.video-item{
background:#fafafa;
border-radius:15px;
padding:14px;
box-shadow:0 4px 12px rgba(0,0,0,.06);
}

.video-item h3{
color:#7b0000;
margin-bottom:10px;
font-size:18px;
}

.video-item video{
width:100%;
height:300px;
border-radius:10px;
margin-top:10px;
background:#111;
object-fit:cover;
}

.admin-select{
width:100%;
padding:14px;
border:1px solid #ddd;
border-radius:12px;
margin-bottom:16px;
font-size:15px;
outline:none;
background:white;
}

@media(max-width:700px){
.video-item video{
height:220px;
}
}


/* SLIDER ADMINISTRABLE */
.admin-stats{
grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
}

.admin-grid{
grid-template-columns:repeat(auto-fit,minmax(310px,1fr));
}

.admin-photo-item small{
color:#666;
font-weight:bold;
}

.hero-slider .slide{
background-color:#111;
}

@media(max-width:700px){
.admin-grid{
grid-template-columns:1fr;
}
}


/* Corrección visual para imágenes administrables */
.admin-photo-item img{
background:#eee;
border:1px solid #ddd;
}

.gallery img{
background:#eee;
}


/* Lightbox con descripción */
.lightbox{
flex-direction:column;
}

.lightbox-content{
max-width:92%;
max-height:92vh;
display:flex;
flex-direction:column;
align-items:center;
}

.lightbox-content img{
max-width:100%;
max-height:72vh;
}

.lightbox-text{
background:white;
color:#222;
width:min(900px,100%);
padding:18px 22px;
border-radius:0 0 15px 15px;
text-align:center;
}

.lightbox-text h3{
color:#7b0000;
margin-bottom:8px;
font-size:24px;
}

.lightbox-text p{
font-size:16px;
color:#444;
}

.admin-photo-item small{
display:block;
color:#666;
margin-bottom:8px;
}


/* Navegación galería */
.lightbox-nav{
position:absolute;
top:50%;
transform:translateY(-50%);
background:rgba(0,0,0,.55);
color:white;
border:none;
width:55px;
height:55px;
border-radius:50%;
font-size:28px;
cursor:pointer;
z-index:9999;
transition:.3s;
}

.lightbox-nav:hover{
background:#7b0000;
}

.lightbox-nav.prev{
left:25px;
}

.lightbox-nav.next{
right:25px;
}

@media(max-width:700px){
.lightbox-nav{
width:45px;
height:45px;
font-size:22px;
}

.lightbox-nav.prev{
left:10px;
}

.lightbox-nav.next{
right:10px;
}
}

/* MÓDULO DE USUARIOS */
.estado-badge{display:inline-block;padding:6px 10px;border-radius:999px;font-size:13px;font-weight:bold;}
.estado-badge.activo{background:#dcfce7;color:#166534;}
.estado-badge.inactivo{background:#fee2e2;color:#991b1b;}
.ok-link{color:#166534;font-weight:bold;text-decoration:none;}
.mini-form{display:flex;gap:8px;align-items:center;}
.mini-form input{padding:9px;border:1px solid #ddd;border-radius:8px;min-width:130px;}
.mini-form button{padding:9px 12px;border:0;border-radius:8px;background:#7b0000;color:white;font-weight:bold;cursor:pointer;}
@media(max-width:800px){.mini-form{flex-direction:column;align-items:stretch;}}


/* BOTÓN CERRAR SESIÓN Y EDICIÓN DE NOTICIAS */
.admin-top-flex{
display:flex;
justify-content:space-between;
align-items:center;
gap:20px;
}

.logout-top-btn{
background:#111827;
color:white;
padding:13px 20px;
border-radius:14px;
font-weight:bold;
text-decoration:none;
box-shadow:0 10px 22px rgba(0,0,0,.18);
transition:.3s;
white-space:nowrap;
}

.logout-top-btn:hover{
background:#7b0000;
transform:translateY(-2px);
}

.admin-news-edit-list{
display:grid;
gap:22px;
}

.news-edit-card{
display:grid;
grid-template-columns:220px 1fr;
gap:22px;
background:#fafafa;
border:1px solid #eee;
border-radius:22px;
padding:18px;
}

.news-edit-preview img,
.news-no-img{
width:100%;
height:180px;
border-radius:18px;
object-fit:cover;
background:#eee;
display:grid;
place-items:center;
color:#777;
font-weight:bold;
}

.news-edit-form label{
display:block;
font-weight:bold;
margin-bottom:6px;
color:#333;
}

.news-edit-form input,
.news-edit-form textarea{
width:100%;
padding:13px;
border:1px solid #ddd;
border-radius:12px;
margin-bottom:14px;
font-size:15px;
}

.news-edit-form textarea{
min-height:110px;
resize:vertical;
}

.news-edit-actions{
display:flex;
align-items:center;
gap:18px;
flex-wrap:wrap;
}

@media(max-width:800px){
.admin-top-flex{
flex-direction:column;
align-items:flex-start;
}

.news-edit-card{
grid-template-columns:1fr;
}

.logout-top-btn{
width:100%;
text-align:center;
}
}


/* NOTICIAS COMPLETAS */
.news-thumb{
width:100%;
height:130px;
object-fit:cover;
border-radius:12px;
margin-bottom:12px;
}

.news-more{
display:inline-block;
margin-top:12px;
background:#7b0000;
color:white;
padding:10px 14px;
border-radius:10px;
font-weight:bold;
text-decoration:none;
transition:.3s;
}

.news-more:hover{
background:#a00000;
transform:translateY(-2px);
}

.noticia-detalle-hero{
min-height:360px;
background:linear-gradient(rgba(0,0,0,.65),rgba(0,0,0,.65)),
url('https://images.unsplash.com/photo-1495020689067-958852a7765e?auto=format&fit=crop&w=1600&q=80');
background-size:cover;
background-position:center;
display:flex;
align-items:center;
padding:120px 8% 70px;
color:white;
}

.noticia-detalle-hero span{
display:inline-block;
background:#f6c21a;
color:#111;
padding:8px 14px;
border-radius:999px;
font-weight:900;
margin-bottom:15px;
}

.noticia-detalle-hero h1{
font-size:clamp(34px,5vw,58px);
max-width:900px;
line-height:1.1;
}

.noticia-detalle-container{
max-width:1100px;
margin:50px auto;
padding:0 5%;
}

.noticia-detalle-img{
width:100%;
max-height:520px;
object-fit:cover;
border-radius:26px;
box-shadow:0 15px 35px rgba(0,0,0,.15);
margin-bottom:28px;
}

.noticia-detalle-card{
background:white;
padding:35px;
border-radius:26px;
box-shadow:0 15px 35px rgba(0,0,0,.1);
}

.noticia-detalle-card h2{
color:#7b0000;
font-size:36px;
margin-bottom:10px;
}

.fecha-noticia{
font-weight:bold;
color:#777;
margin-bottom:25px;
}

.noticia-texto-completo{
font-size:18px;
line-height:1.8;
color:#333;
margin-bottom:25px;
}


/* BOTÓN MÁS LINDO PARA NOTICIAS */
.beautiful-btn{
display:inline-flex!important;
align-items:center;
justify-content:space-between;
gap:14px;
background:linear-gradient(135deg,#7b0000,#b21d24)!important;
color:white!important;
padding:12px 18px!important;
border-radius:999px!important;
font-weight:900!important;
text-decoration:none!important;
box-shadow:0 10px 24px rgba(123,0,0,.28);
position:relative;
overflow:hidden;
transition:.35s ease;
}

.beautiful-btn span{
position:relative;
z-index:2;
}

.beautiful-btn strong{
width:30px;
height:30px;
border-radius:50%;
background:rgba(255,255,255,.22);
display:grid;
place-items:center;
position:relative;
z-index:2;
transition:.35s ease;
}

.beautiful-btn::before{
content:"";
position:absolute;
top:0;
left:-100%;
width:100%;
height:100%;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
transition:.55s ease;
}

.beautiful-btn:hover{
transform:translateY(-3px);
box-shadow:0 16px 32px rgba(123,0,0,.38);
background:linear-gradient(135deg,#9b1118,#d62828)!important;
}

.beautiful-btn:hover::before{
left:100%;
}

.beautiful-btn:hover strong{
transform:translateX(4px);
background:white;
color:#7b0000;
}
