/* Ledger — Help Scout Docs theme. Values from design-tokens/tokens.json.
   Paste into Help Scout: Docs > Customize > Custom Code (<head>), wrapped in <style>…</style>.
   Selectors target Help Scout's default Docs theme; confirm with Safari's Inspect if anything doesn't apply. */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Manrope:wght@600;700;800&display=swap");

:root {
  --ink: #10222A; --forest: #1C3A36; --ivory: #F7F5F0; --mist: #E9EEEA;
  --text-secondary: #5A6C64; --border: #E3E8E4; --link: #2F6F66; --on-hero-muted: #A9C2B8;
}

/* Type */
body, input, button { font-family: Inter, -apple-system, system-ui, sans-serif; color: var(--ink); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, #docsSearch h1, .category-list h3, #fullArticle h1.title { font-family: Manrope, -apple-system, system-ui, sans-serif; color: var(--ink); letter-spacing: -0.01em; }

/* Header: Forest bar, Ivory wordmark, no white box around the logo */
.navbar .navbar-inner { background: var(--forest); border: 0; box-shadow: none; }
.navbar .brand { padding-top: 22px; padding-bottom: 22px; }
.navbar .brand img { max-height: 28px; width: auto; background: transparent; }
#mainNav .nav li a { color: var(--on-hero-muted); font-weight: 500; }
#mainNav .nav li.active a, #mainNav .nav li a:hover { color: var(--ivory); }

/* Search hero: Ivory ground, big Manrope headline, Forest pill button */
#docsSearch { background: var(--ivory); border-bottom: 1px solid var(--border); padding: 56px 0 64px; }
#docsSearch h1 { font-weight: 800; font-size: 40px; line-height: 1.15; margin-bottom: 24px; }
#searchBar .search-query {
  height: 52px; border: 1px solid #78887F; border-radius: 999px 0 0 999px;
  padding: 0 22px; font-size: 16px; box-shadow: none; background: #fff;
}
#searchBar .search-query:focus { outline: 2px solid var(--link); outline-offset: 1px; }
#searchBar button {
  height: 52px; padding: 0 26px; border: 0; border-radius: 0 999px 999px 0;
  background: var(--forest); color: #fff; font-family: Manrope, sans-serif; font-weight: 600; font-size: 15px;
  text-shadow: none; box-shadow: none;
}
#searchBar button:hover { background: #24463F; }

/* Links */
a { color: var(--link); }
a:hover { color: var(--forest); }
#fullArticle a { text-decoration: underline; text-underline-offset: 2px; }

/* Most popular */
.most-pop-articles { border-bottom: 1px solid var(--border); }
.most-pop-articles h2 { font-weight: 700; font-size: 24px; }

/* Collection / category cards */
.category-list .category {
  background: #fff; border: 1px solid var(--border); border-radius: 16px;
  box-shadow: 0 1px 2px rgba(16,34,42,.04), 0 8px 24px rgba(16,34,42,.06);
  transition: transform .15s ease, box-shadow .15s ease;
}
.category-list .category:hover { transform: translateY(-2px); box-shadow: 0 2px 4px rgba(16,34,42,.05), 0 12px 32px rgba(16,34,42,.09); }
.category-list h3 { font-weight: 700; font-size: 20px; }
.category-list .article-count { color: var(--text-secondary); }

/* Articles */
#fullArticle { font-size: 17px; line-height: 1.65; color: var(--ink); }
#fullArticle h1.title { font-weight: 800; font-size: 34px; line-height: 1.2; }
#fullArticle .callout, #fullArticle .callout-blue, #fullArticle .callout-green {
  background: var(--mist); border: 0; border-radius: 12px; color: var(--ink);
}
#sidebar .nav-list a { color: var(--text-secondary); }
#sidebar .nav-list .active a { color: var(--forest); font-weight: 600; }

/* Footer */
footer, footer p, footer a { color: var(--text-secondary); }