/* Shared header for every public page of zelbi.ai. Markup is the same <nav class="zh"> on each page. */
.zh{position:relative;z-index:5;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 16px;padding:calc(20px + env(safe-area-inset-top,0px)) 16px 0;font:500 15px/1.2 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.zh--over{position:absolute;top:0;left:0;right:0}
/* Readable backdrop while content scrolls under the pills: a soft green wash behind the row, fading out below it */
.zh::after{content:'';display:none;position:absolute;left:0;right:0;top:0;bottom:-18px;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(6,48,27,.5) 0%,rgba(6,48,27,.4) 65%,rgba(6,48,27,0) 100%)}
.zh--solid::after{display:none}
.zh--solid{background:#06301b;padding-bottom:18px;overflow:hidden}
.zh a{position:relative;display:block;min-width:132px;text-align:center;text-decoration:none;color:#fff;padding:11px 20px;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,.05) 55%,rgba(255,255,255,.09) 100%);-webkit-backdrop-filter:blur(22px) saturate(115%) brightness(1.08);backdrop-filter:blur(22px) saturate(115%) brightness(1.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 0 rgba(255,255,255,.10),0 10px 30px rgba(0,0,0,.20);text-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .12s ease,background .15s ease,box-shadow .12s ease}
.zh a::before{content:'';position:absolute;left:8%;right:8%;top:2px;height:46%;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.30),rgba(255,255,255,0));pointer-events:none}
.zh a:hover{text-decoration:none;background:linear-gradient(180deg,rgba(255,255,255,.22) 0%,rgba(255,255,255,.08) 55%,rgba(255,255,255,.12) 100%)}
.zh a:active{transform:translateY(1px) scale(.965);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12),inset 0 2px 6px rgba(0,0,0,.25),0 2px 8px rgba(0,0,0,.16)}
.zh a:focus-visible{outline:2px solid #fff;outline-offset:3px}
.zh a[aria-current=page]{background:linear-gradient(180deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.14) 55%,rgba(255,255,255,.2) 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),inset 0 1px 0 rgba(255,255,255,.7),0 10px 30px rgba(0,0,0,.20)}
/* Phones only (Nick, 2026-10-27): header in normal flow, plain text links, no pills. Desktop (821px and up) unchanged. */
@media(max-width:820px){
.zh,.zh--over{position:static;flex-wrap:wrap;justify-content:center;gap:0 20px;padding:calc(14px + env(safe-area-inset-top,0px)) 16px 14px;font:600 14px/1.2 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.zh{position:relative}
.zh::after{display:block;right:0;bottom:auto;height:140px;background:linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,0) 100%)}
.zh--solid::after{display:none}
.zh--solid{overflow:visible}
.zh a,.zh a:hover,.zh a:active,.zh a[aria-current=page]{display:flex;align-items:center;min-width:0;min-height:40px;padding:0;border-radius:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;text-shadow:0 1px 6px rgba(0,0,0,.45);transform:none;color:rgba(255,255,255,.82);text-decoration:none;transition:none}
.zh a::before{content:none}
.zh a[aria-current=page]{color:#fff;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
}
@media(max-width:430px){
.zh,.zh--over{flex-wrap:nowrap;justify-content:space-between;gap:0}
.zh a[href='/help/'],.zh a[href='/join/']{font-size:0}
.zh a[href='/help/']::after,.zh a[href='/join/']::after{font-size:14px;font-weight:600}
.zh a[href='/help/']::after{content:'Help'}.zh a[href='/join/']::after{content:'Waitlist'}
.zh a[href='/help/'][aria-current=page],.zh a[href='/join/'][aria-current=page]{text-decoration:none}
.zh a[href='/help/'][aria-current=page]::after,.zh a[href='/join/'][aria-current=page]::after{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
}
