/* Destination-specific editorial and worksheet surfaces. Uses existing tokens;
   does not replace Agentz's approved atmosphere or APU.bot outline. */
.experience-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 24px; margin-top: 32px; }
.experience-card { padding: clamp(24px, 3vw, 40px); border: 1px solid var(--line); border-radius: 24px; background: var(--surface); min-width: 0; overflow-wrap: anywhere; }
.experience-card h3 { font-family: var(--font-sans); font-size: clamp(24px, 2.5vw, 32px); line-height: 1.2; margin: 12px 0 16px; }
.experience-card p { color: var(--muted); font-size: 16px; line-height: 1.6; max-width: 65ch; }
.experience-card .strip-link { display: inline-flex; align-items: center; min-height: 48px; margin-top: 20px; }
.experience-kicker { color: var(--hint); font-family: var(--font-sans); font-size: 14px; line-height: 20px; }
.experience-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 24px; }
.experience-actions :is(a, button) { min-height: 48px; font: 500 15px/1.5 var(--font-sans); }
.btn-ghost { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 12px 20px; border: 1px solid var(--md-sys-color-outline); border-radius: 999px; color: var(--accent-ink); background: transparent; font: 500 15px/1.5 var(--font-sans); text-decoration: none; cursor: pointer; }
@media (hover: hover) and (pointer: fine) {
  .btn-ghost:hover:not(:disabled) { background: var(--elevated); }
}
.btn-ghost:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 3px; }
.experience-note { color: var(--muted); font-size: 14px; line-height: 1.6; max-width: 70ch; margin-top: 20px; }
.experience-copy { max-width: 70ch; color: var(--muted); font-size: 18px; line-height: 1.65; }
.experience-copy p + p { margin-top: 16px; }
/* Editorial sequences, not capability cards. Numbering represents real stages. */
.strategy-sequence { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 48px; padding-left: 24px; margin: 36px 0 0; }
.strategy-sequence li { min-width: 0; padding-left: 8px; }
.strategy-sequence li::marker { color: var(--accent-ink); font: 500 18px/1.5 var(--font-sans); }
.strategy-sequence h3 { color: var(--ink); font: 500 clamp(21px, 2.2vw, 26px)/1.3 var(--font-sans); margin-bottom: 12px; }
.strategy-sequence p { color: var(--muted); font: 16px/1.65 var(--font-sans); max-width: 65ch; }
.strategy-questions { margin-top: 28px; }
.strategy-questions .strip-link { display: inline-flex; align-items: center; min-height: 48px; margin: 8px 18px 16px; }
.strategy-questions summary { font: 500 17px/1.45 var(--font-sans); }
/* Leave section headings visible below the fixed narrow-screen app bar. */
.band[id] { scroll-margin-top: 112px; }
.strategy-disclosure { margin-top: 24px; }
.strategy-disclosure > summary { min-height: 48px; align-content: center; color: var(--accent-ink); font: 500 16px/1.5 var(--font-sans); cursor: pointer; }
.strategy-disclosure > summary:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 4px; border-radius: 8px; }
.hero .cta-sub { font: 400 13px/1.5 var(--font-sans); letter-spacing: normal; max-width: 40ch; text-align: center; }
/* One job-first headline; preserve the existing display scale and atmosphere. */
.hero .headline { max-width: 18ch; text-wrap: balance; }
.hero .headline + .subhead { margin-top: 24px; }
/* The rail and CSS zoom can narrow the content without crossing a viewport
   breakpoint. Collapse the side columns against the hero's own available width. */
.hero { container-type: inline-size; }
@container (max-width: 900px) {
  .hero-body { grid-template-columns: minmax(0, 1fr); padding: 80px 16px 0; }
  .hero .stat-col, .hero .float-field { display: none; }
  .hero-center { padding: 40px 0 60px; }
}
#pricing > .ci-body + .ci-body { margin-top: 20px; }
@media (max-width: 1000px) { .strategy-sequence { grid-template-columns: minmax(0, 1fr); } }
.murmur-path { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; padding: 0; margin: 32px 0; }
.murmur-path li { border-top: 2px solid var(--line); padding-top: 24px; min-width: 0; }
.murmur-path h3 { font: 500 22px/1.3 var(--font-sans); margin-bottom: 12px; }
.murmur-path p { color: var(--muted); font: 16px/1.6 var(--font-sans); }
.publication-status { border-left: 3px solid var(--accent-ink); padding: 12px 20px; margin: 28px 0; }
.publication-status h3 { font: 500 20px/1.4 var(--font-sans); margin-bottom: 8px; }
.publication-status p { color: var(--muted); font: 16px/1.6 var(--font-sans); }
.brief-layout { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: start; gap: clamp(24px, 4vw, 48px); margin-top: 32px; }
.brief-form, .brief-review { min-width: 0; }
.brief-form { display: grid; gap: 24px; }
.brief-field { display: grid; gap: 8px; }
.brief-field label { color: var(--ink); font: 500 16px/1.5 var(--font-sans); }
.brief-field small { color: var(--hint); font: 14px/1.5 var(--font-sans); }
.brief-field :is(textarea,select) { width: 100%; min-width: 0; min-height: 48px; border: 1px solid var(--md-sys-color-outline); border-radius: 12px; background: var(--surface); color: var(--ink); padding: 12px 16px; font: 16px/1.5 var(--font-sans); }
.brief-field textarea { resize: vertical; min-height: 104px; }
.brief-field :is(textarea,select):focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 2px; }
.brief-review { border: 1px solid var(--line); border-radius: 24px; padding: clamp(20px, 3vw, 32px); background: var(--elevated); }
.brief-review h3 { font: 500 24px/1.3 var(--font-sans); margin: 8px 0 20px; }
.brief-review dl { display: grid; gap: 8px; }
.brief-review dt { color: var(--hint); font: 500 14px/1.5 var(--font-sans); margin-top: 12px; }
.brief-review dd { color: var(--ink); font: 16px/1.6 var(--font-sans); white-space: pre-wrap; overflow-wrap: anywhere; }
.brief-review p { font: 14px/1.6 var(--font-sans); color: var(--muted); }
.brief-review .experience-actions button { width: 100%; }
.brief-review [tabindex="-1"]:focus { outline: 2px solid var(--accent-ink); outline-offset: 6px; }
.brief-form [disabled] { opacity: 0.65; cursor: not-allowed; }
/* Keep output-action text at full contrast across disabled-to-enabled updates. */
.brief-review [disabled] { cursor: not-allowed; }
html:not(.js-ready) .brief-form { display: none; }
.brief-form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: 20px; }
.brief-form legend { font-size: 20px; font-weight: 600; margin-bottom: 24px; }
.review-notes-control { border-top: 1px solid var(--line); padding-top: 16px; }
.review-notes-toggle { display: flex; gap: 12px; align-items: center; min-height: 48px; cursor: pointer; font: 500 16px/1.5 var(--font-sans); }
.review-notes-toggle input { width: 20px; height: 20px; flex: 0 0 20px; accent-color: var(--accent-ink); }
.review-notes-toggle small { display: block; font-weight: 400; color: var(--muted); font-size: 14px; }
.review-notes-control .experience-note { margin-top: 8px; }
.brief-form fieldset.review-notes-fields { border-left: 2px solid var(--line); padding-left: 16px; }
.brief-form fieldset[hidden] { display: none; }
.review-notes-fields .experience-note { margin-top: 0; }
.review-notes-output { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line); }
.review-notes-output h4 { font: 500 18px/1.4 var(--font-sans); }
.decision-example { padding: clamp(20px, 4vw, 40px); border: 1px solid var(--line); border-radius: 24px; background: var(--surface); margin: 24px 0; max-width: 80ch; }
.decision-example h3 { font: 500 24px/1.3 var(--font-sans); margin-bottom: 24px; }
.decision-example p { font: 16px/1.65 var(--font-sans); margin-top: 24px; color: var(--muted); }
.decision-example dl { display: grid; grid-template-columns: minmax(120px, 1fr) minmax(0, 3fr); gap: 16px 24px; font: 16px/1.65 var(--font-sans); }
.decision-example dt { color: var(--ink); font-weight: 600; }
.decision-example dd { color: var(--muted); min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 600px) { .decision-example dl { grid-template-columns: minmax(0, 1fr); gap: 8px; } .decision-example dd { margin-bottom: 16px; } }
@media (max-width: 760px) {
  .experience-grid, .brief-layout, .murmur-path { grid-template-columns: minmax(0, 1fr); }
  .experience-actions { align-items: stretch; flex-direction: column; }
  .experience-actions :is(a,button) { justify-content: center; text-align: center; }
}
@media (forced-colors: active) {
  .experience-card, .brief-review, .publication-status { border: 1px solid CanvasText; }
}

/* L1–L4 product relationship and authored revision walkthrough.
   Scoped to these surfaces; approved site glow, typography and tokens stay intact. */
.hero-example-link { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; color: var(--ink); font: 500 14px/1.5 var(--font-sans); text-underline-offset: 4px; }
/* Fit the content width too: CSS zoom can leave the desktop viewport breakpoint active. */
.product-flow { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: 28px; list-style: none; padding: 0; margin: 36px 0 24px; }
.product-flow li { min-width: 0; overflow-wrap: anywhere; border-top: 2px solid var(--line); padding-top: 20px; }
.product-flow li:last-child { border-color: var(--accent-ink); }
.product-flow span { color: var(--muted); font: 500 14px/1.5 var(--font-sans); }
.product-flow h3 { color: var(--ink); font: 500 23px/1.25 var(--font-sans); margin: 16px 0 12px; }
.product-flow p { color: var(--muted); font: 16px/1.65 var(--font-sans); }
.journey-teaser { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px 28px; border-radius: 20px; background: var(--surface); border: 1px solid var(--line); margin-top: 32px; text-decoration: none; }
.journey-teaser strong { display: block; color: var(--ink); font: 500 22px/1.3 var(--font-sans); margin-bottom: 8px; }
.journey-teaser span span { display: block; color: var(--muted); font: 16px/1.6 var(--font-sans); max-width: 65ch; }
.journey-teaser > span:last-child { font-size: 28px; color: var(--accent-ink); }
.journey { margin-top: 32px; border: 1px solid var(--line); border-radius: 28px; overflow: clip; background: var(--bg); }
.journey [hidden], .journey[hidden], #journey-fallback[hidden] { display: none; }
.journey-heading { padding: clamp(24px, 3vw, 36px); border-bottom: 1px solid var(--line); }
.journey-label { color: var(--muted); font: 500 14px/1.5 var(--font-sans); }
.journey h3 { font: 500 clamp(26px, 3vw, 36px)/1.2 var(--font-sans); max-width: 28ch; margin: 12px 0; }
.journey h4 { font: 500 22px/1.3 var(--font-sans); margin: 12px 0; color: var(--ink); }
.journey p, .journey dd { color: var(--muted); font: 16px/1.65 var(--font-sans); max-width: 70ch; overflow-wrap: anywhere; }
.journey .journey-label { font-size: 14px; }
.journey-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.journey-inputs { list-style: none; padding: 0; margin: 0; }
.journey-inputs li { padding: 28px clamp(24px, 3vw, 36px); border-bottom: 1px solid var(--line); }
.journey-inputs li:last-child { border-bottom: 0; }
.journey details { margin-top: 12px; }
.journey summary { min-height: 48px; align-content: center; color: var(--accent-ink); font: 500 14px/1.5 var(--font-sans); cursor: pointer; }
.journey details p { font-size: 14px; margin-top: 12px; }
.journey .journey-ref { padding-top: 12px; border-top: 1px solid var(--line); }
.journey-proposal { padding: 28px clamp(24px, 3vw, 36px); background: var(--surface); border-left: 1px solid var(--line); }
.journey .journey-status { color: var(--accent-ink); font: 500 14px/1.5 var(--font-sans); margin: 24px 0 12px; }
.journey-proposal h4 { font-size: clamp(26px, 2.7vw, 32px); margin-bottom: 20px; }
.journey dl { margin-top: 24px; }
.journey dt { font: 500 14px/1.5 var(--font-sans); color: var(--ink); margin-top: 20px; margin-bottom: 6px; }
.journey dd { margin: 0; }
.journey-revision { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 24px; border-bottom: 1px solid var(--line); padding: 24px clamp(24px, 3vw, 36px); }
.journey-revision > div:first-child { flex: 1 1 280px; }
.journey-revision p { max-width: 48ch; font-size: 14px; }
.journey-revision h4 { margin-top: 0; }
.journey-actions { display: grid; gap: 8px; }
.journey-actions button { min-height: 48px; padding: 12px 20px; border: 1px solid var(--md-sys-color-outline); border-radius: 999px; background: var(--surface); color: var(--accent-ink); font: 500 15px/1.5 var(--font-sans); cursor: pointer; }
.journey-actions button[aria-disabled="true"] { cursor: default; }
@media (hover: hover) and (pointer: fine) {
  .journey-actions button:not([aria-disabled="true"]):hover { background: var(--elevated); }
}
.journey :is(summary, button):focus-visible, .journey-teaser:focus-visible, .hero-example-link:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 4px; border-radius: 8px; }
.journey .journey-announcement { padding: 0 clamp(24px, 3vw, 36px) 20px; max-width: none; font-size: 14px; }
.journey .journey-announcement:empty { padding: 0; }
.journey-history { margin: 0 clamp(24px, 3vw, 36px) 28px; padding: 4px 0 4px 20px; border-left: 2px solid var(--accent-ink); }
.journey-history p, .journey-history dd { font-size: 14px; }
.journey .journey-ending { border-top: 1px solid var(--line); padding: 24px clamp(24px, 3vw, 36px); max-width: none; font-size: 14px; }
@media (max-width: 1100px) { .product-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 1000px) { .journey-layout { grid-template-columns: minmax(0, 1fr); } .journey-proposal { border-left: 0; border-top: 1px solid var(--line); } }
@media (max-width: 600px) { .product-flow { grid-template-columns: minmax(0, 1fr); gap: 24px; } .journey-actions { width: 100%; } .journey-teaser { padding: 24px; } }
@media (forced-colors: active) { .journey, .journey-proposal, .journey-teaser { border: 1px solid CanvasText; } }

/* 2026-09-10: classes replacing the last inline style attributes (CSP-ready) */
.sector-tag-end { justify-content: flex-end; }
.sec-node-f { color: var(--sector-finance); }
.sec-node-i { color: var(--sector-insurance); }
.sec-node-r { color: var(--sector-real-infra); }
.sec-node-e { color: var(--sector-electronic-lab); }
.final-mark { margin: 0 auto 24px; }
.footer-lede { margin-top: 12px; }