/* V71 — asesor junto al logo + compatibilidad iOS */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;}
body{-webkit-font-smoothing:antialiased;-webkit-overflow-scrolling:touch;}
button,input,select,textarea{-webkit-appearance:none;appearance:none;border-radius:0;}

/* Botón de asesor colocado junto al logo, dentro del topper/header. */
.asesor-topper{
  position:absolute!important;
  top:50%!important;
  left:clamp(16px,calc(50% - 315px),22vw)!important;
  transform:translateY(-50%)!important;
  z-index:2147482001!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-height:38px!important;
  padding:9px 14px!important;
  box-sizing:border-box!important;
  background:#000033!important;
  color:#fff!important;
  border:1px solid #d4af37!important;
  border-radius:4px!important;
  text-decoration:none!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:10px!important;
  font-weight:800!important;
  letter-spacing:.8px!important;
  line-height:1.1!important;
  white-space:nowrap!important;
  box-shadow:0 7px 20px rgba(0,0,0,.22)!important;
  -webkit-tap-highlight-color:transparent!important;
  touch-action:manipulation!important;
}
.asesor-topper:hover,.asesor-topper:focus,.asesor-topper:active{color:#fff!important;background:#08284b!important;text-decoration:none!important;}
.asesor-topper-icon{font-size:15px!important;line-height:1!important;}

/* El asesor anterior era un flotante inferior. Se conserva el enlace pero no duplica el botón visual. */
.asesor-whatsapp{display:none!important;}

/* iOS: no depender de 100dvh; usar fallback seguro y luego dvh cuando existe. */
@media(max-width:900px){
  .mobile-menu{
    height:100vh!important;
    height:100dvh!important;
    min-height:0!important;
    padding-bottom:calc(34px + env(safe-area-inset-bottom))!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .mobile-menu-overlay{height:100vh!important;height:100dvh!important;}
  .header{padding-top:env(safe-area-inset-top)!important;}

  /* Sin círculo alrededor de las tres líneas. */
  .header .menu-button,
  .menu-button#mobile-menu-button{
    width:42px!important;
    height:42px!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    outline:0!important;
  }
  .header .menu-button:focus,
  .header .menu-button:active{outline:0!important;background:transparent!important;}

  /* En celular el asesor se acomoda en la misma barra, a la derecha del logo y antes del menú. */
  .asesor-topper{
    top:50%!important;
    left:auto!important;
    right:62px!important;
    transform:translateY(-50%)!important;
    min-height:34px!important;
    padding:8px 9px!important;
    font-size:8px!important;
    letter-spacing:.45px!important;
    max-width:calc(100vw - 178px)!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .asesor-topper-icon{font-size:13px!important;}
}

@supports not (height:100dvh){
  @media(max-width:900px){.mobile-menu,.mobile-menu-overlay{height:100vh!important;}}
}

/* Evita saltos por las barras de desplazamiento en Safari iOS. */
@supports (-webkit-touch-callout:none){
  html,body{width:100%;min-height:100%;}
  .hero-video{object-fit:cover!important;}
  input[type=date],select{font-size:16px!important;}
}

/* V73 — ajuste final móvil: asesor en esquina opuesta al menú y hamburger sin círculo/pseudo-elementos. */
@media(max-width:900px){
  .header .menu-button,
  .header .menu-button#mobile-menu-button,
  button.menu-button#mobile-menu-button{
    right:12px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
    padding:0!important;
    border:0!important;
    border-width:0!important;
    border-style:none!important;
    border-radius:0!important;
    background:transparent!important;
    background-image:none!important;
    box-shadow:none!important;
    outline:none!important;
    -webkit-box-shadow:none!important;
    appearance:none!important;
    -webkit-appearance:none!important;
  }
  .header .menu-button::before,
  .header .menu-button::after,
  .header .menu-button#mobile-menu-button::before,
  .header .menu-button#mobile-menu-button::after{
    display:none!important;
    content:none!important;
    width:0!important;
    height:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  /* Las tres líneas siguen visibles, pero ya no tienen ningún contenedor circular. */
  .header .menu-button span,
  .header .menu-button#mobile-menu-button span{
    display:block!important;
    width:25px!important;
    height:3px!important;
    margin:0 auto!important;
    background:#fff!important;
    border-radius:0!important;
    box-shadow:0 -7px 0 #fff,0 7px 0 #fff!important;
  }
  /* Esquina izquierda: totalmente opuesta al menú que está a la derecha. */
  .asesor-topper{
    left:12px!important;
    right:auto!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    max-width:none!important;
    width:auto!important;
    min-height:34px!important;
    padding:8px 10px!important;
    font-size:8px!important;
    letter-spacing:.4px!important;
  }
}
