/* Zinifly marketing site: enterprise navigation (loaded by views/landing/header.php on
   every marketing page). Plain CSS, independent of the purged Tailwind build.
   Contract with public/assets/landing.js: keep ids #mobileMenuButton #mobileMenuClose
   #mobileMenu #mobileMenuOverlay #iconOpen #iconClose and classes .mobile-features-trigger
   .mobile-features-content; the script toggles Tailwind .hidden and inline transforms, so
   nothing here sets `display` on those elements. Desktop mega menu is hover/focus driven
   through .mega-menu-container / .mega-menu / .mega-menu-trigger. */
.zn-nav,#mobileMenu{font-family:'Inter',ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
.zn-nav{background:#fff;border-bottom:1px solid #E5E7EB}
.zn-wrap{max-width:1120px;margin:0 auto;padding:0 24px;height:64px;display:flex;align-items:center;gap:24px;position:relative}
.zn-logo{display:flex;align-items:center;flex-shrink:0}
.zn-logo img{height:40px;width:auto;display:block}
.zn-links{display:flex;align-items:center;gap:4px;margin:0 auto}
.zn-link{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;border-radius:8px;font-size:14px;font-weight:500;color:#1F2937;background:transparent;border:0;cursor:pointer;font-family:inherit;text-decoration:none;transition:color .15s,background .15s;white-space:nowrap}
.zn-link:hover{color:#0B1220;background:#F3F4F6}
.zn-link.is-on{color:#2B3FE3}
.zn-link svg{width:14px;height:14px;transition:transform .2s;color:#8A93A3}
.zn-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}
.zn-signin{font-size:14px;font-weight:500;color:#1F2937;padding:0 12px;height:36px;display:inline-flex;align-items:center;border-radius:8px;text-decoration:none;transition:background .15s}
.zn-signin:hover{background:#F3F4F6;color:#0B1220}
.zn-cta{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 16px;border-radius:8px;background:#2B3FE3;color:#fff;font-size:14px;font-weight:600;text-decoration:none;transition:background .15s;white-space:nowrap}
.zn-cta:hover{background:#1F30C7;color:#fff}
.zn-cta svg{width:14px;height:14px}
.zn-burger{display:none;margin-left:auto;width:40px;height:40px;border:1px solid #E5E7EB;border-radius:8px;background:#fff;color:#1F2937;align-items:center;justify-content:center;cursor:pointer;padding:0}
.zn-burger svg{width:20px;height:20px}
.zn-nav a:focus-visible,.zn-nav button:focus-visible,#mobileMenu a:focus-visible,#mobileMenu button:focus-visible{outline:2px solid #2B3FE3;outline-offset:2px}

/* ---- Desktop mega menu ---- */
/* The container is the hover target. It spans the full 64px bar so the pointer
   never leaves it while travelling from the button down to the panel, and the
   panel's own top padding bridges the last 8px. Closing is delayed 250ms so a
   brief detour (e.g. diagonally across a neighbouring link) does not hide it. */
.zn-nav .mega-menu-container{position:static;padding:0;margin:0;height:64px;display:flex;align-items:center}
.zn-nav .mega-menu{position:absolute;left:50%;top:100%;width:min(940px,calc(100vw - 32px));padding-top:8px;opacity:0;visibility:hidden;transform:translateX(-50%) translateY(-6px);transition:opacity .15s ease .25s,transform .15s ease .25s,visibility 0s linear .4s}
.zn-nav .mega-menu-container:hover .mega-menu,.zn-nav .mega-menu-container:focus-within .mega-menu,.zn-nav .mega-menu-container.is-open .mega-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);transition-delay:0s}
.zn-nav .mega-menu-container:hover .mega-menu-trigger,.zn-nav .mega-menu-container:focus-within .mega-menu-trigger,.zn-nav .mega-menu-container.is-open .mega-menu-trigger{color:#0B1220;background:#F3F4F6}
.zn-nav .mega-menu-container:hover .mega-menu-trigger svg,.zn-nav .mega-menu-container:focus-within .mega-menu-trigger svg,.zn-nav .mega-menu-container.is-open .mega-menu-trigger svg{transform:rotate(180deg)}
.zn-mega-panel{background:#fff;border:1px solid #E5E7EB;border-radius:12px;box-shadow:0 24px 60px -24px rgba(11,18,32,.28),0 2px 6px rgba(11,18,32,.06);overflow:hidden}
.zn-mega-cols{display:grid;grid-template-columns:repeat(3,1fr);padding:10px}
.zn-mega-col{padding:6px}
.zn-mega-col + .zn-mega-col{border-left:1px solid #F3F4F6}
.zn-mega-head{font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#8A93A3;padding:8px 10px 8px}
.zn-mega-item{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border-radius:8px;text-decoration:none;transition:background .12s}
.zn-mega-item:hover{background:#F7F8FA}
.zn-mega-ico{width:30px;height:30px;border-radius:7px;background:#EEF0FD;color:#2B3FE3;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:12px}
.zn-mega-t{font-size:13.5px;font-weight:600;color:#0B1220;line-height:1.3}
.zn-mega-item:hover .zn-mega-t{color:#2B3FE3}
.zn-mega-d{font-size:12px;color:#5B6472;line-height:1.4;margin-top:2px}
.zn-mega-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:12px 18px;border-top:1px solid #E5E7EB;background:#F7F8FA;font-size:13px;color:#5B6472}
.zn-mega-foot div a{color:#2B3FE3;font-weight:600;text-decoration:none;margin-left:18px}
.zn-mega-foot div a:hover{color:#1F30C7}

/* ---- Mobile panel ---- */
#mobileMenuOverlay{position:fixed;inset:0;background:rgba(11,18,32,.45);opacity:0;transition:opacity .3s;z-index:9998}
#mobileMenu{position:fixed;top:0;right:0;bottom:0;width:85%;max-width:380px;background:#fff;box-shadow:-20px 0 50px -20px rgba(11,18,32,.3);z-index:9999;overflow-y:auto;transition:transform .3s}
.zn-m-head{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-bottom:1px solid #E5E7EB}
.zn-m-head img{height:32px;width:auto;display:block}
#mobileMenuClose{width:36px;height:36px;border:1px solid #E5E7EB;border-radius:8px;background:#fff;color:#5B6472;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
#mobileMenuClose svg{width:18px;height:18px}
.zn-m-body{padding:12px 16px 24px}
.zn-m-link{display:flex;align-items:center;justify-content:space-between;width:100%;padding:12px;border-radius:8px;font-size:15px;font-weight:500;color:#1F2937;text-decoration:none;background:transparent;border:0;font-family:inherit;cursor:pointer;text-align:left;transition:background .12s}
.zn-m-link:hover{background:#F7F8FA}
.zn-m-link.is-on{color:#2B3FE3;background:#EEF0FD}
.mobile-features-trigger svg{width:16px;height:16px;color:#8A93A3;transition:transform .3s}
.mobile-features-content{padding:2px 0 4px 8px}
.zn-m-group{font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#8A93A3;padding:12px 12px 6px}
.zn-m-sub{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:8px;font-size:14px;color:#1F2937;text-decoration:none}
.zn-m-sub:hover{background:#F7F8FA}
.zn-m-sub .zn-mega-ico{width:28px;height:28px}
.zn-m-cta{margin-top:16px;padding-top:16px;border-top:1px solid #E5E7EB;display:grid;gap:8px}
.zn-m-cta .zn-cta{height:44px;justify-content:center}
.zn-m-cta .zn-signin{height:44px;justify-content:center;border:1px solid #D1D5DB}
.zn-m-note{text-align:center;font-size:12px;color:#8A93A3;margin-top:4px}
@media (max-width:767px){.zn-links,.zn-actions{display:none}.zn-burger{display:inline-flex}}

/* ==== Footer (views/landing/footer.php) ==================================== */
.zf{font-family:'Inter',ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;background:#fff;border-top:1px solid #E5E7EB;color:#1F2937}
.zf-wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.zf-top{display:grid;grid-template-columns:1.2fr 2.4fr;gap:48px;padding:56px 0 40px}
.zf-logo{display:inline-block}
.zf-logo img{height:36px;width:auto;display:block}
.zf-tag{font-size:14px;line-height:1.6;color:#5B6472;margin:18px 0 20px;max-width:300px}
.zf-social{display:flex;gap:8px}
.zf-social a{width:34px;height:34px;border:1px solid #E5E7EB;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;color:#5B6472;font-size:13px;text-decoration:none;transition:border-color .15s,color .15s}
.zf-social a:hover{border-color:#2B3FE3;color:#2B3FE3}
.zf-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.zf-col h4{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#8A93A3;margin:6px 0 14px}
.zf-col ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.zf-col a{font-size:14px;color:#1F2937;text-decoration:none;transition:color .15s}
.zf-col a:hover{color:#2B3FE3}
.zf-facts{display:flex;flex-wrap:wrap;gap:10px 28px;padding:18px 0;border-top:1px solid #E5E7EB;font-size:13px;color:#5B6472}
.zf-facts span{display:inline-flex;align-items:center;gap:8px}
.zf-facts i{color:#8A93A3;font-size:12px}
.zf-facts a{color:#5B6472;text-decoration:underline;text-underline-offset:3px}
.zf-facts a:hover{color:#2B3FE3}
.zf-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;padding:18px 0 24px;border-top:1px solid #E5E7EB;font-size:12.5px;color:#8A93A3}
.zf-legal{display:flex;flex-wrap:wrap;gap:6px 18px}
.zf-legal a{color:#5B6472;text-decoration:none}
.zf-legal a:hover{color:#2B3FE3}
.zf-status{display:inline-flex;align-items:center;gap:8px}
.zf-dot{width:8px;height:8px;border-radius:50%;background:#16A34A;box-shadow:0 0 0 3px rgba(22,163,74,.15)}
@media (max-width:900px){.zf-top{grid-template-columns:1fr;gap:36px;padding:44px 0 32px}.zf-cols{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.zf-cols{grid-template-columns:1fr 1fr;gap:20px}.zf-bottom{flex-direction:column;align-items:flex-start}}
