/* Shared patterns for peer modules. Page shells, heroes, diagrams, forms and
   interactive controls retain their own layout and motion contracts. */
:root {
  --module-kicker-gap: 20px;
  --module-meta-size: 13px;
  --module-meta-line-height: 1.6;
  --module-meta-title-gap: 28px;
  --module-title-body-gap: 14px;
  --module-title-size: clamp(22px, 1.8vw, 28px);
  --module-body-line-height: 1.8;
  --module-cell-space-block: clamp(28px, 2.4vw, 40px);
  --module-cell-space-inline: clamp(22px, 2.2vw, 36px);
  --module-cell-min-height: 260px;
  --module-card-space: clamp(24px, 3vw, 40px);
  --module-card-gap: clamp(14px, 1.5vw, 24px);
  --module-card-radius: 20px;
  --module-action-gap: 32px;
}

/* One editorial typeface per language: kicker, heading and body share --sans.
   Size and weight provide hierarchy. Monospace remains for technical demos. */
body[data-page] main :is(
  h1, h2, h3, h4, h5, h6, .eyebrow,
  .hps-section-kicker, .home-risk-kicker, .collaboration-kicker,
  .solution-intro-label, .detail-label, .site-heading-subtitle,
  .product-tab-status, .product-tab-details dt, .product-risk-foundation > b,
  .story-index > span
) {
  font-family: var(--sans);
}

/* Font-aware optical alignment. Relative offsets do not alter the shared grid,
   text wrapping, borders or the existing vertical heading-hover treatment. */
body[data-page] main [data-ink-aligned] {
  position: relative;
  left: var(--ink-offset, 0px);
}

/* 01 / Numbered editorial columns: risk, collaboration, foundation, principles.
   Optional labels and disclosures do not change the main reading order. */
body[data-page] [data-layout='numbered-columns'] {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  min-height: calc(var(--module-cell-min-height) + 2px);
  gap: 0;
  margin: 0;
  padding: 0;
  border-block: 1px solid var(--brand-rule);
  list-style: none;
}
body[data-page] [data-layout='numbered-columns'] > :is(article, li) {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  min-width: 0;
  min-height: var(--module-cell-min-height);
  padding: var(--module-cell-space-block) var(--module-cell-space-inline);
  border: 0;
}
body[data-page] [data-layout='numbered-columns'] > :first-child { padding-left: 0; }
body[data-page] [data-layout='numbered-columns'] > :last-child { padding-right: 0; }
body[data-page] [data-layout='numbered-columns'] > :not(:first-child) { border-left: 1px solid var(--brand-rule); }
body[data-page] [data-layout='numbered-columns'] [data-part='meta'] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px 12px;
  min-height: calc(var(--module-meta-size) * var(--module-meta-line-height));
  margin: 0 0 var(--module-meta-title-gap);
  padding: 0;
  color: var(--brand-muted);
  font-family: var(--sans);
  font-size: var(--module-meta-size);
  font-weight: 400;
  line-height: var(--module-meta-line-height);
  letter-spacing: 0;
}
/* Numbers are a separate trailing marker, never an indent before the label. */
body[data-page] [data-layout='numbered-columns'] [data-part='meta'][data-number] { justify-content: flex-end; }
body[data-page] [data-layout='numbered-columns'] [data-part='label'] { min-width: 0; font: inherit; letter-spacing: inherit; }
body[data-page] [data-layout='numbered-columns'] [data-part='meta'] > [data-number] { flex: 0 0 auto; margin-inline-start: auto; }
body[data-page] [data-layout='numbered-columns'] [data-number] {
  padding: 0;
  color: var(--brand-muted);
  font-family: var(--sans);
  font-size: var(--module-meta-size);
  font-weight: 400;
  line-height: var(--module-meta-line-height);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
}
/* Typography is reusable independently of the numbered-column layout. */
body[data-page] [data-layout='numbered-columns'] [data-part='title'],
body[data-page] .story-copy [data-part='title'] {
  min-height: 0;
  margin: 0 0 var(--module-title-body-gap);
  color: var(--brand-ink);
  font-family: var(--sans);
  font-size: var(--module-title-size);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: -.025em;
  text-wrap: wrap;
}
body[data-page] [data-layout='numbered-columns'] [data-part='body'],
body[data-page] .story-copy [data-part='body'] {
  flex: 1;
  max-width: none;
  margin: 0;
  color: var(--brand-muted);
  font-size: var(--copy-size);
  line-height: var(--module-body-line-height);
  text-wrap: wrap;
}
body[data-page] [data-layout='numbered-columns'] [data-part='action'] { width: 100%; margin-top: 24px; }
/* Shared row tracks align body copy even when one translation has a longer
   title. Flex above remains a readable fallback on older browsers. */
@supports (grid-template-rows: subgrid) {
  body[data-page] [data-layout='numbered-columns'] { grid-template-rows: auto auto minmax(0, 1fr) auto; }
  body[data-page] [data-layout='numbered-columns'] > :is(article, li) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: subgrid;
    grid-row: span 4;
  }
}

/* 02 / Section headings: one label-to-title rhythm; consistent description
   columns or trailing links. Full-width headings remain full-width. */
body[data-page] :is(.section-heading, .home-product-overview-heading, .shared-foundation-heading, .future-heading) {
  display: grid;
  grid-template-columns: var(--section-heading-columns);
  align-items: end;
  gap: var(--module-kicker-gap) var(--section-gap);
}
body[data-page] :is(.home-risk-heading, .collaboration-heading) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: var(--module-kicker-gap) var(--section-gap);
}
body[data-page] :is(.section-heading, .home-product-overview-heading, .shared-foundation-heading, .home-risk-heading, .collaboration-heading, .company-principles-heading, .solution-case-heading) {
  margin-bottom: var(--section-gap);
}
body[data-page] :is(.section-heading, .home-product-overview-heading, .shared-foundation-heading, .future-heading, .home-risk-heading, .collaboration-heading) > div { min-width: 0; }
body[data-page] :is(.home-product-overview-heading, .shared-foundation-heading, .future-heading) > p {
  max-width: 48ch;
  margin: 0;
  color: var(--brand-muted);
  font-size: var(--copy-size);
  line-height: var(--module-body-line-height);
}
body[data-page] .section-heading > p:last-child { max-width: 48ch; margin: 0; line-height: var(--module-body-line-height); }
body[data-page] :is(.section-heading, .home-product-overview-heading, .shared-foundation-heading, .future-heading, .home-risk-heading, .collaboration-heading, .company-principles-heading, .story-heading, .solution-case-heading, .doc-request-grid) :is(.eyebrow, .home-risk-kicker, .collaboration-kicker) {
  margin: 0 0 var(--module-kicker-gap);
  color: var(--brand-muted);
  font-family: var(--sans);
  font-size: clamp(10px, .75vw, 12px);
  font-weight: 600;
  line-height: 1.7;
  letter-spacing: .12em;
}
body[data-page] .section-heading > .eyebrow,
body[data-page] :is(.story-heading, .company-principles-heading) > .eyebrow { margin: 0; }
body[data-page] .company-principles-heading { gap: var(--module-kicker-gap); }
body[data-page] .future-heading { margin-bottom: 0; }
body[data-page] .future-grid { margin-top: var(--section-gap); }
body[data-page] .solution-case-meta { margin-bottom: var(--module-kicker-gap); }
body[data-page] .solution-case-meta .eyebrow { margin: 0; }
body[data-page] .solution-intro-label { margin-bottom: var(--module-kicker-gap); }
body[data-page] :is(.home-risk-link, .collaboration-link) {
  display: inline-flex;
  justify-self: end;
  align-items: center;
  gap: 24px;
  min-height: 44px;
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
}

/* 03 / Inset information cards. Keep the approved depth/hover effects and
   icons, while sharing padding, number/title positions and text treatment. */
body[data-page] .future-projects.section-light .future-grid {
  gap: var(--module-card-gap);
  border: 0;
  border-radius: 0;
  overflow: visible;
}
body[data-page='docs'] .access .access-grid.docs-access-grid { gap: var(--module-card-gap); }
body[data-page='docs'] .access .access-grid.docs-access-grid article,
body[data-page] .future-projects.section-light .future-grid article {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 320px;
  padding: var(--module-card-space);
  border: 1px solid var(--brand-rule);
  border-radius: var(--module-card-radius);
}
body[data-page] .access-grid article > span,
body[data-page] .future-grid article > div > span {
  display: block;
  min-height: 40px;
  color: var(--brand-muted);
  font-family: var(--sans);
  font-size: var(--module-meta-size);
  line-height: var(--module-meta-line-height);
  letter-spacing: 0;
}
body[data-page] .access-grid svg { top: var(--module-card-space); right: var(--module-card-space); width: 40px; height: 40px; }
body[data-page] .access-grid h3,
body[data-page] .future-grid b {
  max-width: none;
  margin: var(--module-meta-title-gap) 0 0;
  font-size: var(--module-title-size) !important;
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: -.025em;
}
body[data-page] .access-grid p,
body[data-page] .future-grid article > p {
  max-width: none;
  margin: var(--module-title-body-gap) 0 0;
  font-size: var(--copy-size);
  line-height: var(--module-body-line-height);
}
body[data-page] .future-grid small { margin-top: 24px; padding-top: 24px; font-size: 12px; line-height: var(--module-body-line-height); }
/* Product overview is compact navigation, not a full-size information card. */
body[data-page] .home-product-overview-card { border-radius: var(--module-card-radius); }
body[data-page] .home-product-overview-index { font-size: var(--module-meta-size); line-height: var(--module-meta-line-height); }
body[data-page] .home-product-overview-icon { margin-block: var(--module-meta-title-gap); }

/* 04 / Closing actions: same label/title gap and right-aligned button on all
   three pages, with no change to the shared section-height tiers. */
body[data-page] :is(.home-closing, .page-closing) > .eyebrow { margin: 0 0 var(--module-kicker-gap); }
body[data-page] :is(.home-closing, .page-closing) h2 { max-width: 100% !important; }
body[data-page] .home-closing-actions { margin-top: var(--module-action-gap); }
body[data-page] .home-closing-actions .button { justify-self: end; }
body[data-page] .page-closing .button { margin-top: var(--module-action-gap); }

@media (max-width: 959px) {
  body[data-page] :is(.section-heading, .home-product-overview-heading, .shared-foundation-heading, .future-heading, .home-risk-heading, .collaboration-heading) { grid-template-columns: minmax(0, 1fr); }
  body[data-page] :is(.home-product-overview-heading, .shared-foundation-heading, .future-heading) > p,
  body[data-page] .section-heading > p:last-child { max-width: 60ch; }
  body[data-page] :is(.home-risk-link, .collaboration-link) { justify-self: start; }
}
@media (max-width: 760px) {
  :root {
    --module-cell-space-block: 26px;
    --module-cell-min-height: 0px;
    --module-meta-title-gap: 24px;
    --module-title-size: 22px;
  }
  body[data-page] [data-layout='numbered-columns'] { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
  body[data-page] [data-layout='numbered-columns'] > :is(article, li) { display: flex; grid-row: auto; padding: var(--module-cell-space-block) 0; border-left: 0; }
  body[data-page] [data-layout='numbered-columns'] > :not(:first-child) { border-left: 0; border-top: 1px solid var(--brand-rule); }
  body[data-page] [data-layout='numbered-columns'] [data-part='action'] { margin-top: 18px; }
  body[data-page] .access-grid { grid-template-columns: minmax(0, 1fr); }
  body[data-page] .future-grid { grid-template-columns: minmax(0, 1fr); }
  body[data-page='docs'] .access .access-grid.docs-access-grid article,
  body[data-page] .future-projects.section-light .future-grid article { min-height: 0; }
}