/* A compact floating masthead, shared by the homepage and company pages. */
.header,
.header.scrolled,
.inner-page .header {
  position: fixed;
  inset: 20px 0 auto;
  width: min(1360px, calc(100% - 64px));
  height: 84px;
  margin-inline: auto;
  padding: 12px 22px;
  gap: 22px;
  border: 1px solid #fff;
  border-radius: 22px;
  background: #ffffffed;
  box-shadow: 0 9px 35px #375a8610, 0 0 0 1px #b6cce438;
  backdrop-filter: blur(24px);
  transition: top .25s, height .25s, box-shadow .25s, background .25s;
}
.header.scrolled { top: 12px; height: 76px; background: #fffffff5; box-shadow: 0 10px 35px #375a861c, 0 0 0 1px #b6cce438; }
.header .brand { width: 192px; padding-inline-end: 22px; border-inline-end: 1px solid #e0e9f4; }
.header .brand img { width: 100%; }
.header #navigation { display: flex; align-items: center; justify-content: center; gap: 3px; flex: 1; min-width: 0; }
.header #navigation > a:not(.mobile-demo), .header .nav-more-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; padding: 8px 12px; border: 1px solid transparent;
  border-radius: 12px; white-space: nowrap; font-size: 13px; font-weight: 600;
  color: #526580; transition: background .2s, color .2s, border-color .2s;
}
.header #navigation > a:hover, .header .nav-more-toggle:hover { background: #f3f6fb; color: #255ece; }
.header #navigation > a.active,
.header .nav-more:has(a.active) > .nav-more-toggle,
.header .nav-more-toggle[aria-expanded=true] { background: #eaf1ff; border-color: #dae6ff; color: #265fd0; }
.header #navigation a::after { display: none; }
.nav-more-toggle { gap: 7px; }
.nav-more-toggle svg { width: 14px; height: 14px; transition: transform .25s; }
.nav-more-toggle[aria-expanded=true] svg { transform: rotate(180deg); }
.header-tools { gap: 10px; flex-shrink: 0; }
.header .motion-toggle { width: 34px; height: 40px; border-radius: 10px; color: #7990ad; }
.header .motion-toggle svg { width: 19px; height: 19px; }
.header .motion-toggle:hover { background: #edf3fc; color: #265fd0; }
.header .nav-cta { display: flex; min-height: 46px; padding: 7px 9px 7px 15px; gap: 19px; border: 1px solid #3675e7; border-radius: 13px; background: #2e68da; color: #fff; font-size: 13px; font-weight: 700; box-shadow: 0 5px 12px #2e68da20; }
.header .nav-cta > span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: #ffffff21; font: 21px Arial,sans-serif; transition: transform .25s; }
.header .nav-cta:hover { background: #2058c7; box-shadow: 0 6px 18px #2e68da35; }
.header .nav-cta:hover > span { transform: translate(-2px,-2px); }
.header .menu-toggle, .mobile-nav-heading { display: none; }
.header :is(a,button):focus-visible { outline: 2px solid #2865d8; outline-offset: 3px; }
.header .nav-discover { position: absolute; top: calc(100% + 12px); left: 0; right: 0; padding: 28px; border: 1px solid #e3ebf8; border-radius: 23px; background: #fffffff8; box-shadow: 0 22px 50px #25446f1f; backdrop-filter: blur(25px); animation: nav-arrive .2s ease-out; }
.nav-discover-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.nav-discover-heading > span { font-size: 15px; font-weight: 700; color: #24456e; }
.nav-discover-heading > small { font-size: 12px; color: #8191a7; }
.nav-discover-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.header #navigation .nav-discover-grid > a { position: relative; display: grid; grid-template-columns: 46px 1fr; gap: 3px 14px; align-items: center; padding: 22px; border: 1px solid #e2eaf6; border-radius: 16px; background: #f7faff; white-space: normal; }
.header #navigation .nav-discover-grid > a:nth-child(2) { background: #f8f7ff; border-color: #e9e5f8; }
.header #navigation .nav-discover-grid > a:nth-child(3) { background: #f2faf9; border-color: #dfefec; }
.nav-tile-icon { grid-row: span 2; width: 46px; height: 46px; display: grid; place-items: center; background: #fff; border: 1px solid #e4ecf9; color: #4879cf; border-radius: 13px; }
.nav-tile-icon svg { width: 23px; height: 23px; }
.nav-discover-grid > a:nth-child(2) .nav-tile-icon { color: #8674c7; }
.nav-discover-grid > a:nth-child(3) .nav-tile-icon { color: #388d88; }
.nav-discover-grid strong { font-size: 15px; color: #28496e; padding-inline-end: 20px; }
.nav-discover-grid small { font-size: 12px; color: #75869e; }
.nav-discover-grid b { position: absolute; top: 23px; left: 20px; font: 20px Arial,sans-serif; color: #92a4bd; transition: transform .2s; }
.header #navigation .nav-discover-grid > a:hover, .header #navigation .nav-discover-grid > a.active { border-color: #8cacdf; box-shadow: 0 6px 18px #375a860a; }
.nav-discover-grid > a:hover b { transform: translate(-2px,-2px); }
.nav-discover-footer { display: flex; gap: 28px; border-top: 1px solid #eaf0f8; padding-top: 15px; margin-top: 22px; }
.header #navigation .nav-discover-footer a { display: inline-flex; align-items: center; gap: 18px; font-size: 12px; padding: 4px 0; color: #647c9c; }
.header #navigation .nav-discover-footer a:hover { color: #265fd0; }
.header #navigation .mobile-demo { display: none; }
@keyframes nav-arrive { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@media (min-width:1101px) and (max-width:1250px) {
  .header, .header.scrolled, .inner-page .header { gap: 12px; padding-inline: 16px; }
  .header .brand { width: 166px; padding-inline-end: 16px; }
  .header #navigation > a:not(.mobile-demo), .header .nav-more-toggle { padding-inline: 9px; font-size: 12px; }
  .header-tools { gap: 5px; }
  .header .nav-cta { gap: 10px; font-size: 12px; }
}
@media (min-width:1101px) {
  .header #navigation { position: static; padding: 0; border: 0; background: none; box-shadow: none; max-height: none; overflow: visible; backdrop-filter: none; }
}
@media (max-width:1100px) {
  .header, .header.scrolled, .inner-page .header { width: calc(100% - 40px); top: 16px; height: 76px; padding: 12px 18px; gap: 16px; border-radius: 19px; }
  .header.scrolled { top: 10px; height: 70px; }
  .header .brand { width: 185px; padding-inline-end: 0; border: 0; }
  .header .menu-toggle { display: flex; width: 42px; height: 42px; gap: 6px; background: #eef3fb; border: 1px solid #e2eaf6; border-radius: 12px; }
  .header .menu-toggle span { height: 1.5px; border-radius: 2px; }
  .header-tools { margin-inline-start: auto; gap: 10px; }
  .header #navigation { display: none; position: absolute; top: calc(100% + 10px); left: 0; right: 0; padding: 18px; max-height: calc(100svh - 118px); overflow-y: auto; overscroll-behavior: contain; border: 1px solid #e1eaf7; border-radius: 20px; background: #fffffff8; box-shadow: 0 20px 40px #375a8624; backdrop-filter: blur(24px); }
  .header #navigation.open { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; animation: nav-arrive .2s ease-out; }
  .mobile-nav-heading { display: block; grid-column: 1/-1; color: #8293a9; font-size: 11px; padding: 4px 10px 11px; }
  .header #navigation > a:not(.mobile-demo) { justify-content: flex-start; padding: 11px 15px; font-size: 14px; min-height: 49px; }
  .header #navigation > a[href='#contact'] { grid-column: 2; grid-row: 4; }
  .nav-more { display: contents; }
  .header .nav-more-toggle { grid-column: 1; grid-row: 4; justify-content: space-between; min-height: 49px; font-size: 14px; padding: 11px 15px; }
  .header .nav-discover { position: static; grid-column: 1/-1; padding: 15px; margin-block: 6px; border-radius: 14px; box-shadow: none; background: #f8faff; backdrop-filter: none; }
  .nav-discover-heading { margin-bottom: 12px; }
  .nav-discover-heading > span { font-size: 12px; }
  .nav-discover-heading > small { display: none; }
  .nav-discover-grid { grid-template-columns: 1fr; gap: 7px; }
  .header #navigation .nav-discover-grid > a { grid-template-columns: 38px 1fr; padding: 12px; gap: 1px 12px; }
  .nav-tile-icon { width: 38px; height: 38px; border-radius: 10px; }
  .nav-tile-icon svg { width: 20px; height: 20px; }
  .nav-discover-grid strong { font-size: 13px; }
  .nav-discover-grid small { font-size: 11px; }
  .nav-discover-grid b { top: 15px; left: 13px; }
  .nav-discover-footer { flex-wrap: wrap; gap: 6px 20px; padding-top: 10px; margin-top: 14px; }
  .header #navigation .nav-discover-footer a { font-size: 11px; min-height: 35px; }
  .header #navigation .mobile-demo { display: flex; grid-column: 1/-1; align-items: center; justify-content: space-between; border-radius: 12px; padding: 12px 16px; margin-top: 9px; background: #2e68da; color: #fff; font-size: 14px; min-height: 49px; }
}
@media (max-width:640px) {
  .header, .header.scrolled, .inner-page .header { width: calc(100% - 24px); top: 12px; height: 68px; padding: 10px 13px; gap: 10px; border-radius: 17px; }
  .header.scrolled { top: 8px; }
  .header .brand { width: 158px; }
  .header-tools { gap: 5px; }
  .header .nav-cta { display: none; }
  .header .motion-toggle { width: 30px; }
  .header .menu-toggle { width: 39px; height: 39px; border-radius: 11px; }
  .header #navigation { padding: 12px; border-radius: 17px; max-height: calc(100svh - 104px); }
  .header #navigation > a:not(.mobile-demo), .header .nav-more-toggle { font-size: 13px; padding: 10px 12px; }
  .header .nav-discover { padding: 12px; }
}
@media (prefers-reduced-motion:reduce) {
  .header, .header *, .header *::before, .header *::after { animation: none !important; transition: none !important; }
}