/* Small additions on top of the compiled Automark stylesheet, for the docs, info and blog pages that are rendered from Markdown or
   the database. Colours come from the Automark theme variables (--color-primary ...), so they follow the theme. */
:root { --site-text: #dad4de; --site-muted: #817e84; --site-line: rgba(255, 255, 255, .1); --site-card: rgba(255, 255, 255, .04); }

/* ---- Markdown content (info pages, docs, blog body) ---- */
.md-content, .docs-content { color: var(--site-text); font-size: 1.0625rem; line-height: 1.85; }
.md-content h1 { display: none; }
.md-content h2, .docs-content h2 { color: #fff; font-family: var(--font-secondary); font-size: 1.7rem; line-height: 1.2; margin: 2.75rem 0 1rem; padding-top: 1.75rem; border-top: 1px solid var(--site-line); scroll-margin-top: 6rem; }
.md-content h2:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
.md-content h3, .docs-content h3 { color: #fff; font-family: var(--font-secondary); font-size: 1.25rem; margin: 2rem 0 .75rem; scroll-margin-top: 6rem; }
.md-content p, .docs-content p { margin: 0 0 1.15rem; }
.md-content strong, .docs-content strong { color: #fff; }
.md-content a, .docs-content a { color: var(--color-primary); text-decoration: underline; text-underline-offset: 3px; }
.md-content ul, .docs-content ul { list-style: disc; padding-left: 1.5rem; margin: 0 0 1.25rem; }
.md-content ol, .docs-content ol { list-style: decimal; padding-left: 1.5rem; margin: 0 0 1.25rem; }
.md-content li, .docs-content li { margin-bottom: .5rem; padding-left: .25rem; }
.md-content li::marker, .docs-content li::marker { color: var(--color-primary); font-weight: 700; }
.md-content blockquote, .docs-content blockquote { border-left: 4px solid var(--color-primary); background: var(--site-card); margin: 1.5rem 0; padding: .9rem 1.25rem; border-radius: 0 .75rem .75rem 0; }
.md-content blockquote p, .docs-content blockquote p { margin: 0; }
.md-content code, .docs-content code { background: rgba(255, 255, 255, .08); color: #c9bdff; font-size: .88em; padding: .1rem .45rem; border-radius: .4rem; }
.md-content pre, .docs-content pre { position: relative; background: #0b0c17; border: 1px solid var(--site-line); border-radius: .9rem; padding: 1.25rem 1.4rem; overflow-x: auto; margin: 1.4rem 0; }
.md-content pre code, .docs-content pre code { background: none; color: #e2e8f0; padding: 0; font-size: .875rem; line-height: 1.7; }
.md-content table, .docs-content table { width: 100%; border-collapse: separate; border-spacing: 0; margin: 1.5rem 0; font-size: .95rem; display: block; overflow-x: auto; border: 1px solid var(--site-line); border-radius: .75rem; }
.md-content th, .md-content td, .docs-content th, .docs-content td { padding: .7rem 1rem; text-align: left; border-bottom: 1px solid var(--site-line); }
.md-content th, .docs-content th { background: var(--site-card); color: #fff; white-space: nowrap; }
.md-content tr:last-child td, .docs-content tr:last-child td { border-bottom: 0; }
.md-content hr, .docs-content hr { margin: 2.25rem 0; border: 0; border-top: 1px solid var(--site-line); }
.md-content img, .docs-content img { max-width: 100%; height: auto; border-radius: .75rem; }
.md-content .headerlink, .docs-content .headerlink { margin-left: .5rem; color: var(--site-muted); text-decoration: none; opacity: 0; }
.md-content :is(h2, h3):hover .headerlink, .docs-content :is(h2, h3):hover .headerlink { opacity: 1; color: var(--color-primary); }

/* ---- Docs layout ---- */
.docs-shell { padding: 8.5rem 0 6rem; }
.docs-shell > .container { max-width: 1260px; }
.docs-grid { display: grid; grid-template-columns: 250px minmax(0, 1fr) 220px; gap: 3rem; align-items: start; }
.docs-sidebar { position: sticky; top: 6.5rem; max-height: calc(100vh - 8rem); overflow-y: auto; padding: 0 .6rem 1.5rem 0; scrollbar-width: thin; }
.docs-search { position: relative; margin-bottom: 1.1rem; }
.docs-search input { width: 100%; padding: .65rem .9rem .65rem 2.4rem; border: 1px solid var(--site-line); border-radius: .75rem; background: var(--site-card); color: #fff; font-size: .9rem; outline: none; }
.docs-search input:focus { border-color: var(--color-primary); }
.docs-search i { position: absolute; left: .9rem; top: 50%; transform: translateY(-50%); font-size: .8rem; color: var(--site-muted); pointer-events: none; }
.docs-sidebar__group { font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--site-muted); margin: 1.4rem 0 .4rem .75rem; }
.docs-sidebar ul { list-style: none; margin: 0; padding: 0; }
.docs-sidebar li a { display: block; padding: .45rem .75rem; border-radius: .55rem; font-size: .92rem; line-height: 1.4; color: var(--site-text); text-decoration: none; }
.docs-sidebar li a:hover { color: #fff; background: var(--site-card); }
.docs-sidebar li a.active { color: #fff; background: color-mix(in srgb, var(--color-primary) 22%, transparent); font-weight: 600; }
.docs-sidebar__empty { display: none; padding: .9rem .75rem; font-size: .9rem; color: var(--site-muted); }
.docs-content { min-width: 0; max-width: 780px; }
.docs-content > h1 { font-family: var(--font-secondary); font-size: clamp(1.9rem, 3.4vw, 2.6rem); line-height: 1.15; color: #fff; margin: 0 0 1.1rem; }
.docs-copy { position: absolute; top: .6rem; right: .6rem; padding: .25rem .7rem; border: 1px solid var(--site-line); border-radius: .5rem; background: var(--site-card); color: var(--site-text); font-size: .75rem; font-weight: 700; cursor: pointer; }
.docs-crumbs { display: flex; flex-wrap: wrap; gap: .4rem .5rem; margin: 0 0 .9rem; font-size: .8rem; font-weight: 600; color: var(--site-muted); }
.docs-crumbs a { color: var(--site-text); text-decoration: none; }
.docs-mobile-nav { display: none; margin-bottom: 1.25rem; }
.docs-mobile-nav select { width: 100%; padding: .7rem .9rem; border: 1px solid var(--site-line); border-radius: .75rem; background: #0b0c17; color: #fff; }
.docs-toc { position: sticky; top: 6.5rem; font-size: .85rem; }
.docs-toc__title { font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--site-muted); margin: 0 0 .6rem; }
.docs-toc ul { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--site-line); }
.docs-toc li a { display: block; padding: .25rem .75rem; color: var(--site-muted); text-decoration: none; }
.docs-toc li a:hover, .docs-toc li a.active { color: #fff; }
.docs-toc li.lvl-3 a { padding-left: 1.5rem; }
.docs-pager { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 4rem; padding-top: 2rem; border-top: 1px solid var(--site-line); }
.docs-pager a { display: block; border: 1px solid var(--site-line); border-radius: .9rem; padding: 1rem 1.25rem; text-decoration: none; background: var(--site-card); }
.docs-pager a:hover { border-color: var(--color-primary); }
.docs-pager__label { display: block; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--site-muted); margin-bottom: .2rem; }
.docs-pager__title { color: #fff; font-weight: 600; }
.docs-pager a.next { text-align: right; grid-column: 2; }
.docs-pager a.prev { grid-column: 1; }
@media (max-width: 1199px) { .docs-grid { grid-template-columns: 240px minmax(0, 1fr); gap: 2.5rem; } .docs-toc { display: none; } }
@media (max-width: 991px) {
  .docs-grid { grid-template-columns: 1fr; gap: 0; } .docs-sidebar { display: none; } .docs-mobile-nav { display: block; }
  .docs-shell { padding: 6.5rem 0 4rem; } .docs-pager { grid-template-columns: 1fr; } .docs-pager a.next, .docs-pager a.prev { grid-column: 1; }
}

/* ---- Blog pager ---- */
.site-pager { display: flex; align-items: center; justify-content: center; gap: 1.5rem; margin-top: 3rem; color: var(--site-muted); }
.site-pager a { color: #fff; text-decoration: none; padding: .5rem 1.1rem; border: 1px solid var(--site-line); border-radius: 999px; }
.site-pager a:hover { border-color: var(--color-primary); }

/* ---- Logo: the mark plus live text, crisp at every size ---- */
.mxs-logo { display: inline-flex; align-items: center; gap: .65rem; text-decoration: none; }
.mxs-logo img { height: 46px; width: 46px; flex: none; }
.mxs-logo__text { font-family: var(--font-secondary), "Urbanist", sans-serif; font-weight: 700; font-size: 1.7rem; line-height: 1; letter-spacing: -.01em; color: #fff; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
.mxs-logo__text b { font-weight: 700; color: #b9a6ff; }
.mxs-logo__text i { font-style: normal; font-weight: 700; color: #b9a6ff; }
@media (max-width: 1023px) { .mxs-logo img { height: 40px; width: 40px; } .mxs-logo__text { font-size: 1.45rem; } }

/* ---- Header: a bolder call-to-action ---- */
.header .btn.btn-primary { padding: .95rem 2.2rem !important; font-size: 1.0625rem !important; font-weight: 700 !important; letter-spacing: .01em; }
.header .navbar-nav .nav-link { font-weight: 600; }

/* ---- Leadership team: compact cards (each about 3.5 inches tall) ---- */
.team-card__photo { width: 8.5rem; height: 10.6rem; }
.team-card__photo img { object-position: 50% 15%; }
@media (max-width: 575px) { .team-card__photo { width: 6.25rem; height: 8rem; } }

/* ---- Pricing: every plan on one line, in compact cards ---- */
.pricing-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .9rem; align-items: stretch; }
@media (max-width: 1099px) { .pricing-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { .pricing-row { grid-template-columns: 1fr; } }
.pricing-card { padding: 1.15rem 1rem 1.2rem !important; display: flex; flex-direction: column; }
.pricing-card .price-tag { font-size: 1.85rem !important; line-height: 1.1; }
.pricing-card .price-tag span { font-size: .72rem !important; }
.pricing-card > div:first-of-type { margin-bottom: .6rem !important; }
.pricing-card h3 { font-size: 1.05rem !important; margin-bottom: .3rem !important; }
.pricing-card p { font-size: .78rem !important; line-height: 1.35 !important; }
.pricing-card p.mt-3 { margin-top: .4rem !important; }
.pricing-card .btn { margin: .8rem 0 !important; padding: .55rem 1rem !important; font-size: .85rem !important; }
.pricing-card .font-bold.mb-6 { margin-bottom: .55rem !important; font-size: .78rem; }
.pricing-card ul { margin: 0; padding: 0; }
.pricing-card ul.space-y-4 > * + * { margin-top: .45rem !important; }
.pricing-card ul li { font-size: .76rem; line-height: 1.3; gap: .5rem !important; }
.pricing-card ul li svg { width: 17px; height: 17px; flex: none; }
.pricing-card [class*="top-10"] { top: .7rem !important; right: .7rem !important; font-size: .62rem !important; padding: .2rem .5rem !important; }
/* ---- Leadership team: larger photos, shown in full ---- */
.team-card__photo { width: 11rem !important; height: 13.75rem !important; }
.team-card__photo img { object-fit: contain !important; object-position: 50% 50% !important; background: #fff; }
@media (max-width: 575px) { .team-card__photo { width: 7.5rem !important; height: 9.4rem !important; } }

/* ---- Header: Log in / Dashboard sits beside the free-trial button with room to breathe ---- */
.header .btn.mxs-login { padding: .95rem 2rem !important; font-size: 1.0625rem !important; font-weight: 700 !important; letter-spacing: .01em; margin: 0 1.1rem 0 1.5rem;
    color: #fff; border-color: rgb(255 255 255 / .5); background: rgb(255 255 255 / .07); backdrop-filter: blur(8px); white-space: nowrap; }
.header .btn.mxs-login:hover { background: var(--color-primary); border-color: var(--color-primary); }