/* Home v2 — editorial concept landing, loaded only by _src/pages/home-v2.html.
   Built on site.css tokens: Roboto / Roboto Mono, canonical HEX, sharp corners, thin #272727 rules.
   The scroll-driven motion is a task-specific choice requested by the user; all of it yields to prefers-reduced-motion. */

.x-idx { display: inline-block; font-size: 12px; line-height: 16px; font-weight: 500; text-transform: uppercase; color: var(--au-text-secondary); }
.x-head { display: grid; gap: 24px; margin-bottom: clamp(40px, 6vw, 88px); }
.x-head > div { display: grid; gap: 24px; }
@media (min-width: 1024px) { .x-head { grid-template-columns: 1fr 2fr; align-items: start; } }

/* ---------- hero: full-height type on a visible 12-column grid ---------- */
.x-hero { position: relative; display: flex; min-height: calc(100svh - var(--nav-h)); border-bottom: 1px solid var(--au-border); overflow: hidden; }
.x-grid { position: absolute; inset: 0; width: min(var(--container), 100% - 32px); margin-inline: auto; display: grid; grid-template-columns: repeat(12, 1fr); border-right: 1px solid var(--au-border); pointer-events: none; }
.x-grid i { border-left: 1px solid var(--au-border); transform-origin: top; animation: x-draw 1.4s var(--ease) both; animation-delay: calc(var(--n) * 50ms); }
@media (min-width: 1024px) { .x-grid { width: min(var(--container), 100% - 72px); } }
@media (max-width: 719px) { .x-grid { grid-template-columns: repeat(4, 1fr); } .x-grid i:nth-child(n+5) { display: none; } }
@keyframes x-draw { from { transform: scaleY(0); } }

.x-hero__inner { position: relative; display: flex; flex-direction: column; gap: 48px; padding-block: clamp(24px, 4vw, 48px); }
.x-meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; font-size: 11px; text-transform: uppercase; color: var(--au-text-secondary); }
.x-meta b { font-weight: 500; color: var(--au-text-primary); font-variant-numeric: tabular-nums; }
.x-hero__title { margin-block: auto; font-size: clamp(52px, 11.4vw, 200px); line-height: .88; }
.x-rotate { color: var(--au-text-secondary); }
.x-rotate::after { content: ""; display: inline-block; width: .05em; height: .72em; margin-left: .06em; background: var(--au-text-primary); animation: blink 1s steps(1) infinite; }
.x-hero__foot { display: grid; gap: 24px; align-items: end; }
@media (min-width: 1024px) { .x-hero__foot { grid-template-columns: repeat(12, 1fr); gap: 0; } .x-ticker { grid-column: 1 / span 4; } .x-hero__copy { grid-column: 7 / span 6; } }
.x-ticker, .x-hero__copy { display: grid; gap: 16px; padding-top: 16px; border-top: 1px solid var(--au-border); }
.x-ticker b { font: 400 clamp(36px, 4vw, 64px)/1 var(--au-font-heading); letter-spacing: -0.05em; font-variant-numeric: tabular-nums; }

/* ---------- product: the interactive demo (css/erp-demo.css) opens from a cropped window as it scrolls in ---------- */
.x-product { padding-block: clamp(48px, 7vw, 112px); }
.x-demo__cap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 16px; margin-bottom: 12px; }
.x-stage { --p: 1; clip-path: inset(calc((1 - var(--p)) * 14%) calc((1 - var(--p)) * 20%)); }
/* Small screens keep the desktop demo at full size; the right side runs off-screen */
@media (max-width: 899px) { .x-product { overflow-x: clip; } .x-stage { width: 960px; } }

.x-statement { margin-top: 32px; max-width: 30ch; font-size: clamp(28px, 4.4vw, 72px); }

/* ---------- the close, compressed: pinned while 13 days fold into day one ---------- */
.x-close { position: relative; height: 340vh; border-block: 1px solid var(--au-border); }
.x-close__pin { position: sticky; top: 0; height: 100svh; display: grid; align-content: center; padding-top: var(--nav-h); overflow: hidden; }
.x-close__top { display: grid; gap: 24px; margin-bottom: clamp(28px, 4vw, 56px); }
@media (min-width: 1024px) { .x-close__top { grid-template-columns: 2fr 1fr; align-items: end; } }
.x-close__count { display: flex; align-items: flex-end; gap: 16px; }
@media (min-width: 1024px) { .x-close__count { justify-content: flex-end; } }
.x-close__count b { font: 400 clamp(96px, 15vw, 240px)/.78 var(--au-font-heading); letter-spacing: -0.05em; font-variant-numeric: tabular-nums; }
.x-close__count span { max-width: 10ch; font-size: 12px; text-transform: uppercase; color: var(--au-text-secondary); }
.x-days { list-style: none; display: flex; height: clamp(150px, 24svh, 240px); border: 1px solid var(--au-border); }
.x-days > li { --c: 0; flex: calc(1 - var(--c)) 1 0; min-width: 0; overflow: hidden; opacity: calc(1 - var(--c)); display: flex; flex-direction: column; justify-content: space-between; gap: 8px; padding: 12px calc(12px * (1 - var(--c))); border-left: 1px solid var(--au-border); font-size: 11px; color: var(--au-text-secondary); white-space: nowrap; }
.x-days > li:first-child { flex-grow: 1; opacity: 1; padding-inline: 12px; border-left: 0; background: var(--au-bg-secondary); color: var(--au-text-primary); }
.x-days > li > span { font-weight: 500; }
.x-merged { list-style: none; display: flex; flex-wrap: wrap; align-content: flex-start; gap: 6px; flex: 1; overflow: hidden; }
.x-merged li { display: none; padding: 3px 8px; border: 1px solid var(--au-border); font-size: 10px; text-transform: uppercase; color: var(--au-text-secondary); }
.x-merged li.on { display: block; animation: panel-in .4s var(--ease); }
.x-close__cap { display: flex; justify-content: space-between; gap: 16px; margin-top: 16px; font-size: 12px; color: var(--au-text-secondary); }
.x-close__after, .x-close.is-done .x-close__before { display: none; }
.x-close.is-done .x-close__after { display: inline; color: var(--au-text-primary); }
@media (max-width: 719px) { .x-days > li:not(:first-child) p { display: none; } .x-days > li:not(:first-child) { padding-inline: calc(4px * (1 - var(--c))); font-size: 9px; } .x-close__cap .label { display: none; } }

/* ---------- traceability: income statement wired to its source documents ---------- */
.x-trace__board { position: relative; display: grid; gap: 40px; }
@media (min-width: 900px) { .x-trace__board { grid-template-columns: 1fr 1fr; gap: clamp(80px, 11vw, 176px); } }
.x-trace__col { display: grid; align-content: start; border-top: 1px solid var(--au-border); }
.x-trace__col > .label { padding: 12px 0; }
.x-line { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; width: 100%; padding: 16px 0; border-top: 1px solid var(--au-border); text-align: left; font: 400 clamp(20px, 2.2vw, 30px)/1.2 var(--au-font-heading); letter-spacing: -0.05em; color: var(--au-text-tertiary); transition: color .3s, padding-left .4s var(--ease); }
.x-line b { font: 500 13px/1 var(--au-font-body); letter-spacing: 0; font-variant-numeric: tabular-nums; }
.x-line:hover, .x-line[aria-pressed="true"] { color: var(--au-text-primary); padding-left: 16px; }
.x-line--total { color: var(--au-text-primary); border-top-color: var(--au-text-primary); }
.x-doc { display: grid; grid-template-columns: 76px 1fr auto; gap: 12px; align-items: center; margin-top: -1px; padding: 12px 14px; border: 1px solid var(--au-border); font-size: 12px; color: var(--au-text-tertiary); transition: color .3s, background-color .3s, border-color .3s; }
.x-doc b { font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.x-doc > span:last-child { font-variant-numeric: tabular-nums; }
.x-doc.is-on { position: relative; z-index: 1; color: var(--au-text-primary); background: var(--au-bg-secondary); border-color: var(--au-text-secondary); }
.x-docs__more { padding-top: 12px; font-size: 11px; color: var(--au-text-tertiary); }
.x-trace__wires { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.x-trace__wires path { fill: none; stroke: var(--au-text-secondary); stroke-width: 1; stroke-dasharray: var(--len); stroke-dashoffset: var(--len); animation: x-wire .8s var(--ease) forwards; }
@keyframes x-wire { to { stroke-dashoffset: 0; } }
@media (max-width: 899px) { .x-trace__wires { display: none; } }

/* ---------- agents: sticky cards that stack as you scroll ---------- */
.x-stack { display: grid; gap: 24px; }
.x-card { position: sticky; top: calc(var(--nav-h) + 8px + var(--i) * 44px); /* step = header height, so earlier labels stay readable */ display: grid; grid-template-rows: auto 1fr; min-height: min(560px, 78svh); background: var(--au-bg-secondary); border: 1px solid var(--au-border); }
.x-card__meta { display: flex; justify-content: space-between; align-items: center; gap: 16px; height: 44px; padding: 0 20px; border-bottom: 1px solid var(--au-border); font-size: 11px; text-transform: uppercase; color: var(--au-text-secondary); }
.x-card__body { display: grid; gap: 32px; align-content: space-between; padding: clamp(24px, 4vw, 56px); }
@media (min-width: 1024px) { .x-card__body { grid-template-columns: 1fr 1fr; align-items: end; gap: 56px; } }
.x-card__n { display: block; margin-bottom: clamp(24px, 4vw, 64px); font: 400 clamp(72px, 9vw, 144px)/.8 var(--au-font-heading); letter-spacing: -0.05em; color: var(--au-text-tertiary); }
.x-card h3 { margin-bottom: 16px; }
.x-card .link-arrow { margin-top: 28px; }
.x-term { min-height: 220px; background: var(--au-bg-primary); border: 1px solid var(--au-border); }
.x-term .l { display: block; white-space: pre; opacity: 0; transform: translateY(4px); transition: opacity .4s, transform .4s; transition-delay: calc(var(--l) * 280ms + .3s); }
.x-term.is-in .l { opacity: 1; transform: none; }

/* ---------- ask: typed question, streamed answer ---------- */
.x-ask__box { max-width: 1040px; margin-inline: auto; }
.x-ask__input { display: flex; align-items: center; gap: 14px; min-height: 96px; padding: 24px; border-bottom: 1px solid var(--au-border); font: 400 clamp(22px, 2.8vw, 40px)/1.2 var(--au-font-heading); letter-spacing: -0.05em; }
.x-ask__prompt { color: var(--au-text-tertiary); }
.x-caret { flex: none; width: 2px; height: 1em; margin-left: -10px; background: var(--au-text-primary); animation: blink 1s steps(1) infinite; }
.x-ask__answer { display: grid; gap: 24px; min-height: 240px; padding: 24px; }
@media (min-width: 900px) { .x-ask__answer { grid-template-columns: 1fr 1fr; align-items: end; } }
.x-ask__answer p { max-width: 42ch; font-size: 14px; color: var(--au-text-secondary); opacity: 0; transition: opacity .5s; }
.x-ask__answer.is-on p { opacity: 1; }
.x-ask .bars span { transition: height .9s var(--ease); }
.x-ask .bars span:first-child { background: var(--au-text-primary); }
.x-ask__chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 16px 24px; border-top: 1px solid var(--au-border); }
.x-chip { height: 32px; padding: 0 12px; border: 1px solid var(--au-border); font-size: 11px; font-weight: 500; text-transform: uppercase; color: var(--au-text-secondary); transition: color .2s, background-color .2s, border-color .2s; }
.x-chip:hover { color: var(--au-text-primary); border-color: var(--au-text-secondary); }
.x-chip[aria-pressed="true"] { background: var(--au-text-primary); border-color: var(--au-text-primary); color: var(--au-bg-primary); }

/* ---------- numbers ---------- */
.x-numbers { padding-block: clamp(32px, 5vw, 64px); }
.x-nums { list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--au-border); border-left: 1px solid var(--au-border); }
@media (min-width: 1024px) { .x-nums { grid-template-columns: repeat(4, 1fr); } }
.x-nums li { display: grid; gap: 16px; align-content: space-between; min-height: 220px; padding: 24px 20px; border-right: 1px solid var(--au-border); border-bottom: 1px solid var(--au-border); }
.x-nums b { font: 400 clamp(56px, 7vw, 120px)/.9 var(--au-font-heading); letter-spacing: -0.05em; font-variant-numeric: tabular-nums; }
.x-nums span { max-width: 24ch; font-size: 12px; color: var(--au-text-secondary); }

/* ---------- integrations: two counter-moving rows of names ---------- */
.x-names { display: grid; gap: 4px; padding-block: clamp(40px, 6vw, 96px) 0; overflow: hidden; }
.x-names__row { display: flex; width: max-content; animation: marquee 60s linear infinite; }
.x-names__row--rev { animation-direction: reverse; }
.x-names:hover .x-names__row { animation-play-state: paused; }
.x-names__row span { padding-right: .4em; font: 400 clamp(40px, 6.4vw, 104px)/1.1 var(--au-font-heading); letter-spacing: -0.05em; white-space: nowrap; color: var(--au-text-tertiary); transition: color .3s; }
.x-names__row span::after { content: "/"; padding-left: .4em; color: var(--au-border); }
.x-names__row span:hover { color: var(--au-text-primary); }
.x-names__foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; margin-top: 24px; padding-block: 16px; border-block: 1px solid var(--au-border); }

/* ---------- trust: spec sheet ---------- */
.x-spec { border-top: 1px solid var(--au-border); }
.x-spec__row { display: grid; gap: 8px 24px; padding: 24px 0; border-bottom: 1px solid var(--au-border); transition: background-color .4s var(--ease), padding .4s var(--ease); }
@media (min-width: 900px) { .x-spec__row { grid-template-columns: 1fr 3fr 4fr; align-items: baseline; } }
.x-spec__row h3 { font-size: clamp(24px, 2.6vw, 36px); line-height: 1.1; }
.x-spec__row p { font-size: 13px; color: var(--au-text-secondary); }
.x-spec__row:hover { background: var(--au-bg-secondary); padding-inline: 16px; }

/* ---------- closing ---------- */
.x-cta { padding-block: clamp(80px, 12vw, 192px) clamp(48px, 6vw, 96px); border-top: 1px solid var(--au-border); }
.x-cta__title { margin-top: 24px; font-size: clamp(56px, 13.2vw, 232px); line-height: .86; }
.x-cta__title .ln:nth-child(2) { padding-left: 12vw; }
.x-cta__foot { display: grid; gap: 24px; margin-top: clamp(40px, 5vw, 72px); padding-top: 20px; border-top: 1px solid var(--au-border); }
@media (min-width: 1024px) { .x-cta__foot { grid-template-columns: 1fr auto; align-items: center; } }

@media (prefers-reduced-motion: reduce) {
  .x-close { height: auto; }
  .x-close__pin { position: static; height: auto; padding-block: 96px; }
  .x-stage { clip-path: none; }
  .x-card { position: static; }
  .x-names__row { animation: none; }
}