/* Themed sites: shared skeleton. Loaded first; the layout file (docs.css, editorial.css, ...) follows in the same
   theme.css and carries each site's real look. Colours, fonts, radius and density arrive as CSS variables from the
   site's "theme" block (see themeVars in build.mjs). System fonts only, no JavaScript, no external requests.
   This file only resets what style.css does and gives every component a neutral default. */
:root { --maxw: 1080px; --d: var(--dens, 1); }
body { background: var(--bg); color: var(--ink); font-family: var(--font); font-size: 17px; line-height: 1.65; }
h1, h2, h3, h4 { font-family: var(--font-head); color: var(--ink); line-height: 1.2; }
a { color: var(--accent-ink); }
.wrap { max-width: var(--maxw); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { color: var(--ink); }
:focus-visible { outline: 3px solid var(--accent-ink); outline-offset: 2px; }
.site-header :focus-visible { outline-color: var(--head-ink); }
.site-footer :focus-visible { outline-color: var(--foot-ink); }

/* header and wordmark */
.site-header { border: 0; border-bottom: 1px solid var(--line); background: var(--head-bg); color: var(--head-ink); }
.header-row { padding-top: 14px; padding-bottom: 14px; }
.brand { color: var(--head-ink); display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.logo-text { font-family: var(--font-head); font-weight: 700; font-size: 1.25rem; letter-spacing: -.01em; line-height: 1.1; }
.logo-mark { height: 32px; width: 32px; flex: none; display: block; }
.site-header nav a { color: var(--head-ink); border-radius: var(--radius); }
.site-header nav a:hover { background: transparent; }
.site-header nav a[aria-current="page"] { background: transparent; color: var(--head-ink); }

/* hero (home) */
.t-hero { padding: calc(52px * var(--d)) 0 calc(40px * var(--d)); }
.t-hero .hero-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 36px; align-items: start; }
.t-hero h1 { font-size: clamp(1.9rem, 4.4vw, 2.8rem); margin: 0 0 14px; letter-spacing: -.015em; }
.t-hero .lede { color: var(--muted); font-size: 1.12rem; margin: 0; max-width: 38em; }
.eyebrow { margin: 0 0 10px; font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--accent-ink); }
.hero-panel { border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius); padding: 20px 22px; }
.hero-panel h2 { margin: 0 0 8px; font-size: 1rem; }
.hero-panel ul { margin: 0; padding-left: 1.1em; }
.hero-panel li { margin: .35em 0; }
.t-note { margin-bottom: 8px; }
.t-note .disclosure-note, .article .disclosure-note { margin: 18px 0; border-radius: var(--radius); }
.t-intro, .t-topics, .t-feature { padding-top: calc(24px * var(--d)); padding-bottom: calc(24px * var(--d)); }
.t-intro h2 { margin-top: 0; }
.t-topics > h2 { margin: 0 0 calc(18px * var(--d)); font-size: 1.5rem; }
.t-soon { color: var(--muted); font-size: .92rem; margin-top: 18px; }

/* entries (home lists) */
.entries { display: grid; gap: calc(20px * var(--d)); }
.entry { display: grid; gap: 10px; }
.entry-cover { display: block; overflow: hidden; background: var(--surface); }
.entry-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.entry-ph { display: flex; flex-direction: column; justify-content: flex-end; padding: 14px 16px; text-decoration: none; color: var(--ink); }
.entry-body { min-width: 0; }
.entry-kicker { margin: 0 0 6px; display: flex; gap: 10px; align-items: baseline; font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.entry-no { font-variant-numeric: tabular-nums; }
.entry h3, .entry h4 { margin: 0 0 6px; font-size: 1.2rem; }
.entry h3 a, .entry h4 a, .feature h2 a { color: var(--ink); text-decoration: none; }
.entry h3 a:hover, .entry h4 a:hover, .feature h2 a:hover { text-decoration: underline; text-underline-offset: 3px; }
.entry-ex { margin: 0 0 8px; color: var(--muted); font-size: .97rem; }
.entry-meta { margin: 0; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: .82rem; color: var(--muted); }
.group-head h3 { margin: 0 0 4px; font-size: 1.2rem; }
.group-blurb { margin: 0 0 14px; color: var(--muted); font-size: .95rem; }
.group { margin: 0 0 calc(34px * var(--d)); }
.feature { display: grid; gap: 18px; }
.feature-cover { display: block; overflow: hidden; }
.feature-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.feature h2 { margin: 0 0 10px; }

/* simple pages and articles */
.page, .article { max-width: 800px; padding-top: calc(36px * var(--d)); padding-bottom: calc(56px * var(--d)); }
.page h1, .article h1 { font-size: clamp(1.9rem, 4.2vw, 2.7rem); margin: 0 0 14px; letter-spacing: -.015em; }
.page .prose h2, .article .prose h2 { font-size: 1.45rem; margin: 2em 0 .5em; }
.prose { max-width: 44rem; }
.article .art-head .eyebrow { margin-bottom: 8px; }
.meta { color: var(--muted); }
.art-cover { margin: 0 0 28px; }
.art-cover img { display: block; width: 100%; height: auto; object-fit: cover; }
.facts { margin: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: .88rem; }
.facts dt { font-size: .72rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.facts dd { margin: 0; color: var(--ink); font-weight: 600; }
.toc ol { margin: 0; padding-left: 1.1em; }
.toc li { margin: .3em 0; font-size: .92rem; }
.toc-title { margin: 0 0 6px; font-size: .78rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.table-wrap { border-radius: var(--radius); }
table { font-size: .95rem; }
thead th { background: var(--surface); color: var(--ink); }
tbody th { background: transparent; }
th, td { border-bottom-color: var(--line); }
.table-wrap { border-color: var(--line); }
code { background: var(--surface); }
blockquote { border-left-color: var(--accent); color: var(--muted); }
.faq { border-top-color: var(--line); }
.sources { border-top-color: var(--line); }
.cta-box { background: var(--surface); border: 2px solid var(--accent); border-radius: var(--radius); }
.cta-box a { color: var(--ink); text-decoration-color: var(--accent); }
.crumbs, .crumbs a, .crumbs li + li::before { color: var(--muted); }
.crumbs [aria-current="page"] { color: var(--ink); }
.draft-banner { border-radius: var(--radius); }
.shot img { border-color: var(--line); }
.shot figcaption { color: var(--muted); }
.demo-band { padding-top: calc(24px * var(--d)); padding-bottom: calc(24px * var(--d)); }
.demo-band .demo-intro { color: var(--muted); }
.demo-band .demo-link a { font-weight: 700; }

/* footer */
.site-footer { margin-top: calc(48px * var(--d)); background: var(--foot-bg); color: var(--foot-ink); border: 0; padding: 36px 0 26px; }
.site-footer .brand { color: var(--foot-ink); }
.site-footer a { color: var(--foot-ink); }
.site-footer nav a { color: var(--foot-ink); font-weight: 600; }
.footer-tag { color: var(--foot-ink); opacity: .86; }
.footer-disclosure { border-top: 1px solid color-mix(in srgb, var(--foot-ink) 28%, transparent); }
.footer-disclosure p { color: var(--foot-ink); opacity: .9; }
.footer-note { margin-top: 6px !important; font-size: .82rem !important; opacity: .78 !important; }

/* docs sidebar markup exists only on the docs layout; hidden everywhere else just in case */
.docs-toggle, .docs-toggle-label { display: none; }

@media (max-width: 860px) {
  .t-hero .hero-grid { grid-template-columns: 1fr; gap: 22px; }
  .page, .article { padding-top: 26px; padding-bottom: 40px; }
}
@media (max-width: 760px) {
  body { font-size: 16.5px; }
  .header-row { gap: 6px 16px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }

/* DOCUMENT layout (wmssoftwares.com): a formal buying guide. The page is a sheet of paper on a grey desk, serif type,
   numbered sections (1., 1.1), a document-control table and contents list, dot-leader contents on the home page.
   Burgundy and grey. */
.theme-document { --maxw: 900px; font-size: 18px; line-height: 1.7; hyphens: manual; }
.theme-document h1, .theme-document h2, .theme-document h3, .theme-document h4 { font-weight: 700; letter-spacing: -.005em; }

/* running header on the desk */
.theme-document .site-header { background: transparent; border: 0; }
.theme-document .site-header .wrap { max-width: 900px; }
.theme-document .header-row { padding-top: 22px; padding-bottom: 12px; border-bottom: 1px solid #b9b5ae; margin: 0 auto; width: calc(100% - 40px); max-width: 860px; padding-left: 0; padding-right: 0; }
.theme-document .logo-text { font-size: 1.15rem; font-variant: small-caps; letter-spacing: .06em; font-weight: 700; color: var(--accent); }
.theme-document .site-header nav { gap: 0 2px; }
.theme-document .site-header nav a { padding: 4px 10px; font-size: .84rem; font-variant: small-caps; letter-spacing: .08em; font-weight: 700; color: var(--accent2); border-radius: 0; }
.theme-document .site-header nav a:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 4px; }
.theme-document .site-header nav a[aria-current="page"] { color: var(--accent); box-shadow: inset 0 -2px 0 var(--accent); }

/* the sheet */
.theme-document main { max-width: 900px; margin: 22px auto 0; padding: 64px 76px 72px; background: var(--x-paper); box-shadow: 0 0 0 1px #cfcbc4, 0 22px 40px -26px rgba(40, 30, 20, .45), 7px 7px 0 -1px #f3f1ee, 7px 7px 0 0 #cfcbc4; counter-reset: part; }
.theme-document main .wrap { max-width: none; padding: 0; margin: 0; }
.theme-document .page, .theme-document .article { padding: 0; max-width: none; }

/* home as a cover page and contents */
.theme-document .t-hero { padding: 0 0 26px; border-bottom: 3px double var(--ink); margin-bottom: 8px; }
.theme-document .t-hero .hero-grid { grid-template-columns: 1fr; gap: 26px; }
.theme-document .eyebrow { font-variant: small-caps; text-transform: none; letter-spacing: .14em; font-size: .98rem; font-weight: 700; color: var(--accent); margin-bottom: 14px; }
.theme-document .t-hero h1 { font-size: clamp(2.1rem, 5vw, 3rem); line-height: 1.1; letter-spacing: -.015em; padding-top: 18px; border-top: 6px solid var(--accent); margin: 0 0 14px; text-wrap: balance; }
.theme-document .t-hero .lede { font-size: 1.15rem; font-style: italic; color: var(--muted); max-width: 34em; }
.theme-document .hero-panel { border: 1px solid var(--ink); border-radius: 0; background: var(--surface); padding: 0; }
.theme-document .hero-panel h2 { margin: 0; padding: 7px 16px; background: var(--accent2); color: #fff; font-size: .86rem; font-variant: small-caps; letter-spacing: .12em; font-weight: 700; }
.theme-document .hero-panel ul { margin: 0; padding: 8px 16px 10px 44px; counter-reset: dp; list-style: none; }
.theme-document .hero-panel li { counter-increment: dp; position: relative; margin: 0; padding: 5px 0; font-size: .98rem; line-height: 1.45; border-top: 1px solid var(--line); }
.theme-document .hero-panel li:first-child { border-top: 0; }
.theme-document .hero-panel li::before { content: counter(dp) "."; position: absolute; left: -28px; font-weight: 700; color: var(--accent); }
.theme-document .t-note { padding-top: 10px; }
.theme-document .t-intro { padding-top: 12px; }
.theme-document .t-intro .prose { max-width: none; }
.theme-document .t-intro h2, .theme-document .demo-band h2 { font-size: 1.45rem; color: var(--accent); margin: 1.4em 0 .4em; }
.theme-document .t-topics > h2 { font-size: .98rem; font-variant: small-caps; letter-spacing: .16em; color: var(--accent2); padding-bottom: 6px; border-bottom: 1px solid var(--ink); margin: 14px 0 6px; }
.theme-document .group { counter-increment: part; margin-bottom: 18px; }
.theme-document .group-head { margin-top: 18px; }
.theme-document .group-head h3 { font-size: 1.2rem; color: var(--accent); margin: 0; }
.theme-document .group-head h3::before { content: "Part " counter(part, upper-alpha) ". "; font-variant: small-caps; letter-spacing: .04em; color: var(--accent2); }
.theme-document .group-blurb { margin: 2px 0 8px; font-style: italic; font-size: .95rem; }
.theme-document .doc-toc { list-style: none; margin: 0; padding: 0; }
.theme-document .doc-toc li { margin: 0; padding: 8px 0 8px; border-bottom: 1px solid var(--line); }
.theme-document .toc-row { display: flex; align-items: baseline; gap: 0; }
.theme-document .toc-row a { font-size: 1.1rem; font-weight: 700; color: var(--ink); text-decoration: none; max-width: 84%; }
.theme-document .toc-row a:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 4px; }
.theme-document .dots { flex: 1; min-width: 20px; margin: 0 6px; border-bottom: 2px dotted #8b8f97; transform: translateY(-4px); }
.theme-document .doc-toc .entry-no { font-variant-numeric: lining-nums tabular-nums; font-weight: 700; color: var(--accent); }
.theme-document .toc-ex { display: block; margin-top: 2px; font-size: .9rem; color: var(--muted); font-style: italic; max-width: 90%; }

/* articles: document control, contents, numbered sections */
.theme-document .crumbs { font-size: .82rem; font-style: italic; margin-bottom: 18px; }
.theme-document .art-head .eyebrow { margin-bottom: 8px; }
.theme-document .article h1, .theme-document .page h1 { font-size: clamp(1.9rem, 4.6vw, 2.6rem); line-height: 1.12; letter-spacing: -.012em; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 3px double var(--ink); text-wrap: balance; }
.theme-document .facts { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--ink); margin: 0 0 22px; font-size: .9rem; }
.theme-document .facts > div { display: grid; grid-template-columns: 8.4rem 1fr; border-bottom: 1px solid var(--line); }
.theme-document .facts > div:nth-child(odd) { border-right: 1px solid var(--line); }
.theme-document .facts > div:nth-last-child(-n+2) { border-bottom: 0; }
.theme-document .facts dt { padding: 5px 10px; background: var(--surface); font-size: .76rem; font-variant: small-caps; letter-spacing: .1em; font-weight: 700; text-transform: none; color: var(--accent2); }
.theme-document .facts dd { padding: 5px 10px; font-weight: 400; }
.theme-document .art-head .disclosure-note { margin: 0 0 22px; }
.theme-document .toc { margin: 0 0 26px; padding: 12px 18px 12px; border: 1px solid var(--ink); background: var(--x-paper); }
.theme-document .toc-title { font-size: .86rem; font-variant: small-caps; letter-spacing: .14em; color: var(--accent2); margin-bottom: 4px; text-transform: none; }
.theme-document .toc ol { list-style: none; counter-reset: tc; padding: 0; columns: 2; column-gap: 28px; }
.theme-document .toc li { counter-increment: tc; position: relative; margin: 0; padding: 3px 0 3px 2rem; font-size: .93rem; line-height: 1.4; break-inside: avoid; }
.theme-document .toc li::before { content: counter(tc) "."; position: absolute; left: 0; width: 1.6rem; text-align: right; font-weight: 700; color: var(--accent); }
.theme-document .toc a { color: var(--ink); text-decoration: none; }
.theme-document .toc a:hover { color: var(--accent); text-decoration: underline; }
.theme-document .art-cover { margin: 0 0 28px; border: 1px solid var(--ink); padding: 5px; background: var(--x-paper); }
.theme-document .art-cover img { aspect-ratio: 21 / 9; }
.theme-document .prose { max-width: none; counter-reset: sec; }
.theme-document .prose p { text-align: justify; hyphens: auto; margin: 0 0 1.05em; }
.theme-document .prose > h2 { position: relative; counter-increment: sec; counter-reset: sub; font-size: 1.55rem; line-height: 1.2; color: var(--accent); margin: 2em 0 .5em; padding-left: 2.3rem; padding-bottom: 5px; border-bottom: 1px solid var(--ink); }
.theme-document .prose > h2::before { content: counter(sec) "."; position: absolute; left: 0; }
.theme-document .prose h3 { position: relative; counter-increment: sub; font-size: 1.15rem; margin: 1.6em 0 .35em; padding-left: 2.3rem; color: var(--ink); }
.theme-document .prose h3::before { content: counter(sec) "." counter(sub); position: absolute; left: 0; color: var(--accent); }
.theme-document .prose li { margin: .4em 0; }
.theme-document .prose li::marker { color: var(--accent); }
.theme-document blockquote { margin: 1.4em 2em; padding: 0 0 0 1.2em; border-left: 3px solid var(--accent); font-style: italic; color: var(--ink); }
.theme-document .table-wrap { border: 0; border-top: 2px solid var(--ink); border-bottom: 2px solid var(--ink); border-radius: 0; margin: 1.3em 0 1.6em; }
.theme-document table { font-size: .9rem; line-height: 1.45; }
.theme-document th, .theme-document td { padding: 7px 12px; border-right: 1px solid var(--line); }
.theme-document th:last-child, .theme-document td:last-child { border-right: 0; }
.theme-document thead th { background: var(--accent2); color: #fff; font-size: .78rem; font-variant: small-caps; letter-spacing: .1em; font-weight: 700; }
.theme-document tbody th { font-weight: 700; background: var(--surface); }
.theme-document .cta-box { position: relative; margin: 2.4em 0 1em; padding: 26px 22px 14px; border: 1px solid var(--ink); background: var(--surface); border-radius: 0; }
.theme-document .cta-box::before { content: "Note from the publisher"; position: absolute; top: -.72em; left: 16px; padding: 0 8px; background: var(--x-paper); font-size: .78rem; font-variant: small-caps; letter-spacing: .12em; font-weight: 700; color: var(--accent2); }
.theme-document .cta-box a { font-size: 1rem; font-weight: 400; color: var(--ink); }
.theme-document .faq { border-top: 1px solid var(--ink); }
.theme-document .faq h2 { font-size: 1.3rem; color: var(--accent); }
.theme-document .faq h3 { font-size: 1.05rem; margin: 1.3em 0 .15em; }
.theme-document .sources { border-top: 1px solid var(--ink); font-size: .92rem; }
.theme-document .sources h2 { font-size: .86rem; font-variant: small-caps; letter-spacing: .14em; color: var(--accent2); }
.theme-document .disclosure-note { border: 1px solid var(--ink); background: var(--surface); border-radius: 0; font-style: italic; font-weight: 400; }
.theme-document .shot img { border: 1px solid var(--ink); border-radius: 0; padding: 4px; background: var(--x-paper); }

/* footer: quiet, on the desk */
.theme-document .site-footer { margin-top: 30px; padding: 22px 0 30px; border-top: 0; }
.theme-document .site-footer .wrap { max-width: 900px; padding: 0 20px; }
.theme-document .site-footer .footer-grid { padding-top: 14px; border-top: 1px solid #b9b5ae; }
.theme-document .site-footer .logo-text { color: var(--accent); }
.theme-document .site-footer nav a { font-variant: small-caps; letter-spacing: .06em; font-weight: 700; color: var(--accent2); }
.theme-document .footer-disclosure { border-top: 0; margin-top: 4px; padding-top: 6px; }

@media (max-width: 760px) {
  .theme-document { font-size: 17px; }
  .theme-document main { margin: 14px 0 0; padding: 30px 20px 40px; box-shadow: 0 1px 0 #cfcbc4; }
  .theme-document .prose p { text-align: left; hyphens: manual; }
  .theme-document .facts { grid-template-columns: 1fr; }
  .theme-document .facts > div:nth-child(odd) { border-right: 0; }
  .theme-document .facts > div:nth-last-child(2) { border-bottom: 1px solid var(--line); }
  .theme-document .toc ol { columns: 1; }
  .theme-document blockquote { margin-left: .4em; margin-right: 0; }
  .theme-document .toc-row a { max-width: 78%; }
}
