/* =========================================================
   VALENZUELA PROPIEDADES — V63
   NAVBAR COMPACTO ALINEADO CON LAS PROPIEDADES

   Corrige el estado al hacer scroll sin tocar el navbar grande.
   La caja del navbar compacto usa EXACTAMENTE la misma geometría
   horizontal definida para .properties-area > .container-xl.
   ========================================================= */

@media (min-width:1200px){
  /* El fondo del navbar sigue ocupando todo el ancho y no se desplaza. */
  html body.header-compact #mainNav.main-nav,
  html body.header-compact #mainNav.main-nav.compact,
  html body.internal-index-shell.header-compact #mainNav.main-nav,
  html body.internal-index-shell.header-compact #mainNav.main-nav.compact{
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    margin:0 !important;
    transform:none !important;
  }

  /*
   * Misma caja de las propiedades.
   * 1200–1365: 100% - 180px
   * 1366+:     1096px centrados
   */
  html body.header-compact #mainNav.main-nav > .container-xl,
  html body.header-compact #mainNav.main-nav.compact > .container-xl,
  html body.internal-index-shell.header-compact #mainNav.main-nav > .container-xl,
  html body.internal-index-shell.header-compact #mainNav.main-nav.compact > .container-xl{
    box-sizing:border-box !important;
    width:calc(100% - 180px) !important;
    max-width:none !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:0 !important;
    position:relative !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
    display:flex !important;
    align-items:center !important;
    flex-wrap:nowrap !important;
  }

  /*
   * El logo ya no conserva la reserva de 220/273px del navbar grande.
   * Esto evita que el contenido compacto se corra respecto de las cards.
   */
  html body.header-compact #mainNav.main-nav .brand-wrap,
  html body.header-compact #mainNav.main-nav .navbar-brand,
  html body.internal-index-shell.header-compact #mainNav.main-nav .brand-wrap,
  html body.internal-index-shell.header-compact #mainNav.main-nav .navbar-brand{
    position:relative !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    bottom:auto !important;
    flex:0 0 112px !important;
    width:112px !important;
    min-width:112px !important;
    max-width:112px !important;
    height:72px !important;
    min-height:72px !important;
    max-height:72px !important;
    margin:0 !important;
    padding:0 !important;
    transform:none !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    overflow:visible !important;
  }

  html body.header-compact #mainNav.main-nav .brand-logo,
  html body.internal-index-shell.header-compact #mainNav.main-nav .brand-logo{
    position:static !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    bottom:auto !important;
    width:auto !important;
    height:64px !important;
    min-width:0 !important;
    min-height:0 !important;
    max-width:110px !important;
    max-height:64px !important;
    margin:0 !important;
    padding:0 !important;
    transform:none !important;
    object-fit:contain !important;
  }

  /* El menú ocupa solamente el resto de la MISMA caja. */
  html body.header-compact #mainNav.main-nav #mainMenu,
  html body.internal-index-shell.header-compact #mainNav.main-nav #mainMenu{
    position:static !important;
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
    height:72px !important;
    min-height:72px !important;
    max-height:72px !important;
    margin:0 !important;
    padding:0 !important;
    transform:none !important;
    align-items:center !important;
  }

  html body.header-compact #mainNav.main-nav #mainMenu .navbar-nav,
  html body.internal-index-shell.header-compact #mainNav.main-nav #mainMenu .navbar-nav{
    width:100% !important;
    height:72px !important;
    min-height:72px !important;
    max-height:72px !important;
    margin:0 !important;
    padding:0 !important;
    transform:none !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:0 !important;
  }
}

@media (min-width:1366px){
  html body.header-compact #mainNav.main-nav > .container-xl,
  html body.header-compact #mainNav.main-nav.compact > .container-xl,
  html body.internal-index-shell.header-compact #mainNav.main-nav > .container-xl,
  html body.internal-index-shell.header-compact #mainNav.main-nav.compact > .container-xl{
    width:1096px !important;
    max-width:1096px !important;
  }
}

/* Tablet/móvil conserva el responsive existente. */
@media (max-width:1199.98px){
  html body.header-compact #mainNav.main-nav .brand-wrap,
  html body.internal-index-shell.header-compact #mainNav.main-nav .brand-wrap{
    max-width:none !important;
  }
}
