/* AI Systems Audit page (/ai/audit). Page-specific arrangement only, loaded after kj.css.
   Every colour, size and space comes from kijestic-tokens.css. No new fonts, no external requests. */

/* Price states. The page ships both fee sentences between build markers (<!--PRICE-->, <!--NOPRICE-->);
   the build keeps one. In an unbuilt preview the published-price sentence stays hidden, and the
   release-gated footer items stay hidden unless the page is explicitly public. */
[data-price] { display: none; }
html:not([data-release="public"]) [data-r1] { display: none !important; }

/* What you get: a ruled, numbered list */
.audit-list { list-style: none; counter-reset: audit; margin-top: var(--kj-6); max-width: 52em; padding: 0; }
.audit-list li { counter-increment: audit; position: relative; padding: var(--kj-4) 0 var(--kj-4) 3.25rem;
  border-top: 1px solid var(--c-line); font-size: 1.125rem; line-height: 1.5; color: var(--c-head); }
.audit-list li:last-child { border-bottom: 1px solid var(--c-line); }
.audit-list li::before { content: counter(audit, decimal-leading-zero); position: absolute; left: 0; top: var(--kj-4);
  font-family: var(--kj-mono); font-size: var(--kj-label); font-weight: 500; letter-spacing: 0.12em; line-height: 2.1;
  color: var(--c-text2); }
.audit-note { margin: var(--kj-5) 0 0; max-width: 46em; }

/* How it works: five numbered steps */
.audit-steps { counter-reset: flow; margin-top: var(--kj-6); padding: 0; }
.audit-steps .step { counter-increment: flow; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .audit-steps .step { grid-template-columns: 17rem minmax(0, 1fr); } }
.audit-steps .step h3 { font-family: var(--kj-mono); font-size: var(--kj-label); font-weight: 500; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--c-head); padding-top: var(--kj-1); line-height: 1.6; }
.audit-steps .step h3::before { content: counter(flow, decimal-leading-zero) "  "; color: var(--c-text2); white-space: pre; }
.audit-steps .step p { margin: 0; font-size: 1.125rem; color: var(--c-head); max-width: 40em; }

/* Who it is for: yes list beside the no list */
.fit-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--kj-5) var(--kj-8); margin-top: var(--kj-6); }
.fit-grid .fit-no-head { margin: var(--kj-4) 0 0; }
.fit-grid .checklist li { font-size: 1.0625rem; }
@media (min-width: 900px) {
  .fit-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); row-gap: var(--kj-3); }
  .fit-grid .fit-yes { grid-column: 1; grid-row: 2; }
  .fit-grid .fit-no-head { grid-column: 2; grid-row: 1; margin: 0; align-self: end; }
  .fit-grid .fit-no { grid-column: 2; grid-row: 2; }
}

/* Who does the work: a quiet block under the five steps */
.audit-who { margin-top: var(--kj-7); padding-top: var(--kj-5); border-top: 1px solid var(--c-line); max-width: 40em; }
.audit-who h3 { font-size: 1.25rem; margin-bottom: var(--kj-2); }
.audit-who p { margin: 0; font-size: 1.125rem; color: var(--c-head); }

/* Fee */
.audit-fee { margin-top: var(--kj-4); max-width: 38em; color: var(--c-head); }
.audit-compare { margin: var(--kj-5) 0 0; max-width: 38em; color: var(--c-text2); }
.audit-smaller { margin: var(--kj-6) 0 var(--kj-2); max-width: 38em; color: var(--c-text2); }

/* Apply: intro beside the form card */
.apply-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--kj-7); align-items: start; }
@media (min-width: 900px) {
  .apply-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--kj-8); }
  .apply-intro { position: sticky; top: calc(var(--header-h) + var(--kj-6)); }
}
.apply-intro .lede { margin-top: var(--kj-4); }
.apply-intro .fine { margin: var(--kj-5) 0 0; max-width: 34em; }

fieldset.group { border: 0; padding: 0; margin: 0 0 var(--kj-6); min-width: 0; }
fieldset.group > legend { display: block; width: 100%; padding: 0 0 var(--kj-3); margin: 0 0 var(--kj-5);
  border-bottom: 1px solid var(--kj-line-strong); font-family: var(--kj-mono); font-size: var(--kj-label); font-weight: 500;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--kj-text-2); }
.form-card .field { min-width: 0; }
.form-card .field .opt { font-size: var(--kj-small); }
.form-card textarea { min-height: 112px; }
#audit_tried { min-height: 88px; }
#audit_workflow { min-height: 144px; }
#form-status ul { margin: var(--kj-3) 0 0; padding-left: 20px; }
#form-status li { margin: 0 0 var(--kj-1); }