/* Shared Countable header, mirrored from countable-dev.vercel.app/platform. */
@font-face {
  font-family:"Countable Inter";
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url("https://countable-dev.vercel.app/_next/static/media/83afe278b6a6bb3c-s.p.2bn3s6zvc0dyp.woff2") format("woff2");
}
body > nav {
  box-sizing: border-box !important;
  position: fixed !important;
  top: 12px !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  z-index: 1000 !important;
  width: min(1120px, calc(100% - 16px)) !important;
  max-width: calc(100vw - 16px) !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 14px 16px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  flex-wrap:wrap !important;
  gap:12px !important;
  font-family:"Countable Inter",Inter,Arial,sans-serif !important;
  font-style:normal !important;
  line-height:1.6 !important;
  letter-spacing:normal !important;
  border: 1px solid rgba(255,255,255,.65) !important;
  border-radius: 24px !important;
  background: rgba(255,255,255,.78) !important;
  box-shadow: 0 10px 30px rgba(15,23,42,.06) !important;
  backdrop-filter: blur(22px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(160%) !important;
}
body > nav:hover {
  transform: translateX(-50%) !important;
}
body > nav .nav-logo {
  display:flex !important;
  width:140px !important;
  height:36px !important;
  min-width:0 !important;
  align-items:center !important;
  justify-content:center !important;
}
body > nav .nav-logo img,
body > nav .site-logo,
body > nav .brand-logo-full {
  display:block !important;
  content:url("/preview/assets/countable-logo-dark.svg") !important;
  width:100% !important;
  max-width:140px !important;
  height:auto !important;
  filter:none !important;
}
body > nav .nav-links { display:none !important;gap:4px !important; }
body > nav .nav-links > a,
body > nav .nav-sol { flex-shrink:0 !important; }
body > nav .nav-sol { position:relative !important; }
body > nav .nav-sol::after {
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:100% !important;
  height:12px !important;
  z-index:299 !important;
}
body > nav .nav-links > a,
body > nav .nav-sol-label {
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  padding:10px 14px !important;
  border-radius:14px !important;
  color:#5b6780 !important;
  font-size:.85rem !important;
  font-weight:500 !important;
  line-height:1.6 !important;
  letter-spacing:normal !important;
  text-decoration:none !important;
}
body > nav a,
body > nav a:link,
body > nav a:visited,
body > nav a:hover,
body > nav a:focus,
body > nav a:active {
  text-decoration:none !important;
  text-decoration-line:none !important;
}
body > nav .nav-chevron {
  width:14px !important;
  height:14px !important;
  margin-left:2px !important;
  flex:0 0 14px !important;
  color:#8d97ab !important;
}
body > nav .nav-links > a:hover,
body > nav .nav-links > a.active,
body > nav .nav-sol-label:hover,
body > nav .nav-sol:focus-within .nav-sol-label {
  color:#0b1633 !important;
  background:rgba(255,255,255,.65) !important;
}
body > nav .nav-sol-menu {
  display:none !important;
  position:absolute !important;
  z-index:300 !important;
  top:calc(100% + 8px) !important;
  left:50% !important;
  width:210px !important;
  min-width:210px !important;
  padding:6px !important;
  transform:translateX(-50%) !important;
  border:1px solid rgba(255,255,255,.65) !important;
  border-radius:20px !important;
  background:rgba(255,255,255,.85) !important;
  box-shadow:0 18px 36px rgba(31,94,255,.24) !important;
  backdrop-filter:blur(24px) saturate(180%) !important;
  -webkit-backdrop-filter:blur(24px) saturate(180%) !important;
}
body > nav .nav-sol:hover > .nav-sol-menu,
body > nav .nav-sol:focus-within > .nav-sol-menu {
  display:flex !important;
  flex-direction:column !important;
  gap:2px !important;
}
body > nav .nav-sol-menu a { padding:10px 16px !important;color:#5b6780 !important;border-radius:14px !important;font-size:.82rem !important;font-weight:600 !important;text-decoration:none !important; }
body > nav .nav-sol-menu a:hover { color:#1f5eff !important;background:#fff !important; }
body > nav .nav-right { display:flex !important;align-items:center !important;margin-left:auto !important;gap:8px !important; }
body > nav .nav-login { display:none !important;padding:12px 24px !important;border-radius:16px !important;color:#5b6780 !important;text-decoration:none !important;font-family:"Countable Inter",Inter,Arial,sans-serif !important;font-size:.85rem !important;font-weight:700 !important;line-height:1.6 !important;letter-spacing:normal !important;gap:8px !important;transition:transform .2s ease,background-color .2s ease,color .2s ease !important; }
body > nav .nav-login:hover { color:#0b1633 !important;background:rgba(255,255,255,.65) !important;transform:translateY(-1px) !important;box-shadow:none !important; }
body > nav .nav-login:active { transform:translateY(-1px) scale(.98) !important; }
body > nav .btn-primary {
  display:none !important;
  box-sizing:border-box !important;
  height:46px !important;
  min-height:0 !important;
  padding:12px 24px !important;
  border:0 !important;
  border-radius:16px !important;
  color:#fff !important;
  font-family:"Countable Inter",Inter,Arial,sans-serif !important;
  font-size:.85rem !important;
  font-weight:700 !important;
  line-height:1.6 !important;
  letter-spacing:normal !important;
  white-space:nowrap !important;
  background:linear-gradient(135deg,#1f5eff,#6a93ff) !important;
  box-shadow:0 18px 36px rgba(31,94,255,.24) !important;
  text-decoration:none !important;
}
body > nav .btn-primary:hover { transform:translateY(-1px) !important;box-shadow:0 22px 46px rgba(31,94,255,.28) !important; }
body > nav .nav-menu-toggle {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:8px !important;
  border:0 !important;
  border-radius:12px !important;
  color:#5b6780 !important;
  background:rgba(255,255,255,.6) !important;
}
body > nav > .mobile-nav-panel { display:none !important; }
@media (min-width:640px) {
  body > nav {
    top:18px !important;
    width:min(1120px,calc(100% - 20px)) !important;
    max-width:calc(100vw - 20px) !important;
    padding:16px 20px !important;
  }
  body > nav .nav-logo { width:160px !important; }
  body > nav .nav-logo img,
  body > nav .site-logo,
  body > nav .brand-logo-full { max-width:160px !important; }
}
@media (min-width:768px) {
  body > nav {
    width:min(1280px,calc(100% - 32px)) !important;
    max-width:calc(100vw - 32px) !important;
  }
}
@media (min-width:1024px) {
  body > nav {
    min-height:72px !important;
    height:72px !important;
    padding:0 24px !important;
    flex-wrap:nowrap !important;
  }
  body > nav .nav-links { display:flex !important;align-items:center !important;flex-wrap:nowrap !important; }
  body > nav .nav-right { margin-left:0 !important; }
  body > nav .nav-login,
  body > nav .btn-primary { display:inline-flex !important;align-items:center !important;justify-content:center !important; }
  body > nav .nav-menu-toggle { display:none !important; }
}
@media (max-width:1023px) {
  body > nav > .mobile-nav-panel {
    box-sizing:border-box !important;
    display:block !important;
    position:absolute !important;
    left:0 !important;
    top:calc(100% + 12px) !important;
    width:100% !important;
    max-height:85vh !important;
    padding:24px 20px !important;
    overflow-y:auto !important;
    border:1px solid rgba(255,255,255,.65) !important;
    border-radius:24px !important;
    background:rgba(255,255,255,.95) !important;
    box-shadow:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateY(-16px) !important;
    transition:opacity .4s cubic-bezier(.16,1,.3,1),transform .4s cubic-bezier(.16,1,.3,1),visibility .4s !important;
    backdrop-filter:blur(24px) saturate(180%) !important;
    -webkit-backdrop-filter:blur(24px) saturate(180%) !important;
  }
  body.nav-menu-open > nav > .mobile-nav-panel {
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateY(0) !important;
    box-shadow:0 24px 60px rgba(15,23,42,.18) !important;
  }
  body > nav > .mobile-nav-panel .mobile-nav-links {
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:8px !important;
  }
  body > nav > .mobile-nav-panel .mobile-nav-links > a,
  body > nav > .mobile-nav-panel .nav-sol-label {
    display:flex !important;
    width:100% !important;
    justify-content:space-between !important;
    padding:16px 20px !important;
    color:#0b1633 !important;
    font-size:1.05rem !important;
    font-weight:600 !important;
    text-decoration:none !important;
  }
  body > nav > .mobile-nav-panel .nav-sol-menu {
    position:static !important;
    width:auto !important;
    min-width:0 !important;
    margin:4px 8px 8px 24px !important;
    padding:0 0 0 16px !important;
    transform:none !important;
    border:0 !important;
    border-left:2px solid rgba(91,103,128,.18) !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }
  body > nav > .mobile-nav-panel .nav-sol.is-open > .nav-sol-menu { display:flex !important; }
  body > nav > .mobile-nav-panel .mobile-nav-actions {
    display:flex !important;
    flex-direction:column !important;
    gap:12px !important;
    margin-top:20px !important;
    padding-top:20px !important;
    border-top:1px solid rgba(91,103,128,.14) !important;
  }
  body > nav > .mobile-nav-panel .mobile-nav-actions a { display:flex !important;width:100% !important;justify-content:center !important; }
}
