.main-nav .logo { display:inline-flex; align-items:center; } .main-nav .logo img { width:64px; height:64px; object-fit:contain; } .main-nav .logo span { display:none !important; } .une-nav > .mega-dropdown { position: static !important; } .une-nav .une-mega-menu { position:absolute; left:0; right:0; top:100%; width:100%; background:rgba(255,255,255,.88); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border-top:1px solid rgba(0,0,0,.05); box-shadow:0 10px 24px rgba(0,0,0,.10); padding:30px 35px; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(6px); transition:opacity .18s ease, visibility .18s ease, transform .18s ease; z-index:9999; } .une-nav .mega-dropdown:hover > .une-mega-menu, .une-nav .mega-dropdown:focus-within > .une-mega-menu, .une-nav .mega-dropdown.mobile-open > .une-mega-menu { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0); } .une-nav .une-mega-grid { display:grid; gap:34px 44px; max-width:1200px; margin:0 auto; } .une-nav .une-mega-grid.columns-4 { grid-template-columns:repeat(4,minmax(0,1fr)); } .une-nav .une-mega-grid.columns-3 { grid-template-columns:repeat(3,minmax(0,1fr)); } .une-nav .une-mega-column { display:flex; flex-direction:column; gap:28px; min-width:0; } .une-nav .une-mega-group { display:flex; flex-direction:column; min-width:0; } .une-nav .une-mega-group h4 { position:relative; margin:0 0 13px; padding-left:15px; color:#112452; font-size:15px; font-weight:700; line-height:1.35; } .une-nav .une-mega-group h4::before { content:""; position:absolute; left:0; top:7px; width:6px; height:6px; background:#00a859; } .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a, .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a:link, .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a:visited { display:block !important; height:auto !important; line-height:1.45 !important; padding:6px 15px !important; margin:0 !important; background:transparent !important; color:#222 !important; font-size:14px !important; font-weight:400 !important; text-transform:none !important; letter-spacing:normal !important; white-space:normal !important; text-shadow:none !important; transition:color .18s ease,padding-left .18s ease; } .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a:hover, .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a:focus { color:#f5a425 !important; padding-left:19px !important; } .background-header .une-nav .une-mega-menu { background:rgba(255,255,255,.97); } .une-institutional-section { background:#fff; padding:75px 0; } .une-institutional-block { scroll-margin-top:120px; } .une-institutional-heading { margin-bottom:28px; } .une-institutional-heading .eyebrow { display:inline-block; margin-bottom:8px; color:#00a859; font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; } .une-institutional-heading h2 { margin:0; color:#112452; font-size:32px; font-weight:700; line-height:1.2; } .une-institutional-heading p { max-width:760px; margin:12px 0 0; color:#666; font-size:15px; line-height:1.75; } .une-mission-vision-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; max-width:1000px; } .une-mv-card { padding:30px; border:1px solid #e8e8e8; border-radius:8px; background:#fff; } .une-mv-card h3 { position:relative; margin:0 0 18px; padding-left:16px; color:#112452; font-size:20px; font-weight:700; } .une-mv-card h3::before { content:""; position:absolute; left:0; top:8px; width:6px; height:6px; background:#00a859; } .une-mv-card p { margin:0; color:#333; font-size:15px; line-height:1.8; } .une-map-box { width:100%; height:430px; overflow:hidden; border-radius:18px; background:#fff; box-shadow:0 14px 35px rgba(0,0,0,.20); } .une-map-box iframe { display:block; width:100%; height:100%; border:0; } body.une-inner-page { background:#fff; } .une-inner-page .sub-header { position:relative; z-index:1001; } .une-inner-page .header-area, .une-inner-page .header-area.background-header { position:sticky !important; top:0 !important; left:auto !important; right:auto !important; width:100% !important; height:82px !important; background:#fff !important; box-shadow:0 2px 12px rgba(0,0,0,.08) !important; z-index:1000; } .une-inner-page .header-area .main-nav { min-height:82px; } .une-inner-page .header-area .main-nav .nav > li > a { color:#222 !important; } .une-inner-page .header-area .main-nav .nav > li > a:hover, .une-inner-page .header-area .main-nav .nav > li > a.active { color:#f5a425 !important; } .une-history-text { max-width:980px; } .une-history-text p { margin-bottom:18px; color:#333; font-size:15px; line-height:1.85; text-align:justify; } .une-history-highlight { margin:26px 0; padding:20px 24px; border-left:4px solid #00a859; background:#f8f9fa; color:#333; font-size:15px; line-height:1.75; } .une-authorities-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; max-width:900px; } .une-authority-card { padding:28px; border:1px solid #e8e8e8; border-radius:8px; background:#fff; } .une-authority-card .role { display:block; margin-bottom:8px; color:#00a859; font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; } .une-authority-card h3 { margin:0 0 8px; color:#112452; font-size:20px; font-weight:700; line-height:1.35; } .une-authority-card p { margin:0; color:#666; font-size:14px; } .une-doc-notice { max-width:980px; margin-top:28px; padding:34px; border:1px solid #e7e7e7; border-radius:10px; background:#fafafa; } .une-doc-notice .status { display:inline-block; margin-bottom:14px; padding:6px 10px; border-radius:999px; background:#eef8f2; color:#008f4c; font-size:12px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; } .une-doc-notice h3 { margin:0 0 12px; color:#112452; font-size:22px; font-weight:700; } .une-doc-notice p { margin:0; color:#4b4b4b; font-size:15px; line-height:1.8; } .une-doc-roadmap { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-top:28px; } .une-doc-roadmap .item { padding:22px; border:1px solid #eee; border-radius:8px; background:#fff; } .une-doc-roadmap .item i { margin-bottom:12px; color:#00a859; font-size:20px; } .une-doc-roadmap .item h4 { margin:0 0 8px; color:#112452; font-size:16px; font-weight:700; } .une-doc-roadmap .item p { margin:0; color:#666; font-size:14px; line-height:1.65; } @media (max-width:991px) { .une-nav > .mega-dropdown { position:relative !important; } .une-nav .une-mega-menu { position:static !important; width:100% !important; max-height:0; overflow:hidden; padding:0 20px !important; opacity:0; visibility:hidden; pointer-events:none; transform:none !important; background:#fff !important; box-shadow:none !important; border:0 !important; } .une-nav .mega-dropdown.mobile-open > .une-mega-menu, .une-nav .mega-dropdown:focus-within > .une-mega-menu { max-height:2600px; padding:20px !important; opacity:1; visibility:visible; pointer-events:auto; } .une-nav .une-mega-grid.columns-4, .une-nav .une-mega-grid.columns-3 { grid-template-columns:1fr !important; gap:20px !important; } .main-nav .logo img { width:54px; height:54px; } .une-map-box { height:320px; margin-bottom:28px; } .une-mission-vision-grid, .une-authorities-grid, .une-doc-roadmap { grid-template-columns:1fr; } .une-inner-page .header-area, .une-inner-page .header-area.background-header { height:auto !important; min-height:80px; } .une-history-text p { text-align:left; } } @media (max-width:575px) { .une-map-box { height:280px; border-radius:14px; } .contact-us .container { padding-left:18px; padding-right:18px; } } /* ========================================================== AJUSTE MÓVIL UNE - MENÚ LIMPIO ========================================================== */ .une-mobile-menu-title { display: none; } @media (max-width: 991px) { :root { --une-mobile-menu-bg: #f7f7f7; --une-mobile-blue: #112452; } /* Cabecera móvil */ .header-area .main-nav { position: relative; } /* Título MENU centrado */ .une-mobile-menu-title { display: block; position: absolute; top: 25px; left: 50%; transform: translateX(-50%); z-index: 10002; color: var(--une-mobile-blue); font-size: 14px; font-weight: 700; letter-spacing: .08em; line-height: 1; pointer-events: none; } /* Botón hamburguesa / X más pequeño */ .header-area .main-nav .menu-trigger { display: block !important; position: absolute !important; top: 20px !important; right: 18px !important; width: 32px !important; height: 32px !important; margin: 0 !important; z-index: 10003 !important; } .header-area .main-nav .menu-trigger span { position: absolute; top: 15px; left: 4px; display: block; width: 24px; height: 2px; padding: 0 !important; margin: 0 !important; background: #222 !important; font-size: 0 !important; line-height: 0 !important; color: transparent !important; transition: background .2s ease; } .header-area .main-nav .menu-trigger span::before, .header-area .main-nav .menu-trigger span::after { content: ""; position: absolute; left: 0; width: 24px; height: 2px; background: #222; transition: transform .2s ease, top .2s ease; } .header-area .main-nav .menu-trigger span::before { top: -7px; } .header-area .main-nav .menu-trigger span::after { top: 7px; } .header-area .main-nav .menu-trigger.active span { background: transparent !important; } .header-area .main-nav .menu-trigger.active span::before { top: 0; transform: rotate(45deg); } .header-area .main-nav .menu-trigger.active span::after { top: 0; transform: rotate(-45deg); } /* Fondo uniforme del menú móvil */ .header-area .main-nav .nav.une-nav, .header-area .main-nav .nav.une-nav > li, .header-area .main-nav .nav.une-nav > li > a, .une-nav .une-mega-menu, .une-nav .une-mega-grid, .une-nav .une-mega-column, .une-nav .une-mega-group { background: var(--une-mobile-menu-bg) !important; } /* Contenedor principal del menú */ .header-area .main-nav .nav.une-nav { max-height: calc(100vh - 78px); overflow-y: auto; overflow-x: hidden; } .header-area .main-nav .nav.une-nav > li > a { text-align: left !important; } /* Submenús: una sola columna y TODO alineado a la izquierda */ .une-nav .une-mega-menu { text-align: left !important; } .une-nav .une-mega-grid.columns-4, .une-nav .une-mega-grid.columns-3 { display: grid !important; grid-template-columns: 1fr !important; gap: 18px !important; width: 100% !important; margin: 0 !important; } .une-nav .une-mega-column, .une-nav .une-mega-group { width: 100% !important; align-items: flex-start !important; text-align: left !important; } /* Quitar los cuadrados verdes solamente en móvil */ .une-nav .une-mega-group h4 { width: 100% !important; margin: 0 0 6px !important; padding-left: 0 !important; text-align: left !important; color: var(--une-mobile-blue) !important; } .une-nav .une-mega-group h4::before { display: none !important; content: none !important; } .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a, .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a:link, .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a:visited { width: 100% !important; padding: 7px 0 !important; margin: 0 !important; text-align: left !important; } .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a:hover, .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a:focus { padding-left: 0 !important; } /* IMPORTANTE: en móvil abre/cierra únicamente con mobile-open. Esto permite que el segundo toque sobre la flecha cierre. */ .une-nav .mega-dropdown:focus-within > .une-mega-menu { max-height: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; } .une-nav .mega-dropdown.mobile-open > .une-mega-menu { max-height: 2800px !important; padding: 18px 24px 22px !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; } /* Flecha gira al desplegar */ .une-nav .mega-dropdown > a i { margin-left: auto; transition: transform .2s ease; } .une-nav .mega-dropdown.mobile-open > a i { transform: rotate(180deg); } } @media (max-width: 575px) { .une-mobile-menu-title { top: 24px; font-size: 13px; } .header-area .main-nav .menu-trigger { top: 19px !important; right: 16px !important; } } /* ========================================================== UNE EN CIFRAS - VIDEO ========================================================== */ .une-facts-video { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 18px; background: #000; box-shadow: 0 14px 35px rgba(0, 0, 0, .22); } .une-facts-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; } @media (max-width: 991px) { .une-facts-video { margin-top: 28px; border-radius: 14px; } } /* ========================================================== AJUSTE MÓVIL UNE - ANCHO COMPLETO + CIERRE COMPACTO Este bloque está al final para sobrescribir el CSS previo. ========================================================== */ @media (max-width: 991px) { :root { --une-mobile-menu-bg: #ffffff; --une-mobile-blue: #112452; } html, body { width: 100%; max-width: 100%; overflow-x: hidden; } /* La cabecera ocupa TODO el ancho del viewport */ .header-area, .header-area.background-header { left: 0 !important; right: 0 !important; width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; background: #ffffff !important; } .header-area .container { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; } .header-area .row { width: 100% !important; margin: 0 !important; } .header-area .col-12 { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; padding: 0 !important; } .header-area .main-nav { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; background: #ffffff !important; box-sizing: border-box; } /* Logo conserva una separación limpia respecto al borde */ .header-area .main-nav .logo { margin-left: 10px !important; } /* Menú desplegado: blanco de borde a borde */ .header-area .main-nav .nav.une-nav { left: 0 !important; right: 0 !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; background: var(--une-mobile-menu-bg) !important; border-left: 0 !important; border-right: 0 !important; } .header-area .main-nav .nav.une-nav > li { width: 100% !important; margin: 0 !important; padding: 0 !important; background: var(--une-mobile-menu-bg) !important; box-sizing: border-box !important; } .header-area .main-nav .nav.une-nav > li > a { width: 100% !important; margin: 0 !important; padding-left: 20px !important; padding-right: 20px !important; box-sizing: border-box !important; background: var(--une-mobile-menu-bg) !important; } .une-nav .une-mega-menu, .une-nav .une-mega-grid, .une-nav .une-mega-column, .une-nav .une-mega-group { width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; box-sizing: border-box !important; background: var(--une-mobile-menu-bg) !important; } /* * MENU centrado. * Se mantiene independiente del logo y del botón de cierre. */ .une-mobile-menu-title { top: 27px !important; left: 50% !important; transform: translateX(-50%) !important; color: var(--une-mobile-blue) !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: .08em !important; } /* * Hamburguesa/X compacta. * 26 x 26 es un tamaño visual estándar sin dominar la cabecera. */ .header-area .main-nav .menu-trigger { top: 24px !important; right: 20px !important; width: 26px !important; height: 26px !important; min-width: 26px !important; min-height: 26px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; outline: 0 !important; background: transparent !important; box-shadow: none !important; } .header-area .main-nav .menu-trigger span { top: 12px !important; left: 3px !important; width: 20px !important; height: 1.5px !important; background: #222222 !important; } .header-area .main-nav .menu-trigger span::before, .header-area .main-nav .menu-trigger span::after { left: 0 !important; width: 20px !important; height: 1.5px !important; background: #222222 !important; } .header-area .main-nav .menu-trigger span::before { top: -6px !important; } .header-area .main-nav .menu-trigger span::after { top: 6px !important; } .header-area .main-nav .menu-trigger.active span { background: transparent !important; } .header-area .main-nav .menu-trigger.active span::before, .header-area .main-nav .menu-trigger.active span::after { top: 0 !important; } /* * Submenús alineados a la izquierda y sin indicadores verdes. */ .une-nav .une-mega-group { align-items: flex-start !important; text-align: left !important; } .une-nav .une-mega-group h4 { width: 100% !important; padding-left: 0 !important; text-align: left !important; } .une-nav .une-mega-group h4::before { display: none !important; content: none !important; } .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a, .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a:link, .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a:visited { width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; text-align: left !important; } /* Mantener apertura/cierre por segundo toque */ .une-nav .mega-dropdown:focus-within > .une-mega-menu { max-height: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; } .une-nav .mega-dropdown.mobile-open > .une-mega-menu { max-height: 2800px !important; padding: 18px 20px 22px !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; } } @media (max-width: 575px) { .header-area .main-nav .logo { padding-top: 14px !important; margin-left: 18px !important; } .header-area .main-nav .menu-trigger { right: 18px !important; } .header-area .main-nav .nav.une-nav > li > a { padding-left: 18px !important; padding-right: 18px !important; } .une-nav .mega-dropdown.mobile-open > .une-mega-menu { padding-left: 18px !important; padding-right: 18px !important; } } /* Quitar indicadores verdes */ .une-nav .une-mega-group h4::before, .une-mv-card h3::before { display: none !important; content: none !important; } .une-nav .une-mega-group h4, .une-mv-card h3 { padding-left: 0 !important; } /* ========================================================== OFERTA ACADÉMICA - FACULTADES Y ESCUELAS ========================================================== */ .une-faculty-carousel .owl-stage { display: flex; } .une-faculty-carousel .owl-item { display: flex; height: auto; } .une-faculty-carousel .owl-item .item { display: flex; flex-direction: column; width: 100%; height: 100%; margin-bottom: 0; overflow: hidden; background: #ffffff; box-shadow: 0 2px 12px rgba(0, 0, 0, .06); } .une-faculty-carousel .owl-item .item > img { display: block; width: 100%; height: 240px; object-fit: cover; object-position: center; } .une-faculty-carousel .owl-item .item .down-content { display: flex; flex: 1; align-items: center; justify-content: center; min-height: 112px; padding: 22px 20px; background: #ffffff; } .une-faculty-carousel .owl-item .item .down-content h4 { width: 100%; margin: 0; color: #112452; font-size: 18px; font-weight: 600; line-height: 1.35; text-align: center; } @media (max-width: 991px) { .une-faculty-carousel .owl-item .item > img { height: 220px; } .une-faculty-carousel .owl-item .item .down-content { min-height: 100px; padding: 20px 16px; } .une-faculty-carousel .owl-item .item .down-content h4 { font-size: 17px; } } @media (max-width: 575px) { .une-faculty-carousel .owl-item .item > img { height: 205px; } .une-faculty-carousel .owl-item .item .down-content { min-height: 92px; } } /* ========================================================== REDISEÑO UNE - ETAPA 1 Barra superior + Header + Hero Mantiene intacta la estructura del template base. ========================================================== */ :root { --une-yellow: #F8B229; --une-coral: #EA4630; --une-red: #BB2528; --une-green: #146B3A; --une-dark-green: #0B3D2E; --une-black: #171717; --une-text: #2B2B2B; --une-white: #FFFFFF; --une-light: #F7F7F5; } /* Barra superior */ .sub-header { background: var(--une-dark-green) !important; } .sub-header .left-content p { color: var(--une-white) !important; } .sub-header .left-content p em { color: var(--une-yellow) !important; font-style: normal !important; } .sub-header .right-icons ul { display: flex; align-items: center; justify-content: flex-end; gap: 18px; } .sub-header .right-icons ul li { margin: 0 !important; } .sub-header .right-icons ul li a { color: var(--une-white) !important; font-size: 18px !important; transition: color .2s ease, transform .2s ease; } .sub-header .right-icons ul li a:hover { color: var(--une-yellow) !important; transform: translateY(-2px); } /* Header principal */ .header-area, .header-area.background-header { background: rgba(255, 255, 255, .97) !important; box-shadow: 0 2px 14px rgba(0, 0, 0, .07) !important; } .header-area .main-nav .logo img { padding-top: 20px !important; width: 76px !important; height: 76px !important; object-fit: contain !important; object-position: center !important; } .header-area .main-nav .nav > li > a { position: relative; color: var(--une-black) !important; font-size: 14px !important; font-weight: 600 !important; letter-spacing: .025em !important; } .header-area .main-nav .nav > li > a:hover, .header-area .main-nav .nav > li > a:focus, .header-area .main-nav .nav > li > a.active { color: var(--une-green) !important; } .header-area .main-nav .nav > li > a.active::after { content: ""; position: absolute; left: 50%; bottom: 7px; width: 24px; height: 2px; transform: translateX(-50%); border-radius: 999px; background: var(--une-yellow); } .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a, .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a:link, .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a:visited { color: var(--une-text) !important; } .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a:hover, .main-nav .nav.une-nav .mega-dropdown .une-mega-menu .une-mega-group > a:focus { color: var(--une-green) !important; } .une-nav .une-mega-group h4 { color: var(--une-black) !important; } /* Hero */ .main-banner { position: relative; overflow: hidden; } .main-banner #bg-video { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .main-banner .video-overlay { background: rgba(31, 39, 43, .72) !important; } .main-banner .caption { max-width: 760px; } .main-banner .caption h6 { margin-bottom: 16px !important; color: var(--une-yellow) !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: .12em !important; text-transform: uppercase !important; } .main-banner .caption h2 { max-width: 720px; margin-bottom: 22px !important; color: var(--une-white) !important; font-size: 52px !important; font-weight: 700 !important; line-height: 1.08 !important; letter-spacing: -.02em !important; text-transform: none !important; } .main-banner .caption p { max-width: 680px; margin-bottom: 28px !important; color: rgba(255, 255, 255, .94) !important; font-size: 17px !important; line-height: 1.75 !important; } .main-banner .main-button-red a { display: inline-flex !important; align-items: center; justify-content: center; padding: 14px 24px !important; border-radius: 999px !important; background: var(--une-white) !important; color: var(--une-black) !important; font-size: 14px !important; font-weight: 700 !important; text-transform: none !important; transition: background .2s ease, color .2s ease, transform .2s ease !important; } .main-banner .main-button-red a:hover { background: var(--une-yellow) !important; color: var(--une-black) !important; transform: translateY(-2px); } /* Ajuste móvil de esta primera etapa */ @media (max-width: 991px) { .sub-header .right-icons ul { justify-content: center; } .header-area .main-nav .nav > li > a.active::after { display: none; } .main-banner .caption { max-width: 100%; } .main-banner .caption h6 { font-size: 12px !important; } .main-banner .caption h2 { max-width: 620px; font-size: 38px !important; } .main-banner .caption p { max-width: 620px; font-size: 15px !important; line-height: 1.65 !important; } } @media (max-width: 575px) { .main-banner .video-overlay { background: rgba(31, 39, 43, .76) !important; } .main-banner .caption h2 { font-size: 32px !important; line-height: 1.12 !important; } .main-banner .caption p { font-size: 14px !important; } } /* ========================================================== REDISEÑO UNE - ETAPA 2 Pasarela de accesos institucionales Se conserva Owl Carousel y su movimiento original. ========================================================== */ .services .owl-service-item .item { background-color: var(--une-white) !important; background-image: none !important; border-top: 4px solid var(--une-yellow) !important; overflow: hidden; transition: background-color .2s ease, transform .2s ease; } .services .owl-service-item .item:hover { background-color: var(--une-dark-green) !important; border-top: 4px solid var(--une-yellow) !important; transform: translateY(-3px); } .services .owl-service-item .item .icon i { color: var(--une-green)!important; font-size: 42px !important; line-height: 1 !important; } .services .owl-service-item .item:hover .icon i { color: var(--une-yellow)!important; font-size: 42px !important; line-height: 1 !important; } .services .owl-service-item .item .down-content h4, .services .owl-service-item .item .down-content p { color: #0e0a0a !important; } .services .owl-service-item .item:hover .down-content h4, .services .owl-service-item .item:hover .down-content p { color: #ffffff !important; } .services .owl-service-item .item .down-content h4 { font-weight: 700 !important; } .services .une-service-link { display: block; width: 100%; height: 100%; color: inherit !important; text-decoration: none !important; } .services .une-service-link:hover { color: inherit !important; text-decoration: none !important; } .services .une-service-action { display: inline-block; margin-top: 14px; color: var(--une-green)!important; font-size: 13px; font-weight: 700; } .services .owl-service-item .item:hover .une-service-action { color: var(--une-yellow) !important; } /* ========================================================== MISIÓN Y VISIÓN - REDISEÑO INSTITUCIONAL No afecta el carrusel ni otras secciones. ========================================================== */ #mision-vision.une-institutional-section { background: #F7F7F5 !important; padding: 88px 0 92px !important; } #mision-vision .une-institutional-heading { margin-bottom: 36px !important; } #mision-vision .une-institutional-heading .eyebrow { display: block !important; margin-bottom: 10px !important; color: #146B3A !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: .14em !important; text-transform: uppercase !important; } #mision-vision .une-institutional-heading h2 { position: relative; margin: 0 !important; padding-bottom: 20px !important; color: #171717 !important; font-size: 36px !important; font-weight: 700 !important; line-height: 1.15 !important; letter-spacing: -.02em; } #mision-vision .une-institutional-heading h2::after { content: ""; position: absolute; left: 0; bottom: 0; width: 56px; height: 4px; border-radius: 999px; background: #F8B229; } #mision-vision .une-mission-vision-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 28px !important; max-width: 1120px !important; } #mision-vision .une-mv-card { position: relative; min-height: 285px; padding: 40px 38px !important; border-radius: 16px !important; box-shadow: none !important; overflow: hidden; } #mision-vision .une-mv-card::before { content: ""; display: block; width: 46px; height: 4px; margin-bottom: 24px; border-radius: 999px; background: #F8B229; } #mision-vision .une-mv-card:first-child { background: #0B3D2E !important; border: 1px solid #0B3D2E !important; } #mision-vision .une-mv-card:first-child h3, #mision-vision .une-mv-card:first-child p { color: #FFFFFF !important; } #mision-vision .une-mv-card:last-child { background: #FFFFFF !important; border: 1px solid #E1E4E2 !important; } #mision-vision .une-mv-card:last-child h3 { color: #171717 !important; } #mision-vision .une-mv-card:last-child p { color: #444444 !important; } #mision-vision .une-mv-card h3 { margin: 0 0 18px !important; padding-left: 0 !important; font-size: 24px !important; font-weight: 700 !important; line-height: 1.2 !important; } #mision-vision .une-mv-card h3::before { display: none !important; content: none !important; } #mision-vision .une-mv-card p { max-width: 510px; margin: 0 !important; font-size: 15px !important; line-height: 1.85 !important; } @media (max-width: 991px) { #mision-vision.une-institutional-section { padding: 68px 0 72px !important; } #mision-vision .une-mission-vision-grid { grid-template-columns: 1fr !important; gap: 20px !important; } #mision-vision .une-mv-card { min-height: auto; padding: 32px 28px !important; } } @media (max-width: 575px) { #mision-vision.une-institutional-section { padding: 54px 0 58px !important; } #mision-vision .une-institutional-heading h2 { font-size: 30px !important; } #mision-vision .une-mv-card { padding: 28px 24px !important; border-radius: 14px !important; } #mision-vision .une-mv-card h3 { font-size: 21px !important; } #mision-vision .une-mv-card p { font-size: 14px !important; line-height: 1.75 !important; } } /* ========================================================== FONDOS INSTITUCIONALES UNE Mantiene meetings-bg.jpg y reemplaza solamente el tono gris por una capa verde translúcida. Sin multiply para evitar negro. ========================================================== */ #meetings.upcoming-meetings, #courses.our-courses, #contact.contact-us { background-color: transparent !important; background-image: linear-gradient( rgba(0, 0, 0, .20), rgba(0, 0, 0, .20) ), url('/edu-meeting/assets/images/meetings-bg.jpg') !important; background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; background-blend-mode: normal !important; } /* * Caja lateral de Actualidad: * el template original pone algunos LI en línea. * Los forzamos a una opción por renglón sin cambiar la tarjeta. */ #meetings .categories ul li { display: block !important; width: 100% !important; margin: 0 0 12px 0 !important; padding: 0 !important; } #meetings .categories ul li:last-child { margin-bottom: 0 !important; } #meetings .categories ul li a { display: block !important; width: 100% !important; line-height: 1.5 !important; } #meetings .categories .main-button-red a { background: #0B3D2E !important; color: #FFFFFF !important; } #meetings .categories .main-button-red a:hover { background: #146B3A !important; color: #FFFFFF !important; } /* ========================================================== UNE EN CIFRAS - FONDO TUCÚ Conserva la estructura y el video actuales. ========================================================== */ .our-facts { position: relative; background-image: linear-gradient( rgba(31, 39, 43, .72), rgba(31, 39, 43, .72) ), url('/images/tucu.jpeg') !important; background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; } .our-facts h2 { color: #FFFFFF !important; } /* ========================================================== CONTACTO - TARJETA VERDE ========================================================== */ #contact.contact-us .right-info { background: #0B3D2E !important; border-radius: 18px !important; box-shadow: 0 14px 35px rgba(0, 0, 0, .18) !important; } #contact.contact-us .right-info ul li { border-bottom-color: rgba(255, 255, 255, .18) !important; } #contact.contact-us .right-info ul li:last-child { border-bottom: 0 !important; } #contact.contact-us .right-info ul li h6 { color: #F8B229 !important; } #contact.contact-us .right-info ul li span { color: #FFFFFF !important; } /* ========================================================== FOOTER INSTITUCIONAL UNE ========================================================== */ .une-footer { background: #0B3D2E; color: #FFFFFF; } .une-footer-main { padding: 58px 0 46px; } .une-footer-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 56px; align-items: start; } .une-footer-brand img { display: block; width: 72px; height: 72px; object-fit: contain; margin-bottom: 18px; } .une-footer-brand h3 { margin: 0 0 10px; color: #FFFFFF; font-size: 18px; font-weight: 700; } .une-footer-brand p { max-width: 360px; margin: 0; color: rgba(255, 255, 255, .78); font-size: 14px; line-height: 1.75; } .une-footer h4 { margin: 0 0 18px; color: #F8B229; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; } .une-footer-links { margin: 0; padding: 0; list-style: none; } .une-footer-links li { margin-bottom: 10px; } .une-footer-links a { color: rgba(255, 255, 255, .82); font-size: 14px; transition: color .18s ease, padding-left .18s ease; } .une-footer-links a:hover { color: #F8B229; padding-left: 3px; } .une-footer-social-text { margin: 0 0 18px; color: rgba(255, 255, 255, .78); font-size: 14px; line-height: 1.65; } .une-footer-socials { display: flex; gap: 12px; align-items: center; } .une-footer-socials a { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid rgba(255, 255, 255, .24); border-radius: 50%; color: #FFFFFF; font-size: 15px; transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease; } .une-footer-socials a:hover { background: #F8B229; border-color: #F8B229; color: #171717; transform: translateY(-2px); } .une-footer-bottom { border-top: 1px solid rgba(255, 255, 255, .14); } .une-footer-bottom-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 62px; } .une-footer-copy { margin: 0; color: rgba(255, 255, 255, .72); font-size: 12px; } @media (max-width: 991px) { .une-footer-grid { grid-template-columns: 1fr 1fr; gap: 38px; } .une-footer-brand { grid-column: 1 / -1; } .une-footer-bottom-inner { padding: 18px 0; flex-direction: column; align-items: flex-start; } } @media (max-width: 575px) { .une-footer-main { padding: 44px 0 36px; } .une-footer-grid { grid-template-columns: 1fr; gap: 32px; } .une-footer-brand { grid-column: auto; } .une-footer-brand img { width: 64px; height: 64px; } } /* ========================================================== ESPACIADO FINAL - CONTACTO / FOOTER ========================================================== */ #contact.contact-us { padding-bottom: 72px !important; } .une-footer-main { padding-top: 72px !important; } @media (max-width: 991px) { #contact.contact-us { padding-bottom: 56px !important; } .une-footer-main { padding-top: 58px !important; } } @media (max-width: 575px) { #contact.contact-us { padding-bottom: 44px !important; } .une-footer-main { padding-top: 48px !important; } } /* ========================================================== NOTICIAS UNE - PREPARADA PARA CRUD landing_news ========================================================== */ .une-news-section { padding: 84px 0 76px; background: #F7F7F5; } .une-news-heading { max-width: 760px; margin-bottom: 34px; } .une-news-heading .eyebrow { display: block; margin-bottom: 9px; color: #146B3A; font-size: 12px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; } .une-news-heading h2 { position: relative; margin: 0 0 17px; padding-bottom: 18px; color: #171717; font-size: 36px; font-weight: 700; line-height: 1.15; } .une-news-heading h2::after { content: ""; position: absolute; left: 0; bottom: 0; width: 54px; height: 4px; border-radius: 999px; background: #F8B229; } .une-news-heading p { margin: 0; color: #5F6363; font-size: 15px; line-height: 1.7; } .une-news-card { height: calc(100% - 28px); margin-bottom: 28px; overflow: hidden; border: 1px solid #E2E5E3; border-radius: 16px; background: #FFFFFF; box-shadow: 0 7px 24px rgba(0, 0, 0, .06); transition: transform .2s ease, box-shadow .2s ease; } .une-news-card:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(0, 0, 0, .10); } .une-news-image { height: 220px; overflow: hidden; background: #EDEFEF; } .une-news-image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; } .une-news-card:hover .une-news-image img { transform: scale(1.025); } .une-news-content { padding: 25px 25px 28px; } .une-news-date { display: block; margin-bottom: 10px; color: #146B3A; font-size: 12px; font-weight: 700; letter-spacing: .04em; } .une-news-content h3 { margin: 0 0 12px; color: #171717; font-size: 19px; font-weight: 700; line-height: 1.35; } .une-news-content p { margin: 0 0 18px; color: #5F6363; font-size: 14px; line-height: 1.7; } .une-news-link { color: #146B3A; font-size: 13px; font-weight: 700; } .une-news-empty { padding: 30px; border: 1px solid #E2E5E3; border-radius: 14px; background: #FFFFFF; color: #5F6363; text-align: center; } @media (max-width: 991px) { .une-news-section { padding: 68px 0 60px; } .une-news-image { height: 205px; } } @media (max-width: 575px) { .une-news-section { padding: 56px 0 48px; } .une-news-heading h2 { font-size: 30px; } .une-news-card { border-radius: 14px; } } /* ========================================================== FOOTER - CIERRE SIMPLE ========================================================== */ .une-footer-bottom-inner { justify-content: center !important; text-align: center; } /* ========================================================== CTAs - ICONO DOBLE FLECHA ========================================================== */ .main-banner .main-button-red a i, .services .une-service-action i, .une-news-link i { margin-left: 7px; font-size: .9em; vertical-align: middle; } /* ========================================================== FACULTADES Y ESCUELAS - LIMPIEZA DE TARJETAS Quita la línea gris heredada del template original. ========================================================== */ .une-faculty-carousel .owl-item .item, .une-faculty-carousel .owl-item .item .down-content, .une-faculty-carousel .owl-item .item .down-content h4 { border-bottom: 0 !important; } .une-faculty-carousel .owl-item .item .down-content::before, .une-faculty-carousel .owl-item .item .down-content::after, .une-faculty-carousel .owl-item .item .down-content h4::before, .une-faculty-carousel .owl-item .item .down-content h4::after { display: none !important; content: none !important; border: 0 !important; } /* ========================================================== FACULTADES Y ESCUELAS - COLOR DE NOMBRES ========================================================== */ .une-faculty-carousel .owl-item .item .down-content h4 { color: #BB2528 !important; } /* ========================================================== MENÚ MÓVIL - CABECERA BLANCA UNIFICADA Elimina el efecto de "cajas blancas dentro de otra caja". ========================================================== */ @media (max-width: 991px) { .header-area, .header-area.background-header { background: #FFFFFF !important; border: 0 !important; padding: 0 !important; box-shadow: 0 3px 12px rgba(0, 0, 0, .08) !important; } .header-area .container, .header-area .row, .header-area .col-12, .header-area .main-nav { background: #FFFFFF !important; border: 0 !important; box-shadow: none !important; } .header-area .container, .header-area .row, .header-area .col-12 { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; } .header-area .main-nav { width: 100% !important; max-width: 100% !important; margin: 0 !important; box-sizing: border-box !important; } /* Quitar cualquier pseudo-elemento visual heredado del template */ .header-area .main-nav::before, .header-area .main-nav::after { display: none !important; content: none !important; } /* Logo, MENU y hamburguesa comparten exactamente el mismo fondo */ .header-area .main-nav .logo, .une-mobile-menu-title, .header-area .main-nav .menu-trigger { background: transparent !important; border: 0 !important; box-shadow: none !important; } /* El desplegable mantiene el mismo blanco de la cabecera */ .header-area .main-nav .nav.une-nav, .header-area .main-nav .nav.une-nav > li, .header-area .main-nav .nav.une-nav > li > a, .une-nav .une-mega-menu, .une-nav .une-mega-grid, .une-nav .une-mega-column, .une-nav .une-mega-group { background: #FFFFFF !important; } } /* ========================================================== FACULTADES Y ESCUELAS - TARJETA TIPO NOTICIA ========================================================== */ .une-faculty-carousel .owl-item .item { overflow: hidden !important; border: 1px solid #E2E5E3 !important; border-radius: 16px !important; background: #FFFFFF !important; box-shadow: 0 7px 24px rgba(0, 0, 0, .06) !important; transition: transform .2s ease, box-shadow .2s ease !important; } .une-faculty-carousel .owl-item .item:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(0, 0, 0, .10) !important; } .une-faculty-carousel .owl-item .item > img { border: 0 !important; border-radius: 0 !important; transition: transform .3s ease; } .une-faculty-carousel .owl-item .item:hover > img { transform: scale(1.025); } .une-faculty-carousel .owl-item .item .down-content { border: 0 !important; background: #FFFFFF !important; } .une-faculty-carousel .owl-item .item .down-content h4 { border: 0 !important; color: #BB2528 !important; } /* ========================================================== MENÚ MÓVIL - ALINEACIÓN + ICONO X ========================================================== */ .une-menu-close-icon { display: none; } @media (max-width: 991px) { /* * Logo, palabra MENU y botón quedan centrados * sobre el mismo eje vertical. */ .header-area .main-nav { min-height: 82px !important; } .une-mobile-menu-title { top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; margin: 0 !important; line-height: 1 !important; } .header-area .main-nav .menu-trigger { top: 50% !important; right: 18px !important; transform: translateY(-50%) !important; width: 30px !important; height: 30px !important; } /* * Estado normal: hamburguesa original. * Estado abierto: ocultamos las rayas y usamos fa-xmark. */ .header-area .main-nav .menu-trigger .une-menu-close-icon { display: none; position: absolute; inset: 0; align-items: center; justify-content: center; color: #222222; font-size: 24px; line-height: 30px; text-align: center; } .header-area .main-nav .menu-trigger.active span, .header-area .main-nav .menu-trigger.active span::before, .header-area .main-nav .menu-trigger.active span::after { display: none !important; } .header-area .main-nav .menu-trigger.active .une-menu-close-icon { display: flex !important; } } @media (max-width: 575px) { .une-mobile-menu-title { top: 50% !important; } .header-area .main-nav .menu-trigger { top: 50% !important; right: 18px !important; } } /* ========================================================== AJUSTE FINAL MÓVIL + FACULTADES ========================================================== */ /* Nombres de facultades/escuelas en negro */ .une-faculty-carousel .owl-item .item .down-content h4 { color: #171717 !important; } @media (max-width: 991px) { /* * MENU y botón de apertura/cierre se anclan a la fila superior * de 82px. No usan 50% porque el