/* =========================================================
   HEADER TRANSPARENTE + STICKY CON FONDO (JOOMLA / HELIX)
   PARA PISAR TEMPLATE
========================================================= */

/* Estado inicial: header transparente sobre hero */
#sp-header{
  background: transparent !important;
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  box-shadow: none !important;
  border-bottom: 0 !important;
}

/* Contenedor interno */
#sp-header .container,
#sp-header .container-fluid{
  background: transparent !important;
}

/* Menú y logo arriba del hero */
#sp-header .sp-megamenu-parent > li > a,
#sp-header .logo a,
#sp-header .logo-text,
#sp-header #offcanvas-toggler,
#sp-header #offcanvas-toggler > .fa,
#sp-header #offcanvas-toggler > .fas,
#sp-header #offcanvas-toggler > .far{
  font-weight: 700 !important;
  text-shadow: none !important;
  color: #A10E0E !important;
}

/* Hover arriba del hero */
#sp-header .sp-megamenu-parent > li:hover > a,
#sp-header .sp-megamenu-parent > li.active > a,
#sp-header .sp-megamenu-parent > li.active:hover > a,
#sp-header #offcanvas-toggler:hover > .fa,
#sp-header #offcanvas-toggler:hover > .fas,
#sp-header #offcanvas-toggler:hover > .far{
  color: #7A0B0B !important;
}

/* =========================================================
   ESTADO STICKY
========================================================= */
#sp-header.menu-fixed,
#sp-header.header-sticky,
#sp-header.sticky,
#sp-header.is-sticky,
.sticky-wrapper.is-sticky #sp-header,
#sp-header.affix{
  position: fixed !important;
  top: 5px;
  left: 0;
  width: 100%;
  background: #F5EFE6 !important;
  box-shadow: none !important;
  border-bottom: 0px;
}

/* Fondo interno sticky */
#sp-header.menu-fixed .container,
#sp-header.header-sticky .container,
#sp-header.sticky .container,
#sp-header.is-sticky .container,
.sticky-wrapper.is-sticky #sp-header .container,
#sp-header.affix .container,
#sp-header.menu-fixed .container-fluid,
#sp-header.header-sticky .container-fluid,
#sp-header.sticky .container-fluid,
#sp-header.is-sticky .container-fluid,
.sticky-wrapper.is-sticky #sp-header .container-fluid,
#sp-header.affix .container-fluid{
  background: #F5EFE6 !important;
}

/* Menú sticky */
#sp-header.menu-fixed .sp-megamenu-parent > li > a,
#sp-header.header-sticky .sp-megamenu-parent > li > a,
#sp-header.sticky .sp-megamenu-parent > li > a,
#sp-header.is-sticky .sp-megamenu-parent > li > a,
.sticky-wrapper.is-sticky #sp-header .sp-megamenu-parent > li > a,
#sp-header.affix .sp-megamenu-parent > li > a,
#sp-header.menu-fixed .logo a,
#sp-header.header-sticky .logo a,
#sp-header.sticky .logo a,
#sp-header.is-sticky .logo a,
.sticky-wrapper.is-sticky #sp-header .logo a,
#sp-header.affix .logo a,
#sp-header.menu-fixed #offcanvas-toggler,
#sp-header.header-sticky #offcanvas-toggler,
#sp-header.sticky #offcanvas-toggler,
#sp-header.is-sticky #offcanvas-toggler,
.sticky-wrapper.is-sticky #sp-header #offcanvas-toggler,
#sp-header.affix #offcanvas-toggler,
#sp-header.menu-fixed #offcanvas-toggler > .fa,
#sp-header.header-sticky #offcanvas-toggler > .fa,
#sp-header.sticky #offcanvas-toggler > .fa,
#sp-header.is-sticky #offcanvas-toggler > .fa,
.sticky-wrapper.is-sticky #sp-header #offcanvas-toggler > .fa,
#sp-header.affix #offcanvas-toggler > .fa,
#sp-header.menu-fixed #offcanvas-toggler > .fas,
#sp-header.header-sticky #offcanvas-toggler > .fas,
#sp-header.sticky #offcanvas-toggler > .fas,
#sp-header.is-sticky #offcanvas-toggler > .fas,
.sticky-wrapper.is-sticky #sp-header #offcanvas-toggler > .fas,
#sp-header.affix #offcanvas-toggler > .fas,
#sp-header.menu-fixed #offcanvas-toggler > .far,
#sp-header.header-sticky #offcanvas-toggler > .far,
#sp-header.sticky #offcanvas-toggler > .far,
#sp-header.is-sticky #offcanvas-toggler > .far,
.sticky-wrapper.is-sticky #sp-header #offcanvas-toggler > .far,
#sp-header.affix #offcanvas-toggler > .far{
  color: #A10E0E !important;
  font-weight: 700 !important;
  text-shadow: none !important;
}

/* Hover sticky */
#sp-header.menu-fixed .sp-megamenu-parent > li:hover > a,
#sp-header.header-sticky .sp-megamenu-parent > li:hover > a,
#sp-header.sticky .sp-megamenu-parent > li:hover > a,
#sp-header.is-sticky .sp-megamenu-parent > li:hover > a,
.sticky-wrapper.is-sticky #sp-header .sp-megamenu-parent > li:hover > a,
#sp-header.affix .sp-megamenu-parent > li:hover > a,
#sp-header.menu-fixed .sp-megamenu-parent > li.active > a,
#sp-header.header-sticky .sp-megamenu-parent > li.active > a,
#sp-header.sticky .sp-megamenu-parent > li.active > a,
#sp-header.is-sticky .sp-megamenu-parent > li.active > a,
.sticky-wrapper.is-sticky #sp-header .sp-megamenu-parent > li.active > a,
#sp-header.affix .sp-megamenu-parent > li.active > a{
  color: #7A0B0B !important;
}

/* =========================================================
   DROPDOWN
========================================================= */
#sp-header .sp-dropdown .sp-dropdown-inner{
  background: #F5EFE6 !important;
}

#sp-header .sp-dropdown li.sp-menu-item > a{
  color: #A10E0E !important;
}

#sp-header .sp-dropdown li.sp-menu-item > a:hover,
#sp-header .sp-dropdown li.sp-menu-item.active > a{
  color: #7A0B0B !important;
}

/* =========================================================
   OFFCANVAS
========================================================= */
.offcanvas-menu{
  background: #F5EFE6 !important;
}

.offcanvas-menu .offcanvas-inner a,
.offcanvas-menu .offcanvas-inner ul.menu > li > a,
.offcanvas-menu .offcanvas-inner ul.menu > li > span{
  color: #A10E0E !important;
}

.offcanvas-menu .offcanvas-inner a:hover,
.offcanvas-menu .offcanvas-inner ul.menu > li > a:hover,
.offcanvas-menu .offcanvas-inner ul.menu > li > span:hover{
  color: #7A0B0B !important;
}

/* =========================================================
   AJUSTE HERO
========================================================= */
.sp-pagebuilder-section:first-child{
  padding-top: 110px;
}

/* En mobile suele necesitar menos aire */
@media (max-width: 991px){
  .sp-pagebuilder-section:first-child{
    padding-top: 90px;
  }
}