/* Only authorized visual changes: original logos, circular motion, English nav. */
.official-logo {
  display: block;
  position: relative;
  width: 190px;
  height: 44px;
  overflow: hidden;
  flex: none;
}
.official-logo img {
  position: absolute;
  width: 254px;
  height: 254px;
  max-width: none;
  left: -32px;
  top: -106px;
}
.official-logo .official-navy {
  display: none;
}
[data-theme="light"] .site-header.scrolled .official-white {
  display: none;
}
[data-theme="light"] .site-header.scrolled .official-navy {
  display: block;
}
.hero-emblem .motion-inner {
  width: calc(100% - 64px);
  aspect-ratio: 1;
  border-radius: 50%;
  isolation: isolate;
}
.motion-viewport {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  overflow: hidden;
  background: #000;
}
[data-theme="light"] .motion-viewport {
  background: #ecebe7;
}
.motion-viewport video,
.motion-viewport img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.motion-viewport [hidden] {
  display: none;
}
/* Keep short labels together; switch to the EXISTING mobile menu before collision. */
[lang="en"] .main-nav a,
[lang="en"] .header-actions {
  white-space: nowrap;
}
[lang="en"] .brand,
[lang="en"] .header-actions {
  flex-shrink: 0;
}
[lang="en"] .main-nav ul {
  gap: clamp(16px, 2vw, 30px);
}
@media (min-width: 1025px) and (max-width: 1220px) {
  [lang="en"] .main-nav {
    display: none;
  }
  [lang="en"] .menu-btn {
    display: inline-flex;
  }
  [lang="en"] .header-cta {
    display: none;
  }
}
/* Arabic labels need more room than the English navigation. */
@media (min-width: 1025px) and (max-width: 1280px) {
  [lang="ar"] .main-nav { display: none; }
  [lang="ar"] .menu-btn { display: inline-flex; }
  [lang="ar"] .header-cta { display: none; }
}
@media (max-width: 480px) {
  .official-logo {
    width: clamp(80px, 28vw, 110px);
    height: 40px;
  }
  .official-logo img {
    width: 133.68%;
    height: auto;
    left: -16.84%;
    top: 50%;
    transform: translateY(-50%);
  }
  .site-header .header-actions {
    gap: 6px;
  }
  .site-header .chip-btn {
    padding-inline: 8px;
    gap: 5px;
  }
  .site-header .menu-btn {
    flex-shrink: 0;
  }
}
