/* ============================================================
   NHA responsive + platform layer  (v20261021)
   Loaded AFTER style.css. Fixes mobile menu, overflow, popup, and
   adds Android (Material 3), iOS (Apple HIG) and Windows (Fluent) feel.
   Platform is set by /js/nha-platform.js -> html[data-platform]
   ============================================================ */
:root{
  --nha-bar-h:64px;
  --nha-safe-t:env(safe-area-inset-top,0px);
  --nha-safe-b:env(safe-area-inset-bottom,0px);
  --nha-header-bg:rgba(255,255,255,.94);
  --nha-solid:#ffffff;
  --nha-accent:var(--gold-600);
  --nha-tint:var(--paper-tint);
}
[data-theme="dark"]{
  --nha-header-bg:rgba(10,15,28,.92);
  --nha-solid:#0a0f1c;
  --nha-accent:var(--gold-400);
}

/* ---------- Global: no sideways scroll, touch polish ---------- */
@supports (overflow:clip){html,body{overflow-x:clip!important}}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:88px;-webkit-tap-highlight-color:transparent}
body{min-width:320px;overflow-wrap:break-word}
h1,h2,h3{text-wrap:balance}
a,button,[role=button]{touch-action:manipulation}
img,video,iframe,svg{max-width:100%}
pre,code{max-width:100%}
.post-body pre{overflow-x:auto}

/* ---------- Header: theme-correct at every width ---------- */
header.site-header,header.site-header.scrolled{background:var(--nha-header-bg)!important}
header.site-header.scrolled .brand-text strong,header.site-header .brand-text strong{color:var(--heading)}
.brand{flex:1 1 auto;min-width:0}

/* ---------- Drawer foot + bottom bar: hidden on desktop ---------- */
.nha-drawer-foot,.nha-bottom-nav{display:none}

/* ============================================================
   MOBILE / TABLET  (<= 900px)
   ============================================================ */
@media(max-width:900px){
  body{padding-bottom:calc(var(--nha-bar-h) + var(--nha-safe-b))}
  html:has(body.nav-open){overflow:hidden}
  .topbar{display:none}

  /* ROOT-CAUSE FIX: backdrop-filter on the header makes the fixed drawer
     position against the header instead of the viewport. Remove it here. */
  header.site-header,header.site-header.scrolled{
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
    z-index:1000;padding-top:var(--nha-safe-t);
  }
  .nav-wrap{padding:8px 0;min-height:60px;gap:8px}
  .nav-cta{display:flex!important;gap:6px}
  .nav-cta .btn{display:none!important}
  .theme-toggle,.nav-toggle{width:44px;height:44px;margin:0;flex:none}
  .nav-toggle{display:inline-flex!important;align-items:center;justify-content:center;padding:0;
    border:1px solid var(--border);border-radius:12px;z-index:1002;position:relative}

  /* Drawer (right side by default) */
  nav.main-nav{
    position:fixed!important;top:0!important;bottom:0!important;right:0!important;left:auto!important;
    width:min(86vw,360px)!important;max-width:none!important;height:auto!important;max-height:none!important;
    display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:6px!important;
    padding:calc(var(--nha-safe-t) + 78px) 16px calc(var(--nha-safe-b) + 20px)!important;
    overflow-y:auto!important;overscroll-behavior:contain;
    background:var(--nha-solid)!important;border-left:1px solid var(--border);
    box-shadow:-24px 0 60px rgba(3,10,22,.35);
    transform:translateX(104%)!important;visibility:hidden;pointer-events:none;z-index:1001!important;
    transition:transform .36s cubic-bezier(.32,.72,0,1),visibility 0s linear .36s!important;
  }
  nav.main-nav.open{
    transform:translateX(0)!important;visibility:visible;pointer-events:auto;
    transition:transform .36s cubic-bezier(.32,.72,0,1),visibility 0s linear 0s!important;
  }
  nav.main-nav>a{
    display:flex!important;align-items:center;width:100%;min-height:52px;
    padding:12px 16px!important;border-radius:14px;font-size:1.02rem!important;font-weight:600;
    color:var(--heading)!important;position:relative;
  }
  nav.main-nav>a::after{display:none!important}
  nav.main-nav>a.active,nav.main-nav>a:hover{background:var(--nha-tint)!important;color:var(--link)!important}
  body.nav-open::after{
    background:rgba(3,10,22,.5)!important;z-index:999!important;
    -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:nhaFade .25s ease;
  }
  @keyframes nhaFade{from{opacity:0}to{opacity:1}}

  /* Drawer footer: contact + CTAs (replaces hidden top bar) */
  nav.main-nav .nha-drawer-foot{display:flex;flex-direction:column;gap:10px;margin-top:auto;padding-top:18px}
  nav.main-nav .nha-drawer-foot a{display:flex;align-items:center;justify-content:center;min-height:48px;
    border-radius:14px;font-weight:700;font-size:.93rem;text-align:center;padding:0 12px;width:auto}
  nav.main-nav .nha-drawer-foot a::after{display:none!important}
  nav.main-nav .nha-drawer-foot .nha-df-gold{background:linear-gradient(135deg,var(--gold-400),var(--gold-600));color:#050b18!important}
  nav.main-nav .nha-drawer-foot .nha-df-line{border:1.5px solid var(--border);color:var(--heading)!important;background:transparent}
  nav.main-nav .nha-drawer-foot .nha-df-meta{display:flex;gap:8px}
  nav.main-nav .nha-drawer-foot .nha-df-meta a{flex:1 1 0;min-width:0}

  /* Bottom app bar */
  .nha-bottom-nav{
    display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;left:0;right:0;bottom:0;z-index:240;
    height:calc(var(--nha-bar-h) + var(--nha-safe-b));padding:6px 6px var(--nha-safe-b);
    background:var(--nha-header-bg);-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);
    border-top:1px solid var(--border);
  }
  .nha-bottom-nav a,.nha-bottom-nav button{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;
    font:600 .68rem/1.1 var(--font);color:var(--surface-muted);background:none;border:0;border-radius:12px;
    cursor:pointer;position:relative;padding:0;text-decoration:none;
  }
  .nha-bn-ico{display:grid;place-items:center;width:52px;height:28px;border-radius:14px;transition:background .2s,color .2s}
  .nha-bottom-nav svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .nha-bottom-nav .is-active{color:var(--nha-accent)}
  .nha-bottom-nav .is-active .nha-bn-ico{background:color-mix(in srgb,var(--nha-accent) 16%,transparent)}

  /* Floating elements clear the bar */
  .back-top{bottom:calc(var(--nha-bar-h) + var(--nha-safe-b) + 14px)!important;right:14px!important;width:44px;height:44px}
  .wa-float{bottom:calc(var(--nha-bar-h) + var(--nha-safe-b) + 14px)!important;left:14px!important;width:52px;height:52px}

  /* YouTube popup: was a fixed 315x560 box that swallowed phones */
  .nha-chat-launcher{bottom:calc(var(--nha-bar-h) + var(--nha-safe-b) + 14px)!important;z-index:245!important}
  .nha-chat-panel{bottom:calc(var(--nha-bar-h) + var(--nha-safe-b) + 78px)!important;max-height:calc(100vh - var(--nha-bar-h) - var(--nha-safe-b) - 110px)!important;z-index:246!important}
  #nha-yt{width:min(230px,62vw)!important;left:12px!important;right:auto!important;
    bottom:calc(var(--nha-bar-h) + var(--nha-safe-b) + 78px)!important;border-radius:14px!important;z-index:230!important}
  #nha-yt iframe{width:100%!important;height:auto!important;aspect-ratio:9/16}
  #nha-yt>div:first-child{padding:4px 8px!important}
  #nha-yt>div:first-child span{font-size:.7rem!important}
  #nha-yt-tab{left:12px!important;right:auto!important;bottom:calc(var(--nha-bar-h) + var(--nha-safe-b) + 78px)!important;z-index:230!important}

  /* Layout polish */
  .hero-stats{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px!important}
  .hero-stats>*{min-width:0}
  .ai-btn-wrap{width:100%;align-items:stretch}
  .btn-ai-advisory{width:100%;justify-content:center}
  .footer-grid ul li a{display:inline-block;padding:6px 0}
  footer.site-footer{padding-bottom:28px}
  .post-body{overflow-wrap:anywhere}
}
@media(max-width:380px){
  .brand-text strong{font-size:.86rem}
  .brand-text span{display:none}
  .brand-icon{height:32px}
}

/* ---------- Touch devices: no sticky hover lifts ---------- */
@media(hover:none){
  .card:hover,.person-card:hover,.blog-card:hover,.mini-card:hover,.insight-card:hover,.service-item:hover,.playlist-card:hover,
  .btn:hover{transform:none!important}
  .btn::before{display:none}
  .btn:active,.card:active,.service-item:active{transform:scale(.97);transition:transform .12s}
}

/* ============================================================
   iOS  (Apple HIG: frosted bars, bottom sheet, grouped rows)
   ============================================================ */
html[data-platform="ios"]{
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;
  --radius:18px;--radius-sm:12px;--nha-accent:#b8892f;
}
html[data-platform="ios"][data-theme="dark"]{--nha-accent:#e8c766}
html[data-platform="ios"] body{font-family:var(--font)}
html[data-platform="ios"] .btn{border-radius:14px;font-weight:600;letter-spacing:-.01em}
html[data-platform="ios"] .btn:active{transform:scale(.97);opacity:.9}
html[data-platform="ios"] .card,html[data-platform="ios"] .person-card,html[data-platform="ios"] .blog-card,
html[data-platform="ios"] .service-item,html[data-platform="ios"] .form-card{border-radius:18px}
@media(min-width:901px){
  html[data-platform="ios"] header.site-header{-webkit-backdrop-filter:saturate(180%) blur(22px);backdrop-filter:saturate(180%) blur(22px);border-bottom:.5px solid var(--border)}
}
@media(max-width:900px){
  html[data-platform="ios"]{--nha-bar-h:56px}
  html[data-platform="ios"] header.site-header{border-bottom:.5px solid var(--border)}
  html[data-platform="ios"] .nha-bottom-nav{border-top:.5px solid var(--border)}
  html[data-platform="ios"] .nha-bottom-nav a,html[data-platform="ios"] .nha-bottom-nav button{font-size:.62rem;font-weight:500}
  html[data-platform="ios"] .nha-bn-ico{background:none!important;height:26px}
  /* bottom sheet instead of side drawer */
  html[data-platform="ios"] nav.main-nav{
    top:auto!important;left:0!important;right:0!important;bottom:0!important;width:100%!important;max-height:84vh!important;
    max-height:84dvh!important;
    border:0;border-radius:22px 22px 0 0;padding:28px 16px calc(var(--nha-safe-b) + 18px)!important;
    transform:translateY(106%)!important;box-shadow:0 -12px 50px rgba(0,0,0,.35);
  }
  html[data-platform="ios"] nav.main-nav.open{transform:translateY(0)!important}
  html[data-platform="ios"] nav.main-nav::before{content:"";position:absolute;top:9px;left:50%;width:38px;height:5px;border-radius:3px;background:var(--border);transform:translateX(-50%)}
  html[data-platform="ios"] nav.main-nav>a{background:var(--nha-tint);border-radius:0;border-bottom:.5px solid var(--border);font-weight:500;min-height:46px;padding-top:9px!important;padding-bottom:9px!important}
  html[data-platform="ios"] nav.main-nav .nha-drawer-foot{gap:8px;padding-top:12px}
  html[data-platform="ios"] nav.main-nav .nha-drawer-foot a{min-height:44px}
  html[data-platform="ios"] nav.main-nav>a:first-child{border-radius:14px 14px 0 0}
  html[data-platform="ios"] nav.main-nav>a:nth-last-child(2){border-radius:0 0 14px 14px;border-bottom:0}
  html[data-platform="ios"] nav.main-nav>a::after{
    display:block!important;content:""!important;position:static!important;width:8px!important;height:8px!important;
    border:solid var(--surface-muted)!important;border-width:2px 2px 0 0!important;background:none!important;border-radius:0!important;
    transform:rotate(45deg)!important;margin-left:auto;opacity:.55;
  }
  html[data-platform="ios"] nav.main-nav .nha-drawer-foot{margin-top:18px}
}

/* ============================================================
   ANDROID  (Material 3: tonal surfaces, left drawer, nav bar, ripples)
   ============================================================ */
html[data-platform="android"]{
  --font:Roboto,"Google Sans","Segoe UI",system-ui,sans-serif;--radius:16px;
}
html[data-platform="android"] body{font-family:var(--font)}
html[data-platform="android"] .btn{border-radius:20px;font-weight:600;letter-spacing:.01em}
html[data-platform="android"] header.site-header{box-shadow:0 1px 3px rgba(0,0,0,.14),0 1px 2px rgba(0,0,0,.24)}
html[data-platform="android"] .wa-float,html[data-platform="android"] .back-top{border-radius:16px}
html[data-platform="android"] :is(.btn,nav.main-nav>a,.nav-toggle,.theme-toggle,.tabbar button,.blog-filters button,.nha-video-option,.nha-bottom-nav a,.nha-bottom-nav button){position:relative;overflow:hidden}
.nha-ripple{position:absolute;border-radius:50%;background:currentColor;opacity:.2;transform:scale(0);animation:nhaRipple .55s ease-out forwards;pointer-events:none}
@keyframes nhaRipple{to{transform:scale(1);opacity:0}}
@media(max-width:900px){
  html[data-platform="android"]{--nha-bar-h:72px}
  html[data-platform="android"] nav.main-nav{
    left:0!important;right:auto!important;border:0;border-radius:0 28px 28px 0;
    transform:translateX(-104%)!important;box-shadow:8px 0 40px rgba(0,0,0,.35);
  }
  html[data-platform="android"] nav.main-nav.open{transform:translateX(0)!important}
  html[data-platform="android"] nav.main-nav>a{border-radius:28px;min-height:56px;padding:0 24px!important;font-weight:500}
  html[data-platform="android"] nav.main-nav>a.active{background:color-mix(in srgb,var(--nha-accent) 22%,transparent)!important;color:var(--heading)!important}
  html[data-platform="android"] .nha-bottom-nav{border-top:0;box-shadow:0 -1px 0 var(--border);padding-top:10px}
  html[data-platform="android"] .nha-bn-ico{width:64px;height:32px;border-radius:16px}
  html[data-platform="android"] .nha-bottom-nav a,html[data-platform="android"] .nha-bottom-nav button{font-size:.72rem;gap:4px}
  html[data-platform="android"] .nha-bottom-nav .is-active{color:var(--heading)}
  html[data-platform="android"] .nha-bottom-nav .is-active .nha-bn-ico{background:color-mix(in srgb,var(--nha-accent) 26%,transparent);color:var(--heading)}
  html[data-platform="android"] .wa-float{width:56px;height:56px}
}

/* ============================================================
   WINDOWS  (Fluent 2: Segoe UI, tight radii, reveal highlight)
   ============================================================ */
html[data-platform="windows"]{
  --font:"Segoe UI Variable Text","Segoe UI",system-ui,sans-serif;
  --font-serif:"Segoe UI Variable Display","Segoe UI Semibold","Segoe UI",system-ui,sans-serif;
  --radius:8px;--radius-sm:6px;
  scrollbar-width:thin;scrollbar-color:#8a93a6 transparent;
}
html[data-platform="windows"][data-theme="dark"]{scrollbar-color:#4a5675 transparent}
html[data-platform="windows"] body{font-family:var(--font)}
html[data-platform="windows"] h1,html[data-platform="windows"] h2,html[data-platform="windows"] h3,html[data-platform="windows"] h4{letter-spacing:-.015em}
html[data-platform="windows"] .btn{border-radius:6px;font-weight:600}
html[data-platform="windows"] :is(.card,.person-card,.blog-card,.mini-card,.service-item,.form-card,.post-body,.nha-video-player,.playlist-card,.contact-info-card){
  border-radius:8px;box-shadow:0 1.6px 3.6px rgba(0,0,0,.10),0 .3px .9px rgba(0,0,0,.08);
}
html[data-platform="windows"] :is(.cta-band,.quote-block){border-radius:12px}
html[data-platform="windows"] :is(.card,.service-item,.blog-card,.person-card,.mini-card){
  background-image:radial-gradient(240px circle at var(--mx,-999px) var(--my,-999px),rgba(212,175,55,.11),transparent 65%);
}
html[data-platform="windows"] .card:hover,html[data-platform="windows"] .blog-card:hover,html[data-platform="windows"] .person-card:hover{transform:translateY(-2px)}
html[data-platform="windows"] nav.main-nav>a{border-radius:6px}
html[data-platform="windows"] nav.main-nav>a.active::before{
  content:"";position:absolute;left:50%;bottom:3px;width:16px;height:3px;border-radius:2px;background:var(--nha-accent);transform:translateX(-50%);
}
html[data-platform="windows"] :focus-visible{outline:2px solid var(--link);outline-offset:2px;border-radius:4px}
html[data-platform="windows"] ::-webkit-scrollbar{width:14px;height:14px}
html[data-platform="windows"] ::-webkit-scrollbar-thumb{background:#8a93a6;border:4px solid transparent;background-clip:content-box;border-radius:8px}
html[data-platform="windows"] ::-webkit-scrollbar-track{background:transparent}
@media(max-width:900px){
  html[data-platform="windows"] nav.main-nav{border-radius:12px 0 0 12px}
  html[data-platform="windows"] nav.main-nav>a{border-radius:6px;min-height:48px}
  html[data-platform="windows"] nav.main-nav>a.active::before{left:4px;top:50%;bottom:auto;width:3px;height:18px;transform:translateY(-50%)}
  html[data-platform="windows"] .nha-bottom-nav{border-radius:12px 12px 0 0}
  html[data-platform="windows"] .nha-bn-ico{border-radius:6px}
}

@media(max-width:900px){
  html[data-platform="android"] nav.main-nav::before,html[data-platform="windows"] nav.main-nav::before{
    content:"Nimesh Hariya & Associates";position:absolute;top:calc(var(--nha-safe-t) + 30px);left:24px;right:80px;
    font:700 .74rem/1.2 var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--nha-accent);
  }
  html[data-platform="windows"] nav.main-nav::before{left:16px}
}
@media(prefers-reduced-motion:reduce){
  nav.main-nav,.nha-bottom-nav *,.btn,.card{transition:none!important}
  .nha-ripple{display:none}
  body.nav-open::after{animation:none}
}

/* ---------- v20261022: icon-font-independent menu button + popup tab placement ---------- */
@media(max-width:900px){
  .nav-toggle{color:var(--heading)}
  .nav-toggle>*{display:none!important}
  .nav-toggle::before{
    content:"";display:block;width:24px;height:24px;background:currentColor;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  .nav-toggle[aria-expanded="true"]::before{
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
  }
  #nha-yt-tab{left:78px!important;bottom:calc(var(--nha-bar-h) + var(--nha-safe-b) + 24px)!important}
}