.elementor-5851 .elementor-element.elementor-element-e5bce7b{--display:flex;}.elementor-5851 .elementor-element.elementor-element-bff2d44{--display:flex;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-5851 .elementor-element.elementor-element-28531df{--grid-template-columns:repeat(0, auto);--grid-column-gap:5px;--grid-row-gap:0px;}.elementor-5851 .elementor-element.elementor-element-28531df .elementor-widget-container{text-align:center;}.elementor-5851 .elementor-element.elementor-element-5b53fc7{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-5851 .elementor-element.elementor-element-f10d061 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-5851 .elementor-element.elementor-element-f10d061 .elementor-button .elementor-button-content-wrapper{gap:9px;}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-text );fill:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .e--pointer-framed .elementor-item:before,
					.elementor-widget-nav-menu .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-accent );}.elementor-widget-nav-menu{--e-nav-menu-divider-color:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown  .elementor-sub-item{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-5851 .elementor-element.elementor-element-a256cb0.elementor-element{--align-self:center;}.elementor-5851 .elementor-element.elementor-element-a256cb0 .elementor-menu-toggle{margin:0 auto;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS for container, class: .elementor-element-bff2d44 *//* ==========================================================
   TOPBAR SUPERIOR - PALETA COMPLETA IESTP JBG
   ========================================================== */

/* 1. Contenedor Principal (Verde con línea inferior Azul Cielo) */
.elementor-5851 .elementor-element.elementor-element-bff2d44 {
  background-color: #00A54F !important; /* Verde Principal */
  padding: 8px 32px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 28px !important;
  border-bottom: 2px solid #2FB7E2 !important; /* Azul Cielo del Logo */
}

/* 2. Estilos de los Widgets de Texto (Izquierda) */
.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-widget-text-editor,
.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-widget-icon-list,
.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-widget-heading {
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 !important;
  width: auto !important;
}

.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-widget-text-editor p,
.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-icon-list-item,
.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-icon-list-text,
.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-heading-title {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: #FFFFFF !important; /* Blanco Alto Contraste */
  margin: 0 !important;
  letter-spacing: 0.2px !important;
  white-space: nowrap !important;
}

/* Iconos Informativos (Amarillo Sol Institucional) */
.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-icon-list-icon i,
.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-widget-text-editor i {
  color: #FFC814 !important; /* Amarillo Sol */
  font-size: 13px !important;
  margin-right: 8px !important;
}

/* 3. Redes Sociales Empujadas a la Derecha */
.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-widget-social-icons {
  margin-left: auto !important;
  display: flex !important;
  align-items: center !important;
}

.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-social-icons-wrapper {
  display: flex !important;
  gap: 12px !important;
}

/* Iconos Limpios */
.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-social-icon {
  background-color: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  width: auto !important;
  height: auto !important;
  border-radius: 0 !important;
  transition: transform 0.2s ease !important;
}

.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-social-icon i,
.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-social-icon svg {
  fill: #FFFFFF !important;
  color: #FFFFFF !important;
  width: 14px !important;
  height: 14px !important;
  font-size: 14px !important;
  opacity: 0.9;
  transition: fill 0.2s ease, opacity 0.2s ease !important;
}

/* Hover de Redes Sociales (Cambio a Azul Cielo) */
.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-social-icon:hover {
  transform: translateY(-1px) !important;
}

.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-social-icon:hover i,
.elementor-5851 .elementor-element.elementor-element-bff2d44 .elementor-social-icon:hover svg {
  fill: #FFC814 !important; /* Amarillo en Hover */
  color: #FFC814 !important;
  opacity: 1 !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-5b53fc7 *//* ==========================================================
   HEADER BRANDING BAR - IESTP JBG (COMPETITION LEVEL UI)
   ========================================================== */

/* 1. Contenedor Principal (Alineación y Flexbox) */
.elementor-5851 .elementor-element.elementor-element-5b53fc7, .jbg-header-brand {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 24px !important;
  background: #FFFFFF !important;
  border-bottom: 2px solid #E2E8F0 !important;
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04) !important;
}

/* 2. Control de Tamaño de la Imagen (Logo Escudo) */
.elementor-5851 .elementor-element.elementor-element-5b53fc7 .elementor-widget-image img,
.jbg-header-brand .elementor-widget-image img {
  max-height: 75px !important;
  width: auto !important;
  object-fit: contain !important;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.12));
  transition: transform 0.3s ease !important;
}

.elementor-5851 .elementor-element.elementor-element-5b53fc7 .elementor-widget-image img:hover,
.jbg-header-brand .elementor-widget-image img:hover {
  transform: scale(1.03);
}

/* 3. Texto 1: Subtítulo Institucional (Superior) */
.elementor-5851 .elementor-element.elementor-element-5b53fc7 .elementor-widget-heading:nth-of-type(1) .elementor-heading-title,
.elementor-5851 .elementor-element.elementor-element-5b53fc7 .elementor-widget-text-editor:nth-of-type(1) p,
.jbg-header-brand p:nth-of-type(1) {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  color: #2FB7E2 !important; /* Azul Cielo Institucional */
  margin: 0 0 2px 0 !important;
}

/* 4. Texto 2: Nombre Principal del Instituto */
.elementor-5851 .elementor-element.elementor-element-5b53fc7 .elementor-widget-heading:nth-of-type(2) .elementor-heading-title,
.elementor-5851 .elementor-element.elementor-element-5b53fc7 .elementor-widget-text-editor:nth-of-type(2) p,
.jbg-header-brand p:nth-of-type(2) {
  font-family: 'Poppins', system-ui, sans-serif !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  letter-spacing: -0.2px !important;
  color: #0F172A !important; /* Oscuro Neutro de Alto Contraste */
  margin: 0 !important;
  line-height: 1.2 !important;
}

/* 5. Botón Call To Action (Extremo Derecho) */
.elementor-5851 .elementor-element.elementor-element-5b53fc7 .elementor-widget-button a,
.jbg-header-brand .elementor-button {
  background: linear-gradient(135deg, #00A54F 0%, #00823E 100%) !important;
  color: #FFFFFF !important;
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.3px !important;
  padding: 12px 24px !important;
  border-radius: 50px !important;
  border: 1px solid #007A3A !important;
  box-shadow: 0 4px 14px rgba(0, 165, 79, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* Hover Interactivo del Botón */
.elementor-5851 .elementor-element.elementor-element-5b53fc7 .elementor-widget-button a:hover,
.jbg-header-brand .elementor-button:hover {
  background: linear-gradient(135deg, #FFC814 0%, #E5B300 100%) !important;
  color: #0F172A !important;
  border-color: #E5B300 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(255, 200, 20, 0.45) !important;
}



/* ==========================================================
   HEADER BRANDING BAR - PRECISE REPLICATION (IESTP JBG)
   ========================================================== */

/* 1. Agrupación de Logo + Textos */
.jbg-brand-block {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

/* 2. Escudo / Logo Institucional */
.jbg-logo {
  height: 65px !important;
  width: auto !important;
  object-fit: contain !important;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.08));
}

/* 3. Columna de Textos */
.jbg-titles {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

/* Subtítulo Superior */
.jbg-sub {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.8px !important;
  color: #2FB7E2 !important; /* Azul Cielo del Logo */
  text-transform: uppercase !important;
  line-height: 1.2 !important;
  margin-bottom: 2px !important;
}

/* Título Principal */
.jbg-main {
  font-family: 'Montserrat', 'Poppins', sans-serif !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  letter-spacing: -0.3px !important;
  color: #0F172A !important; /* Slate Oscuro Profesional */
  margin: 0 !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
}

/* 4. Estilo de Botón (CTA Derecha) */
.elementor-5851 .elementor-element.elementor-element-5b53fc7 .elementor-button,
.elementor-widget-button .elementor-button {
  background: #00A54F !important; /* Verde Institucional */
  color: #FFFFFF !important;
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  padding: 12px 28px !important;
  border-radius: 50px !important;
  box-shadow: 0 4px 12px rgba(0, 165, 79, 0.25) !important;
  border: none !important;
  transition: all 0.25s ease !important;
}

.elementor-5851 .elementor-element.elementor-element-5b53fc7 .elementor-button:hover,
.elementor-widget-button .elementor-button:hover {
  background: #FFC814 !important; /* Amarillo Sol al pasar el cursor */
  color: #0F172A !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(255, 200, 20, 0.4) !important;
}/* End custom CSS */
/* Start custom CSS for nav-menu, class: .elementor-element-a256cb0 *//* ==========================================================
   HEADER ENTERPRISE / COMPETITION LEVEL - IESTP JBG (FINAL)
   ========================================================== */

/* 1. Sistema de Diseño & Design Tokens */
:root {
  --jbg-brand-primary: #00A54F;      /* Verde Institucional */
  --jbg-brand-hover: #00823E;        /* Verde Profundo */
  --jbg-brand-accent: #2FB7E2;       /* Azul Cielo */
  --jbg-cta-bg: #FFC814;             /* Amarillo Sol */
  --jbg-cta-hover: #E5B300;
  --jbg-neutral-dark: #0F172A;      /* Slate 900 */
  --jbg-neutral-muted: #475569;     /* Slate 600 */
  --jbg-neutral-light: #F8FAFC;     /* Slate 50 */
  --jbg-border-subtle: #E2E8F0;     /* Slate 200 */
  --jbg-shadow-pro: 0 20px 25px -5px rgba(15, 23, 42, 0.08), 0 8px 10px -6px rgba(15, 23, 42, 0.03);
}

/* 2. Contenedor del Menú */
.elementor-nav-menu--main {
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}

/* 3. Estilo Base de los Enlaces Principales */
.elementor-nav-menu--main > ul > li {
  position: relative;
}

.elementor-nav-menu--main > ul > li > a.elementor-item {
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  color: var(--jbg-neutral-dark) !important;
  padding: 10px 16px !important;
  border-radius: 6px;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* Estado Hover e Ítem Activo Principal */
.elementor-nav-menu--main > ul > li:hover > a.elementor-item,
.elementor-nav-menu--main > ul > li > a.elementor-item.elementor-item-active {
  color: var(--jbg-brand-primary) !important;
  background-color: var(--jbg-neutral-light) !important;
}

/* Indicador Minimalista Inferior (Active/Hover Line) */
.elementor-nav-menu--main > ul > li > a.elementor-item::after {
  content: '';
  position: absolute;
  bottom: 2px;
  left: 16px;
  right: 16px;
  height: 2px;
  background-color: var(--jbg-brand-primary);
  border-radius: 2px;
  opacity: 0;
  transform: scaleX(0);
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.elementor-nav-menu--main > ul > li:hover > a.elementor-item::after,
.elementor-nav-menu--main > ul > li > a.elementor-item.elementor-item-active::after {
  opacity: 1;
  transform: scaleX(1);
}

/* 4. BOTÓN CTA: "Admisión y matrículas" */
.elementor-nav-menu--main > ul > li > a[href*="admision"],
.elementor-nav-menu--main > ul > li > a[href*="matricula"] {
  background: var(--jbg-brand-primary) !important;
  color: #FFFFFF !important;
  font-weight: 600 !important;
  padding: 10px 20px !important;
  border-radius: 8px !important;
  margin-left: 12px;
  border: 1px solid var(--jbg-brand-hover) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.15);
  transition: all 0.2s ease !important;
}

.elementor-nav-menu--main > ul > li > a[href*="admision"]::after,
.elementor-nav-menu--main > ul > li > a[href*="matricula"]::after {
  display: none !important;
}

.elementor-nav-menu--main > ul > li > a[href*="admision"]:hover,
.elementor-nav-menu--main > ul > li > a[href*="matricula"]:hover {
  background: var(--jbg-brand-hover) !important;
  color: #FFFFFF !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 165, 79, 0.25);
}

/* 5. Submenús Desplegables Profesionales */
.elementor-nav-menu--main .sub-menu {
  background-color: #FFFFFF !important;
  border: 1px solid var(--jbg-border-subtle) !important;
  border-radius: 10px !important;
  padding: 8px !important;
  box-shadow: var(--jbg-shadow-pro) !important;
  margin-top: 10px !important;
  min-width: 210px !important;
}

.elementor-nav-menu--main .sub-menu li a.elementor-sub-item {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 450 !important;
  color: var(--jbg-neutral-muted) !important;
  padding: 9px 12px !important;
  border-radius: 6px;
  transition: all 0.15s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

/* Hover en Submenú */
.elementor-nav-menu--main .sub-menu li a.elementor-sub-item:hover,
.elementor-nav-menu--main .sub-menu li a.elementor-sub-item.elementor-item-active,
.elementor-nav-menu--main .sub-menu li:hover > a.elementor-sub-item {
  background-color: var(--jbg-brand-primary) !important;
  color: #FFFFFF !important;
  font-weight: 600 !important;
}



/* 6. MANEJO DE FLECHAS (ARROWS) - FIX DEFINITIVO */

/* Flecha del Menú Superior (Apagada y Hover) */
.elementor-nav-menu--main > ul > li > a .sub-arrow,
.elementor-nav-menu--main > ul > li > a .sub-arrow i,
.elementor-nav-menu--main > ul > li > a .sub-arrow svg {
  transform: none !important;
  fill: var(--jbg-neutral-muted) !important;
  transition: transform 0.2s ease, fill 0.2s ease !important;
}

.elementor-nav-menu--main > ul > li:hover > a .sub-arrow,
.elementor-nav-menu--main > ul > li:hover > a .sub-arrow svg {
  transform: rotate(180deg) !important;
  fill: var(--jbg-brand-primary) !important;
}

/* FORZADO A LA DERECHA (>) PARA SUBMENÚS ANIDADOS */
.elementor-nav-menu--main .sub-menu .sub-arrow,
.elementor-nav-menu--main .sub-menu .sub-arrow i,
.elementor-nav-menu--main .sub-menu .sub-arrow svg,
.elementor-nav-menu--main .sub-menu li:hover > a.elementor-sub-item .sub-arrow,
.elementor-nav-menu--main .sub-menu li:hover > a.elementor-sub-item .sub-arrow svg {
  transform: rotate(135deg) !important; /* Gira la flecha nativa para que apunte a la derecha > */
  display: inline-block !important;
}

/* Color de flecha en Hover del Submenú */
.elementor-nav-menu--main .sub-menu li:hover > a.elementor-sub-item .sub-arrow,
.elementor-nav-menu--main .sub-menu li:hover > a.elementor-sub-item .sub-arrow svg {
  fill: #FFFFFF !important;
}/* End custom CSS */