:root { --global-nav-h: 82px; }

.hero__nav,
.talk-nav,
.rtc-nav,
.projects-nav,
#mobile-menu { display: none !important; }

.global-nav {
  position: fixed;
  inset: 0 0 auto;
  z-index: 1002;
  height: var(--global-nav-h);
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 32px;
  padding: 0 clamp(22px, 4vw, 68px);
  color: #f6f6f2;
  background: linear-gradient(180deg, rgba(5, 6, 9, .88), rgba(5, 6, 9, .5));
  border-bottom: 1px solid rgba(255,255,255,.1);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  transition: opacity .45s ease, transform .45s ease, background .3s ease;
}

body.is-intro-active .global-nav { opacity: 0; transform: translateY(-100%); pointer-events: none; }

.global-nav__brand { display: inline-flex; align-items: center; gap: 13px; color: inherit; text-decoration: none; }
.global-nav__monogram { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.36); border-radius: 50%; font: 500 11px/1 Arial, sans-serif; letter-spacing: .08em; }
.global-nav__name { font: 600 12px/1 Arial, sans-serif; letter-spacing: .2em; text-transform: uppercase; white-space: nowrap; }
.global-nav__links { justify-self: center; display: flex; align-items: center; gap: clamp(18px, 2.1vw, 34px); }
.global-nav__links a { position: relative; color: rgba(255,255,255,.63); text-decoration: none; font: 600 10px/1 Arial, sans-serif; letter-spacing: .15em; text-transform: uppercase; transition: color .25s ease; }
.global-nav__links a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -10px; height: 1px; background: #c9c6ff; transition: right .35s cubic-bezier(.2,.8,.2,1); }
.global-nav__links a:hover, .global-nav__links a.is-active { color: #fff; }
.global-nav__links a:hover::after, .global-nav__links a.is-active::after { right: 0; }
.global-nav__cta { color: #0a0b0e; background: #f2f2ed; padding: 14px 18px; text-decoration: none; font: 700 10px/1 Arial, sans-serif; letter-spacing: .14em; text-transform: uppercase; }
.global-menu-toggle { display: none; width: 48px; height: 48px; padding: 0; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; background: transparent; color: #fff; cursor: pointer; }
.global-menu-toggle span { display: block; width: 18px; height: 1px; margin: 5px auto; background: currentColor; transition: transform .3s ease; }

.global-mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 1001;
  display: grid;
  align-content: center;
  padding: calc(var(--global-nav-h) + 40px) clamp(28px, 8vw, 70px) 44px;
  color: #f8f8f4;
  background: radial-gradient(circle at 80% 15%, rgba(131,126,255,.18), transparent 30%), #07080b;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-18px);
  transition: opacity .35s ease, visibility .35s, transform .45s cubic-bezier(.16,1,.3,1);
}
.global-mobile-menu::before { content: ""; position: absolute; inset: 0; opacity: .28; pointer-events: none; background-image: linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px); background-size: 72px 72px; }
.global-mobile-menu.is-open { opacity: 1; visibility: visible; pointer-events: auto; transform: none; }
.global-mobile-menu__close { position: absolute; top: calc(17px + env(safe-area-inset-top)); right: 22px; z-index: 2; width: 48px; height: 48px; border: 1px solid rgba(255,255,255,.28); border-radius: 50%; background: rgba(0,0,0,.28); color: #fff; font: 300 28px/1 Arial, sans-serif; cursor: pointer; }
.global-mobile-menu__eyebrow { position: relative; margin: 0 0 28px; color: rgba(255,255,255,.48); font: 600 10px/1.4 Arial, sans-serif; letter-spacing: .24em; text-transform: uppercase; }
.global-mobile-menu__links { position: relative; display: grid; }
.global-mobile-menu__links a { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 16px 0; border-bottom: 1px solid rgba(255,255,255,.12); color: rgba(255,255,255,.7); text-decoration: none; font: 300 clamp(30px, 8vw, 52px)/1.02 Arial, sans-serif; letter-spacing: -.04em; }
.global-mobile-menu__links a::after { content: "\2197"; font-size: 16px; opacity: .48; }
.global-mobile-menu__links a.is-active { color: #fff; }
.global-mobile-menu__footer { position: relative; margin-top: 32px; color: rgba(255,255,255,.38); font: 500 10px/1.4 Arial, sans-serif; letter-spacing: .17em; text-transform: uppercase; }
body.global-menu-open { overflow: hidden; }

@media (max-width: 1120px) {
  :root { --global-nav-h: 76px; }
  .global-nav { padding-top: env(safe-area-inset-top); height: calc(var(--global-nav-h) + env(safe-area-inset-top)); }
  .global-nav__links, .global-nav__cta { display: none; }
  .global-nav { grid-template-columns: 1fr auto; }
  .global-menu-toggle { display: block; }
}

@media (max-width: 480px) {
  .global-nav { padding-inline: 18px; }
  .global-nav__name { font-size: 10px; letter-spacing: .16em; }
  .global-nav__monogram { width: 40px; height: 40px; }
  .global-mobile-menu { padding-inline: 28px; }
}

@media (prefers-reduced-motion: reduce) {
  .global-nav, .global-mobile-menu, .global-nav__links a::after { transition-duration: .01ms !important; }
}
