/* ===========================
   RESET SOLO PARA HOME
   =========================== */
body.home,
body.front-page {
  padding-top: 0 !important;
}

body.course-item-lp_lesson #primary,
body.course-item-lp_lesson #main {
    display: block !important;
}

/* ============================================
   ESTADO INICIAL: Header absoluto sobre el hero
   ============================================ */
body.home #masthead,
body.front-page #masthead {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;

  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  background-color: transparent !important;
  box-shadow: none !important;
  align-items: center !important;
}

/* ============================================
   ESTADO SCROLL: Header fijo con fondo blanco
   ============================================ */
body.home #masthead.is-sticky,
body.front-page #masthead.is-sticky {
  position: fixed !important;
  top: 0 !important;
  background-color: rgba(255, 255, 255, 0.98) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  box-shadow: 0 5px 30px rgba(0, 0, 0, 0.08) !important;
}

/* Añadimos padding al body solo cuando el header es fixed */
body.home.has-sticky-header,
body.front-page.has-sticky-header {
  padding-top: 80px !important; /* ajusta si cambia la altura */
}

/* ============================================
   ESTILOS DEL MENÚ Y ELEMENTOS INTERNOS
   ============================================ */

/* Menú - estado inicial (transparente sobre hero) */
body.home #masthead .hfe-menu-item,
body.front-page #masthead .hfe-menu-item {
  color: white !important;
  transition: color 0.3s ease !important;
}

body.home #masthead .hfe-menu-item:hover,
body.front-page #masthead .hfe-menu-item:hover {
  color: #A4B57D !important;
}

/* Menú - estado con scroll */
body.home #masthead.is-sticky .hfe-menu-item,
body.front-page #masthead.is-sticky .hfe-menu-item {
  color: #333333 !important;
  text-shadow: none !important;
}

body.home #masthead.is-sticky .hfe-menu-item:hover,
body.front-page #masthead.is-sticky .hfe-menu-item:hover {
  color: #A4B57D !important;
}

/* Botones - estado inicial */
body.home #masthead .elementor-button,
body.front-page #masthead .elementor-button {



/* ============================================
   CONTENEDORES INTERNOS
   ============================================ */
#masthead .e-con-inner,
#masthead .e-con,
#masthead .elementor-container {
  min-height: 100% !important;
  height: 100% !important;
}