/* ===== Shaheer floating glass pill navbar (SITE STANDARD) ===== */
header.elementor-location-header{
  position:fixed; top:14px; left:50%;
  width:calc(100% - 40px); max-width:1120px; z-index:1000;
  border-radius:999px;
  transform:translateX(-50%) translateY(0);
  background:rgba(0,0,0,.88) !important;
  -webkit-backdrop-filter:blur(18px) saturate(155%);
  backdrop-filter:blur(18px) saturate(155%);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 12px 40px rgba(0,0,0,.28);
  transition:transform .5s cubic-bezier(0.16,1,0.3,1),background .35s ease,box-shadow .35s ease;
}
header.elementor-location-header .e-con,
header.elementor-location-header .e-con-inner,
header.elementor-location-header .elementor-element{ background:transparent !important; }
/* SLIM PILL: contents (logo 52px, menu) keep their size — only shell chrome shrinks */
header.elementor-location-header .e-con-inner{ padding-top:0 !important;padding-bottom:0 !important; }
header.elementor-location-header > .e-con.e-parent{ padding-top:0 !important;padding-bottom:0 !important; }
header.elementor-location-header .e-con,
header.elementor-location-header .elementor-widget,
header.elementor-location-header .elementor-widget-container{ min-height:0 !important; }
header.elementor-location-header .elementor-element{ --min-height:0px; }
header.elementor-location-header .e-con-inner > .e-con{ padding-top:2px !important;padding-bottom:2px !important; }
header.elementor-location-header .elementor-widget-image img{ height:52px !important;width:auto !important;position:relative;top:3px;left:-12px; }
header.elementor-location-header .elementor-item{ color:#eaeaea !important;font-family:'Roboto',sans-serif !important;font-weight:500 !important;font-size:15px !important;letter-spacing:.1px; }
header.elementor-location-header .elementor-item:hover{ color:#82ff1f !important; }
header.elementor-location-header .elementor-item.elementor-item-active,
header.elementor-location-header .current-menu-item > .elementor-item{ color:#82ff1f !important; }
header.elementor-location-header .elementor-menu-toggle{ color:#fff !important; }
header.elementor-location-header .elementor-nav-menu--dropdown{ background:rgba(16,16,16,.96) !important;backdrop-filter:blur(18px);border-radius:12px; max-width:100% !important; }
/* the (hidden) mobile dropdown must never widen the layout viewport on phones */
html, body{ overflow-x:clip; }
/* CTA in the pill — .hs-btn-primary look, sized for the slim shell */
.hs-nav-cta{
  align-self:center; flex-shrink:0;
  margin:0 10px 0 18px;
  padding:9px 22px !important;
  font-size:14px !important;
  white-space:nowrap;
}
@media (max-width:767px){ header.elementor-location-header .hs-nav-cta{ display:none !important; } }

/* scrolled: tighter + more solid */
header.elementor-location-header.hs-nav-scrolled{
  background:rgba(0,0,0,.94) !important;
  box-shadow:0 10px 30px rgba(0,0,0,.45);
}
header.elementor-location-header.hs-nav-hidden{ transform:translateX(-50%) translateY(-160%) !important; }
@media (max-width:600px){ header.elementor-location-header{ top:10px;width:calc(100% - 22px);border-radius:999px; } }

/* ---- nav clearance STANDARD (change --hs-nav-h once, updates everywhere) ---- */
:root{ --hs-nav-h:90px; }
@media (max-width:600px){ :root{ --hs-nav-h:74px; } }
/* default pages: reserve nav height above content */
body:not(.hs-hero-clear) #content.site-content{ padding-top:var(--hs-nav-h); }
/* hero pages: transparent top border shows the section's OWN bg (no seam) + stacks over existing padding */
.hs-nav-offset{ border-top:var(--hs-nav-h) solid transparent !important; }

/* ============================================================
   MOBILE NAV FIX (<=767px): center the hamburger + fix the
   dropdown menu panel so it opens as a clean full-width card.
   ============================================================ */
@media (max-width:767px){
  /* 1) vertically center everything in the pill row (fixes hamburger sitting low) */
  header.elementor-location-header .e-con-inner,
  header.elementor-location-header > .e-con.e-parent{
    align-items:center !important;
  }
  /* 2) hamburger: a proper centered 44x44 tap target */
  header.elementor-location-header .elementor-menu-toggle{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:44px !important; height:44px !important;
    padding:0 !important; margin:0 4px 0 auto !important;
    line-height:0 !important;
  }
  header.elementor-location-header .elementor-menu-toggle svg{
    display:block; width:26px; height:26px; margin:0 auto;
  }

  /* 3) OPEN MENU: clean full-width card anchored just under the pill */
  /* ROOT CAUSE: the pre-existing `max-width:100% !important` (line ~31) caps the
     dropdown to its positioned parent = the ~48px hamburger widget = slim bar.
     Fix: when OPEN, pull it out to the viewport with position:fixed + explicit
     insets, overriding that max-width. Style only the open state so the closed
     collapse (Elementor max-height:0) still works. */
  header.elementor-location-header .elementor-nav-menu--dropdown[aria-hidden="false"]{
    position:fixed !important;
    top:72px !important;
    left:12px !important; right:12px !important;
    width:auto !important;
    max-width:none !important;
    padding:8px !important;
    border-radius:16px !important;
    background:rgba(16,16,16,.98) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.5) !important;
    border:1px solid rgba(255,255,255,.08) !important;
    overflow:auto !important;
  }
  /* readable, tappable items with dividers */
  header.elementor-location-header .elementor-nav-menu--dropdown .elementor-item{
    padding:14px 16px !important;
    font-size:16px !important;
    line-height:1.3 !important;
    border-radius:10px;
  }
  header.elementor-location-header .elementor-nav-menu--dropdown li:not(:last-child) > .elementor-item{
    border-bottom:1px solid rgba(255,255,255,.07);
  }
  /* sub-menu items indented, not full-bleed */
  header.elementor-location-header .elementor-nav-menu--dropdown .sub-menu .elementor-sub-item{
    padding:12px 16px 12px 28px !important; font-size:15px !important;
  }
}

/* MOBILE NAV FIX pt.2: the dropdown <ul> reuses the horizontal menu class,
   so items collapse into one slim flex row. Force vertical stacking. */
@media (max-width:767px){
  header.elementor-location-header .elementor-nav-menu--dropdown .elementor-nav-menu{
    display:block !important;
    flex-direction:column !important;
    width:100% !important;
    height:auto !important;
  }
  header.elementor-location-header .elementor-nav-menu--dropdown .elementor-nav-menu > li{
    display:block !important;
    width:100% !important;
    float:none !important;
  }
  header.elementor-location-header .elementor-nav-menu--dropdown .elementor-item{
    display:block !important;
    width:100% !important;
    text-align:left;
  }
  /* let the panel grow to its content instead of a fixed slim height */
  header.elementor-location-header .elementor-nav-menu--dropdown{
    height:auto !important;
  }
}

/* MOBILE NAV FIX pt.3: on close, aria-hidden flips to true and the open-state
   card styling drops while Elementor still animates the collapse — which briefly
   re-shows the broken 48px slim geometry. Force the closed state to hide outright
   so there is nothing to flash. */
@media (max-width:767px){
  header.elementor-location-header .elementor-nav-menu--dropdown[aria-hidden="true"]{
    display:none !important;
  }
}

/* ============================================================
   SITE STANDARD (mobile): heading letter-spacing.
   Large serif display headings shipped with tight tracking
   (-0.06 to -0.10em) so letters touched on phones. Normalize
   every heading to the homepage standard (-0.04em).
   ============================================================ */
@media (max-width:767px){
  .elementor-heading-title, .site-content h1, .site-content h2, .site-content h3, .entry-content h1, .entry-content h2, .entry-content h3{ letter-spacing:-0.04em !important; }
}

/* DESKTOP-VIEW FIX: between 768–1024px (incl. phones' "Request Desktop Site",
   which renders ~980px) Elementor showed a centered hamburger instead of the
   real menu. Show the horizontal menu + hide the burger from 768px up. */
@media (min-width:768px){
  header.elementor-location-header .elementor-menu-toggle{ display:none !important; }
  header.elementor-location-header .elementor-nav-menu--main{ display:flex !important; }
  header.elementor-location-header .elementor-nav-menu--dropdown{ display:none !important; }
}