body{margin:0}.kn-topbar{background:#0f172a;color:#fff;min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 22px;z-index:999}.kn-menu{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.kn-menu a,.kn-credit-pill{background:#1e293b;color:#fff!important;text-decoration:none;padding:11px 16px;border-radius:12px;font-weight:700}.kn-menu a:hover{background:#334155}.kn-gold{background:#d4a23a!important;color:#111827!important}.kn-teal{background:#0f766e!important}.kn-brand a{color:#fff!important;text-decoration:none;font-weight:800;font-size:20px}.kn-footer{text-align:center;color:#64748b;padding:30px 15px}.ai-answer-panel{background:#fff;border:1px solid #ead7ad;border-radius:18px;padding:18px;margin-top:16px;box-shadow:0 8px 22px rgba(0,0,0,.05)}@media(max-width:860px){.kn-topbar{flex-direction:column;align-items:flex-start}}
/* Header logo and shared shell polish */
.kn-shell{max-width:1400px;margin:0 auto;padding:30px 18px}.kn-card{background:#fffaf0;border:1px solid #ead7ad;border-radius:18px;padding:26px;box-shadow:0 10px 28px rgba(15,23,42,.06);color:#0f172a}.kn-tool-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:18px}.kn-tool-card{background:#fff;border:1px solid #ead7ad;border-radius:18px;padding:22px;box-shadow:0 10px 25px rgba(15,23,42,.05);color:#0f172a}.kn-brand-logo{width:38px;height:38px;object-fit:contain;border-radius:10px;vertical-align:middle;margin-left:8px}.kn-brand{display:inline-flex!important;align-items:center;gap:8px;white-space:nowrap}.kn-brand span{font-weight:900;font-size:20px}
/* =========================
   MOBILE MENU CLICK FIX
========================= */

.kn-topbar,
.kn-nav-wrap,
.kn-menu,
.kn-mobile-menu,
header {
    position: relative !important;
    z-index: 999999 !important;
}

/* Prevent overlay blocking menu clicks */
.hero-section,
.page-banner,
.page-overlay,
.main-content,
.kn-shell,
.tool-page,
.tool-wrapper {
    position: relative;
    z-index: 1 !important;
}

/* Disable invisible overlay click blocking */
.hero-section::before,
.hero-section::after,
.page-overlay,
.overlay,
.bg-overlay {
    pointer-events: none !important;
}

/* Ensure menu items clickable */
.kn-menu a,
.kn-mobile-menu a,
.kn-topbar a {
    pointer-events: auto !important;
    position: relative;
    z-index: 999999 !important;
}

/* Mobile responsive fix */
@media (max-width: 768px) {

    .kn-topbar {
        position: relative !important;
        z-index: 999999 !important;
    }

    .kn-menu {
        position: relative !important;
        z-index: 999999 !important;
    }

}


/* =========================================================
   FINAL MOBILE MENU CLICK FIX - 2026-05-24
   Fixes: mobile drawer visible but links not clickable
========================================================= */
@media (max-width: 900px){

  html,
  body{
    overflow-x:hidden !important;
  }

  .kn-topbar{
    position:relative !important;
    z-index:2147483000 !important;
    isolation:isolate !important;
    pointer-events:auto !important;
  }

  .kn-nav-wrap{
    position:relative !important;
    z-index:2147483001 !important;
    pointer-events:auto !important;
  }

  .kn-mobile-toggle{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    position:relative !important;
    z-index:2147483647 !important;
    pointer-events:auto !important;
    cursor:pointer !important;
    touch-action:manipulation !important;
  }

  .kn-nav{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:auto !important;
    bottom:0 !important;
    width:min(86vw,340px) !important;
    height:100vh !important;
    max-height:100vh !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    background:#0b1220 !important;
    padding:76px 18px 22px !important;
    z-index:2147483646 !important;
    pointer-events:auto !important;
    -webkit-overflow-scrolling:touch !important;
    box-shadow:18px 0 45px rgba(0,0,0,.45) !important;
  }

  .kn-nav.open,
  body.kn-menu-open .kn-nav{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:8px !important;
  }

  .kn-nav a,
  .kn-nav button,
  .kn-menu-item,
  .kn-submenu a,
  .kn-submenu button{
    position:relative !important;
    z-index:2147483647 !important;
    pointer-events:auto !important;
    cursor:pointer !important;
    touch-action:manipulation !important;
  }

  .kn-nav a,
  .kn-nav button{
    display:block !important;
    width:100% !important;
    min-height:46px !important;
    line-height:1.4 !important;
    text-align:left !important;
    padding:12px 14px !important;
    margin:0 !important;
  }

  .kn-menu-item{
    width:100% !important;
    display:block !important;
  }

  .kn-submenu{
    position:static !important;
    min-width:0 !important;
    width:100% !important;
    margin:6px 0 6px 0 !important;
    padding:8px !important;
    background:#111827 !important;
    border:1px solid rgba(255,255,255,.12) !important;
    box-shadow:none !important;
    z-index:2147483647 !important;
    pointer-events:auto !important;
  }

  .kn-menu-item.open > .kn-submenu{
    display:block !important;
  }

  .kn-menu-item:not(.open) > .kn-submenu{
    display:none !important;
  }

  .kn-overlay{
    position:fixed !important;
    inset:0 !important;
    background:rgba(0,0,0,.52) !important;
    z-index:2147483645 !important;
  }

  .kn-overlay.show{
    display:block !important;
    pointer-events:auto !important;
  }

  body.kn-menu-open .kn-overlay{
    display:block !important;
  }

  body.kn-menu-open > *:not(.kn-topbar):not(.kn-overlay){
    pointer-events:none !important;
  }

  body.kn-menu-open .kn-topbar,
  body.kn-menu-open .kn-topbar *,
  body.kn-menu-open .kn-overlay{
    pointer-events:auto !important;
  }
}

/* Make sure page overlays never sit above the mobile menu */
.hero-section,
.page-banner,
.page-overlay,
.main-content,
.kn-shell,
.tool-page,
.tool-wrapper,
.durood-wrap,
.durood-card,
.relation-page,
.relation-card,
.reldoem-page,
.reldoem-card,
.selfrel-page,
.selfrel-card{
  z-index:auto;
}

.hero-section::before,
.hero-section::after,
.page-overlay,
.overlay,
.bg-overlay{
  pointer-events:none !important;
}