:root {
  --brand-ink: #051343;
  /* Shared sky blue for actions and broad surfaces; ink stays dark for text. */
  --brand-primary: #115cae;
  --brand-navy: var(--brand-primary);
  --brand-primary-hover: #064591;
  --brand-on-primary: #eaf3fb;
  --brand-accent: var(--brand-primary);
  --brand-muted: #59697e;
  --brand-white: #ffffff;
  --brand-surface: #f4f8fd;
  --brand-tint: #e3effb;
  --brand-tint-strong: #b9d7f5;
  --brand-border: #d7e3ef;
}

/* Keep secondary copy legible on the shared, lighter blue surface. */
[data-local-section="comet-browser"] [style*="var(--brand-white) 70%"] {
  --framer-text-color: var(--brand-on-primary) !important;
}

::selection {
  background: var(--brand-tint-strong);
  color: var(--brand-navy);
}

:is(a, button, [role="button"], [role="tab"]):focus-visible {
  outline: 3px solid var(--brand-accent);
  outline-offset: 4px;
}

/* Presentation only: convert the teal in product imagery to the logo's blue
   family. The SVG mask preserves neutrals, warm colors and transparency. */
:is(
  [data-local-section="hero"],
  [data-local-section="computer-feature"],
  [data-local-section="enterprise-research-connectors"],
  [data-local-section="comet-browser"],
  [data-local-section="industry-tabs"],
  [data-local-section="final-cta"]
) :is(img, video) {
  filter: url("#selfgrow-blue-media");
}

/* Primary actions share a single blue and an explicit darker hover state. */
a[style*="background-color: var(--brand-primary)"],
a[style*="background-color:var(--brand-primary)"] {
  transition: background-color 160ms ease;
}

a[style*="background-color: var(--brand-primary)"]:hover,
a[style*="background-color:var(--brand-primary)"]:hover {
  background-color: var(--brand-primary-hover) !important;
}

@media (prefers-reduced-motion: reduce) {
  a[style*="background-color: var(--brand-primary)"],
  a[style*="background-color:var(--brand-primary)"] {
    transition: none;
  }
}

.framer-1sw57as[data-local-brand-wordmark] {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 9px !important;
  width: max-content !important;
  height: 36px !important;
  flex: none !important;
}

[role="link"]:has(> [data-local-brand-wordmark]) {
  width: max-content !important;
  height: 36px !important;
  flex: none !important;
}

img[data-local-brand-image] {
  /* Preserve the source colors; these marks are not product illustrations.
     Normal sampling also overrides the captured SVG wrapper's pixelated mode. */
  filter: none;
  mix-blend-mode: normal;
  image-rendering: auto;
}

[data-local-brand-wordmark] > img[data-local-brand-image] {
  display: block;
  width: 30px;
  height: 36px;
  flex: 0 0 30px;
  object-fit: contain;
}

/* The navigation and hero share the same content edges. */
[data-local-section="header"] nav {
  padding-inline: max(24px, calc((100vw - 1200px) / 2)) !important;
}

/* Keep only the three primary navigation options. */
[data-local-section="header"] :is(.framer-9kt8a9-container, .framer-xwfmqr-container),
[data-local-section="header"] [hidden] {
  display: none !important;
}

[data-local-section="header"] nav p.framer-text {
  --framer-font-family: "PPLX Sans Beta v0 VF Variable S Black", sans-serif !important;
  --framer-font-variation-axes: "wght" 420, "opsz" 24, "slnt" 0 !important;
  --framer-font-weight: 420 !important;
  --framer-letter-spacing: 0px !important;
  --framer-font-size: 14px !important;
}

@media (min-width: 1200px) {
  [data-local-section="header"] nav {
    gap: 48px !important;
  }

  [data-local-section="header"] .framer-1qkv53u {
    justify-content: flex-end !important;
    gap: 26px !important;
  }

  [data-local-section="header"] .framer-15t5vgk-container {
    margin-left: 0;
  }
}

/* Approved wordmark: Italianno + Jost Regular, both black. */
@font-face {
  font-family: "Selfgrow Italianno";
  src: url("/landing/assets/fonts/italianno-logo.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Selfgrow Jost";
  src: url("/landing/assets/fonts/jost-regular-logo.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
.sg-wordmark {
  display: inline-flex;
  align-items: baseline;
  white-space: nowrap;
  line-height: 1;
  font-synthesis: none;
  font-variation-settings: normal;
  letter-spacing: 0;
  text-decoration: none;
}
.sg-wordmark > .sg-wordmark-self {
  font-family: "Selfgrow Italianno", cursive;
  font-size: 1.55em;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  color: #000;
  -webkit-text-stroke: .006em currentColor;
  paint-order: stroke fill;
}
.sg-wordmark > .sg-wordmark-grow {
  display: inline-block;
  margin-left: .06em;
  margin-right: .24em;
  font-family: "Selfgrow Jost", sans-serif;
  font-size: 1em;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  color: #000;
  transform: scaleX(1.08);
  transform-origin: left center;
}
[data-local-brand-wordmark] > .sg-wordmark {
  font-size: 27px;
  flex: none;
}