:root {
  --paper: #f6f5f1;
  --paper-2: #fbfaf7;
  --ink: #11161c;
  --muted: #5e6269;
  --line: #c9c8c3;
  --graphite: #10161c;
  --graphite-2: #161d24;
  --coral: #f34f46;
  --coral-dark: #d93a33;
  --green: #45dc8a;
  --amber: #ffbd4a;
  --red: #ff5a52;
  --content: min(1180px, calc(100vw - 64px));
  --soft-radius: 12px;
  --header-height: 72px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--paper); color: var(--ink); font-family: Aptos, "Segoe UI", Arial, sans-serif; font-size: 16px; line-height: 1.5; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, summary { font: inherit; }
button, a, summary { -webkit-tap-highlight-color: transparent; }

.skip-link { position: fixed; top: 10px; left: 10px; z-index: 20; padding: 10px 14px; background: var(--graphite); color: #f7f7f4; transform: translateY(-150%); transition: transform 180ms ease; }
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 3px solid var(--coral); outline-offset: 4px; }

.site-header { width: var(--content); height: var(--header-height); margin: 0 auto; display: grid; grid-template-columns: 190px 1fr auto; align-items: center; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 8px; width: max-content; color: var(--ink); font-size: 22px; font-weight: 760; letter-spacing: -.035em; text-decoration: none; }
.brand > span > span { color: var(--coral); }
.brand img { width: 34px; height: 34px; object-fit: contain; user-select: none; -webkit-user-drag: none; filter: brightness(.2); }
.site-header nav { justify-self: center; display: flex; align-items: center; gap: clamp(26px, 4vw, 54px); white-space: nowrap; }
.site-header nav a, .site-footer nav a { text-decoration: none; font-weight: 650; }
.site-header nav a { position: relative; font-size: 14px; }
.site-header nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -7px; height: 1px; background: var(--coral); transition: right 180ms ease; }
.site-header nav a:hover::after, .site-header nav a:focus-visible::after { right: 0; }
.header-actions { display: flex; align-items: center; gap: 10px; }

.locale-menu { position: relative; }
.locale-menu summary { width: 44px; height: 40px; display: grid; place-items: center; list-style: none; cursor: pointer; border: 1px solid #d5d4cf; border-radius: 9px; background: var(--paper-2); font-size: 12px; font-weight: 750; }
.locale-menu summary::-webkit-details-marker { display: none; }
.locale-menu__options { position: absolute; top: calc(100% + 8px); right: 0; z-index: 10; display: grid; grid-template-columns: repeat(5, 40px); gap: 4px; padding: 6px; border: 1px solid #d3d2cd; border-radius: var(--soft-radius); background: var(--paper-2); box-shadow: 0 14px 34px rgba(37, 34, 29, .14); }
.locale-menu__options button { min-height: 34px; border: 0; border-radius: 7px; background: transparent; color: var(--ink); cursor: pointer; font-size: 12px; font-weight: 700; }
.locale-menu__options button[aria-pressed="true"] { background: var(--graphite); color: #f7f7f4; }

.button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; padding: 0 22px; border: 1px solid var(--coral-dark); border-radius: 8px; background: var(--coral); color: #fff; box-shadow: 0 10px 24px rgba(243, 79, 70, .2); font-size: 14px; font-weight: 760; line-height: 1; text-decoration: none; white-space: nowrap; transition: transform 180ms ease, background-color 180ms ease, box-shadow 180ms ease; }
.button:hover { background: var(--coral-dark); box-shadow: 0 13px 28px rgba(216, 58, 51, .24); transform: translateY(-2px); }
.button:active { transform: translateY(1px); }
.button--small { min-height: 40px; padding-inline: 18px; font-size: 12px; }
.text-link { align-self: center; padding: 10px 2px 7px; border-bottom: 1px solid var(--coral); font-size: 14px; font-weight: 700; text-decoration: none; }
.actions { display: flex; align-items: center; gap: 38px; flex-wrap: wrap; }

.hero { min-height: calc(100dvh - var(--header-height)); width: var(--content); margin: 0 auto; display: grid; grid-template-columns: .86fr 1.14fr; align-items: center; gap: clamp(30px, 5vw, 80px); padding: 54px 0 70px; }
.hero__copy { position: relative; z-index: 2; }
.eyebrow { margin: 0 0 22px; color: var(--coral); font-size: 12px; font-weight: 800; letter-spacing: .09em; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 24px; font-size: clamp(42px, 3.55vw, 51px); line-height: 1.03; letter-spacing: -.045em; }
h1 span { display: block; }
.hero__body { max-width: 430px; margin-bottom: 34px; color: var(--muted); font-size: clamp(17px, 1.45vw, 21px); line-height: 1.55; }

.hero-preview { position: relative; align-self: stretch; min-height: 550px; margin: 0; overflow: hidden; isolation: isolate; }
.document-preview { position: absolute; inset: 15px 34px -85px 28px; transform: rotate(-2.6deg); border: 1px solid #bbbcb9; border-radius: var(--soft-radius) var(--soft-radius) 0 0; background: rgba(251, 250, 247, .72); box-shadow: 0 34px 75px rgba(53, 48, 41, .12); }
.document-preview__toolbar { height: 52px; display: flex; align-items: center; gap: 22px; padding: 0 70px; border-bottom: 1px solid #d6d4cf; color: #60636a; font-family: Georgia, serif; }
.document-preview__text { max-width: 410px; display: grid; gap: 7px; margin: 80px auto 0; color: #303137; font-family: Georgia, "Times New Roman", serif; font-size: clamp(18px, 1.6vw, 23px); line-height: 1.35; }
.document-preview__text span:last-child::after { content: ""; display: inline-block; width: 2px; height: 1em; margin-left: 5px; vertical-align: -.12em; background: var(--coral); }
.hero-preview figcaption { position: absolute; right: 20px; bottom: 11px; z-index: 4; color: #6a6d73; font-size: 12px; }

.live-dock { --state: var(--green); position: absolute; right: 6%; bottom: 18%; z-index: 5; width: clamp(246px, 24vw, 326px); aspect-ratio: 128 / 42; display: grid; grid-template-columns: 26% 1px 1fr; align-items: center; gap: 7%; padding: 0 8% 0 6%; border: 0; border-radius: 999px; background: linear-gradient(115deg, #151b21, #090d11 65%, #11171c); color: var(--state); cursor: pointer; box-shadow: 0 19px 34px rgba(14, 17, 20, .24), inset 0 1px 0 rgba(255, 255, 255, .08); }
.live-dock__border { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.live-dock__track, .live-dock__reflection { fill: none; vector-effect: non-scaling-stroke; }
.live-dock__track { stroke: var(--state); stroke-width: 1; opacity: .9; }
.live-dock__reflection { stroke: var(--state); stroke-linecap: round; opacity: 0; }
.live-dock__reflection--tail { stroke-width: 1.2; stroke-dasharray: 15 85; }
.live-dock__reflection--glint { stroke-width: 2; stroke-dasharray: 4 96; stroke-dashoffset: -6; }
.live-dock__mark { display: grid; place-items: center; min-width: 0; }
.live-dock__mark img { width: 78%; aspect-ratio: 1; object-fit: contain; user-select: none; -webkit-user-drag: none; filter: saturate(1.12) contrast(1.06); }
.live-dock__divider { width: 1px; height: 48%; background: #35404c; }
.live-dock__signal { display: flex; align-items: center; justify-content: space-between; gap: 5%; height: 48%; }
.live-dock__signal i { width: 4%; min-width: 3px; height: 22%; border-radius: 999px; background: var(--state); opacity: .78; }
.live-dock--ready { --state: var(--green); }
.live-dock--recording { --state: var(--green); }
.live-dock--recording .live-dock__signal i:nth-child(1), .live-dock--recording .live-dock__signal i:nth-child(9) { height: 36%; }
.live-dock--recording .live-dock__signal i:nth-child(2), .live-dock--recording .live-dock__signal i:nth-child(6) { height: 68%; }
.live-dock--recording .live-dock__signal i:nth-child(3), .live-dock--recording .live-dock__signal i:nth-child(7) { height: 98%; }
.live-dock--recording .live-dock__signal i:nth-child(4), .live-dock--recording .live-dock__signal i:nth-child(8) { height: 54%; }
.live-dock--recording .live-dock__signal i:nth-child(5) { height: 82%; }
.live-dock--processing { --state: var(--amber); }
.live-dock--processing .live-dock__signal i { height: 28%; opacity: .42; }
.live-dock--processing .live-dock__signal i:nth-child(5) { height: 52%; opacity: 1; }
.live-dock--error { --state: var(--red); }
.live-dock--error .live-dock__signal i { height: 18%; opacity: .42; }
.live-dock--error .live-dock__signal i:nth-child(4), .live-dock--error .live-dock__signal i:nth-child(6) { height: 46%; opacity: 1; }
.live-dock--error .live-dock__signal i:nth-child(5) { height: 86%; opacity: 1; }
.dock-caption { position: absolute; right: 27%; bottom: 12.6%; z-index: 5; display: flex; align-items: center; gap: 8px; color: #484b50; font-size: 12px; font-weight: 700; }
.dock-caption > i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); }

.benefits { width: 100%; min-height: 88px; display: grid; grid-template-columns: repeat(3, 1fr); align-items: center; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--paper-2); padding-inline: max(32px, calc((100vw - 1180px) / 2)); }
.benefits span { padding: 2px 46px; text-align: center; font-size: 16px; font-weight: 650; }
.benefits span + span { border-left: 1px solid #bbbcb8; }

.privacy { min-height: 500px; display: grid; grid-template-columns: .78fr 1.22fr; align-items: center; gap: clamp(45px, 7vw, 110px); padding: 90px max(32px, calc((100vw - 1180px) / 2)); background: radial-gradient(circle at 78% 36%, #17212a 0, var(--graphite) 48%, #0d1319 100%); color: #f5f4ef; }
.privacy__copy h2, .process h2, .personal h2 { margin-bottom: 24px; font-size: clamp(36px, 3.2vw, 49px); line-height: 1.08; letter-spacing: -.04em; }
.privacy__copy p { max-width: 390px; color: #ecedea; font-size: 18px; line-height: 1.55; }
.privacy__copy .privacy__note { margin: 28px 0 0; color: #b8bec5; font-size: 14px; }
.local-flow { position: relative; min-height: 260px; display: grid; grid-template-columns: 70px 96px 170px 78px; align-items: center; justify-content: space-between; column-gap: clamp(18px, 3vw, 42px); padding: 48px 28px 28px; border: 1px dashed #d4d7d8; border-radius: var(--soft-radius); background: #121a22; }
.local-flow::before { content: ""; position: absolute; top: 54%; left: 58px; right: 58px; z-index: 1; height: 1px; border-top: 1px dashed #78828a; }
.local-flow::after { display: none; }
.local-flow__label { position: absolute; top: -11px; left: 50%; z-index: 3; transform: translateX(-50%); padding: 0 14px; background: #121a22; color: var(--coral); font-size: 12px; font-weight: 800; letter-spacing: .08em; white-space: nowrap; }
.flow-node, .flow-wave, .flow-laptop, .flow-document { position: relative; z-index: 2; }
.flow-node--mic { width: 62px; height: 62px; display: grid; place-items: center; border: 1px solid #f1f2ed; border-radius: 50%; background: #121a22; }
.flow-node--mic span { width: 17px; height: 30px; position: relative; border: 2px solid #f1f2ed; border-radius: 12px; }
.flow-node--mic span::before { content: ""; position: absolute; left: 50%; bottom: -10px; width: 27px; height: 18px; border: 2px solid #f1f2ed; border-top: 0; border-radius: 0 0 16px 16px; transform: translateX(-50%); }
.flow-node--mic span::after { content: ""; position: absolute; left: 50%; bottom: -15px; width: 2px; height: 8px; background: #f1f2ed; transform: translateX(-50%); }
.flow-wave { min-width: 72px; display: flex; align-items: center; justify-content: center; gap: 4px; color: var(--coral); background: #121a22; }
.flow-wave i { width: 2px; height: 18px; background: currentColor; }
.flow-wave i:nth-child(2), .flow-wave i:nth-child(6) { height: 32px; }
.flow-wave i:nth-child(3), .flow-wave i:nth-child(5) { height: 44px; }
.flow-wave i:nth-child(4) { height: 58px; }
.flow-laptop { width: 170px; height: 104px; justify-self: center; padding: 8px; border: 1px solid #e8e8e4; border-radius: 5px 5px 2px 2px; background: #11171d; }
.flow-laptop::after, .process-device::after { content: ""; position: absolute; left: -16px; right: -16px; bottom: -8px; height: 5px; border: 1px solid #dddeda; border-radius: 0 0 50% 50%; }
.flow-laptop > div { height: 100%; display: grid; place-items: center; border: 1px solid #6d7377; background: #0b1015; }
.flow-laptop img { width: 68px; user-select: none; -webkit-user-drag: none; }
.flow-document { grid-column: 4; width: 62px; height: 85px; justify-self: end; padding: 20px 11px; border: 1px solid #f1f2ed; border-radius: 3px; background: #141b22; }
.flow-document::after { content: ""; position: absolute; top: -1px; right: -1px; width: 22px; height: 22px; border-left: 1px solid #f1f2ed; border-bottom: 1px solid #f1f2ed; background: #141b22; clip-path: polygon(0 0, 100% 100%, 0 100%); }
.flow-document i { display: block; width: 100%; height: 1px; margin: 11px 0; background: #f1f2ed; }
.flow-document b { position: absolute; bottom: 10px; left: 50%; width: 2px; height: 15px; background: var(--coral); }

.process { width: var(--content); margin: 0 auto; padding: 82px 0 94px; }
.section-heading { max-width: 510px; margin-bottom: 58px; }
.process-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.process-grid article { min-width: 0; padding: 0 48px; }
.process-grid article:first-child { padding-left: 0; }
.process-grid article:last-child { padding-right: 0; }
.process-grid article + article { border-left: 1px solid #b7b8b5; }
.step-number { display: block; margin-bottom: 10px; color: var(--coral); font-weight: 850; }
.process-grid h3 { margin-bottom: 8px; font-size: 22px; letter-spacing: -.02em; }
.process-grid p { min-height: 48px; color: var(--muted); font-size: 14px; }
.speech-visual { height: 140px; display: flex; align-items: center; justify-content: center; gap: 8px; color: #9ca0a4; }
.speech-visual i { width: 1px; height: 42px; background: currentColor; }
.speech-visual i:nth-child(2), .speech-visual i:nth-child(10) { height: 65px; }
.speech-visual i:nth-child(3), .speech-visual i:nth-child(9) { height: 31px; }
.speech-visual i:nth-child(4), .speech-visual i:nth-child(8) { height: 74px; }
.speech-visual i:nth-child(5), .speech-visual i:nth-child(7) { height: 55px; }
.speech-visual i:nth-child(6) { height: 116px; background: var(--coral); }
.process-device { position: relative; width: min(240px, 90%); height: 130px; margin: 26px auto 0; padding: 8px; border: 1px solid #222a32; border-radius: 7px 7px 2px 2px; background: #12191f; }
.process-device > div { height: 100%; display: grid; place-items: center; background: #0d1217; }
.process-device img { width: 72px; user-select: none; -webkit-user-drag: none; }
.insert-document { position: relative; width: min(250px, 94%); height: 154px; margin: 26px auto 0; padding: 38px 24px 20px; border: 1px solid #b8b9b5; border-radius: var(--soft-radius); background: var(--paper-2); }
.insert-document::before { content: "B   I   U      ≡  ☷      ↶"; position: absolute; top: 11px; left: 20px; color: #74777c; font-family: Georgia, serif; font-size: 12px; }
.insert-document span { display: block; width: 94%; height: 4px; margin: 10px 0; background: #cfd0cc; }
.insert-document span:nth-child(2) { width: 86%; }
.insert-document span:nth-child(3) { width: 76%; }
.insert-document span:nth-child(4) { width: 58%; }
.insert-document i { position: absolute; left: 54%; bottom: 20px; width: 2px; height: 22px; background: var(--coral); }

.personal { display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: clamp(45px, 7vw, 100px); padding: 88px max(32px, calc((100vw - 1180px) / 2)); border-top: 1px solid var(--line); background: #f1efe9; }
.personal__copy > p { max-width: 430px; margin-bottom: 32px; color: var(--muted); font-size: 19px; }
.pro-note { color: #555960; font-size: 14px; }
.personal-details { max-width: 470px; margin-top: 38px; padding-top: 24px; border-top: 1px solid #c7c5bf; }
.personal-details h3 { margin-bottom: 6px; font-size: 16px; }
.personal-details p { margin-bottom: 0; color: #666a70; font-size: 13px; }
.personal__screen { margin: 0; overflow: hidden; border: 1px solid #969793; border-radius: var(--soft-radius); background: #14191d; box-shadow: 0 22px 52px rgba(65, 59, 50, .14); }
.personal__screen img { width: 100%; height: auto; aspect-ratio: 1.5 / 1; object-fit: cover; object-position: top center; }

.chapter { padding: 88px max(32px, calc((100vw - 1180px) / 2)); border-top: 1px solid var(--line); }
.chapter__heading { max-width: 690px; margin-bottom: 54px; }
.chapter__heading h2, .purchase__intro h2, .faq h2 { margin-bottom: 18px; font-size: clamp(34px, 3vw, 46px); line-height: 1.08; letter-spacing: -.04em; }
.chapter__heading > p:last-child, .purchase__intro > p { max-width: 620px; color: var(--muted); font-size: 18px; }
.use-cases { background: #eceae4; }
.use-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid #b9b8b3; border-bottom: 1px solid #b9b8b3; }
.use-grid article { min-height: 220px; padding: 28px 28px 30px; }
.use-grid article + article { border-left: 1px solid #b9b8b3; }
.use-grid article > span { color: var(--coral); font-size: 12px; font-weight: 850; }
.use-grid h3 { margin: 56px 0 10px; font-size: 22px; }
.use-grid p, .feature-list p { color: var(--muted); font-size: 14px; }
.evidence-note { margin: 24px 0 0; color: #6c7075; font-size: 12px; }
.features { background: var(--paper-2); }
.feature-list { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line); }
.feature-list article { padding: 30px 34px 28px 0; border-bottom: 1px solid var(--line); }
.feature-list article:nth-child(even) { padding-left: 34px; border-left: 1px solid var(--line); }
.feature-list h3 { margin-bottom: 8px; font-size: 22px; }
.learning-note { max-width: 790px; margin-top: 42px; padding: 24px 28px; border-left: 3px solid var(--coral); background: #eeece6; }
.learning-note strong { font-size: 18px; }
.learning-note p { margin: 8px 0 0; color: var(--muted); }

.purchase { background: var(--paper-2); }
.purchase__intro { max-width: 760px; }
.commerce-status { width: max-content; max-width: 100%; display: flex; align-items: center; gap: 10px; margin: 24px 0 46px; padding: 10px 14px; border: 1px solid #b8b6af; border-radius: 8px; color: #4e5358; font-size: 13px; }
.commerce-status > span { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: var(--amber); }
.purchase-steps { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0 0 44px; padding: 0; list-style: none; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.purchase-steps li { min-height: 92px; display: flex; align-items: center; gap: 14px; padding: 20px; }
.purchase-steps li + li { border-left: 1px solid var(--line); }
.purchase-steps b { width: 28px; height: 28px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid var(--coral); border-radius: 50%; color: var(--coral); font-size: 12px; }
.purchase-steps span { font-weight: 750; }
.purchase-grid { display: grid; grid-template-columns: 1fr .82fr; gap: 52px; }
.plan-picker { min-width: 0; margin: 0; padding: 0; border: 0; }
.plan-picker legend { margin-bottom: 18px; font-size: 22px; font-weight: 780; }
.plan-picker label { min-height: 78px; display: flex; align-items: center; gap: 16px; margin-bottom: 12px; padding: 15px 18px; border: 1px solid #bbb9b3; border-radius: 9px; cursor: pointer; }
.plan-picker label:has(input:checked) { border-color: var(--coral); box-shadow: inset 0 0 0 1px var(--coral); }
.plan-picker input { width: 18px; height: 18px; accent-color: var(--coral); }
.plan-picker label span { display: grid; gap: 4px; }
.plan-picker small, .plan-picker > p { color: var(--muted); }
.plan-picker > p { margin-top: 20px; font-size: 12px; }
.purchase-summary { padding: 28px; background: var(--graphite); color: #f4f3ef; border-radius: 10px; }
.purchase-summary h3 { font-size: 22px; }
.purchase-summary dl { margin: 24px 0; }
.purchase-summary dl div { display: flex; justify-content: space-between; gap: 20px; padding: 11px 0; border-bottom: 1px solid #303840; }
.purchase-summary dt { color: #9fa7ae; }
.purchase-summary dd { margin: 0; text-align: right; font-weight: 700; }
.purchase-button { width: 100%; justify-content: center; }
.purchase-button:disabled { border-color: #434a50; background: #343b41; color: #aeb4b8; box-shadow: none; cursor: not-allowed; }
.payment-note { margin: 16px 0 0; color: #aab1b7; font-size: 11px; }
.purchase-assurance { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 58px; padding-top: 34px; border-top: 1px solid var(--line); }
.purchase-assurance article { min-width: 0; padding: 0 34px; }
.purchase-assurance article:first-child { padding-left: 0; }
.purchase-assurance article:last-child { padding-right: 0; }
.purchase-assurance article + article { border-left: 1px solid var(--line); }
.purchase-assurance strong { color: var(--coral-dark); font-size: 15px; }
.purchase-assurance p { margin: 10px 0 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.purchase-assurance a, .support-box a { color: inherit; font-weight: 750; text-decoration-color: var(--coral); text-underline-offset: 4px; }
.recovery-panel { margin-top: 64px; padding-top: 34px; border-top: 1px solid var(--line); }
.recovery-panel h3 { font-size: 25px; }
.recovery-grid { display: grid; grid-template-columns: repeat(5, 1fr); margin-top: 24px; }
.recovery-grid article { padding: 8px 24px 10px 0; }
.recovery-grid article + article { padding-left: 24px; border-left: 1px solid var(--line); }
.recovery-grid strong { color: var(--coral-dark); }
.recovery-grid p { margin: 9px 0 0; color: var(--muted); font-size: 13px; }

.faq { background: #efede7; }
.faq-list { max-width: 880px; border-top: 1px solid var(--line); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { min-height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 20px; cursor: pointer; font-size: 18px; font-weight: 760; list-style: none; }
.faq-list summary::after { content: "+"; color: var(--coral); font-size: 24px; font-weight: 400; }
.faq-list details[open] summary::after { content: "−"; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list details p { max-width: 700px; margin: 0 0 24px; color: var(--muted); }
.support-box { max-width: 880px; display: grid; grid-template-columns: 180px 1fr; gap: 28px; margin-top: 42px; padding: 24px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.support-box p { margin: 0; color: var(--muted); }

.site-footer { min-height: 180px; display: grid; grid-template-columns: 1.3fr .9fr 1.2fr; align-items: start; gap: 40px; padding: 42px max(32px, calc((100vw - 1180px) / 2)) 26px; background: var(--graphite); color: #f1f1ee; }
.brand--footer { color: #f1f1ee; font-size: 20px; }
.brand--footer img { filter: none; }
.site-footer nav { display: flex; gap: 28px; font-size: 13px; }
.footer-routes { display: grid; gap: 8px; color: #b8bec4; font-size: 12px; }
.footer-routes a { color: #f4f3ef; text-decoration-color: var(--coral); text-underline-offset: 4px; }
.site-footer > p { grid-column: 1 / -1; margin: 12px 0 0; padding-top: 18px; border-top: 1px solid #30383f; color: #929aa1; font-size: 11px; }

.reveal { opacity: 1; transform: none; }

@media (prefers-reduced-motion: no-preference) {
  .live-dock--recording .live-dock__signal i { animation: voiceState 700ms ease-in-out infinite alternate; }
  .live-dock--recording .live-dock__signal i:nth-child(2n) { animation-delay: 130ms; }
  .live-dock--processing .live-dock__reflection { opacity: .9; animation: contourReflection 1.05s linear infinite; }
  .live-dock--error .live-dock__reflection { opacity: .8; animation: errorPulse 480ms ease-out 2; }
}
@keyframes voiceState { to { transform: scaleY(.55); opacity: 1; } }
@keyframes contourReflection { to { stroke-dashoffset: -100; } }
@keyframes errorPulse { 50% { opacity: .18; } }

@media (max-width: 960px) {
  :root { --content: min(100% - 40px, 760px); }
  .site-header { grid-template-columns: 150px 1fr auto; gap: 14px; }
  .site-header nav { gap: 20px; }
  .header-actions .button { display: none; }
  .hero { min-height: auto; grid-template-columns: 1fr; padding: 54px 0 44px; }
  .hero__copy { max-width: 650px; }
  .hero-preview { min-height: 500px; }
  .document-preview { inset: 12px 28px -70px 72px; }
  .privacy { grid-template-columns: 1fr; gap: 56px; }
  .privacy__copy p { max-width: 620px; }
  .process-grid article { padding-inline: 28px; }
  .personal { grid-template-columns: 1fr; }
  .personal__copy { max-width: 650px; }
  .site-footer { grid-template-columns: 1fr 1fr; }
  .footer-routes { justify-self: end; }
  .use-grid, .recovery-grid { grid-template-columns: repeat(2, 1fr); }
  .use-grid article:nth-child(3), .use-grid article:nth-child(4), .recovery-grid article:nth-child(n+3) { border-top: 1px solid var(--line); }
  .use-grid article:nth-child(3), .recovery-grid article:nth-child(odd) { border-left: 0; }
  .purchase-grid { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  :root { --content: calc(100% - 32px); --header-height: 64px; }
  .site-header { grid-template-columns: 120px 1fr auto; }
  .brand { font-size: 19px; }
  .brand img { width: 29px; height: 29px; }
  .site-header nav { justify-self: end; }
  .site-header nav a:not(:first-child) { display: none; }
  .locale-menu__options { grid-template-columns: repeat(3, 40px); }
  .hero { padding-top: 38px; }
  h1 { font-size: clamp(40px, 12vw, 54px); }
  .hero__body { font-size: 17px; }
  .actions { gap: 24px; }
  .hero-preview { min-height: 405px; }
  .document-preview { inset: 8px 18px -76px 10px; }
  .document-preview__toolbar { padding-inline: 42px; gap: 16px; }
  .document-preview__text { max-width: 285px; margin-top: 58px; font-size: 16px; }
  .live-dock { right: 3%; bottom: 20%; width: min(276px, 78vw); }
  .dock-caption { right: 24%; bottom: 13%; }
  .benefits { grid-template-columns: 1fr; padding-inline: 22px; }
  .benefits span { padding: 17px 0; }
  .benefits span + span { border-left: 0; border-top: 1px solid #c9c8c3; }
  .privacy { min-height: auto; padding: 72px 22px; }
  .local-flow { min-height: 410px; grid-template-columns: 1fr; justify-items: center; padding: 46px 24px 28px; }
  .local-flow::before { top: 72px; bottom: 48px; left: 50%; right: auto; width: 1px; height: auto; border-top: 0; border-left: 1px dashed #9ba2a8; }
  .local-flow::after { display: none; }
  .flow-node--mic, .flow-wave, .flow-laptop, .flow-document { grid-column: 1; }
  .flow-wave { min-height: 62px; }
  .flow-laptop { width: 155px; height: 92px; }
  .flow-document { width: 54px; height: 72px; padding-top: 14px; }
  .process { width: auto; padding: 72px 22px; }
  .section-heading { margin-bottom: 38px; }
  .process-grid { grid-template-columns: 1fr; gap: 0; }
  .process-grid article, .process-grid article:first-child, .process-grid article:last-child { padding: 0 0 38px; }
  .process-grid article + article { padding-top: 38px; border-left: 0; border-top: 1px solid #b7b8b5; }
  .process-grid p { min-height: auto; }
  .personal { padding: 72px 22px; }
  .chapter { padding: 72px 22px; }
  .use-grid, .feature-list, .purchase-steps, .recovery-grid, .purchase-assurance { grid-template-columns: 1fr; }
  .use-grid article, .use-grid article:nth-child(3), .use-grid article:nth-child(4) { min-height: 170px; border-left: 0; border-top: 1px solid var(--line); }
  .use-grid article:first-child { border-top: 0; }
  .use-grid h3 { margin-top: 28px; }
  .feature-list article, .feature-list article:nth-child(even) { padding: 26px 0; border-left: 0; }
  .purchase-steps li { min-height: 64px; }
  .purchase-steps li + li { border-left: 0; border-top: 1px solid var(--line); }
  .recovery-grid article, .recovery-grid article + article, .recovery-grid article:nth-child(3), .recovery-grid article:nth-child(4) { padding: 20px 0; border-left: 0; border-top: 1px solid var(--line); }
  .purchase-assurance article, .purchase-assurance article:first-child, .purchase-assurance article:last-child { padding: 20px 0; }
  .purchase-assurance article + article { border-left: 0; border-top: 1px solid var(--line); }
  .support-box { grid-template-columns: 1fr; gap: 8px; }
  .site-footer { grid-template-columns: 1fr; padding-inline: 22px; }
  .site-footer nav { flex-wrap: wrap; }
  .footer-routes { justify-self: start; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .reveal { opacity: 1; transform: none; }
  .button:hover { transform: none; }
}