/* ============================================================
   NAV.CSS
   Single authoritative mobile-nav / header / burger stylesheet.
   Loaded once from includes/header.php so every page that
   includes the shared header gets the same working mobile nav
   as the homepage, regardless of that page's own legacy CSS.
   Every rule below wins over older per-page nav rules because:
   1) every property is !important, and
   2) this file is linked after all per-page <head> stylesheets.
   Do not add unrelated rules here - nav/header only.
   ============================================================ */

.container-header {
    width: min(var(--container-head),100% - 2rem) !important;
    margin-inline: auto !important;
  }

.site-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: var(--z-nav) !important;
    height: var(--header-h) !important;
    background: rgba(255,255,255,.9) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
    border-bottom: 1px solid transparent !important;
    transition: box-shadow var(--transition),border-color var(--transition),background var(--transition) !important;
  }

.site-header.scrolled {
    box-shadow: 0 4px 24px rgba(26,77,143,.1) !important;
    border-bottom-color: var(--clr-border) !important;
    background: rgba(255,255,255,.98) !important;
  }

.nav-inner {
    display: flex !important;
    align-items: center !important;
    height: var(--header-h) !important;
    gap: 1.5rem !important;
  }

.nav-logo {
    flex-shrink: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: .6rem !important;
  }

.nav-logo img {
    height: 52px !important;
    width: auto !important;
  }

.nav-menu {
    display: flex !important;
    align-items: center !important;
    margin-left: auto !important;
  }

.nav-link {
    font-size: .89rem !important;
    font-weight: 600 !important;
    color: var(--clr-text) !important;
    padding: .5rem .85rem !important;
    border-radius: var(--radius-sm) !important;
    transition: color var(--transition-fast),background var(--transition-fast) !important;
    position: relative !important;
    white-space: nowrap !important;
  }

.nav-link.active,.nav-link:hover {
    color: var(--clr-accent-dk) !important;
    background: rgba(0,180,216,.08) !important;
  }

.nav-item-dropdown {
    position: relative !important;
    padding-bottom: 0 !important;
  }

.nav-dropdown {
    position: absolute !important;
    top: calc(100% - 1px) !important;
    left: 50% !important;
    transform: translateX(-50%) translateY(0) !important;
    background: var(--clr-white) !important;
    border: 1px solid var(--clr-border) !important;
    border-radius: var(--radius-md) !important;
    box-shadow: var(--shadow-lg) !important;
    min-width: 240px !important;
    padding: .6rem !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity var(--transition-fast),transform var(--transition-fast) !important;
    z-index: 10 !important;
  }

.nav-item-dropdown:hover .nav-dropdown {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateX(-50%) translateY(0) !important;
  }

.nav-dropdown-link {
    display: flex !important;
    align-items: center !important;
    gap: .6rem !important;
    padding: .6rem .85rem !important;
    font-size: .84rem !important;
    font-weight: 500 !important;
    color: var(--clr-text) !important;
    border-radius: var(--radius-sm) !important;
    transition: background var(--transition-fast),color var(--transition-fast) !important;
  }

.nav-dropdown-link::before {
    content: '→' !important;
    color: var(--clr-accent) !important;
    font-size: .8rem !important;
    opacity: 0 !important;
    transform: translateX(-6px) !important;
    transition: opacity var(--transition-fast),transform var(--transition-fast) !important;
  }

.nav-dropdown-link:hover {
    background: rgba(0,180,216,.08) !important;
    color: var(--clr-accent-dk) !important;
  }

.nav-dropdown-link:hover::before {
    opacity: 1 !important;
    transform: translateX(0) !important;
  }

.nav-cta {
    margin-left: .8rem !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: .5rem !important;
    padding: .65rem 1rem !important;
    background: var(--clr-primary) !important;
    color: var(--clr-white)!important;
    font-weight: 700 !important;
    font-size: .82rem !important;
    border-radius: var(--radius-pill) !important;
    box-shadow: 0 4px 16px rgba(26,77,143,.3) !important;
    transition: background var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast) !important;
  }

.nav-cta:hover {
    background: var(--clr-accent-dk) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(0,150,199,.4) !important;
    color: var(--clr-white)!important;
  }

.nav-phone {
    display: flex !important;
    align-items: center !important;
    gap: .45rem !important;
    font-size: .85rem !important;
    font-weight: 700 !important;
    color: var(--clr-primary) !important;
    padding: .5rem .85rem !important;
    border: 1.5px solid var(--clr-border) !important;
    border-radius: var(--radius-pill) !important;
    transition: border-color var(--transition-fast),color var(--transition-fast) !important;
  }

.nav-phone:hover {
    border-color: var(--clr-accent) !important;
    color: var(--clr-accent-dk) !important;
  }

.nav-phone svg {
    flex-shrink: 0 !important;
  }

body .nav-burger {
    display: none !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 5px !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: var(--radius-sm) !important;
    background: rgba(0,180,216,.08) !important;
    padding: 8px !important;
    transition: background var(--transition-fast) !important;
    margin-left: auto !important;
  }

.nav-burger:hover {
    background: rgba(0,180,216,.16) !important;
  }

.nav-burger span {
    display: block !important;
    height: 2px !important;
    background: var(--clr-primary) !important;
    border-radius: 2px !important;
    transition: transform var(--transition-fast),opacity var(--transition-fast),width var(--transition-fast) !important;
    transform-origin: left center !important;
  }

.nav-burger.open span:first-child {
    transform: rotate(45deg) translate(2px,-1px) !important;
  }

.nav-burger.open span:nth-child(2) {
    opacity: 0 !important;
    transform: scaleX(0) !important;
  }

.nav-burger.open span:nth-child(3) {
    transform: rotate(-45deg) translate(2px,1px) !important;
  }

@media (min-width:992px) and (max-width:1133px){
  
  .nav-phone {
    display: none !important;
  }

}

@media (max-width:991px){
  
  .nav-menu {
    display: none !important;
  }
  body .nav-burger {
    display: flex !important;
  }

}

@media print{
  
  .chatbot-launcher,.page-loader,.scroll-top,.site-header {
    display: none!important;
  }

}

@media (min-width:991px) and (max-width:1200px){
  
  .d-none-m-1221 {
    display: none!important;
  }

}

.btn-call-ring-1 {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    z-index: 1 !important;
  }

.btn-call-ring-1 i {
    z-index: 2 !important;
    position: relative !important;
    animation: 2s infinite phonePulse !important;
  }

.btn-call-text-1 {
    display: flex !important;
    flex-direction: column !important;
  }

.btn-call-text-1 small {
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    font-size: .65rem !important;
    opacity: .8 !important;
    font-weight: 500 !important;
  }

.topbar-right-1 {
    display: inline-flex !important;
  }

.topbar-right-1:hover {
    transition: transform .25s !important;
    transform: translateY(-3px) !important;
  }

.btn-call-ring-1::after,.btn-call-ring-1::before {
    content: "" !important;
    position: absolute !important;
    width: 100% !important;
    height: 100% !important;
    border-radius: 50% !important;
    border: 2px solid rgba(255,255,255,.6) !important;
    top: 0 !important;
    left: 0 !important;
    animation: 2s infinite ringWave !important;
  }

.btn-call-ring-1::after {
    animation-delay: 1s !important;
  }

.header-actions-1 {
    display: flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
    gap: 12px !important;
  }

.btn-call-1 {
    background: linear-gradient(135deg,#00b4d8,#1a4d8f) !important;
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    color: #fff!important;
    gap: 10px !important;
    padding: 9px 16px 9px 10px !important;
    border-radius: 50px !important;
    transition: var(--trans) !important;
    text-decoration: none !important;
  }

.btn-call-ring-1 {
    position: relative !important;
    width: 24px !important;
    height: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: .8rem !important;
    flex-shrink: 0 !important;
    background: rgba(255,255,255,.2) !important;
    border-radius: 50% !important;
  }

.btn-call-text-1 {
    display: flex !important;
    flex-direction: column !important;
    line-height: 1.1 !important;
  }

.btn-call-text-1 strong {
    font-size: .82rem !important;
  }

@media(max-width:1180px){
  
  body .nav-burger {
    display: flex !important;
  }
  .nav-menu {
    display: none !important;
  }

}

@media(max-width:1510px){
  
  .btn-call-1 {
    display: none !important;
  }

}

@media(max-width:1370px){
  
  .nav-cta {
    display: none !important;
  }

}

@media(max-width:1180px){
  
  .btn-call-1 {
    display: block !important;
  }
  .nav-item-dropdown {
    border-bottom: 1px solid var(--clr-border) !important;
  }

}

body .mobile-nav-overlay {
    display: none !important;
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0,0,0,.45) !important;
    z-index: 1099 !important;
    backdrop-filter: blur(2px) !important;
    -webkit-backdrop-filter: blur(2px) !important;
  }

.mobile-nav-overlay.open {
    display: block !important;
  }

body .mobile-nav {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: min(320px,85vw) !important;
    height: 100dvh !important;
    background: #fff !important;
    z-index: 1100 !important;
    display: flex !important;
    flex-direction: column !important;
    transform: translateX(-100%) !important;
    transition: transform .35s cubic-bezier(.4, 0, .2, 1) !important;
    overflow: hidden !important;
    box-shadow: 4px 0 24px rgba(0,0,0,.12) !important;
  }

.mobile-nav.open {
    transform: translateX(0) !important;
  }

.mobile-nav:not(.open) {
    visibility: hidden !important;
    pointer-events: none !important;
  }

.mobile-nav.open {
    visibility: visible !important;
    pointer-events: auto !important;
  }

body .mobile-nav-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 1rem 1.25rem !important;
    border-bottom: 1px solid #f0f0f0 !important;
    flex-shrink: 0 !important;
  }

.mobile-nav-logo img {
    height: 40px !important;
    width: auto !important;
    display: block !important;
  }

body .mobile-nav-close {
    background: 0 0 !important;
    border: none !important;
    cursor: pointer !important;
    padding: 6px !important;
    color: #333 !important;
    border-radius: 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background .2s !important;
  }

.mobile-nav-close:hover {
    background: #f5f5f5 !important;
  }

body .mobile-nav-list {
    list-style: none !important;
    margin: 0 !important;
    padding: .5rem 0 !important;
    overflow-y: auto !important;
    flex: 1 !important;
  }

body .mobile-nav-item {
    border-bottom: 1px solid #f3f3f3 !important;
  }

.mobile-nav-item:last-child {
    border-bottom: none !important;
  }

body .mobile-nav-row {
    display: flex !important;
    align-items: center !important;
  }

.mobile-nav-row .mobile-nav-link {
    flex: 1 !important;
  }

body .mobile-nav-link {
    display: block !important;
    padding: .875rem 1.25rem !important;
    font-size: 1rem !important;
    font-weight: 500 !important;
    color: #1a1a2e !important;
    text-decoration: none !important;
    transition: color .2s,background .2s !important;
  }

.mobile-nav-link:focus,.mobile-nav-link:hover {
    color: var(--clr-primary,#1a5fa8) !important;
    background: #f7f9ff !important;
  }

.mobile-sub-toggle {
    background: 0 0 !important;
    border: none !important;
    cursor: pointer !important;
    padding: .875rem 1rem !important;
    color: #555 !important;
    display: flex !important;
    align-items: center !important;
    transition: color .2s,transform .3s !important;
    flex-shrink: 0 !important;
  }

.mobile-sub-toggle svg {
    transition: transform .3s !important;
  }

.mobile-sub-toggle.open svg {
    transform: rotate(180deg) !important;
  }

.mobile-sub-toggle:hover {
    color: var(--clr-primary,#1a5fa8) !important;
  }

.mobile-sub-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
    display: none !important;
    overflow: hidden !important;
  }

.mobile-sub-list.open {
    display: block !important;
  }

.mobile-sub-link {
    display: block !important;
    padding: .65rem 1.25rem .65rem 2rem !important;
    font-size: .875rem !important;
    font-weight: 400 !important;
    color: #363232 !important;
    text-decoration: none !important;
    border-bottom: 1px solid #eef0f5 !important;
    transition: color .2s,background .2s !important;
  }

.mobile-sub-link:hover {
    color: var(--clr-primary,#1a5fa8) !important;
    background: #edf2ff !important;
  }

.mobile-sub-list li:last-child .mobile-sub-link {
    border-bottom: none !important;
  }

body .mobile-nav-footer {
    padding: 1rem 1.25rem !important;
    border-top: 1px solid #f0f0f0 !important;
    flex-shrink: 0 !important;
  }

.mobile-nav-cta {
    display: block !important;
    text-align: center !important;
    padding: .875rem !important;
    background: var(--clr-primary,#1a5fa8) !important;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: .95rem !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    transition: background .2s,transform .15s !important;
  }

.mobile-nav-footer .mobile-nav-cta:hover {
    background: var(--clr-accent-dk,#154e8a) !important;
    transform: translateY(-1px) !important;
  }

@media (min-width:1181px){
  
  .mobile-nav,.mobile-nav-overlay {
    display: none!important;
  }
  .nav-burger {
    display: none!important;
  }
  .nav-menu {
    display: flex!important;
  }

}

