
@media (max-width:1280px){.program-detail,.news-detail{padding:28px}.hero-content.hero-centered-card{padding-bottom:68px}}
@media (max-width:992px){.hero-stage.home-stage{min-height:430px}.hero-stage.inner-stage{min-height:320px}.program-detail,.news-detail{padding:24px;border-radius:28px}.program-detail-media,.news-detail-media,.news-detail-embed{min-height:280px}.admin-sidebar{height:auto;position:relative}.admin-main{padding:24px}}
@media (max-width:768px){.card.card-pro{padding:20px}.card.card-pro h3{font-size:1.24rem;min-height:auto}.card.card-pro p{min-height:auto;-webkit-line-clamp:5}.news-media{min-height:210px}.hero-card-box{max-width:92vw;padding:24px}.hero-card-box h1{font-size:clamp(1.85rem,8vw,2.4rem)}.program-detail-top h1,.news-detail-top h1{font-size:clamp(1.8rem,7vw,2.7rem)}.program-detail-actions,.news-detail-actions{flex-direction:column;align-items:stretch}.program-detail-meta{gap:10px}.program-tabs{gap:10px}.login-box{padding:26px;border-radius:26px}}
@media (max-width:560px){.hero-stage.home-stage{min-height:390px}.hero-content.hero-centered-card{padding:20px 20px 66px}.program-detail,.news-detail{padding:20px}.program-detail-media,.news-detail-media,.news-detail-embed{min-height:220px}.news-media{aspect-ratio:4/3;min-height:190px}}


/* POSICION VERTICAL: FLECHA ARRIBA, WHATSAPP ABAJO */
.back-to-top,
.btn-top,
.scroll-top,
#backToTop {
    bottom: 90px !important;
    right: 20px !important;
}

.whatsapp-float,
.btn-whatsapp,
.float-whatsapp,
#whatsapp {
    bottom: 20px !important;
    right: 20px !important;
}


/* FIX: ALINEACION VERTICAL PERFECTA FLECHA / WHATSAPP */
.whatsapp-float,
.btn-whatsapp,
.float-whatsapp,
#whatsapp {
    right: 20px !important;
    left: auto !important;
    transform: none !important;
    bottom: 20px !important;
}

.back-to-top,
.btn-top,
.scroll-top,
#backToTop {
    right: 20px !important;
    left: auto !important;
    transform: none !important;
    bottom: 100px !important;
}


/* ==========================================================
   FIX FINAL: BOTONES FLOTANTES HORIZONTALES WHATSAPP + SUBIR
   Enfocado únicamente en estética, ancho y alineación.
   ========================================================== */
.floating-actions{
    position:fixed !important;
    right:18px !important;
    bottom:18px !important;
    left:auto !important;
    top:auto !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:10px !important;
    z-index:1600 !important;
    pointer-events:none !important;
}

.floating-actions .back-to-top,
.floating-actions .whatsapp-floating-link{
    position:relative !important;
    right:auto !important;
    bottom:auto !important;
    left:auto !important;
    top:auto !important;
    margin:0 !important;
    transform:none !important;
    pointer-events:auto !important;
}

.floating-actions .back-to-top{
    order:1 !important;
    width:50px !important;
    height:50px !important;
    min-width:50px !important;
    border-radius:999px !important;
    display:grid !important;
    place-items:center !important;
    background:linear-gradient(180deg,#f0c958,#d6a52c) !important;
    color:#0d2b5b !important;
    border:1px solid rgba(13,43,91,.08) !important;
    box-shadow:0 12px 24px rgba(214,165,44,.28) !important;
    font-size:1.35rem !important;
    line-height:1 !important;
}

.floating-actions .whatsapp-floating-link{
    order:2 !important;
    width:58px !important;
    height:58px !important;
    min-width:58px !important;
    max-width:58px !important;
    border-radius:999px !important;
    display:grid !important;
    place-items:center !important;
    background:transparent !important;
    box-shadow:none !important;
    filter:none !important;
    overflow:visible !important;
}

.floating-actions .whatsapp-floating-link::after{
    content:none !important;
    display:none !important;
}

.floating-actions .whatsapp-floating-link::before{
    content:'' !important;
    position:absolute !important;
    inset:-5px !important;
    border-radius:999px !important;
    border:1px solid rgba(37,211,102,.25) !important;
    animation:pulseFlat 2.2s infinite !important;
}

.floating-actions .whatsapp-floating-core{
    width:58px !important;
    height:58px !important;
    border-radius:999px !important;
    display:grid !important;
    place-items:center !important;
    color:#fff !important;
    background:radial-gradient(circle at 32% 28%,#57ed90 0%,#25D366 48%,#16b955 100%) !important;
    box-shadow:0 12px 26px rgba(37,211,102,.32), inset 0 -5px 0 rgba(0,0,0,.12) !important;
}

.floating-actions .whatsapp-floating-core svg{
    width:31px !important;
    height:31px !important;
    display:block !important;
}

.floating-actions .back-to-top:hover,
.floating-actions .whatsapp-floating-link:hover .whatsapp-floating-core{
    transform:translateY(-2px) !important;
}

@media (max-width:700px){
    .floating-actions{
        right:12px !important;
        bottom:12px !important;
        gap:8px !important;
    }
    .floating-actions .back-to-top{
        width:46px !important;
        height:46px !important;
        min-width:46px !important;
        font-size:1.2rem !important;
    }
    .floating-actions .whatsapp-floating-link,
    .floating-actions .whatsapp-floating-core{
        width:54px !important;
        height:54px !important;
        min-width:54px !important;
        max-width:54px !important;
    }
    .floating-actions .whatsapp-floating-core svg{
        width:29px !important;
        height:29px !important;
    }
}






/* =========================================================
   PARCHE RESPONSIVE FINAL USEPS
   - Menú 100% adaptable en móviles.
   - Submenús precisos sin zona muerta en escritorio.
   - Docentes sin submenú visual en el frontend.
   ========================================================= */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

/* Corrige el comportamiento base de megamenús: ocultos hasta hover/open. */
.site-header .menu-item > .mega-menu,
.site-header .menu-item > .submenu {
  display: none !important;
}

.site-header .menu-item.has-children:hover > .submenu,
.site-header .menu-item.has-children.open > .submenu {
  display: block !important;
}

.site-header .menu-item.has-children:hover > .mega-menu,
.site-header .menu-item.has-children.open > .mega-menu {
  display: grid !important;
}

/* Puente invisible para que el cursor no pierda el submenú al bajar. */
@media (min-width: 1081px) {
  .site-header .menu-item.has-children::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 16px;
    z-index: 1199;
  }

  .site-header .submenu,
  .site-header .mega-menu {
    top: calc(100% + 4px) !important;
  }

  .site-header .mega-two-cols {
    grid-template-columns: repeat(2, minmax(190px, 1fr)) !important;
  }

  .site-header .mega-three-cols {
    grid-template-columns: repeat(3, minmax(170px, 1fr)) !important;
  }
}

/* Docentes debe mostrarse como enlace directo, sin submenús. */
.site-header .menu-slug-docentes > .submenu,
.site-header .menu-slug-docentes > .mega-menu {
  display: none !important;
}

.site-header .menu-slug-docentes > a::after {
  content: none !important;
}

@media (max-width: 1080px) {
  .site-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 3000 !important;
    width: 100% !important;
  }

  .top-strip {
    display: none !important;
  }

  .nav-shell {
    overflow: visible !important;
    position: relative !important;
  }

  .container.nav-main,
  .nav-main {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 10px 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
  }

  .brand {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 62px) !important;
    gap: 10px !important;
  }

  .brand-logo,
  .brand-mark {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    object-fit: contain !important;
  }

  .brand-copy {
    min-width: 0 !important;
  }

  .brand-copy strong {
    font-size: 1.2rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  .brand-copy span {
    display: block !important;
    max-width: 220px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: .72rem !important;
    line-height: 1.2 !important;
  }

  .menu-toggle {
    display: inline-grid !important;
    place-items: center !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    margin-left: auto !important;
    border-radius: 14px !important;
    font-size: 1.35rem !important;
    cursor: pointer !important;
  }

  #mainMenu.menu,
  .site-header .menu {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    display: none !important;
    flex: 0 0 100% !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    margin: 8px 0 0 !important;
    padding: 12px !important;
    border-radius: 20px !important;
    background: linear-gradient(180deg, #0d2b5b 0%, #071a38 100%) !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    box-shadow: 0 22px 46px rgba(6,20,44,.32) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    max-height: calc(100vh - 82px) !important;
    z-index: 3100 !important;
  }

  #mainMenu.menu.open,
  .site-header .menu.open {
    display: flex !important;
  }

  .site-header .menu > li,
  .site-header .menu-item {
    width: 100% !important;
    position: relative !important;
  }

  .site-header .menu > li > a,
  .site-header .menu-item > a {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 48px !important;
    padding: 13px 15px !important;
    border-radius: 14px !important;
    white-space: normal !important;
    line-height: 1.25 !important;
    font-size: .98rem !important;
    color: #ffffff !important;
    background: rgba(255,255,255,.055) !important;
  }

  .site-header .menu > li > a.active,
  .site-header .menu > li > a:hover {
    background: rgba(214,165,44,.16) !important;
    color: #f7d26c !important;
  }

  .site-header .menu-item.has-children > a::after {
    content: "▾" !important;
    display: inline-block !important;
    margin-left: 12px !important;
    font-size: .8rem !important;
    opacity: .9 !important;
    transition: transform .2s ease !important;
  }

  .site-header .menu-item.has-children.open > a::after {
    transform: rotate(180deg) !important;
  }

  .site-header .submenu,
  .site-header .mega-menu,
  .site-header .mega-two-cols,
  .site-header .mega-three-cols {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 7px 0 0 !important;
    padding: 14px !important;
    border-radius: 16px !important;
    box-shadow: none !important;
    background: #ffffff !important;
    border: 1px solid rgba(214,165,44,.22) !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    overflow: hidden !important;
  }

  .site-header .submenu::before,
  .site-header .mega-menu::before {
    display: none !important;
  }

  .site-header .menu-item.has-children.open > .submenu,
  .site-header .menu-item.has-children.open > .mega-menu {
    display: block !important;
  }

  .site-header .mega-col {
    width: 100% !important;
  }

  .site-header .mega-col + .mega-col {
    margin-top: 12px !important;
  }

  .site-header .mega-col h4 {
    margin: 0 0 10px !important;
    padding-bottom: 8px !important;
    font-size: .82rem !important;
    color: #0d2b5b !important;
    border-bottom: 2px solid #d6a52c !important;
  }

  .site-header .mega-col h4::after {
    display: none !important;
  }

  .site-header .submenu ul,
  .site-header .mega-col ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: grid !important;
    gap: 6px !important;
  }

  .site-header .submenu a,
  .site-header .mega-col a {
    display: block !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    color: #22314f !important;
    background: #f7f9fc !important;
    font-weight: 700 !important;
    white-space: normal !important;
  }

  .site-header .submenu a:hover,
  .site-header .mega-col a:hover {
    color: #0d2b5b !important;
    background: #eef3fa !important;
    transform: none !important;
  }

  .cta-top {
    display: none !important;
  }

  .search-row {
    width: 100% !important;
    overflow: visible !important;
    position: relative !important;
    z-index: 100 !important;
  }

  .search-wrap {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: 1fr !important;
    padding: 9px 14px !important;
    gap: 8px !important;
  }

  .search-card {
    width: 100% !important;
    min-width: 0 !important;
    border-radius: 16px !important;
    padding: 0 !important;
  }

  #buscadorGlobal {
    width: 100% !important;
    min-width: 0 !important;
    font-size: .9rem !important;
    padding: 11px 14px !important;
  }

  #resultadosGlobal {
    left: 0 !important;
    right: 0 !important;
    max-height: 55vh !important;
  }
}

@media (max-width: 560px) {
  .brand-logo,
  .brand-mark {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
  }

  .brand-copy strong {
    font-size: 1.05rem !important;
  }

  .brand-copy span {
    max-width: 160px !important;
    font-size: .68rem !important;
  }

  .menu-toggle {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
  }

  #mainMenu.menu,
  .site-header .menu {
    padding: 10px !important;
    border-radius: 18px !important;
    max-height: calc(100vh - 74px) !important;
  }
}

@media (max-width: 1080px) {
  .site-header .menu-item.has-children:not(.open) > .submenu,
  .site-header .menu-item.has-children:not(.open) > .mega-menu {
    display: none !important;
  }
}
