/* =============================================
   SHAWARMA CLASSIC — NAV
   #FFFFFF · #E94E1B · #EF7D00 ONLY
   ============================================= */

#navbar {
  position:fixed; top:0; left:0; right:0; z-index:500;
  height:var(--nav-h);
  background:var(--brand);
  border-bottom:2px solid var(--brand-dark);
  display:flex; align-items:center;
  padding-inline:var(--gutter);
  transition:box-shadow var(--dur-med);
}
#navbar.scrolled { box-shadow:0 2px 24px rgba(233,78,27,0.40); }

.nav-inner {
  width:100%; max-width:var(--max-w);
  margin-inline:auto;
  display:flex; align-items:center;
  justify-content:space-between; gap:24px;
}

/* Logo */
.nav-logo     { display:flex; align-items:center; flex-shrink:0; }
.nav-logo img { height:42px; width:auto; object-fit:contain; transition:opacity var(--dur-fast); filter:brightness(0) invert(1); }
.nav-logo:hover img { opacity:0.88; }

/* Fallback text logo */
.nav-logo-fallback { display:flex; align-items:center; gap:8px; }
.nav-logo-icon { background:rgba(255,255,255,0.20); color:#fff; padding:6px 10px; border-radius:6px; font-weight:900; font-size:13px; }
.nav-logo-name { font-weight:900; font-size:15px; color:#fff; }

/* Links */
.nav-links { display:flex; align-items:center; gap:2px; }
.nav-links a {
  font-size:13px; font-weight:600;
  color:rgba(255,255,255,0.82);
  padding:7px 14px; border-radius:var(--r-sm);
  transition:color var(--dur-fast), background var(--dur-fast);
}
.nav-links a:hover                { color:#fff; background:rgba(255,255,255,0.14); }
.nav-links a[aria-current="page"] { color:#fff; background:rgba(255,255,255,0.18); }

/* Actions */
.nav-actions { display:flex; align-items:center; gap:12px; flex-shrink:0; }

.nav-phone {
  font-size:13px; font-weight:700;
  color:#fff; letter-spacing:0.5px; direction:ltr;
  transition:opacity var(--dur-fast);
}
.nav-phone:hover { opacity:0.80; }

/* Language toggle */
.lang-toggle {
  display:flex; align-items:center; gap:2px;
  background:rgba(255,255,255,0.15);
  border:1px solid rgba(255,255,255,0.28);
  border-radius:var(--r-full); padding:3px;
}
.lang-btn {
  font-size:11px; font-weight:700; letter-spacing:0.5px;
  padding:4px 11px; border-radius:var(--r-full);
  color:rgba(255,255,255,0.78); transition:all var(--dur-fast);
}
.lang-btn.active      { background:#fff; color:var(--brand); }
.lang-btn:hover:not(.active) { color:#fff; }

/* CTA */
.nav-cta {
  display:inline-flex; align-items:center; gap:6px;
  background:#fff; color:var(--brand);
  padding:9px 20px; border-radius:var(--r-sm);
  font-size:13px; font-weight:800;
  transition:all var(--dur-fast); white-space:nowrap;
}
.nav-cta:hover { background:var(--accent); color:#fff; transform:translateY(-1px); box-shadow:var(--shadow-accent); }

/* Hamburger */
.nav-hamburger {
  display:none; flex-direction:column;
  justify-content:center; gap:5px;
  width:36px; height:36px; padding:6px;
  border-radius:var(--r-sm); transition:background var(--dur-fast);
}
.nav-hamburger:hover { background:rgba(255,255,255,0.15); }
.nav-hamburger span {
  display:block; height:2px; background:#fff;
  border-radius:2px; transition:all var(--dur-med) var(--ease);
}
.nav-hamburger.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.nav-hamburger.open span:nth-child(2) { opacity:0; transform:scaleX(0); }
.nav-hamburger.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

/* Mobile menu */
.mobile-menu {
  position:fixed; inset:0; z-index:490;
  background:var(--brand);
  display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:6px;
  opacity:0; pointer-events:none;
  transform:translateY(-100%);
  transition:opacity var(--dur-med) var(--ease), transform var(--dur-med) var(--ease);
}
.mobile-menu.open { opacity:1; pointer-events:all; transform:translateY(0); }
.mobile-menu a {
  font-size:clamp(22px,5vw,34px); font-weight:800;
  color:rgba(255,255,255,0.82); padding:12px 32px;
  border-radius:var(--r-md); transition:all var(--dur-fast);
}
.mobile-menu a:hover { color:#fff; background:rgba(255,255,255,0.14); }
.mobile-menu .mobile-cta {
  margin-top:14px; background:#fff; color:var(--brand);
  font-size:18px; border-radius:var(--r-sm);
}

@media (max-width:960px) { .nav-links { display:none; } .nav-hamburger { display:flex; } .nav-phone { display:none; } }
@media (max-width:480px) { .nav-cta { padding:9px 13px; font-size:12px; } }