/* =========================================================
   ZenoxTV site-wide nav (zn-) + footer (zf-)
   Loaded on every page by includes/hooks/zenox_site.php
   ========================================================= */
.app-nav,.main-footer{display:none!important}
html body,html body.lagom{padding-top:0!important;margin-top:0!important}
html.zn-lock{overflow:hidden!important}

.zn,.zn-strip,.zf{--zbg:#050817;--zline:rgba(169,196,255,.14);--zline2:rgba(169,196,255,.24);--zblue:#3D6BFF;--zblue2:#5682FF;--zice:#A9C4FF;--ztx:#E6ECF8;--zsoft:#C9D2E3;--zmut:#9AA6C2;
  --zfh:'Sora',system-ui,-apple-system,'Segoe UI',sans-serif;font-family:var(--zfh);-webkit-font-smoothing:antialiased;text-align:left}
.zn *,.zn *:before,.zn *:after,.zn-strip *,.zf *,.zf *:before,.zf *:after{box-sizing:border-box}
.zn a,.zn a:hover,.zn a:focus,.zn-strip a,.zf a,.zf a:hover,.zf a:focus{text-decoration:none}
.zn ul,.zn p,.zn-strip p,.zf p,.zf h4,.zf nav{margin:0;padding:0;list-style:none}
.zn button{font-family:inherit;margin:0}
.zn :focus-visible,.zf :focus-visible{outline:2px solid var(--zice);outline-offset:3px;border-radius:8px}
.zn-wrap,.zf-wrap{max-width:1200px;margin:0 auto;padding:0 32px;position:relative}

/* ---------- top strip ---------- */
.zn-strip{position:relative;z-index:1031;background:var(--zbg);border-bottom:1px solid var(--zline);font-size:13px;line-height:1.4;color:var(--zmut)}
.zn-strip .zn-wrap{display:flex;justify-content:space-between;align-items:center;min-height:38px;gap:16px}
.zn-strip p{display:flex;align-items:center;gap:10px;min-width:0}
.zn-strip-r{gap:22px!important;flex:0 0 auto}
.zn-strip a{color:var(--zmut)}
.zn-strip a:hover{color:var(--ztx)}
.zn-dot{flex:0 0 auto;width:8px;height:8px;border-radius:50%;background:#FF4D5E;box-shadow:0 0 0 4px rgba(255,77,94,.18);animation:znBlink 1.4s ease-in-out infinite}

/* ---------- bar ---------- */
.zn{position:fixed;left:0;right:0;top:var(--zn-top,0px);z-index:1030;background:rgba(5,8,23,.92);-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);border-bottom:1px solid var(--zline);transition:background .3s,box-shadow .3s,border-color .3s}
.zn:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(600px 120px at 12% 0,rgba(61,107,255,.28),transparent 70%),radial-gradient(500px 120px at 88% 0,rgba(86,130,255,.18),transparent 70%)}
.zn.zn-scrolled{background:rgba(6,10,26,.8);box-shadow:0 12px 40px rgba(2,6,30,.5)}
/* homepage: bar floats over the hero glow until you scroll */
.zn-ph{height:var(--zn-h,77px)}
.zn.zn-home{background:transparent;border-bottom-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
.zn.zn-home:before{display:none}
.zn.zn-home.zn-scrolled,.zn.zn-home.zn-menu-open{background:rgba(6,10,26,.78);border-bottom-color:var(--zline);-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%)}
.zn-bar{display:flex;align-items:center;gap:24px;min-height:76px}
.zn-logo{display:inline-flex;align-items:center;min-height:44px;flex:0 0 auto}
.zn-logo img{display:block;height:30px;width:auto;max-width:none}
.zn-nav{margin-left:auto;min-width:0}
.zn-links{display:flex;align-items:center;gap:2px}
.zn-links>li{position:relative}
.zn .zn-l{display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 13px;border:0;border-radius:10px;background:transparent;color:var(--zsoft);font:500 15px/1 var(--zfh);white-space:nowrap;cursor:pointer;transition:background .2s,color .2s}
.zn .zn-l:hover,.zn .zn-l:focus,.zn .zn-l.zn-on,.zn .zn-dd.zn-open>.zn-l{color:var(--ztx);background:rgba(169,196,255,.09)}
.zn .zn-l.zn-on{color:#fff}
.zn-l svg,.zn-login svg{transition:transform .2s;flex:0 0 auto}
.zn-dd.zn-open>button svg:last-child{transform:rotate(180deg)}
.zn-l .badge,.zn-l .label{margin-left:4px}

.zn-right{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.zn .zn-login{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 12px;border:0;border-radius:10px;background:transparent;color:var(--ztx);font:500 15px/1 var(--zfh);white-space:nowrap;cursor:pointer}
.zn .zn-login:hover,.zn .zn-dd.zn-open>.zn-login{background:rgba(169,196,255,.09);color:#fff}
.zn-login span{max-width:140px;overflow:hidden;text-overflow:ellipsis}
.zn .zn-cart{position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;color:var(--ztx)}
.zn .zn-cart:hover{background:rgba(169,196,255,.09);color:#fff}
.zn-cart b{position:absolute;top:3px;right:1px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:var(--zblue);color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}
.zn .zn-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:12px;font:600 14px/1.2 var(--zfh);white-space:nowrap;border:1px solid transparent;transition:transform .15s,box-shadow .2s}
.zn .zn-btn:hover{transform:translateY(-1px)}
.zn .zn-cta,.zn .zn-cta:hover,.zn .zn-cta:focus{background:linear-gradient(180deg,#5682FF,#3D6BFF);color:#fff;box-shadow:0 12px 30px rgba(61,107,255,.5),inset 0 1px 0 rgba(255,255,255,.3)}
.zn .zn-ghost,.zn .zn-ghost:hover,.zn .zn-ghost:focus{background:rgba(200,215,255,.08);border-color:var(--zline2);color:var(--ztx)}
.zn .zn-burger{display:none;align-items:center;justify-content:center;width:46px;height:46px;padding:0;border-radius:12px;border:1px solid var(--zline2);background:rgba(169,196,255,.08);color:var(--ztx);cursor:pointer}
.zn-burger .zn-x{display:none}
.zn-menu-open .zn-burger .zn-x{display:block}
.zn-menu-open .zn-burger .zn-b{display:none}

/* dropdowns */
.zn-menu{position:absolute;top:100%;left:50%;z-index:5;width:300px;margin-left:-150px;padding-top:10px;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .18s,transform .18s,visibility .18s}
.zn-menu-r{left:auto;right:0;margin-left:0;width:240px}
.zn-acct{position:relative}
.zn-dd.zn-open>.zn-menu{opacity:1;visibility:visible;transform:none}
.zn-menu-in{position:relative;overflow:hidden;padding:8px;border-radius:20px;background:linear-gradient(180deg,rgba(22,34,76,.97),rgba(8,12,30,.98));border:1px solid var(--zline2);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 30px 70px rgba(2,6,30,.6)}
.zn .zn-menu a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;color:var(--ztx);line-height:1.3}
.zn .zn-menu a:hover,.zn .zn-menu a:focus{background:rgba(169,196,255,.1);color:#fff}
.zn-menu b{display:block;font-size:14px;font-weight:600}
.zn-menu small{display:block;margin-top:2px;font-size:12.5px;color:var(--zmut)}
.zn-ico{flex:0 0 38px;width:38px;height:38px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;background:rgba(61,107,255,.18);border:1px solid rgba(86,130,255,.35);color:var(--zice)}

/* phone/tablet panel */
.zn-panel{display:none}
@media (max-width:1100px){
 .zn-nav,.zn-login,.zn-acct{display:none!important}
 .zn .zn-burger{display:inline-flex}
 .zn-right{margin-left:auto}
}
.zn.zn-fit .zn-nav,.zn.zn-fit .zn-login,.zn.zn-fit .zn-acct{display:none!important}
.zn.zn-fit .zn-burger{display:inline-flex}
.zn.zn-fit .zn-right{margin-left:auto}
.zn-menu-open .zn-panel{display:block;position:absolute;left:0;right:0;top:100%;max-height:calc(100vh - var(--zn-h,76px));overflow-y:auto;overscroll-behavior:contain;padding:8px 0 22px;background:#070B1C;border-bottom:1px solid var(--zline);box-shadow:0 30px 60px rgba(2,6,30,.6)}
.zn .zn-row{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:54px;padding:0 2px;border:0;border-bottom:1px solid var(--zline);background:transparent;color:var(--ztx);font:500 16px/1.3 var(--zfh);text-align:left;cursor:pointer}
.zn .zn-row.zn-on,.zn .zn-acc.zn-open>.zn-row{color:var(--zice)}
.zn-row svg{flex:0 0 auto;color:var(--zice);transition:transform .2s}
.zn-acc.zn-open>.zn-row svg{transform:rotate(180deg)}
.zn-sub{display:none;padding:10px 0 14px;border-bottom:1px solid var(--zline)}
.zn-acc.zn-open>.zn-sub{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.zn .zn-chip{display:flex;align-items:center;min-height:46px;padding:8px 12px;border-radius:12px;background:rgba(169,196,255,.07);border:1px solid var(--zline);color:var(--zsoft);font-size:14px;line-height:1.3;overflow-wrap:anywhere}
.zn .zn-chip:hover{background:rgba(169,196,255,.12);color:#fff}
.zn-pbtns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:10px;margin-top:18px}
.zn-pbtns .zn-btn{min-height:50px}

@media (min-width:1101px) and (hover:hover){
 .zn:not(.zn-fit) .zn-dd:hover>.zn-menu{opacity:1;visibility:visible;transform:none}
}
@media (max-width:1200px){.zn .zn-l{padding:0 10px;font-size:14px}.zn-bar{gap:16px}}
@media (max-width:640px){
 .zn-wrap,.zf-wrap{padding:0 18px}
 .zn-strip{display:none}
 /* phone: floating glass capsule with breathing room at the top */
 .zn,.zn.zn-home,.zn.zn-scrolled,.zn.zn-home.zn-scrolled,.zn.zn-home.zn-menu-open{padding:calc(env(safe-area-inset-top,0px) + 12px) 12px 0;background:transparent;border-bottom-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
 .zn:before{display:none}
 .zn .zn-bar{min-height:60px;gap:10px;padding:0 7px 0 16px;border-radius:20px;background:rgba(8,12,34,.8);border:1px solid var(--zline2);-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 14px 34px rgba(2,6,30,.45)}
 .zn.zn-home:not(.zn-scrolled) .zn-bar{background:rgba(12,20,52,.55)}
 .zn-menu-open .zn-panel{left:12px;right:12px;top:calc(100% + 8px);padding:6px 16px 18px;border:1px solid var(--zline2);border-radius:20px;max-height:calc(100vh - var(--zn-h,76px) - 24px)}
 .zn-panel .zn-wrap{padding:0}
 .zn-logo img{height:24px}
 .zn .zn-btn{padding:0 14px;font-size:13px}
 .zn-right{gap:6px}
 .zn .zn-cart{width:40px}
}
@media (max-width:380px){
 .zn-logo img{height:21px}
 .zn .zn-right>.zn-cta{padding:0 10px;font-size:12px}
 .zn .zn-burger{width:44px;height:44px}
 .zn-acc.zn-open>.zn-sub,.zn-pbtns{grid-template-columns:minmax(0,1fr)}
}

/* ---------- footer ---------- */
.zf{position:relative;overflow:hidden;isolation:isolate;clear:both;margin-top:80px;padding:64px 0 32px;background:var(--zbg);border-top:1px solid var(--zline);color:var(--zmut);font-size:14px;line-height:1.6}
.zf.zf-home{margin-top:0}
.zf-glow{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(700px 300px at 8% 0,rgba(61,107,255,.28),transparent 70%),radial-gradient(600px 300px at 95% 100%,rgba(86,80,255,.22),transparent 70%)}
.zf-top{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(4,minmax(0,1fr));gap:32px}
.zf-logo{display:inline-flex;align-items:center;min-height:44px}
.zf-logo img{display:block;height:30px;width:auto;max-width:none}
.zf-brand p{margin-top:14px;max-width:330px;color:var(--zmut)}
.zf-acts{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-top:18px}
.zf .zf-tp{display:inline-flex;align-items:center;gap:10px;min-height:40px;padding:0 14px 0 6px;border-radius:999px;border:1px solid var(--zline2);background:rgba(169,196,255,.06);color:var(--ztx);font-size:13px;font-weight:600}
.zf .zf-tp:hover{border-color:rgba(0,182,122,.6);color:#fff}
.zf-star{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:999px;background:#00B67A}
.zf .zf-mail{color:var(--zice);font-size:13px;overflow-wrap:anywhere}
.zf h4{margin-bottom:10px;font:600 13px/1.3 var(--zfh);letter-spacing:.12em;text-transform:uppercase;color:var(--ztx)}
.zf nav{display:flex;flex-direction:column}
.zf nav a{display:flex;align-items:center;min-height:36px;color:var(--zmut)}
.zf nav a:hover{color:var(--ztx)}
.zf-bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px 16px;margin-top:44px;padding-top:22px;border-top:1px solid var(--zline);font-size:13px}
@media (max-width:1100px){
 .zf-top{grid-template-columns:repeat(4,minmax(0,1fr))}
 .zf-brand{grid-column:1/-1}
}
@media (max-width:640px){
 .zf{margin-top:56px;padding-top:44px}
 .zf-top{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}
 .zf nav a{min-height:44px}
}

@keyframes znBlink{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.zn *,.zn-strip *,.zf *{animation:none!important;transition:none!important}}

/* =====================================================================
   v3 · ICE STUDIO light nav (footer stays navy). Overrides the dark nav above.
   ===================================================================== */
.zn{--zline:#E3E9F5;--zline2:#D3DCEE;--ztx:#0A1230;--zsoft:#3A4566;--zmut:#636E8C;--zice:#2F5BFF}
.zn-strip{background:#0A1230;border-bottom-color:#0A1230}
.zn{background:rgba(255,255,255,.9);border-bottom-color:#E3E9F5}
.zn:before{background:radial-gradient(600px 120px at 12% 0,rgba(47,91,255,.08),transparent 70%)}
.zn.zn-scrolled{background:rgba(255,255,255,.92);box-shadow:0 10px 30px rgba(10,18,48,.08)}
.zn.zn-home.zn-scrolled,.zn.zn-home.zn-menu-open{background:rgba(255,255,255,.92);border-bottom-color:#E3E9F5}
.zn .zn-l{color:#3A4566}
.zn .zn-l:hover,.zn .zn-l:focus,.zn .zn-l.zn-on,.zn .zn-dd.zn-open>.zn-l{color:#0A1230;background:#EEF2FF}
.zn .zn-l.zn-on{color:#2F5BFF}
.zn .zn-login{color:#0A1230}
.zn .zn-login:hover,.zn .zn-dd.zn-open>.zn-login{background:#EEF2FF;color:#0A1230}
.zn .zn-cart{color:#0A1230}
.zn .zn-cart:hover{background:#EEF2FF;color:#0A1230}
.zn-cart b{background:#2F5BFF}
.zn .zn-cta,.zn .zn-cta:hover,.zn .zn-cta:focus{background:linear-gradient(180deg,#4A72FF,#2F5BFF);box-shadow:0 10px 24px rgba(47,91,255,.3),inset 0 1px 0 rgba(255,255,255,.25)}
.zn .zn-ghost,.zn .zn-ghost:hover,.zn .zn-ghost:focus{background:#FFFFFF;border-color:#D3DCEE;color:#0A1230}
.zn .zn-burger{background:#FFFFFF;border-color:#D3DCEE;color:#0A1230}
.zn-menu-in{background:#FFFFFF;border-color:#E3E9F5;box-shadow:0 24px 60px rgba(10,18,48,.14)}
.zn .zn-menu a{color:#0A1230}
.zn .zn-menu a:hover,.zn .zn-menu a:focus{background:#F2F5FF;color:#0A1230}
.zn-menu small{color:#636E8C}
.zn-ico{background:#EEF2FF;border-color:#D6E0FF;color:#2F5BFF}
.zn-menu-open .zn-panel{background:#FFFFFF;border-bottom-color:#E3E9F5;box-shadow:0 30px 60px rgba(10,18,48,.15)}
.zn .zn-row{color:#0A1230;border-bottom-color:#E3E9F5}
.zn .zn-row.zn-on,.zn .zn-acc.zn-open>.zn-row{color:#2F5BFF}
.zn-row svg{color:#2F5BFF}
.zn-sub{border-bottom-color:#E3E9F5}
.zn .zn-chip{background:#F6F8FD;border-color:#E3E9F5;color:#3A4566}
.zn .zn-chip:hover{background:#EEF2FF;color:#0A1230}
@media (max-width:640px){
 .zn .zn-bar{background:rgba(255,255,255,.9);border-color:#E3E9F5;box-shadow:0 12px 30px rgba(10,18,48,.12)}
 .zn.zn-home:not(.zn-scrolled) .zn-bar{background:rgba(255,255,255,.82)}
 .zn-menu-open .zn-panel{border-color:#E3E9F5}
}
/* footer: navy with a small top accent */
.zf{background:#0A1230;border-top:0}