/* SketchRun Voice — product subpages */
.sub-page {
  --sub-radius: 24px;
  color: var(--ink, #0a0a0b);
  overflow: clip;
}
.sub-page *, .sub-page *::before, .sub-page *::after { box-sizing: border-box; }
.sub-page h1, .sub-page h2, .sub-page h3, .sub-page p { margin-top: 0; }
.sub-page h1, .sub-page h2, .sub-page h3 { letter-spacing: -.045em; }
.sub-page p { line-height: 1.9; }
.sub-page button, .sub-page input, .sub-page select, .sub-page textarea { font: inherit; }
.sub-page button, .sub-page a, .sub-page input, .sub-page select, .sub-page textarea, .sub-page summary { -webkit-tap-highlight-color: transparent; }
.sub-page button { color: inherit; }
.sub-page a { color: inherit; }
.sub-page .btn { display: inline-flex; align-items: center; justify-content: center; gap: 18px; min-height: 54px; padding: 15px 25px; text-decoration: none; font-size: 14px; font-weight: 600; white-space: nowrap; }
.sub-page .btn-primary { color: white; }
.sub-page .btn .sub-icon { width: 18px; height: 18px; flex: 0 0 auto; }
.sub-page :focus-visible { outline: 3px solid #7774ff; outline-offset: 5px; }
.sub-page [hidden] { display: none !important; }
.sub-icon { width: 24px; height: 24px; flex-shrink: 0; vertical-align: middle; }
.sub-eyebrow { font-size: 11px; font-weight: 650; letter-spacing: .15em; line-height: 1.5; margin-bottom: 25px; }
.sub-breadcrumb { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding-top: 30px; font-size: 11px; line-height: 1.8; color: var(--muted); }
.sub-breadcrumb a { text-decoration: none; transition: color .2s; }
.sub-breadcrumb a:hover { color: var(--accent); }
.sub-breadcrumb > .sub-icon { height: 10px; width: 10px; color: #a7a7af; }
.sub-breadcrumb [aria-current] { color: var(--ink); }
.sub-hero { padding-top: 65px; padding-bottom: 70px; }
.sub-hero h1 { font-size: clamp(42px, 4.4vw, 64px); line-height: 1.36; font-weight: 700; margin-bottom: 28px; }
.sub-lead { font-size: 15px; line-height: 2 !important; color: var(--muted); max-width: 650px; margin-bottom: 0; letter-spacing: .01em; }
.sub-page h2 { font-size: clamp(28px, 3vw, 40px); line-height: 1.5; font-weight: 650; margin-bottom: 22px; }
.sub-section-title { margin-bottom: 50px; }
.sub-section-title h2 { margin-bottom: 15px; }
.sub-section-title > p:last-child { margin-bottom: 0; font-size: 14px; color: var(--muted); }
.sub-tag { display: inline-flex; align-items: center; font-size: 10px; font-weight: 650; line-height: 1; letter-spacing: .06em; border-radius: 100px; background: #e9e8ff; color: #514de0; padding: 9px 12px; }
.sub-tag-white { background: white; }
.sub-inline-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 22px; margin-top: 32px; }
.sub-text-link { display: inline-flex; align-items: center; gap: 16px; text-decoration: none; font-size: 13px; font-weight: 600; line-height: 1.7; transition: color .2s; }
.sub-text-link .sub-icon { width: 19px; height: 19px; transition: transform .2s; }
.sub-text-link:hover { color: var(--accent); }
.sub-text-link:hover .sub-icon { transform: translateX(4px); }
.sub-footnote { font-size: 11px; color: var(--muted); line-height: 1.9; margin-top: 26px; }
.sub-mobile-break { display: none; }
.sub-cta { background: var(--lavender, #f0f0ff); }
.sub-cta-inner { display: grid; grid-template-columns: 1.3fr 1fr; align-items: center; gap: 50px; padding-top: 10px; padding-bottom: 10px; }
.sub-cta h2 { font-size: clamp(30px, 3.7vw, 48px); line-height: 1.5; margin-bottom: 22px; }
.sub-cta p:last-child { color: var(--muted); font-size: 14px; margin-bottom: 0; }
.sub-cta-actions { display: flex; flex-direction: column; width: min(100%, 280px); justify-self: end; gap: 14px; }
.sub-cta-actions .btn { justify-content: space-between; }
.sub-cta-actions .btn-secondary { background: rgba(255, 255, 255, .5); }
.sub-filter-bar { display: flex; align-items: center; justify-content: space-between; padding-bottom: 30px; border-bottom: 1px solid var(--line); margin-bottom: 34px; gap: 20px; }
.sub-filter-group { display: inline-flex; border: 1px solid var(--line); background: white; border-radius: 100px; padding: 5px; gap: 3px; }
.sub-filter { background: transparent; border: none; border-radius: 100px; cursor: pointer; padding: 12px 22px; color: var(--muted); font-size: 12px; font-weight: 600; transition: background .2s, color .2s; }
.sub-filter.is-active { background: var(--ink); color: white; }
.sub-filter:not(.is-active):hover { background: var(--lavender); color: var(--accent); }
.sub-filter-count { font-size: 10px; letter-spacing: .12em; color: var(--muted); }
.sub-filter-count b { color: var(--ink); font-size: 14px; margin-right: 6px; }
.sub-scenario-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.sub-scenario-card { display: flex; flex-direction: column; padding: 32px 35px 0; background: white; border: 1px solid var(--line); border-radius: var(--sub-radius); text-decoration: none; min-height: 340px; transition: transform .25s, border-color .25s, box-shadow .25s; }
.sub-scenario-card:hover { transform: translateY(-5px); border-color: #c7c4ff; box-shadow: 0 14px 35px rgba(35, 30, 90, .045); }
.sub-scenario-card-top { display: flex; justify-content: space-between; align-items: center; }
.sub-card-number { font-size: 12px; color: #95959d; letter-spacing: .06em; }
.sub-scenario-symbol { display: flex; align-items: center; width: 48px; height: 52px; color: var(--accent); margin: 20px 0 14px; }
.sub-scenario-symbol .sub-icon { width: 34px; height: 34px; stroke-width: 1.3; }
.sub-scenario-card h3 { font-size: 22px; line-height: 1.55; margin: 0 0 13px; }
.sub-scenario-card > p { color: var(--muted); font-size: 13px; margin-bottom: 30px; max-width: 440px; }
.sub-scenario-card-bottom { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: auto; padding: 22px 0; border-top: 1px solid var(--line); }
.sub-scenario-card-bottom > span { font-size: 11px; color: var(--muted); line-height: 1.8; }
.sub-scenario-card-bottom > .sub-icon { width: 18px; height: 18px; }
.sub-beyond { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.sub-beyond h2 { margin-bottom: 0; }
.sub-beyond > div > p { color: var(--muted); font-size: 14px; margin-bottom: 30px; }
.sub-detail-hero { display: grid; grid-template-columns: 1.15fr 1fr; gap: 70px; align-items: center; padding-top: 65px; padding-bottom: 80px; }
.sub-detail-hero h1 { font-size: clamp(35px, 3.4vw, 50px); line-height: 1.5; max-width: 680px; margin-top: 22px; }
.sub-detail-hero .sub-lead { font-size: 14px; }
.sub-hero-tags { display: flex; align-items: center; gap: 12px; }
.sub-hero-tags > span:last-child { font-size: 12px; color: var(--muted); }
.sub-detail-hero .sub-inline-actions { gap: 18px; align-items: flex-start; }
.sub-detail-hero .sub-inline-actions .sub-text-link { padding-top: 15px; }
.sub-detail-visual { position: relative; min-height: 450px; background: var(--lavender); border-radius: 30px; padding: 30px; display: flex; align-items: center; flex-direction: column; justify-content: center; overflow: hidden; }
.sub-visual-orbit { position: absolute; width: 440px; height: 440px; left: 50%; top: 50%; transform: translate(-50%, -50%); border: 1px solid rgba(87, 84, 255, .12); border-radius: 50%; }
.sub-visual-orbit::before, .sub-visual-orbit::after { content: ""; position: absolute; inset: 40px; border: 1px solid rgba(87, 84, 255, .1); border-radius: 50%; }
.sub-visual-orbit::after { inset: 85px; }
.sub-call-chip { position: relative; display: inline-flex; align-items: center; gap: 11px; font-size: 10px; color: var(--accent); background: white; border-radius: 100px; padding: 10px 13px; align-self: flex-start; }
.sub-call-chip .sub-icon { width: 15px; height: 15px; }
.sub-status-dot { display: inline-block; background: var(--accent); width: 6px; height: 6px; border-radius: 50%; box-shadow: 0 0 0 4px rgba(87, 84, 255, .08); }
.sub-visual-main { position: relative; display: flex; align-items: center; gap: 16px; padding: 27px 25px; margin-top: 25px; color: var(--ink); }
.sub-visual-main > .sub-icon { width: 48px; height: 48px; color: var(--accent); stroke-width: 1.2; }
.sub-visual-main > span { font-size: 21px; letter-spacing: -.07em; }
.sub-visual-main > span > b { font-weight: 550; margin-left: 2px; }
.sub-visual-label { position: relative; font-size: 8px; letter-spacing: .17em; color: #8884b9; margin: 0 0 22px; }
.sub-result-preview { position: relative; background: rgba(255, 255, 255, .95); padding: 8px 22px; width: 100%; max-width: 350px; border: 1px solid rgba(87, 84, 255, .12); border-radius: 15px; box-shadow: 0 10px 30px rgba(36, 30, 116, .04); }
.sub-result-preview > div { display: flex; justify-content: space-between; gap: 15px; padding: 13px 0; border-bottom: 1px solid #eeedf6; font-size: 11px; line-height: 1.7; }
.sub-result-preview > div:last-child { border-bottom: none; }
.sub-result-preview > div > span { color: var(--muted); white-space: nowrap; }
.sub-result-preview strong { font-weight: 550; text-align: right; }
.sub-visual-caption { position: absolute; bottom: 16px; right: 22px; color: #9d9aa8; font-size: 9px; }
.sub-challenge-band { background: white; border-block: 1px solid var(--line); }
.sub-challenges { display: grid; grid-template-columns: 1fr 1.3fr; gap: 100px; padding-top: 64px; padding-bottom: 64px; align-items: center; }
.sub-challenges h2 { font-size: 30px; margin-bottom: 0; }
.sub-challenges .sub-eyebrow { margin-bottom: 20px; }
.sub-challenges ul { padding: 0; margin: 0; list-style: none; }
.sub-challenges li { display: flex; gap: 16px; font-size: 14px; line-height: 1.9; padding: 16px 0; border-bottom: 1px solid var(--line); }
.sub-challenges li:last-child { border-bottom: 0; }
.sub-small-dot { height: 5px; width: 5px; border-radius: 50%; background: var(--accent); margin-top: 12px; flex-shrink: 0; }
.sub-audio-section { display: grid; grid-template-columns: .85fr 1.15fr; gap: 95px; align-items: start; }
.sub-audio-intro { padding-top: 10px; }
.sub-audio-intro > p { font-size: 14px; color: var(--muted); }
.sub-preview-note { display: flex; gap: 11px; align-items: flex-start; margin-top: 35px; color: var(--muted); font-size: 11px; line-height: 1.9; }
.sub-preview-note .sub-icon { width: 16px; height: 16px; margin-top: 3px; }
.sub-audio-player { padding: 29px; background: var(--lavender); border-radius: 23px; border: 1px solid #e3e2f4; }
.sub-player-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 23px; gap: 10px; }
.sub-player-type { font-size: 8px; letter-spacing: .13em; color: #858298; }
.sub-audio-player h3 { font-size: 20px; line-height: 1.6; margin-bottom: 5px; }
.sub-waveform { height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 3px; color: var(--accent); }
.sub-waveform span { width: 3px; min-width: 2px; height: var(--wave); border-radius: 4px; background: currentColor; opacity: .48; }
.is-playing .sub-waveform span { opacity: .85; animation: sub-wave 1s ease-in-out var(--delay) infinite alternate; }
.sub-player-controls { display: flex; gap: 17px; align-items: center; }
.sub-play-control { display: grid; place-items: center; width: 46px; height: 46px; border: none; border-radius: 50%; background: var(--ink); color: white !important; cursor: pointer; flex-shrink: 0; transition: transform .2s; }
.sub-play-control:hover { transform: scale(1.07); }
.sub-play-control .sub-icon { width: 19px; height: 19px; }
.sub-player-progress { flex: 1; min-width: 0; }
.sub-progress-track { background: #dcdaf2; height: 3px; border-radius: 4px; overflow: hidden; }
.sub-progress-track > span { display: block; height: 100%; width: 0; background: var(--accent); transition: width .5s linear; }
.sub-player-meta { display: flex; justify-content: space-between; gap: 10px; padding-top: 9px; font-size: 9px; color: #777487; letter-spacing: .01em; }
.sub-transcript { border-top: 1px solid #dcdaee; margin-top: 25px; padding-top: 4px; }
.sub-transcript > summary { display: flex; align-items: center; justify-content: space-between; font-size: 11px; font-weight: 550; cursor: pointer; padding: 16px 0 12px; list-style: none; }
.sub-transcript > summary::-webkit-details-marker { display: none; }
.sub-transcript > summary > .sub-icon { width: 15px; height: 15px; transition: transform .2s; }
.sub-transcript[open] > summary > .sub-icon { transform: rotate(45deg); }
.sub-transcript-lines { max-height: 295px; overflow: auto; padding: 5px 7px 0 0; scrollbar-width: thin; scrollbar-color: #c9c6e8 transparent; }
.sub-chat-line { padding: 10px 12px; border-radius: 10px; margin: 5px 0; transition: background .3s, box-shadow .3s; }
.sub-chat-line.is-ai { background: rgba(255, 255, 255, .7); }
.sub-chat-line.is-customer { margin-left: 34px; }
.sub-chat-line.is-current { background: white; box-shadow: inset 3px 0 0 var(--accent); }
.sub-speaker { display: inline-block; color: var(--accent); font-size: 8px; font-weight: 650; margin-bottom: 4px; }
.is-customer .sub-speaker { color: var(--muted); }
.sub-chat-line p { font-size: 11px; line-height: 1.85; margin-bottom: 0; color: #3c3b4b; }
.sub-process-section { background: #ebebee; }
.sub-process-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 35px; }
.sub-process-step { padding-top: 24px; border-top: 1px solid #ceced5; position: relative; }
.sub-process-step::after { content: ""; position: absolute; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); top: -3px; left: 0; }
.sub-step-number { display: inline-block; font-size: 11px; color: #8f8e9c; letter-spacing: .06em; margin-bottom: 22px; }
.sub-process-step h3 { font-size: 17px; margin-bottom: 15px; line-height: 1.7; }
.sub-process-step p { font-size: 12px; line-height: 2; color: var(--muted); margin-bottom: 0; }
.sub-benefit-section { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.sub-benefit-list > div { display: flex; align-items: center; gap: 18px; padding: 22px 0; border-bottom: 1px solid var(--line); }
.sub-benefit-list > div:first-child { padding-top: 0; }
.sub-benefit-list > div > span { font-size: 10px; color: var(--accent); }
.sub-benefit-list > div > p { margin: 0; flex: 1; font-size: 14px; }
.sub-benefit-list > div > .sub-icon { width: 19px; height: 19px; color: var(--accent); }
.sub-related { padding-top: 15px !important; }
.sub-heading-line { display: flex; justify-content: space-between; align-items: flex-end; gap: 30px; margin-bottom: 35px; }
.sub-heading-line h2 { font-size: 30px; margin-bottom: 0; }
.sub-heading-line .sub-eyebrow { margin-bottom: 17px; }
.sub-heading-line > .sub-text-link { padding-bottom: 6px; }
.sub-capability-overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.sub-capability-overview > a { display: flex; align-items: center; gap: 16px; padding: 28px 24px; background: white; border: 1px solid var(--line); border-radius: 16px; text-decoration: none; transition: border-color .2s, transform .2s; }
.sub-capability-overview > a:hover { border-color: #b8b5fc; transform: translateY(-3px); }
.sub-overview-icon { background: var(--lavender); color: var(--accent); display: grid; place-items: center; height: 47px; width: 47px; border-radius: 14px; flex-shrink: 0; }
.sub-overview-icon > .sub-icon { width: 22px; height: 22px; }
.sub-capability-overview > a > span:nth-child(2) { flex: 1; }
.sub-capability-overview b { display: block; font-size: 17px; margin-bottom: 8px; font-weight: 650; }
.sub-capability-overview small { display: block; color: var(--muted); font-size: 10px; line-height: 1.8; }
.sub-capability-overview > a > .sub-icon { width: 15px; height: 15px; }
.sub-feature-row { display: grid; grid-template-columns: 45px 1fr 1fr; gap: 35px; border-top: 1px solid var(--line); padding: 48px 0; align-items: start; }
.sub-feature-row:last-of-type { border-bottom: 1px solid var(--line); }
.sub-feature-number { font-size: 11px; color: #96949f; padding-top: 6px; }
.sub-feature-icon { display: inline-flex; color: var(--accent); margin-bottom: 25px; }
.sub-feature-icon .sub-icon { width: 28px; height: 28px; stroke-width: 1.3; }
.sub-feature-label { font-size: 9px; font-weight: 600; color: #8b88ac; letter-spacing: .11em; margin-left: 12px; }
.sub-feature-row-heading h2 { font-size: 26px; line-height: 1.6; margin-bottom: 0; }
.sub-feature-row-body { padding-top: 4px; }
.sub-feature-row-body p { font-size: 14px; color: var(--muted); line-height: 2; margin-bottom: 22px; }
.sub-pill-list { display: flex; flex-wrap: wrap; gap: 8px; }
.sub-pill-list > span { font-size: 10px; border: 1px solid var(--line); padding: 8px 12px; border-radius: 100px; color: #73727b; background: rgba(255, 255, 255, .6); }
.sub-dark-band { background: var(--ink); color: white; padding: 80px 0; }
.sub-dark-band-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; align-items: center; }
.sub-dark-band .sub-eyebrow { color: #b0acf8; }
.sub-dark-band h2 { font-size: 42px; margin-bottom: 0; }
.sub-dark-band-inner > div > p { color: #aaaab4; font-size: 14px; margin-bottom: 25px; }
.sub-dark-band .btn-secondary { border-color: #48484e; background: transparent; color: white; }
.sub-workflow-preview { background: var(--lavender); border: 1px solid #e0dff2; border-radius: 28px; padding: 28px 34px 20px; }
.sub-workflow-preview-top { display: flex; align-items: center; gap: 16px; padding-bottom: 24px; border-bottom: 1px solid #dbdaec; }
.sub-workflow-preview-top > span:nth-child(2) { font-size: 12px; flex: 1; color: #656278; }
.sub-placeholder-label { font-size: 9px; color: #918da7; border: 1px solid #d8d5ed; border-radius: 100px; padding: 6px 10px; white-space: nowrap; }
.sub-workflow-stage { display: grid; grid-template-columns: 1.2fr 1fr; padding: 36px 25px; gap: 70px; align-items: center; min-height: 355px; }
.sub-stage-heading { display: flex; align-items: center; gap: 12px; color: #6660b0; font-size: 11px; margin-bottom: 30px; }
.sub-stage-voice { display: flex; align-items: center; gap: 25px; margin-bottom: 24px; }
.sub-voice-monogram { height: 66px; width: 66px; display: flex; align-items: center; justify-content: center; border-radius: 22px; background: #625cff; color: white; font-size: 27px; font-weight: 650; letter-spacing: -.1em; font-family: Inter, sans-serif; box-shadow: 0 10px 30px #a4a0ff30; }
.sub-voice-monogram > span { font-size: 22px; font-weight: 300; align-self: flex-end; padding-bottom: 17px; margin-left: 2px; }
.sub-stage-wave { display: inline-flex; gap: 4px; align-items: center; height: 60px; }
.sub-stage-wave > i { width: 3px; background: #8b86ff; border-radius: 4px; height: var(--wave); }
.is-playing .sub-stage-wave > i { animation: sub-wave .9s ease-in-out infinite alternate; }
.is-playing .sub-stage-wave > i:nth-child(3n) { animation-delay: -.3s; }
.is-playing .sub-stage-wave > i:nth-child(3n+1) { animation-delay: -.6s; }
.sub-workflow-stage-left > p { max-width: 430px; min-height: 74px; font-size: 15px; line-height: 1.9; margin-bottom: 20px; color: #47435f; }
.sub-stage-example-label { color: #9a97af; font-size: 9px; }
.sub-workflow-stage-right { position: relative; background: white; border: 1px solid #e1dff1; border-radius: 16px; box-shadow: 0 12px 30px #5e54880a; padding: 25px 26px 36px; transform: rotate(1.5deg); }
.sub-ticket-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 23px; }
.sub-ticket-head > span:first-child { font-size: 9px; letter-spacing: .1em; color: #9a97ab; }
.sub-ticket-status { color: #6660d5; font-size: 9px; background: #f0efff; padding: 6px 9px; border-radius: 5px; }
.sub-workflow-stage-right h3 { font-size: 18px; margin-bottom: 20px; }
.sub-workflow-stage-right dl { margin: 0; }
.sub-workflow-stage-right dl > div { display: flex; justify-content: space-between; gap: 15px; font-size: 10px; line-height: 1.8; padding: 9px 0; border-bottom: 1px solid #ededf2; }
.sub-workflow-stage-right dt { color: #92909d; white-space: nowrap; }
.sub-workflow-stage-right dd { margin: 0; text-align: right; }
.sub-ticket-activity { display: flex; gap: 12px; align-items: flex-start; padding-top: 20px; }
.sub-activity-dot { width: 7px; height: 7px; border-radius: 50%; margin-top: 7px; background: #7470e7; }
.sub-ticket-activity b { font-size: 9px; font-weight: 600; }
.sub-ticket-activity p { font-size: 10px; color: var(--muted); margin-bottom: 0; line-height: 1.8; }
.sub-ticket-watermark { position: absolute; right: 15px; bottom: 12px; color: #bbb9c8; font-size: 7px; letter-spacing: .13em; }
.sub-workflow-controls { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #dbdaec; padding: 19px 0 15px; gap: 15px; }
.sub-workflow-play { display: inline-flex; align-items: center; gap: 10px; font-size: 11px; background: var(--ink); color: white !important; border: none; border-radius: 100px; padding: 12px 18px; cursor: pointer; }
.sub-workflow-play .sub-icon { width: 16px; height: 16px; }
.sub-workflow-position { font-size: 11px; letter-spacing: .1em; color: #aaa5c1; }
.sub-workflow-position b { color: #6860b3; font-weight: 550; }
.sub-workflow-caption { font-size: 9px; color: #928da7; margin: 0; }
.sub-flow-steps { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.sub-flow-step { position: relative; text-align: left; padding: 20px 16px 27px; border: 1px solid var(--line); border-radius: 13px; background: white; cursor: pointer; transition: border-color .2s, background .2s, transform .2s; }
.sub-flow-step:hover { transform: translateY(-3px); border-color: #bcb8fb; }
.sub-flow-step.is-current { background: #efeeff; border-color: #aaa4ff; }
.sub-flow-step-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 23px; gap: 5px; }
.sub-flow-step-top > span:first-child { font-size: 10px; color: #aaa6b8; }
.sub-role-label { font-size: 8px; padding: 5px 7px; border-radius: 20px; color: #6862cf; background: #e9e7ff; white-space: nowrap; }
.sub-role-label.is-human { color: #74737a; background: #eeeef0; }
.sub-flow-step strong { display: block; font-size: 14px; font-weight: 650; line-height: 1.7; margin-bottom: 12px; letter-spacing: -.03em; }
.sub-flow-step small { display: block; font-size: 10px; color: var(--muted); line-height: 1.9; }
.sub-flow-track { position: absolute; bottom: 11px; height: 2px; left: 16px; right: 16px; background: #eae8f1; border-radius: 4px; }
.is-current .sub-flow-track { background: var(--accent); }
.is-done .sub-flow-track { background: #b7b1ed; }
.sub-role-detail { display: grid; grid-template-columns: 1fr 1fr; margin-top: 30px; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.sub-role-detail > div { display: flex; align-items: center; gap: 16px; padding: 26px; }
.sub-role-detail > div:first-child { border-right: 1px solid var(--line); }
.sub-role-icon { width: 42px; height: 42px; display: grid; place-items: center; color: var(--accent); background: var(--lavender); border-radius: 11px; flex-shrink: 0; }
.sub-role-icon > .sub-icon { width: 21px; height: 21px; }
.sub-role-icon.is-human { background: #f2f2f3; color: #777780; }
.sub-role-detail small { display: block; font-size: 10px; color: var(--muted); margin-bottom: 7px; }
.sub-role-detail strong { display: block; font-size: 12px; font-weight: 550; line-height: 1.8; }
.sub-exception-section { display: grid; grid-template-columns: 1fr 1fr; gap: 90px; padding-top: 85px; padding-bottom: 85px; align-items: center; }
.sub-exception-section h2 { font-size: 33px; }
.sub-exception-section > div > p { font-size: 14px; color: var(--muted); margin-bottom: 0; }
.sub-exception-list article { display: flex; gap: 22px; border-bottom: 1px solid var(--line); padding: 24px 0; }
.sub-exception-list article:first-child { padding-top: 0; }
.sub-exception-list article:last-child { border-bottom: none; padding-bottom: 0; }
.sub-exception-list article > span { color: var(--accent); font-size: 10px; padding-top: 4px; }
.sub-exception-list h3 { font-size: 16px; margin-bottom: 10px; }
.sub-exception-list p { color: var(--muted); font-size: 12px; margin-bottom: 0; }
.sub-integration-section { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.sub-integration-section h2 { font-size: 33px; margin-bottom: 0; }
.sub-integration-section > div > p { color: var(--muted); font-size: 14px; }
.sub-integration-section > div > .sub-footnote { font-size: 10px; margin-bottom: 0; }
.sub-integration-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.sub-integration-tags > span { display: inline-flex; align-items: center; gap: 8px; font-size: 10px; padding: 10px 13px; border: 1px solid var(--line); background: white; border-radius: 7px; }
.sub-integration-tags .sub-icon { width: 15px; height: 15px; color: #96909f; }
.sub-price-intro { display: grid; grid-template-columns: 1.1fr 1fr; gap: 55px; background: white; border: 1px solid var(--line); border-radius: 28px; padding: 50px 55px; align-items: center; }
.sub-price-intro h2 { font-size: 34px; margin-top: 25px; margin-bottom: 20px; }
.sub-price-intro p { color: var(--muted); font-size: 13px; margin-bottom: 28px; }
.sub-price-visual { position: relative; display: flex; align-items: center; justify-content: center; gap: 17px; padding-bottom: 35px; }
.sub-price-visual > div { height: 155px; width: 155px; border: 1px solid #dcd9ff; border-radius: 50%; background: #f2f1ff; text-align: center; padding-top: 35px; }
.sub-price-visual > div:last-of-type { background: #f5f5f7; border-color: #e7e5ee; }
.sub-price-visual > div > span { display: block; font-size: 8px; letter-spacing: .1em; color: #928ab1; margin-bottom: 15px; }
.sub-price-visual strong { font-size: 36px; font-weight: 500; letter-spacing: -.07em; }
.sub-price-plus { font-size: 22px; font-weight: 300; color: #aaa5bc; }
.sub-price-visual-caption { position: absolute; bottom: 0; font-size: 11px; color: #9993ab; }
.sub-cost-list { border-top: 1px solid var(--line); }
.sub-cost-list article { display: grid; grid-template-columns: 45px 1fr 1.4fr 1fr; gap: 25px; align-items: center; border-bottom: 1px solid var(--line); padding: 29px 0; }
.sub-cost-number { font-size: 11px; color: var(--accent); }
.sub-cost-list h3 { font-size: 18px; margin-bottom: 0; }
.sub-cost-list p { font-size: 12px; color: var(--muted); margin-bottom: 0; }
.sub-cost-detail { font-size: 10px; line-height: 1.9; color: #8e8a9b; border-left: 1px solid var(--line); padding-left: 25px; }
.sub-faq-section { display: grid; grid-template-columns: .7fr 1.3fr; gap: 65px; align-items: start; }
.sub-faq-section h2 { font-size: 30px; }
.sub-faq-list { border-top: 1px solid var(--line); }
.sub-faq-list > details { border-bottom: 1px solid var(--line); padding: 22px 0; }
.sub-faq-list summary { display: flex; align-items: flex-start; gap: 17px; list-style: none; cursor: pointer; font-size: 13px; font-weight: 550; line-height: 1.9; }
.sub-faq-list summary::-webkit-details-marker { display: none; }
.sub-faq-q { color: var(--accent); font-size: 12px; }
.sub-faq-list summary > span:nth-child(2) { flex: 1; }
.sub-faq-list summary > .sub-icon { width: 17px; height: 17px; margin-top: 3px; transition: transform .2s; }
.sub-faq-list details[open] summary > .sub-icon { transform: rotate(45deg); }
.sub-faq-list details > div { padding: 17px 27px 0 32px; }
.sub-faq-list details p { color: var(--muted); font-size: 12px; margin: 0; line-height: 2; }
.sub-form-layout { display: grid; grid-template-columns: .9fr 1fr; gap: 95px; align-items: start; padding-top: 65px; padding-bottom: 90px; }
.sub-form-intro h1 { font-size: clamp(34px, 3.4vw, 47px); line-height: 1.5; letter-spacing: -.055em; margin-bottom: 25px; }
.sub-form-intro > .sub-lead { font-size: 14px; }
.sub-form-panel { background: white; padding: 37px 38px 33px; border-radius: 24px; border: 1px solid var(--line); }
.sub-form-panel-head { padding-bottom: 27px; margin-bottom: 27px; border-bottom: 1px solid var(--line); }
.sub-form-panel-head > .sub-tag { margin-bottom: 21px; font-size: 9px; }
.sub-form-panel-head h2 { font-size: 21px; line-height: 1.7; margin-bottom: 10px; }
.sub-form-panel-head p { font-size: 11px; color: var(--muted); margin: 0; line-height: 1.8; }
.sub-form-panel-head p > .sub-required { margin-left: 0; }
.sub-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 17px; }
.sub-field { min-width: 0; }
.sub-field-wide { grid-column: 1 / -1; }
.sub-field > label, .sub-fieldset > legend { display: flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 550; margin-bottom: 10px; line-height: 1.6; }
.sub-required { display: inline-block; font-size: 8px; letter-spacing: .01em; background: #f0eeff; color: #716aca; border-radius: 3px; padding: 2px 5px; vertical-align: middle; margin-left: 5px; font-weight: 500; white-space: nowrap; }
.sub-optional { display: inline-block; font-size: 8px; color: #a1a0ab; margin-left: 5px; font-weight: 400; white-space: nowrap; }
.sub-field input, .sub-field select, .sub-field textarea { appearance: none; width: 100%; border: 1px solid #dbdae2; border-radius: 8px; background: #fafafb; padding: 14px; min-height: 47px; color: var(--ink); font-size: 12px; line-height: 1.5; outline-offset: 2px; transition: border-color .2s, background .2s; }
.sub-field input:focus, .sub-field select:focus, .sub-field textarea:focus { border-color: #9690ec; background: white; }
.sub-field input::placeholder, .sub-field textarea::placeholder { color: #b3b0bd; opacity: 1; }
.sub-field select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238a8799' stroke-width='1.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 13px center; padding-right: 35px; cursor: pointer; }
.sub-field select:required:invalid { color: #a7a3b2; }
.sub-field textarea { min-height: 145px; resize: vertical; line-height: 1.85; }
.sub-field-help { font-size: 10px; color: #97929f; margin: 8px 0 0; }
.sub-fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.sub-choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.sub-choice { display: flex; align-items: center; gap: 9px; padding: 10px 12px; background: #fafafb; border: 1px solid var(--line); border-radius: 7px; cursor: pointer; font-size: 10px; line-height: 1.8; }
.sub-choice:has(input:checked) { background: #f4f2ff; border-color: #c1bbf8; }
.sub-choice input, .sub-privacy-check input { appearance: auto; accent-color: var(--accent); height: 14px; width: 14px; margin: 0; flex-shrink: 0; cursor: pointer; }
.sub-privacy-check { display: flex; align-items: flex-start; gap: 10px; font-size: 10px; line-height: 2; color: var(--muted); margin: 28px 0 23px; cursor: pointer; }
.sub-privacy-check input { margin-top: 4px; }
.sub-privacy-check a { text-decoration: underline; text-underline-offset: 3px; color: #625bc9; }
.sub-privacy-check > span { flex: 1; }
.sub-submit { width: 100%; border: none; cursor: pointer; }
.sub-submit .sub-icon { margin-left: auto; }
.sub-form-preview-note { display: flex; align-items: flex-start; gap: 8px; font-size: 9px; color: #96909f; line-height: 1.9; margin: 16px 0 0; }
.sub-form-preview-note > .sub-icon { width: 13px; height: 13px; margin-top: 2px; }
.sub-form-error { font-size: 12px; color: #c2342f; margin: 10px 0 0; min-height: 1em; }
.sub-form-error:empty { margin: 0; }
.sub-deck-cover { background: #e6e4ff; position: relative; display: flex; flex-direction: column; margin-top: 35px; min-height: 350px; padding: 26px 29px 22px; border-radius: 4px 13px 13px 4px; box-shadow: -6px 0 0 #d2cef3, 0 16px 35px #39306e0c; overflow: hidden; border: 1px solid #d7d3f5; transform: rotate(-1.5deg); }
.sub-deck-cover::before { content: ""; position: absolute; inset: 0 auto 0 7px; width: 1px; background: rgba(139, 125, 195, .15); }
.sub-deck-brand { display: flex; align-items: center; font-family: Inter, sans-serif; font-size: 17px; letter-spacing: -.07em; }
.sub-deck-brand b { font-weight: 500; margin-left: 6px; }
.sub-deck-brand-mark { margin-left: auto; width: 24px; height: 24px; display: grid; place-items: center; color: #6b62ba; border: 1px solid #c3bced; border-radius: 50%; }
.sub-deck-brand-mark .sub-icon { height: 12px; width: 12px; }
.sub-deck-title { position: relative; z-index: 1; margin-top: 37px; }
.sub-deck-title > span { font-size: 8px; letter-spacing: .12em; color: #756d93; }
.sub-deck-title > h2 { font-size: 32px; line-height: 1.5; letter-spacing: -.06em; margin: 14px 0 12px; }
.sub-deck-title > p { font-size: 10px; color: #827697; margin-bottom: 0; }
.sub-deck-graphic { position: absolute; width: 160px; height: 190px; display: flex; justify-content: center; align-items: center; gap: 5px; top: 110px; right: -20px; transform: rotate(22deg); opacity: .4; }
.sub-deck-graphic > span { width: 9px; height: 40px; border-radius: 8px; background: #a99beb; }
.sub-deck-graphic > span:nth-child(2), .sub-deck-graphic > span:nth-child(10) { height: 70px; }
.sub-deck-graphic > span:nth-child(3), .sub-deck-graphic > span:nth-child(9) { height: 100px; }
.sub-deck-graphic > span:nth-child(4), .sub-deck-graphic > span:nth-child(8) { height: 125px; }
.sub-deck-graphic > span:nth-child(5), .sub-deck-graphic > span:nth-child(7) { height: 155px; }
.sub-deck-graphic > span:nth-child(6) { height: 180px; }
.sub-deck-footer { display: flex; justify-content: space-between; gap: 10px; padding-top: 35px; margin-top: auto; align-items: center; color: #958aad; }
.sub-deck-footer > span { font-size: 7px; letter-spacing: .1em; }
.sub-deck-footer > b { font-size: 7px; letter-spacing: .1em; font-weight: 500; border: 1px solid #c8c1e4; padding: 4px 6px; border-radius: 3px; }
.sub-asset-note { font-size: 9px; color: #aaa2b6; margin: 18px 0 0; }
.sub-guide-contents { margin-top: 35px; padding-top: 25px; border-top: 1px solid var(--line); }
.sub-guide-contents h3 { font-size: 13px; margin-bottom: 15px; }
.sub-guide-contents ul { list-style: none; padding: 0; margin: 0; }
.sub-guide-contents li { display: flex; align-items: center; gap: 12px; font-size: 12px; color: var(--muted); padding: 7px 0; }
.sub-guide-contents .sub-icon { width: 15px; height: 15px; color: var(--accent); }
.sub-form-bottom { display: flex; align-items: center; justify-content: center; gap: 25px; padding-top: 28px; padding-bottom: 50px; border-top: 1px solid var(--line); }
.sub-form-bottom p { font-size: 12px; color: var(--muted); margin-bottom: 0; }
.sub-contact-layout { grid-template-columns: .8fr 1.2fr; gap: 80px; }
.sub-contact-layout .sub-form-intro { position: sticky; top: 110px; }
.sub-contact-layout .sub-form-intro h1 { font-size: 42px; }
.sub-contact-points { margin-top: 46px; }
.sub-contact-points h2 { font-size: 13px; letter-spacing: -.01em; margin-bottom: 20px; }
.sub-contact-points ul { padding: 0; list-style: none; margin: 0; }
.sub-contact-points li { display: flex; align-items: center; gap: 13px; font-size: 12px; color: var(--muted); padding: 12px 0; line-height: 1.8; }
.sub-contact-points .sub-icon { width: 18px; height: 18px; color: #9288c7; }
.sub-contact-guide { display: flex; gap: 17px; align-items: center; border-top: 1px solid var(--line); padding-top: 26px; margin-top: 35px; }
.sub-guide-mini-icon { width: 45px; height: 57px; background: #e8e4f8; border: 1px solid #d9d2ec; display: grid; place-items: center; border-radius: 4px; color: #988ab7; }
.sub-guide-mini-icon .sub-icon { width: 20px; height: 20px; }
.sub-contact-guide p { font-size: 10px; color: var(--muted); margin-bottom: 5px; }
.sub-contact-guide .sub-text-link { font-size: 12px; }
.sub-complete { padding-top: 66px; padding-bottom: 90px; text-align: center; max-width: 920px !important; }
.sub-complete-icon { width: 60px; height: 60px; display: grid; place-items: center; border-radius: 50%; background: #e8e5ff; color: #7061e4; margin: 0 auto 27px; }
.sub-complete-icon .sub-icon { width: 25px; height: 25px; }
.sub-complete > .sub-eyebrow { color: #8c80af; font-size: 10px; margin-bottom: 18px; }
.sub-complete > h1 { font-size: 41px; line-height: 1.5; margin-bottom: 20px; }
.sub-complete > .sub-lead { margin: 0 auto; font-size: 14px; }
.sub-download-ready { background: white; border: 1px solid var(--line); border-radius: 24px; padding: 36px 45px; margin: 45px auto 23px; display: grid; grid-template-columns: .82fr 1fr; gap: 48px; align-items: center; text-align: left; }
.sub-deck-cover.is-small { margin: 0; min-height: 260px; padding: 20px 21px 17px; }
.is-small .sub-deck-brand { font-size: 12px; }
.is-small .sub-deck-brand-mark { width: 18px; height: 18px; }
.is-small .sub-deck-brand-mark .sub-icon { height: 10px; width: 10px; }
.is-small .sub-deck-title { margin-top: 30px; }
.is-small .sub-deck-title > span { font-size: 6px; }
.is-small .sub-deck-title > h2 { font-size: 22px; margin: 10px 0 10px; }
.is-small .sub-deck-title > p { font-size: 7px; }
.is-small .sub-deck-graphic { transform: scale(.75) rotate(22deg); right: -38px; top: 70px; }
.is-small .sub-deck-footer { padding-top: 26px; }
.is-small .sub-deck-footer > span { font-size: 5px; letter-spacing: .05em; }
.is-small .sub-deck-footer > b { font-size: 5px; padding: 3px 4px; }
.sub-download-ready > div:last-child > .sub-tag { font-size: 8px; }
.sub-download-ready h2 { font-size: 22px; line-height: 1.7; margin-top: 20px; margin-bottom: 14px; }
.sub-download-ready p { color: var(--muted); font-size: 11px; margin-bottom: 23px; }
.sub-download-ready .btn { font-size: 12px; min-height: 49px; }
.sub-complete-note { display: flex; justify-content: center; align-items: flex-start; gap: 8px; font-size: 10px; color: #948b9e; margin: 0 auto 40px; }
.sub-complete-note .sub-icon { width: 14px; height: 14px; margin-top: 3px; }
.sub-complete-next { border-top: 1px solid var(--line); padding-top: 38px; margin-top: 45px; }
.sub-complete-next h2 { font-size: 23px; margin-bottom: 13px; }
.sub-complete-next p { color: var(--muted); font-size: 12px; margin-bottom: 0; }
.sub-complete-next .sub-inline-actions { justify-content: center; margin-top: 24px; gap: 12px; }
.sub-complete-next .btn { min-height: 50px; font-size: 12px; }
.sub-complete-info { text-align: left; padding: 27px 30px; background: #eeebfc; border: 1px solid #e1daf7; border-radius: 17px; display: flex; align-items: flex-start; gap: 15px; margin-top: 38px; }
.sub-complete-info > .sub-icon { width: 20px; height: 20px; color: #8975c6; margin-top: 3px; }
.sub-complete-info h2 { font-size: 15px; line-height: 1.8; letter-spacing: -.02em; margin-bottom: 10px; }
.sub-complete-info p { font-size: 12px; line-height: 1.9; color: #8b7e9d; margin-bottom: 0; }
.sub-back-link { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; margin-top: 28px; color: var(--muted) !important; font-size: 11px; }
.sub-back-link .sub-icon { height: 16px; width: 16px; }
.sub-legal-hero h1 { font-size: 42px; }
.sub-legal-draft { display: flex; align-items: flex-start; gap: 15px; padding: 23px 27px; background: #eeebf8; border: 1px solid #e2ddee; border-radius: 12px; margin-top: 37px; max-width: 850px; }
.sub-legal-draft > .sub-icon { width: 19px; height: 19px; color: #90809e; margin-top: 1px; }
.sub-legal-draft strong { font-size: 12px; font-weight: 550; color: #776886; }
.sub-legal-draft p { font-size: 11px; color: #8d8198; line-height: 1.9; margin: 7px 0 0; }
.sub-legal-layout { display: grid; grid-template-columns: 245px 1fr; gap: 85px; align-items: start; }
.sub-legal-toc { position: sticky; top: 110px; padding-top: 7px; padding-bottom: 25px; }
.sub-legal-toc > span { display: block; font-size: 9px; letter-spacing: .14em; color: #9a90a4; margin-bottom: 20px; }
.sub-legal-toc ol { list-style: none; padding: 0; margin: 0; counter-reset: toc; }
.sub-legal-toc li { display: flex; gap: 12px; padding: 8px 0; counter-increment: toc; }
.sub-legal-toc li::before { content: counter(toc, decimal-leading-zero); font-size: 9px; color: #b0a6b8; padding-top: 4px; }
.sub-legal-toc a { font-size: 11px; color: #8a7f94; text-decoration: none; line-height: 1.8; }
.sub-legal-toc a:hover { color: var(--accent); }
.sub-legal-article { min-width: 0; }
.sub-legal-intro { font-size: 13px; color: var(--muted); line-height: 2.1 !important; margin-bottom: 45px; padding-bottom: 35px; border-bottom: 1px solid var(--line); }
.sub-legal-article > section { margin-bottom: 40px; scroll-margin-top: 110px; }
.sub-legal-article h2 { font-size: 20px; display: flex; align-items: baseline; gap: 15px; margin-bottom: 17px; line-height: 1.7; letter-spacing: -.02em; }
.sub-legal-article h2 > span { font-size: 10px; color: #a092b3; letter-spacing: .03em; }
.sub-legal-article section > p { font-size: 12px; color: var(--muted); line-height: 2.1; margin-bottom: 14px; overflow-wrap: anywhere; }
.sub-legal-end { border-top: 1px solid var(--line); padding-top: 25px; color: #a295ae; font-size: 11px; text-align: right; margin-bottom: 45px; }
.sub-legal-end p { margin-bottom: 6px; }
.sub-legal-contact { display: flex; align-items: center; justify-content: space-between; gap: 30px; background: white; border: 1px solid var(--line); border-radius: 20px; padding: 35px 40px; margin-top: 25px; margin-bottom: 80px; }
.sub-legal-contact h2 { font-size: 21px; margin-bottom: 12px; }
.sub-legal-contact p { font-size: 12px; color: var(--muted); margin: 0; }
.sub-demo-summary { display: flex; align-items: center; gap: 42px; background: #eeebfb; border: 1px solid #e1daf5; border-radius: 24px; padding: 44px 50px; }
.sub-summary-icon { height: 95px; width: 95px; border-radius: 26px; background: #e3dcfa; display: grid; place-items: center; color: #9680cd; flex-shrink: 0; }
.sub-summary-icon > .sub-icon { width: 43px; height: 43px; stroke-width: 1.2; }
.sub-demo-summary .sub-tag { font-size: 8px; background: #e3dcf7; color: #8c76ac; margin-bottom: 19px; }
.sub-demo-summary h2 { font-size: 29px; margin-bottom: 15px; }
.sub-demo-summary p { color: #9a89a5; font-size: 12px; margin-bottom: 0; }
.sub-data-list { max-width: 980px !important; }
.sub-data-list > article { display: flex; align-items: flex-start; gap: 32px; border-bottom: 1px solid var(--line); padding: 30px 0; }
.sub-data-list > article:first-child { border-top: 1px solid var(--line); }
.sub-data-icon { width: 40px; height: 40px; display: grid; place-items: center; background: #eee9f8; color: #9585b1; border-radius: 11px; flex-shrink: 0; margin-top: 6px; }
.sub-data-icon .sub-icon { width: 21px; height: 21px; stroke-width: 1.4; }
.sub-data-number { color: #b5a5c0; font-size: 9px; letter-spacing: .05em; }
.sub-data-list h2 { font-size: 20px; margin: 7px 0 13px; }
.sub-data-list p { font-size: 13px; color: var(--muted); margin: 0; }
.sub-data-note { padding: 0 0 70px; max-width: 980px !important; }
.sub-data-note h2 { font-size: 18px; margin-bottom: 17px; }
.sub-data-note p { font-size: 12px; color: var(--muted); margin-bottom: 20px; }
@keyframes sub-wave { from { transform: scaleY(.65); } to { transform: scaleY(1.2); } }
@media (min-width: 1500px) {
  .sub-detail-hero { gap: 90px; }
  .sub-form-layout { gap: 110px; }
}
@media (max-width: 1150px) {
  .sub-detail-hero { gap: 40px; }
  .sub-detail-hero h1 { font-size: 39px; }
  .sub-detail-visual { min-height: 410px; padding: 23px; }
  .sub-visual-main { gap: 12px; padding: 25px 12px; }
  .sub-visual-main > span { font-size: 20px; }
  .sub-audio-section { gap: 50px; }
  .sub-capability-overview { gap: 12px; }
  .sub-capability-overview > a { gap: 12px; padding: 22px 18px; }
  .sub-overview-icon { height: 40px; width: 40px; }
  .sub-capability-overview b { font-size: 15px; }
  .sub-feature-row { grid-template-columns: 25px 1fr 1.1fr; gap: 27px; }
  .sub-feature-row-heading h2 { font-size: 23px; }
  .sub-workflow-stage { gap: 40px; padding: 30px 15px; }
  .sub-flow-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .sub-flow-step { padding: 22px 20px 28px; }
  .sub-flow-step strong { font-size: 15px; }
  .sub-flow-step small { font-size: 11px; }
  .sub-flow-step-top { margin-bottom: 15px; }
  .sub-price-intro { gap: 30px; padding: 40px; }
  .sub-price-visual { gap: 10px; }
  .sub-price-visual > div { height: 130px; width: 130px; padding-top: 30px; }
  .sub-price-visual > div > span { font-size: 6px; margin-bottom: 12px; }
  .sub-price-visual strong { font-size: 29px; }
  .sub-price-intro h2 { font-size: 30px; }
  .sub-form-layout { gap: 55px; }
  .sub-contact-layout { gap: 45px; grid-template-columns: .8fr 1.2fr; }
  .sub-form-panel { padding: 30px; }
  .sub-form-intro h1 { font-size: 38px; }
  .sub-contact-layout .sub-form-intro h1 { font-size: 36px; }
  .sub-choice-grid { grid-template-columns: 1fr; }
  .sub-legal-layout { grid-template-columns: 210px 1fr; gap: 50px; }
  .sub-cost-list article { gap: 19px; grid-template-columns: 30px 1fr 1.3fr 1fr; }
  .sub-cost-list h3 { font-size: 16px; }
}
@media (max-width: 900px) {
  .sub-hero { padding-top: 50px; padding-bottom: 55px; }
  .sub-hero h1 { font-size: 47px; }
  .sub-cta-inner { grid-template-columns: 1.3fr 1fr; gap: 30px; }
  .sub-cta h2 { font-size: 34px; }
  .sub-cta-actions { width: 245px; }
  .sub-scenario-card { padding: 25px 26px 0; }
  .sub-scenario-card h3 { font-size: 20px; }
  .sub-scenario-card > p { font-size: 12px; }
  .sub-scenario-card-bottom { align-items: flex-start; }
  .sub-scenario-card-bottom > .sub-icon { margin-top: 3px; }
  .sub-beyond { gap: 45px; }
  .sub-beyond h2 { font-size: 32px; }
  .sub-detail-hero { grid-template-columns: 1fr; gap: 35px; }
  .sub-detail-hero h1 { max-width: 650px; font-size: 43px; }
  .sub-detail-hero .sub-lead { max-width: 630px; }
  .sub-detail-visual { min-height: 350px; max-width: none; }
  .sub-call-chip { position: absolute; top: 25px; left: 25px; }
  .sub-visual-main { margin-top: 0; padding: 20px 15px; }
  .sub-result-preview { max-width: 340px; }
  .sub-challenges { gap: 50px; }
  .sub-challenges h2 { font-size: 26px; }
  .sub-challenges li { font-size: 12px; }
  .sub-audio-section { grid-template-columns: 1fr 1.15fr; gap: 35px; }
  .sub-audio-intro h2 { font-size: 29px; }
  .sub-audio-player { padding: 23px; }
  .sub-player-meta { font-size: 8px; }
  .sub-player-controls { gap: 12px; }
  .sub-play-control { height: 40px; width: 40px; }
  .sub-process-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 35px; }
  .sub-benefit-section { gap: 40px; }
  .sub-benefit-section h2 { font-size: 29px; }
  .sub-benefit-list > div > p { font-size: 12px; }
  .sub-capability-overview { grid-template-columns: 1fr; gap: 12px; }
  .sub-capability-overview > a { padding: 20px 25px; }
  .sub-capability-overview b { font-size: 17px; margin-bottom: 4px; }
  .sub-capability-overview small { font-size: 11px; }
  .sub-capability-overview > a > .sub-icon { margin-right: 5px; }
  .sub-feature-row { grid-template-columns: 20px 1fr 1fr; gap: 24px; padding: 35px 0; }
  .sub-feature-row-heading h2 { font-size: 22px; }
  .sub-feature-row-body p { font-size: 12px; }
  .sub-feature-label { display: block; margin: 0 0 15px; }
  .sub-feature-icon { margin-bottom: 16px; }
  .sub-dark-band-inner { gap: 50px; }
  .sub-dark-band h2 { font-size: 34px; }
  .sub-workflow-preview { padding: 25px; }
  .sub-workflow-preview-top { gap: 10px; flex-wrap: wrap; }
  .sub-workflow-preview-top > span:nth-child(2) { font-size: 10px; }
  .sub-workflow-preview-top > .sub-placeholder-label { font-size: 8px; }
  .sub-workflow-stage { gap: 25px; padding: 28px 0; grid-template-columns: 1fr 1fr; }
  .sub-stage-voice { gap: 15px; }
  .sub-stage-wave { gap: 3px; }
  .sub-stage-wave > i { width: 2px; }
  .sub-voice-monogram { height: 55px; width: 55px; font-size: 24px; }
  .sub-voice-monogram > span { font-size: 18px; padding-bottom: 14px; }
  .sub-workflow-stage-left > p { font-size: 12px; }
  .sub-workflow-stage-right { padding: 20px 18px 30px; }
  .sub-workflow-stage-right h3 { font-size: 15px; }
  .sub-workflow-stage-right dl > div { font-size: 9px; }
  .sub-ticket-activity p { font-size: 9px; }
  .sub-role-detail > div { padding: 20px; gap: 13px; }
  .sub-role-detail strong { font-size: 11px; }
  .sub-exception-section, .sub-integration-section { gap: 45px; }
  .sub-exception-section h2, .sub-integration-section h2 { font-size: 29px; }
  .sub-price-intro { grid-template-columns: 1fr; gap: 35px; }
  .sub-price-visual { justify-content: flex-start; }
  .sub-price-visual-caption { left: 35px; }
  .sub-cost-list article { grid-template-columns: 30px 1fr 1.5fr; gap: 16px; }
  .sub-cost-detail { grid-column: 3; border-left: 0; padding-left: 0; margin-top: -7px; }
  .sub-cost-list h3 { align-self: start; padding-top: 3px; }
  .sub-faq-section { grid-template-columns: 1fr; gap: 22px; }
  .sub-form-layout { gap: 35px; grid-template-columns: .8fr 1fr; }
  .sub-form-intro h1, .sub-contact-layout .sub-form-intro h1 { font-size: 30px; }
  .sub-form-intro > .sub-lead { font-size: 12px; }
  .sub-form-panel { padding: 27px 23px; }
  .sub-form-panel-head h2 { font-size: 18px; }
  .sub-form-grid { gap: 19px 12px; }
  .sub-field > label, .sub-fieldset > legend { font-size: 11px; }
  .sub-field input, .sub-field select, .sub-field textarea { padding: 12px; font-size: 11px; }
  .sub-field select { padding-right: 32px; }
  .sub-submit { font-size: 12px !important; padding: 13px 20px !important; gap: 10px !important; }
  .sub-deck-cover { padding: 20px 21px 18px; min-height: 300px; }
  .sub-deck-brand { font-size: 14px; }
  .sub-deck-title h2 { font-size: 26px; }
  .sub-deck-title p { font-size: 8px; }
  .sub-deck-graphic { right: -45px; opacity: .3; transform: scale(.85) rotate(22deg); }
  .sub-deck-footer > span { font-size: 5px; letter-spacing: .04em; }
  .sub-deck-footer > b { font-size: 5px; }
  .sub-guide-contents li { font-size: 10px; gap: 8px; }
  .sub-contact-points li { font-size: 11px; gap: 10px; }
  .sub-contact-points h2 { font-size: 12px; }
  .sub-legal-layout { grid-template-columns: 175px 1fr; gap: 35px; }
  .sub-legal-toc a { font-size: 10px; }
  .sub-legal-article h2 { font-size: 18px; }
  .sub-legal-article section > p { font-size: 11px; }
  .sub-legal-intro { font-size: 12px; }
  .sub-legal-contact { padding: 30px; }
}
@media (max-width: 680px) {
  .sub-breadcrumb { padding-top: 22px; font-size: 9px; gap: 6px; }
  .sub-breadcrumb .sub-icon { width: 8px; height: 8px; }
  .sub-hero { padding-top: 40px; padding-bottom: 42px; }
  .sub-eyebrow { font-size: 9px; margin-bottom: 20px; letter-spacing: .13em; }
  .sub-hero h1 { font-size: 35px; line-height: 1.45; margin-bottom: 23px; letter-spacing: -.055em; }
  .sub-lead { font-size: 12px; line-height: 2 !important; }
  .sub-page h2 { font-size: 27px; }
  .sub-page .btn { min-height: 50px; font-size: 12px; padding: 14px 22px; }
  .sub-page .btn .sub-icon { height: 16px; width: 16px; }
  .sub-section-title { margin-bottom: 32px; }
  .sub-section-title > p:last-child { font-size: 12px; }
  .sub-inline-actions { gap: 15px; margin-top: 25px; }
  .sub-text-link { font-size: 11px; gap: 12px; }
  .sub-text-link .sub-icon { width: 16px; height: 16px; }
  .sub-mobile-break { display: initial; }
  .sub-desktop-break { display: none; }
  .sub-cta-inner { grid-template-columns: 1fr; gap: 28px; padding-top: 0; padding-bottom: 0; }
  .sub-cta h2 { font-size: 29px; margin-bottom: 17px; }
  .sub-cta p:last-child { font-size: 12px; }
  .sub-cta-actions { justify-self: start; width: 100%; flex-direction: row; gap: 10px; }
  .sub-cta-actions .btn { padding: 13px 16px; font-size: 11px; flex: 1; gap: 10px; }
  .sub-cta-actions .btn .sub-icon { width: 14px; height: 14px; }
  .sub-filter-bar { padding-bottom: 22px; margin-bottom: 24px; gap: 10px; }
  .sub-filter-group { padding: 4px; gap: 0; }
  .sub-filter { padding: 10px 16px; font-size: 10px; }
  .sub-filter-count { font-size: 8px; letter-spacing: .08em; white-space: nowrap; }
  .sub-filter-count b { font-size: 11px; margin-right: 2px; }
  .sub-scenario-grid { grid-template-columns: 1fr; gap: 18px; }
  .sub-scenario-card { padding: 25px 27px 0; min-height: 295px; border-radius: 19px; }
  .sub-scenario-card .sub-tag { font-size: 9px; padding: 8px 11px; }
  .sub-card-number { font-size: 10px; }
  .sub-scenario-symbol { margin-top: 13px; margin-bottom: 10px; height: 45px; }
  .sub-scenario-symbol .sub-icon { width: 29px; height: 29px; }
  .sub-scenario-card h3 { font-size: 20px; margin-bottom: 12px; }
  .sub-scenario-card > p { font-size: 12px; margin-bottom: 23px; }
  .sub-scenario-card-bottom { padding: 18px 0; }
  .sub-scenario-card-bottom > span { font-size: 10px; }
  .sub-beyond { grid-template-columns: 1fr; gap: 25px; }
  .sub-beyond h2 { font-size: 29px; }
  .sub-beyond > div > p { font-size: 12px; line-height: 2; margin-bottom: 23px; }
  .sub-detail-hero { padding-top: 38px; gap: 32px; }
  .sub-detail-hero h1 { font-size: 31px; line-height: 1.55; margin-top: 18px; margin-bottom: 20px; }
  .sub-detail-hero .sub-lead { font-size: 12px; }
  .sub-hero-tags { gap: 10px; }
  .sub-hero-tags > span:last-child { font-size: 10px; }
  .sub-hero-tags .sub-tag { font-size: 9px; padding: 8px 10px; }
  .sub-detail-hero .sub-inline-actions { flex-direction: column; gap: 16px; margin-top: 25px; }
  .sub-detail-hero .sub-inline-actions .sub-text-link { padding-top: 0; }
  .sub-detail-visual { min-height: 350px; padding: 25px; border-radius: 21px; }
  .sub-call-chip { left: 20px; top: 20px; font-size: 9px; padding: 8px 11px; }
  .sub-visual-main { margin-top: 25px; padding: 17px 10px 20px; }
  .sub-visual-main > .sub-icon { height: 35px; width: 35px; }
  .sub-visual-main > span { font-size: 20px; }
  .sub-visual-label { font-size: 7px; margin-bottom: 16px; }
  .sub-result-preview { padding: 5px 17px; max-width: 310px; }
  .sub-result-preview > div { padding: 11px 0; font-size: 10px; }
  .sub-visual-caption { font-size: 8px; bottom: 12px; right: 17px; }
  .sub-challenges { grid-template-columns: 1fr; gap: 25px; padding-top: 45px; padding-bottom: 43px; }
  .sub-challenges h2 { font-size: 26px; }
  .sub-challenges li { font-size: 12px; padding: 14px 0; gap: 13px; }
  .sub-audio-section { grid-template-columns: 1fr; gap: 28px; }
  .sub-audio-intro { padding-top: 0; }
  .sub-audio-intro h2 { font-size: 27px; margin-bottom: 15px; }
  .sub-audio-intro > p { font-size: 12px; }
  .sub-preview-note { font-size: 10px; margin-top: 22px; }
  .sub-audio-player { padding: 24px; border-radius: 20px; }
  .sub-audio-player h3 { font-size: 18px; }
  .sub-player-top { margin-bottom: 19px; }
  .sub-player-top .sub-tag { font-size: 9px; }
  .sub-player-type { font-size: 7px; }
  .sub-waveform { height: 72px; }
  .sub-waveform span { width: 2px; min-width: 1px; }
  .sub-player-controls { gap: 13px; }
  .sub-play-control { height: 42px; width: 42px; }
  .sub-player-meta { font-size: 8px; }
  .sub-transcript { margin-top: 22px; }
  .sub-chat-line p { font-size: 10px; }
  .sub-transcript-lines { max-height: 280px; }
  .sub-process-grid { gap: 29px 24px; }
  .sub-process-step { padding-top: 20px; }
  .sub-step-number { margin-bottom: 17px; font-size: 10px; }
  .sub-process-step h3 { font-size: 15px; margin-bottom: 10px; }
  .sub-process-step p { font-size: 11px; }
  .sub-footnote { font-size: 9px; margin-top: 23px; }
  .sub-benefit-section { grid-template-columns: 1fr; gap: 25px; }
  .sub-benefit-section h2 { font-size: 27px; margin-bottom: 0; }
  .sub-benefit-list > div { padding: 20px 0; gap: 15px; }
  .sub-benefit-list > div > p { font-size: 12px; }
  .sub-related { padding-top: 0 !important; }
  .sub-heading-line { flex-direction: column; align-items: flex-start; gap: 18px; margin-bottom: 25px; }
  .sub-heading-line h2 { font-size: 26px; }
  .sub-heading-line .sub-eyebrow { margin-bottom: 14px; }
  .sub-heading-line > .sub-text-link { padding-bottom: 0; }
  .sub-capability-overview { gap: 11px; }
  .sub-capability-overview > a { gap: 16px; padding: 20px; border-radius: 14px; }
  .sub-capability-overview b { font-size: 16px; }
  .sub-capability-overview small { font-size: 10px; }
  .sub-feature-row { grid-template-columns: 22px 1fr; gap: 0 18px; padding: 30px 0; }
  .sub-feature-number { grid-row: 1 / 3; padding-top: 4px; font-size: 10px; }
  .sub-feature-row-heading h2 { font-size: 22px; margin-bottom: 20px; }
  .sub-feature-icon { margin-bottom: 16px; }
  .sub-feature-icon > .sub-icon { width: 24px; height: 24px; }
  .sub-feature-label { display: inline; font-size: 8px; margin-left: 10px; }
  .sub-feature-row-body { grid-column: 2; padding-top: 0; }
  .sub-feature-row-body p { font-size: 12px; margin-bottom: 17px; }
  .sub-pill-list { gap: 6px; }
  .sub-pill-list > span { padding: 6px 10px; font-size: 9px; }
  .sub-dark-band { padding: 55px 0; }
  .sub-dark-band-inner { grid-template-columns: 1fr; gap: 25px; }
  .sub-dark-band h2 { font-size: 29px; }
  .sub-dark-band-inner > div > p { font-size: 12px; margin-bottom: 23px; }
  .sub-workflow-preview { padding: 20px; border-radius: 19px; }
  .sub-workflow-preview-top { gap: 10px 8px; padding-bottom: 18px; align-items: center; }
  .sub-workflow-preview-top > .sub-tag { font-size: 8px; padding: 7px 9px; }
  .sub-workflow-preview-top > span:nth-child(2) { order: 3; flex-basis: 100%; font-size: 10px; }
  .sub-workflow-preview-top > .sub-placeholder-label { margin-left: auto; font-size: 7px; padding: 4px 7px; }
  .sub-workflow-stage { grid-template-columns: 1fr; padding: 22px 0; gap: 24px; min-height: 0; }
  .sub-stage-heading { font-size: 10px; margin-bottom: 18px; }
  .sub-stage-voice { gap: 23px; margin-bottom: 15px; }
  .sub-stage-wave { gap: 4px; }
  .sub-stage-wave > i { width: 3px; }
  .sub-workflow-stage-left > p { min-height: 64px; margin-bottom: 9px; font-size: 12px; }
  .sub-stage-example-label { font-size: 8px; }
  .sub-workflow-stage-right { transform: rotate(.6deg); padding: 21px 23px 28px; }
  .sub-ticket-head { margin-bottom: 17px; }
  .sub-workflow-stage-right h3 { font-size: 16px; margin-bottom: 14px; }
  .sub-workflow-stage-right dl > div { font-size: 10px; padding: 8px 0; }
  .sub-ticket-activity { padding-top: 16px; }
  .sub-ticket-activity p { font-size: 10px; }
  .sub-workflow-controls { padding-top: 15px; padding-bottom: 12px; }
  .sub-workflow-play { font-size: 9px; padding: 10px 13px; gap: 8px; }
  .sub-workflow-play .sub-icon { width: 14px; height: 14px; }
  .sub-workflow-position { font-size: 9px; white-space: nowrap; }
  .sub-workflow-caption { font-size: 8px; }
  .sub-flow-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .sub-flow-step { padding: 16px 15px 25px; border-radius: 12px; }
  .sub-flow-step-top { margin-bottom: 18px; }
  .sub-flow-step strong { font-size: 13px; margin-bottom: 8px; }
  .sub-flow-step small { font-size: 10px; }
  .sub-role-detail { grid-template-columns: 1fr; margin-top: 22px; border-radius: 13px; }
  .sub-role-detail > div { padding: 20px; gap: 15px; }
  .sub-role-detail > div:first-child { border-right: none; border-bottom: 1px solid var(--line); }
  .sub-role-detail small { font-size: 9px; }
  .sub-role-detail strong { font-size: 11px; }
  .sub-exception-section, .sub-integration-section { grid-template-columns: 1fr; gap: 30px; }
  .sub-exception-section { padding-top: 55px; padding-bottom: 55px; }
  .sub-exception-section h2, .sub-integration-section h2 { font-size: 27px; }
  .sub-exception-section > div > p, .sub-integration-section > div > p { font-size: 12px; }
  .sub-exception-list article { gap: 16px; padding: 22px 0; }
  .sub-exception-list h3 { font-size: 15px; margin-bottom: 8px; }
  .sub-exception-list p { font-size: 11px; }
  .sub-integration-tags { gap: 7px; margin-top: 18px; }
  .sub-integration-tags > span { font-size: 9px; padding: 9px 11px; }
  .sub-integration-section > div > .sub-footnote { font-size: 9px; }
  .sub-price-intro { padding: 28px 25px; gap: 32px; border-radius: 20px; }
  .sub-price-intro .sub-tag { font-size: 8px; }
  .sub-price-intro h2 { font-size: 25px; margin-top: 20px; margin-bottom: 17px; }
  .sub-price-intro p { font-size: 11px; margin-bottom: 23px; }
  .sub-price-intro .btn { font-size: 11px; }
  .sub-price-visual { justify-content: center; gap: 11px; padding-bottom: 33px; }
  .sub-price-visual > div { height: 115px; width: 115px; padding-top: 24px; }
  .sub-price-visual > div > span { font-size: 6px; margin-bottom: 11px; }
  .sub-price-visual strong { font-size: 27px; }
  .sub-price-plus { font-size: 19px; }
  .sub-price-visual-caption { left: auto; font-size: 9px; }
  .sub-cost-list article { grid-template-columns: 26px 1fr; gap: 10px 15px; padding: 24px 0; }
  .sub-cost-number { grid-row: 1 / 4; font-size: 10px; padding-top: 5px; }
  .sub-cost-list h3 { font-size: 17px; padding-top: 0; }
  .sub-cost-list p { grid-column: 2; font-size: 11px; }
  .sub-cost-detail { grid-column: 2; margin-top: 0; font-size: 9px; }
  .sub-faq-section { gap: 22px; }
  .sub-faq-section h2 { font-size: 26px; }
  .sub-faq-list > details { padding: 20px 0; }
  .sub-faq-list summary { gap: 12px; font-size: 12px; }
  .sub-faq-q { font-size: 11px; }
  .sub-faq-list summary > .sub-icon { width: 15px; height: 15px; margin-top: 3px; }
  .sub-faq-list details > div { padding: 14px 20px 0 26px; }
  .sub-faq-list details p { font-size: 11px; }
  .sub-form-layout { grid-template-columns: 1fr; gap: 37px; padding-top: 40px; padding-bottom: 50px; }
  .sub-form-intro h1, .sub-contact-layout .sub-form-intro h1 { font-size: 33px; margin-bottom: 22px; }
  .sub-form-intro > .sub-lead { font-size: 12px; }
  .sub-download-layout .sub-deck-cover { max-width: 400px; margin-top: 27px; }
  .sub-deck-cover { min-height: 320px; padding: 24px 27px 22px; }
  .sub-deck-brand { font-size: 16px; }
  .sub-deck-title h2 { font-size: 29px; }
  .sub-deck-title p { font-size: 9px; }
  .sub-deck-footer > span { font-size: 6px; }
  .sub-deck-footer > b { font-size: 6px; }
  .sub-guide-contents { margin-top: 27px; padding-top: 23px; }
  .sub-guide-contents li { font-size: 11px; gap: 10px; }
  .sub-guide-contents h3 { font-size: 12px; margin-bottom: 12px; }
  .sub-form-panel { padding: 27px 24px; border-radius: 20px; }
  .sub-form-panel-head { padding-bottom: 23px; margin-bottom: 23px; }
  .sub-form-panel-head > .sub-tag { margin-bottom: 18px; }
  .sub-form-panel-head h2 { font-size: 20px; }
  .sub-form-panel-head p { font-size: 10px; }
  .sub-form-grid { gap: 21px 13px; }
  .sub-field > label, .sub-fieldset > legend { font-size: 11px; }
  .sub-field input, .sub-field select, .sub-field textarea { padding: 13px; min-height: 47px; font-size: 16px; }
  .sub-field input::placeholder, .sub-field textarea::placeholder { font-size: 12px; }
  .sub-field select { font-size: 12px; padding-right: 32px; }
  .sub-field select option { font-size: 14px; }
  .sub-field textarea { font-size: 14px; }
  .sub-privacy-check { font-size: 10px; margin-top: 25px; margin-bottom: 23px; }
  .sub-field-help { font-size: 9px; }
  .sub-required { font-size: 7px; }
  .sub-optional { font-size: 7px; }
  .sub-submit { font-size: 12px !important; }
  .sub-form-preview-note { font-size: 9px; margin-top: 15px; gap: 7px; }
  .sub-form-preview-note .sub-icon { width: 12px; height: 12px; }
  .sub-form-bottom { flex-direction: column; gap: 12px; padding-top: 25px; padding-bottom: 35px; }
  .sub-form-bottom p { font-size: 11px; text-align: center; }
  .sub-contact-layout { gap: 35px; }
  .sub-contact-layout .sub-form-intro { position: static; }
  .sub-contact-points { margin-top: 30px; }
  .sub-contact-points h2 { font-size: 12px; margin-bottom: 12px; }
  .sub-contact-points li { font-size: 11px; gap: 12px; padding: 9px 0; }
  .sub-contact-guide { margin-top: 25px; padding-top: 22px; }
  .sub-choice-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .sub-choice { font-size: 9px; padding: 10px 8px; gap: 7px; }
  .sub-choice input { height: 13px; width: 13px; }
  .sub-complete { padding-top: 45px; padding-bottom: 60px; }
  .sub-complete-icon { width: 52px; height: 52px; margin-bottom: 25px; }
  .sub-complete-icon .sub-icon { height: 23px; width: 23px; }
  .sub-complete > h1 { font-size: 30px; margin-bottom: 20px; }
  .sub-complete > .sub-lead { font-size: 12px; }
  .sub-download-ready { grid-template-columns: 1fr; padding: 28px; gap: 30px; margin-top: 33px; border-radius: 20px; text-align: center; }
  .sub-deck-cover.is-small { width: 245px; max-width: 100%; margin: 0 auto; text-align: left; min-height: 280px; padding: 22px; }
  .sub-download-ready h2 { font-size: 21px; margin-top: 17px; margin-bottom: 13px; }
  .sub-download-ready p { font-size: 11px; }
  .sub-complete-note { font-size: 9px; text-align: left; margin-bottom: 0; gap: 7px; }
  .sub-complete-note .sub-icon { width: 13px; height: 13px; }
  .sub-complete-next { margin-top: 35px; padding-top: 30px; }
  .sub-complete-next h2 { font-size: 20px; }
  .sub-complete-next p { font-size: 11px; }
  .sub-complete-next .sub-inline-actions { gap: 10px; margin-top: 22px; }
  .sub-complete-next .btn { font-size: 11px; min-height: 48px; padding: 13px 18px; }
  .sub-complete-info { padding: 22px; gap: 12px; margin-top: 30px; }
  .sub-complete-info > .sub-icon { height: 17px; width: 17px; }
  .sub-complete-info h2 { font-size: 13px; }
  .sub-complete-info p { font-size: 11px; }
  .sub-legal-hero h1 { font-size: 29px; }
  .sub-legal-draft { padding: 20px; gap: 12px; margin-top: 28px; }
  .sub-legal-draft > .sub-icon { height: 17px; width: 17px; }
  .sub-legal-draft strong { font-size: 11px; }
  .sub-legal-draft p { font-size: 10px; }
  .sub-legal-layout { grid-template-columns: 1fr; gap: 30px; }
  .sub-legal-toc { position: static; padding: 22px; background: white; border: 1px solid var(--line); border-radius: 14px; }
  .sub-legal-toc > span { font-size: 8px; margin-bottom: 16px; }
  .sub-legal-toc ol { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 15px; }
  .sub-legal-toc li { gap: 8px; padding: 6px 0; }
  .sub-legal-toc a { font-size: 9px; line-height: 1.8; }
  .sub-legal-toc li::before { font-size: 8px; padding-top: 2px; }
  .sub-legal-intro { font-size: 12px; margin-bottom: 30px; padding-bottom: 25px; }
  .sub-legal-article h2 { font-size: 18px; gap: 11px; margin-bottom: 15px; }
  .sub-legal-article h2 > span { font-size: 9px; }
  .sub-legal-article section > p { font-size: 11px; line-height: 2.1; }
  .sub-legal-article > section { margin-bottom: 32px; scroll-margin-top: 95px; }
  .sub-legal-end { font-size: 10px; margin-bottom: 20px; padding-top: 22px; }
  .sub-legal-contact { flex-direction: column; align-items: flex-start; padding: 26px; gap: 22px; margin-top: 10px; margin-bottom: 50px; }
  .sub-legal-contact h2 { font-size: 18px; margin-bottom: 12px; }
  .sub-legal-contact p { font-size: 11px; }
  .sub-demo-summary { gap: 22px; padding: 27px; flex-direction: column; align-items: flex-start; border-radius: 20px; }
  .sub-summary-icon { height: 58px; width: 58px; border-radius: 17px; }
  .sub-summary-icon .sub-icon { height: 28px; width: 28px; }
  .sub-demo-summary .sub-tag { font-size: 7px; margin-bottom: 16px; padding: 7px 10px; }
  .sub-demo-summary h2 { font-size: 24px; margin-bottom: 14px; }
  .sub-demo-summary p { font-size: 11px; }
  .sub-data-list > article { gap: 18px; padding: 25px 0; }
  .sub-data-icon { height: 32px; width: 32px; border-radius: 10px; margin-top: 5px; }
  .sub-data-icon .sub-icon { height: 18px; width: 18px; }
  .sub-data-list h2 { font-size: 17px; margin: 5px 0 13px; }
  .sub-data-list p { font-size: 11px; }
  .sub-data-number { font-size: 8px; }
  .sub-data-note { padding-bottom: 50px; }
  .sub-data-note h2 { font-size: 17px; }
  .sub-data-note p { font-size: 11px; }
}
@media (max-width: 370px) {
  .sub-filter { padding: 9px 12px; }
  .sub-filter-count { font-size: 7px; }
  .sub-cta-actions { flex-direction: column; }
  .sub-cta-actions .btn { padding: 14px 20px; }
  .sub-form-panel { padding: 24px 19px; }
  .sub-choice-grid { grid-template-columns: 1fr; }
  .sub-workflow-preview { padding: 17px; }
  .sub-workflow-play { font-size: 8px; padding: 10px 12px; }
  .sub-player-meta { flex-direction: column; gap: 4px; }
}
@media (prefers-reduced-motion: reduce) {
  .sub-page *, .sub-page *::before, .sub-page *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

.sub-pdf-open { display: flex; width: fit-content; margin-top: 15px; font-size: 10px; color: var(--muted) !important; }
@media (max-width: 680px) { .sub-pdf-open { margin-inline: auto; } }

/* Final small-screen conversion and cover spacing refinements. */
.sub-mobile-form-link{display:none}.sub-form{scroll-margin-top:105px}.sub-asset-note{margin-top:26px}
@media(max-width:680px){.sub-mobile-form-link{display:inline-flex;font-size:12px;margin-top:22px;min-height:45px;padding:12px 19px}.sub-contact-points{margin-top:30px}}

/* Features hero: a compact, wider voice experience beside the introduction. */
.sub-features-hero{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:48px;padding-top:42px;padding-bottom:56px}
.sub-features-copy,.sub-features-demo{min-width:0}
.sub-features-copy h1{font-size:clamp(38px,4.2vw,60px);line-height:1.5}
.sub-features-copy .sub-lead{font-size:14px;max-width:480px}
.sub-features-demo .voice-card{width:100%;scroll-margin-top:110px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);column-gap:20px;padding:20px 22px}
.sub-features-demo .voice-top{grid-column:1;grid-row:1;gap:8px}
.sub-features-demo .voice-top .mono{font-size:9px;letter-spacing:.035em;white-space:nowrap}
.sub-features-demo .voice-top .pill{font-size:10px;padding:4px 8px;white-space:nowrap}
.sub-features-demo .voice-tabs{grid-column:2;grid-row:1;margin-top:0}
.sub-features-demo .voice-tabs button{font:400 11px var(--font);line-height:1.75;color:#73737B;padding:6px 8px;white-space:nowrap}
.sub-features-demo .voice-tabs button.active{color:#111}
.sub-features-demo .voice-stage{grid-column:1/-1;grid-row:2;display:grid;grid-template-columns:72px minmax(0,1fr);grid-template-rows:auto auto;column-gap:20px;align-content:center;text-align:left;min-height:118px;padding:20px 8px}
.sub-features-demo .voice-stage::before{background:radial-gradient(ellipse at 20% 50%,#F4F0FF 0%,transparent 75%)}
.sub-features-demo .voice-orb{grid-column:1;grid-row:1/3;width:72px;height:72px;align-self:center}
.sub-features-demo .voice-wave{transform:scale(.74)}
.sub-features-demo .voice-stage h3{grid-column:2;grid-row:1;align-self:end;font-size:21px;font-weight:550;letter-spacing:-.035em;line-height:1.45;margin:0}
.sub-features-demo .voice-stage p{grid-column:2;grid-row:2;align-self:start;font-size:12px;margin:5px 0 0;line-height:1.85}
.sub-features-demo .voice-select-wrap{grid-column:1;grid-row:3;border:0;padding:0;margin:0;min-width:0;gap:8px;min-height:44px}
.sub-features-demo .voice-select-wrap label{font-size:9px}
.sub-features-demo .voice-select-wrap select{font:400 12px var(--font);line-height:1.85;color:#45454D}
.sub-features-demo .voice-start{grid-column:2;grid-row:3;font:400 12px var(--font);line-height:1.85;color:#fff;min-height:44px;padding:9px 10px}
.sub-features-demo .voice-transcript{grid-column:1/-1;grid-row:4;margin:12px 0 0;padding:10px 12px;min-height:72px;max-height:112px;overflow:auto}
.sub-features-demo .voice-result{grid-column:1/-1;grid-row:5;min-height:23px;margin-top:12px}
.sub-features-demo .voice-preview-note{grid-column:1/-1;grid-row:6;margin-top:10px;padding-top:10px;gap:10px;line-height:1.6}
.sub-features-demo .voice-preview-note a{white-space:nowrap}
@media(max-width:1180px){.sub-features-hero{grid-template-columns:.85fr 1.15fr;gap:32px}.sub-features-copy h1{font-size:46px}.sub-features-demo .voice-card{padding:18px;column-gap:14px}.sub-features-demo .voice-top{flex-wrap:wrap;justify-content:flex-start;gap:4px 8px}.sub-features-demo .voice-top .pill{font-size:9px;padding:3px 7px}.sub-features-demo .voice-tabs button{font-size:10px;padding-inline:5px}.sub-features-demo .voice-stage{padding-inline:4px}.sub-features-demo .voice-select-wrap select{font-size:11px;padding-inline:8px}.sub-features-demo .voice-start{font-size:11px}.sub-features-demo .voice-preview-note{font-size:9px}}
@media(max-width:980px){.sub-features-hero{grid-template-columns:.8fr 1.2fr;gap:26px}.sub-features-copy h1{font-size:38px}.sub-features-copy .sub-lead{font-size:13px}.sub-features-demo .voice-top .mono{font-size:8px}.sub-features-demo .voice-stage{column-gap:16px;grid-template-columns:64px minmax(0,1fr);min-height:108px;padding-block:18px}.sub-features-demo .voice-orb{width:64px;height:64px}.sub-features-demo .voice-stage h3{font-size:18px}.sub-features-demo .voice-stage p{font-size:11px}.sub-features-demo .voice-select-wrap{flex-direction:column;align-items:stretch;justify-content:center;gap:3px}.sub-features-demo .voice-select-wrap label{font-size:8px;line-height:1.3}.sub-features-demo .voice-select-wrap select{max-width:100%;width:100%;padding-block:4px}.sub-features-demo .voice-start{align-self:center}.sub-features-demo .voice-preview-note{align-items:flex-start}.sub-features-demo .voice-preview-note>span{max-width:240px}}
@media(max-width:760px){.sub-features-hero{grid-template-columns:1fr;gap:28px;padding-top:40px;padding-bottom:48px}.sub-features-copy h1{font-size:clamp(34px,7.7vw,48px);line-height:1.5;margin-bottom:20px}.sub-features-copy .sub-lead{font-size:13px}.sub-features-demo .voice-card{max-width:560px;scroll-margin-top:92px}}
@media(max-width:480px){.sub-features-demo .voice-card{grid-template-columns:1fr;padding:18px}.sub-features-demo .voice-top{grid-column:1;grid-row:1;justify-content:space-between;flex-wrap:nowrap}.sub-features-demo .voice-top .mono{font-size:9px}.sub-features-demo .voice-top .pill{font-size:10px;padding:4px 8px}.sub-features-demo .voice-tabs{grid-column:1;grid-row:2;margin-top:12px}.sub-features-demo .voice-tabs button{font-size:11px;min-height:34px}.sub-features-demo .voice-stage{grid-column:1;grid-row:3;padding:18px 0;min-height:108px;column-gap:14px}.sub-features-demo .voice-stage h3{font-size:18px}.sub-features-demo .voice-select-wrap{grid-column:1;grid-row:4;flex-direction:row;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;min-height:38px}.sub-features-demo .voice-select-wrap label{font-size:9px}.sub-features-demo .voice-select-wrap select{max-width:75%;width:auto;font-size:12px;padding:7px 10px}.sub-features-demo .voice-start{grid-column:1;grid-row:5;min-height:44px;font-size:12px}.sub-features-demo .voice-transcript{grid-row:6}.sub-features-demo .voice-result{grid-row:7;font-size:10px}.sub-features-demo .voice-preview-note{grid-row:8;font-size:9px;align-items:flex-start}.sub-features-demo .voice-preview-note>span{max-width:190px}}