/* PC-EXPERT header navigation v92: desktop simplification + mobile panel. */

.site-header > .brand .brand-logo {
  width:325px;
  height:62px;
}

.site-header #primary-navigation > a[href^="/blog"] {
  display:none !important;
}

@media (max-width:1180px) {
  .site-header > .brand .brand-logo {
    width:290px;
    height:58px;
  }
}

@media (min-width:1025px) {
  .site-header .nav {
    gap:12px;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
  }

  .site-header .nav > a,
  .site-header .nav-services-toggle {
    position:relative;
    min-height:40px;
    padding:10px 5px;
    border-radius:0;
    background:transparent;
    color:#12213a;
    font-size:15.5px;
    font-weight:550;
    letter-spacing:0;
  }

  .site-header .nav > a:hover,
  .site-header .nav-services-toggle:hover,
  .site-header .nav-services.open .nav-services-toggle {
    color:#1264cf;
    background:transparent;
  }

  .site-header .nav-services-toggle { gap:7px; }

  .site-header .nav-services-toggle::after {
    content:"";
    width:6px;
    height:6px;
    margin-top:-3px;
    border-right:1.5px solid currentColor;
    border-bottom:1.5px solid currentColor;
    transform:rotate(45deg);
    transition:transform .18s ease, margin-top .18s ease;
  }

  .site-header .nav-services.open .nav-services-toggle::after {
    margin-top:3px;
    transform:rotate(225deg);
  }

  .site-header .header-actions {
    gap:0;
    padding-left:22px;
    border-left:1px solid #e2e9f2;
  }

  .site-header .phone {
    min-height:42px;
    padding:0 15px;
    border-color:#0b3769;
    color:#fff;
    background:#0b3769;
    box-shadow:0 7px 18px rgba(11,55,105,.16);
    font-size:15px;
    font-weight:700;
  }

  .site-header .phone svg { color:#fff; }

  .site-header .phone:hover {
    border-color:#12579f;
    color:#fff;
    background:#12579f;
    box-shadow:0 9px 22px rgba(11,55,105,.2);
  }
}

@media (max-width:1024px) {
  html.mobile-nav-open,
  html.mobile-nav-open body { overflow:hidden; }

  html.mobile-nav-open::before {
    content:"";
    position:fixed;
    inset:0;
    z-index:80;
    background:rgba(7,25,48,.28);
    backdrop-filter:blur(2px);
    -webkit-backdrop-filter:blur(2px);
  }

  .site-header {
    z-index:90;
    isolation:isolate;
    justify-content:center;
    padding-inline:18px;
  }

  .site-header > .brand {
    position:absolute;
    left:50%;
    transform:translateX(-50%);
  }

  .site-header > .brand .brand-logo {
    width:250px;
    max-width:58vw;
  }

  .site-header .menu-button {
    display:block;
    position:absolute;
    z-index:3;
    left:12px;
    width:44px;
    height:44px;
    margin:0;
    padding:7px 5px;
    border:1px solid #c9daed;
    border-radius:12px;
    cursor:pointer;
    touch-action:manipulation;
    background:#f7faff;
    box-shadow:0 6px 16px rgba(8,29,58,.08);
  }

  .site-header .mobile-call {
    display:flex;
    align-items:center;
    justify-content:center;
    position:absolute;
    right:12px;
    width:44px;
    height:44px;
    padding:0;
    border:1px solid #c9daed;
    border-radius:12px;
    color:#1264cf;
    background:#f7faff;
    box-shadow:0 6px 16px rgba(8,29,58,.08);
  }

  .site-header .mobile-call svg {
    width:17px;
    height:17px;
    flex:none;
    color:#1264cf;
    fill:currentColor;
  }

  .site-header .mobile-call span { display:none; }

  .site-header .menu-button span {
    width:21px;
    height:2px;
    margin:4px auto;
    border-radius:2px;
    background:#081d3a;
    transition:transform .2s ease, opacity .16s ease;
    transform-origin:center;
  }

  .site-header .menu-button[aria-expanded="true"] span:nth-child(1) {
    transform:translateY(6px) rotate(45deg);
  }

  .site-header .menu-button[aria-expanded="true"] span:nth-child(2) { opacity:0; }

  .site-header .menu-button[aria-expanded="true"] span:nth-child(3) {
    transform:translateY(-6px) rotate(-45deg);
  }

  .site-header .nav {
    display:none;
    position:absolute;
    z-index:2;
    top:calc(100% + 8px);
    right:12px;
    left:12px;
    width:auto;
    max-height:calc(100vh - 132px);
    max-height:calc(100dvh - 132px);
    margin:0;
    padding:8px 16px 12px;
    gap:0;
    transform:none;
    flex-direction:column;
    align-items:stretch;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    border:1px solid #d9e4f0;
    border-radius:18px;
    background:rgba(255,255,255,.98);
    box-shadow:0 22px 60px rgba(7,35,68,.22), 0 4px 14px rgba(7,35,68,.08);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
  }

  .site-header .nav.open { display:flex; }

  .site-header .nav > a,
  .site-header .nav-services-toggle {
    width:100%;
    min-height:52px;
    padding:0 6px;
    display:flex;
    align-items:center;
    border:0;
    border-bottom:1px solid #e8eef5;
    border-radius:0;
    color:#12213a;
    background:transparent;
    font-size:16px;
    font-weight:550;
  }

  .site-header .nav > a:last-child { border-bottom:0; }

  .site-header .nav > a:active,
  .site-header .nav-services-toggle:active {
    color:#1264cf;
    background:transparent;
  }

  .site-header .nav-services { width:100%; }
  .site-header .nav-services-toggle { justify-content:space-between; }

  .site-header .nav-services-toggle::after {
    content:"";
    width:7px;
    height:7px;
    margin-top:-4px;
    margin-right:3px;
    border-right:1.5px solid #67809e;
    border-bottom:1.5px solid #67809e;
    transform:rotate(45deg);
    transition:transform .18s ease, margin-top .18s ease;
  }

  .site-header .nav-services.open .nav-services-toggle::after {
    margin-top:4px;
    transform:rotate(225deg);
  }

  .site-header .nav-services-menu {
    position:static;
    width:100%;
    max-height:none;
    overflow:visible;
    margin:4px 0 8px;
    padding:7px 10px;
    border:0;
    border-radius:12px;
    background:#f3f7fc;
    box-shadow:inset 0 0 0 1px #e2ebf5;
    backdrop-filter:none;
  }

  .site-header .nav .nav-services-menu a {
    min-height:43px;
    padding:0 8px;
    display:flex;
    align-items:center;
    border:0;
    border-bottom:1px solid #e2eaf3;
    border-radius:0;
    color:#27415f;
    background:transparent;
    font-size:14.5px;
    font-weight:500;
  }

  .site-header .nav .nav-services-menu a:last-child { border-bottom:0; }
  .site-header .nav .nav-services-menu .nav-all-services { color:#1264cf; font-weight:650; }
}

@media (max-width:420px) {
  .site-header { padding-inline:12px; }
  .site-header .nav { right:10px; left:10px; padding-inline:14px; }
  .site-header > .brand .brand-logo { max-width:55vw; }
}
