/* AiMidWare: warm reading surfaces, deep-blue structure and restrained amber.
   Owner-selected direction, 27 October 2026. One light presentation;
   OS dark preference does not replace the reading surfaces. */

:root {
  color-scheme: light;
  /* invariant: rhythm and shape */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --gutter: 16px;
  --measure: 68ch;
  --type-body: 1.0625rem;
  --type-lead: 1.125rem;
  --type-title: clamp(2rem, 3.6vw, 2.75rem);
  --type-section: clamp(1.5rem, 2.25vw, 1.875rem);
  --reading-width: 44rem;
  --radius-control: 6px;
  --radius-card: 8px;
  --radius-pill: 999px;
  --control-height: 48px;
  --focus-width: 3px;
  --focus-offset: 2px;
  --motion-fast: 160ms;
  --motion-ease: cubic-bezier(0.2, 0, 0, 1);

  /* invariant: type families */
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "Cascadia Mono", "Consolas", "Menlo", monospace;
  --font-serif: var(--font-sans);
  --font-display: var(--font-sans);
  --display-scale: 1;
  --display-family: var(--font-display);
  --heading-family: var(--font-sans);

  /* light scheme: ink on paper, one signal colour for "the middle" */
  --color-ground: #F8F6F0;
  --color-surface: #FFFFFF;
  --color-surface-2: #EEEDE6;
  --color-ink: #142C43;
  --color-ink-soft: #344C60;
  --color-ink-muted: #596877;
  --color-line: #D6D9D8;
  --color-line-strong: #84939A;
  --color-accent: #155E81;
  --color-accent-hover: #0B405D;
  --color-on-accent: #FFFFFF;
  --color-accent-2: #875300;
  --color-signal: #E6A93D;
  --color-band: #142C43;
  --color-on-band: #FAF8F1;
  --color-on-band-muted: #CDD7DF;
  --color-band-link: #E9BC69;
  --color-badge-bg: #E4EAF0;
  --color-badge-ink: #30485D;
  --color-blocked-bg: #E9EDF1;
  --color-blocked-ink: #344C60;
  --color-illustration: #E4EAE8;
  --color-focus: #155E81;
  --color-error: #9B1C2E;
}

/* Self-hosted fonts, static instances split by script. IBM Plex Sans carries
   body and headings; JetBrains Mono carries labels, eyebrows and code-like
   accents.

   The IBM Plex Sans files are IBM's own unmodified split builds from the
   @ibm/plex-sans 1.1.0 archive (Latin1 and Greek splits, served under our
   stem names), with the unicode-range values IBM's split CSS gives for them.
   Because the files are unmodified, the Reserved Font Name "Plex" stays
   valid. Characters outside IBM's Latin1 split (Latin Extended letters such
   as c-caron, l-stroke and s-comma, thin and hair spaces, U+2010 and U+2011
   hyphens, primes, arrows) render in the fallback font.

   The JetBrains Mono files are our own subsets: Latin covers Basic Latin,
   Latin-1, Latin Extended-A and B and general punctuation, and Greek covers
   the monotonic block.

   font-display: optional keeps layout stable: the page paints with the
   fallback when a font is late and never shifts afterwards. Shipped weights
   are sans 400, 400 italic, 600 and 700, and mono 400. There are no 500 faces
   (font budget), so weight 500 resolves to 400. Preload only
   ibm-plex-sans-400, plus its Greek file on Greek pages. */

@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/ibm-plex-sans-400.latin.woff2") format("woff2"); unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2212, U+FB01-FB02; }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/ibm-plex-sans-400.greek.woff2") format("woff2"); unicode-range: U+037E, U+0386-038A, U+038C, U+038E-03A1, U+03A3-03CE; }
@font-face { font-family: "IBM Plex Sans"; font-style: italic; font-weight: 400; font-display: swap; src: url("/assets/fonts/ibm-plex-sans-400i.latin.woff2") format("woff2"); unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2212, U+FB01-FB02; }
@font-face { font-family: "IBM Plex Sans"; font-style: italic; font-weight: 400; font-display: swap; src: url("/assets/fonts/ibm-plex-sans-400i.greek.woff2") format("woff2"); unicode-range: U+037E, U+0386-038A, U+038C, U+038E-03A1, U+03A3-03CE; }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/ibm-plex-sans-600.latin.woff2") format("woff2"); unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2212, U+FB01-FB02; }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/ibm-plex-sans-600.greek.woff2") format("woff2"); unicode-range: U+037E, U+0386-038A, U+038C, U+038E-03A1, U+03A3-03CE; }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/fonts/ibm-plex-sans-700.latin.woff2") format("woff2"); unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2212, U+FB01-FB02; }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/fonts/ibm-plex-sans-700.greek.woff2") format("woff2"); unicode-range: U+037E, U+0386-038A, U+038C, U+038E-03A1, U+03A3-03CE; }

@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/jetbrains-mono-400.latin.woff2") format("woff2"); unicode-range: U+0000-024F, U+0259, U+02BB-02BC, U+02C6-02CC, U+02DA, U+02DC, U+0300-0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2000-206F, U+20AC, U+2113, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/jetbrains-mono-400.greek.woff2") format("woff2"); unicode-range: U+0370-03FF; }

/* AiMidWare components. Local assets and token-based colours/type; strict CSP. */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: var(--type-body);
  line-height: 1.6;
  color: var(--color-ink);
  background: var(--color-ground);
  font-synthesis: none;
  overflow-wrap: anywhere;
}
:lang(el) body, body:lang(el) { line-height: 1.6; }

h1, h2, h3, h4 { margin: 0; font-weight: 600; line-height: 1.25; text-wrap: pretty; }
h1 { font-family: var(--display-family); font-size: calc(clamp(2rem, 5vw, 3.25rem) * var(--display-scale)); letter-spacing: -0.01em; }
h2 { font-family: var(--heading-family); font-size: calc(clamp(1.4rem, 3vw, 1.75rem) * var(--display-scale)); }
h3 { font-family: var(--heading-family); font-size: 1.15rem; }
p { margin: 0; }
p + p, .prose > * + * { margin-top: var(--space-4); }
ul, ol { margin: 0; padding-left: 1.2em; }
li + li { margin-top: var(--space-2); }
a { color: var(--color-accent); text-decoration: underline; text-underline-offset: 0.18em; text-decoration-thickness: 1px; }
a:hover { color: var(--color-accent-hover); }
img, svg { max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
strong { font-weight: 600; }
em { font-style: italic; }
.serif { font-family: var(--font-sans); }
.mono { font-family: var(--font-mono); font-size: 0.875rem; letter-spacing: 0.01em; }
.muted { color: var(--color-ink-muted); }
.small { font-size: 0.875rem; }

:focus-visible { outline: var(--focus-width) solid var(--color-focus); outline-offset: var(--focus-offset); border-radius: 4px; }
::selection { background: var(--color-accent); color: var(--color-on-accent); }

.visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: var(--gutter); max-width: calc(100% - 2 * var(--gutter)); top: 0; transform: translateY(-120%); z-index: 10; display: inline-flex; align-items: center; min-height: 44px; padding: var(--space-2) var(--space-3); background: var(--color-accent); color: var(--color-on-accent); border-radius: var(--radius-control); text-decoration: none; }
.skip-link:focus { top: var(--space-2); transform: translateY(0); }

.container { width: 100%; max-width: 1120px; margin-inline: auto; padding-inline: var(--gutter); }
.stack > * + * { margin-top: var(--space-4); }
.stack-l > * + * { margin-top: var(--space-6); }
.cluster { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
.grid { display: grid; gap: var(--space-3); grid-template-columns: 1fr; }
@media (min-width: 640px) {
  .grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 960px) {
  .grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .grid-2-1 { grid-template-columns: 2fr 1fr 1fr; }
}

/* masthead */
.masthead { border-bottom: 1px solid var(--color-line); background: var(--color-ground); }
.masthead__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); min-height: 56px; }
.brand { display: inline-flex; flex-shrink: 0; white-space: nowrap; align-items: center; gap: 8px; min-height: 44px; text-decoration: none; color: var(--color-ink); font-family: var(--font-sans); font-weight: 600; font-size: 1.0625rem; letter-spacing: -0.01em; }
.brand__mark { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: var(--color-signal); box-shadow: 0 0 0 3px var(--color-ground), 0 0 0 4px var(--color-ink); flex-shrink: 0; }
.brand--umbrella { letter-spacing: 0.01em; }
.mark--compact { display: none; font-family: var(--font-sans); letter-spacing: 0.06em; }
:root[data-presentation="quiet"] .mark--full { display: none; }
:root[data-presentation="quiet"] .mark--compact { display: inline; }
.masthead__actions { display: flex; align-items: center; gap: var(--space-2); }
.locale-link { display: inline-flex; align-items: center; min-height: 44px; padding-inline: var(--space-2); font-size: 0.9375rem; white-space: nowrap; }
@media (max-width: 359px) { .brand { font-size: 0.875rem; } .locale-link { font-size: 0.875rem; padding-inline: var(--space-1); } }
.switch { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 10px; border-radius: var(--radius-pill); border: 1px solid var(--color-line-strong); background: var(--color-surface); color: var(--color-ink); font-size: 0.8125rem; cursor: pointer; }
.switch:hover { border-color: var(--color-accent); }
.switch svg { width: 14px; height: 14px; }
.switch__on { display: none; }
:root[data-presentation="quiet"] .switch__off { display: none; }
:root[data-presentation="quiet"] .switch__on { display: inline; }
.switch-note { display: none; margin: 0; padding-bottom: var(--space-2); font-size: 0.8125rem; color: var(--color-ink-muted); }
:root[data-presentation="quiet"] .switch-note { display: block; }
.no-js .switch { display: none; }
@media (max-width: 639px) {
  .brand { font-size: 1rem; }
  .switch { width: 44px; padding: 0; justify-content: center; }
  .switch__off, .switch__on { display: none !important; }
}
.card .pill { align-self: flex-start; }

.menu { position: relative; }
.menu > summary { list-style: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: var(--radius-control); cursor: pointer; }
.menu > summary::-webkit-details-marker { display: none; }
.menu > summary svg { width: 22px; height: 22px; }
.menu__list { position: absolute; right: 0; top: calc(100% + 4px); min-width: 240px; margin: 0; padding: var(--space-2); list-style: none; background: var(--color-surface); border: 1px solid var(--color-line); border-radius: var(--radius-card); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08); z-index: 5; }
.menu__list li + li { margin-top: 0; }
.menu__list a { display: block; padding: var(--space-3); text-decoration: none; color: var(--color-ink); border-radius: var(--radius-control); }
.menu__list a:hover, .menu__list a:focus-visible { background: var(--color-surface-2); }
.nav-inline { display: none; }
@media (min-width: 960px) {
  .menu { display: none; }
  .nav-inline { display: flex; flex-wrap: wrap; gap: var(--space-5); font-size: 0.9375rem; }
  .nav-inline a { display: inline-flex; white-space: nowrap; align-items: center; min-height: 44px; color: var(--color-ink); text-decoration: none; }
  .nav-inline a:hover { text-decoration: underline; }
}

/* controls */
.button { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: var(--control-height); padding: 0 var(--space-5); border-radius: var(--radius-control); border: 1.5px solid transparent; font-weight: 600; font-size: 1rem; text-decoration: none; cursor: pointer; transition: background-color var(--motion-fast) var(--motion-ease), color var(--motion-fast) var(--motion-ease); }
.button--primary { background: var(--color-accent); color: var(--color-on-accent); }
.button--primary:hover { background: var(--color-accent-hover); color: var(--color-on-accent); }
.button--secondary { background: transparent; color: var(--color-accent); border-color: var(--color-accent); }
.button--secondary:hover { background: var(--color-surface); color: var(--color-accent-hover); }
.pill { display: inline-flex; align-items: center; justify-content: center; text-align: center; min-height: 40px; padding: 6px var(--space-3); border-radius: var(--radius-pill); background: var(--color-badge-bg); color: var(--color-badge-ink); font-size: 0.875rem; font-weight: 600; }
.badge { display: inline-flex; align-items: center; min-height: 22px; padding: 0 8px; border-radius: var(--radius-pill); font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.04em; white-space: nowrap; }
:lang(en) .badge { text-transform: uppercase; }
.badge--planned { background: var(--color-badge-bg); color: var(--color-badge-ink); }
.badge--blocked { background: var(--color-blocked-bg); color: var(--color-blocked-ink); }
.badge--future { background: var(--color-surface-2); color: var(--color-ink-soft); border: 1px dashed var(--color-line-strong); }

/* surfaces */
.section { padding-block: var(--space-6) 0; }
.section__title { margin-bottom: var(--space-3); }
.lede { font-size: 1.0625rem; max-width: var(--measure); }
.card { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4); border-radius: var(--radius-card); background: var(--color-surface); border: 1px solid var(--color-line); }
.card--link { text-decoration: none; color: var(--color-ink); }
.card--link:hover { border-color: var(--color-line-strong); color: var(--color-ink); }
.card__label { font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.04em; color: var(--color-ink-muted); }
:lang(en) .card__label { text-transform: uppercase; letter-spacing: 0.06em; }
.card__title { font-family: var(--font-sans); font-size: 1.0625rem; font-weight: 600; }
.card__list { padding-left: 1.1em; font-size: 0.9375rem; }
.card--blocked { background: var(--color-surface-2); border-style: dashed; border-color: var(--color-line-strong); }
.card__head { display: flex; justify-content: space-between; align-items: center; gap: var(--space-2); }
.notice { padding: var(--space-4); border-radius: var(--radius-card); background: var(--color-surface-2); }

.steps { list-style: none; padding: 0; display: grid; gap: var(--space-3); }
@media (min-width: 960px) { .steps { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.step { display: flex; gap: var(--space-3); padding: var(--space-3); border-radius: var(--radius-card); background: var(--color-surface); border: 1px solid var(--color-line); }
@media (min-width: 960px) { .step { flex-direction: column; padding: var(--space-4); } }
.step__num { font-family: var(--font-mono); font-size: 1.4rem; color: var(--color-accent); width: 24px; flex-shrink: 0; }
.step__body { display: flex; flex-direction: column; gap: 3px; }
.step__title { font-weight: 600; font-size: 0.9375rem; }
.step__text { font-size: 0.875rem; color: var(--color-ink-soft); }
.steps--value { grid-template-columns: 1fr; }
.steps--value .step { flex-direction: row; padding: var(--space-4); }
.steps--value .step__num { font-size: 1.6rem; width: 28px; }
.step__title--value { margin: 0; font-family: var(--font-sans); font-size: 1.1875rem; line-height: 1.25; }
.step__text--value { margin: 0; font-size: 1rem; line-height: 1.55; max-width: var(--measure); }

.band { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-4); border-radius: var(--radius-card); background: var(--color-band); color: var(--color-on-band); }
.band__title { color: inherit; font-size: 1.3rem; }
.band p { color: var(--color-on-band-muted); font-size: 0.9375rem; }
.band a { color: var(--color-band-link); font-weight: 600; }
@media (min-width: 960px) { .band { padding: var(--space-5); } }

.faq { border-top: 1px solid var(--color-line); }
.faq__item { border-bottom: 1px solid var(--color-line); }
.faq__item > summary { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); min-height: 52px; padding: var(--space-3) 0; cursor: pointer; list-style: none; font-size: 1rem; }
.faq__item > summary::-webkit-details-marker { display: none; }
.faq__item > summary svg { width: 20px; height: 20px; flex-shrink: 0; color: var(--color-accent); transition: transform var(--motion-fast) var(--motion-ease); }
.faq__item[open] > summary svg { transform: rotate(180deg); }
.faq__body { padding: 0 0 var(--space-4); color: var(--color-ink-soft); font-size: 0.9375rem; max-width: var(--measure); }

/* forms and states */
.field { display: flex; flex-direction: column; gap: 6px; }
.field__label { font-weight: 600; font-size: 0.9375rem; }
.field__hint { font-size: 0.8125rem; color: var(--color-ink-muted); }
.input { min-height: var(--control-height); padding: 0 var(--space-3); border-radius: var(--radius-control); border: 1.5px solid var(--color-line-strong); background: var(--color-surface); color: var(--color-ink); width: 100%; }
.input:focus { border-color: var(--color-accent); }
.choice { display: flex; align-items: flex-start; gap: var(--space-3); font-size: 0.9375rem; line-height: 1.45; min-height: 44px; }
.choice input { width: 20px; height: 20px; margin: 2px 0 0; flex-shrink: 0; accent-color: var(--color-accent); }
.fieldset { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.fieldset > legend { font-weight: 600; font-size: 0.9375rem; padding: 0; margin-bottom: var(--space-1); }
.radio-pills { display: flex; gap: var(--space-2); }
.radio-pill { display: flex; align-items: center; gap: var(--space-2); flex: 1; min-height: 44px; padding: 0 var(--space-3); border-radius: var(--radius-control); border: 1.5px solid var(--color-line-strong); background: var(--color-surface); cursor: pointer; }
.radio-pill:has(input:checked) { border-color: var(--color-accent); background: var(--color-surface-2); }
.radio-pill input { width: 18px; height: 18px; margin: 0; accent-color: var(--color-accent); }
.status { padding: var(--space-3) 0; font-size: 0.9375rem; }
.alert { color: var(--color-error); }
.state { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-4); border-radius: var(--radius-card); background: var(--color-surface); border: 1px solid var(--color-line); }
.state__label { font-family: var(--font-mono); font-size: 0.6875rem; letter-spacing: 0.08em; color: var(--color-ink-muted); }
:lang(en) .state__label { text-transform: uppercase; }

/* disclosure fields */
.fields { display: flex; flex-direction: column; gap: var(--space-2); }
.field-row { display: flex; flex-direction: column; gap: 6px; padding: var(--space-3); border-radius: var(--radius-control); background: var(--color-surface); border: 1px solid var(--color-line); }
.field-row--blocked { background: var(--color-surface-2); border-style: dashed; border-color: var(--color-line-strong); }
.field-row__head { display: flex; justify-content: space-between; align-items: center; gap: var(--space-2); }
.field-row__name { font-weight: 600; font-size: 0.9375rem; }
.field-row__text { font-size: 0.9375rem; color: var(--color-ink-soft); }
.field-row--blocked .field-row__text { color: var(--color-ink-muted); }

/* footer */
.footer { margin-top: var(--space-7); padding-block: var(--space-5); border-top: 1px solid var(--color-line); font-size: 0.8125rem; color: var(--color-ink-muted); }
.footer__inner { display: flex; flex-direction: column; gap: var(--space-3); }
.footer__links { display: flex; flex-wrap: wrap; gap: var(--space-3); list-style: none; padding: 0; margin: 0; }
.footer__links li + li { margin-top: 0; }
.footer__links a { display: inline-flex; align-items: center; min-height: 44px; }
.footer__meta { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-3); }
.footer__meta a { display: inline-flex; align-items: center; min-height: 44px; }
/* standalone links (a band's closing link, a paragraph that is only a link) are controls: 44px, like the rest */
.band > a { display: inline-flex; align-items: center; min-height: 44px; }
.footer strong { color: var(--color-ink); }

/* icons: two sets, one shown per presentation */
.icon { width: 20px; height: 20px; flex-shrink: 0; }
.icon--glyph { display: none; }
:root[data-presentation="quiet"] .icon--line { display: none; }
:root[data-presentation="quiet"] .icon--glyph { display: inline-block; }

/* preview and governance marks, never in production */
.preview-mark { position: relative; margin: 0; border-top: 1px solid var(--color-line); padding: 6px var(--gutter); background: var(--color-blocked-bg); color: var(--color-blocked-ink); font-size: 0.75rem; text-align: center; }
.future { outline: 1px dashed var(--color-line-strong); outline-offset: 4px; }

/* article pages */
.page-head { padding-block: var(--space-6) var(--space-2); }
.page-head h1 { max-width: 22ch; }
.prose { max-width: var(--measure); }
.prose > * + * { margin-top: var(--space-3); }
.prose > h2 { margin-top: var(--space-6); }
.prose > h2:first-child { margin-top: 0; }
.prose ul, .prose ol { padding-left: 1.25em; }
.prose li + li { margin-top: var(--space-2); }
.prose .card__head { margin-top: var(--space-6); }
.prose .card__head > h2 { margin: 0; }
.meta-line { color: var(--color-ink-muted); font-size: 0.875rem; }
.contacts { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-3); }
.contacts li + li { margin-top: 0; }
.contact { display: flex; flex-direction: column; gap: 4px; padding: var(--space-3); border-radius: var(--radius-card); background: var(--color-surface); border: 1px solid var(--color-line); }
.contact__number { font-family: var(--font-mono); font-size: 1.25rem; font-weight: 600; }
.contact__number a { text-decoration: none; }
.contact__text { font-size: 0.9375rem; color: var(--color-ink-soft); }
.states { display: grid; gap: var(--space-3); }
@media (min-width: 640px) {
  .states { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contacts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}
@media print {
  .masthead__actions, .skip-link, .preview-mark, .switch, .switch-note { display: none !important; }
  body { background: #fff; color: #000; }
  a { color: #000; }
}

/* AiMidWare additions */
.eyebrow, .card__label, .status, .fact__value, .state__label, .step__num, .contact__number, .mono { font-variant-ligatures: none; }
.status { display: inline-flex; align-items: center; gap: 6px; min-height: 24px; padding: 0 8px; border-radius: var(--radius-pill); font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.02em; white-space: nowrap; background: var(--color-surface-2); color: var(--color-ink-soft); border: 1px solid var(--color-line); }
.status::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--color-line-strong); }
.status--available::before { background: var(--color-accent); }
.status--development::before { background: var(--color-signal); }
.status--planned::before { background: transparent; border: 1.5px solid var(--color-line-strong); box-sizing: border-box; }
.evidence { font-size: 0.875rem; color: var(--color-ink-muted); }
.evidence a { color: inherit; }
.rule-mid { position: relative; padding-left: var(--space-5); }
.rule-mid::before { content: ""; position: absolute; left: 6px; top: 0.3em; bottom: 0.3em; width: 2px; background: var(--color-signal); border-radius: 2px; }
.eyebrow { font-family: var(--font-mono); font-size: 0.8125rem; letter-spacing: 0.04em; color: var(--color-ink-muted); }
.facts { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-3); }
.facts li + li { margin-top: 0; }
.fact { display: flex; flex-direction: column; gap: 4px; padding: var(--space-3) var(--space-4); border-radius: var(--radius-card); background: var(--color-surface); border: 1px solid var(--color-line); }
.fact__value { font-family: var(--font-mono); font-size: 1.375rem; font-weight: 400; color: var(--color-ink); }
.fact__label { font-size: 0.9375rem; color: var(--color-ink-soft); }
.fact__source { font-size: 0.8125rem; color: var(--color-ink-muted); }
@media (min-width: 640px) { .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 960px) { .facts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.line-card { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4); border-radius: var(--radius-card); background: var(--color-surface); border: 1px solid var(--color-line); }
.line-card__head { display: flex; justify-content: space-between; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.line-card__title { font-size: 1.125rem; font-weight: 600; }
.line-card__text { color: var(--color-ink-soft); }
.line-card a.more { align-self: flex-start; }

/* Review candidate: portfolio first, readable articles, native disclosures. */
[id] { scroll-margin-top: var(--space-5); }
.community-summary { padding-block: var(--space-5); border-block: 1px solid var(--color-line); }
.line-card { padding: var(--space-5); }
.line-card__title { line-height: 1.3; }
.article-content { min-width: 0; }
.prose-section > * + * { margin-top: var(--space-3); }
.prose-section + .prose-section { margin-top: var(--space-7); }
.prose-section .card__head { margin-top: 0; align-items: start; flex-wrap: wrap; }
.page-index { margin-top: var(--space-6); padding-block: var(--space-4); border-block: 1px solid var(--color-line); }
.page-index ol { list-style: none; padding: 0; display: grid; gap: 0; }
.page-index li + li { margin-top: 0; }
.page-index a { display: flex; align-items: center; min-height: 44px; padding-block: var(--space-2); text-decoration: none; color: var(--color-ink-soft); font-size: 0.9375rem; line-height: 1.4; }
.page-index a:hover { color: var(--color-accent); text-decoration: underline; }
@media (min-width: 640px) and (max-width: 959px) { .page-index ol { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-5); } }
@media (min-width: 960px) {
  .article-layout--indexed { display: grid; grid-template-columns: 13rem minmax(0, 1fr); gap: var(--space-7); align-items: start; }
  .page-index { padding-block: var(--space-3); }
}
.development-record { border-block: 1px solid var(--color-line); }
.development-record > summary { cursor: pointer; min-height: 64px; padding-block: var(--space-4); }
.development-record > summary h2 { display: inline; font-size: 1.25rem; }
.development-record__body { padding-bottom: var(--space-5); }
.development-record .facts { grid-template-columns: 1fr; }
@media (min-width: 640px) { .development-record .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media print { .page-index { display: none; } .article-layout--indexed { display: block; } }

@media (max-width: 639px) { .line-card__head { flex-direction: column; align-items: flex-start; } }

/* 27 October owner-directed umbrella presence. Source: REVISED-BRIEF.md. */
.connection-panel { padding: 24px; border: 1px solid var(--color-line); border-radius: 8px; background: var(--color-surface); }
.connection-panel ol { list-style: none; padding: 0; margin-block: 24px; }
.connection-panel li { display: grid; grid-template-columns: 32px 1fr; gap: 16px; padding-block: 20px; border-top: 1px solid var(--color-line); margin: 0; }
.connection-panel li:last-child { border-bottom: 1px solid var(--color-line); }
.connection-panel h2 { font-size: 1.15rem; }
.connection-panel li p { margin-top: 8px; font-size: 0.9375rem; color: var(--color-ink-soft); }
.connection-panel__number, .area-number { font-family: var(--font-mono); font-size: 0.8125rem; color: var(--color-ink-muted); }
.connection-panel__number { display: grid; place-items: center; align-self: start; width: 32px; height: 32px; border-radius: 50%; color: var(--color-badge-ink); background: var(--color-badge-bg); }
.section-intro { display: grid; gap: 24px; }
.section-intro h2 { max-width: 24ch; }
.benefit-grid { display: grid; gap: 32px; }
.benefit-grid article { border-top: 2px solid var(--color-signal); padding-top: 20px; }
.benefit-grid p { color: var(--color-ink-soft); margin-top: 12px; }
.community-feature { padding-block: 48px; background: var(--color-surface-2); border-block: 1px solid var(--color-line); }
.community-feature__grid { display: grid; gap: 40px; }
.community-feature h2 { font-size: clamp(1.75rem, 3.5vw, 2.5rem); max-width: 21ch; }
.community-projects { display: grid; gap: 28px; }
.community-projects article + article { border-top: 1px solid var(--color-line-strong); padding-top: 28px; }
.project-domain { font-family: var(--font-mono); color: var(--color-ink-soft); font-size: 0.8125rem; }
.area-overview { display: grid; gap: 0 48px; }
.area-overview article { display: grid; grid-template-columns: 32px 1fr; gap: 16px; padding-block: 28px; border-top: 1px solid var(--color-line); }
.area-overview p { margin-top: 12px; color: var(--color-ink-soft); }
.examples-feature { padding-block: 48px; border-block: 1px solid var(--color-line); background: var(--color-surface); }
.examples-feature .lede { max-width: 46rem; }
.closing-grid { display: grid; gap: 40px; }
.closing-grid .notice { padding: 28px; }
.closing-grid .badge { display: inline-block; }
.area-detail { display: grid; gap: 24px; padding-block: 40px; border-top: 1px solid var(--color-line); }
.area-detail h2 { margin-top: 16px; }
.area-detail:last-child { padding-bottom: 64px; }
.example-study { display: grid; gap: 24px; padding-block: 40px; border-top: 1px solid var(--color-line); }
.example-study__name { font-size: 1.5rem; font-weight: 600; margin-top: 12px; }
.example-study__connection { border-left: 3px solid var(--color-signal); padding-left: 16px; color: var(--color-ink-soft); }
@media (min-width: 640px) {
  .benefit-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
  .area-overview { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (min-width: 960px) {
  .section-intro { grid-template-columns: 1fr 1fr; gap: 64px; }
  .community-feature__grid { grid-template-columns: 1.15fr 0.85fr; gap: 64px; }
  .closing-grid { grid-template-columns: 1fr 1fr; gap: 64px; }
  .area-detail, .example-study { grid-template-columns: minmax(0,1fr) minmax(0,2fr); gap: 48px; }
}
@media (max-width: 639px) {
  .community-feature, .examples-feature { padding-block: 36px; }
  .connection-panel { padding: 20px; }
  .closing-grid .notice { padding: 20px; }
}

/* Keep the full bilingual navigation comfortable before using the inline layout. */
@media (min-width: 960px) and (max-width: 1099px) { .nav-inline { display: none; } .menu { display: block; } }

/* 27 October: existing-process explanation after owner rejection of f078797.
   These classes are scoped; other article bodies keep their established styles. */
.work-opening { padding-block: 36px 40px; }
.work-opening__intro { display: grid; gap: 28px; align-items: start; }
.work-opening h1 { font-size: clamp(2rem,4.1vw,3.5rem); max-width: 23ch; }
.work-opening__lead { max-width: 65ch; font-size: 1.125rem; }
.work-definition { padding: 24px; border-left: 3px solid var(--color-signal); background: var(--color-surface); }
.work-definition h2 { font-size: 1.25rem; line-height: 1.3; }
.work-definition p { font-size: 1rem; }
.work-opening__more { margin-top: 20px; }
.work-diagram { margin: 32px 0 0; }
.work-diagram figcaption { font-size: 1.15rem; font-weight: 600; margin-bottom: 16px; }
.work-diagram__scope { padding: 20px; border: 1px solid var(--color-line-strong); border-top: 3px solid var(--color-signal); border-radius: 6px; }
.work-diagram__coordinator { font-size: 1rem; font-weight: 600; margin-bottom: 20px; }
.work-diagram__coordination { font-size: .8125rem; color: var(--color-ink-soft); border-top: 1px solid var(--color-line); margin-top: 20px; padding-top: 16px; }
.work-diagram__flow { padding: 0; list-style: none; display: grid; gap: 28px; margin: 0; }
.work-diagram__node { position: relative; padding: 18px; background: var(--color-surface); border: 1px solid var(--color-line-strong); border-radius: 6px; margin: 0; }
.work-diagram__node--middle { background: var(--color-surface-2); }
.work-diagram__node--review { border: 2px solid var(--color-accent); }
.work-diagram__node--output { background: var(--color-surface-2); }
.work-diagram__node + .work-diagram__node { margin: 0; }
.work-diagram__number { position: absolute; inset-inline-end: 10px; top: 9px; font: 12px var(--font-mono); color: var(--color-ink-muted); }
.work-diagram__label { padding-inline-end: 18px; font: .6875rem/1.5 var(--font-mono); color: var(--color-ink-soft); letter-spacing: .025em; }
.work-diagram h3 { font-size: 1.0625rem; line-height: 1.25; margin-top: 10px; }
.work-diagram__node > p:last-child { margin-top: 10px; font-size: .9375rem; line-height: 1.5; color: var(--color-ink-soft); }
.work-diagram__node:not(:last-child)::after { content: ""; position: absolute; left: 50%; top: calc(100% + 1px); width: 2px; height: 26px; background: var(--color-line-strong); }
.work-diagram__node:not(:last-child)::before { content: ""; position: absolute; left: calc(50% - 3px); top: calc(100% + 18px); width: 8px; height: 8px; border-right: 2px solid var(--color-line-strong); border-bottom: 2px solid var(--color-line-strong); transform: rotate(45deg); }
.work-diagram__note { margin-top: 12px; max-width: 100ch; font-size: .8125rem; line-height: 1.5; color: var(--color-ink-muted); }
.work-section { padding-block: 48px; border-top: 1px solid var(--color-line); }
.work-section--tint { background: var(--color-surface); }
.work-section__intro { max-width: 76ch; }
.work-section__reading { max-width: 82ch; }
.work-section__intro h2, .work-section__reading h2 { max-width: 34ch; line-height: 1.2; }
.process-comparison table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 1rem; }
.process-comparison th, .process-comparison td { padding: 20px; text-align: start; vertical-align: top; border: 1px solid var(--color-line); }
.process-comparison thead { background: var(--color-surface-2); }
.process-comparison thead th { font-size: .9375rem; line-height: 1.4; }
.process-comparison tbody th { width: 18%; font-weight: 600; }
.process-comparison__benefit { background: var(--color-surface); font-weight: 600; }
.chat-pair, .value-grid { display: grid; gap: 24px; }
.chat-pair article { border-top: 3px solid var(--color-line-strong); padding-top: 20px; }
.chat-pair article + article { border-top-color: var(--color-accent-2); }
.value-grid article { border-left: 3px solid var(--color-signal); padding-left: 20px; }
.reuse-map__shared { padding: 24px; border: 2px solid var(--color-signal); background: var(--color-surface); max-width: 760px; margin: 0 auto; position: relative; }
.reuse-map__shared::after { content: ""; display: block; position: absolute; height: 24px; width: 2px; top: 100%; left: 50%; background: var(--color-line-strong); }
.reuse-map__branches { display: grid; padding-top: 24px; }
.reuse-map__branches article { position: relative; padding: 24px 20px; border-top: 2px solid var(--color-line-strong); }
.reuse-map__branches h3 { font-size: 1.125rem; }
.reuse-map__branches p { font-size: 1rem; color: var(--color-ink-soft); }
.work-stages { list-style: none; padding: 0; margin: 24px 0 0; display: grid; gap: 20px; }
.work-stages li { display: flex; gap: 18px; margin: 0; padding-top: 20px; border-top: 1px solid var(--color-line-strong); }
.work-stages li > span { flex: 0 0 2ch; white-space: nowrap; font: 14px var(--font-mono); color: var(--color-accent-2); }
.work-stages h3 { font-size: 1.0625rem; }
.work-stages p { font-size: 1rem; }
.community-note { border-top: 1px solid var(--color-line); padding-block: 28px; font-size: .9375rem; }
.community-note__inner { display: grid; gap: 20px; }
.community-note h2 { font-size: 1.125rem; }
@media (min-width: 640px) {
  .chat-pair { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .value-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .reuse-map__branches { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 24px; }
  .community-note__inner { grid-template-columns: 1fr 3fr; }
}
@media (min-width: 960px) {
  .work-opening__intro { grid-template-columns: 1.45fr 1fr; gap: 48px; }
  .work-diagram__flow { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .work-diagram__node:not(:last-child)::after { top: 50%; left: 100%; width: 28px; height: 2px; }
  .work-diagram__node:not(:last-child)::before { top: calc(50% - 3px); left: calc(100% + 18px); transform: rotate(-45deg); }
  .reuse-map__branches { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0; }
  .reuse-map__branches article::before { content: ""; width: 2px; height: 16px; position: absolute; left: 50%; top: 0; background: var(--color-line-strong); }
  .work-stages { grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 48px; }
  .work-stages li:last-child { grid-column: 1 / -1; max-width: var(--reading-width); }
  .work-stages li { display: block; }
  .work-stages li > div { margin-top: 12px; }
}
@media (max-width: 639px) {
  .work-opening { padding-block: 28px 32px; }
  .work-definition { padding: 18px; }
  .work-diagram__scope { padding: 14px; }
  .work-diagram__node { padding: 16px; }
  .work-diagram__node h3 { margin-top: 8px; }
  .work-diagram__node > p:last-child { margin-top: 8px; }
  .work-section { padding-block: 32px; }
  .process-comparison table, .process-comparison tbody, .process-comparison tr, .process-comparison th, .process-comparison td { display: block; width: auto; }
  .process-comparison thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .process-comparison tr { margin-bottom: 24px; border: 1px solid var(--color-line-strong); }
  .process-comparison td, .process-comparison tbody th { border: 0; padding: 16px; }
  .process-comparison td + td { border-top: 1px solid var(--color-line); }
  .process-comparison td::before { content: attr(data-label); display: block; margin-bottom: 8px; font-weight: 600; color: var(--color-ink-muted); font-size: .8125rem; }
  .process-comparison tbody th { width: auto; background: var(--color-surface-2); }
}

/* MCP connection illustration: a protocol interface, not a workflow sequence. */
.mcp-focus { max-width: 76ch; padding: 20px 24px; border-left: 3px solid var(--color-signal); background: var(--color-surface); }
.mcp-focus h3 { font-size: 1.125rem; line-height: 1.35; }
.mcp-focus p { font-size: 1rem; }
.mcp-diagram { margin: 24px 0 0; }
.mcp-diagram figcaption { font-size: 1.125rem; font-weight: 600; margin-bottom: 20px; }
.mcp-diagram__flow { display: grid; grid-template-columns: minmax(0,1fr); gap: 8px; align-items: stretch; }
.mcp-diagram__node { min-width: 0; padding: 24px; border: 1px solid var(--color-line-strong); border-radius: 6px; background: var(--color-surface); }
.mcp-diagram__node h3 { font-size: 1.125rem; line-height: 1.3; }
.mcp-diagram__node p { font-size: 1rem; line-height: 1.5; }
.mcp-diagram__node--server { border: 2px solid var(--color-signal); background: var(--color-surface-2); }
.mcp-diagram__connector { display: grid; place-items: center; font-size: 2rem; line-height: 1; color: var(--color-accent-2); transform: rotate(90deg); min-height: 28px; }
.mcp-diagram__example { max-width: 90ch; margin-top: 20px; font-size: 1rem; color: var(--color-ink-soft); }
.mcp-detail { display: grid; gap: 28px; }
.source-reading h2 { font-size: 1.5rem; }
.source-reading__links { display: grid; gap: 12px 36px; padding-left: 20px; margin-bottom: 0; font-size: .9375rem; }
.source-reading__links li { padding-block: 6px; }
.source-reading__links li + li { margin-top: 0; }
@media (min-width: 640px) {
  .source-reading__links { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (min-width: 800px) {
  .mcp-diagram__flow { grid-template-columns: minmax(0,1fr) 32px minmax(0,1fr) 32px minmax(0,1fr); gap: 12px; }
  .mcp-diagram__connector { transform: none; }
}
@media (min-width: 960px) {
  .mcp-detail { grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); gap: 48px; align-items: start; }
}

/* Business-owner explanation: example before terminology, value before setup. */
.business-opening h1 { max-width: 27ch; }
.work-definition--after { margin-top: 28px; }
.work-definition--after > p { max-width: 90ch; }
.business-links { display: flex; flex-wrap: wrap; gap: 12px 32px; }
.work-diagram__context { max-width: 85ch; margin-bottom: 20px; font-size: 1rem; color: var(--color-ink-soft); }
@media (max-width: 639px) {
  .work-definition--after { padding: 20px; }
  .business-links { flex-direction: column; gap: 12px; align-items: flex-start; }
}

/* Whole-job capacity: reader guide, autonomous routine and worked deliverables. */
.capacity-opening { display: grid; gap: 32px; align-items: start; }
.capacity-opening .business-opening h1 { max-width: 20ch; }
.usage-selector { display: grid; gap: 16px; }
.usage-selector h2 { font-size: 1.45rem; line-height: 1.3; }
.usage-selector > p { color: var(--color-ink-soft); font-size: .95rem; }
.usage-selector__links { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.usage-selector__links a { position: relative; display: grid; align-content: start; gap: 10px; padding: 20px 34px 20px 20px; border: 1px solid var(--color-line-strong); border-top: 3px solid var(--color-signal); border-radius: 4px; background: var(--color-surface); color: var(--color-ink); text-decoration: none; }
.usage-selector__links a:hover { background: var(--color-surface-2); border-color: var(--color-accent); }
.usage-selector__links strong { font-size: 1.05rem; line-height: 1.35; }
.usage-selector__links span { font-size: .9rem; line-height: 1.5; color: var(--color-ink-soft); }
.usage-selector__links .usage-selector__arrow { position: absolute; right: 12px; top: 15px; color: var(--color-accent); font-size: 1.2rem; }
.usage-opening { padding: 0 0 48px; }
.work-diagram__node--middle { border-color: var(--color-accent-2); }
.work-diagram__exception { display: flex; align-items: start; gap: 16px; margin-top: 24px; padding: 20px; border-left: 3px solid var(--color-accent); background: var(--color-surface-2); }
.work-diagram__exception > span { flex: none; font-size: 1.75rem; color: var(--color-accent); line-height: 1; }
.work-diagram__exception h3 { font-size: 1rem; }
.work-diagram__exception p { font-size: .95rem; max-width: 95ch; }
.worked-example { padding: 64px 0; border-top: 1px solid var(--color-line-strong); scroll-margin-top: 24px; }
.worked-example:nth-of-type(even) { background: var(--color-surface); }
.worked-reader { font-weight: 600; color: var(--color-ink-soft); }
.worked-inputs > h3 { font-size: 1rem; }
.sample-record { display: grid; margin: 0; border: 1px solid var(--color-line-strong); border-radius: 4px; overflow: hidden; }
.sample-record > div { padding: 20px; background: var(--color-surface); }
.sample-record > div + div { border-top: 1px solid var(--color-line); }
.sample-record dt { font-family: var(--font-mono); font-size: .78rem; line-height: 1.5; color: var(--color-ink-soft); }
.sample-record dd { margin: 8px 0 0; line-height: 1.6; }
.sample-record--input > div { background: var(--color-surface-2); }
.worked-layout { display: grid; gap: 24px; align-items: start; }
.worked-stages { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; list-style: none; padding: 0; margin: 0; }
.worked-stages > li { border-top: 2px solid var(--color-line-strong); padding: 20px; background: var(--color-surface-2); }
.worked-stages h3 { font-size: 1.05rem; line-height: 1.4; }
.worked-stages p { font-size: .95rem; }
.worked-deliverable { border-top: 4px solid var(--color-signal); padding: 24px; background: var(--color-surface-2); }
.worked-deliverable h3 { font-size: 1.35rem; }
.worked-exception { padding: 20px 24px; border-left: 3px solid var(--color-accent); background: var(--color-surface-2); }
.worked-exception h3, .worked-value h3 { font-size: 1.1rem; }
.worked-exception p, .worked-value p { max-width: 100ch; }
.worked-value { padding-left: 27px; }
#reported .example-study h3 { font-size: 1.5rem; }
@media (min-width: 768px) {
  .sample-record--input { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .sample-record--input > div + div { border-top: 0; border-left: 1px solid var(--color-line); }
}
@media (min-width: 960px) {
  .capacity-opening { grid-template-columns: minmax(0,1.15fr) minmax(0,1fr); gap: 48px; }
  .worked-layout { grid-template-columns: minmax(0,1.35fr) minmax(0,1fr); }
}
@media (max-width: 639px) {
  .usage-selector__links, .worked-stages { grid-template-columns: 1fr; }
  .usage-selector__links a { padding: 18px 40px 18px 18px; gap: 6px; }
  .worked-example { padding: 40px 0; }
  .worked-deliverable { padding: 20px 16px; }
  .sample-record > div { padding: 16px; }
  .worked-exception { padding: 20px; }
  .worked-value { padding-left: 0; }
}

/* Accepted warm palette: accents guide reading, blue separates decisions. */
.masthead { border-top: 4px solid var(--color-band); }
.work-opening { background: var(--color-ground); }
.business-links > a:first-child { display: inline-flex; align-items: center; min-height: 48px; padding: 10px 20px; border-radius: 6px; background: var(--color-signal); color: var(--color-ink); font-weight: 600; text-decoration: none; }
.business-links > a:first-child:hover { background: #D99A2C; color: var(--color-ink); }
#value { background: var(--color-band); color: var(--color-on-band); }
#value p { color: var(--color-on-band-muted); }
#value a { color: var(--color-band-link); }
#value :focus-visible { outline-color: var(--color-band-link); }
.work-diagram__scope, .worked-deliverable { background: var(--color-surface); }
.work-diagram__node--middle { background: #FFF2D9; }
.work-diagram__exception, .worked-exception { background: #E8EFF3; }
.worked-value { border-left: 3px solid var(--color-signal); padding: 12px 24px; }
.usage-selector__links a { border-color: var(--color-line); border-top-color: var(--color-signal); box-shadow: 0 3px 0 rgba(20,44,67,.04); }
.usage-selector__links a:hover { border-color: var(--color-accent); }

/* Three public examples; individual product work is withheld. */
@media (min-width: 640px) { .capacity-opening .usage-selector__links a:last-child { grid-column: 1 / -1; } }
@media (min-width: 960px) { .usage-opening .usage-selector__links { grid-template-columns: repeat(3,minmax(0,1fr)); } }

/* Contact: labelled fields, readable feedback, no embedded third-party UI. */
.contact-layout { display: grid; gap: 32px; align-items: start; }
.contact-panel { padding: 24px; background: var(--color-surface); border: 1px solid var(--color-line); border-top: 3px solid var(--color-signal); border-radius: var(--radius-card); min-width: 0; }
.contact-panel .field { margin-top: 16px; }
.contact-panel .input { font: inherit; min-width: 0; }
.contact-panel textarea.input { padding: 12px; resize: vertical; min-height: 160px; }
.contact-panel .field__hint, .contact-panel .field__error { font-size: .875rem; }
.field__error { color: var(--color-error); font-weight: 600; }
.contact-panel [aria-invalid="true"] { border-color: var(--color-error); }
.contact-feedback { padding: 20px; border-left: 3px solid var(--color-accent); background: var(--color-surface-2); }
.contact-feedback h2 { font-size: 1.25rem; }
.contact-feedback p, .contact-feedback ul { margin-top: 12px; }
.contact-feedback a { overflow-wrap: anywhere; }
.contact-aside .prose-section + .prose-section { margin-top: 24px; }
.contact-aside .card__head { flex-wrap: wrap; }
.contact-aside h2 { font-size: 1.25rem; }
.contact-aside a { overflow-wrap: anywhere; }
.contact-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.contact-panel [hidden] { display: none !important; }
.contact-panel button:disabled { opacity: .65; cursor: wait; }
@media (min-width: 960px) { .contact-layout { grid-template-columns: minmax(0,1.6fr) minmax(0,1fr); gap: 48px; } }
@media (max-width: 639px) { .contact-panel { padding: 20px 16px; } }

/* Keep the reading column stable when browser scrollbars appear. */
html { scrollbar-gutter: stable; }

/* Worked examples: table labels and grid rows keep a clear reading rhythm. */
.worked-inputs > h3 + .sample-record, .worked-deliverable > h3 + .sample-record { margin-top: 12px; }
.worked-stages > li { margin-top: 0; }


/* Reading hierarchy: one type scale, clear destinations and consistent measures. */
.page-head { padding-block: 48px 24px; }
.page-head h1, .work-opening h1 { font-size: var(--type-title); max-width: 46rem; line-height: 1.16; }
.page-head .lede, .work-opening__lead { max-width: var(--reading-width); font-size: var(--type-lead); line-height: 1.6; }
.work-section__intro, .work-section__reading { max-width: var(--reading-width); }
.work-section__intro h2, .work-section__reading h2 { font-size: var(--type-section); max-width: 30ch; line-height: 1.25; }
.eyebrow, .work-diagram__label { font-family: var(--font-sans); letter-spacing: .02em; }
.home-presentation-opening { padding-block: 56px 0; }
.home-presentation-copy { max-width: 52rem; }
.home-presentation-copy > * + * { margin-top: 24px; }
.home-presentation-copy .eyebrow { font-size: .8125rem; color: var(--color-ink-muted); }
.home-presentation-copy .business-links { align-items: center; gap: 16px 28px; }
.section-guide { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 28px; padding-block: 20px; margin-top: 40px; border-top: 1px solid var(--color-line); font-size: .9375rem; }
.section-guide__label { color: var(--color-ink-muted); font-size: .8125rem; }
.section-guide ul { display: flex; flex-wrap: wrap; gap: 4px 24px; list-style: none; padding: 0; margin: 0; }
.section-guide li { margin: 0; }
.section-guide a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
.section-guide a:hover { text-decoration: underline; }
.category-scope { max-width: var(--reading-width); color: var(--color-ink-soft); }
.home-presentation-explanation .work-definition { max-width: var(--reading-width); padding: 0; border: 0; background: transparent; }
.home-presentation-explanation .work-definition h2 { font-size: var(--type-section); }
.home-presentation-explanation .work-definition p { font-size: var(--type-lead); }
.work-diagram figcaption { font-size: 1.25rem; }
.work-diagram__scope { border-color: var(--color-line); border-top: 2px solid var(--color-signal); }
.work-diagram__context { max-width: var(--reading-width); }
.work-diagram__coordination, .work-diagram__note { font-size: .875rem; }
.work-diagram__exception { border-left-width: 2px; }
.work-diagram__exception p { max-width: 75ch; }
.work-section { padding-block: 56px; }
.value-grid h3 { line-height: 1.35; }
.value-grid article { border-left: 0; border-top: 2px solid var(--color-signal); padding: 20px 0 0; }
.value-grid p, .chat-pair p { color: var(--color-ink-soft); }
.reuse-map__shared { max-width: none; border: 0; border-left: 3px solid var(--color-signal); padding: 20px 24px; }
.reuse-map__shared::after, .reuse-map__branches article::before { display: none; }
.reuse-map__branches { gap: 24px; }
.reuse-map__branches article { padding: 24px 0; border-top: 1px solid var(--color-line); }
.usage-selector__links a { border: 0; border-bottom: 1px solid var(--color-line); border-radius: 0; background: transparent; box-shadow: none; padding: 16px 28px 20px 0; }
.usage-selector__links a:hover { background: var(--color-surface); }
.usage-selector__links strong { font-size: 1.125rem; }
.usage-selector__links .usage-selector__arrow { right: 0; top: 16px; }
.worked-reader { font-size: 1rem; font-weight: 400; color: var(--color-ink-muted); }
.worked-stages { gap: 24px; }
.worked-stages > li { padding: 20px 0; background: transparent; border-top: 1px solid var(--color-line); }
.worked-stages p { font-size: 1rem; }
.worked-exception p, .worked-value p { max-width: 75ch; }
.worked-deliverable { border-top-width: 3px; padding: 24px; }
.prose-section h2 { line-height: 1.3; }
.page-index { position: sticky; top: 24px; }
.nav-inline [aria-current="page"], .menu__list [aria-current="page"] { text-decoration: underline; text-decoration-color: var(--color-accent-2); text-decoration-thickness: 2px; text-underline-offset: 6px; }
.source-reading__links { max-width: 64rem; }
.fields { max-width: 52rem; }
@media (min-width: 640px) { :root { --gutter: 32px; } }
@media (min-width: 960px) {
  .work-section > .container > .usage-selector .usage-selector__links { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (min-width: 640px) and (max-width: 959px) {
  .value-grid { grid-template-columns: 1fr; gap: 24px; max-width: var(--reading-width); }
  .value-grid article { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr); gap: 24px; }
  .value-grid p { margin-top: 0; }
  .page-index { position: static; }
}
@media (max-width: 639px) {
  :root { --gutter: 20px; }
  .page-head { padding-block: 32px 16px; }
  .home-presentation-opening { padding-block: 32px 0; }
  .home-presentation-copy > * + * { margin-top: 20px; }
  .work-section, .worked-example { padding-block: 40px; }
  .section-guide { gap: 8px; margin-top: 32px; padding-block: 16px; }
  .section-guide__label { flex-basis: 100%; }
  .section-guide ul { column-gap: 20px; }
  .page-index { position: static; }
  .work-section__intro h2, .work-section__reading h2 { max-width: none; }
  .work-diagram__exception { padding: 16px; gap: 12px; }
}

/* Company overview: a short introduction with separate paths into the site. */
.section-heading { display: grid; gap: 20px; align-items: start; }
.section-heading h2 { font-size: var(--type-section); line-height: 1.25; max-width: 22ch; }
.section-heading p { max-width: 45rem; }
.section-heading p + p { margin-top: 14px; }
.service-option { display: grid; gap: 20px 40px; padding-block: 36px; border-top: 1px solid var(--color-line); }
.service-option h2 { font-size: 1.5rem; line-height: 1.3; margin-top: 10px; }
.service-options { margin-top: 20px; }
.example-index { display: grid; gap: 32px; }
.example-index article { padding-top: 24px; border-top: 2px solid var(--color-signal); }
.example-index h2 { font-size: 1.4rem; line-height: 1.3; }
.example-index h2 a { color: var(--color-ink); text-decoration: none; }
.example-index h2 a:hover { text-decoration: underline; }
.breadcrumbs { padding-top: 28px; font-size: .875rem; }
.breadcrumbs a::before { content: '← '; }
.worked-example--page { padding-block: 32px 48px; border: 0; }
.worked-example--page h1 { font-size: var(--type-title); line-height: 1.16; }
.worked-example--page .worked-stages h2, .worked-example--page .worked-inputs h2,
.worked-example--page .worked-exception h2, .worked-example--page .worked-value h2 { font-size: 1.125rem; line-height: 1.4; }
.worked-example--page .worked-deliverable h2 { font-size: 1.4rem; line-height: 1.3; }
.detail-next { display: flex; flex-wrap: wrap; gap: 16px 32px; padding-top: 24px; border-top: 1px solid var(--color-line); }
.example-study h2 { font-size: 1.5rem; line-height: 1.3; }
@media (min-width: 640px) {
  .service-option { grid-template-columns: minmax(0,1fr) minmax(0,2fr); }
}
@media (min-width: 960px) {
  .section-heading { grid-template-columns: minmax(0,1fr) minmax(0,2fr); gap: 48px; }
  .example-index { grid-template-columns: repeat(3,minmax(0,1fr)); }
}



.worked-inputs > h2 + .sample-record, .worked-deliverable > h2 + .sample-record { margin-top: 12px; }
.community-feature h2 { font-size: var(--type-section); line-height: 1.25; }

/* Shared explanatory pages: connected reading paths and substantive examples. */
.middleware-nav ul { display:flex; flex-wrap:wrap; gap:8px 28px; list-style:none; padding:16px 0; margin:0; border-block:1px solid var(--color-line); }
.middleware-nav a { display:inline-flex; align-items:center; min-height:44px; text-decoration:none; }
.middleware-nav a[aria-current] { font-weight:600; text-decoration:underline; text-underline-offset:6px; text-decoration-color:var(--color-accent-2); }
.connection-map { margin:32px 0 24px; }
.connection-map figcaption { font-size:.875rem; font-weight:600; margin-bottom:16px; }
.connection-map ol { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; padding:0; list-style:none; }
.connection-map li { position:relative; border-top:3px solid var(--color-signal); padding:18px 16px 18px 0; }
.connection-map li:not(:last-child)::after { content:'→'; position:absolute; right:-18px; top:18px; color:var(--color-ink-muted); }
.connection-map li > strong { display:block; font-size:1.25rem; margin-bottom:8px; }
.connection-map span { color:var(--color-ink-soft); }
.connection-map > p { max-width:75ch; margin-top:16px; }
.substance-row { display:grid; gap:20px 48px; padding-block:36px; border-bottom:1px solid var(--color-line); }
.substance-row h2 { font-size:1.5rem; line-height:1.3; margin-top:10px; }
.substance-row > .stack { max-width:72ch; }
.substance-example { padding:16px 20px; border-left:3px solid var(--color-signal); background:var(--color-surface-2); }
.substance-example h3 { font-size:.875rem; margin-bottom:8px; }
.substance-measure { font-size:.9375rem; color:var(--color-ink-soft); }
.substance-sources { margin-block:24px 48px; padding-block:16px; border-block:1px solid var(--color-line); }
.substance-sources summary { cursor:pointer; min-height:44px; align-content:center; font-weight:600; }
.substance-sources ul { padding-left:24px; max-width:75ch; }
.substance-sources li { margin-block:12px; }
.example-index { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media(min-width:640px) { .substance-row { grid-template-columns:minmax(0,1fr) minmax(0,2fr); } }
@media(max-width:639px) {
 .connection-map ol { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 24px; }
 .connection-map li:nth-child(2)::after { display:none; }
 .example-index { grid-template-columns:1fr; }
 .substance-row { padding-block:28px; }
 .middleware-nav ul { gap:0 20px; }
}
.middleware-nav li, .connection-map li { margin: 0; }


/* Company homepage v2.3:open masthead,service directory,and an umbrella portfolio. */
.company-front h2{font-size:clamp(1.75rem,2.8vw,2.25rem);line-height:1.18;letter-spacing:-.02em;}
.company-front .eyebrow{font-size:.75rem;letter-spacing:.12em;font-weight:500;}
.front-opening{background:var(--color-band);color:var(--color-on-band);padding:52px 0 48px;}
.front-opening .eyebrow{color:var(--color-band-link);}
.front-opening h1{font-size:clamp(2.375rem,calc(1.5rem + 3.9vw),5rem);line-height:1.04;letter-spacing:-.04em;font-weight:500;margin-top:28px;}
.front-opening h1 span{display:block;color:var(--color-band-link);}
.front-opening__base{display:grid;gap:28px;margin-top:40px;padding-top:28px;border-top:1px solid #577083;align-items:center;}
.front-opening__base > p{max-width:42rem;font-size:1.1875rem;line-height:1.55;color:var(--color-on-band-muted);}
.front-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;}
.front-actions a{color:var(--color-on-band);}
.front-actions .button{background:var(--color-signal);color:var(--color-ink);border-radius:2px;}
.front-actions .button:hover{background:var(--color-band-link);}
.front-opening:focus-visible{outline-color:var(--color-band-link);}
.front-solutions{padding:56px 0;background:var(--color-surface);}
.front-solutions__grid{display:grid;gap:36px;}
.front-solutions h2,.front-portfolio h2{margin-top:14px;}
.front-service-list{margin-top:28px;border-bottom:1px solid var(--color-line);}
.front-service-list a{display:grid;gap:8px 24px;padding:20px 0;border-top:1px solid var(--color-line);color:var(--color-ink);text-decoration:none;}
.front-service-list h3{font-size:1.25rem;line-height:1.25;}
.front-service-list p,.front-fit{color:var(--color-ink-soft);font-size:.9375rem;}
.front-service-list a:hover h3,.front-area-list a:hover h3{text-decoration:underline;text-underline-offset:.18em;}
.front-fit{margin-top:22px;max-width:58ch;}
.front-fit a{display:inline-block;}
.front-value{background:var(--color-ground);padding:32px;border-left:3px solid var(--color-signal);}
.front-value h2{white-space:pre-line;font-size:1.75rem;line-height:1.2;}
.front-value > p:not(.eyebrow){margin-top:20px;font-size:1rem;color:var(--color-ink-soft);}
.front-value > p:last-child{margin-top:24px;}
.front-portfolio{padding:56px 0;}
.front-portfolio__grid{display:grid;gap:28px 64px;}
.front-portfolio header > p:last-child{margin-top:20px;max-width:32rem;color:var(--color-ink-soft);}
.front-portfolio h2{white-space:pre-line;}
.front-area-list{border-top:1px solid var(--color-line-strong);}
.front-area-list > a{display:block;padding:18px 0;color:var(--color-ink);text-decoration:none;border-bottom:1px solid var(--color-line);}
.front-area-list h3{font-size:1.5rem;line-height:1.25;font-weight:500;}
.front-area-list p{font-size:.9375rem;line-height:1.5;margin-top:6px;color:var(--color-ink-soft);}
.front-contact{padding:40px 0;border-top:1px solid var(--color-line);background:var(--color-surface);}
.front-contact > .container{display:grid;gap:24px 64px;align-items:center;}
.front-contact h2{max-width:22ch;}
.front-contact p{max-width:32rem;color:var(--color-ink-soft);margin-bottom:20px;}
@media(min-width:640px){.front-service-list a{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:baseline;}
.front-portfolio__grid{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);}
.front-area-list{grid-column:2;}
.front-contact > .container{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);}}
@media(min-width:960px){.front-opening__base{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:56px;}
.front-actions{justify-content:flex-end;}
.front-solutions__grid{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:56px;}}
@media(max-width:639px){.front-opening{padding:36px 0;}
.front-opening h1{margin-top:24px;}
.front-opening__base{margin-top:28px;padding-top:24px;}
.front-opening__base > p{font-size:1.0625rem;}
.front-solutions,.front-portfolio{padding:36px 0;}
.front-value{padding:24px;}
.front-value h2{white-space:normal;}
.front-area-list h3{font-size:1.375rem;}
.front-contact{padding:32px 0;}}

.front-service-list h3,.front-area-list h3{color:var(--color-accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em;}

/* English review. New components below are rendered only for English. */
:lang(en) .front-opening h1{font-size:clamp(2.25rem,4.2vw,3.75rem);line-height:1.1;letter-spacing:-.025em;font-weight:600;}
:lang(en) .front-value h2,:lang(en) .front-portfolio h2{white-space:normal;}
.page-jumps{padding-block:16px;border-bottom:1px solid var(--color-line);}
.page-jumps ul{display:flex;flex-wrap:wrap;gap:4px 24px;padding:0;list-style:none;}
.page-jumps li{margin:0;}
.page-jumps a{display:inline-flex;align-items:center;min-height:44px;font-size:.9375rem;}
.service-availability{max-width:72ch;padding-top:20px;}
.en-process-title{font-size:1.5rem;}
.en-example-stages{display:grid;gap:24px 40px;padding:0;list-style:none;}
.en-example-stages>li{padding-top:20px;border-top:1px solid var(--color-line);margin:0;}
@media(min-width:800px){.en-example-stages{grid-template-columns:repeat(2,minmax(0,1fr));}}

.en-portfolio a:last-child{border-bottom:0;}
.en-community .front-area-list{border:0;}
.en-community .front-area-list>a{padding:0;}
