/* Case reading surface extends the approved Manrope / silver / lime landing. */
.case-page { margin: 0; --case-header-height: 0px; }
body.case-page main { max-width: none; padding: 0; margin: 0; }
.case-container { width: min(1280px, calc(100% - 112px)); margin-inline: auto; }
body.case-page .case-header { position: relative; top: auto; z-index: 30; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; margin: 0; padding-inline: 28px; }
.case-header>.cta { justify-self: end; }
.header-back { color: var(--text-secondary); text-underline-offset: 5px; font-size: 14px; min-height: 44px; display: inline-flex; align-items: center; }
.case-breadcrumb { display: flex; align-items: center; gap: 12px; font-size: 14px; color: var(--text-secondary); padding-block: 26px 24px; }
.case-breadcrumb a { color: inherit; min-height: 44px; display: inline-flex; align-items: center; text-underline-offset: 5px; }
.case-hero { display: grid; grid-template-columns: 1.25fr 1fr; gap: 64px; align-items: center; padding-bottom: 44px; }
.case-hero h1 { font-size: clamp(36px, 3.9vw, 56px); font-weight: 550; line-height: 1.12; letter-spacing: -.04em; margin: 0 0 24px; text-wrap: balance; }
.case-hero-copy>p { font-size: 17px; line-height: 1.75; color: var(--text-secondary); max-width: 58ch; margin: 0; }
.case-hero-copy>.case-demo-note { font-size: 13px; margin-top: 24px; line-height: 1.6; max-width: 48ch; }
.case-cover { margin: 0; min-width: 0; }
.case-cover img { display: block; width: 100%; height: auto; aspect-ratio: 1.27; object-fit: cover; border-radius: 20px; filter: saturate(.7); }
.case-cover figcaption { font-size: 13px; line-height: 1.6; margin-top: 12px; color: var(--text-secondary); }
.case-facts { display: grid; grid-template-columns: 1fr 1.2fr 1fr 1.4fr; gap: 24px; margin: 0 0 36px; padding-block: 24px; border-block: 1px solid var(--panel-line); }
.case-facts dt { color: var(--text-secondary); font-size: 13px; margin-bottom: 10px; }
.case-facts dd { margin: 0; font-size: 15px; font-weight: 600; line-height: 1.5; }
.case-navigation { position: sticky; top: var(--case-header-height); z-index: 20; background: var(--canvas); border-bottom: 1px solid var(--panel-line); }
.case-navigation nav { display: flex; gap: 32px; overflow-x: auto; scrollbar-width: thin; }
.case-navigation a { flex: 0 0 auto; display: inline-flex; align-items: center; min-height: 58px; color: var(--text-secondary); text-decoration: none; font-size: 14px; font-weight: 550; border-bottom: 2px solid transparent; }
.case-navigation a[aria-current="location"] { color: var(--foreground); border-color: #557d2d; }
.case-article { padding-block: 8px 72px; }
.case-section { padding-block: 76px; border-bottom: 1px solid var(--panel-line); scroll-margin-top: calc(var(--case-header-height) + 76px); }
.case-page h2 { font-size: clamp(28px, 3vw, 40px); line-height: 1.17; letter-spacing: -.035em; font-weight: 550; margin: 0 0 24px; text-wrap: balance; }
.case-page h3 { font-size: 20px; font-weight: 600; letter-spacing: -.02em; line-height: 1.4; margin: 0 0 14px; }
.case-section p { font-size: 16px; line-height: 1.8; color: var(--text-secondary); margin: 0; max-width: 68ch; }
.case-split { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; }
.task-section>h2 { margin-bottom: 40px; }
.case-section-intro { max-width: 800px; margin-bottom: 36px; }
.case-architecture { padding: 36px; background: var(--surface); border-radius: 20px; }
.architecture-route { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 30px; list-style: none; padding: 0; margin: 0; }
.architecture-route li { position: relative; border-radius: 14px; background: var(--surface-raised); padding: 24px 20px; min-height: 116px; display: flex; flex-direction: column; justify-content: center; }
.architecture-route li:not(:last-child)::after { content: ''; position: absolute; width: 30px; height: 2px; background: #557d2d; left: 100%; top: 50%; }
.architecture-route li:not(:last-child)::before { content: ''; position: absolute; width: 7px; height: 7px; border-top: 2px solid #557d2d; border-right: 2px solid #557d2d; transform: rotate(45deg); left: calc(100% + 21px); top: calc(50% - 3px); }
.architecture-route li.architecture-core { background: var(--lime); color: #202b17; }
.architecture-route span { font-size: 12px; line-height: 1.6; margin-bottom: 10px; color: var(--text-secondary); }
.architecture-core span { color: #3a5125; }
.architecture-route strong { font-weight: 600; font-size: 18px; line-height: 1.45; }
.knowledge-branch { position: relative; display: grid; grid-template-columns: 1fr 3fr; gap: 30px; border-top: 1px solid var(--line); padding-top: 24px; margin-top: 28px; }
.knowledge-branch strong { font-size: 16px; font-weight: 600; }
.knowledge-branch p, .case-architecture .architecture-control { font-size: 14px; line-height: 1.7; }
.case-architecture .architecture-control { margin-top: 24px; max-width: none; }
.case-actions { counter-reset: actions; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 32px 60px; margin: 40px 0 0; padding: 0; }
.case-actions li { counter-increment: actions; padding-left: 44px; position: relative; }
.case-actions li::before { content: counter(actions,decimal-leading-zero); position: absolute; top: 4px; left: 0; color: var(--text-secondary); font-size: 13px; font-variant-numeric: tabular-nums; }
.case-actions h3 { font-size: 19px; margin-bottom: 10px; }
.case-actions p { font-size: 15px; }
.case-scenario { display: grid; grid-template-columns: 1.15fr 1fr; gap: 48px; align-items: start; }
.case-conversation { background: var(--surface); border-radius: 20px; padding: 28px; }
.case-conversation>h3 { font-size: 16px; border-bottom: 1px solid var(--line); padding-bottom: 20px; margin-bottom: 24px; }
.case-conversation ol { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; list-style: none; }
.case-bubble { max-width: 92%; padding: 16px 18px; border-radius: 14px; background: var(--surface-raised); }
.case-bubble.agent { align-self: flex-end; background: #e3f0d7; color: #25351c; }
.case-bubble .bubble-author { display: block; font-size: 12px; font-weight: 600; margin-bottom: 7px; color: var(--text-secondary); }
.case-bubble.agent .bubble-author { color: #476038; }
.case-bubble p { font-size: 15px; line-height: 1.65; color: inherit; }
.case-handoff { padding-top: 8px; position: sticky; top: 168px; }
.case-handoff>h3 { margin-bottom: 24px; }
.case-record { padding: 28px; border-radius: 16px; border: 1px solid var(--panel-line); background: var(--surface-raised); }
.case-record .record-title { color: var(--foreground); font-size: 14px; font-weight: 600; padding-bottom: 20px; border-bottom: 1px solid var(--panel-line); }
.case-record dl { margin: 0; }
.case-record dl>div { padding-block: 16px; border-bottom: 1px solid var(--panel-line); }
.case-record dt { font-size: 12px; color: var(--text-secondary); margin-bottom: 6px; }
.case-record dd { font-size: 16px; font-weight: 550; line-height: 1.5; margin: 0; }
.case-record .record-status { margin-top: 20px; color: #375a23; font-size: 14px; }
.case-handoff .handoff-note { font-size: 14px; line-height: 1.75; margin-top: 24px; }
.case-inline-cta { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 32px; }
.case-inline-cta p { font-size: 15px; }
.case-text-button { display: inline-flex; align-items: center; min-height: 44px; font-family: inherit; font-size: 15px; font-weight: 600; padding: 10px 0; border: 0; border-bottom: 1px solid currentColor; background: transparent; color: var(--foreground); cursor: pointer; white-space: nowrap; }
.case-launch { list-style: none; padding: 0; margin: 0; }
.case-launch li { display: grid; grid-template-columns: 36px 1fr; gap: 16px; padding: 20px 0; border-top: 1px solid var(--panel-line); }
.case-launch li:first-child { padding-top: 0; border-top: 0; }
.launch-index { font-size: 13px; color: var(--text-secondary); padding-top: 5px; font-variant-numeric: tabular-nums; }
.case-result-table { display: grid; grid-template-columns: 3fr 1.3fr; gap: 48px; padding: 32px; background: var(--surface); border-radius: 20px; align-items: center; }
.case-result-table table { border-collapse: collapse; width: 100%; text-align: left; font-variant-numeric: tabular-nums; }
.case-result-table caption { text-align: left; font-size: 14px; font-weight: 600; margin-bottom: 24px; color: var(--text-secondary); }
.case-result-table thead th { font-weight: 400; color: var(--text-secondary); font-size: 13px; padding: 0 20px 14px 0; border-bottom: 1px solid var(--line); }
.case-result-table tbody th { font-size: 15px; font-weight: 550; line-height: 1.5; padding-top: 20px; padding-right: 20px; }
.case-result-table td { font-size: clamp(24px,2.7vw,36px); line-height: 1.2; letter-spacing: -.03em; font-weight: 550; padding: 20px 20px 0 0; white-space: nowrap; }
.case-result-table td:last-child { color: #375a23; }
.case-result-table .case-result-change { color: var(--foreground); font-size: 25px; line-height: 1.35; font-weight: 550; letter-spacing: -.02em; }
.case-result-change span { display: block; color: var(--text-secondary); font-size: 13px; line-height: 1.6; font-weight: 400; margin-top: 10px; letter-spacing: 0; }
.case-method { margin-top: 32px; max-width: 760px; }
.case-method h3 { font-size: 18px; }
.case-method p { font-size: 14px; margin-top: 12px; }
.case-boundaries { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; border-bottom: 0; }
.case-boundaries ul { padding-left: 20px; margin: 0; }
.case-boundaries li { color: var(--text-secondary); font-size: 16px; line-height: 1.75; padding: 0 0 16px 8px; }
.case-boundaries li::marker { color: #557d2d; }
.case-final-cta { background: var(--surface); padding: 56px; border-radius: 20px; }
.case-final-cta h2 { max-width: 850px; }
.case-final-cta>p { max-width: 650px; font-size: 17px; line-height: 1.75; color: var(--text-secondary); margin: 0 0 28px; }
.case-final-cta .case-cta-guidance { font-size: 14px; line-height: 1.7; max-width: 550px; margin: 20px 0 0; }
.case-cta-guidance strong { display: block; font-weight: 600; color: var(--foreground); }
.case-next { padding-top: 64px; display: flex; justify-content: space-between; align-items: end; gap: 48px; }
.case-next h2 { font-size: 22px; }
.case-next-link { display: grid; grid-template-columns: 140px 1fr; gap: 24px; max-width: 660px; color: var(--foreground); text-decoration: none; }
.case-next-link img { width: 140px; height: 140px; object-fit: cover; border-radius: 14px; filter: saturate(.7); }
.case-next-link>span { display: flex; flex-direction: column; justify-content: center; gap: 10px; font-size: 15px; line-height: 1.6; color: var(--text-secondary); }
.case-next-link strong { font-size: 20px; font-weight: 600; color: var(--foreground); }
.next-action { font-size: 14px; color: var(--foreground); text-decoration: underline; text-underline-offset: 5px; }
.case-all-link { color: var(--foreground); font-size: 14px; text-underline-offset: 5px; min-height: 44px; display: inline-flex; align-items: center; flex-shrink: 0; }
.case-page .site-footer { margin: 0; }
[data-theme="dark"] .case-bubble.agent { background: #34492b; color: #ecf6e5; }
[data-theme="dark"] .case-bubble.agent .bubble-author { color: #c7dfb9; }
[data-theme="dark"] .record-status,[data-theme="dark"] .case-result-table td:last-child { color: var(--lime); }
@media(hover:hover) and (pointer:fine) { .case-text-button:hover,.case-all-link:hover,.header-back:hover { color: #557d2d; } .case-navigation a:hover { color: var(--foreground); } .case-next-link:hover .next-action { text-decoration-thickness: 2px; } }
@media(max-width:1100px) { .case-container { width: calc(100% - 64px); } .case-hero { gap: 36px; } .case-split,.case-boundaries { gap: 48px; } .case-architecture { padding: 24px; } .architecture-route { gap: 20px; } .architecture-route li { padding: 18px 14px; } .architecture-route li:not(:last-child)::after { width: 20px; } .architecture-route li:not(:last-child)::before { left: calc(100% + 11px); } .architecture-route strong { font-size: 16px; } .case-scenario { gap: 28px; } .case-result-table { gap: 28px; } }
@media(max-width:750px) {
  .case-container { width: calc(100% - 40px); } body.case-page .case-header { grid-template-columns: 1fr auto; gap: 12px; padding: 12px 20px; } .case-header .brand .brand-name { font-size: 20px; } .case-header .brand-mark { width: 38px; height: 30px; } .case-header .brand { gap: 7px; } .case-header .header-back { display: none; } body.case-page .case-header>.cta { padding: 11px 16px; min-height: 44px; font-size: 12px; }
  .case-breadcrumb { padding-block: 16px; gap: 8px; font-size: 12px; }
  .case-hero { grid-template-columns: 1fr; gap: 28px; padding-bottom: 28px; } .case-hero h1 { font-size: clamp(32px,7.8vw,44px); line-height: 1.14; margin-bottom: 20px; } .case-hero-copy>p { font-size: 16px; line-height: 1.7; } .case-hero-copy>.case-demo-note { font-size: 12px; margin-top: 18px; } .case-cover img { aspect-ratio: 1.65; border-radius: 16px; }
  .case-facts { grid-template-columns: 1fr 1fr; gap: 24px 16px; padding-block: 24px; margin-bottom: 16px; } .case-facts dt { font-size: 12px; } .case-facts dd { font-size: 14px; }
  .case-page { --case-header-height: 0px; } .case-navigation nav { gap: 24px; } .case-navigation a { min-height: 52px; font-size: 13px; }
  .case-section { padding-block: 48px; scroll-margin-top: calc(var(--case-header-height) + 68px); } .case-page h2 { font-size: 29px; } .case-split,.case-boundaries { grid-template-columns: 1fr; gap: 28px; } .task-section>h2 { margin-bottom: 28px; } .case-page h3 { font-size: 19px; } .case-section p { font-size: 16px; line-height: 1.75; }
  .case-section-intro { margin-bottom: 28px; } .case-architecture { padding: 24px; border-radius: 16px; } .architecture-route { grid-template-columns: 1fr; gap: 24px; } .architecture-route li { min-height: 96px; padding: 20px; } .architecture-route strong { font-size: 18px; } .architecture-route li:not(:last-child)::after { height: 24px; width: 2px; left: 50%; top: 100%; } .architecture-route li:not(:last-child)::before { left: calc(50% - 3px); top: calc(100% + 15px); transform: rotate(135deg); }
  .knowledge-branch { grid-template-columns: 1fr; gap: 10px; } .knowledge-branch p,.case-architecture .architecture-control { font-size: 14px; }
  .case-actions { grid-template-columns: 1fr; gap: 28px; margin-top: 32px; } .case-actions p { font-size: 15px; } .case-scenario { grid-template-columns: 1fr; gap: 32px; } .case-conversation { padding: 20px 16px; border-radius: 16px; } .case-bubble { max-width: 95%; padding: 14px; } .case-bubble p { font-size: 15px; } .case-handoff { position: static; } .case-record { padding: 24px; }
  .case-inline-cta { display: block; margin-top: 24px; } .case-inline-cta p { font-size: 15px; } .case-text-button { margin-top: 8px; white-space: normal; } .case-launch { margin-top: 4px; }
  .case-result-table { display: block; padding: 24px 18px; border-radius: 16px; } .case-result-table table { table-layout: fixed; } .case-result-table th:first-child { width: 43%; } .case-result-table tbody th { font-size: 13px; padding-right: 12px; } .case-result-table thead th { font-size: 12px; padding-right: 8px; } .case-result-table td { font-size: 24px; padding-right: 0; white-space: normal; } .case-result-table .case-result-change { font-size: 23px; padding-top: 24px; margin-top: 24px; border-top: 1px solid var(--line); } .case-method p { font-size: 14px; }
  .case-final-cta { padding: 32px 24px; border-radius: 16px; } .case-final-cta>p { font-size: 16px; } .case-final-cta .cta { width: 100%; } .case-next { display: block; padding-top: 48px; } .case-next-link { grid-template-columns: 96px 1fr; gap: 20px; } .case-next-link img { width: 96px; height: 128px; } .case-next-link>span { font-size: 14px; gap: 8px; } .case-next-link strong { font-size: 18px; } .case-all-link { margin-top: 28px; }
}
@media(max-width:360px) { body.case-page .case-header { padding-inline: 14px; gap: 6px; } .case-header .brand .brand-name { font-size: 17px; } .case-header .brand-mark { width: 32px; } body.case-page .case-header>.cta { padding-inline: 12px; font-size: 11px; } .case-result-table { padding-inline: 14px; } .case-result-table td { font-size: 21px; } .case-breadcrumb { flex-wrap: wrap; } }
@media(prefers-reduced-motion:reduce) { .case-page { scroll-behavior: auto; } .case-page *, .case-page *::before,.case-page *::after { transition: none; } }