/* 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; } }

/* INDUSTRIAL layout (warehousemanagementsoftwares.com): big blocks, diagonal cuts, hazard stripes, heavy uppercase labels,
   a black header. Safety yellow and black on a concrete page; black text on yellow, yellow text on black only. */
.theme-industrial { --maxw: 1160px; font-size: 17px; line-height: 1.6; --hazard: repeating-linear-gradient(-45deg, var(--accent) 0 12px, var(--accent2) 12px 24px); }
.theme-industrial h1, .theme-industrial h2, .theme-industrial h3, .theme-industrial h4 { font-weight: 900; text-transform: uppercase; letter-spacing: -.01em; line-height: 1.02; }

/* header: black, hazard stripe under it */
.theme-industrial .site-header { background: var(--head-bg); color: #fff; border: 0; position: relative; }
.theme-industrial .site-header::after { content: ""; display: block; height: 12px; background: var(--hazard); }
.theme-industrial .header-row { padding-top: 14px; padding-bottom: 14px; }
.theme-industrial .brand { color: #fff; }
.theme-industrial .logo-text { font-family: var(--font-head); font-size: 1rem; font-weight: 900; text-transform: uppercase; letter-spacing: .03em; color: #fff; line-height: 1.05; }
.theme-industrial .brand:not(:has(.logo-mark)) .logo-text::before { content: ""; display: inline-block; width: 12px; height: 22px; margin-right: 12px; background: var(--accent); transform: skewX(-20deg); vertical-align: -5px; }
.theme-industrial .site-header nav { gap: 2px; }
.theme-industrial .site-header nav a { padding: 8px 13px; color: #fff; font-size: .74rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; border-radius: 0; }
.theme-industrial .site-header nav a:hover { background: #2a2a2a; }
.theme-industrial .site-header nav a[aria-current="page"] { background: var(--accent); color: #111; }

/* hero: yellow slab with a diagonal bottom edge, black panel */
.theme-industrial .t-hero { background: var(--accent); color: #111; padding: calc(54px * var(--d)) 0 calc(104px * var(--d)); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 52px), 0 100%); margin-bottom: -26px; }
.theme-industrial .t-hero .hero-grid { grid-template-columns: minmax(0, 1.55fr) minmax(280px, 1fr); gap: 44px; align-items: end; }
.theme-industrial .eyebrow { display: inline-block; padding: 4px 11px; background: #111; color: var(--accent); font-size: .72rem; font-weight: 900; letter-spacing: .14em; }
.theme-industrial .t-hero h1 { font-size: clamp(2.3rem, 6.8vw, 5.1rem); line-height: .93; letter-spacing: -.025em; margin: 16px 0 18px; color: #111; text-wrap: balance; }
.theme-industrial .t-hero .lede { color: #111; font-size: 1.12rem; font-weight: 600; max-width: 32em; }
.theme-industrial .hero-panel { background: #111; border: 0; border-radius: 0; padding: 0; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 22px), calc(100% - 22px) 100%, 0 100%); }
.theme-industrial .hero-panel h2 { margin: 0; padding: 12px 18px; background: #111; color: var(--accent); font-size: .85rem; letter-spacing: .14em; border-bottom: 10px solid transparent; border-image: var(--hazard) 1; border-image-width: 0 0 10px 0; }
.theme-industrial .hero-panel ul { list-style: none; margin: 0; padding: 8px 18px 30px; }
.theme-industrial .hero-panel li { position: relative; margin: 0; padding: 9px 0 9px 22px; color: #fff; font-weight: 700; font-size: .95rem; line-height: 1.35; border-top: 1px solid #3a3a3a; }
.theme-industrial .hero-panel li:first-child { border-top: 0; }
.theme-industrial .hero-panel li::before { content: ""; position: absolute; left: 0; top: 1.05em; width: 10px; height: 10px; background: var(--accent); }
.theme-industrial .t-intro { padding-top: 12px; }
.theme-industrial .t-intro .prose { max-width: 46rem; font-weight: 500; }
.theme-industrial .t-intro h2 { font-size: 1.7rem; padding-left: 16px; border-left: 14px solid var(--accent); }
.theme-industrial .t-topics > h2 { font-size: clamp(1.8rem, 4vw, 2.6rem); margin-bottom: 22px; display: inline-block; background: #111; color: var(--accent); padding: 8px 16px; }

/* groups: black label bar, big cut-corner blocks */
.theme-industrial .t-topics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 34px; align-items: start; }
.theme-industrial .t-topics > h2, .theme-industrial .t-topics > .t-soon { grid-column: 1 / -1; }
.theme-industrial .group { margin-bottom: 44px; min-width: 0; }
.theme-industrial .group-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 18px; margin-bottom: 14px; padding-bottom: 8px; border-bottom: 5px solid #111; }
.theme-industrial .group-head h3 { margin: 0; font-size: 1.35rem; }
.theme-industrial .group-head h3::before { content: ""; display: inline-block; width: 14px; height: 14px; margin-right: 10px; background: var(--accent); border: 3px solid #111; }
.theme-industrial .group-blurb { margin: 0; font-size: .92rem; font-weight: 600; }
.theme-industrial .entries { grid-template-columns: minmax(0, 1fr); gap: 22px; }
.theme-industrial .entry { position: relative; gap: 0; background: #fff; border-left: 14px solid var(--accent); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 30px), calc(100% - 30px) 100%, 0 100%); transition: background-color .12s ease; align-content: start; }
.theme-industrial .entry:hover, .theme-industrial .entry:focus-within { background: var(--accent); }
.theme-industrial .entry:hover .entry-ex, .theme-industrial .entry:hover .entry-meta, .theme-industrial .entry:hover .entry-cat, .theme-industrial .entry:focus-within .entry-ex, .theme-industrial .entry:focus-within .entry-meta, .theme-industrial .entry:focus-within .entry-cat { color: #111; }
.theme-industrial .entry h4 a:focus-visible { outline: 0; text-decoration: underline; text-decoration-thickness: 4px; }
.theme-industrial .cta-box a:focus-visible { outline-offset: 0; background: #111; color: var(--accent); }
.theme-industrial .entry-cover { aspect-ratio: 16 / 9; clip-path: polygon(0 0, 100% 0, 100% 84%, 0 100%); margin-bottom: -10px; }
.theme-industrial .entry-ph { aspect-ratio: auto; height: 132px; background: #111; position: relative; justify-content: flex-start; padding: 14px 18px; }
.theme-industrial .entry-ph::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 10px; background: var(--hazard); }
.theme-industrial .ph-no { font-family: var(--font-head); font-size: 4.8rem; line-height: .9; font-weight: 900; color: transparent; -webkit-text-stroke: 2px var(--accent); letter-spacing: -.03em; }
.theme-industrial .ph-cat { color: var(--accent); font-size: .72rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; margin-top: auto; }
.theme-industrial .entry-body { padding: 16px 22px 40px 18px; }
.theme-industrial .entry-kicker { font-size: .7rem; font-weight: 900; letter-spacing: .14em; color: #111; gap: 12px; margin-bottom: 8px; }
.theme-industrial .entry-no { padding: 1px 8px; background: #111; color: var(--accent); }
.theme-industrial .entry-no::before { content: "Section "; }
.theme-industrial .entry-cat { color: var(--muted); }
.theme-industrial .entry h4 { font-size: 1.3rem; line-height: 1.03; margin-bottom: 8px; }
.theme-industrial .entry h4 a::after { content: ""; position: absolute; inset: 0; }
.theme-industrial .entry-ex { font-weight: 500; font-size: .95rem; }
.theme-industrial .entry-meta { font-size: .68rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }

/* articles: black title slab, hazard stripe, diagonal cover, yellow-headed tables */
.theme-industrial .article, .theme-industrial .page { max-width: 1000px; }
.theme-industrial .page { max-width: 840px; }
.theme-industrial .crumbs { font-size: .72rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.theme-industrial .art-head { background: #111; color: #fff; padding: 30px clamp(20px, 4vw, 44px) 26px; position: relative; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 22px), calc(100% - 22px) 100%, 0 100%); margin-bottom: 8px; border-top: 12px solid transparent; border-image: var(--hazard) 1; border-image-width: 12px 0 0 0; }
.theme-industrial .art-head .eyebrow { background: var(--accent); color: #111; margin-bottom: 14px; }
.theme-industrial .article h1 { color: #fff; font-size: clamp(2rem, 5vw, 3.5rem); line-height: .96; letter-spacing: -.02em; margin-bottom: 18px; text-wrap: balance; }
.theme-industrial .page h1 { font-size: clamp(2rem, 5vw, 3.3rem); line-height: .96; padding-left: 16px; border-left: 14px solid var(--accent); }
.theme-industrial .facts { gap: 8px 26px; }
.theme-industrial .facts dt { color: var(--accent); font-size: .66rem; letter-spacing: .14em; font-weight: 900; }
.theme-industrial .facts dd { color: #fff; font-weight: 700; text-transform: uppercase; font-size: .84rem; letter-spacing: .03em; }
.theme-industrial .art-head .disclosure-note { margin: 16px 0 0; background: var(--accent); color: #111; border: 0; border-radius: 0; font-weight: 800; }
.theme-industrial .art-cover { margin: 0 0 40px; clip-path: polygon(0 0, 100% 0, 100% 92%, 0 100%); }
.theme-industrial .art-cover img { aspect-ratio: 2 / 1; }
.theme-industrial .art-main { max-width: 46rem; margin: 0 auto; }
.theme-industrial .prose { max-width: none; font-weight: 500; line-height: 1.7; }
.theme-industrial .prose h2 { font-size: clamp(1.45rem, 3vw, 1.95rem); margin: 2.2em 0 .6em; padding: 6px 0 6px 16px; border-left: 14px solid var(--accent); border-bottom: 4px solid #111; }
.theme-industrial .prose h3 { font-size: 1.05rem; letter-spacing: .02em; margin: 1.6em 0 .3em; }
.theme-industrial .prose li::marker { color: #111; font-weight: 900; }
.theme-industrial .prose strong { font-weight: 800; background: color-mix(in srgb, var(--accent) 45%, transparent); padding: 0 2px; }
.theme-industrial blockquote { margin: 1.6em 0; padding: 16px 22px; background: #fff; border-left: 14px solid #111; color: #111; font-weight: 800; font-size: 1.12rem; }
.theme-industrial .table-wrap { border: 4px solid #111; border-radius: 0; background: #fff; margin: 1.5em 0; }
.theme-industrial table { font-size: .92rem; }
.theme-industrial thead th { background: #111; color: var(--accent); font-size: .7rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.theme-industrial tbody th { background: var(--accent); color: #111; font-size: .78rem; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.theme-industrial th, .theme-industrial td { border-bottom: 2px solid #111; }
.theme-industrial tbody tr:last-child th, .theme-industrial tbody tr:last-child td { border-bottom: 0; }
.theme-industrial .cta-box { margin-top: 3em; padding: 28px 28px 24px; background: var(--accent); border: 0; border-radius: 0; position: relative; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 24px), calc(100% - 24px) 100%, 0 100%); border-top: 12px solid transparent; border-image: var(--hazard) 1; border-image-width: 12px 0 0 0; }
.theme-industrial .cta-box a { color: #111; font-size: 1.15rem; font-weight: 900; line-height: 1.35; text-decoration-color: #111; text-decoration-thickness: 3px; }
.theme-industrial .faq { border-top: 6px solid #111; }
.theme-industrial .faq h3 { font-size: 1rem; margin: 1.5em 0 .2em; }
.theme-industrial .faq h3::before { content: ""; display: inline-block; width: 12px; height: 12px; margin-right: 10px; background: var(--accent); border: 2px solid #111; }
.theme-industrial .sources { border-top: 4px solid #111; }
.theme-industrial .sources h2 { font-size: .8rem; letter-spacing: .14em; }
.theme-industrial .disclosure-note { border: 4px solid #111; border-radius: 0; background: #fff; font-weight: 800; }
.theme-industrial .shot img { border: 4px solid #111; border-radius: 0; }
.theme-industrial .demo-band h2 { font-size: clamp(1.7rem, 3.6vw, 2.3rem); display: inline-block; background: #111; color: var(--accent); padding: 6px 14px; }
.theme-industrial .site-footer { margin-top: 64px; padding-top: 0; position: relative; }
.theme-industrial .site-footer::before { content: ""; display: block; height: 14px; background: var(--hazard); margin-bottom: 34px; }
.theme-industrial .site-footer .logo-text { color: #fff; }
.theme-industrial .site-footer .brand:not(:has(.logo-mark)) .logo-text::before { background: var(--accent); }

@media (max-width: 860px) {
  .theme-industrial .t-topics { grid-template-columns: 1fr; }
  .theme-industrial .t-hero .hero-grid { grid-template-columns: 1fr; gap: 28px; }
  .theme-industrial .t-hero { padding-bottom: 80px; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 34px), 0 100%); }
}
@media (max-width: 520px) {
  .theme-industrial .site-header nav a { padding: 7px 9px; letter-spacing: .06em; }
  .theme-industrial .entry { border-left-width: 10px; }
}