/* Compact navigation with a translucent glass surface. */
.nav-slot{height:86px}
.nav{position:fixed;left:50%;top:0;transform:translateX(-50%);width:100%;height:86px;z-index:32;border:1px solid transparent;border-radius:0;box-shadow:0 0 0 transparent;transition:width .6s var(--ease),height .6s var(--ease),top .6s var(--ease),padding .6s var(--ease),border-radius .6s var(--ease),background .45s,border-color .45s,box-shadow .6s}
.nav-brand,.nav nav{flex-shrink:0;transition:gap .6s var(--ease)}
.nav-brand svg{transition:width .6s var(--ease),height .6s var(--ease)}
.nav.is-compact{top:14px;width:min(760px,calc(100% - 48px));height:64px;padding:0 25px;gap:42px;border-radius:24px;background:linear-gradient(120deg,#ffffffc9,#f8f8f5b8);border-color:#ffffffa8;box-shadow:inset 0 1px 0 #fff, inset 0 -1px 0 #ffffff55,0 8px 28px #10111014;backdrop-filter:blur(20px) saturate(155%);-webkit-backdrop-filter:blur(20px) saturate(155%)}
.nav.is-compact nav{gap:25px}
.nav.is-compact .nav-brand{gap:10px}
.nav.is-compact .nav-brand svg{width:76px;height:31px}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.nav.is-compact{background:#f8f8f5f5}}
@media(max-width:900px){.nav.is-compact{gap:24px}.nav.is-compact nav{gap:20px}}
@media(max-width:600px){.nav-slot{height:72px}.nav{height:72px}.nav.is-compact{top:10px;width:calc(100% - 24px);height:60px;padding:0 14px;gap:12px;border-radius:20px}.nav.is-compact nav{gap:12px}.nav.is-compact .nav-brand{gap:6px}.nav.is-compact .nav-brand svg{width:57px;height:25px}}
@media(max-width:360px){.nav.is-compact{padding:0 10px;gap:8px}.nav.is-compact nav{gap:8px}.nav.is-compact .nav-brand span{font-size:9px}.nav.is-compact .nav-brand svg{width:52px}.nav.is-compact .contact-link span{display:none}}
@media(prefers-reduced-transparency:reduce){.nav.is-compact{background:#f8f8f5;backdrop-filter:none;-webkit-backdrop-filter:none}}

/* One shared alignment for labels and vector icons in both header states. */
.nav nav>a{display:flex;align-items:center;height:40px;line-height:1}
.nav nav>a:after{bottom:7px}
.nav nav .contact-link{gap:12px}
.nav-contact-arrow{display:block;width:20px;height:20px;flex:none}
.nav-fire svg{display:block}
@media(max-width:600px){.nav nav .contact-link{gap:5px}.nav-contact-arrow{width:17px;height:17px}}
@media(max-width:360px){.nav.is-compact .nav-contact-arrow{display:none}}

.nav-fire{position:relative}
.nav-fire:after{content:"";position:absolute;left:50%;top:50%;width:23px;height:29px;transform:translate(-50%,-50%);pointer-events:none;background:linear-gradient(180deg,transparent 40%,#ccff49d9 50%,transparent 60%);background-size:100% 350%;background-position:50% 0%;mask:url('assets/nav-fire-mask.svg') center / contain no-repeat;-webkit-mask:url('assets/nav-fire-mask.svg') center / contain no-repeat;animation:nav-fire-shine 6s ease-in-out infinite}
@keyframes nav-fire-shine{0%,64%{background-position:50% 0%}88%,100%{background-position:50% 100%}}
.nav-fire:hover:after,.nav-fire:focus-visible:after{animation-play-state:paused}
body.motion-paused .nav-fire:after{animation:none;background-position:50% 0%}
@media(max-width:600px){.nav-fire:after{width:21px;height:27px}}
@media(prefers-reduced-motion:reduce){.nav-fire:after{animation:none;background-position:50% 0%}}
