/* ── Paleta institucional U.E.P. Maestro Andrés Bello (tomada de assets/css/style.css original) ──
   #005596 → #5e83c6 degradado azul del header · #1976D2 azul de enlaces, iconos, .why-us y back-to-top
   #FFD700 / #005596 boton INGRESAR (.get-started-btn: fondo amarillo, texto azul; hover azul con texto blanco)
   #1565C0 → #64B5F6 degradado de los submenus · #455A64 franja de titulos de las paginas internas
   #37423b texto oscuro · #E3F2FD fondo claro de iconos · #EEEEEE fondo de bancos · #f6f7f6 fondo alterno */
:root {
	--p:    #1976D2;
	--pd:   #005596;
	--pl:   #5e83c6;
	--a:    #FFD700;
	--ad:   #005596;
	--dark: #455A64;
	--bg:   #EEEEEE;
	--bgs:  #f6f7f6;
	--s1:   0 4px 12px rgba(0,85,150,.09);
	--s2:   0 10px 30px rgba(0,85,150,.14);
	--s3:   0 20px 48px rgba(0,85,150,.20);
}
/* Header: degradado azul original (#header { linear-gradient(to right, #005596, #5e83c6) }),
   nombre y enlaces en blanco como el original. */
.lhdr.scrolled {
	background: linear-gradient(to right, rgba(0,85,150,.97), rgba(94,131,198,.97)) !important;
}
.lhdr.scrolled .lnav-brand-name { color: #fff !important; }
.lhdr.scrolled .lnav-menu > li > a,
.lhdr.scrolled .lnav-menu > li > button { color: #fff !important; }
.lhdr.scrolled .lnav-menu > li > a:hover { background: #fff !important; color: #005596 !important; border-radius: 50px; }
.lhdr.scrolled .lnav-ham span { background: #fff !important; }
@media (max-width: 991px) {
	.lnav-menu { background: linear-gradient(to bottom, rgba(0,85,150,.98), rgba(94,131,198,.98)) !important; }
}
.lnav-drop-menu li a:hover { color: #1976D2 !important; }
/* El original oscurecia la portada un 20% (#hero:before rgba(0,0,0,.2)) */
.lhero-overlay {
	background: linear-gradient(145deg,
		rgba(0,85,150,.25) 0%,
		rgba(0,0,0,.30) 55%,
		rgba(0,85,150,.25) 100%) !important;
}
/* Portada propia del colegio (era el fondo de #hero en style.css original:
   portada_uepmab1.jpg en escritorio y portada_movil2.jpg en pantallas de hasta 760px) */
.lhero {
	background-image: url('../img/portada_uepmab1.jpg');
	background-position: center center;
	background-size: cover;
}
@media (max-width: 760px) {
	.lhero {
		background-image: url('../img/portada_movil2.jpg');
		background-position: center center;
	}
}
.lhero h1, .lhero-sub { text-shadow: 0 2px 10px rgba(0,0,0,.55); }
/* Dos cuentas (BNC transferencia + pago movil), centradas */
.lbanks-grid-2 { grid-template-columns: repeat(2,1fr); max-width: 860px; margin: 0 auto; }
@media (max-width: 768px) { .lbanks-grid-2 { grid-template-columns: 1fr; } }
.lsec-label {
	background: linear-gradient(135deg, rgba(0,85,150,.12), rgba(25,118,210,.10)) !important;
	color: #1565C0 !important;
	border-color: rgba(0,85,150,.25) !important;
}
.lsec-title em { color: #1976D2 !important; }
.lproc-card::before { background: linear-gradient(90deg, #005596, #1976D2) !important; }
.lproc-icon { color: #1976D2 !important; background: #E3F2FD !important; }
.lproc-card:hover .lproc-icon {
	background: linear-gradient(135deg, #1565C0, #1976D2) !important;
	color: white !important;
}
.lrep-card:hover { border-color: rgba(25,118,210,.18) !important; color: #1976D2 !important; }
.lrep-card:hover .lrep-ico {
	background: linear-gradient(135deg, #1565C0, #1976D2) !important;
	color: white !important;
}
.lrep-ico { background: #E3F2FD !important; }
.lbanks-notice { border-color: rgba(25,118,210,.14) !important; background: linear-gradient(135deg,rgba(0,85,150,.08),rgba(25,118,210,.07)) !important; }
.lbanks-notice i { color: #1976D2 !important; }
.lbanks-notice a { color: #1976D2 !important; font-weight:700; }
.lbank-head { background: linear-gradient(135deg, #1565C0, #1976D2) !important; }
.ldoc-title { background: linear-gradient(135deg, #1565C0, #1976D2) !important; }
.lbtt { background: #1976D2 !important; }
.lbtt:hover { background: #42A5F5 !important; }
.lsec-blue { background: #EEEEEE !important; }
.lsec-alt  { background: #f6f7f6 !important; }
.lnav-login:not(.lnav-logout) {
	background: #FFD700 !important;
	color: #005596 !important;
	border: 1px solid rgba(255,255,255,.45) !important;
	box-shadow: 0 4px 14px rgba(0,85,150,.35) !important;
}
.lnav-login:not(.lnav-logout):hover { background: #005596 !important; box-shadow: 0 8px 20px rgba(0,85,150,.45) !important; color: #fff !important; }
.btn-primary { background: #005596 !important; border: none !important; }
.btn-primary:hover { background: #1976D2 !important; }
.lbtn-primary { background: linear-gradient(135deg, #1565C0, #1976D2) !important; box-shadow: 0 4px 14px rgba(21,101,192,.30) !important; }
.lbtn-primary:hover { box-shadow: 0 8px 22px rgba(21,101,192,.42) !important; }
.lbtn-accent { background: linear-gradient(135deg, #005596, #1976D2) !important; color: #fff !important; box-shadow: 0 6px 20px rgba(0,85,150,.38) !important; }
.lbtn-accent:hover { box-shadow: 0 10px 30px rgba(0,85,150,.52) !important; color: #fff !important; }
.lbtn-outline { border-color: #1976D2 !important; color: #1976D2 !important; }
.lbtn-outline:hover { background: #1976D2 !important; color: #fff !important; }
.lhero h1 em { color: #fff !important; text-shadow: 0 2px 12px rgba(0,85,150,.7); }
.lhero-badge { background: rgba(0,85,150,.45) !important; border-color: rgba(255,255,255,.45) !important; }
.labout-badge { background: linear-gradient(135deg, #005596, #1976D2) !important; color: #fff !important; box-shadow: 0 10px 28px rgba(25,118,210,.40) !important; }
.modal-header { background: linear-gradient(135deg, #1565C0, #1976D2) !important; }
.lform-card-hdr { background: linear-gradient(135deg, #1565C0, #1976D2) !important; }
.lpage-hdr { background: linear-gradient(135deg, #455A64, #1976D2) !important; }
.lfooter-col h4 { border-bottom-color: rgba(255,215,0,.40) !important; }
.lfooter-links li a:hover, .lfooter-links li button:hover { color: #FFD700 !important; }
.lfooter-links li i { color: #FFD700 !important; }
.lfooter-cr a { color: #FFD700 !important; }
.form-control2 { height:auto!important; padding:6px 10px!important; font-size:.85rem!important; }
.embed-container { position:relative; height:0; overflow:hidden; padding-bottom:75%; border:#1565C0 2px solid; background:#f8f9fa; box-shadow:inset 0 0 10px rgba(0,0,0,.1); border-radius:8px; }
.embed-container iframe { position:absolute; top:0; left:0; width:100%; height:100%; }

/* ── PAGINAS INTERNAS (contacto / preinscripcion / verificar) ─ */
.lpage-main { padding-top: 66px; }               /* alto del nav fijo */
.lpage-hdr  { padding: 2.2rem 1rem 2.6rem; }

/* Formulario de preinscripcion (bloques originales del colegio) */
.lform-grid { padding: 1rem 1.1rem 1.25rem; }
.lform-grid label { font-size: .8rem; font-weight: 600; margin-bottom: .2rem; display: block; }
.lform-grid .form-control,
.lform-grid .form-select { font-size: .88rem !important; }
.lform-grid .form-group { margin-bottom: .6rem; }
.lform-bloque { background: #fff; margin: 0 0 1.4rem 0 !important; border-radius: 14px; box-shadow: var(--s1); border-top: 4px solid var(--a); padding: .8rem .6rem; }
.lform-bloque h3, .lform-bloque h4 { font-size: 1.05rem; font-weight: 800; color: var(--p); margin: .2rem 0 .4rem; }
.lthumb-box { text-align: center; }
.lthumb-box img, .lthumb-box .thumb { width: 140px; height: 140px; object-fit: cover; border-radius: 30%; border: 3px solid #fff; box-shadow: var(--s1); }

/* Bloque de contacto */
.lcontact-item { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 1.1rem; }
.lcontact-item i { font-size: 1.15rem; color: var(--p); line-height: 1.5; }
.lcontact-item strong { display: block; font-size: .85rem; }
.lcontact-item span { font-size: .88rem; color: var(--txm); word-break: break-word; }

/* ── RESPONSIVE MOVIL ─────────────────────────────────────── */
@media (max-width: 768px) {
	.lsec { padding: 48px 0; }
	.lcontainer { padding: 0 16px; }
	.lcontact-wrap { padding: 22px 18px; }
	.lform-grid { padding: .9rem .8rem 1rem; }
	.lpage-hdr h1 { font-size: 1.3rem; }
	.lpage-hdr p { font-size: .85rem; }
	.lthumb-box img, .lthumb-box .thumb { width: 110px; height: 110px; }
	.modal-footer .col-md-12 { width: 100%; }
	body { overflow-x: hidden; }
	.lsec { overflow-x: clip; }
	.table-responsive { -webkit-overflow-scrolling: touch; }
}
@media (max-width: 576px) {
	.lbtn { width: 100%; justify-content: center; }
	.lpage-hdr .lbtn { width: auto; }
}
