/* Sobrescribir ancho máximo del grid */
.grid-container {
  max-width: 81.5rem !important;
}

.input-group{
  border-radius: 39px 39px !important; }
  
  
  /*Resposive*/
  
  @media screen and (max-width: 63.9988em) {
  .show-for-large {
   
  }
}

@media (max-width: 63.9375em) {
  .show-for-large {
   
  }
}


@media (max-width: 63.9375em) {
  .show-for-large {
    display: block !important;
  }
}


grid-x {
  display: -webkit-box !important;
  
  }
  
  @media (max-width: 666px) {
      .container-image {
        width: 50%;
      }
    }
  
  /*width: 50%;*/
  
  #menu-top-bar{

background-color: white !important;
Background: white;
}



.mobile-section-title {

margin-bottom: 0px;


}


@media (min-width: 1200px) {
  .official-header .dark .row .container {
    max-width: 88.5rem;
  }
}
.official-header .dark .row .container{

}



.slick-slide img {
  width: 100% !important;
	
}
























/* ============================================
   HEADER STICKY - JAVASCRIPT
   ============================================ */

document.addEventListener('DOMContentLoaded', function () {
  
  const header = document.querySelector('.header');
  const offCanvasContent = document.querySelector('.off-canvas-content');
  const body = document.body;
  
  if (!header || !offCanvasContent) {
    console.warn('Header sticky: elementos no encontrados');
    return;
  }

  // Obtener altura del header (incluye banner oficial)
  let headerHeight = header.offsetHeight;
  
  // Actualizar altura si el banner oficial cambia
  const updateHeaderHeight = () => {
    headerHeight = header.offsetHeight;
    document.documentElement.style.setProperty('--header-height', headerHeight + 'px');
  };
  
  // Calcular altura inicial
  updateHeaderHeight();
  
  // Recalcular en resize (con debounce)
  let resizeTimer;
  window.addEventListener('resize', function() {
    clearTimeout(resizeTimer);
    resizeTimer = setTimeout(updateHeaderHeight, 250);
  });

  // OPCIÓN 1: Sticky en scroll del off-canvas-content 
  offCanvasContent.addEventListener('scroll', function () {
    if (offCanvasContent.scrollTop > headerHeight) {
      header.classList.add('is-stuck');
      body.classList.add('header-is-stuck');
      offCanvasContent.style.paddingTop = headerHeight + 'px';
    } else {
      header.classList.remove('is-stuck');
      body.classList.remove('header-is-stuck');
      offCanvasContent.style.paddingTop = '';
    }
  });

  // OPCIÓN 2: Sticky en scroll de window 
  // Descomenta esto si prefieres que el sticky funcione con scroll de la ventana
  /*
  window.addEventListener('scroll', function () {
    if (window.scrollY > headerHeight) {
      header.classList.add('is-stuck');
      body.classList.add('header-is-stuck');
      body.style.paddingTop = headerHeight + 'px';
    } else {
      header.classList.remove('is-stuck');
      body.classList.remove('header-is-stuck');
      body.style.paddingTop = '';
    }
  });
  */

  // OPCIÓN 3: Usar Intersection Observer 
  /*
  const sentinel = document.createElement('div');
  sentinel.style.height = '1px';
  sentinel.style.position = 'absolute';
  sentinel.style.top = headerHeight + 'px';
  document.body.insertBefore(sentinel, header.nextSibling);

  const observer = new IntersectionObserver(
    ([entry]) => {
      if (!entry.isIntersecting) {
        header.classList.add('is-stuck');
        body.classList.add('header-is-stuck');
        body.style.paddingTop = headerHeight + 'px';
      } else {
        header.classList.remove('is-stuck');
        body.classList.remove('header-is-stuck');
        body.style.paddingTop = '';
      }
    },
    { threshold: 0 }
  );

  observer.observe(sentinel);
  */

  // Manejo del off-canvas móvil
  const mobileOffCanvas = document.getElementById('mobile-off-canvas');
  if (mobileOffCanvas) {
    // Ajustar posición cuando se abre el off-canvas
    const mutationObserver = new MutationObserver(function(mutations) {
      mutations.forEach(function(mutation) {
        if (mutation.attributeName === 'class') {
          if (mobileOffCanvas.classList.contains('is-open')) {
            // Calcular posición considerando si header está sticky
            const topPosition = header.classList.contains('is-stuck') 
              ? headerHeight 
              : headerHeight;
            mobileOffCanvas.style.top = topPosition + 'px';
          }
        }
      });
    });
    
    mutationObserver.observe(mobileOffCanvas, { attributes: true });
  }

  // Prevenir problemas con admin bar de WordPress
  const adminBar = document.getElementById('wpadminbar');
  if (adminBar) {
    const adminBarHeight = adminBar.offsetHeight;
    
    offCanvasContent.addEventListener('scroll', function () {
      if (offCanvasContent.scrollTop > headerHeight) {
        header.style.top = adminBarHeight + 'px';
      } else {
        header.style.top = '';
      }
    });
  }

  // Debug: mostrar altura del header en consola
  console.log('Header height:', headerHeight + 'px');
});


/* ============================================
   VERSIÓN SIMPLIFICADA CON FOUNDATION STICKY
   ============================================ */

// Foundation:
/*
$(document).ready(function() {
  if (typeof Foundation !== 'undefined') {
    var $header = $('.header');
    
    $header.addClass('sticky-container');
    $header.attr('data-sticky', '');
    $header.attr('data-margin-top', '0');
    $header.attr('data-sticky-on', 'small');
    
    // Inicializar Foundation Sticky
    var sticky = new Foundation.Sticky($header, {
      marginTop: 0,
      stickyOn: 'small',
      stickyClass: 'is-stuck',
      containerClass: 'sticky-container',
      checkEvery: -1
    });
    
    // Evento cuando se vuelve sticky
    $header.on('sticky.zf.stuckto:top', function() {
      $('body').addClass('header-is-stuck');
      var headerHeight = $header.outerHeight();
      $('.off-canvas-content').css('padding-top', headerHeight);
    });
    
    // Evento cuando deja de ser sticky
    $header.on('sticky.zf.unstuckfrom:top', function() {
      $('body').removeClass('header-is-stuck');
      $('.off-canvas-content').css('padding-top', '');
    });
  }
});
*/