/* PC-EXPERT header menus v94: desktop services dropdown + mobile viewport-safe menu. */

.mobile-nav-backdrop { display:none; }

@media (min-width:1025px) {
  .site-header .nav-services-menu {
    top:calc(100% + 12px);
    left:-20px;
    width:420px;
    max-height:none;
    padding:10px;
    grid-template-columns:1fr;
    gap:0;
    border:1px solid #d8e4f0;
    border-radius:16px;
    background:rgba(255,255,255,.99);
    box-shadow:0 20px 50px rgba(11,42,77,.14),0 3px 10px rgba(11,42,77,.06);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
  }

  .site-header .nav-services-menu::before {
    content:"";
    position:absolute;
    top:-6px;
    left:38px;
    width:11px;
    height:11px;
    border-top:1px solid #d8e4f0;
    border-left:1px solid #d8e4f0;
    background:#fff;
    transform:rotate(45deg);
  }

  .site-header .nav-services-menu-head {
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:16px;
    padding:6px 8px 10px;
    border-bottom:1px solid #e6edf5;
  }

  .site-header .nav-services-menu-head strong {
    color:#102844;
    font-size:14px;
    font-weight:700;
  }

  .site-header .nav-services-menu-head span {
    color:#75869a;
    font-size:12px;
    font-weight:500;
  }

  .site-header .nav-services-grid {
    position:relative;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0 16px;
    padding:7px 2px 8px;
  }

  .site-header .nav-services-grid::after {
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    left:50%;
    width:1px;
    background:#edf2f7;
  }

  .site-header .nav .nav-services-grid a {
    position:relative;
    z-index:1;
    min-height:39px;
    padding:7px 9px;
    border:0;
    border-radius:8px;
    color:#2a3c53;
    background:transparent;
    font-size:13.5px;
    font-weight:560;
    line-height:1.25;
    transition:color .15s ease,background .15s ease;
  }

  .site-header .nav .nav-services-grid a:hover,
  .site-header .nav .nav-services-grid a:focus-visible {
    color:#0d5fc7;
    background:#f2f7fd;
    outline:none;
  }

  .site-header .nav .nav-services-menu .nav-all-services {
    min-height:42px;
    margin:0;
    padding:8px 13px;
    justify-content:center;
    border:0;
    border-top:1px solid #e2eaf3;
    border-radius:0 0 10px 10px;
    color:#0d5fc7;
    background:#f6f9fd;
    font-size:13.5px;
    font-weight:650;
  }

  .site-header .nav .nav-services-menu .nav-all-services::after {
    content:"→";
    margin-left:8px;
    transition:transform .16s ease;
  }

  .site-header .nav .nav-services-menu .nav-all-services:hover::after { transform:translateX(3px); }
}

@media (max-width:1024px) {
  html.mobile-nav-open { overflow:hidden; }
  html.mobile-nav-open::before { display:none !important; }

  .mobile-nav-backdrop {
    display:none;
    position:fixed;
    inset:0;
    z-index:80;
    padding:0;
    border:0;
    background:rgba(7,25,48,.3);
    backdrop-filter:blur(2px);
    -webkit-backdrop-filter:blur(2px);
  }

  html.mobile-nav-open .mobile-nav-backdrop { display:block; }
  html.mobile-nav-open .service-notice { z-index:95; }

  .site-header.menu-open {
    position:fixed;
    top:34px !important;
    right:0;
    left:0;
    width:100%;
    z-index:90;
  }

  .site-header.menu-open.notice-hidden { top:0 !important; }

  .site-header.menu-open .nav {
    position:fixed;
    top:120px;
    right:12px;
    left:12px;
    width:auto;
    max-height:calc(100dvh - 132px);
  }

  .site-header.menu-open.notice-hidden .nav {
    top:86px;
    max-height:calc(100dvh - 98px);
  }

  .site-header .nav-services-menu-head { display:none; }
  .site-header .nav-services-grid { display:grid; grid-template-columns:1fr; }
}

@media (max-width:420px) {
  .site-header.menu-open .nav { right:10px; left:10px; }
}