/*
 * SORKISTx Block — nav-sticky
 */

:root {
  --nav-height: 72px;
  --nav-bg:     rgba(255,255,255,0.95);
  --nav-bg-transparent: transparent;
  --nav-text:   var(--color-text);
  --nav-text-on-transparent: #fff;
}

/* ─── Base nav ───────────────────────────────────────────────────────────────── */

.site-nav {
  position:    fixed;
  inset-block-start: 0;
  inset-inline: 0;
  z-index:     var(--z-nav);
  height:      var(--nav-height);
  background:  var(--nav-bg);
  border-block-end: 1px solid var(--color-border);
  transition:  background 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

/* Transparent mode (over hero) */
.site-nav.is-transparent {
  background:  var(--nav-bg-transparent);
  border-color: transparent;
  color:       var(--nav-text-on-transparent);
}

.site-nav.is-transparent .nav-logo__text,
.site-nav.is-transparent .nav-list a,
.site-nav.is-transparent .nav-dark-toggle,
.site-nav.is-transparent .nav-hamburger {
  color: #fff;
}

/* After scroll: always solid */
.site-nav.is-transparent.is-scrolled {
  background:  var(--nav-bg);
  border-color: var(--color-border);
  box-shadow:  0 2px 20px rgba(0,0,0,0.06);
}

.site-nav.is-transparent.is-scrolled .nav-list a,
.site-nav.is-transparent.is-scrolled .nav-logo__text,
.site-nav.is-transparent.is-scrolled .nav-dark-toggle,
.site-nav.is-transparent.is-scrolled .nav-hamburger {
  color: var(--color-text);
}

/* Dark mode */
[data-theme="dark"] .site-nav {
  --nav-bg: rgba(15,23,42,0.97);
}

/* ─── Inner layout ───────────────────────────────────────────────────────────── */

.nav-inner {
  max-width:     var(--container-max);
  margin-inline: auto;
  padding-inline:var(--container-pad);
  height:        100%;
  display:       flex;
  align-items:   center;
  gap:           var(--space-6);
}

/* ─── Logo ───────────────────────────────────────────────────────────────────── */

.nav-logo {
  flex-shrink:     0;
  text-decoration: none;
  display:         flex;
  align-items:     center;
}

.nav-logo img {
  height:    40px;
  width:     auto;
  object-fit:contain;
}

.nav-logo__text {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size:   var(--font-size-xl);
  color:       var(--color-text);
  letter-spacing: -0.02em;
}

/* ─── Desktop menu ───────────────────────────────────────────────────────────── */

.nav-menu {
  flex:        1;
  display:     flex;
  align-items: center;
}

.nav-list {
  display:     flex;
  gap:         var(--space-1);
  align-items: center;
  list-style:  none;
  margin:      0;
  padding:     0;
}

.nav-list a {
  display:         block;
  padding-block:   var(--space-2);
  padding-inline:  var(--space-3);
  font-weight:     500;
  font-size:       var(--font-size-sm);
  color:           var(--color-text);
  text-decoration: none;
  border-radius:   var(--radius-sm);
  transition:      var(--transition-fast);
  white-space:     nowrap;
}

.nav-list a:hover,
.nav-list a.is-active,
.nav-list li.current-menu-item > a {
  color:      var(--color-primary);
  background: rgba(37,99,235,0.06);
}

/* Submenu */
.nav-list .sub-menu {
  position:      absolute;
  inset-block-start: calc(100% + 8px);
  background:    var(--color-bg);
  border:        1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow:    var(--shadow-md);
  min-width:     200px;
  padding-block: var(--space-2);
  list-style:    none;
  margin:        0;
  padding-inline:0;
  opacity:       0;
  transform:     translateY(8px);
  pointer-events:none;
  transition:    var(--transition-smooth);
  z-index:       var(--z-above);
}

.nav-list li:hover > .sub-menu {
  opacity:       1;
  transform:     translateY(0);
  pointer-events:auto;
}

.nav-list .sub-menu a {
  border-radius: 0;
  padding-inline:var(--space-4);
}

.nav-list li { position: relative; }

/* ─── Right-side actions ─────────────────────────────────────────────────────── */

.nav-actions {
  display:     flex;
  align-items: center;
  gap:         var(--space-2);
  margin-inline-start: auto;
  flex-shrink: 0;
}

/* ─── Language Switcher ──────────────────────────────────────────────────────── */

.nav-lang {
  display:     flex;
  gap:         2px;
  align-items: center;
  background:  var(--color-bg-alt);
  border:      1px solid var(--color-border);
  border-radius: var(--radius-full);
  padding:     2px;
}

.nav-lang__btn {
  padding-block:  0.25rem;
  padding-inline: 0.6rem;
  border-radius:  var(--radius-full);
  font-size:      var(--font-size-xs);
  font-weight:    600;
  color:          var(--color-text-muted);
  background:     none;
  border:         none;
  cursor:         pointer;
  transition:     var(--transition-fast);
  line-height:    1;
}

.nav-lang__btn.is-active {
  background: var(--color-primary);
  color:      #fff;
}

/* ─── Dark Toggle ────────────────────────────────────────────────────────────── */

.nav-dark-toggle {
  width:           36px;
  height:          36px;
  border-radius:   var(--radius-full);
  display:         flex;
  align-items:     center;
  justify-content: center;
  color:           var(--color-text-muted);
  background:      none;
  border:          none;
  cursor:          pointer;
  transition:      var(--transition-fast);
}

.nav-dark-toggle:hover {
  background: var(--color-bg-alt);
  color:      var(--color-text);
}

.nav-dark-toggle .icon-moon { display: none; }

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

/* ─── Hamburger ──────────────────────────────────────────────────────────────── */

.nav-hamburger {
  display:         none;
  flex-direction:  column;
  justify-content: center;
  gap:             5px;
  width:           40px;
  height:          40px;
  border-radius:   var(--radius-sm);
  padding-inline:  var(--space-2);
  cursor:          pointer;
  background:      none;
  border:          none;
  color:           var(--color-text);
}

.hamburger-line {
  display:       block;
  width:         100%;
  height:        2px;
  background:    currentColor;
  border-radius: 2px;
  transition:    var(--transition-smooth);
  transform-origin: center;
}

.nav-hamburger[aria-expanded="true"] .hamburger-line:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
.nav-hamburger[aria-expanded="true"] .hamburger-line:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}
.nav-hamburger[aria-expanded="true"] .hamburger-line:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* ─── Mobile Drawer ──────────────────────────────────────────────────────────── */

.mobile-drawer {
  position:   fixed;
  inset-block:0;
  inset-inline-end: 0;
  width:      min(360px, 90vw);
  background: var(--color-bg);
  box-shadow: var(--shadow-lg);
  z-index:    calc(var(--z-nav) + 1);
  transform:  translateX(110%);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-block-start: var(--nav-height);
}

[dir="rtl"] .mobile-drawer {
  inset-inline-end: auto;
  inset-inline-start: 0;
  transform: translateX(-110%);
}

.mobile-drawer.is-open {
  transform: translateX(0);
}

[dir="rtl"] .mobile-drawer.is-open {
  transform: translateX(0);
}

.mobile-drawer__inner {
  padding: var(--space-6);
}

.mobile-nav-list {
  display:        flex;
  flex-direction: column;
  gap:            2px;
  list-style:     none;
  margin:         0;
  padding:        0;
}

.mobile-nav-list a {
  display:         block;
  padding-block:   var(--space-3);
  padding-inline:  var(--space-3);
  font-weight:     500;
  color:           var(--color-text);
  text-decoration: none;
  border-radius:   var(--radius-sm);
  font-size:       var(--font-size-lg);
  transition:      var(--transition-fast);
}

.mobile-nav-list a:hover { background: var(--color-bg-alt); color: var(--color-primary); }

.mobile-nav-list .sub-menu { padding-inline-start: var(--space-4); margin-block-start: 2px; }
.mobile-nav-list .sub-menu a { font-size: var(--font-size-base); }

.mobile-lang { display: flex; gap: var(--space-2); flex-wrap: wrap; }

/* Backdrop */
.mobile-backdrop {
  position:   fixed;
  inset:      0;
  background: rgba(0,0,0,0.4);
  z-index:    var(--z-nav);
  opacity:    0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

body.menu-open .mobile-backdrop {
  opacity:        1;
  pointer-events: auto;
}

body.menu-open {
  overflow: hidden;
}

/* ─── Responsive: show hamburger on mobile ───────────────────────────────────── */

@media (max-width: 768px) {
  .nav-hamburger { display: flex; }
  .nav-menu      { display: none; }
  .nav-lang      { display: none; }
  .nav-cta       { display: none; }
}

/* ─── Push content down to account for fixed nav ────────────────────────────── */

body:not(.has-hero) main,
body:not(.has-hero) > *:not(.site-nav):first-child {
  margin-block-start: var(--nav-height);
}