/* =========================
   EmprendeHosting NAV (aislado)
   Archivo: /assets/eh-nav.css
   ========================= */
:root{
  --eh-safe-top: env(safe-area-inset-top, 0px);
}

/* Contenedor del header */
.eh-nav{
  --eh-bg-start:#0b0f15;
  --eh-bg-mid:#141c29;
  --eh-bg-end:#172233;
  --eh-text:#e9eef5;
  --eh-muted:#d9e1ea;
  --eh-brand:#f45a2a;
  --eh-brand-2:#ff7b52;
  --eh-border:#172133;
  --eh-shadow:0 10px 30px rgba(0,0,0,.35);

  --eh-max:980px;
  --eh-pad-x:20px;
  --eh-h:56px; /* altura de la barra */
  position: sticky;
  top: 0;
  z-index: 1000;
  background: linear-gradient(135deg,var(--eh-bg-start), var(--eh-bg-mid) 60%, var(--eh-bg-end));
  border-bottom:1px solid var(--eh-border);
  color: var(--eh-text);
  padding-top: var(--eh-safe-top);
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

/* Barra superior */
.eh-nav__wrap{
  height: var(--eh-h);
  max-width: var(--eh-max);
  margin: 0 auto;
  padding: 0 var(--eh-pad-x);
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}

/* Marca */
.eh-nav__brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:18px;white-space:nowrap}
.eh-nav__dot{width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,var(--eh-brand),var(--eh-brand-2))}
.eh-nav__brand-text{line-height:1}

/* Menú desktop */
.eh-nav__menu{
  display:flex;
  align-items:center;
  gap:4px;
  flex: none;       /* evita que se achique al clickear */
  white-space:nowrap;
}
.eh-nav__link{
  display:inline-block;
  margin:0 10px;
  color:var(--eh-muted);
  font-weight:600;
  text-decoration:none;
  padding:8px 10px;
  border-radius:8px;
}
.eh-nav__link:hover{color:#fff}
.eh-nav__link:focus-visible,
.eh-nav__toggle:focus-visible{outline:2px solid var(--eh-brand);outline-offset:2px}

/* Botón hamburguesa */
.eh-nav__toggle{
  display:none;
  background:transparent;
  color:#fff;
  border:1px solid #2a3750;
  padding:8px 12px;
  border-radius:10px;
  font-size:18px;
  line-height:1;
  cursor:pointer;
  min-height:44px;
}

/* ====== Mobile ====== */
@media (max-width: 820px){
  .eh-nav__toggle{display:block}
  /* el contenedor mantiene ancho y posición */
  .eh-nav__wrap{gap:12px}

  /* Panel desplegable */
  .eh-nav__menu{
    position:absolute;
    left:0; right:0;
    top: calc(var(--eh-h));
    background: rgba(16,23,35,.98);
    border-top:1px solid var(--eh-border);
    border-bottom:1px solid var(--eh-border);
    box-shadow: var(--eh-shadow);
    display:none; /* cerrado por defecto */
    flex-direction:column;
    padding:10px 14px;
    white-space:normal;
  }
  .eh-nav--open .eh-nav__menu{display:flex}

  .eh-nav__link{
    display:block;
    width:100%;
    margin:0;                /* igual que blog */
    padding:12px 10px;
    color:#e5ecf6;
    text-decoration:none;
  }
}

/* Evita desplazamientos por scrollbars/overflows */
@media (max-width: 820px){
  html, body { overflow-x: hidden; }
}