/* =====================================
   ZAO Technology — Shared Navigation
   https://zaotechnology.com
   ===================================== */

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:15px 48px;
  display:flex;align-items:center;justify-content:space-between;
  backdrop-filter:blur(14px);background:rgba(6,14,25,.82);border-bottom:1px solid rgba(34,211,238,.34);
  line-height:normal;}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;}
.logo-mark{overflow:visible;filter:drop-shadow(0 0 0 rgba(34,211,238,0));animation:logoPulse 3.6s ease-in-out infinite;}
.logo-mark .z-line{stroke-dasharray:42;stroke-dashoffset:42;animation:logoDraw 3.6s ease-in-out infinite;}
.logo-mark .z-top{animation:logoTintTop 3.6s ease-in-out infinite;}
.logo-mark .z-bottom{animation:logoTintBottom 3.6s ease-in-out infinite;}
@keyframes logoPulse{
  0%,100%{filter:drop-shadow(0 0 0 rgba(34,211,238,0));transform:translateY(0);}
  50%{filter:drop-shadow(0 0 10px rgba(34,211,238,.38));transform:translateY(-1px);}
}
@keyframes logoDraw{
  0%{stroke-dashoffset:42;opacity:.5;}
  28%,82%{stroke-dashoffset:0;opacity:1;}
  100%{stroke-dashoffset:-2;opacity:.9;}
}
@keyframes logoTintTop{
  0%,100%{fill:#DC2626;}
  45%{fill:#ef4444;}
  70%{fill:#f97316;}
}
@keyframes logoTintBottom{
  0%,100%{fill:#1D4ED8;}
  45%{fill:#2563eb;}
  70%{fill:#0ea5e9;}
}
.logo-wm{font-family:var(--fd);font-size:1.2rem;font-weight:800;letter-spacing:.06em;color:var(--text);line-height:1;}
.logo-sub{font-family:var(--fm);font-size:.48rem;color:var(--muted);letter-spacing:.22em;display:block;margin-top:2px;line-height:normal;}
nav ul{list-style:none;display:flex;gap:32px;}
nav ul a{text-decoration:none;color:var(--muted);font-size:.875rem;font-weight:500;transition:color .2s;}
nav ul a:hover{color:var(--text);}
.nav-r{display:flex;gap:12px;align-items:center;}
.lt{display:flex;background:var(--bg3);border-radius:12px;border:1px solid var(--border);overflow:hidden;font-family:var(--fm);font-size:.7rem;}
.lt button,.lt a{padding:6px 13px;background:none;border:none;cursor:pointer;color:var(--muted);transition:all .2s;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-width:44px;line-height:normal;}
.lt button.on,.lt a.on{background:var(--red);color:#fff;}
.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border-radius:12px;
  font-family:var(--fb);font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s;border:none;text-decoration:none;line-height:normal;}
.btn-p{background:var(--red);color:#fff;box-shadow:0 0 0 1px rgba(244,63,46,.4),0 12px 24px rgba(244,63,46,.22);}
.btn-p:hover{transform:translateY(-2px);box-shadow:0 0 0 1px rgba(244,63,46,.7),0 16px 30px rgba(244,63,46,.28),0 0 22px rgba(34,211,238,.22);}
.btn-s{padding:8px 18px;font-size:.8rem;}

@media(max-width:960px){
  nav ul{display:none;}
  nav{padding:14px 20px;}
}
@media(max-width:640px){
  nav{padding:12px 14px;}
  .logo-sub{display:none;}
  .nav-r{gap:6px;}
  .lt button,.lt a{padding:9px 12px;min-height:40px;}
  .nav-r .btn-s{display:none;}
}
