/* The owner's editable Figma frame (9:833) is the scene's 1024px coordinate system. */
.ledger-scroll { position: relative; max-width: 1600px; margin-inline: auto; container-type: inline-size; z-index: 1; overflow-x: clip; }
.ledger-opening { position: relative; isolation: isolate; height: calc(63.569134cqw - var(--header-height)); min-height: 460px; overflow: visible; }
.ledger-opening .hero-copy { position: relative; z-index: 3; padding-top: 1.379023cqw; pointer-events: none; }
.hero-copy a { pointer-events: auto; }
.hero-actions { display: flex; align-items: center; gap: 12px; }
.hero-kicker { margin-bottom: 10px; color: #25476a; font-size: 12px; line-height: 1.4; letter-spacing: .21em; }
.ledger-opening h1 { max-width: 68%; font-size: clamp(64px, 7.245116cqw, 116px); line-height: .9; white-space: pre; text-wrap: nowrap; }
.hero-description { max-width: min(39.453125cqw, 525px); font-size: clamp(18px, 1.757813cqw, 22px); line-height: 1.27; margin: 9px 0 8px; color: var(--ink); }
.hero-copy .button { gap: 16px; min-width: clamp(188px, 22.949219cqw, 420px); padding: 12px 18px; font-size: 17px; font-weight: 400; }
.button-arrow { flex-shrink: 0; }
/* Full independent drawings retain the approved fill slots and camera crop.
   Individual scale/rotate properties leave the existing entrance transform free. */
.hero-stage { position: absolute; inset: calc(-1 * var(--header-height)) 0 auto; height: 63.569134cqw; overflow: hidden; clip-path: inset(7.8125cqw 0 0); pointer-events: none; container-type: inline-size; }
.hero-stage img { position: absolute; max-width: none; object-fit: cover; }
.scene-garden { z-index: 0; left: 89.941406%; top: -5.957031cqw; width: 17.675781%; height: 34.472656cqw; opacity: .7; }
.scene-window { z-index: 1; left: 85.449219%; top: -8.203125cqw; width: 25.390625%; height: 37.988281cqw; opacity: .7; }
.scene-wall-paper { position: absolute; z-index: 2; left: 71.484375%; top: 7.226563cqw; width: 12.890625%; height: 10.253906cqw; }
.scene-wall-sheet { inset: 0; width: 100%; height: 100%; }
.scene-wall-note { z-index: 1; left: 9.178686cqw; top: 7.481891cqw; width: 5.099487cqw; height: 5.099487cqw; }
.scene-desk { z-index: 3; left: -10.019445%; top: 20.579529cqw; width: 140.039063%; height: 46.679688cqw; scale: -1 1; }
.scene-window-plant { z-index: 4; left: 91.210938%; top: 7.226563cqw; width: 13.867188%; height: 18.457031cqw; }
.scene-monitor { z-index: 5; left: 43.359375%; top: 17.480469cqw; width: 37.988281%; height: 25.292969cqw; }
.scene-pencil-cup { z-index: 6; left: 39.160156%; top: 31.738281cqw; width: 7.226563%; height: 10.839844cqw; }
.scene-operator { z-index: 7; left: 44.999194%; top: 14.838666cqw; width: 51.999921%; height: 77.999878cqw; }
.scene-front-desk { z-index: 8; left: -19.999170%; top: 35.823572cqw; width: 150%; height: 50cqw; scale: -1 1; }
.scene-folders { z-index: 9; left: -.292969%; top: 49.707031cqw; width: 32.910156%; height: 12.402344cqw; }
.scene-notebook { z-index: 10; left: 33.984375%; top: 52.343750cqw; width: 27.539063%; height: 11.816406cqw; }
.scene-mug { z-index: 11; left: 45.019531%; top: 38.281250cqw; width: 8.499146%; height: 9.583537cqw; scale: -1 1; }
.scene-task-books { z-index: 12; left: 75%; top: 46.582031cqw; width: 25.585938%; height: 16.992188cqw; }
.scene-phone { z-index: 13; left: 60.937500%; top: 54.687500cqw; width: 10.499065%; height: 3.629557cqw; }
.scene-pen { z-index: 14; left: 55.580938%; top: 54.296875cqw; width: 6.542969%; height: 2.148438cqw; rotate: 43.52deg; transform-origin: 0 0; }
/* Fade the two surfaces between scene y580 and y651. Foreground objects remain
   crisp, while the subject stays occluded below the nearer tabletop. */
.scene-desk { -webkit-mask-image: linear-gradient(#000 36.061096cqw, transparent 42.989605cqw); mask-image: linear-gradient(#000 36.061096cqw, transparent 42.989605cqw); }
.scene-front-desk { -webkit-mask-image: linear-gradient(#000 20.817053cqw, transparent 27.745563cqw); mask-image: linear-gradient(#000 20.817053cqw, transparent 27.745563cqw); }
.scene-operator { clip-path: inset(0 0 50%); }
.problem { position: relative; isolation: isolate; container-type: inline-size; display: grid; grid-template-columns: 24% minmax(0, 1fr) 20%; grid-template-rows: auto 1fr; column-gap: clamp(16px, 2vw, 40px); padding-top: clamp(24px, 2.2vw, 40px); padding-bottom: 14px; min-height: 260px; }
.story-paper { position: absolute; z-index: -1; pointer-events: none; width: 110%; max-width: none; left: -5%; bottom: -8%; opacity: .32; }
.problem-grid { display: contents; }
.problem-grid > div { position: relative; z-index: 2; grid-column: 2 / 4; grid-row: 2; padding-right: 14cqw; }
.problem h2 { position: relative; z-index: 2; grid-column: 2 / 4; grid-row: 1; font-size: clamp(36px, 3.8vw, 55px); margin-bottom: 12px; line-height: 1.04; text-wrap: balance; }
.problem h2 br { display: none; }
.problem-grid p { font-size: clamp(18px, 1.85vw, 23px); line-height: 1.34; max-width: 54ch; margin-top: 10px; color: var(--ink); }
.problem-grid p:last-child { margin-top: 12px; font-size: clamp(18px, 1.75vw, 21px); }

.story-art { position: relative; grid-column: 1; grid-row: 1 / span 2; align-self: end; width: min(100%, 480px); aspect-ratio: .8; margin-top: -32px; container-type: inline-size; pointer-events: none; }
.story-art img, .story-daylight img, .workday-art img { position: absolute; max-width: none; }
.story-client-board { width: 82%; height: auto; top: 6%; left: 18%; z-index: 1; }
.story-plant { width: 65%; height: auto; top: 0; left: 0; opacity: .8; }
.story-books { width: 85%; height: auto; left: 0; bottom: 0; z-index: 2; }
.story-daylight { position: relative; z-index: 0; grid-column: 3; grid-row: 1 / span 2; align-self: end; justify-self: end; width: min(100%, 16cqw, 300px); aspect-ratio: 2 / 3; container-type: inline-size; pointer-events: none; }
.story-garden, .story-window { width: 100%; height: auto; inset: 0; }
.story-garden { opacity: .45; clip-path: polygon(27% 17%, 75% 11%, 75% 85%, 28% 80%); }
.story-paper-mount { position: absolute; left: 48%; top: 23%; width: 20%; aspect-ratio: 1402 / 1122; transform: skewY(-13deg); transform-origin: 0 0; }
.story-daylight.paper-perspective .story-paper-mount { left: 0; top: 0; width: 100%; }
.story-wireframe { width: 100%; height: auto; inset: 0; }
.story-note { width: 30%; height: auto; left: 54%; top: 55%; }
.workflow-section { padding-top: 6px; padding-bottom: clamp(32px, 3vw, 72px); background: var(--bg); }
#review-demo { position: relative; display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); column-gap: clamp(24px, 3vw, 72px); }
.workflow-intro { grid-column: 1 / -1; grid-row: 1; }
.workflow-section .section-heading { grid-column: 1 / -1; grid-row: 2; }
.workflow-section .section-heading { position: relative; z-index: 1; margin-bottom: 8px; }
.workflow-section h2 { font-size: clamp(36px, 4.1vw, 58px); line-height: 1.07; }
.workflow-section h2 br { display: none; }
.section-heading > p { max-width: 75ch; margin-top: 10px; font-size: 18px; line-height: 1.35; color: var(--ink); }
.workflow-section .section-heading > p { max-width: 76%; }
.workflow-intro { text-transform: uppercase; position: relative; z-index: 1; font-size: 12px; line-height: 1.4; color: #25476a; letter-spacing: .2em; margin-bottom: 6px; }
.workday-art { position: relative; grid-column: 2; grid-row: 3 / span 2; align-self: end; justify-self: end; pointer-events: none; width: min(100%, 380px); aspect-ratio: 1.9; margin-bottom: 56px; opacity: .82; }
.workday-desk { width: 100%; left: 0; bottom: -5%; opacity: .6; filter: saturate(.45); }
.workday-foliage { width: 40%; left: 4%; bottom: 8%; opacity: .6; }
.workday-books { width: 34%; left: 3%; bottom: 5%; }
.workday-laptop { width: 44%; right: 2%; bottom: 6%; }
.workday-mug { width: 14%; left: 39%; bottom: 5%; }
.workflow-tabs.bt-tabs { position: relative; z-index: 1; grid-column: 1; grid-row: 3; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; padding: 0; border: 0; border-bottom: 1px solid #cad7df; margin-bottom: 10px; gap: 0; background: none; }
.workflow-tabs button { position: relative; min-height: 46px; border: 0; border-bottom: 3px solid transparent; border-radius: 0; color: var(--muted); background: none; font-size: 17px; padding: 8px; transition: background-color 160ms, color 160ms, border-color 200ms; }
.workflow-tabs button:hover { background: #e5eef3; }
.workflow-tabs button[aria-selected="true"] { color: #315e89; font-weight: 600; border-bottom-color: #5487b6; }
.journey-caption { position: relative; z-index: 1; grid-column: 1; grid-row: 4; max-width: none; display: block; margin-bottom: 8px; }
.journey-caption h3 { color: #0c111a; font: 700 clamp(28px, 3.25vw, 42px)/1.08 var(--serif); margin-bottom: 6px; }
.journey-caption p { max-width: 65ch; font-size: 17px; line-height: 1.35; color: var(--ink); }
.journey { position: relative; z-index: 1; grid-column: 1 / -1; grid-row: 5; padding: 10px 18px; margin-inline: -10px; border-radius: 14px; background: #fff; box-shadow: 0 5px 22px #34526409; min-width: 0; }

.time-axis { position: relative; height: 26px; color: #48627c; font: 12px var(--sans); font-variant-numeric: tabular-nums; }
.time-axis > span { position: absolute; top: 0; }
.time-axis > span:nth-child(2) { left: 42%; transform: translateX(-50%); }
.time-axis > span:nth-child(3) { left: 61.333%; transform: translateX(-50%); }
.time-axis > span:nth-child(4) { left: 80.667%; transform: translateX(-50%); }
.time-axis > span:last-child { right: 0; transform: translateX(50%); }
.lane { display: flex; align-items: stretch; min-height: 66px; border-top: 1px solid #e2eaee; }
.lane-name { display: flex; align-items: center; gap: 12px; flex-shrink: 0; width: 23%; font-size: 16px; font-weight: 600; padding-right: 16px; }
.lane-name small { display: block; color: #596b78; font: 12px/1.4 var(--sans); margin-top: 2px; }
.client-thumbnail { width: 86px; height: 52px; object-fit: cover; border-radius: 3px; flex-shrink: 0; }
.lane-track { order: 2; position: relative; flex: 1; min-width: 0; background: repeating-linear-gradient(90deg, transparent 0, transparent calc(33.333% - 1px), #e2eaee 33.333%); }
.work-block { position: absolute; display: flex; align-items: center; justify-content: center; border-radius: 4px; height: 22px; white-space: nowrap; font-size: 12px; transform-origin: left top; font-variant-numeric: tabular-nums; }
.work-block.human { top: 8px; z-index: 2; color: #fff; background: var(--human); }
.work-block.agent { top: 37px; z-index: 1; color: #332717; background: #c99d69; }
.north-human { left: 0; width: 25%; }
.north-agent { left: 11.111%; width: 55.556%; }
.field-human { left: 25%; width: 25%; }
.field-agent { left: 22.222%; width: 61.111%; }
.own-human { left: 50%; width: 25%; }
.own-agent { left: 58.333%; width: 41.667%; }
.signal { display: none; }
.lane-labels { order: 1; display: flex; flex-direction: column; justify-content: center; gap: 10px; width: 19%; flex-shrink: 0; padding-left: 6px; font-size: 12px; line-height: 1.2; }
.lane-labels > span::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: var(--human); }
.lane-labels > span:last-child::before { background: #c69b6b; }
.timeline-legend { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 26px; margin-top: 14px; font-size: 13px; color: #435b71; }
.timeline-legend span { display: inline-flex; align-items: center; gap: 8px; }
.timeline-legend span:last-child { margin-left: auto; }
@media (min-width: 901px) {
  .timeline-legend { position: absolute; top: -45px; right: 0; margin-top: 0; }
  .timeline-legend span:last-child { display: none; }
}
.legend-human, .legend-agent { display: inline-block; width: 13px; height: 13px; border-radius: 50%; background: var(--human); }
.legend-agent { background: #c99d69; }
.timeline-context-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 20px; padding-bottom: 20px; }
.timeline-context-title { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: baseline; color: var(--muted); font-size: 13px; }
.timeline-context-title strong { color: var(--ink); font-size: 20px; }
.timeline-kicker { display: none; }
.timeline-recorded-totals { display: flex; gap: 28px; margin: 0; }
.timeline-recorded-totals dt { font-size: 12px; color: var(--muted); }
.timeline-recorded-totals dd { margin: 2px 0 0; color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }
[data-stage="1"] .work-block.agent { top: 25px; height: 40px; justify-content: flex-start; padding-left: 10px; color: #6b4a27; background: #f2e7d9; z-index: 1; border: 1px #92683b; border-style: dotted; }
[data-stage="1"] .work-block.human { top: 12px; z-index: 2; border: 1px #416f98; border-style: solid; box-shadow: 0 3px 6px #30506a1c; }
[data-stage="1"] .work-block.agent .bar-label { align-self: flex-end; font-size: 12px; padding-bottom: 3px; }
.timeline-overlap-note { margin-top: 14px; max-width: 70ch; font-size: 14px; }
.review-surface { display: grid; grid-template-columns: 1.3fr 1fr; gap: 60px; align-items: center; }
.review-surface h3 { font-family: var(--serif); font-size: 32px; margin: 14px 0; max-width: 25ch; }
.review-surface p, .record-surface p { font-size: 16px; max-width: 65ch; }
.evidence-context { margin: 22px 0 0; font-size: 14px; }
.evidence-context > div { display: grid; grid-template-columns: 1fr 1.2fr; gap: 16px; padding-block: 7px; }
.evidence-context dt { color: var(--muted); }
.evidence-context dd { margin: 0; }
.review-choice label { display: block; font-size: 15px; margin-bottom: 10px; font-weight: 600; }
.review-choice select { display: block; width: 100%; border: 1px solid #9eb3bf; border-radius: 6px; background: #f5f8fa; padding: 13px 12px; margin-bottom: 16px; font-size: 15px; min-height: 48px; }
.review-choice .button { width: 100%; gap: 12px; }
.record-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; margin-bottom: 20px; color: var(--muted); }
.record-state { font-size: 13px; color: #375c78; background: #e9f1f6; padding: 4px 10px; border-radius: 4px; }
.record-surface > h3 { font: 700 32px/1.25 var(--serif); margin-bottom: 14px; max-width: 30ch; }
.record-surface > .text-button { display: inline-flex; min-height: 44px; margin-top: 12px; text-decoration: underline; }
.statement-preview { width: min(100%, 680px); margin: 26px 0; padding: 26px; border: 1px solid #c8d8df; border-radius: 8px; background: #f7fafb; }
.statement-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; color: var(--muted); font-size: 13px; margin-bottom: 20px; }
.review-brand-logo { width: 132px; height: auto; }
.statement-preview h4 { font: 700 28px/1.25 var(--serif); }
.statement-preview .statement-summary { font-size: 14px; margin-top: 4px; }
.statement-lines { margin: 18px 0; }
.statement-lines > div { display: flex; justify-content: space-between; gap: 20px; padding-block: 10px; border-bottom: 1px solid #d6e1e6; font-size: 15px; }
.statement-lines dt { font-weight: 600; }
.statement-lines dd { margin: 0; display: flex; flex-wrap: wrap; gap: 4px 24px; justify-content: flex-end; font-variant-numeric: tabular-nums; text-align: right; }
.statement-preview .statement-note { font-size: 14px; }
.statement-action { margin: 18px 0 12px; }
.review-draft-dialog { width: min(520px, calc(100% - 32px)); max-height: calc(100dvh - 40px); margin: auto; padding: 0; border: 0; border-radius: 12px; color: var(--ink); background: #fff; box-shadow: 0 24px 100px #203b4d40; }
.review-draft-dialog::backdrop { background: #192d3cd1; }
.review-dialog-form { padding: 28px; }
.review-dialog-close { display: block; margin-left: auto; border: 0; background: none; color: var(--accent-hover); min-height: 44px; padding: 8px; font-size: 15px; }
.review-panel-kicker { display: block; font-size: 12px; color: var(--muted); }
.review-dialog-form h3 { font: 700 30px/1.2 var(--serif); margin: 12px 0 8px; }
.review-dialog-period { font-size: 14px; margin-bottom: 12px; }
.review-dialog-lines > div { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 15px; }
.review-dialog-lines strong { text-align: right; font-variant-numeric: tabular-nums; }
.review-dialog-boundary { font-size: 14px; margin-top: 18px; }
.benefits { display: grid; grid-template-columns: 1fr 1.15fr; grid-template-areas: "title rows" "art rows"; column-gap: clamp(40px, 6vw, 120px); row-gap: 24px; align-items: start; }
.benefits.section { padding-top: clamp(40px, 3.8vw, 88px); }
.benefits > h2 { grid-area: title; max-width: 12ch; }
.benefit-rows { grid-area: rows; min-width: 0; }
.benefit-rows article { padding-block: 0 28px; }
.benefit-rows article + article { padding-top: 28px; border-top: 1px solid var(--line); }
.benefit-rows h3 { font: 700 29px/1.2 var(--serif); margin-bottom: 12px; }
.benefit-rows h3 br { display: none; }
.benefit-rows p { max-width: 65ch; font-size: 16px; }
.lower-art { position: relative; isolation: isolate; pointer-events: none; }
.lower-art img { position: absolute; max-width: none; height: auto; }
.record-art { grid-area: art; width: min(100%, 960px); aspect-ratio: 2.4; }
.record-folders { width: 96%; left: 2%; top: 4%; }
.record-wash { z-index: -1; width: 100%; left: 0; bottom: -3%; opacity: .65; }
.trust { position: relative; isolation: isolate; background: linear-gradient(var(--bg), #e9f0ef 16%, #e9f0ef 84%, var(--bg)); padding-block: clamp(64px, 6vw, 128px); }
.trust::before { content: ""; position: absolute; z-index: -1; inset: 0; background: url("assets/illustrations/paper-wash.webp") center 42% / 110% auto no-repeat; opacity: .25; pointer-events: none; }
.trust-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 44px clamp(40px, 6vw, 120px); }
.trust-introduction { align-self: center; }
.trust-intro { font-size: 18px; margin-top: 20px; max-width: 38ch; }
.trust-art { width: min(100%, 750px); aspect-ratio: 1.8; justify-self: end; align-self: center; }
.trust-wash { z-index: -1; width: 110%; left: -5%; bottom: -2%; opacity: .55; }
.trust-computer { width: 68%; left: 8%; bottom: 12%; }
.trust-plant { width: 28%; left: 70%; bottom: 7%; }
.trust-books { width: 35%; left: 2%; bottom: 0; }
.trust-details { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 64px); }
.trust-details article + article { margin-top: 0; }
.trust-details h3 { font: 700 28px/1.25 var(--serif); margin-bottom: 12px; }
.trust-details p { font-size: 16px; max-width: 65ch; }
.privacy-accordions { margin-top: 40px; border-top: 1px solid #bacdca; }
.privacy-accordions details { border-bottom: 1px solid #bacdca; padding: 6px 0; }
.privacy-accordions summary { display: flex; justify-content: space-between; align-items: center; gap: 24px; font-size: 17px; font-weight: 600; min-height: 64px; list-style: none; }
.privacy-accordions summary::-webkit-details-marker { display: none; }
.privacy-accordions summary span { color: var(--accent-hover); font-size: 26px; transition: transform 200ms; }
.privacy-accordions details[open] summary span { transform: rotate(45deg); }
.privacy-accordions details p { max-width: 75ch; padding: 0 0 22px; font-size: 16px; }
.plans-intro { font-size: 14px; margin-bottom: 14px; }
.roadmap .section-heading { max-width: 850px; }
.roadmap { position: relative; isolation: isolate; padding-bottom: clamp(48px, 4vw, 96px); }
.payment-note { max-width: 70ch; font-size: 15px; }
.launch { position: relative; display: grid; grid-template-columns: 1.1fr .9fr; grid-template-rows: auto 1fr; align-items: start; column-gap: clamp(40px, 5vw, 100px); padding-block: clamp(56px, 6vw, 120px); }
.launch h2 { grid-column: 1; grid-row: 1; max-width: 13ch; }
.launch-bottom { grid-column: 1; grid-row: 2; margin-top: 24px; }
.launch-bottom p { font-size: 18px; max-width: 62ch; }
.launch-bottom .button { margin-top: 24px; }
.closing-art { grid-column: 2; grid-row: 1 / span 2; width: min(100%, 680px); aspect-ratio: 1.35; justify-self: end; align-self: end; }
.closing-wash { z-index: -1; width: 110%; left: -5%; bottom: 3%; opacity: .65; }
.closing-books { width: 54%; left: 2%; bottom: 8%; }
.closing-mug { width: 20%; left: 58%; bottom: 8%; }
.closing-foliage { z-index: -1; width: 24%; left: 75%; bottom: 18%; }
.noscript-note { max-width: 65ch; padding-top: 24px; }

/* A wide desk spans the canvas while the working figure stays bounded by
   screen height. Text measures remain readable as the surrounding layout grows. */
@media (min-width: 1601px) {
  :root {
    --scene-width: min(100vw, 210svh, 3840px);
    --lane-height: clamp(66px, 4.2vw, 120px);
  }
  .ledger-scroll { max-width: none; }
  .ledger-opening { height: calc(var(--scene-width) * .63569134 - var(--header-height)); }
  .ledger-opening .hero-copy { padding-top: clamp(24px, 2vw, 72px); }
  .ledger-opening h1 { max-width: none; font-size: clamp(116px, 7.245116vw, 280px); }
  .hero-kicker, .workflow-intro { font-size: clamp(12px, .65vw, 20px); }
  .hero-kicker { font-size: clamp(13px, .95vw, 32px); }
  .hero-description { max-width: 42ch; font-size: clamp(22px, 1.5vw, 52px); line-height: 1.4; margin-block: 22px; }
  .hero-copy .button { font-size: clamp(17px, .8vw, 22px); min-height: clamp(48px, 2.7vw, 64px); padding: 14px 26px; }
  .hero-copy .button { font-size: clamp(18px, 1vw, 30px); min-height: clamp(52px, 2.7vw, 76px); }
  .hero-stage { inset: calc(-1 * var(--header-height)) 0 auto auto; width: var(--scene-width); height: calc(var(--scene-width) * .63569134); clip-path: inset(calc(var(--scene-width) * .078125) 0 0); }
  .problem { min-height: clamp(320px, 20vw, 480px); }
  .story-art { width: min(100%, 360px); }
  .story-daylight { width: min(100%, 300px); }
  .problem h2 { font-size: clamp(55px, 3.4vw, 84px); text-wrap: balance; }
  .problem-grid p, .problem-grid p:last-child { max-width: 58ch; font-size: clamp(20px, 1vw, 26px); }
  .workflow-section h2 { font-size: clamp(62px, 3.6vw, 88px); }
  .section-heading > p, .journey-caption p { font-size: clamp(18px, 1vw, 26px); }
  .workflow-section .section-heading > p { max-width: 72ch; }
  .workflow-tabs button { min-height: 60px; font-size: clamp(17px, .8vw, 24px); }
  .journey-caption h3 { font-size: clamp(42px, 2.3vw, 64px); }
  .journey { padding: 20px 26px; }
  .time-axis { height: clamp(26px, 2vw, 44px); font-size: clamp(12px, .65vw, 20px); }
  .lane { min-height: var(--lane-height); }
  .lane-name { font-size: clamp(16px, .85vw, 24px); }
  .lane-name small, .lane-labels, .work-block { font-size: clamp(12px, .6vw, 18px); }
  .client-thumbnail { width: clamp(86px, 5.5vw, 160px); height: clamp(52px, 3.3vw, 96px); }
  .lane-labels { gap: 14px; }
  .work-block { height: calc(var(--lane-height) * .28); }
  .work-block.human { top: calc(var(--lane-height) * .12); }
  .work-block.agent { top: calc(var(--lane-height) * .57); }
  [data-stage="1"] .work-block.human { top: calc(var(--lane-height) * .18); }
  [data-stage="1"] .work-block.agent { top: calc(var(--lane-height) * .38); height: calc(var(--lane-height) * .6); }
  [data-stage="1"] .work-block.agent .bar-label { font-size: inherit; }
  .timeline-legend { top: -58px; font-size: clamp(13px, .65vw, 20px); }
  .timeline-overlap-note, .timeline-recorded-totals dt, .timeline-context-title { font-size: clamp(14px, .7vw, 22px); }
  .timeline-context-title strong { font-size: clamp(20px, 1vw, 30px); }
  .review-surface { gap: clamp(60px, 4vw, 140px); }
  .review-surface h3, .record-surface > h3 { font-size: clamp(32px, 2vw, 48px); }
  .review-surface p, .record-surface p, .review-choice label, .review-choice select { font-size: clamp(16px, .9vw, 24px); }
  .evidence-context { font-size: clamp(14px, .8vw, 22px); }
  .record-surface { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto auto 1fr; gap: 18px clamp(60px, 4vw, 140px); align-items: start; }
  .record-head { grid-column: 1 / -1; }
  .record-surface > h3, .record-surface > p, .record-surface > .text-button { grid-column: 1; }
  .record-surface > h3 { grid-row: 2; }
  .record-surface > p { grid-row: 3; }
  .record-surface > .text-button { grid-row: 4; justify-self: start; }
  .statement-preview { grid-column: 2; grid-row: 2 / span 3; width: min(100%, 1000px); margin: 0; padding: 32px; }
  .statement-lines > div { font-size: clamp(15px, .7vw, 22px); }
  .statement-heading, .record-state { font-size: clamp(13px, .65vw, 20px); }
  .record-surface .statement-summary, .record-surface .statement-note { font-size: clamp(14px, .7vw, 20px); }
  .benefits { grid-template-columns: .95fr 1fr; column-gap: clamp(60px, 6vw, 190px); }
  .benefits > h2 { max-width: 12ch; }
  .benefit-rows { display: block; }
  .benefit-rows article { padding-bottom: 28px; }
  .benefit-rows article + article { padding-top: 28px; border-top: 1px solid var(--line); }
  .benefit-rows h3, .trust-details h3 { font-size: clamp(29px, 1.6vw, 44px); }
  .benefit-rows p, .trust-details p, .privacy-accordions details p { font-size: clamp(18px, calc(.5vw + 10px), 26px); }
  .trust { padding-block: clamp(82px, 4.5vw, 128px); }
  .trust-grid { grid-template-columns: 1fr 1fr; gap: 56px clamp(60px, 5vw, 150px); }
  .trust-intro { font-size: clamp(18px, 1vw, 26px); }
  .trust-details { margin-top: 0; gap: clamp(32px, 3vw, 100px); }
  .trust-art { width: min(100%, 1100px); }
  .closing-art { width: min(100%, 900px); }
  .trust-details article + article { margin-top: 0; }
  .privacy-accordions summary { font-size: clamp(17px, .85vw, 24px); min-height: 80px; }
  .roadmap .section-heading { max-width: 60ch; }
  .plans-intro, .payment-note { font-size: clamp(15px, .8vw, 22px); }
  .launch-bottom p { font-size: clamp(18px, calc(.5vw + 10px), 26px); }
  .launch h2 { max-width: 14ch; }
}
@media (max-width: 1100px) {
  .benefits, .trust-grid { gap: 60px; }
}
@media (max-width: 900px) {
  .ledger-opening { min-height: 470px; }
  .ledger-opening h1 { font-size: clamp(46px, 6.5cqw, 60px); }
  .hero-description { max-width: 39cqw; font-size: 17px; }
  .problem h2 { text-wrap: balance; }
  .problem-grid p { font-size: 18px; }
  .problem { padding-bottom: 36px; }
  .workflow-section .section-heading > p { max-width: 85%; }
  .review-surface { gap: 32px; }
  .review-choice .button { font-size: 14px; }
  .benefits, .trust-grid { gap: 40px; }
  .launch-bottom p { font-size: 17px; }
  .lane-name { width: 24%; gap: 8px; font-size: 15px; }
  .lane-labels { width: 18%; font-size: 12px; }
  .client-thumbnail { width: 60px; height: 44px; }
}
@media (max-width: 900px) {
  .ledger-opening { display: flex; flex-direction: column; height: auto; min-height: 0; padding-bottom: 0; }
  .ledger-opening .hero-copy { order: 0; padding-top: 24px; }
  .ledger-opening h1 { font-size: clamp(44px, 8.3cqw, 64px); max-width: none; line-height: .98; white-space: normal; text-wrap: balance; transform: none; }
  .hero-kicker { font-size: 11px; margin-bottom: 12px; }
  .hero-description { max-width: 48ch; margin-block: 18px; font-size: 18px; line-height: 1.4; }
  /* The unchanged entrance travels 8px; small screens need extra camera clearance. */
  .hero-stage { order: 1; position: relative; inset: auto; width: min(100%, 900px); height: calc(63.569134cqw + 8px); margin: 16px auto 0; }
  .problem { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 20px; padding-top: 30px; padding-bottom: 38px; min-height: 0; }
  .problem-grid { display: block; grid-column: 1 / -1; grid-row: 1; width: 100%; margin: 0; }
  .problem-grid > div { padding-right: 0; }
  .problem { container-type: normal; }
  .problem h2 { max-width: 650px; font-size: clamp(34px, 6vw, 46px); margin-bottom: 16px; text-wrap: balance; }
  .problem-grid p { font-size: 18px; line-height: 1.45; margin-top: 12px; }
  .story-art { display: block; position: relative; grid-column: 1; grid-row: 2; justify-self: start; align-self: end; width: min(100%, 180px); height: auto; aspect-ratio: .8; margin-top: 18px; }
  .story-paper { width: calc(100% + 40px); left: -20px; }
  .story-daylight { grid-column: 2; grid-row: 2; width: min(100%, 170px); aspect-ratio: 2 / 3; margin-top: 18px; }
  .workflow-section { padding-top: 24px; }
  .workflow-section h2 { font-size: clamp(34px, 6vw, 46px); }
  .workflow-section .section-heading > p { max-width: none; }
  .section-heading > p { font-size: 18px; }
  #review-demo { display: flex; flex-direction: column; }
  .workflow-intro { order: -3; }
  .workflow-section .section-heading { order: -2; }
  .workday-art { display: block; order: -1; width: min(72%, 300px); height: auto; aspect-ratio: 1.4; margin: 18px 0 32px auto; }
  .workflow-tabs.bt-tabs { width: 100%; }
  .workflow-tabs button { padding-inline: 4px; font-size: 16px; min-height: 48px; }
  .journey-caption { max-width: none; margin-bottom: 22px; }
  .journey-caption h3 { font-size: 30px; }
  .journey-caption p { font-size: 17px; }
  .journey { padding: 18px; margin-inline: 0; }
  .lane { display: grid; gap: 8px; padding-block: 14px; }
  .lane-name { width: auto; font-size: 16px; gap: 12px; }
  .lane-name small { display: inline; margin-left: 10px; font-size: 12px; }
  .client-thumbnail { width: 60px; height: 40px; }
  .lane-track { order: 1; height: 76px; min-height: 76px; }
  .work-block.human { top: 6px; height: 28px; }
  .work-block.agent { top: 42px; height: 28px; }
  .work-block .bar-label { display: none; }
  .lane-labels { order: 2; width: auto; padding-left: 0; flex-direction: row; display: flex; flex-wrap: wrap; gap: 4px 20px; font-size: 14px; color: #435b71; }
  .lane-labels > span:first-child { color: #375f84; font-weight: 600; }
  .lane-labels > span:last-child { color: #7c542b; }
  .time-axis { font-size: 12px; }
  .time-axis > span:nth-child(2) { left: 0; transform: none; }
  .time-axis > span:nth-child(3) { left: 33.333%; }
  .time-axis > span:nth-child(4) { left: 66.667%; }
  .time-axis > span:last-child { transform: none; }
  .time-axis > span:first-child { display: none; }
  .timeline-legend { gap: 10px 20px; font-size: 14px; }
  .timeline-legend span:last-child { width: 100%; margin-left: 0; }
  .timeline-recorded-totals { width: 100%; gap: 24px; }
  .timeline-recorded-totals > div { flex: 1; }
  .timeline-recorded-totals dt { font-size: 12px; }
  [data-stage="1"] .work-block.agent { top: 28px; height: 40px; }
  [data-stage="1"] .work-block.human { top: 10px; }
  .review-surface { grid-template-columns: 1fr; gap: 26px; }
  .review-surface h3, .record-surface > h3 { font-size: 28px; }
  .review-choice .button { font-size: 15px; }
  .evidence-context > div { grid-template-columns: 1fr 1fr; gap: 12px; font-size: 14px; }
  .record-head { display: block; }
  .record-head > span:first-child { display: block; margin-bottom: 12px; font-size: 12px; }
  .statement-preview { padding: 18px; margin: 24px 0 14px; }
  .statement-heading { gap: 12px; font-size: 12px; }
  .statement-heading .review-brand-logo { width: 112px; }
  .statement-lines > div { font-size: 14px; gap: 10px; }
  .statement-lines dd { gap: 3px 12px; max-width: 56%; }
  .statement-preview .statement-note { font-size: 14px; }
  .statement-action { width: 100%; font-size: 14px; padding-inline: 10px; }
  .benefits { display: block; }
  .benefits > h2 { max-width: none; }
  .benefits > h2 br { display: none; }
  .record-art { width: min(100%, 520px); margin-block: 24px 32px; }
  .benefit-rows h3 { font-size: 28px; }
  .trust { padding-block: 60px; }
  .trust-grid { grid-template-columns: 1fr; gap: 36px; }
  .trust-art { width: min(100%, 520px); justify-self: center; }
  .trust-details { grid-template-columns: 1fr; gap: 28px; }
  .trust h2 br { display: none; }
  .trust-intro { margin-top: 18px; max-width: 50ch; }
  .privacy-accordions summary { font-size: 17px; }
  .launch { grid-template-columns: 1fr; row-gap: 24px; }
  .launch h2 { max-width: none; }
  .launch-bottom { margin-top: 0; }
  .closing-art { grid-column: 1; grid-row: 3; width: min(100%, 420px); justify-self: center; }
}
@media (max-width: 480px) {
  .ledger-opening h1 { font-size: clamp(42px, 10.2cqw, 49px); text-wrap: wrap; }
  .hero-description { font-size: 17px; }
  .hero-copy .button { font-size: 16px; padding: 12px 18px; }
  .problem h2, .workflow-section h2 { font-size: 34px; }
  .problem-grid p { font-size: 18px; }
  .journey { padding: 18px 16px; }
  .journey-caption h3 { font-size: 28px; }
  .lane-name small { display: block; margin-left: 0; }
  .workflow-tabs button { font-size: 15px; }
  .review-surface h3, .record-surface > h3 { font-size: 26px; }
  .review-choice .button { white-space: normal; font-size: 15px; padding-inline: 12px; }
  .statement-heading { align-items: flex-start; flex-direction: column; gap: 8px; }
  .statement-lines > div { font-size: 14px; }
  .statement-preview h4 { font-size: 26px; }
  .statement-action { font-size: 14px; }
  .review-dialog-form { padding: 20px; }
  .review-dialog-lines > div { font-size: 14px; }
}