/* The site v2 nav, footer and closing section on pages whose body is still the v1 (Webflow) design:
   /demo, /pricing, /roi-calculator, /compare/*, the blog, the library and the legal pages.

   Load order on those pages: base.css first (so the Webflow CSS that follows still wins for the page
   body), then the Webflow and custom CSS, then this file. It puts back, inside the chrome only, what the
   Webflow CSS overrides there:
   1. The v2 body text settings, set on the chrome containers because Webflow's body rule (Arial 14px)
      would otherwise be inherited.
   2. base.css's global element rules. They're wrapped in :where() so they have the same specificity as
      Webflow's element rules (which they beat by loading later) and never outrank base.css's own
      component rules.
   3. The two base.css component classes the Webflow-era custom.css also defines (.cs-card, .cs-m, used by
      the nav's Customers menu).
   Pages built on the v2 layout (design="v2") don't load this file. */

:where(.nav, .msheet, footer, .close) {
  font: 500 16px/1.4 var(--sans);
  color: var(--black);
  letter-spacing: normal;
  text-align: left;
  -webkit-font-smoothing: antialiased;
}
:where(.nav, .msheet, footer, .close) a {
  color: inherit;
  text-decoration: none;
  text-underline-position: auto;
  transition: none;
}
:where(.nav, .msheet, footer, .close) a:hover { opacity: 1; }
:where(.nav, .msheet, footer, .close) :is(h1, h2, h3, h4, h5, h6) {
  margin: 0;
  font-family: inherit;
  font-size: revert;
  font-weight: 600;
  line-height: inherit;
  letter-spacing: inherit;
  color: inherit;
  text-wrap: balance;
}
:where(.nav, .msheet, footer, .close) p { margin: 0; }
:where(.nav, .msheet, footer, .close) :is(ul, figure) { margin: 0; padding: 0; }
:where(.nav, .msheet, footer, .close) blockquote {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  font-size: inherit;
  line-height: inherit;
}
:where(.nav, .msheet, footer, .close) figcaption { margin-top: 0; text-align: left; }
:where(.nav, .msheet, footer, .close) img { object-fit: initial; }

/* custom.css styles .cs-card and .cs-m for the old case-study cards; restore base.css's versions in the nav */
.nav .cs-card {
  display: flex;
  flex-direction: column;
  grid-template-columns: none;
  gap: 8px;
  padding: 10px 10px 16px;
  border: 0;
  border-radius: 16px;
  background: none;
  box-shadow: none;
  overflow: visible;
}
.nav .cs-card:hover, .nav .cs-card:focus-visible { background: var(--warm); }
.nav .cs-m { flex-direction: row; }
