.site-header{
    position:fixed;
    top:10px;
    left:var(--inset-x);
    right:var(--inset-x);
    z-index:9999;
    transition:.35s ease;
}
.header-inner{
    position:relative;
    display:flex;
    justify-content:space-between;
    align-items:center;
    width:100%;
    max-width:100%;
    margin:0 auto;
    padding:2px 8px;
    border-radius:20px;
    background:rgba(255,255,255,.0062);
    border:0 solid rgba(255,255,255,.45);
    box-shadow:none;
    transition:.35s;
}
.header-inner::before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
    z-index:-1;
    pointer-events:none;
}
.brand{position:relative;display:flex;align-items:center}
.brand img{height:34px;width:auto;transition:opacity .3s ease}
.brand::after{
    content:"";
    position:absolute;
    top:50%;left:0;
    transform:translateY(-50%);
    width:35px;height:35px;
    background:url('/assets/img/favicon.png') no-repeat center;
    background-size:contain;
    opacity:0;
    transition:opacity .3s ease;
    pointer-events:none;
}

.site-header.scrolled .header-inner{
    position:relative;
    margin-top:10px;
    max-width:1100px;
    width:calc(100% - 20px);
    padding:2px 2px 4px 12px;
    border-radius:40px;
    background:rgba(255,255,255,.028);
    box-shadow:0 6px 20px rgba(0,0,0,.08);
    gap:14px;
}
.site-header.scrolled .header-inner::before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    backdrop-filter:blur(30px);
    -webkit-backdrop-filter:blur(30px);
    z-index:-1;
    pointer-events:none;
}
[data-theme="dark"] .site-header.scrolled .header-inner{
    background:rgba(18,18,24,.78);
}
.site-header.scrolled .brand img{opacity:0}
.site-header.scrolled .brand{min-width:35px}
.site-header.scrolled .brand img{width:35px}
.site-header.scrolled .brand::after{opacity:1}

@media (min-width:961px){
  .site-header.scrolled .desktop-menu{
      background:transparent;
      border-color:transparent !important;
      box-shadow:none;
      backdrop-filter:none;
      -webkit-backdrop-filter:none;
  }
}

@media (max-width:767px){
    .site-header.scrolled .header-inner{
        margin-top:8px;
        width:auto;
        max-width:48%;
        margin-left:auto;
        margin-right:2px;
        padding:4px 4px 4px 4px;
        gap:10px;
        justify-content:flex-end;
    }
    .site-header.scrolled .nav-wrapper{gap:8px}
}

#menu-toggle{display:none !important}

.nav-wrapper{position:relative;z-index:999;display:flex;align-items:center;gap:12px}

.desktop-menu{
  background:rgba(240,240,240);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border:0px solid rgba(255,255,255,.12);
  border-radius:999px;
  width:max-content;
  margin:auto;
  padding:7px 5px;
  box-shadow:
    0 8px 30px rgba(0,0,0,.06),
    inset 0 1px 0 rgba(255,255,255,.15);
}
.desktop-menu ul{
  margin:0;
  padding:0;
  list-style:none;
  display:flex;
  justify-content:center;
  align-items:center;
}
.desktop-menu li{display:flex;align-items:center}
.desktop-menu li:not(:last-child)::after{
  content:"";
  width:1px;height:8px;
  border-radius:90%;
  background:rgba(255,0,0);
  margin:0 0px;
}
.desktop-menu a{
  color:#1d1d1f;
  text-decoration:none;
  font-size:15px;
  margin:0 2px;
  font-weight:600;
  line-height:1;
  padding:10px 14px;
  border-radius:999px;
  transition:background .25s ease,color .25s ease,box-shadow .25s ease;
}
.desktop-menu a:hover{
  background:rgba(255,255,255,.65);
  color:#0F0F0F;
  box-shadow:0 4px 12px rgba(0,0,0,.06);
}
.desktop-menu .current-menu-item a{
  background:rgba(255,255,255,.75);
  color:#0F0F0F;
  box-shadow:0 4px 12px rgba(0,0,0,.08);
}

.desktop-menu li.nav-cta{margin-left:30px}
.desktop-menu li.nav-cta::before{display:none}
.desktop-menu li.nav-cta a{
  background:linear-gradient(135deg,#e53935,#b71c1c);
  color:#FAFAFA !important;
  box-shadow:
    0 4px 14px rgba(229,57,53,.35),
    inset 0 1px 0 rgba(255,255,255,.15);
  position:relative;
  overflow:hidden;
  animation:ctaPulse 2s ease-in-out infinite;
}
.desktop-menu li.nav-cta a:hover{
  background:linear-gradient(135deg,#ef5350,#c62828);
  color:#FAFAFA;
  box-shadow:
    0 6px 20px rgba(229,57,53,.45),
    inset 0 1px 0 rgba(255,255,255,.15);
  transform:translateY(-1px);
}
.desktop-menu li.nav-cta a::after{
  content:"";
  position:absolute;top:50%;left:50%;
  width:0;height:0;border-radius:50%;
  background:rgba(255,255,255,.4);
  transform:translate(-50%,-50%);
  transition:width .5s ease,height .5s ease,opacity .5s ease;
  opacity:0;pointer-events:none;
}
.desktop-menu li.nav-cta a:active::after{
  width:200px;height:200px;opacity:0;transition:0s;
}
@keyframes ctaPulse{
  0%{box-shadow:0 4px 14px rgba(229,57,53,.35),0 0 0 0 rgba(229,57,53,.5)}
  70%{box-shadow:0 4px 14px rgba(229,57,53,.35),0 0 0 8px rgba(229,57,53,0)}
  100%{box-shadow:0 4px 14px rgba(229,57,53,.35),0 0 0 0 rgba(229,57,53,0)}
}

.hamburger{display:none}

@media (max-width:960px){
  .desktop-menu{
    position:fixed;
    top:80px;
    left:var(--inset-x);
    right:var(--inset-x);
    width:auto;
    opacity:0;visibility:hidden;
    transform:translate3d(0,-16px,0) scale(.98);
    -webkit-transform:translate3d(0,-16px,0) scale(.98);
    contain:paint;isolation:isolate;
    will-change:transform,opacity;
    transition:
      opacity .35s ease,
      transform .35s cubic-bezier(.22,.61,.36,1),
      visibility .35s ease;
    border-radius:32px;
    background:rgba(240,240,240);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(18px);
    border:0px solid rgba(255,255,255,.25);
    box-shadow:
      0 10px 30px rgba(0,0,0,.08),
      0 0 0 1px rgba(255,255,255,.08);
    overflow:hidden;
    padding:18px;
    z-index:1000;
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
  }
  .desktop-menu::before{
    content:"";
    position:absolute;inset:6px;
    border-radius:24px;
    background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,.76));
    border:0px solid rgba(255,255,255,.55);
    pointer-events:none;
  }
  .desktop-menu ul{
    position:relative;z-index:2;
    flex-direction:column;align-items:stretch;
  }
  .desktop-menu li{width:100%}
  .desktop-menu li:not(:last-child)::after{display:none}
  .desktop-menu a{
    display:flex;align-items:center;justify-content:center;text-align:center;
    width:100%;font-size:18px;font-weight:600;
    margin:4px 0;padding:16px 20px;border-radius:99px;
    color:#0F0F0F;transition:.25s ease;
  }
  .desktop-menu a:hover{
    background:linear-gradient(180deg,#2a2a2a,#111);
    color:#FAFAFA;
    box-shadow:0 8px 20px rgba(0,0,0,.15);
  }
  #menu-toggle:checked ~ .desktop-menu{
    opacity:1;visibility:visible;
    transform:translate3d(0,0,0) scale(1);
    -webkit-transform:translate3d(0,0,0) scale(1);
  }
  .hamburger{
    display:flex;align-items:center;justify-content:center;gap:4px;
    height:44px;padding:0 18px;
    border-radius:99px;cursor:pointer;
    background:linear-gradient(180deg,#2b2b2b,#111);
    border:0px solid rgba(255,255,255,.08);
    box-shadow:
      0 8px 20px rgba(0,0,0,.18),
      inset 0 1px 0 rgba(255,255,255,.08);
    z-index:1001;
  }
  .hamburger span{width:8px;height:8px;border-radius:50%;background:#fff}
  #menu-toggle:checked + .hamburger{
    flex-direction:column;gap:3px;
    background:linear-gradient(180deg,#444,#222);
  }
  .desktop-menu li.nav-cta{margin-left:0;margin-top:8px}
  .desktop-menu li.nav-cta a{
    background:linear-gradient(135deg,#e53935,#b71c1c) !important;
    color:#FAFAFA !important;
    animation:ctaPulse 2s ease-in-out infinite;
  }
  .desktop-menu li.nav-cta a:hover{
    background:linear-gradient(135deg,#ef5350,#c62828) !important;
    color:#FAFAFA !important;
  }
}

.theme-toggle{
  display:flex;align-items:center;justify-content:center;
  width:40px;height:40px;flex:none;
  border:0px solid var(--line);border-radius:999px;
  background:var(--surface);
  color:#f5a623;cursor:pointer;
  transition:background .25s ease,color .25s ease,transform .15s ease;
}
.theme-toggle:hover{transform:scale(1.06)}
.theme-toggle:focus-visible{outline:2px solid var(--accent-2);outline-offset:3px}

.theme-toggle .icon-sun{display:none}
.theme-toggle .icon-moon{display:block;color:#303030}
[data-theme="dark"] .theme-toggle .icon-sun{display:block}
[data-theme="dark"] .theme-toggle .icon-moon{display:none}

.desktop-menu{
  border-color:rgba(0,0,0,.08) !important;
  box-shadow:0 8px 30px rgba(15,23,42,.10);
}
[data-theme="dark"] .desktop-menu{
  border-color:rgba(255,255,255,.12) !important;
  box-shadow:0 8px 30px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.15);
}

@media (max-width:960px){
  .theme-toggle{order:-1}
}

[data-theme="dark"] .desktop-menu{
  background:rgba(30,30,36,.85);
}

[data-theme="dark"] .desktop-menu a{
  color:#f0f0f2;
}
[data-theme="dark"] .desktop-menu a:hover{
  background:rgba(255,255,255,.10);
  color:#FAFAFA;
  box-shadow:0 4px 12px rgba(0,0,0,.25);
}
[data-theme="dark"] .desktop-menu .current-menu-item a{
  background:rgba(255,255,255,.14);
  color:#FAFAFA;
  box-shadow:0 4px 12px rgba(0,0,0,.3);
}

[data-theme="dark"] .desktop-menu li:not(:last-child)::after{
  background:rgba(255,80,80,.7);
}

@media (max-width:960px){
  [data-theme="dark"] .desktop-menu{
    background:rgba(24,24,30,.9);
    border:1.5px solid rgba(255,255,255,.15);
  }
  [data-theme="dark"] .desktop-menu::before{
    background:linear-gradient(180deg,rgba(30,30,36,.9),rgba(20,20,26,.85));
    border:1px solid rgba(255,255,255,.10);
  }
  [data-theme="dark"] .desktop-menu a{
    color:#f0f0f2;
  }
  [data-theme="dark"] .desktop-menu a:hover{
    background:linear-gradient(180deg,#3a3a3a,#1a1a1a);
    color:#FAFAFA;
  }
}