/* Floating navigation, shared across Babel pages. */
.topbar, .topbar.is-scrolled {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 24px; padding: 24px 24px 0; pointer-events: none;
}
.topbar .nav, .topbar.is-scrolled .nav {
  position: relative; display: flex; width: max-content; max-width: none;
  min-height: 44px; margin: 0; padding: 0 8px 0 0;
  border: 0; border-radius: 4px; overflow: visible;
  color: #fff; background: #2e2929; box-shadow: none;
  backdrop-filter: none; transform: none;
}
.topbar .brand, .topbar.is-scrolled .brand {
  flex: 0 0 auto; width: 142px; height: 44px;
  padding: 0 32px 0 16px; border: 0;
  transition: width 300ms ease, padding 300ms ease;
}
.topbar.is-scrolled .brand { width: 118px; padding-right: 16px; }
.topbar .brand img { width: 94px; max-height: 30px; object-fit: contain; }
.topbar .nav-links {
  display: flex; flex: 0 0 auto; gap: 8px; height: 44px;
  overflow: visible; font-size: 15px; color: #fff;
}
.topbar .nav-links a {
  height: 44px; padding: 0 12px; border: 0; border-radius: 3px;
  color: #fff; font-weight: 400; white-space: nowrap;
}
.topbar .nav-links a:hover, .topbar .nav-links a[aria-current="page"] {
  color: #fff; background: #ffffff12;
}
.topbar .header-actions, .topbar.is-scrolled .header-actions {
  position: static; display: flex; width: auto; margin: 0; gap: 16px;
  transform: none; pointer-events: auto;
}
.topbar .header-action {
  min-height: 44px; padding: 0 16px; border: 0; border-radius: 4px;
  font-size: 15px; font-weight: 400; letter-spacing: 0; box-shadow: none;
}
.topbar .header-action-dark { background: transparent; color: #243615; }
.topbar .header-action-dark:hover { background: #ffffff80; transform: none; }
.topbar .header-action-light { background: #2e2929; color: #fff; }
.topbar .header-action-light:hover { background: #433c3c; transform: none; }
.topbar .header-action-light::after { content: none; }
.topbar a:focus-visible, .topbar button:focus-visible { outline: 2px solid #91b8d3; outline-offset: 3px; }
.topbar .nav-toggle, .topbar .nav-mobile-company { display: none; }
html { scroll-padding-top: 92px; }
.topbar .nav-product{position:relative;height:44px}
.topbar .nav-product>summary{display:flex;align-items:center;gap:10px;height:44px;padding:0 12px;list-style:none;color:#fff;font-size:15px;font-weight:400;cursor:pointer;border-radius:3px;white-space:nowrap}
.topbar .nav-product>summary::-webkit-details-marker{display:none}
.topbar .nav-product>summary:hover,.topbar .nav-product[open]>summary{background:#ffffff12}
.topbar .nav-product>summary:focus-visible{outline:2px solid #91b8d3;outline-offset:3px}
.nav-product-chevron{width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);margin-top:-3px}
.nav-product[open] .nav-product-chevron{transform:rotate(225deg);margin-top:3px}
.topbar .nav-product-panel{position:absolute;top:52px;left:0;min-width:288px;padding:8px;background:#2e2929;border:1px solid #ffffff18;border-radius:5px;box-shadow:0 14px 34px #0002}
.topbar .nav-product-panel>a{display:flex;align-items:center;min-height:46px;height:auto;padding:12px 14px;font-size:15px;white-space:normal}
.product-tax-link{display:flex;justify-content:flex-end;padding-bottom:28px}
.product-tax-link>a{font-size:1rem;line-height:1.5;color:#171717;border-bottom:1px solid #999;padding-bottom:6px}
.product-tax-link>a:hover{border-color:#171717}.product-tax-link span{margin-left:16px}
@media (max-width: 1000px) {
  .topbar, .topbar.is-scrolled { padding: 12px 12px 0; gap: 0; }
  .topbar .nav, .topbar.is-scrolled .nav { width: 100%; padding: 0; min-height: 48px; justify-content: space-between; }
  .topbar .brand, .topbar.is-scrolled .brand { width: 108px; height: 48px; padding: 0 12px; }
  .topbar .brand img { width: 84px; }
  .topbar .nav-toggle {
    display: grid; align-content: center; justify-items: center; gap: 5px;
    flex: 0 0 48px; width: 48px; height: 48px; padding: 0;
    border: 0; border-radius: 4px; color: #fff; background: transparent; cursor: pointer;
  }
  .nav-toggle span { display: block; width: 18px; height: 1px; background: currentColor; transition: transform 180ms ease; }
  .nav-toggle[aria-expanded="true"] span:first-child { transform: translateY(3px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3px) rotate(-45deg); }
  .topbar .nav-links {
    display: none; position: absolute; top: 56px; left: 0; right: 0;
    flex-direction: column; align-items: stretch; height: auto; padding: 8px;
    gap: 0; border-radius: 4px; background: #2e2929; box-shadow: 0 12px 28px #0002;
  }
  .topbar.is-menu-open .nav-links { display: flex; }
  .topbar .nav-links a { display: flex; min-height: 48px; height: auto; padding: 12px 16px; white-space: normal; }
  .topbar .nav-links .nav-mobile-company { display: flex; }
  .topbar .nav-product{height:auto;width:100%}
  .topbar .nav-product>summary{min-height:48px;height:auto;padding:12px 16px;justify-content:space-between}
  .topbar .nav-product-panel{position:static;min-width:0;padding:0 0 8px 12px;margin:0 8px 0 16px;border:0;border-left:1px solid #ffffff30;border-radius:0;box-shadow:none}
  .topbar .nav-product-panel>a{font-size:14px;min-height:44px;padding:12px 14px}
  .topbar .header-actions, .topbar.is-scrolled .header-actions { position: absolute; top: 12px; right: 64px; width: auto; margin: 0; gap: 0; }
  .topbar .header-action-dark { display: none; }
  .topbar .header-action-light { min-height: 48px; padding: 0 12px; font-size: 14px; background: transparent; }
  .topbar .header-action-light:hover { background: #ffffff12; }
}
@media (prefers-reduced-motion: reduce) {
  .topbar, .topbar *, .topbar.is-scrolled * { transition: none; }
}