.site-nav { position: fixed; z-index: 12; top: 60px; right: 20px; display: flex; gap: 4px; padding: 5px; border: 1px solid #d9f2ff40; border-radius: 999px; background: linear-gradient(135deg, #c7eaff1a, #07121b66); backdrop-filter: blur(12px) saturate(120%); -webkit-backdrop-filter: blur(12px) saturate(120%); box-shadow: inset 0 1px 0 #ffffff24, 0 8px 24px #0000001f; }
.site-nav a { display: flex; align-items: center; justify-content: center; min-width: 58px; min-height: 44px; padding: 0 12px; border-radius: 999px; color: #abbcc6; font-size: 12px; text-decoration: none; }
.site-nav a[aria-current], .site-nav a:hover { background: #e3f6ff26; color: #fff; box-shadow: inset 0 1px 0 #ffffff1a; }
.site-nav a:focus-visible { outline: 2px solid #a5e9ff; outline-offset: -3px; }
.site-nav.has-bubble { isolation: isolate; }
.site-nav.has-bubble a { position: relative; z-index: 1; }
.site-nav.has-bubble a[aria-current], .site-nav.has-bubble a:hover { background: transparent; box-shadow: none; }
.site-nav.has-bubble a.is-bubble-target { color: #fff; }
.nav-bubble { position: absolute; top: 0; left: 0; z-index: 0; pointer-events: none; border: 1px solid #e5faff40; border-radius: 999px; background: linear-gradient(135deg, #ffffff66, #cceeff38); box-shadow: inset 0 1px 0 #ffffff4d, 0 2px 8px #03132014; transform-origin: center; }
.hero-actions { position: absolute; left: 50%; bottom: 20%; transform: translateX(-50%); display: flex; gap: 12px; white-space: nowrap; }
.hero-actions a { display: flex; align-items: center; min-height: 44px; padding: 0 22px; border: 1px solid #d0eef066; border-radius: 999px; color: #fff; background: linear-gradient(135deg, #dcf4ff24, #0623304d); backdrop-filter: blur(12px) saturate(120%); -webkit-backdrop-filter: blur(12px) saturate(120%); box-shadow: inset 0 1px 0 #ffffff33, 0 6px 20px #0000001a; font-size: 13px; text-decoration: none; }
.hero-actions a:first-child { background: linear-gradient(135deg, #e2f8ff52, #a5dce529); border-color: #e5faff80; }
.hero-actions a:hover { background: #d8f0f23d; }
.hero-actions a:focus-visible { outline: 2px solid #a5e9ff; outline-offset: 3px; }
main section[id] { scroll-margin-top: 20px; }
@media (max-width: 700px) {
  .site-nav { top: auto; bottom: 12px; left: 50%; right: auto; transform: translateX(-50%); width: max-content; max-width: calc(100% - 24px); }
  .site-nav a { min-width: 64px; padding-inline: 12px; }
  .hero-actions { bottom: 20%; }
  .hero-actions a { padding-inline: 18px; }
  .hero-footer { bottom: 82px; }
  .contact-bottom { margin-bottom: 72px; }
}
@media (max-height: 560px) and (min-width: 701px) {
  .site-nav { top: 42px; right: 12px; }
  .site-nav a { min-width: 50px; min-height: 36px; font-size: 11px; padding-inline: 8px; }
  .hero-actions { left: 20px; bottom: 58px; transform: none; }
}