/* Public product story. Styles are independent of the authenticated console. */
.hp-symbols { position: absolute; width: 0; height: 0; overflow: hidden; }
.hp-main { color: var(--m-navy); }
.hp-main *, .hp-footer * { box-sizing: border-box; }
.hp-main svg, .hp-footer svg, .hp-icon { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.hp-wrap { max-width: 1340px; margin: auto; padding-inline: 56px; }
.hp-section { padding-block: 110px; scroll-margin-top: 88px; }
.hp-eyebrow { display: block; margin-bottom: 22px; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--m-text-2); font-weight: 600; }
.hp-main h2 { font-size: clamp(34px, 3.5vw, 50px); line-height: 1.14; font-weight: 500; letter-spacing: -.045em; margin: 0; }
.hp-main h2 span { color: var(--m-text-2); }
.hp-main h3 { font-weight: 500; letter-spacing: -.025em; }
.hp-main p { margin: 0; }
.hp-section-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 55px; margin-bottom: 56px; }
.hp-section-head > p, .hp-section-head > div + div { max-width: 355px; }
.hp-section-head p, .hp-editorial > p { font-size: 16px; line-height: 1.8; color: var(--m-text-2); }
.hp-split { display: grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items: center; }
.hp-editorial > p { margin-top: 24px; max-width: 43ch; }
.hp-overline { display: block; font-size: 10px; font-weight: 500; letter-spacing: .09em; text-transform: uppercase; color: var(--m-text-3); }
.hp-caption { font-size: 11px; line-height: 1.7; color: var(--m-text-3); margin-top: 22px !important; }
.hp-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--m-blue); flex: none; }
.hp-scene-label { display: flex; align-items: center; gap: 8px; font-size: 11px; color: var(--m-text-2); margin-bottom: 23px; }
.hp-scene-label > span:last-child { margin-left: auto; font-size: 10px; color: var(--m-text-3); }
.hp-text-link { display: inline-flex; align-items: center; gap: 12px; font-size: 13px; font-weight: 600; color: var(--m-navy); margin-top: 27px; }
.hp-text-link svg { width: 18px; }
.hp-centred { text-align: center; }
.hp-centred > p { color: var(--m-text-2); font-size: 16px; margin-top: 22px; }
.hp-why { background: #fbfcff; border-bottom: 1px solid var(--m-blue-tint); }
.hp-gap-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 45px; }
.hp-gap-item { min-width: 0; }
.hp-gap-item + .hp-gap-item { padding-left: 35px; border-left: 1px solid var(--m-line); }
.hp-gap-item h3 { font-size: 20px; line-height: 1.35; margin-top: 10px; max-width: 22ch; }
.hp-gap-item > p { font-size: 14px; line-height: 1.8; color: var(--m-text-2); margin-top: 12px; max-width: 32ch; }
.hp-number { color: var(--m-text-3); font-size: 11px; font-family: var(--font-mono); }
.hp-mini-estate, .hp-mini-rules, .hp-mini-evidence { height: 154px; margin-bottom: 22px; padding-top: 12px; }
.hp-mini-estate { display: grid; grid-template-columns: repeat(3, 1fr); text-align: center; align-content: start; position: relative; }
.hp-mini-estate > span { font-size: 10px; color: var(--m-text-2); border: 1px solid var(--m-line); background: white; border-radius: 7px; padding: 8px 4px; margin-right: 5px; }
.hp-mini-estate i { grid-column: 1 / -1; height: 32px; border: 1px solid var(--m-line); border-top: 0; margin: 0 45px 20px; position: relative; }
.hp-mini-estate i::after { content: ''; position: absolute; top: 100%; left: 50%; height: 20px; border-left: 1px solid var(--m-line); }
.hp-mini-estate > div { grid-column: 1 / -1; display: flex; gap: 8px; justify-content: center; }
.hp-mini-estate b { font-size: 10px; font-weight: 500; background: var(--m-blue-tint); padding: 9px 12px; border-radius: 6px; color: var(--m-blue); }
.hp-mini-estate .hp-unknown { background: var(--m-amber-soft); color: var(--m-amber); border: 1px dashed #F2C77A; }
.hp-mini-rules > div:first-child { display: flex; align-items: center; gap: 9px; background: white; border: 1px solid var(--m-line); border-radius: 9px; padding: 16px 10px; box-shadow: 0 10px 25px #183c6a06; }
.hp-mini-rules b { font-size: 10px; font-weight: 500; }
.hp-mini-rules svg { color: var(--m-navy); }
.hp-mini-rules > div:first-child > span { font-size: 9px; color: var(--m-violet); background: #EFEBFF; padding: 3px 7px; border-radius: 4px; margin-left: auto; }
.hp-mini-rules > div:last-child { display: flex; align-items: center; margin-top: 25px; gap: 10px; color: var(--m-text-2); font-size: 11px; }
.hp-mini-rules i { flex: 1; height: 1px; background: var(--m-line); }
.hp-question { color: var(--m-amber); background: var(--m-amber-soft); border-radius: 50%; width: 24px; height: 24px; display: grid; place-items: center; }
.hp-mini-evidence { padding-inline: 15px; }
.hp-mini-evidence > div { display: flex; align-items: center; gap: 12px; padding: 7px 0; }
.hp-mini-evidence b { color: var(--m-text-2); font-size: 11px; font-weight: 500; }
.hp-tick, .hp-missing { display: grid; place-items: center; width: 23px; height: 23px; font-size: 11px; background: var(--m-green-soft); color: var(--m-green); border-radius: 50%; }
.hp-missing { background: var(--m-amber-soft); color: var(--m-amber); }
.hp-principle { display: flex; align-items: center; gap: 10px; border-top: 1px solid var(--m-line); padding-top: 24px; margin-top: 42px; font-size: 12px; color: var(--m-text-2); }
.hp-intelligence { background: white; }
.hp-selector { margin-top: 34px; }
.hp-source-step { display: flex; width: 100%; align-items: center; gap: 18px; text-align: left; border: 0; border-top: 1px solid var(--m-blue-tint); background: transparent; padding: 19px 10px 19px 0; color: var(--m-text-2); font: inherit; cursor: pointer; }
.hp-source-step > span { font-size: 11px; color: var(--m-text-3); }
.hp-source-step > svg { width: 18px; margin-left: auto; opacity: 0; }
.hp-source-step strong { display: block; font-size: 14px; font-weight: 500; }
.hp-source-step small { display: block; font-size: 12px; margin-top: 4px; color: var(--m-text-3); }
.hp-source-step[aria-pressed="true"] { color: var(--m-navy); border-top-color: #9DBAFF; }
.hp-source-step[aria-pressed="true"] > svg { opacity: 1; }
.hp-source-scene { position: relative; padding: 35px; border-radius: 25px; background: radial-gradient(ellipse at 100% 0, var(--m-blue-tint), transparent 65%), var(--m-blue-tint); }
.hp-source-panel { background: white; border: 1px solid var(--m-line); padding: 26px; border-radius: 13px; box-shadow: 0 18px 35px #2143770b; }
.hp-document-top { display: flex; align-items: center; gap: 12px; }
.hp-doc-icon { display: grid; place-items: center; width: 39px; height: 45px; background: var(--m-blue-tint); color: var(--m-navy); border-radius: 7px; }
.hp-document-top h3 { font-size: 13px; line-height: 1.4; margin-top: 4px; }
.hp-version { margin-left: auto; font-size: 9px; color: var(--m-text-3); border: 1px solid var(--m-line); border-radius: 5px; padding: 4px 7px; }
.hp-paper-lines { display: grid; gap: 7px; margin-block: 30px 20px; }
.hp-paper-lines i { height: 5px; background: var(--m-blue-tint); border-radius: 3px; }
.hp-paper-lines i:nth-child(2) { width: 91%; }
.hp-paper-lines i:last-child { width: 65%; }
.hp-excerpt { border-left: 2px solid #9DBAFF; padding: 14px 16px; background: var(--m-blue-tint); }
.hp-excerpt > span { display: block; font-size: 10px; color: var(--m-text-2); margin-bottom: 9px; }
.hp-excerpt p { font-size: 14px; line-height: 1.75; color: var(--m-navy); min-height: 98px; }
.hp-document-meta { margin-top: 23px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.hp-document-meta > div > span { display: block; color: var(--m-text-3); font-size: 9px; }
.hp-document-meta strong { font-size: 10px; font-weight: 500; }
.hp-chip { display: inline-block; color: var(--m-navy); background: var(--m-green-soft); font-size: 9px; padding: 5px 9px; border-radius: 5px; white-space: nowrap; }
.hp-review-link { display: flex; flex-direction: column; align-items: center; color: var(--m-text-3); }
.hp-review-link span { height: 15px; border-left: 1px solid var(--m-line); }
.hp-review-link svg { width: 17px; height: 17px; }
.hp-review-note { display: flex; align-items: center; gap: 12px; background: #ffffffc9; border: 1px solid white; border-radius: 11px; padding: 16px; }
.hp-avatar { display: grid; place-items: center; width: 34px; height: 34px; flex: none; color: var(--m-violet); background: #EFEBFF; border-radius: 50%; font-size: 10px; }
.hp-review-note strong { display: block; font-size: 12px; font-weight: 500; }
.hp-review-note p { color: var(--m-text-3); font-size: 10px; margin-top: 4px; }
.hp-agents { background: #101e38; color: #e9effb; }
.hp-agents .hp-eyebrow { color: #93b1f1; }
.hp-agents h2 span { color: #8fa6ca; }
.hp-agents .hp-section-head p { color: #a0afc6; }
.hp-disclosure { display: block; font-size: 10px; margin-top: 15px; color: var(--m-text-3); }
.hp-workspace { border: 1px solid var(--m-line); border-radius: 15px; background: #fff; color: var(--m-navy); overflow: hidden; box-shadow: 0 30px 80px #0003; }
.hp-workspace-top { display: flex; align-items: center; gap: 24px; padding: 19px 26px; border-bottom: 1px solid var(--m-line); }
.hp-workspace-top > div { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.hp-workspace-top svg { width: 17px; color: var(--m-navy); }
.hp-workspace-top > span { font-size: 10px; color: var(--m-text-3); }
.hp-workspace-date { margin-left: auto; }
.hp-workspace-body { display: grid; grid-template-columns: 275px 1fr; }
.hp-agent-list { padding: 25px 16px; background: #f8faff; border-right: 1px solid var(--m-line); }
.hp-agent-list > .hp-overline { padding: 0 10px 20px; }
.hp-agent-button { display: flex; width: 100%; align-items: center; gap: 10px; margin-bottom: 8px; padding: 15px 10px; border: 1px solid transparent; background: transparent; text-align: left; font: inherit; cursor: pointer; border-radius: 9px; color: var(--m-text-2); }
.hp-agent-button[aria-pressed="true"] { background: #fff; border-color: var(--m-line); color: var(--m-blue); box-shadow: 0 5px 16px #20417c06; }
.hp-agent-monogram { display: grid; place-items: center; width: 32px; height: 35px; border-radius: 7px; background: var(--m-blue-tint); color: var(--m-text-3); font-size: 10px; }
.hp-agent-button strong { display: block; font-size: 11px; font-weight: 500; }
.hp-agent-button small { display: block; font-size: 9px; color: var(--m-text-3); margin-top: 4px; }
.hp-status-dot { width: 5px; height: 5px; border-radius: 50%; margin-left: auto; flex: none; }
.hp-amber { background: var(--m-amber); }.hp-green { background: var(--m-green); }.hp-grey { background: var(--m-line-strong); }
.hp-inventory-foot { border-top: 1px solid var(--m-line); display: flex; gap: 7px; align-items: center; font-size: 9px; color: var(--m-text-3); margin: 32px 10px 0; padding-top: 18px; }
.hp-inventory-foot svg { width: 14px; }
.hp-assessment { padding: 32px; }
.hp-assessment-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 15px; }
.hp-assessment h3 { font-size: 22px; margin-top: 8px; }
.hp-assessment-heading p { font-size: 11px; color: var(--m-text-3); margin-top: 8px; }
.hp-outcome { padding: 6px 10px; border-radius: 5px; font-size: 10px; white-space: nowrap; }
.hp-outcome--amber { background: var(--m-amber-soft); color: var(--m-amber); }.hp-outcome--green { background: var(--m-green-soft); color: var(--m-navy); }.hp-outcome--grey { background: var(--m-blue-tint); color: var(--m-text-2); }
.hp-assessment-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 28px; }
.hp-rule-card, .hp-evidence-card { border: 1px solid var(--m-line); border-radius: 8px; padding: 20px; }
.hp-rule-card h4, .hp-evidence-card > strong { display: block; font-size: 13px; font-weight: 500; margin: 13px 0 10px; }
.hp-rule-card > p, .hp-evidence-card > p { font-size: 11px; line-height: 1.8; color: var(--m-text-2); min-height: 60px; }
.hp-rule-footer { display: flex; gap: 6px; align-items: center; color: var(--m-green); font-size: 10px; margin-top: 18px; }
.hp-rule-footer svg { width: 13px; }
.hp-evidence-ref { display: block; margin-top: 18px; font-size: 10px; color: var(--m-text-3); }
.hp-next-action { display: flex; gap: 15px; align-items: center; background: var(--m-blue-tint); padding: 15px 17px; border-radius: 8px; margin-top: 19px; }
.hp-next-action > span { font-size: 9px; text-transform: uppercase; letter-spacing: .04em; color: var(--m-text-3); white-space: nowrap; }
.hp-next-action p { font-size: 11px; color: var(--m-text-2); }
.hp-next-action svg { width: 16px; margin-left: auto; color: var(--m-text-3); }
.hp-workspace-foot { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 12px 26px; border-top: 1px solid var(--m-line); font-size: 9px; color: var(--m-text-3); }
.hp-workspace-foot > span { display: flex; gap: 8px; align-items: center; }
.hp-workspace-foot svg { width: 13px; height: 16px; }
.hp-agent-outcomes { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 35px; }
.hp-agent-outcomes p { color: #859bbb; font-size: 11px; }
.hp-agent-outcomes strong { display: block; color: #d3def0; font-size: 13px; font-weight: 500; margin-bottom: 6px; }
.hp-agent-outcomes > span { color: #4e6c95; }
.hp-human { background: #fff; }
.hp-decision-scene { padding: 34px; border-radius: 24px; background: var(--m-green-soft); }
.hp-decision { background: white; padding: 28px; border: 1px solid var(--m-green-soft); border-radius: 13px; box-shadow: 0 12px 30px #21594208; }
.hp-decision h3 { font-size: 24px; line-height: 1.5; margin-top: 18px; color: var(--m-navy); }
.hp-decision-person { display: flex; align-items: center; gap: 12px; margin-top: 24px; }
.hp-decision-person .hp-avatar { background: var(--m-green-soft); color: var(--m-green); }
.hp-decision-person strong, .hp-decision-person div > span { display: block; font-size: 10px; font-weight: 500; }
.hp-decision-person div > span { font-size: 9px; color: var(--m-text-3); margin-top: 3px; }
.hp-decision-bottom { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--m-green-soft); margin-top: 22px; padding-top: 17px; }
.hp-decision-bottom > span:last-child { display: flex; align-items: center; gap: 4px; font-size: 9px; color: var(--m-text-2); }
.hp-decision-bottom svg { width: 12px; }
.hp-history { margin: 24px 20px 0; }
.hp-history > div { display: flex; gap: 16px; align-items: flex-start; position: relative; padding-bottom: 22px; }
.hp-history > div:last-child { padding-bottom: 0; }
.hp-history i { width: 7px; height: 7px; border-radius: 50%; margin-top: 7px; background: var(--m-green); z-index: 1; }
.hp-history > div:not(:last-child)::before { content: ''; position: absolute; left: 3px; top: 12px; bottom: -6px; border-left: 1px solid var(--m-green-soft); }
.hp-history > div > span { font-size: 10px; color: var(--m-green); padding-top: 3px; }
.hp-history p { font-size: 12px; color: var(--m-green); }
.hp-history small { display: block; font-size: 10px; color: var(--m-text-3); margin-top: 3px; }
.hp-check-list { padding: 0; list-style: none; margin: 26px 0 0; }
.hp-check-list li { display: flex; align-items: center; gap: 12px; margin: 15px 0; font-size: 13px; color: var(--m-text-2); }
.hp-check-list svg { width: 17px; color: var(--m-green); }
.hp-editorial > .hp-human-note { font-size: 11px; color: var(--m-text-3); border-top: 1px solid var(--m-line); padding-top: 19px; }
.hp-platform { background: #f8faff; border-block: 1px solid var(--m-blue-tint); }
.hp-platform-flow { display: grid; grid-template-columns: repeat(5, 1fr); gap: 28px; list-style: none; margin: 55px 0 35px; padding: 0; }
.hp-platform-flow li { text-align: center; position: relative; }
.hp-platform-flow li:not(:last-child)::after { content: ''; position: absolute; left: calc(50% + 38px); right: calc(-50% + 10px); top: 33px; border-top: 1px solid var(--m-line); }
.hp-flow-icon { position: relative; display: grid; place-items: center; margin: 0 auto 22px; width: 66px; height: 66px; border: 1px solid var(--m-line); border-radius: 18px; background: white; color: var(--m-navy); box-shadow: 0 8px 18px #31589a06; }
.hp-platform-flow small { color: var(--m-text-3); font-size: 10px; }
.hp-platform-flow h3 { font-size: 16px; margin-top: 7px; }
.hp-platform-flow p { color: var(--m-text-3); font-size: 11px; margin-top: 8px; }
.hp-deploy-points { margin-top: 30px; }
.hp-deploy-points > div { padding: 16px 0; border-top: 1px solid var(--m-blue-tint); }
.hp-deploy-points strong { font-size: 13px; font-weight: 500; }
.hp-deploy-points p { font-size: 12px; color: var(--m-text-3); line-height: 1.8; margin-top: 6px; }
.hp-architecture { padding: 28px; border: 1px solid var(--m-line); border-radius: 22px; background: linear-gradient(145deg, #fafcff, var(--m-blue-tint)); }
.hp-architecture-inputs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; margin-top: 35px; }
.hp-architecture-inputs > span { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 18px 6px; border: 1px solid var(--m-line); background: white; border-radius: 10px; font-size: 10px; color: var(--m-text-2); }
.hp-architecture-inputs svg { color: var(--m-blue); }
.hp-architecture-join { height: 36px; margin: 0 17%; border: 1px solid #9DBAFF; border-top: 0; position: relative; }
.hp-architecture-join::after { content: ''; position: absolute; left: 50%; top: 0; height: 57px; border-left: 1px solid #9DBAFF; }
.hp-boundary { margin-top: 20px; border: 1px dashed #9DBAFF; border-radius: 11px; padding: 25px 20px 22px; position: relative; }
.hp-boundary-label { position: absolute; top: -7px; left: 15px; font-size: 9px; color: var(--m-text-3); background: var(--m-blue-tint); padding-inline: 8px; }
.hp-architecture-core { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 15px; background: white; border: 1px solid var(--m-line); border-radius: 9px; }
.hp-architecture-core img { width: 25px; }
.hp-architecture-core strong { font-size: 19px; letter-spacing: -.6px; }
.hp-architecture-core > span { font-size: 9px; color: var(--m-text-3); margin-left: auto; }
.hp-architecture-results { display: flex; justify-content: space-around; margin-top: 20px; font-size: 10px; color: var(--m-text-3); }
.hp-uses { background: #fafbfe; border-block: 1px solid var(--m-blue-tint); }
.hp-use-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 35px 0; }
.hp-use-buttons button { font: inherit; font-size: 12px; padding: 12px 20px; color: var(--m-text-3); border: 1px solid transparent; border-radius: 30px; background: transparent; cursor: pointer; }
.hp-use-buttons button[aria-pressed="true"] { color: var(--m-navy); border-color: var(--m-line); background: white; box-shadow: 0 3px 10px #21457206; }
.hp-use-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 85px; padding: 44px 55px; border: 1px solid var(--m-line); border-radius: 20px; background: white; align-items: center; }
.hp-use-copy h3 { font-size: 31px; line-height: 1.25; margin-top: 13px; max-width: 20ch; }
.hp-use-copy > p { color: var(--m-text-3); font-size: 14px; line-height: 1.8; margin-top: 17px; min-height: 75px; }
.hp-use-record { padding: 26px; border: 1px solid var(--m-line); border-radius: 12px; background: #f8faff; }
.hp-record-title { display: flex; align-items: center; gap: 10px; color: var(--m-blue); }
.hp-record-title strong { font-size: 14px; font-weight: 500; }
.hp-record-title svg { width: 18px; }
.hp-use-record dl { margin: 20px 0; }
.hp-use-record dl > div { padding: 11px 0; border-top: 1px solid var(--m-line); display: flex; justify-content: space-between; gap: 18px; font-size: 11px; }
.hp-use-record dt { color: var(--m-text-3); }
.hp-use-record dd { margin: 0; color: var(--m-text-2); text-align: right; }
.hp-use-record-foot { display: flex; align-items: center; gap: 8px; color: var(--m-text-3); font-size: 9px; }
.hp-use-record-foot svg { width: 13px; }
.hp-coverage-grid { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 25px; }
.hp-coverage-grid article { padding: 0 25px; border-left: 1px solid var(--m-line); }
.hp-coverage-grid article:first-child { padding-left: 0; border-left: 0; }
.hp-region { display: grid; place-items: center; width: 43px; height: 43px; border: 1px solid var(--m-line); border-radius: 50%; color: var(--m-text-3); font-size: 11px; margin-bottom: 19px; }
.hp-coverage-grid h3 { font-size: 17px; }
.hp-coverage-grid p { font-size: 12px; color: var(--m-text-3); line-height: 2.2; margin-top: 14px; }
.hp-coverage-note { margin-top: 43px; display: flex; align-items: center; gap: 12px; padding: 18px 22px; border-radius: 8px; background: var(--m-blue-tint); color: var(--m-text-3); }
.hp-coverage-note svg { width: 17px; }
.hp-coverage-note p { font-size: 11px; line-height: 1.7; }
.hp-contact-note { display: block; font-size: 12px; color: var(--m-text-3); margin-top: 13px; }
.hp-footer { padding-block: 40px 28px; background: white; }
.hp-footer-top { display: flex; align-items: center; gap: 35px; padding-bottom: 32px; }
.hp-footer-top p { color: var(--m-text-3); font-size: 12px; }
.hp-footer-top > a:last-child { margin-left: auto; font-size: 12px; color: var(--m-text-2); }
.hp-footer-bottom { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; justify-content: space-between; border-top: 1px solid var(--m-line); padding-top: 23px; color: var(--m-text-3); font-size: 10px; }
.hp-footer-bottom nav { display: flex; flex-wrap: wrap; gap: 25px; }
.hp-footer-bottom a { color: var(--m-text-3); }
.hp-main button:focus-visible, .hp-main a:focus-visible, .hp-footer a:focus-visible { outline: 2px solid var(--m-navy); outline-offset: 5px; }
@media (hover: hover) { .hp-source-step:hover { color: var(--m-navy); } .hp-agent-button:hover { background: var(--m-blue-tint); } .hp-use-buttons button:hover { color: var(--m-navy); background: var(--m-blue-tint); } }
@media (max-width: 1150px) { .hp-wrap { padding-inline: 35px; }.hp-split { gap: 45px; }.hp-section { padding-block: 85px; }.hp-section-head { gap: 30px; }.hp-gap-grid { gap: 25px; }.hp-gap-item + .hp-gap-item { padding-left: 25px; }.hp-source-scene, .hp-decision-scene { padding: 24px; }.hp-workspace-body { grid-template-columns: 240px 1fr; }.hp-assessment { padding: 23px; }.hp-use-panel { gap: 40px; padding: 35px; } }
@media (max-width: 900px) { .hp-section-head { display: block; }.hp-section-head > p, .hp-section-head > div + div { max-width: 52ch; margin-top: 22px; }.hp-split { grid-template-columns: 1fr; gap: 38px; }.hp-editorial { max-width: 650px; }.hp-editorial > p { max-width: 55ch; }.hp-source-scene, .hp-decision-scene, .hp-architecture { width: 100%; max-width: 600px; margin: auto; }.hp-human .hp-editorial { grid-row: 1; }.hp-gap-grid { gap: 20px; }.hp-gap-item + .hp-gap-item { padding-left: 20px; }.hp-gap-item h3 { font-size: 18px; }.hp-mini-rules > div:first-child > span { display: none; }.hp-mini-estate b { padding: 7px; }.hp-workspace-body { grid-template-columns: 1fr; }.hp-agent-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; border-right: 0; border-bottom: 1px solid var(--m-line); padding: 14px; }.hp-agent-list > .hp-overline, .hp-inventory-foot { display: none; }.hp-agent-button { padding: 10px 6px; margin: 0; gap: 7px; }.hp-agent-monogram { display: none; }.hp-assessment { padding: 28px; }}
@media (max-width: 600px) { .hp-wrap { padding-inline: 22px; }.hp-section { padding-block: 64px; }.hp-eyebrow { font-size: 9px; margin-bottom: 17px; }.hp-main h2 { font-size: 34px; }.hp-section-head { margin-bottom: 32px; }.hp-section-head p, .hp-editorial > p { font-size: 14px; }.hp-gap-grid { grid-template-columns: 1fr; gap: 28px; }.hp-gap-item, .hp-gap-item + .hp-gap-item { padding: 0 0 26px; border-left: 0; border-bottom: 1px solid var(--m-line); }.hp-gap-item h3 { max-width: none; font-size: 21px; }.hp-gap-item > p { max-width: 40ch; }.hp-mini-estate, .hp-mini-rules, .hp-mini-evidence { width: 100%; max-width: 330px; height: 140px; margin: 0 auto 20px; }.hp-mini-evidence { padding-left: 40px; }.hp-principle { margin-top: 25px; border-top: 0; padding-top: 0; font-size: 11px; }.hp-source-scene, .hp-decision-scene { padding: 18px; border-radius: 16px; }.hp-scene-label { font-size: 9px; }.hp-scene-label > span:last-child { font-size: 8px; }.hp-source-panel { padding: 18px; }.hp-document-top { gap: 8px; }.hp-document-top h3 { font-size: 12px; }.hp-version { display: none; }.hp-excerpt { padding: 12px; }.hp-excerpt p { font-size: 13px; min-height: 115px; }.hp-document-meta { gap: 5px; }.hp-document-meta strong { font-size: 9px; }.hp-chip { font-size: 8px; }.hp-caption { font-size: 10px; }.hp-workspace-top { padding: 17px; gap: 10px; }.hp-workspace-date { display: none; }.hp-workspace-top > span { margin-left: auto; font-size: 8px; }.hp-agent-list { grid-template-columns: 1fr; padding: 10px; }.hp-agent-button { padding: 10px; }.hp-agent-monogram { display: grid; }.hp-agent-button small { display: none; }.hp-assessment { padding: 20px 16px; }.hp-assessment-heading { display: block; }.hp-assessment h3 { font-size: 20px; }.hp-outcome { display: inline-block; margin-top: 12px; }.hp-assessment-grid { grid-template-columns: 1fr; margin-top: 20px; gap: 12px; }.hp-rule-card > p, .hp-evidence-card > p { min-height: 0; }.hp-next-action { flex-wrap: wrap; gap: 5px; }.hp-next-action > span { width: 100%; }.hp-next-action p { flex: 1; line-height: 1.7; }.hp-workspace-foot { padding: 13px; font-size: 8px; }.hp-workspace-foot > span:last-child { display: none; }.hp-agent-outcomes { display: grid; grid-template-columns: 1fr 1fr; gap: 25px; }.hp-agent-outcomes > span { display: none; }.hp-agent-outcomes p { font-size: 10px; }.hp-decision { padding: 21px; }.hp-decision h3 { font-size: 22px; }.hp-platform-flow { grid-template-columns: 1fr; gap: 0; margin-top: 35px; }.hp-platform-flow li { text-align: left; display: grid; grid-template-columns: 64px 1fr; column-gap: 20px; padding-bottom: 27px; }.hp-flow-icon { grid-row: 1 / 4; width: 55px; height: 55px; margin: 0; border-radius: 14px; }.hp-platform-flow small { grid-column: 2; }.hp-platform-flow h3 { grid-column: 2; margin: 2px 0; }.hp-platform-flow p { grid-column: 2; margin-top: 2px; }.hp-platform-flow li:not(:last-child)::after { left: 27px; right: auto; top: 56px; height: 27px; border-top: 0; border-left: 1px solid var(--m-line); }.hp-centred > p { font-size: 14px; line-height: 1.8; }.hp-architecture { padding: 20px 16px; }.hp-architecture-inputs { gap: 7px; }.hp-architecture-inputs > span { font-size: 8px; }.hp-boundary { padding: 22px 12px; }.hp-architecture-core { flex-wrap: wrap; gap: 6px; padding: 13px; }.hp-architecture-core > span { margin-left: 0; width: 100%; text-align: center; }.hp-use-buttons { gap: 5px; margin-block: 25px; }.hp-use-buttons button { padding: 10px 13px; font-size: 11px; }.hp-use-panel { grid-template-columns: 1fr; gap: 28px; padding: 24px 20px; }.hp-use-copy h3 { font-size: 27px; }.hp-use-copy > p { font-size: 13px; min-height: 0; }.hp-use-record { padding: 18px; }.hp-use-record dl > div { font-size: 10px; }.hp-coverage-grid { grid-template-columns: 1fr 1fr; gap: 30px 20px; }.hp-coverage-grid article { padding: 0; border: 0; }.hp-coverage-grid h3 { font-size: 15px; }.hp-coverage-grid p { font-size: 11px; }.hp-region { margin-bottom: 13px; }.hp-coverage-note { padding: 15px; align-items: flex-start; gap: 8px; }.hp-coverage-note p { font-size: 10px; }.hp-footer-top { flex-wrap: wrap; gap: 17px; }.hp-footer-top p { order: 3; width: 100%; font-size: 11px; }.hp-footer-bottom { font-size: 9px; gap: 18px; }.hp-footer-bottom nav { order: 3; gap: 15px; width: 100%; } }
/* Keep product detail readable at ordinary laptop and phone sizes. */
.hp-overline, .hp-caption, .hp-source-step small, .hp-review-note p,
.hp-document-meta > div > span, .hp-document-meta strong,
.hp-agent-button small, .hp-inventory-foot, .hp-rule-footer, .hp-evidence-ref,
.hp-workspace-foot, .hp-use-record-foot, .hp-coverage-note p,
.hp-decision-person div > span, .hp-decision-bottom > span:last-child,
.hp-scene-label, .hp-scene-label > span:last-child { font-size: 11px; }
.hp-rule-card > p, .hp-evidence-card > p, .hp-next-action p,
.hp-agent-button strong, .hp-assessment-heading p, .hp-use-record dl > div { font-size: 12px; }
.hp-overline, .hp-caption, .hp-source-step small, .hp-review-note p,
.hp-document-meta > div > span, .hp-agent-button small, .hp-inventory-foot,
.hp-evidence-ref, .hp-workspace-foot, .hp-use-record-foot, .hp-coverage-note,
.hp-human-note, .hp-scene-label, .hp-scene-label > span:last-child { color: var(--m-text-2); }
.hp-workspace .hp-chip, .hp-outcome, .hp-document-meta .hp-chip { font-size: 10px; }
@media (max-width: 600px) {
  .hp-scene-label { flex-wrap: wrap; }
  .hp-scene-label > span:last-child { font-size: 10px; }
  .hp-workspace-foot { font-size: 10px; }
  .hp-document-meta { flex-wrap: wrap; }
}

/* Navy and white theme pass: white light, navy ink, electric blue accent, navy gradient contrast sections. */
.hp-main { color: var(--m-text); }
.hp-main h2 { font-weight: 600; letter-spacing: -.04em; }
.hp-main h2 span { color: var(--m-blue); }
.hp-eyebrow { color: var(--m-blue); letter-spacing: .1em; }
.hp-section-head p, .hp-editorial > p, .hp-centred > p { color: var(--m-text-2); font-size: 17px; }
.hp-text-link { color: var(--m-blue); }
.hp-text-link:hover { color: var(--m-blue-strong); }
.hp-overline, .hp-caption { color: var(--m-text-3); }
.hp-intelligence, .hp-human, .hp-coverage { background: #fff; }
.hp-platform, .hp-uses { background: linear-gradient(180deg, #fff 0%, var(--m-blue-tint) 50%, #fff 100%); border: 0; }
.hp-source-scene { background: radial-gradient(ellipse at 100% 0, #DCE8FF, transparent 60%), radial-gradient(ellipse at 0 100%, #E2F5FF, transparent 55%), var(--m-blue-tint); border: 1px solid var(--m-line); border-radius: 28px; }
.hp-source-panel { border-color: var(--m-line); box-shadow: var(--m-shadow-card); border-radius: 18px; }
.hp-excerpt { border-left-color: var(--m-blue); background: var(--m-blue-tint); }
.hp-excerpt > span { color: var(--m-blue); }
.hp-doc-icon { background: var(--m-blue-soft); color: var(--m-blue); }
.hp-review-note { background: rgba(255,255,255,.88); border-color: #fff; box-shadow: var(--m-shadow-soft); }
.hp-review-link { color: var(--m-blue); }
.hp-avatar { background: #EFEBFF; color: var(--m-violet); }
.hp-source-step { color: var(--m-text-2); }
.hp-source-step[aria-pressed="true"] { color: var(--m-navy); border-top-color: var(--m-blue); }
.hp-source-step[aria-pressed="true"] > svg { color: var(--m-blue); }
.hp-source-step > span { color: var(--m-text-3); }
.hp-agents { position: relative; overflow: hidden; background: radial-gradient(ellipse at 85% 0%, rgba(61,200,255,.16), transparent 45%), radial-gradient(ellipse at 0% 100%, rgba(138,107,255,.18), transparent 50%), var(--m-grad-navy); color: #fff; }
.hp-agents .hp-eyebrow { color: #8FB4FF; }
.hp-agents h2 { color: #fff; }
.hp-agents h2 span { color: #8FB4FF; }
.hp-agents .hp-section-head p { color: #C3D2F0; }
.hp-disclosure { color: #8FA6D6; }
.hp-workspace { border-color: rgba(255,255,255,.4); box-shadow: 0 40px 100px -30px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.08); border-radius: 20px; }
.hp-agent-outcomes p { color: #B7C7EA; }
.hp-agent-outcomes strong { color: #fff; }
.hp-agent-outcomes > span { color: #6F8FD9; }
.hp-agent-list { background: var(--m-blue-tint); }
.hp-agent-button[aria-pressed="true"] { color: var(--m-blue); border-color: rgba(34,96,255,.25); box-shadow: var(--m-shadow-soft); }
.hp-agent-monogram { background: var(--m-blue-soft); color: var(--m-blue); }
.hp-workspace-top svg { color: var(--m-blue); }
.hp-next-action { background: var(--m-blue-tint); }
.hp-next-action svg { color: var(--m-blue); }
.hp-outcome--amber { background: var(--m-amber-soft); color: var(--m-amber); }
.hp-outcome--green { background: var(--m-green-soft); color: var(--m-green); }
.hp-outcome--grey { background: var(--m-blue-soft); color: var(--m-text-2); }
.hp-amber { background: #F2A414; } .hp-green { background: var(--m-green); } .hp-grey { background: var(--m-line-strong); }
.hp-rule-footer { color: var(--m-green); }
.hp-evidence-ref { color: var(--m-blue); }
.hp-decision-scene { background: radial-gradient(ellipse at 0 0, #E2F5FF, transparent 55%), radial-gradient(ellipse at 100% 100%, #E4F6EC, transparent 55%), var(--m-blue-tint); border: 1px solid var(--m-line); border-radius: 28px; }
.hp-decision { border-color: var(--m-line); box-shadow: var(--m-shadow-card); border-radius: 18px; }
.hp-decision h3 { color: var(--m-navy); }
.hp-decision-person .hp-avatar { background: var(--m-green-soft); color: var(--m-green); }
.hp-chip { background: var(--m-green-soft); color: var(--m-green); }
.hp-decision-bottom > span:last-child { color: var(--m-green); }
.hp-history i { background: var(--m-green); box-shadow: 0 0 0 4px var(--m-green-soft); }
.hp-history > div:not(:last-child)::before { border-left-color: var(--m-line-strong); }
.hp-history p { color: var(--m-navy); }
.hp-history > div > span { color: var(--m-text-3); }
.hp-check-list svg { color: var(--m-green); }
.hp-check-list li { color: var(--m-text-2); }
.hp-flow-icon { border-color: var(--m-line); color: var(--m-blue); background: #fff; box-shadow: var(--m-shadow-soft); border-radius: 20px; }
.hp-platform-flow li:not(:last-child)::after { border-top-color: var(--m-line-strong); }
.hp-platform-flow small { color: var(--m-blue); font-weight: 600; }
.hp-platform-flow p { color: var(--m-text-2); }
.hp-deploy-points strong { color: var(--m-navy); }
.hp-architecture { border-color: var(--m-line); background: radial-gradient(ellipse at 100% 0, #DCE8FF, transparent 55%), linear-gradient(160deg, #fff, var(--m-blue-tint)); border-radius: 28px; }
.hp-architecture-inputs > span { color: var(--m-text-2); }
.hp-architecture-inputs svg { color: var(--m-blue); }
.hp-boundary { border-color: rgba(34,96,255,.35); }
.hp-boundary-label { color: var(--m-blue); background: var(--m-blue-tint); }
.hp-architecture-core { border-color: var(--m-line); box-shadow: var(--m-shadow-soft); }
.hp-architecture-core img { border-radius: 7px; }
.hp-architecture-results { color: var(--m-text-2); }
.hp-use-buttons button { color: var(--m-text-2); }
.hp-use-buttons button[aria-pressed="true"] { color: var(--m-blue); border-color: rgba(34,96,255,.25); background: #fff; box-shadow: var(--m-shadow-soft); }
.hp-use-panel { border-color: var(--m-line); box-shadow: var(--m-shadow-card); border-radius: 28px; }
.hp-use-record { border-color: var(--m-line); background: var(--m-blue-tint); }
.hp-record-title { color: var(--m-blue); }
.hp-use-record dd { color: var(--m-navy); }
.hp-region { border-color: var(--m-line); color: var(--m-blue); background: var(--m-blue-tint); font-weight: 600; }
.hp-coverage-grid p { color: var(--m-text-2); }
.hp-coverage-note { background: var(--m-blue-tint); color: var(--m-text-2); }
.hp-contact-note { color: #9DBAFF; }
.hp-footer { background: #fff; border-top: 1px solid var(--m-line); }
.hp-footer-top p, .hp-footer-bottom { color: var(--m-text-3); }
.hp-footer-top > a:last-child, .hp-footer-bottom a { color: var(--m-text-2); }
.hp-footer-bottom a:hover, .hp-footer-top > a:last-child:hover { color: var(--m-blue); }
.hp-main button:focus-visible, .hp-main a:focus-visible, .hp-footer a:focus-visible { outline-color: var(--m-blue); }
@media (hover: hover) { .hp-source-step:hover { color: var(--m-blue); } .hp-agent-button:hover { background: var(--m-blue-soft); } .hp-use-buttons button:hover { color: var(--m-blue); background: var(--m-blue-soft); } }

/* Workflow: a wave through the five steps, a signal travelling it, and the active step's context. */
.hp-platform { position: relative; overflow: hidden; }
.hp-main .hp-flow-waves { position: absolute; left: 0; right: 0; bottom: -20px; width: 100%; height: 260px; fill: none; stroke: url(#flow-wave); stroke-width: 1.8; opacity: .9; pointer-events: none; }
.hp-flow-waves path:first-child { stroke-width: 18; opacity: .22; filter: blur(9px); }
.hp-flow { position: relative; margin-top: 70px; }
.hp-main .hp-flow-path { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; fill: none; stroke: none; pointer-events: none; }
.hp-flow-line { stroke: url(#flow-line); stroke-width: 3; stroke-linecap: round; opacity: .55; }
.hp-flow-marks circle { fill: #fff; stroke: var(--m-line-strong); stroke-width: 1; }
.hp-flow-marks path { fill: none; stroke: var(--m-blue); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.hp-flow-token { opacity: 0; offset-rotate: 0deg; offset-distance: 0%; }
.hp-flow-token__halo { fill: rgba(61,200,255,.38); }
.hp-flow-token__core { fill: #fff; stroke: var(--m-blue); stroke-width: 2.5; }
.hp-flow.is-running .hp-flow-token { animation: flow-travel 7.5s linear infinite; }
@keyframes flow-travel { 0% { offset-distance: 0%; opacity: 0; } 3% { opacity: 1; } 97% { opacity: 1; } 100% { offset-distance: 100%; opacity: 0; } }
.hp-platform-flow { position: relative; margin: 0; padding: 74px 0 0; gap: 20px; }
.hp-platform-flow li:nth-child(even) { padding-top: 46px; }
.hp-flow-icon { width: 78px; height: 78px; border-radius: 24px; margin-bottom: 20px; transition: transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s, border-color .5s; }
.hp-flow-icon svg { width: 26px; height: 26px; }
.hp-platform-flow li.is-active .hp-flow-icon { transform: scale(1.08); border-color: rgba(34,96,255,.5); box-shadow: 0 0 0 8px rgba(34,96,255,.10), 0 22px 44px -14px rgba(34,96,255,.55); }
.hp-platform-flow li.is-active small, .hp-platform-flow li.is-active h3 { color: var(--m-blue); }
.hp-flow-chip { position: absolute; left: 50%; bottom: calc(100% + 14px); transform: translate(-50%, 8px); display: inline-flex; align-items: center; gap: 9px; padding: 9px 13px; background: #fff; border: 1px solid var(--m-line); border-radius: 12px; box-shadow: var(--m-shadow-soft); opacity: 0; transition: opacity .45s, transform .45s; white-space: nowrap; text-align: left; }
.hp-flow-chip::after { content: ''; position: absolute; left: 50%; top: 100%; height: 12px; border-left: 1px dashed var(--m-line-strong); }
.hp-platform-flow li.is-active .hp-flow-chip { opacity: 1; transform: translate(-50%, 0); }
.hp-flow-chip i { width: 7px; height: 7px; border-radius: 50%; background: var(--m-cyan); box-shadow: 0 0 0 3px rgba(61,200,255,.2); flex: none; }
.hp-flow-chip b { display: block; font-size: 12px; font-weight: 600; color: var(--m-navy); line-height: 1.2; }
.hp-flow-chip small { display: block; font-size: 11px; color: var(--m-text-3); margin-top: 2px; line-height: 1.2; }
.hp-flow-rail { display: flex; align-items: center; gap: 18px; margin-top: 64px; color: var(--m-text-3); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
.hp-flow-rail i { flex: 1; height: 1px; background: linear-gradient(90deg, var(--m-line-strong), transparent); }
.hp-flow-rail i:last-of-type { background: linear-gradient(90deg, transparent, var(--m-line-strong)); }
.hp-flow-rail b { display: inline-flex; align-items: center; gap: 10px; padding: 12px 22px; border-radius: 999px; background: rgba(255,255,255,.85); border: 1px solid var(--m-line); box-shadow: var(--m-shadow-soft); color: var(--m-navy); font-size: 13px; font-weight: 500; letter-spacing: 0; text-transform: none; white-space: nowrap; }
.hp-flow-rail b svg { width: 16px; height: 16px; color: var(--m-blue); }
@media (min-width: 601px) { .hp-platform-flow li:not(:last-child)::after { display: none; } }
@media (max-width: 900px) { .hp-flow-chip { display: none; } }
@media (max-width: 600px) { .hp-flow { margin-top: 30px; } .hp-main .hp-flow-waves { display: none; } .hp-platform-flow { padding-top: 0; } .hp-platform-flow li:nth-child(even) { padding-top: 0; } .hp-flow-icon { width: 55px; height: 55px; border-radius: 14px; margin: 0; } .hp-flow-icon svg { width: 22px; height: 22px; } .hp-platform-flow li:not(:last-child)::after { display: none; } .hp-platform-flow li.is-active .hp-flow-icon { transform: scale(1.05); } .hp-flow-rail { flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 20px; } .hp-flow-rail i { display: none; } .hp-flow-rail b { white-space: normal; text-align: center; } }
@media (prefers-reduced-motion: reduce) { .hp-flow-token { display: none; } .hp-flow-chip { opacity: 1; transform: translate(-50%, 0); transition: none; } .hp-flow-icon { transition: none; } }

/* Phone pass: shorter section intros and a compact page rhythm. Desktop keeps the full copy. */
.hp-lede-mobile { display: none; }
@media (max-width: 600px) {
  .hp-lede-long { display: none; }
  .hp-lede-mobile { display: block; }
  .hp-section-head p.hp-lede-mobile, .hp-editorial > p.hp-lede-mobile, .hp-centred > p.hp-lede-mobile { font-size: 14px; line-height: 1.6; margin-top: 14px; max-width: none; }
  .hp-section { padding-block: 50px; }
  .hp-eyebrow { margin-bottom: 14px; }
  .hp-section-head { margin-bottom: 26px; }
  .hp-section-head > p, .hp-section-head > div + div { margin-top: 14px; }
  /* The three intelligence steps become one compact row of pills. */
  .hp-selector { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 20px; }
  .hp-source-step { flex-direction: column; align-items: flex-start; gap: 7px; padding: 11px 10px; border: 1px solid var(--m-line); border-radius: 13px; background: #fff; }
  .hp-source-step small, .hp-source-step > svg { display: none; }
  .hp-source-step strong { font-size: 11px; font-weight: 600; line-height: 1.35; }
  .hp-source-step > span { font-size: 9.5px; color: var(--m-blue); font-weight: 600; }
  .hp-source-step[aria-pressed="true"] { border-color: rgba(34,96,255,.55); background: var(--m-blue-tint); box-shadow: 0 6px 16px -8px rgba(34,96,255,.35); }
  .hp-agent-outcomes { gap: 18px; margin-top: 26px; }
  .hp-coverage-note { margin-top: 26px; }
  .hp-flow-rail { margin-top: 14px; }
}
