.elementor-2594 .elementor-element.elementor-element-4f5a490{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-2594 .elementor-element.elementor-element-09120ff{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-start;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-2594 .elementor-element.elementor-element-f67ab76{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-end;}.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-2594 .elementor-element.elementor-element-fef2c62.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-2594 .elementor-element.elementor-element-fef2c62 .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;}@media(min-width:768px){.elementor-2594 .elementor-element.elementor-element-09120ff{--width:50%;}.elementor-2594 .elementor-element.elementor-element-f67ab76{--width:50%;}}@media(max-width:767px){.elementor-2594 .elementor-element.elementor-element-4f5a490{--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;--justify-content:center;--flex-wrap:nowrap;}.elementor-2594 .elementor-element.elementor-element-4f5a490.e-con{--align-self:center;}.elementor-2594 .elementor-element.elementor-element-09120ff{--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-2594 .elementor-element.elementor-element-f67ab76{--justify-content:center;}.elementor-2594 .elementor-element.elementor-element-fef2c62{width:var( --container-widget-width, 38px );max-width:38px;--container-widget-width:38px;--container-widget-flex-grow:0;}.elementor-2594 .elementor-element.elementor-element-fef2c62.elementor-element{--order:-99999 /* order start hack */;--flex-grow:1;--flex-shrink:0;}}/* Start custom CSS for container, class: .elementor-element-4f5a490 *//* =========================================
   HEADER SERTRAS — FIXED (con subrayado personalizado)
   ========================================= */

.elementor-element-4f5a490{
  --sertras-dark-bg:#1a3b5c;
  --sertras-orange:#df7722;
  --sertras-white:#ffffff;

  background-color: var(--sertras-dark-bg);
  border-bottom: 3px solid var(--sertras-orange);
  box-shadow: 0 4px 15px rgba(0,0,0,0.15);

  position: fixed;  /* <<< HEADER FIXED */
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;

  padding: 0;
}

/* Estructura del header sin cambios de tamaño */
.elementor-element-4f5a490 > .e-con-inner{
  display:flex;
  justify-content:space-between;
  align-items:center;

  max-width:1200px;
  margin:0 auto;
  padding: 8px 20px;

  min-height: 72px;
  box-sizing: border-box;
}

/* LOGO */
.elementor-element-4f5a490 .elementor-widget-image img{
  height: 42px;
  width: auto;
  display:block;
}

/* =========================================
   MENU — Elimina la línea verde de Elementor
   ========================================= */
.elementor-element-4f5a490 .elementor-nav-menu--main.e--pointer-underline .elementor-item:before,
.elementor-element-4f5a490 .elementor-nav-menu--main.e--pointer-underline .elementor-item:after,
.elementor-element-4f5a490 nav.e--pointer-underline .elementor-item:before,
.elementor-element-4f5a490 nav.e--pointer-underline .elementor-item:after{
  display: none !important;
  content: none !important;
}

/* =========================================
   LINKS DEL MENU — Subrayado personalizado
   ========================================= */
.elementor-element-4f5a490 .elementor-nav-menu--main .elementor-nav-menu{
  display:flex;
  align-items:center;
  gap: 10px;
}

.elementor-element-4f5a490 .elementor-nav-menu--main .elementor-item{
  font-family: "Segoe UI", Roboto, sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: var(--sertras-white) !important;  /* Texto blanco */

  padding: 10px 14px;
  border-radius: 12px;

  line-height: 1;
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;

  position: relative;
  text-decoration: none;  /* Sin subrayado por defecto */

  transition: background .18s ease, color .18s ease;
}

/* Subrayado personalizado que no afecta el tamaño */
.elementor-element-4f5a490 .elementor-nav-menu--main .elementor-item::after{
  content:"";
  position:absolute;
  left: 12px;
  right: 12px;
  bottom: 6px;  /* Subrayado dentro del link */
  height: 3px;
  background: var(--sertras-orange);
  border-radius: 999px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .18s ease;
}

.elementor-element-4f5a490 .elementor-nav-menu--main .elementor-item:hover{
  background: rgba(255,255,255,.10);
  background-size: calc(100% - 22px) 3px;  /* Aparece la línea */
}

.elementor-element-4f5a490 .elementor-nav-menu--main .elementor-item:hover::after{
  transform: scaleX(1);
}

/* Activo */
.elementor-element-4f5a490 .elementor-nav-menu--main .elementor-item.elementor-item-active,
.elementor-element-4f5a490 .elementor-nav-menu--main .current-menu-item .elementor-item{
  background-size: calc(100% - 22px) 3px;
}

/* =========================================
   CTA — Botón "Obter Certificação!" sin línea verde
   ========================================= */
.elementor-element-4f5a490 .elementor-nav-menu--main .elementor-nav-menu > li:last-child .elementor-item{
  background: var(--sertras-orange) !important;
  color: var(--sertras-white) !important;

  font-weight: 800;
  text-transform: uppercase;
  font-size: 13px;
  letter-spacing: .4px;

  padding: 10px 22px;
  border-radius: 999px;
  border: 2px solid var(--sertras-orange);

  background-image: none !important;  /* Remueve el subrayado */
}

.elementor-element-4f5a490 .elementor-nav-menu--main .elementor-nav-menu > li:last-child .elementor-item:hover{
  background: transparent;
  color: #fff !important;
  border-color: var(--sertras-orange);
}

/* =========================================
   MOBILE
   ========================================= */
.elementor-element-4f5a490 .elementor-menu-toggle svg{
  fill: var(--sertras-white) !important;
}

.elementor-element-4f5a490 .elementor-nav-menu--dropdown{
  background-color: #ffffff !important;
  padding: 18px !important;
  border-top: 4px solid var(--sertras-orange);
  border-radius: 14px;
}

.elementor-element-4f5a490 .elementor-nav-menu--dropdown .elementor-item{
  color: var(--sertras-dark-bg) !important;
  font-weight: 700;
  border-bottom: 1px solid #f0f0f0;
  padding: 12px 10px;
}

.elementor-element-4f5a490 .elementor-nav-menu--dropdown li:last-child .elementor-item{
  background: var(--sertras-orange) !important;
  color: #fff !important;
  text-align:center;
  margin-top: 12px;
  border: none;
  border-radius: 10px;
}

/* =========================================
   MOBILE MENU — DRAWER (bonito)
   ========================================= */
@media (max-width: 767px){

  /* El dropdown como panel lateral */
  .elementor-element-4f5a490 .elementor-nav-menu--dropdown{
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: auto !important;

    height: 100vh !important;
    width: min(86vw, 340px) !important;

    background: #0b1220 !important;
    border: 0 !important;
    border-left: 3px solid var(--sertras-orange) !important;

    padding: 18px 16px !important;
    border-radius: 0 !important;

    box-shadow: -24px 0 70px rgba(0,0,0,.55) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  /* Overlay oscuro detrás (simple y efectivo) */
  .elementor-element-4f5a490 .elementor-nav-menu--dropdown::before{
    content:"";
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.55);
    z-index: -1;
  }

  /* Links mobile: blancos, grandes, con separación */
  .elementor-element-4f5a490 .elementor-nav-menu--dropdown .elementor-item{
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 16px !important;

    padding: 14px 12px !important;
    border-bottom: 1px solid rgba(255,255,255,.10) !important;

    border-radius: 12px !important;
    background: transparent !important;
  }

  .elementor-element-4f5a490 .elementor-nav-menu--dropdown .elementor-item:hover{
    background: rgba(255,255,255,.08) !important;
  }

  /* Botón CTA en mobile (último item) */
  .elementor-element-4f5a490 .elementor-nav-menu--dropdown li:last-child .elementor-item{
    margin-top: 14px !important;
    border: 2px solid var(--sertras-orange) !important;
    background: var(--sertras-orange) !important;
    color: #0b0b0b !important;

    text-align: center !important;
    border-radius: 999px !important;
    padding: 14px 16px !important;
  }

  .elementor-element-4f5a490 .elementor-nav-menu--dropdown li:last-child .elementor-item:hover{
    background: transparent !important;
    color: var(--sertras-orange) !important;
  }

  /* Botón hamburguesa/close más limpio */
  .elementor-element-4f5a490 .elementor-menu-toggle{
    border-radius: 12px;
    padding: 10px;
    background: rgba(255,255,255,.08);
  }

  .elementor-element-4f5a490 .elementor-menu-toggle svg{
    fill: #fff !important;
  }

  /* Quita cualquier “caja blanca” heredada vieja */
  .elementor-element-4f5a490 .elementor-nav-menu--dropdown{
    color-scheme: dark;
  }
}
@media (max-width: 767px){

  /* 1) Drawer: no negro puro, usa tu azul + gradient */
  .elementor-element-4f5a490 .elementor-nav-menu--dropdown{
    background: linear-gradient(180deg, #1a3b5c 0%, #0b1220 100%) !important;
  }

  /* 2) BOTÓN CERRAR: usar el mismo toggle de Elementor, pero FIXED y visible */
  .elementor-element-4f5a490 .elementor-menu-toggle{
    position: fixed !important;
    top: 14px !important;
    right: 14px !important;
    z-index: 10001 !important;

    width: 46px !important;
    height: 46px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 14px !important;
    background: rgba(255,255,255,.10) !important;
    border: 1px solid rgba(255,255,255,.16) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }

  /* 3) Asegura que el ícono se vea (open/close) */
  .elementor-element-4f5a490 .elementor-menu-toggle svg{
    width: 22px !important;
    height: 22px !important;
    fill: #fff !important;
  }

  /* 4) Cuando el menú está abierto, que el botón se vea “activo” */
  .elementor-element-4f5a490 .elementor-menu-toggle[aria-expanded="true"]{
    background: rgba(223,119,34,.22) !important;
    border-color: rgba(223,119,34,.45) !important;
  }

  /* 5) El drawer no debe tapar el botón */
  .elementor-element-4f5a490 .elementor-nav-menu--dropdown{
    padding-top: 70px !important; /* espacio para el botón cerrar */
    z-index: 10000 !important;
  }
}/* End custom CSS */