:root {
  --bg: #0b0b0d;
  --bg-soft: #111114;
  --surface: #17171b;
  --surface-high: #202026;
  --text: #f3f1ed;
  --muted: #aaa6ae;
  --faint: #6f6c74;
  --line: rgba(255, 255, 255, 0.1);
  --accent: #c67fd3;
  --accent-soft: rgba(198, 127, 211, 0.14);
  --white: #f5f4f0;
  --black: #09090a;
  --radius: 24px;
  --shell: 1200px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

::selection { background: var(--accent); color: var(--black); }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }
img { display: block; max-width: 100%; }
.shell { width: min(var(--shell), calc(100% - 48px)); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 100; top: 12px; left: 12px; padding: 10px 14px; border-radius: 8px; background: var(--white); color: var(--black); transform: translateY(-160%); transition: transform .2s; }
.skip-link:focus { transform: none; }

.site-header { position: fixed; z-index: 50; top: 0; left: 0; width: 100%; border-bottom: 1px solid transparent; transition: background .25s, border-color .25s; }
.site-header.scrolled { background: rgba(11, 11, 13, .78); border-color: var(--line); backdrop-filter: blur(24px); }
.nav { height: 78px; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; gap: 10px; align-items: center; font-size: 19px; font-weight: 650; letter-spacing: -.4px; }
.brand img { width: 34px; height: 34px; border-radius: 10px; }
.nav-links { display: flex; align-items: center; gap: 34px; color: #c5c2c7; font-size: 14px; }
.nav-links > a:not(.button) { transition: color .2s; }
.nav-links > a:not(.button):hover { color: #fff; }
.menu-button { display: none; width: 42px; height: 42px; background: transparent; border: 0; }

.button { min-height: 50px; padding: 0 22px; border: 1px solid transparent; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-weight: 600; font-size: 14px; cursor: pointer; transition: transform .2s, background .2s, border-color .2s; }
.button:hover { transform: translateY(-2px); }
.button svg { width: 19px; height: 19px; fill: currentColor; }
.button-small { min-height: 38px; padding-inline: 17px; border-radius: 10px; }
.button-light { background: var(--white); color: var(--black); }
.button-light:hover { background: #fff; }
.button-ghost { background: transparent; color: var(--text); border-color: var(--line); }
.button-ghost:hover { border-color: rgba(255, 255, 255, .25); background: rgba(255, 255, 255, .04); }
.button-dark { background: var(--white); color: var(--black); }
.play-icon { font-size: 10px; }

.hero { min-height: 820px; padding: 148px 0 90px; display: grid; grid-template-columns: .91fr 1.09fr; gap: 70px; align-items: center; }
.hero-copy { position: relative; z-index: 2; }
.eyebrow { margin: 0 0 25px; color: #c5c1c8; font-size: 11px; line-height: 1; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.status-dot { width: 7px; height: 7px; display: inline-block; margin-right: 8px; border-radius: 50%; background: #7ccf9e; box-shadow: 0 0 0 5px rgba(124, 207, 158, .1); }
.hero h1 { margin: 0; max-width: 640px; font-size: clamp(64px, 7vw, 104px); line-height: .88; letter-spacing: -.075em; font-weight: 650; }
.hero h1 em { color: var(--accent); font-style: normal; }
.hero-lede { max-width: 545px; margin: 32px 0 30px; color: #b8b4bb; font-size: 18px; line-height: 1.65; letter-spacing: -.015em; }
kbd { min-width: 28px; padding: 3px 7px; border: 1px solid rgba(255, 255, 255, .16); border-bottom-color: rgba(255, 255, 255, .3); border-radius: 6px; background: rgba(255, 255, 255, .07); color: #e9e7e2; box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .1); font-family: inherit; font-size: .76em; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.hero-note { margin: 18px 0 0; color: var(--faint); font-size: 12px; }

.hero-stage { position: relative; min-height: 565px; display: flex; align-items: center; perspective: 1200px; }
.stage-glow { position: absolute; width: 540px; height: 540px; right: -30px; top: 0; border-radius: 50%; background: radial-gradient(circle, rgba(198, 127, 211, .14), transparent 68%); filter: blur(10px); }
.demo-status { position: absolute; z-index: 8; top: 25px; left: 22px; height: 30px; padding: 0 10px; border: 1px solid var(--line); border-radius: 10px; display: flex; align-items: center; gap: 7px; background: rgba(15,15,18,.72); color: #d6d2d8; font-size: 10px; backdrop-filter: blur(18px); }
.demo-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px rgba(198,127,211,.1); }
.demo-status small { padding-left: 7px; border-left: 1px solid var(--line); color: #716e76; font-size: 8px; letter-spacing: .08em; text-transform: uppercase; }
.app-window { position: relative; z-index: 2; width: 100%; min-height: 432px; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 19px; background: rgba(27, 27, 32, .91); box-shadow: 0 50px 100px rgba(0,0,0,.5), 0 8px 30px rgba(0,0,0,.35); transform: rotateY(-3deg) rotateX(1.5deg); backdrop-filter: blur(30px); transition: opacity .55s ease, transform .7s cubic-bezier(.2,.8,.2,1), visibility 0s linear; }
.window-bar { height: 54px; padding: 0 18px; display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.025); color: #d8d5da; font-size: 12px; text-align: center; }
.traffic-lights { display: flex; gap: 7px; }
.traffic-lights i { width: 10px; height: 10px; border-radius: 50%; background: #56545a; }
.window-meta { color: var(--faint); text-align: right; }
.recipient-line { height: 52px; margin: 0 24px; border-bottom: 1px solid var(--line); display: flex; align-items: center; gap: 16px; color: #dedbe0; font-size: 13px; }
.recipient-line span { color: var(--faint); }
.message-editor { position: relative; min-height: 265px; padding: 26px; color: #e8e5e9; font-size: 17px; line-height: 1.6; }
.message-text { display: inline; margin: 0; }
.text-caret { display: inline-block; width: 1.5px; height: 20px; margin-left: 2px; vertical-align: -4px; background: var(--accent); animation: blink 1s steps(2) infinite; }
.editor-hint { position: absolute; left: 26px; top: 52px; margin: 0; color: #515057; font-size: 13px; transition: opacity .2s; }
.editor-hint.hidden { opacity: 0; }
.composer-footer { height: 60px; padding: 0 22px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); }
.format-tools { display: flex; align-items: center; gap: 18px; color: #77747c; font-size: 12px; }
.send-button { padding: 7px 14px; border-radius: 8px; background: var(--accent); color: #1a111b; font-size: 12px; font-weight: 700; }

.meeting-hero-window { position: absolute; z-index: 3; inset: 67px 0 45px; overflow: hidden; border: 1px solid rgba(255,255,255,.13); border-radius: 19px; background: rgba(23,23,27,.94); box-shadow: 0 50px 100px rgba(0,0,0,.5); opacity: 0; transform: translateY(18px) rotateY(3deg) scale(.97); pointer-events: none; backdrop-filter: blur(28px); transition: opacity .55s ease, transform .7s cubic-bezier(.2,.8,.2,1); }
.hero-meeting-bar { height: 55px; padding: 0 18px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; }
.hero-meeting-bar > span { display: flex; align-items: center; gap: 9px; font-size: 12px; font-weight: 650; }.hero-meeting-bar img { width: 27px; height: 27px; border-radius: 8px; }.hero-meeting-bar small { color: #74717a; font-size: 9px; }
.hero-meeting-content { height: calc(100% - 55px); padding: 20px; display: grid; grid-template-columns: .82fr 1.18fr; gap: 14px; }
.hero-summary, .screen-memory { min-width: 0; padding: 21px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.025); }
.hero-summary-label { color: var(--accent); font-size: 8px; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.hero-summary h3 { margin: 15px 0 10px; font-size: 20px; line-height: 1.15; letter-spacing: -.035em; }.hero-summary > p { margin: 0; color: #99969f; font-size: 10px; line-height: 1.6; }
.hero-summary > div { margin-top: 28px; padding-top: 16px; border-top: 1px solid var(--line); display: flex; align-items: flex-start; gap: 10px; }.hero-summary > div > i { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); font-size: 9px; font-style: normal; }.hero-summary > div span { display: grid; gap: 3px; }.hero-summary > div b { font-size: 9px; }.hero-summary > div small { color: #77737c; font-size: 8px; }
.screen-memory-title { display: flex; align-items: center; justify-content: space-between; color: #d7d3d9; font-size: 10px; font-weight: 650; }.screen-memory-title small { color: #706d75; font-size: 8px; font-weight: 500; }
.hero-captures { margin-top: 17px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.hero-capture { position: relative; height: 92px; padding: 10px; border: 1px solid rgba(255,255,255,.1); border-radius: 9px; overflow: hidden; background: #202027; }.hero-capture:first-child { grid-column: 1 / -1; height: 105px; }.hero-capture b { position: absolute; left: 9px; bottom: 8px; z-index: 2; color: rgba(255,255,255,.88); font-size: 8px; }.capture-time { position: absolute; z-index: 3; top: 7px; right: 7px; padding: 3px 5px; border-radius: 4px; background: rgba(5,5,7,.6); color: rgba(255,255,255,.7); font-size: 6px; }
.capture-board { background: linear-gradient(135deg,#2f2a3d,#17171d); }.capture-board i { position: relative; z-index: 1; width: 62%; height: 12px; margin: 5px 0; border-radius: 3px; display: block; background: rgba(255,255,255,.1); }.capture-board i:nth-of-type(2) { width: 82%; background: rgba(198,127,211,.3); }.capture-board::after { content:""; position:absolute; width:55px; height:55px; right:12px; bottom:13px; border-radius:10px; background: linear-gradient(145deg,rgba(255,255,255,.16),rgba(198,127,211,.1)); transform:rotate(5deg); }
.capture-chart { background: linear-gradient(145deg,#172224,#15171b); }.capture-chart i { position:absolute; bottom:20px; width:9px; border-radius:3px 3px 0 0; background:#6f9f91; }.capture-chart i:nth-of-type(1){left:15px;height:20px}.capture-chart i:nth-of-type(2){left:29px;height:37px}.capture-chart i:nth-of-type(3){left:43px;height:29px}.capture-chart i:nth-of-type(4){left:57px;height:49px;background:var(--accent)}
.capture-flow { background: linear-gradient(135deg,#232027,#17171d); }.capture-flow i { position:absolute; width:36px; height:18px; border:1px solid rgba(255,255,255,.15); border-radius:5px; background:rgba(255,255,255,.04); }.capture-flow i:nth-of-type(1){left:11px;top:22px}.capture-flow i:nth-of-type(2){right:10px;top:35px;border-color:rgba(198,127,211,.5)}.capture-flow i:nth-of-type(3){left:25px;bottom:18px}.capture-flow::after { content:""; position:absolute; left:40px; top:43px; width:45px; height:1px; background:rgba(255,255,255,.18); transform:rotate(18deg); }
.screen-memory > p { margin: 12px 0 0; display: grid; gap: 4px; }.screen-memory > p span { overflow: hidden; color: #aaa6ae; font-size: 8px; white-space: nowrap; text-overflow: ellipsis; }.screen-memory > p b { color: var(--accent); font-size: 7px; font-weight: 650; text-transform: uppercase; letter-spacing: .08em; }
.hero-stage.show-meeting .app-window { visibility:hidden; opacity: 0; transform: translateY(-15px) rotateY(-3deg) scale(.97); transition-delay:0s,0s,.55s; }.hero-stage.show-meeting .meeting-hero-window { opacity: 1; transform: none; }.hero-stage.show-meeting .dictation-bubble { opacity:0; transform:translateX(-50%) translateY(12px) scale(.95); pointer-events:none; }.hero-stage.show-meeting .hotkey-card { opacity:0; transform:translateY(12px) scale(.95); pointer-events:none; }

.recording-pill { border: 1px solid rgba(255,255,255,.28); border-radius: 999px; background: linear-gradient(110deg,#29292d 0%,#3b3540 24%,#252529 48%,#45334a 72%,#29292d 100%); background-size: 260% 100%; box-shadow: inset 0 1px 0 rgba(255,255,255,.12),0 18px 42px rgba(0,0,0,.36); animation: recordingPillShimmer 5.2s ease-in-out infinite; }
.dictation-bubble { position: absolute; z-index: 5; left: 50%; bottom: 30px; width: 320px; min-height: 64px; padding: 9px 13px 9px 17px; display: flex; align-items: center; gap: 11px; transform: translateX(-50%); backdrop-filter: blur(22px); transition: opacity .25s, transform .25s; }
.dictation-bubble.done { transform: translateX(-50%) scale(.95); opacity: 0; }
.recording-dot { flex: 0 0 9px; width: 9px; height: 9px; border-radius: 50%; background: #ff4f63; box-shadow: 0 0 14px rgba(255,79,99,.28); }
.bubble-label { flex: 1; color: #f5f2f5; font-size: 17px; font-weight: 650; letter-spacing: -.015em; }
.waveform { height: 25px; display: flex; align-items: center; gap: 3px; }
.waveform i { width: 3px; height: 7px; border-radius: 4px; background: #fff; animation: wave 1s ease-in-out infinite alternate; }
.waveform i:nth-child(2), .waveform i:nth-child(8) { animation-delay: -.5s; }
.waveform i:nth-child(3), .waveform i:nth-child(7) { animation-delay: -.2s; }
.waveform i:nth-child(4), .waveform i:nth-child(6) { animation-delay: -.65s; }
.waveform i:nth-child(5) { animation-delay: -.35s; }
.recording-stop { flex: 0 0 38px; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.9); box-shadow: inset 0 0 0 1px rgba(0,0,0,.06); }.recording-stop i { width: 11px; height: 11px; border-radius: 2px; background: #313136; }
.hotkey-card { position: absolute; z-index: 4; right: -28px; top: 38px; width: 152px; padding: 15px; border: 1px solid var(--line); border-radius: 15px; background: rgba(22,22,26,.88); box-shadow: 0 20px 45px rgba(0,0,0,.35); backdrop-filter: blur(20px); transform: rotate(4deg); transition: opacity .25s, transform .25s; }
.hotkey-card.hidden { opacity: 0; transform: translateY(-8px) rotate(4deg); }
.hotkey-card > span { display: block; margin-bottom: 10px; color: var(--faint); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.hotkey-card div { display: flex; align-items: center; gap: 5px; }
.hotkey-card kbd { padding: 5px 8px; font-size: 10px; }
.hotkey-card b { color: #5f5c64; font-size: 10px; }

.app-strip { border-block: 1px solid var(--line); background: #0d0d10; }
.app-strip-inner { min-height: 152px; display: grid; grid-template-columns: auto 1fr 250px; align-items: center; gap: 50px; }
.app-strip p { margin: 0; color: #9a969e; font-size: 13px; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; }
.app-cycle-rule { display: flex; align-items: center; gap: 14px; color: #55525a; }.app-cycle-rule span { width: 100%; height: 1px; background: linear-gradient(90deg,rgba(255,255,255,.04),rgba(198,127,211,.35)); }.app-cycle-rule i { font-style: normal; }
.app-cycle { position: relative; height: 68px; }
.app-cycle-item { position: absolute; inset: 0; display: flex; align-items: center; gap: 17px; opacity: 0; transform: translateY(12px) scale(.97); transition: opacity .45s ease, transform .55s cubic-bezier(.2,.8,.2,1); }.app-cycle-item.active { opacity: 1; transform: none; }
.app-cycle-item b { font-size: 21px; letter-spacing: -.03em; }
.real-app-icon { position: relative; flex: 0 0 58px; height: 58px; border: 1px solid rgba(255,255,255,.12); border-radius: 15px; display: grid; place-items: center; overflow: hidden; background: #1e1e23; box-shadow: 0 14px 28px rgba(0,0,0,.25); }
.notion-logo { background: #f4f3ef; color: #111; font: 800 34px/1 Georgia,serif; }
.slack-logo i { position:absolute; width:9px; height:27px; border-radius:6px; }.slack-logo i:nth-child(1){background:#36c5f0;transform:translate(-8px,-8px) rotate(90deg)}.slack-logo i:nth-child(2){background:#2eb67d;transform:translate(8px,-8px)}.slack-logo i:nth-child(3){background:#ecb22e;transform:translate(-8px,8px)}.slack-logo i:nth-child(4){background:#e01e5a;transform:translate(8px,8px) rotate(90deg)}
.mail-logo svg, .linear-logo svg, .messages-logo svg { width:100%; height:100%; }.mail-logo svg rect { fill:#388cf5; }.mail-logo svg path { fill:none; stroke:#fff; stroke-width:2.4; }.linear-logo svg circle { fill:#6960ef; }.linear-logo svg path { fill:none; stroke:rgba(255,255,255,.85); stroke-width:2.4; }.messages-logo svg rect { fill:#43c55b; }.messages-logo svg path { fill:#fff; }.infinity-logo { color:var(--accent); font-size:35px; }

.section { padding-block: 150px; }
.section-heading { max-width: 780px; margin-bottom: 65px; }
.section-heading h2, .final-cta h2, .privacy-copy h2 { margin: 0; font-size: clamp(44px, 5.2vw, 74px); line-height: .98; letter-spacing: -.055em; font-weight: 620; }
.section-heading h2 span { color: #77747d; }
.section-heading > p:last-child { max-width: 610px; margin: 25px 0 0; color: var(--muted); font-size: 17px; line-height: 1.65; }
.section-heading.centered { margin-inline: auto; text-align: center; }
.section-heading.centered > p:last-child { margin-inline: auto; }

.workflow-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.feature { min-height: 410px; padding: 34px; border: 1px solid var(--line); border-radius: var(--radius); display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; background: linear-gradient(145deg, #151519, #111114); }
.feature-large { min-height: 460px; grid-column: 1 / -1; display: grid; grid-template-columns: .7fr 1.3fr; align-items: center; gap: 50px; }
.feature-copy { position: relative; z-index: 2; max-width: 410px; }
.feature-number { display: block; margin-bottom: 26px; color: var(--accent); font: 11px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
.feature h3, .mac-card h3 { margin: 0 0 12px; font-size: 25px; line-height: 1.1; letter-spacing: -.035em; }
.feature p, .mac-card p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.speech-visual { position: relative; padding: 36px; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; background: #101013; box-shadow: inset 0 1px 0 rgba(255,255,255,.03); }
.speech-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(100deg,transparent 30%,rgba(198,127,211,.05),transparent 70%); transform:translateX(-100%); animation:scan 5.5s ease-in-out infinite; }
.rough-copy { color: #6f6c75; font-size: 17px; line-height: 1.7; text-decoration: line-through; text-decoration-color: rgba(198,127,211,.45); }
.transform-line { margin: 28px 0; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 13px; color: var(--accent); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.transform-line span { height: 1px; background: linear-gradient(to right, transparent, rgba(198,127,211,.35)); }
.transform-line span:last-child { background: linear-gradient(to left, transparent, rgba(198,127,211,.35)); }
.clean-copy { color: #f1eef2; font-size: 23px; line-height: 1.5; letter-spacing: -.02em; }
.cursor-visual { position: relative; min-height: 190px; margin: 24px -34px -34px; background: radial-gradient(circle at 50% 90%, rgba(198,127,211,.12), transparent 60%); }
.cursor-visual svg { position: absolute; width: 46px; right: 29%; bottom: 38px; fill: #f2eff3; filter: drop-shadow(0 8px 8px rgba(0,0,0,.4)); }
.cursor-line { position: absolute; right: 36%; bottom: 108px; width: 2px; height: 45px; background: var(--accent); }
.mini-bubble { position: absolute; left: 50%; bottom: 132px; width: 155px; height: 43px; padding: 0 23px; border: 1px solid var(--line); border-radius: 15px; display: flex; align-items: center; justify-content: center; gap: 5px; background: #1b1b20; transform: translateX(-50%); }
.mini-bubble span { width: 4px; height: 15px; border-radius: 3px; background: var(--accent); animation: wave 1s ease-in-out infinite alternate; }
.mini-bubble span:nth-child(even) { animation-delay: -.6s; }
.history-visual { margin-top: 25px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: #101013; }
.search-pill { height: 39px; margin-bottom: 10px; padding: 0 13px; border: 1px solid var(--line); border-radius: 10px; display: flex; align-items: center; color: #5f5c64; font-size: 11px; }
.history-row { padding: 13px 4px; border-bottom: 1px solid rgba(255,255,255,.06); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 11px; }
.history-row:last-child { border: 0; }
.history-app { width: 31px; height: 31px; border-radius: 9px; display: grid; place-items: center; background: #26262c; color: #d9d6dc; font-size: 11px; font-weight: 700; }
.history-row p { overflow: hidden; }
.history-row b, .history-row small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.history-row b { color: #c8c5ca; font-size: 11px; }.history-row small, .history-row time { color: #66636b; font-size: 9px; }

.meetings-section { overflow: hidden; border-block: 1px solid var(--line); background: #101013; }
.meetings-layout { display: grid; grid-template-columns: .95fr 1.05fr; align-items: center; gap: 50px; }
.meetings-copy { margin-bottom: 0; }
.meetings-copy h2 { font-size: clamp(48px,4.15vw,62px); }
.check-list { margin: 34px 0 0; padding: 0; list-style: none; display: grid; gap: 16px; color: #c9c6cb; font-size: 13px; }
.check-list span { width: 20px; height: 20px; margin-right: 10px; border-radius: 50%; display: inline-grid; place-items: center; background: var(--accent-soft); color: var(--accent); font-size: 10px; }
.meeting-window { min-width: 680px; min-height: 590px; border: 1px solid rgba(255,255,255,.13); border-radius: 20px; display: grid; grid-template-columns: 180px 1fr; overflow: hidden; background: #111114; box-shadow: 0 40px 90px rgba(0,0,0,.45); transform: rotate(.5deg); }
.meeting-sidebar { padding: 20px 13px; background: #0e0e11; }
.sidebar-title { display: flex; align-items: center; gap: 9px; margin: 0 8px 28px; font-size: 13px; }
.sidebar-title img { width: 27px; height: 27px; border-radius: 8px; }
.sidebar-switch { height: 32px; margin-bottom: 25px; padding: 3px; border-radius: 9px; display: grid; grid-template-columns: 1fr 1fr; background: rgba(0,0,0,.3); color: #77707a; font-size: 9px; text-align: center; }
.sidebar-switch span { display: grid; place-items: center; }.sidebar-switch .active { border: 1px solid rgba(255,255,255,.09); border-radius: 7px; background: #1b1b20; color: #ebe8ed; }
.meeting-sidebar > small { display: block; margin: 0 9px 8px; color: #756b75; font-size: 8px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.meeting-item { padding: 11px 10px; border-radius: 8px; }
.meeting-item.active { background: rgba(198,127,211,.15); }
.meeting-item b, .meeting-item span { display: block; }.meeting-item b { color: #cfc8cf; font-size: 10px; }.meeting-item span { margin-top: 4px; color: #756d76; font-size: 8px; }
.meeting-main { padding: 23px; }
.meeting-header { display: flex; justify-content: space-between; align-items: center; }
.meeting-header h3 { margin: 0 0 5px; font-size: 16px; }.meeting-header p { margin: 0; color: #776f78; font-size: 9px; }.meeting-header > span { padding: 7px 10px; border: 1px solid var(--line); border-radius: 7px; color: #b8afb8; font-size: 8px; }
.summary-card { margin: 20px 0 13px; padding: 20px; border: 1px solid rgba(255,255,255,.09); border-radius: 13px; background: #19191d; }
.summary-card small { color: var(--accent); font-size: 8px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }.summary-card h4 { margin: 12px 0 9px; font-size: 15px; }.summary-card > p { max-width: 430px; margin: 0; color: #aaa0aa; font-size: 10px; line-height: 1.55; }
.action-row { margin-top: 17px; padding-top: 14px; border-top: 1px solid var(--line); display: flex; gap: 10px; }.action-row > span { color: var(--accent); }.action-row p { margin: 0; color: #9f959f; font-size: 9px; line-height: 1.5; }.action-row b { color: #d3cbd3; }
.meeting-captures-label { margin: 16px 0 8px; display:flex; align-items:center; justify-content:space-between; }.meeting-captures-label > span { color:#d7d3d9; font-size:9px; font-weight:650; }.meeting-captures-label small { color:#6f6c74; font-size:7px; letter-spacing:0; text-transform:none; font-weight:500; }
.meeting-captures { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.meeting-capture { position:relative; height:78px; border:1px solid rgba(255,255,255,.09); border-radius:7px; overflow:hidden; }.meeting-capture > span { position:absolute; z-index:3; top:5px; right:5px; padding:2px 4px; border-radius:3px; background:rgba(0,0,0,.55); color:#b8b4bb; font-size:5px; }.meeting-capture b { position:absolute; z-index:2; left:7px; bottom:6px; color:#e2dfe4; font-size:6px; }.meeting-capture i { transform:scale(.72); transform-origin:left top; }
.transcript-row { margin: 10px 0 0; padding: 12px; border: 1px solid rgba(255,255,255,.07); border-radius: 11px; display: grid; grid-template-columns: 42px 1fr 30px; gap: 8px; background: #19191d; color: #aaa0aa; font-size: 9px; line-height: 1.5; }.transcript-row.you { border-color: rgba(198,127,211,.23); background: rgba(198,127,211,.08); }.transcript-row > span { color: var(--accent); font-weight: 700; }.transcript-row p { margin: 0; }.transcript-row time { color: #6e666f; }

.mac-section { padding-bottom: 80px; }
.mac-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-block: 1px solid var(--line); }
.mac-card { min-height: 270px; padding: 40px 30px; border-right: 1px solid var(--line); }
.mac-card:last-child { border: 0; }
.mac-symbol { width: 46px; height: 46px; margin-bottom: 55px; border: 1px solid var(--line); border-radius: 13px; display: grid; place-items: center; background: #151519; color: var(--accent); }
.mac-symbol svg, .privacy-icon svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }.mac-symbol .cursor-symbol { fill:currentColor; stroke:none; width:23px; height:23px; }
.mac-card h3 { font-size: 18px; }

.privacy-panel { position: relative; padding: 75px; border: 1px solid rgba(255,255,255,.13); border-radius: 30px; display: grid; grid-template-columns: .85fr 1.15fr; gap: 100px; overflow: hidden; background: rgba(24,22,28,.76); color: var(--text); box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 35px 90px rgba(0,0,0,.25); backdrop-filter: blur(35px); }
.privacy-panel::before { content:""; position:absolute; width:520px; height:520px; left:-210px; bottom:-280px; border-radius:50%; background:rgba(198,127,211,.45); filter:blur(95px); opacity:.7; }
.privacy-panel::after { content: ""; position: absolute; width: 420px; height: 420px; right: -180px; top: -240px; border-radius: 50%; background: rgba(104,94,239,.34); filter: blur(110px); }
.privacy-copy { position: relative; z-index: 1; }
.privacy-copy .eyebrow { color: #aaa6ae; }
.privacy-copy h2 { font-size: clamp(46px, 4.3vw, 64px); }
.privacy-copy > p:not(.eyebrow) { margin: 24px 0; color: #aaa6ae; font-size: 14px; line-height: 1.7; }
.privacy-copy a { display: inline-flex; gap: 20px; color: #f1eef2; font-size: 13px; font-weight: 650; }
.privacy-copy a span { color: var(--accent); }
.privacy-list { position:relative; z-index:1; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; background: transparent; }
.privacy-list > div { padding: 24px; border:1px solid rgba(255,255,255,.09); border-radius:16px; display: flex; gap: 17px; background: rgba(255,255,255,.045); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); backdrop-filter:blur(18px); }
.privacy-icon { flex: 0 0 38px; height: 38px; border:1px solid rgba(198,127,211,.2); border-radius: 11px; display: grid; place-items: center; background: rgba(198,127,211,.1); color: var(--accent); }
.privacy-list p { margin: 0; }.privacy-list b, .privacy-list small { display: block; }.privacy-list b { margin: 3px 0 8px; font-size: 13px; }.privacy-list small { color: #8f8b94; font-size: 11px; line-height: 1.55; }

.faq-section { display: grid; grid-template-columns: .65fr 1.35fr; gap: 100px; }
.faq-list { border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item button { width:100%; min-height:83px; padding:0; border:0; display:flex; align-items:center; justify-content:space-between; gap:20px; background:transparent; cursor:pointer; color:#dedbe0; font-size:16px; text-align:left; }
.faq-item button span { color:var(--faint); font-size:21px; font-weight:300; transition:transform .35s cubic-bezier(.2,.8,.2,1), color .25s; }.faq-item button[aria-expanded="true"] span { color:var(--accent); transform:rotate(45deg); }
.faq-answer { display:grid; grid-template-rows:0fr; opacity:0; transition:grid-template-rows .42s cubic-bezier(.2,.8,.2,1), opacity .32s ease; }.faq-answer > div { min-height:0; overflow:hidden; }.faq-item.open .faq-answer { grid-template-rows:1fr; opacity:1; }
.faq-answer p { max-width:650px; margin:-5px 45px 27px 0; color:var(--muted); font-size:13px; line-height:1.7; transform:translateY(-7px); transition:transform .42s cubic-bezier(.2,.8,.2,1); }.faq-item.open .faq-answer p { transform:none; }

.final-cta { position: relative; min-height: 520px; margin-bottom: 80px; padding: 70px 80px; border:1px solid rgba(255,255,255,.14); border-radius: 30px; overflow: hidden; display: flex; justify-content: flex-end; align-items: center; background: #18131b; color: var(--text); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 40px 100px rgba(0,0,0,.3); }
.final-cta::before { content: ""; position: absolute; width:680px; height:680px; right:-120px; top:-350px; border-radius:50%; background:rgba(198,127,211,.7); filter:blur(115px); opacity:.75; }
.final-cta::after { content:""; position:absolute; width:500px; height:500px; left:-160px; bottom:-350px; border-radius:50%; background:rgba(104,94,239,.48); filter:blur(120px); }
.final-cat { position:absolute; z-index:2; left:0; bottom:0; width:50%; height:100%; }
.final-cat img { position:absolute; z-index:2; width:455px; left:34px; bottom:72px; filter:drop-shadow(0 28px 24px rgba(0,0,0,.3)); }
.cat-perch { position:absolute; z-index:1; left:62px; bottom:45px; width:390px; height:90px; padding:24px 26px; border:1px solid rgba(255,255,255,.16); border-radius:18px; display:grid; gap:5px; background:rgba(22,22,27,.68); box-shadow:0 18px 50px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.09); backdrop-filter:blur(24px); }.cat-perch span { font-size:12px; font-weight:650; }.cat-perch span i { width:7px; height:7px; margin-right:7px; border-radius:50%; display:inline-block; background:#7ccf9e; box-shadow:0 0 0 4px rgba(124,207,158,.12); }.cat-perch small { color:#96929b; font-size:9px; }
.final-cta > div:last-child { position:relative; z-index:3; width:50%; }.final-cta .eyebrow { color: #c4bec7; }
.final-cta h2 { font-size: clamp(48px, 5vw, 72px); }
.final-cta p:not(.eyebrow) { max-width: 470px; margin: 22px 0 28px; color: #b3afb7; font-size: 15px; line-height: 1.6; }
.final-cta small { display: block; margin-top: 13px; color: #89858e; font-size: 10px; }

.site-footer { min-height: 130px; display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; color: #67646c; font-size: 11px; }
.site-footer .brand { color: #c9c6cb; font-size: 15px; }.site-footer .brand img { width: 28px; height: 28px; border-radius: 8px; }.site-footer > p { text-align: center; }.site-footer > div { display: flex; justify-content: flex-end; gap: 24px; }.site-footer a:hover { color: #c9c6cb; }

.reveal { opacity: 0; transform: translateY(22px); transition: opacity .75s cubic-bezier(.2,.7,.2,1), transform .75s cubic-bezier(.2,.7,.2,1); }
.reveal.visible { opacity: 1; transform: none; }
@keyframes blink { 50% { opacity: 0; } }
@keyframes wave { from { height: 4px; opacity: .55; } to { height: 15px; opacity: 1; } }
@keyframes scan { 0%,18% { transform:translateX(-100%); } 58%,100% { transform:translateX(100%); } }

@media (max-width: 1050px) {
  .hero { grid-template-columns: 1fr; min-height: auto; padding-top: 145px; }
  .hero-copy { max-width: 720px; }
  .hero-stage { width: min(760px, 100%); margin-inline: auto; }
  .app-strip-inner { grid-template-columns: auto 1fr 220px; padding-block: 24px; }
  .meetings-layout { grid-template-columns: 1fr; }
  .meeting-window { min-width: 760px; }
  .mac-grid { grid-template-columns: 1fr 1fr; }
  .mac-card:nth-child(2) { border-right: 0; }.mac-card:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .privacy-panel { padding: 60px; gap: 50px; }
  .final-cat img { left: -45px; }
  .cat-perch { left: 12px; width: 340px; }
}

@media (max-width: 760px) {
  .shell { width: min(100% - 32px, var(--shell)); }
  .nav { height: 68px; }
  .nav > .brand { position: relative; z-index: 2; }
  .menu-button { position: relative; z-index: 2; display: grid; place-content: center; gap: 6px; }
  .menu-button span:not(.sr-only) { width: 20px; height: 1px; display: block; background: #ddd9df; transition: transform .2s; }
  .menu-button[aria-expanded="true"] span:nth-last-child(2) { transform: translateY(3.5px) rotate(45deg); }.menu-button[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
  .nav-links { position: fixed; z-index: 1; top: 0; left: 0; width: 100vw; height: 100dvh; padding: 110px 24px 40px; display: none; flex-direction: column; align-items: stretch; gap: 0; background: #0b0b0d; font-size: 24px; }
  .nav-links.open { display: flex; }.nav-links > a { padding: 18px 0; border-bottom: 1px solid var(--line); }.nav-links .button { margin-top: 20px; border: 0; }
  .hero { padding: 126px 0 70px; gap: 62px; }
  .hero h1 { font-size: clamp(58px, 19vw, 78px); }
  .hero-lede { font-size: 16px; }
  .hero-actions { align-items: stretch; }.hero-actions .button { flex: 1 1 200px; }
  .hero-stage { min-height: 470px; margin-inline: 0; }
  .stage-glow { width: 100%; right: 0; }
  .demo-status { top: -26px; left: 0; }
  .app-window { min-height: 390px; transform: none; }
  .meeting-hero-window { inset: 28px 0 28px; }
  .hero-meeting-content { grid-template-columns: 1fr; }.hero-summary { display:none; }.hero-captures { grid-template-columns:1.1fr .9fr; }.hero-capture:first-child { grid-column:auto; height:auto; }.hero-capture { height:106px; }.screen-memory { padding:18px; }
  .message-editor { min-height: 220px; }
  .dictation-bubble { width: calc(100% - 24px); bottom: 5px; }
  .hotkey-card { right: -5px; top: -38px; }
  .app-strip-inner { min-height:132px; grid-template-columns:1fr 155px; gap:20px; }.app-cycle-rule { display:none; }.app-strip p { font-size:10px; line-height:1.5; }.app-cycle-item { gap:10px; }.app-cycle-item b { font-size:15px; }.real-app-icon { flex-basis:48px; height:48px; border-radius:13px; }
  .section { padding-block: 100px; }
  .section-heading { margin-bottom: 45px; }
  .section-heading h2, .final-cta h2, .privacy-copy h2 { font-size: clamp(43px, 13vw, 62px); }
  .workflow-grid, .feature-large { display: grid; grid-template-columns: 1fr; }
  .feature { min-height: 390px; padding: 28px; gap: 30px; }.feature-large { min-height: 480px; padding:28px; gap:30px; }
  .speech-visual { padding: 26px; }.clean-copy { font-size: 19px; }
  .cursor-visual { margin: 20px -28px -28px; }
  .meetings-layout { grid-template-columns: minmax(0, 1fr); gap: 60px; min-width: 0; }
  .meetings-copy { min-width: 0; }
  .meeting-window { width: 700px; min-width: 0; max-width: none; transform: translateX(-12px) scale(.74); transform-origin: left top; margin-bottom: -138px; }
  .mac-grid { grid-template-columns: 1fr; }.mac-card { min-height: 220px; border-right: 0; border-bottom: 1px solid var(--line) !important; }.mac-card:last-child { border-bottom: 0 !important; }.mac-symbol { margin-bottom: 35px; }
  .privacy-panel { padding: 42px 28px; grid-template-columns: 1fr; gap: 50px; }.privacy-list { grid-template-columns: 1fr; }
  .faq-section { grid-template-columns: 1fr; gap: 0; }.faq-section .section-heading { margin-bottom: 20px; }
  .final-cta { min-height: 790px; padding: 50px 28px; align-items: flex-start; }.final-cta > div:last-child { width: 100%; }.final-cat { width:100% !important; height:410px; left:0; bottom:0; }.final-cat img { width:365px; left:50%; bottom:72px; transform:translateX(-50%); }.cat-perch { width:320px; left:50%; bottom:45px; transform:translateX(-50%); padding-inline:22px; }
  .site-footer { padding-block: 45px; grid-template-columns: 1fr; gap: 28px; text-align: center; }.site-footer .brand { margin-inline: auto; }.site-footer > div { justify-content: center; flex-wrap: wrap; }
}

/* Product-story refinement: synchronized hero states and compact demos. */
.nav { position: relative; }
.nav-links { position: absolute; left: 50%; transform: translateX(-50%); }
.nav-download { margin-left: auto; }
.mobile-download { display: none; }

.hero { min-height: 760px; padding: 108px 0 68px; align-items: start; }
.hero-copy { align-self: start; margin-top: 30px; }
.hero-title-stack { position: relative; height: 186px; transition: height .6s cubic-bezier(.2,.8,.2,1); }
.hero-title-stack h1 { transition: opacity .5s ease, transform .65s cubic-bezier(.2,.8,.2,1); }
.hero-title-meeting { position: absolute; inset: 0; max-width: 620px !important; font-size: clamp(54px, 5.35vw, 80px) !important; line-height: .94 !important; opacity: 0; transform: translateY(18px); }
.hero.mode-meeting .hero-title-stack { height: 250px; }
.hero-lede-stack { position: relative; min-height: 0; display: grid; }
.hero-lede { grid-area: 1 / 1; margin: 24px 0 28px; transition: opacity .45s ease, transform .6s cubic-bezier(.2,.8,.2,1); }
.hero-lede-meeting { position: static; opacity: 0; transform: translateY(12px); }
.hero.mode-meeting .hero-title-dictation, .hero.mode-meeting .hero-lede-dictation { opacity: 0; transform: translateY(-14px); }
.hero.mode-meeting .hero-title-meeting, .hero.mode-meeting .hero-lede-meeting { opacity: 1; transform: none; }
.hero-stage { min-height: 540px; }
.stage-glow { z-index: 0; width: 100%; height: 230px; right: 0; top: auto; bottom: -28px; border-radius: 50%; background: radial-gradient(ellipse at center, rgba(211,133,224,.3), rgba(198,127,211,.13) 38%, rgba(154,91,188,.05) 58%, transparent 74%); filter: none; opacity: .92; pointer-events: none; }

@media (min-width: 1051px) {
  .hero-copy { min-height: 540px; display: flex; flex-direction: column; }
  .hero-actions { margin-top: auto; }
}

.message-editor { isolation: isolate; }
.message-editor::after { display: none; }
.message-text { background: none; color: #e8e5e9; -webkit-text-fill-color: currentColor; text-shadow: none; transition: color .2s ease; }
.app-window.is-polishing .message-text { color: transparent; background: linear-gradient(100deg,#b474c9 0%,#e9c8f1 25%,#a85bc4 50%,#f2d8f6 72%,#b474c9 100%); background-size: 240% 100%; background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-shadow: none; animation: heroTextShimmer 2.6s linear infinite; }
.app-window.is-polished .message-text { background: none; color: #f5eff6; -webkit-text-fill-color: currentColor; text-shadow: none; animation: none; }

.meeting-hero-window { inset: 36px 0 34px; background: rgba(22,22,26,.98); transform-origin: 50% 46%; }
.hero-stage.show-meeting .meeting-hero-window { transform: translateY(-2px) rotateY(3deg) rotateX(-1deg); }
.meeting-window-bar { position: relative; }
.hero-meeting-shell { height: calc(100% - 54px); display: grid; grid-template-columns: 138px minmax(0,1fr); }
.hero-meeting-sidebar { padding: 13px 10px; border-right: 1px solid var(--line); background: #0e0e11; opacity: 0; transform: translateX(-8px); transition: opacity .45s ease, transform .55s cubic-bezier(.2,.8,.2,1); }
.hero-side-switch { height: 27px; padding: 3px; border-radius: 8px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; background: rgba(0,0,0,.34); color: #6f6b73; font-size: 6px; text-align: center; }.hero-side-switch b { height: 21px; border: 1px solid rgba(255,255,255,.1); border-radius: 6px; display: grid; place-items: center; background: #1b1b20; color: #efeaf0; }
.hero-side-search { height: 25px; margin: 9px 0 12px; padding: 0 8px; border: 1px solid rgba(198,127,211,.35); border-radius: 8px; display: flex; align-items: center; gap: 5px; color: #68646c; font-size: 6px; }.hero-side-search span { color: var(--accent); font-size: 9px; }
.hero-meeting-sidebar > small { display: block; margin: 0 7px 5px; color: #6c6770; font-size: 6px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.hero-side-item { padding: 8px 7px; border-bottom: 1px solid rgba(255,255,255,.05); border-radius: 7px; }.hero-side-item.active { border-bottom-color: transparent; background: rgba(198,127,211,.14); }.hero-side-item b,.hero-side-item span { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }.hero-side-item b { color: #c8c3cb; font-size: 7px; }.hero-side-item span { margin-top: 3px; color: #68646c; font-size: 5px; }
.meeting-note-page { min-width: 0; height: 100%; padding: 12px 14px; display: grid; grid-template-rows: auto; grid-auto-rows: auto; align-content: start; gap: 6px; overflow: hidden; }
.meeting-note-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.meeting-note-heading small { color: #706d75; font-size: 7px; }.meeting-note-heading h3 { margin: 4px 0 0; font-size: 15px; letter-spacing: -.025em; }.meeting-note-heading > span { flex: 0 0 auto; padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; color: #918d96; font-size: 7px; }.meeting-note-heading > span i { width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; display: inline-block; background: var(--accent); }
.generated-note, .meeting-screen-row { border: 1px solid rgba(255,255,255,.09); border-radius: 11px; background: rgba(255,255,255,.028); }
.generated-note { padding: 6px 9px; }
.generated-note small { color: var(--accent); font-size: 6px; font-weight: 750; letter-spacing: .11em; text-transform: uppercase; }.generated-note p { margin: 2px 0 0; color: #aba7af; font-size: 6.5px; line-height: 1.25; }
.generated-note-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.hero-generated-grid { grid-template-columns: 1fr; gap: 5px; }
.meeting-screen-row { min-height: 0; padding: 7px 8px 6px; display: block; }
.meeting-screen-row > small { display: block; margin-bottom: 5px; color: var(--accent); font-size: 6px; font-weight: 750; letter-spacing: .11em; text-transform: uppercase; }
.hero-screen-strip { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
.hero-screen-item { min-width: 0; }.hero-screen-item .hero-capture { width: 100%; height: auto; aspect-ratio: 16 / 9; border-radius: 7px; }.hero-screen-item time { display: block; margin-top: 3px; color: #77727b; font: 5px ui-monospace,SFMono-Regular,Menlo,monospace; }
.meeting-note-heading, .generated-note, .meeting-screen-row { opacity: 0; transform: translateY(10px); transition: opacity .45s ease, transform .55s cubic-bezier(.2,.8,.2,1); }
.hero-stage.show-meeting .hero-meeting-sidebar { opacity: 1; transform: none; transition-delay: .14s; }.hero-stage.show-meeting .meeting-note-heading { opacity: 1; transform: none; transition-delay: .22s; }.hero-stage.show-meeting .overview-note { opacity: 1; transform: none; transition-delay: .42s; }.hero-stage.show-meeting .agreement-note { opacity: 1; transform: none; transition-delay: .58s; }.hero-stage.show-meeting .action-note { opacity: 1; transform: none; transition-delay: .68s; }.hero-stage.show-meeting .question-note { opacity: 1; transform: none; transition-delay: .78s; }.hero-stage.show-meeting .meeting-screen-row { opacity: 1; transform: none; transition-delay: .94s; }

.fish-order-board { background: linear-gradient(145deg,#281f2c,#17171c); }.fish-order-board i { position:absolute; left:10px; height:6px; border-radius:4px; background:rgba(255,255,255,.11); }.fish-order-board i:nth-of-type(1){top:17px;width:43%}.fish-order-board i:nth-of-type(2){top:28px;width:67%;background:rgba(198,127,211,.42)}.fish-order-board i:nth-of-type(3){top:39px;width:52%}.fish-order-board::after { content:"12"; position:absolute; right:10px; top:17px; width:30px; height:28px; border:1px solid rgba(198,127,211,.25); border-radius:8px; display:grid; place-items:center; background:rgba(198,127,211,.1); color:var(--accent); font-size:8px; font-weight:700; }

.app-strip-inner { min-height: 108px; display: flex; justify-content: center; gap: 12px; }
.app-strip p.app-sentence { flex: 0 0 auto; color: #b9b5bd; font-size: 20px; font-weight: 560; letter-spacing: -.025em; text-transform: none; }
.app-strip p.app-sentence span { color: #6f6c74; }
.app-cycle { flex: 0 0 54px; width: 54px; height: 54px; }
.app-cycle-item { justify-content: center; gap: 0; }
.app-cycle-item b { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.real-app-icon { flex-basis: 48px; height: 48px; border: 0; border-radius: 13px; overflow: visible; background: transparent; box-shadow: 0 14px 28px rgba(0,0,0,.3), 0 0 0 1px rgba(255,255,255,.08); }
.real-app-icon img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }

.workflow-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.feature, .feature-large { min-width: 0; min-height: 455px; aspect-ratio: .87; padding: 30px; display: flex; grid-column: auto; gap: 24px; }
.feature-copy { max-width: none; }
.feature-number { margin-bottom: 22px; }
.feature h3 { font-size: 23px; }
.section-heading h2 span em { color: var(--accent); font-style: normal; }
.speech-visual { min-height: 205px; margin-top: auto; padding: 18px; display: flex; flex-direction: column; justify-content: space-between; }
.speech-visual::after { display: none; }
.feature-compose { position: relative; z-index: 1; min-height: 116px; color: #a8a4ac; font-size: 13px; line-height: 1.55; }
.feature-raw, .feature-clean { position: absolute; inset: 0; }
.feature-raw { opacity: 1; background: none; color: #a8a4ac; -webkit-text-fill-color: currentColor; transform: none; filter: none; }.feature-clean { display: none; }
.feature-raw i { width: 1px; height: 16px; margin-left: 2px; display: inline-block; vertical-align: -3px; background: var(--accent); animation: blink 1s steps(2) infinite; }
.speech-visual.is-polishing .feature-raw { color: transparent; background: linear-gradient(100deg,#b474c9 0%,#e9c8f1 25%,#a85bc4 50%,#f2d8f6 72%,#b474c9 100%); background-size: 240% 100%; background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: heroTextShimmer 2.6s linear infinite; }
.speech-visual.is-polished .feature-raw { background: none; color: #f1edf2; -webkit-text-fill-color: currentColor; animation: none; }.speech-visual.is-polished .feature-raw i { opacity: 0; }
.feature-polish-state { position: relative; z-index: 1; width: min(230px,100%); min-height: 46px; margin-inline: auto; padding: 6px 8px 6px 12px; display: flex; align-items: center; gap: 8px; color: #f4f1f4; font-size: 11px; letter-spacing: -.01em; text-transform: none; }
.feature-recording-pill .recording-dot { flex-basis: 7px; width: 7px; height: 7px; }.feature-recording-pill .waveform { height: 22px; gap: 2px; }.feature-recording-pill .waveform i { width: 2.5px; }.feature-recording-pill b { flex: 1; color: #f4f1f4; font-size: 11px; font-weight: 650; }.feature-recording-pill .recording-stop { flex-basis: 30px; width: 30px; height: 30px; }.feature-recording-pill .recording-stop i { width: 9px; height: 9px; }
.speech-visual.is-polishing { border-color: var(--line); box-shadow: inset 0 1px 0 rgba(255,255,255,.03); }

.feature-input { background: radial-gradient(ellipse 90% 54% at 58% 92%, rgba(198,127,211,.17), rgba(198,127,211,.06) 42%, transparent 73%), linear-gradient(145deg,#151519,#111114); }
.input-demo { position: relative; min-height: 205px; margin: auto -30px -30px; padding: 24px 30px; background: transparent; }
.input-demo > small { color: #69666e; font-size: 8px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.fake-input { position: absolute; left: 30px; right: 30px; top: 52px; height: 48px; padding: 0 14px; border: 1px solid var(--line); border-radius: 12px; display: flex; align-items: center; background: #121216; color: #56535b; font-size: 10px; animation: inputFocus 5.4s ease-in-out infinite; }.fake-input > i { width: 1px; height: 17px; margin-left: 2px; background: var(--accent); opacity: 0; animation: inputCaret 5.4s ease-in-out infinite; }
.input-demo .mini-bubble { top: 112px; bottom: auto; width: 145px; opacity: 0; animation: dictationMenu 5.4s ease-in-out infinite; }
.input-demo .mini-bubble { padding: 0 28px; border-color: rgba(255,255,255,.22); border-radius: 999px; background: linear-gradient(110deg,#29292d,#403545,#29292d); background-size: 240% 100%; box-shadow: inset 0 1px 0 rgba(255,255,255,.1),0 15px 30px rgba(0,0,0,.3); animation:dictationMenu 5.4s ease-in-out infinite,recordingPillShimmer 5.2s ease-in-out infinite; }.input-demo .mini-bubble::before { content:""; position:absolute; left:13px; top:50%; width:7px; height:7px; border-radius:50%; background:#ff4f63; transform:translateY(-50%); }.input-demo .mini-bubble::after { content:""; position:absolute; right:13px; top:50%; width:9px; height:9px; border:7px solid rgba(255,255,255,.9); border-radius:50%; background:#313136; box-sizing:content-box; transform:translateY(-50%); }
.input-demo > svg { left: 72%; right: auto; top: 145px; bottom: auto; width: 34px; animation: cursorApproach 5.4s cubic-bezier(.2,.8,.2,1) infinite; }

.history-visual { min-height: 205px; margin-top: auto; padding: 14px; }
.search-pill { position: relative; height: 44px; gap: 9px; overflow: hidden; }.search-pill > b { flex: 1; min-width: 0; min-height: 1em; color: #c5c1c8; font-size: 10px; font-weight: 500; }.search-icon { flex:0 0 19px; width:19px; height:19px; color:#aaa4ae !important; }.search-icon svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; }.search-clear { flex: 0 0 23px; width: 23px; height: 23px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.06); color: #aaa5ae !important; font-size: 15px; line-height: 1; }
.history-app { width: 38px; height: 38px; border-radius: 11px; font-size: 13px; }
.history-row { transition: opacity .3s ease, background .35s ease, transform .35s ease; }.history-row.matched { margin-inline: -5px; padding-inline: 9px; border-radius: 9px; background: rgba(198,127,211,.1); transform: translateY(-1px); }.history-row.matched .history-app { color: var(--accent); box-shadow: 0 0 22px rgba(198,127,211,.16); }
.history-row mark { padding: 1px 2px; border-radius: 4px; background: transparent; color: inherit; transition: color .3s, background .35s, box-shadow .35s; }.history-row.matched mark { background: rgba(198,127,211,.18); color: #f2d7f7; box-shadow: 0 0 14px rgba(198,127,211,.2); animation: wordMatch .55s cubic-bezier(.2,.8,.2,1) both; }

.meetings-layout { align-items: start; }
.meetings-copy > p:not(.eyebrow) { max-width:610px; margin:25px 0 0; color:var(--muted); font-size:17px; line-height:1.65; }
.meeting-window { min-height: 540px; height: 540px; }
.sidebar-title { margin-bottom: 16px; }
.sidebar-switch { margin-bottom: 10px; }
.sidebar-search { height: 32px; margin: 0 0 18px; padding: 0 9px; border: 1px solid rgba(198,127,211,.28); border-radius: 9px; display: flex; align-items: center; gap: 6px; color: #6f6b73; font-size: 8px; }.sidebar-search span { color: var(--accent); font-size: 11px; }
.meeting-main { position: relative; min-width: 0; padding: 20px; }
.meeting-view-toggle { padding: 3px; border: 1px solid rgba(255,255,255,.07); border-radius: 9px; display: flex; gap: 2px; background: rgba(0,0,0,.28); }
.meeting-view-toggle button { min-width: 64px; height: 27px; padding: 0 9px; border: 0; border-radius: 7px; background: transparent; color: #74717a; cursor: pointer; font-size: 8px; transition: color .25s, background .25s, box-shadow .25s; }.meeting-view-toggle button.active { background: rgba(198,127,211,.18); color: #eddcf0; box-shadow: inset 0 0 0 1px rgba(198,127,211,.22); }
.meeting-view-stack { position: relative; min-height: 445px; overflow: hidden; }
.meeting-view { position: absolute; inset: 0; opacity: 0; visibility: hidden; transform: translateY(12px) scale(.992); pointer-events: none; transition: opacity .5s ease, transform .6s cubic-bezier(.2,.8,.2,1), visibility 0s linear .55s; }.meeting-view.active { opacity: 1; visibility: visible; transform: none; pointer-events: auto; transition-delay: 0s; }
.meeting-overview .overview-stack { margin: 12px 0 0; padding: 0; border: 0; display: grid; gap: 5px; background: transparent; }
.overview-block { padding: 7px 10px; border: 1px solid rgba(255,255,255,.08); border-radius: 9px; background: rgba(255,255,255,.025); }
.overview-block small { color: var(--accent); font-size: 6px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.overview-block h4 { margin: 4px 0 3px; font-size: 12px; }
.overview-block p { margin: 3px 0 0; color: #96919a; font-size: 7px; line-height: 1.35; }
.overview-summary { padding-block: 8px; }
.overview-screens { padding-top: 1px; }
.summary-mini-grid { margin-top: 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }.summary-mini-grid > div { padding: 9px; border: 1px solid rgba(255,255,255,.07); border-radius: 8px; background: rgba(255,255,255,.02); }.summary-mini-grid small { color: var(--accent); font-size: 6px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }.summary-mini-grid p { margin: 5px 0 0; color: #8f8b94; font-size: 7px; line-height: 1.4; }
.meeting-captures-label { margin: 3px 0 6px; }.meeting-capture { width: 100%; height: auto; aspect-ratio: 16 / 9; border-radius: 9px; }.meeting-screen-item { min-width: 0; transition: transform .4s; }.meeting-screen-item time { display: block; margin-top: 4px; color: #8c8790; font: 7px ui-monospace,SFMono-Regular,Menlo,monospace; }.meeting-screen-item:nth-child(3) time { color: var(--accent); }.action-row { margin-top: 12px; padding-top: 10px; }
.overview-block { transition: border-color .4s, box-shadow .5s; }.meeting-window.overview-emphasis .overview-summary { border-color: rgba(198,127,211,.24); box-shadow: inset 0 0 28px rgba(198,127,211,.045); }
.meeting-capture { transition: border-color .35s, box-shadow .4s, transform .4s; }.meeting-window.screen-emphasis [data-overview-screen] { transform: translateY(-2px) scale(1.025); }.meeting-window.screen-emphasis [data-overview-screen] .meeting-capture { border-color: rgba(198,127,211,.72); box-shadow: 0 0 0 3px rgba(198,127,211,.1),0 0 28px rgba(198,127,211,.22); }
.meeting-transcript { padding-top: 12px; display: grid; align-content: start; gap: 7px; }
.transcript-intro { margin: 0 0 3px; color: #6f6b73; font-size: 8px; }
.speaker-turn { min-width: 0; padding: 8px 10px; border: 1px solid rgba(255,255,255,.07); border-radius: 11px; display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 9px; background: rgba(255,255,255,.025); opacity: 0; transform: translateY(9px); transition: opacity .42s ease, transform .5s cubic-bezier(.2,.8,.2,1); }.speaker-turn img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; background: #202025; }.speaker-turn > div { min-width: 0; }.speaker-turn header { display: flex; align-items: center; gap: 7px; }.speaker-turn header b { color: #c8c3cb; font-size: 9px; }.speaker-turn header time { color: #68646c; font: 7px ui-monospace,SFMono-Regular,Menlo,monospace; }.speaker-turn p { margin: 4px 0 0; color: #aaa6ae; font-size: 8px; line-height: 1.4; }.speaker-you { border-color: rgba(198,127,211,.23); background: rgba(198,127,211,.08); }.speaker-you header b { color: var(--accent); }.speaker-milo header b { color: #efa45d; }
.transcript-screen { width: min(310px,78%); padding: 0; border: 0; display: block; background: transparent; opacity: 0; transform: translateY(9px); transition: opacity .42s ease,transform .5s cubic-bezier(.2,.8,.2,1); }.transcript-screen > time { display:block; margin-top:4px; color:#8c8790; font:7px ui-monospace,SFMono-Regular,Menlo,monospace; }
.fish-order-screen { position: relative; width:100%; height:auto; aspect-ratio:16 / 9; padding: 12px; border: 1px solid rgba(255,255,255,.1); border-radius: 10px; overflow: hidden; display: grid; align-content: start; gap: 3px; background: linear-gradient(145deg,#2b2130,#18171c); transition:border-color .4s,box-shadow .45s,transform .45s; }.fish-order-screen span { color: #8c8790; font-size: 7px; text-transform: uppercase; letter-spacing: .08em; }.fish-order-screen b { color: #eee8ef; font-size: 18px; }.fish-order-screen small { color: var(--accent); font-size: 7px; }.fish-order-screen i { position: absolute; right: 13px; width: 44px; height: 5px; border-radius: 4px; background: rgba(255,255,255,.1); }.fish-order-screen i:nth-of-type(1){top:20px}.fish-order-screen i:nth-of-type(2){top:31px;width:58px;background:rgba(198,127,211,.35)}.fish-order-screen i:nth-of-type(3){top:42px;width:36px}
.meeting-transcript.active .speaker-turn, .meeting-transcript.active .transcript-screen { opacity: 1; transform: none; }.meeting-transcript.active [data-transcript-turn]:nth-child(2){transition-delay:.12s}.meeting-transcript.active [data-transcript-turn]:nth-child(3){transition-delay:.26s}.meeting-transcript.active .transcript-screen{transition-delay:.42s}.meeting-transcript.active [data-transcript-turn]:nth-child(5){transition-delay:.58s}.meeting-transcript.active [data-transcript-turn]:nth-child(6){transition-delay:.72s}
.meeting-window.screen-matched .transcript-screen .fish-order-screen { border-color: rgba(198,127,211,.7); box-shadow: 0 0 0 3px rgba(198,127,211,.1),0 0 32px rgba(198,127,211,.24); animation: screenMatched 1.2s cubic-bezier(.2,.8,.2,1) both; }
.meeting-benefits { position:relative; min-height:154px; margin-top:28px; display:grid; border:0; }
.meeting-benefits article { grid-area:1 / 1; min-height:154px; padding:22px 24px; border:1px solid var(--line); border-radius:24px; display:flex; flex-direction:column; background:linear-gradient(145deg,#151519,#111114); opacity:0; visibility:hidden; transform:translateY(10px) scale(.985); transition:opacity .42s ease,visibility 0s linear 0s,transform .5s cubic-bezier(.2,.8,.2,1),border-color .35s; }.meeting-benefits span { color:var(--accent); font:9px ui-monospace,SFMono-Regular,Menlo,monospace; }.meeting-benefits h3 { margin:auto 0 7px; font-size:18px; letter-spacing:-.025em; }.meeting-benefits p { margin:0; color:var(--muted); font-size:12px; line-height:1.55; }
.meetings-section.phase-audio [data-benefit="speakers"], .meetings-section.phase-overview [data-benefit="overview"], .meetings-section.phase-transcript [data-benefit="speakers"], .meetings-section.phase-screen [data-benefit="screen"] { opacity:1; visibility:visible; transform:none; border-color:rgba(198,127,211,.2); transition-delay:0s; }

.apple-mark-animation { position: relative; width: 74px; height: 86px; margin: 0 auto 26px; display: grid; place-items: center; }.apple-mark-animation > i { position: absolute; inset: 12px -8px 2px; border-radius: 50%; background: radial-gradient(circle,rgba(198,127,211,.5),rgba(198,127,211,.15) 46%,transparent 72%); animation: appleGlow 3.2s ease-in-out infinite; }.apple-mark-animation svg { position: relative; z-index: 1; width: 64px; height: 64px; fill: #fff; filter: drop-shadow(0 10px 24px rgba(198,127,211,.2)); animation: appleFloat 3.2s ease-in-out infinite; }
.mac-symbol { position: relative; isolation: isolate; }.mac-symbol::before { content: ""; position: absolute; z-index: -1; inset: 8px; border-radius: 50%; background: rgba(198,127,211,.8); filter: blur(14px); opacity: .42; transition: opacity .3s, transform .3s; }.mac-card:hover .mac-symbol::before { opacity: .75; transform: scale(1.25); }
.command-symbol { color:var(--accent); font-size:24px; font-weight:600; line-height:1; }.mac-symbol .cursor-symbol { transform:translate(2px,1px); transform-origin:center; }

.privacy-list > div { min-height: 120px; align-items: center; }.privacy-list p { margin: 0; color: #d8d4dc; font-size: 15px; line-height: 1.5; letter-spacing: -.01em; }
.privacy-lock-badge { position:absolute; z-index:3; top:24px; right:28px; height:38px; padding:0 13px 0 10px; border:1px solid rgba(255,255,255,.13); border-radius:999px; display:flex; align-items:center; gap:8px; background:rgba(18,17,22,.66); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 30px rgba(0,0,0,.25); backdrop-filter:blur(18px); color:#f2edf3; font-size:10px; font-weight:650; }.privacy-lock-badge::before { content:""; position:absolute; inset:-12px; z-index:-1; border-radius:999px; background:radial-gradient(circle,rgba(198,127,211,.25),transparent 68%); }.privacy-lock-badge svg { width:18px; height:18px; fill:none; stroke:var(--accent); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

.final-cta { isolation: isolate; background: radial-gradient(720px 430px at 93% -12%, rgba(198,127,211,.58), transparent 70%), radial-gradient(560px 390px at -10% 112%, rgba(104,94,239,.34), transparent 72%), linear-gradient(135deg,#1a171e,#17131b); transform: translateZ(0); }
.final-cta::before, .final-cta::after { display: none; }
.final-cta.reveal { transform: none; transition: opacity .75s cubic-bezier(.2,.7,.2,1); }
.cat-perch { -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px); }

@keyframes heroTextShimmer { from { background-position: 160% 50%; } to { background-position: -80% 50%; } }
@keyframes recordingPillShimmer { 0%,100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@keyframes featurePolishSweep { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
@keyframes wordMatch { from { transform: translateY(1px); opacity:.4; } to { transform:none; opacity:1; } }
@keyframes screenMatched { 0% { transform:scale(.985); } 45% { transform:scale(1.015); } 100% { transform:none; } }
@keyframes inputFocus { 0%,30%,100% { border-color: var(--line); box-shadow: none; } 42%,82% { border-color: rgba(198,127,211,.42); box-shadow: 0 0 0 3px rgba(198,127,211,.08), 0 14px 30px rgba(0,0,0,.25); } }
@keyframes inputCaret { 0%,40%,100% { opacity: 0; } 44%,82% { opacity: 1; } }
@keyframes dictationMenu { 0%,45%,100% { opacity: 0; transform: translateX(-50%) translateY(8px) scale(.94); } 55%,84% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); } }
@keyframes cursorApproach { 0%,20% { transform: translate(0,0); } 42%,75% { transform: translate(-64px,-74px); } 90%,100% { transform: translate(0,0); } }
@keyframes searchListening { 0%,20%,100% { opacity:.28; transform:scale(.8); } 28%,70% { opacity:1; transform:scale(1.15); box-shadow:0 0 0 5px rgba(198,127,211,.1); } }
@keyframes appleFloat { 0%,100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-6px) rotate(1deg); } }
@keyframes appleGlow { 0%,100% { opacity:.42; transform:scale(.9); } 50% { opacity:.86; transform:scale(1.08); } }

@media (min-width: 1051px) and (max-width: 1250px) {
  .feature, .feature-large { aspect-ratio: auto; }
}

@media (max-width: 1050px) {
  .hero { padding-top: 112px; }
  .hero-copy { min-height: 0; margin-top: 0; display: block; }
  .hero-title-stack { min-height: 0; height: 124px; }
  .hero.mode-meeting .hero-title-stack { height: 132px; }
  .hero-lede-stack { min-height: 0; }
  .hotkey-card { right: 8px; }
  .meetings-layout { align-items: center; }
  .meeting-window { width: 100%; min-width: 0; }
  .meeting-benefits { grid-template-columns: 1fr; }
  .meeting-benefits article { border: 1px solid var(--line); }
  .privacy-panel { grid-template-columns: 1fr; }
}

@media (max-width: 1050px) {
  .workflow-grid { grid-template-columns: 1fr; }
  .feature, .feature-large { width: min(560px,100%); min-height: 430px; aspect-ratio: auto; margin-inline: auto; }
}

@media (max-width: 760px) {
  .nav-links { position: fixed; left: 0; transform: none; }
  .mobile-download { display: flex; }
  .nav-download { display: none; }
  .hero { min-height: auto; padding: 112px 0 66px; gap: 42px; }
  .hero-title-stack { min-height: 0; height: 142px; }.hero.mode-meeting .hero-title-stack { height: 160px; }.hero-title-meeting { font-size: clamp(43px,11.8vw,54px) !important; line-height: .98 !important; }
  .hero-lede-stack { min-height: 0; }.hero-lede { margin-top: 18px; }
  .hero-stage { min-height: 470px; }
  .meeting-hero-window { inset: 28px 0; }
  .hero-stage.show-meeting .meeting-hero-window { transform: translateY(-1px) rotateY(1.5deg) rotateX(-.5deg) scale(.99); }
  .hero-meeting-shell { grid-template-columns: 1fr; }.hero-meeting-sidebar { display: none; }
  .meeting-note-page { padding: 12px 14px; gap: 5px; }.meeting-note-heading h3 { font-size: 14px; }.generated-note { padding: 6px 9px; }.generated-note p { font-size: 6.5px; }.hero-generated-grid { grid-template-columns: 1fr; }.hero-generated-grid .question-note { display:block; }.meeting-screen-row { min-height: 0; }.meeting-screen-row .hero-capture { height: auto; aspect-ratio: 16 / 9; }
  .app-strip-inner { min-height: 100px; display: flex; gap: 8px; }.app-strip p.app-sentence { font-size: 15px; }.app-cycle { flex-basis: 46px; width: 46px; height: 46px; }.real-app-icon { flex-basis: 42px; height: 42px; }
  .feature, .feature-large { min-height: 420px; padding: 26px; }.input-demo { margin-inline: -26px; margin-bottom: -26px; }
  .meeting-window { width: 100%; min-width: 0; max-width: 100%; min-height: 0; height: auto; margin-bottom: 0; grid-template-columns: minmax(0, 1fr); transform: none; }
  .meeting-sidebar { display: none; }
  .meeting-main { min-width: 0; padding: 18px; }
  .meeting-header { align-items: flex-start; gap: 12px; }.meeting-view-toggle { flex: 0 0 auto; }.meeting-view-toggle button { min-width: 0; padding-inline: 7px; }
  .meeting-view-stack { min-height: 0; overflow: visible; }.meeting-view { position: relative; inset: auto; display: none; }.meeting-view.active { display: block; }.meeting-transcript.active { display: grid; }
  .transcript-screen { width:min(270px,86%); }
  .meeting-benefits { min-height:150px; margin-top:24px; }.meeting-benefits article { min-height:150px; padding:20px 22px; border:1px solid var(--line) !important; }.meeting-benefits h3 { margin:auto 0 7px; }
  .apple-mark-animation { margin-bottom: 20px; }
  .privacy-list > div { min-height: 100px; }.privacy-list p { font-size: 14px; }
  .privacy-lock-badge { top:16px; right:18px; }
  .final-cat img { width: min(365px, 112%); max-width: none; }
  .cat-perch { width: min(320px, calc(100% - 24px)); bottom: 14px; }
}

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

/* Product-story refinement v8: focused meetings and quieter platform cues. */
.meeting-hero-window {
  inset: 78px 10px 100px;
  border-radius: 24px;
  background: linear-gradient(155deg, rgba(31, 30, 36, .98), rgba(19, 19, 23, .98));
  box-shadow: 0 48px 100px rgba(0, 0, 0, .52), inset 0 1px 0 rgba(255, 255, 255, .06);
}
.hero-stage.show-meeting .meeting-hero-window { transform: translateY(-2px) rotateY(2.4deg) rotateX(-.8deg); }
.hero-meeting-focus {
  height: 100%;
  padding: 24px 26px;
  gap: 10px;
  background: radial-gradient(520px 260px at 100% 0%, rgba(198, 127, 211, .08), transparent 68%);
}
.hero-meeting-focus .meeting-note-heading small { font-size: 8px; }
.hero-meeting-focus .meeting-note-heading h3 { font-size: 19px; }
.hero-meeting-focus .meeting-note-heading > span { padding: 7px 10px; font-size: 8px; }
.hero-meeting-focus .generated-note { padding: 9px 11px; }
.hero-meeting-focus .generated-note small { font-size: 6.5px; }
.hero-meeting-focus .generated-note p { margin-top: 4px; font-size: 7.5px; line-height: 1.4; }
.hero-meeting-focus .hero-generated-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.hero-meeting-focus .meeting-screen-row { padding: 9px 10px 8px; }
.hero-meeting-focus .meeting-note-heading,
.hero-meeting-focus .generated-note,
.hero-meeting-focus .meeting-screen-row { opacity: 1; transform: none; transition: none; }

.input-recording-pill {
  position: absolute;
  left: 50%;
  top: 112px;
  width: min(230px, calc(100% - 44px));
  min-height: 46px;
  padding: 6px 8px 6px 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  opacity: 0;
  transform: translateX(-50%) translateY(8px) scale(.94);
  animation: inputPillReveal 5.4s ease-in-out infinite, recordingPillShimmer 5.2s ease-in-out infinite;
}
.input-recording-pill .recording-dot { flex-basis: 7px; width: 7px; height: 7px; }
.input-recording-pill .waveform { height: 22px; gap: 2px; }
.input-recording-pill .waveform i { width: 2.5px; }
.input-recording-pill b { flex: 1; color: #f4f1f4; font-size: 11px; font-weight: 650; }
.input-recording-pill .recording-stop { flex-basis: 30px; width: 30px; height: 30px; }
.input-recording-pill .recording-stop i { width: 9px; height: 9px; }

.meetings-section { padding-block: 84px; }
.meetings-layout {
  grid-template-columns: minmax(300px, .68fr) minmax(0, 1.32fr);
  grid-template-areas:
    "copy demo"
    "benefits benefits";
  column-gap: 46px;
  row-gap: 24px;
  align-items: center;
}
.meetings-copy { grid-area: copy; margin: 0; }
.meetings-copy .eyebrow { margin-bottom: 20px; }
.meetings-copy h2 { max-width: 470px; }
.meeting-demo-stage { position: relative; grid-area: demo; min-width: 0; }
.meeting-window {
  width: 100%;
  min-width: 0;
  min-height: 390px;
  height: 390px;
  grid-template-columns: 142px minmax(0, 1fr);
  border-radius: 22px;
  transform: none;
  box-shadow: 0 34px 78px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255, 255, 255, .035);
}
.meeting-sidebar { padding: 16px 10px; }
.sidebar-title { margin: 0 7px 15px; font-size: 11px; }
.sidebar-title img { width: 24px; height: 24px; }
.sidebar-switch { height: 29px; margin-bottom: 10px; font-size: 7px; }
.sidebar-search { height: 29px; margin-bottom: 13px; font-size: 7px; }
.meeting-item { padding: 9px 8px; }
.meeting-item b { font-size: 8px; }
.meeting-item span { font-size: 6.5px; }
.meeting-main { padding: 16px 18px; }
.meeting-header h3 { font-size: 14px; }
.meeting-header p { font-size: 7px; }
.meeting-header-actions { display: flex; align-items: center; gap: 8px; }
.meeting-recording-state {
  height: 27px;
  padding: 0 9px;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255, 255, 255, .025);
  color: #827e87;
  font-size: 7px;
  white-space: nowrap;
  transition: transform .48s cubic-bezier(.2, .8, .2, 1), border-color .35s, background .35s, color .35s;
}
.meeting-recording-state i { width: 6px; height: 6px; border-radius: 50%; background: #ff596a; box-shadow: 0 0 0 4px rgba(255, 89, 106, .08); }
.meeting-view-stack { min-height: 310px; }
.meeting-overview .overview-stack { transform-origin: 60% 0; transition: transform .55s cubic-bezier(.2, .8, .2, 1), opacity .4s; }
.meeting-window.focus-overview .overview-stack { transform: scale(1.025); }
.meeting-window.focus-audio .meeting-recording-state { border-color: rgba(198, 127, 211, .42); background: rgba(198, 127, 211, .12); color: #efe5f1; transform: scale(1.08); }
.meeting-window.focus-speakers .meeting-transcript.active .speaker-turn { border-color: rgba(198, 127, 211, .28); transform: scale(1.022); }
.meeting-window.focus-speakers .meeting-transcript.active .transcript-screen { opacity: .42; }
.meeting-window.focus-screen .meeting-transcript.active .speaker-turn { opacity: .48; }
.meeting-window.focus-screen .meeting-transcript.active .transcript-screen { opacity: 1; transform: scale(1.075); transform-origin: left center; }

.meeting-toast {
  position: absolute;
  z-index: 8;
  top: 70px;
  right: -18px;
  width: 310px;
  min-height: 68px;
  padding: 11px 12px;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 17px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  background: rgba(28, 27, 32, .9);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .48), inset 0 1px 0 rgba(255, 255, 255, .08);
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
  opacity: 0;
  visibility: hidden;
  transform: translateX(26px) scale(.97);
  transition: opacity .38s ease, visibility 0s linear 0s, transform .5s cubic-bezier(.2, .8, .2, 1);
}
.meeting-toast-end { top: auto; bottom: 54px; }
.meeting-toast-icon { width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; background: rgba(198, 127, 211, .12); color: var(--accent); font-size: 13px; }
.meeting-toast-icon i { width: 8px; height: 8px; border-radius: 50%; background: #ff596a; box-shadow: 0 0 0 5px rgba(255, 89, 106, .1); }
.meeting-toast-icon.done { background: rgba(124, 207, 158, .12); color: #9ce2b8; }
.meeting-toast b, .meeting-toast small { display: block; }
.meeting-toast b { color: #ebe7ec; font-size: 11px; }
.meeting-toast small { margin-top: 3px; color: #8e8992; font-size: 8px; }
.meeting-toast-action { height: 28px; padding: 0 10px; border-radius: 9px; display: grid; place-items: center; background: #efecef; color: #17151a; font-size: 8px; font-weight: 700; white-space: nowrap; }
.meeting-demo-stage.notice-start .meeting-toast-start,
.meeting-demo-stage.notice-end .meeting-toast-end { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }

.meeting-benefits {
  grid-area: benefits;
  min-height: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.meeting-benefits article {
  grid-area: auto;
  min-height: 104px;
  padding: 15px 17px;
  border: 1px solid var(--line);
  border-radius: 18px;
  display: flex;
  flex-direction: column;
  background: linear-gradient(150deg, #17171b, #111114);
  opacity: 1;
  visibility: visible;
  transform: none;
  transition: transform .42s cubic-bezier(.2, .8, .2, 1), border-color .35s, background .35s, box-shadow .4s;
}
.meeting-benefits span { font-size: 8px; }
.meeting-benefits h3 { margin: auto 0 4px; font-size: 15px; }
.meeting-benefits p { font-size: 10px; line-height: 1.4; }
.meetings-section.phase-audio [data-benefit="speakers"],
.meetings-section.phase-speakers [data-benefit="speakers"],
.meetings-section.phase-transcript [data-benefit="speakers"],
.meetings-section.phase-screen [data-benefit="screen"],
.meetings-section.phase-overview [data-benefit="overview"] {
  border-color: rgba(198, 127, 211, .48);
  background: linear-gradient(150deg, rgba(198, 127, 211, .13), #121216 68%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 16px 36px rgba(0, 0, 0, .18);
  transform: translateY(-3px);
}

.apple-mark-animation { width: 64px; height: 64px; margin-bottom: 28px; }
.apple-mark-animation > i { display: none; }
.apple-mark-animation svg { width: 58px; height: 58px; filter: none; animation: none; transform: none; }

.privacy-panel {
  background:
    radial-gradient(540px 390px at -5% 108%, rgba(198, 127, 211, .25), transparent 70%),
    radial-gradient(460px 330px at 105% -15%, rgba(104, 94, 239, .18), transparent 72%),
    linear-gradient(145deg, rgba(27, 25, 31, .96), rgba(19, 19, 23, .96));
}
.privacy-panel::before, .privacy-panel::after { display: none; }
.privacy-lock-badge {
  position: relative;
  top: auto;
  right: auto;
  width: max-content;
  height: 38px;
  margin: 0 0 26px;
  background: linear-gradient(110deg, rgba(198, 127, 211, .16), rgba(255, 255, 255, .035));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.privacy-lock-badge::before { display: none; }

@keyframes inputPillReveal {
  0%, 45%, 100% { opacity: 0; transform: translateX(-50%) translateY(8px) scale(.94); }
  55%, 84% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); }
}

@media (max-width: 1050px) {
  .meetings-section { padding-block: 100px; }
  .meetings-layout {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "copy" "demo" "benefits";
    gap: 30px;
  }
  .meetings-copy h2 { max-width: 680px; }
  .meeting-demo-stage { width: min(760px, 100%); }
  .meeting-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .meeting-hero-window { inset: 35px 0 26px; }
  .hero-meeting-focus { padding: 17px 15px; gap: 6px; }
  .hero-meeting-focus .meeting-note-heading h3 { font-size: 15px; }
  .hero-meeting-focus .hero-generated-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
  .hero-meeting-focus .generated-note { padding: 7px; }
  .hero-meeting-focus .generated-note p { font-size: 5.8px; }
  .input-recording-pill { top: 112px; }
  .meetings-section { padding-block: 88px; }
  .meetings-layout { gap: 24px; }
  .meeting-window { min-height: 0; height: auto; grid-template-columns: minmax(0, 1fr); }
  .meeting-main { padding: 16px; }
  .meeting-header { flex-wrap: wrap; }
  .meeting-header-actions { width: 100%; margin-top: 10px; justify-content: space-between; }
  .meeting-view-stack { min-height: 0; }
  .meeting-toast { top: 72px; right: 8px; width: min(290px, calc(100% - 16px)); }
  .meeting-toast-end { top: auto; bottom: 26px; }
  .meeting-benefits { gap: 8px; }
  .meeting-benefits article { min-height: 108px; padding: 13px 14px; border-radius: 16px; }
  .meeting-benefits h3 { font-size: 13px; }
  .meeting-benefits p { font-size: 9px; }
  .privacy-lock-badge { margin-bottom: 22px; }
}

/* Product-faithful meeting views v12. */
.hero-meeting-focus {
  display: flex;
  flex-direction: column;
  gap: 11px;
}
.real-meeting-heading { flex: 0 0 auto; align-items: flex-start; }
.real-meeting-heading h3 { margin: 0 0 5px; font-size: 18px; }
.real-meeting-heading small { display: block; color: #97939b; font-size: 8px; }
.meeting-note-actions { display: flex; align-items: center; gap: 7px; }
.meeting-transcript-button,
.meeting-icon-action,
.meeting-icon-button {
  border: 0;
  border-radius: 9px;
  display: inline-grid;
  place-items: center;
  background: #242429;
  color: #dedbe0;
}
.meeting-transcript-button { height: 31px; padding: 0 12px; font-size: 8px; font-weight: 650; }
.meeting-icon-action,
.meeting-icon-button { width: 31px; height: 31px; padding: 0; }
.meeting-icon-action svg,
.meeting-icon-button svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.hero-real-meeting-stack { min-height: 0; display: grid; gap: 9px; overflow: hidden; }
.hero-real-meeting-card {
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 15px;
  background: #18181c;
}
.hero-real-meeting-card h4 { margin: 0 0 7px; color: var(--accent); font-size: 13px; letter-spacing: -.02em; }
.hero-real-meeting-card p,
.hero-real-meeting-card ul { margin: 0; color: #d0ccd2; font-size: 8px; line-height: 1.45; }
.hero-real-meeting-card ul { padding-left: 16px; }
.hero-real-meeting-card li + li { margin-top: 4px; }

.meetings-section { padding-block: 70px; }
.meeting-window {
  min-height: 420px;
  height: 420px;
  grid-template-columns: minmax(0, 1fr);
  background: #111114;
}
.meeting-main { padding: 20px 22px; }
.meeting-header { align-items: flex-start; transition: transform .48s cubic-bezier(.2, .8, .2, 1); }
.meeting-header h3 { margin-bottom: 5px; font-size: 17px; }
.meeting-header p { color: #aaa6ae; font-size: 9px; }
.meeting-header-actions { justify-content: flex-end; gap: 8px; }
.meeting-view-toggle { padding: 0; border: 0; background: transparent; }
.meeting-view-toggle button {
  min-width: 0;
  height: 34px;
  padding: 0 15px;
  border-radius: 10px;
  background: #242429;
  color: #dedbe0;
  font-size: 10px;
  font-weight: 600;
}
.meeting-view-toggle button.active { background: #242429; color: #f1eef2; box-shadow: none; }
.meeting-view-toggle [data-meeting-tab="overview"] { display: none; }
.meeting-window.show-transcript .meeting-view-toggle [data-meeting-tab="overview"] { display: grid; }
.meeting-window.show-transcript .meeting-view-toggle [data-meeting-tab="transcript"] { display: none; }
.meeting-icon-button { flex: 0 0 34px; width: 34px; height: 34px; cursor: default; }
.meeting-view-stack { min-height: 338px; }
.meeting-overview .real-overview-stack {
  margin: 14px 0 0;
  padding: 0;
  border: 0;
  display: grid;
  gap: 9px;
  background: transparent;
}
.real-overview-stack .overview-block {
  width: 78%;
  padding: 11px 14px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 14px;
  background: #18181c;
}
.real-overview-stack .overview-block h4 { margin: 0 0 7px; color: var(--accent); font-size: 14px; letter-spacing: -.02em; }
.real-overview-stack .overview-block p,
.real-overview-stack .overview-block ul { margin: 0; color: #d0ccd2; font-size: 9.2px; line-height: 1.45; }
.real-overview-stack .overview-block ul { padding-left: 17px; }
.real-overview-stack .overview-block li + li { margin-top: 4px; }
.real-overview-stack .overview-block b { color: #eeeaf0; }
.real-overview-stack .overview-screens { display: none; }
.meeting-window.focus-overview .overview-stack { transform: scale(1.012); }
.meeting-window.focus-audio .meeting-header { transform: scale(1.018); transform-origin: top right; }
.meeting-benefits article { min-height: 94px; }

@media (max-width: 1050px) {
  .meetings-section { padding-block: 92px; }
}

@media (max-width: 760px) {
  .meeting-hero-window { inset: 70px 0 auto; height: 285px; }
  .hero-meeting-focus { padding: 15px 13px; gap: 7px; }
  .real-meeting-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
  .real-meeting-heading h3 { font-size: 14px; }
  .real-meeting-heading small { font-size: 5.7px; }
  .meeting-note-actions { gap: 4px; }
  .meeting-transcript-button { height: 25px; padding-inline: 8px; font-size: 6px; }
  .meeting-icon-action { width: 25px; height: 25px; }
  .meeting-icon-action svg { width: 14px; height: 14px; }
  .hero-real-meeting-stack { gap: 6px; }
  .hero-real-meeting-card { padding: 8px 9px; border-radius: 11px; }
  .hero-real-meeting-card h4 { margin-bottom: 4px; font-size: 9px; }
  .hero-real-meeting-card p,
  .hero-real-meeting-card ul { font-size: 5.8px; line-height: 1.4; }
  .hero-real-meeting-card ul { padding-left: 12px; }
  .meetings-section { padding-block: 88px; }
  .meeting-window { min-height: 0; height: auto; }
  .meeting-main { padding: 17px 16px; }
  .meeting-header-actions { width: auto; margin-top: 0; }
  .meeting-header h3 { font-size: 15px; }
  .meeting-header p { font-size: 7px; }
  .meeting-view-toggle button { height: 31px; padding-inline: 11px; font-size: 8px; }
  .meeting-icon-button { flex-basis: 31px; width: 31px; height: 31px; }
  .meeting-view-stack { min-height: 0; overflow: visible; }
  .real-overview-stack .overview-block { padding: 12px 13px; }
  .real-overview-stack .overview-block { width: 100%; }
  .real-overview-stack .overview-block p,
  .real-overview-stack .overview-block ul { font-size: 8px; }
}

/* Visual refinement v16: faithful meeting screens and tighter supporting UI. */
@media (min-width: 1051px) {
  .hero.mode-meeting .hero-title-stack { height: 220px; }
  .meetings-section { padding-block: 32px; }
  .meetings-layout { grid-template-columns: minmax(360px, .75fr) minmax(0, 1.25fr); }
  .meetings-copy h2 { max-width: 520px; }
}

.hero-title-stack h1,
.hero-lede { transition-duration: .18s, .3s; }
.hero-title-meeting,
.hero-lede-meeting { transition-delay: 0s; }
.hero:not(.mode-meeting) .hero-title-dictation,
.hero:not(.mode-meeting) .hero-lede-dictation,
.hero.mode-meeting .hero-title-meeting,
.hero.mode-meeting .hero-lede-meeting { transition-delay: .18s; }
.app-window,
.meeting-hero-window {
  transition: opacity .2s ease, transform .42s cubic-bezier(.2, .8, .2, 1), visibility 0s linear 0s;
}
.meeting-hero-window { visibility: hidden; }
.hero-stage:not(.show-meeting) .app-window {
  visibility: visible;
  transition-delay: .18s, .18s, .18s;
}
.hero-stage.show-meeting .app-window {
  visibility: hidden;
  transition-delay: 0s;
}
.hero-stage.show-meeting .meeting-hero-window {
  visibility: visible;
  transition-delay: .18s, .18s, .18s;
}

.meeting-hero-window {
  inset: auto 0;
  top: 54px;
  height: 432px;
}
.hero-stage.show-meeting .meeting-hero-window {
  transform: translateY(-2px) rotateY(2deg) rotateX(-.7deg);
}
.hero-meeting-focus {
  padding: 17px 20px;
  gap: 8px;
}
.real-meeting-heading {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
}
.real-meeting-heading > div:first-child,
.meeting-header > div:first-child { min-width: 0; }
.real-meeting-heading h3,
.real-meeting-heading small,
.meeting-header h3,
.meeting-header p {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.meeting-note-actions,
.meeting-header-actions { flex: 0 0 auto; min-width: 0; }
.hero-real-meeting-stack {
  gap: 6px;
  overflow: visible;
}
.hero-real-meeting-card {
  padding: 7px 10px;
  border-radius: 11px;
  transform-origin: 50% 50%;
  will-change: opacity, transform;
}
.hero-real-meeting-card h4 {
  margin-bottom: 3px;
  font-size: 9px;
}
.hero-real-meeting-card p,
.hero-real-meeting-card ul {
  font-size: 6.6px;
  line-height: 1.34;
}
.hero-real-meeting-card ul { padding-left: 13px; }
.hero-real-meeting-card li + li { margin-top: 2px; }
.hero-real-screens {
  min-width: 0;
  padding: 7px 9px 6px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 12px;
  background: #18181c;
  transform-origin: 50% 70%;
  will-change: opacity, transform;
}
.hero-real-screens > h4 {
  margin: 0 0 6px;
  color: var(--accent);
  font-size: 10px;
  letter-spacing: -.01em;
}
.hero-real-screen-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  overflow: visible;
}
.hero-real-screen-strip > div {
  position: relative;
  z-index: 1;
  min-width: 0;
  transform-origin: 50% 62%;
  will-change: transform;
}
.hero-screen-frame {
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 8px;
  display: block;
  overflow: hidden;
  background: #111114;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035);
}
.hero-real-screen-strip img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.hero-real-screen-strip .screen-board { transform: scale(1.08); transform-origin: 42% 52%; }
.hero-real-screen-strip time {
  position: relative;
  z-index: 1;
  margin-top: 4px;
  display: block;
  color: #85818a;
  font: 6.25px ui-monospace, SFMono-Regular, Menlo, monospace;
}
.hero-real-screen-strip > div:last-child time { color: var(--accent); }

.hero-stage.show-meeting .overview-note {
  animation: heroMeetingCardFocus 1.15s .35s cubic-bezier(.2, .8, .2, 1) both;
}
.hero-stage.show-meeting .agreement-note {
  animation: heroMeetingCardFocus 1.15s 1.05s cubic-bezier(.2, .8, .2, 1) both;
}
.hero-stage.show-meeting .action-note {
  animation: heroMeetingCardFocus 1.15s 1.75s cubic-bezier(.2, .8, .2, 1) both;
}
.hero-stage.show-meeting .question-note {
  animation: heroMeetingCardFocus 1.15s 2.45s cubic-bezier(.2, .8, .2, 1) both;
}
.hero-stage.show-meeting .hero-real-screens {
  animation: heroMeetingScreensFocus 2.25s 3.2s cubic-bezier(.2, .8, .2, 1) both;
}
@keyframes heroMeetingCardFocus {
  0% { opacity: 0; transform: translateY(5px) scale(.975); border-color: rgba(255, 255, 255, .08); }
  22% { opacity: 1; transform: translateY(0) scale(1); }
  42%, 67% { opacity: 1; transform: translateY(-1px) scale(1.025); border-color: rgba(198, 127, 211, .52); box-shadow: 0 12px 28px rgba(0, 0, 0, .22), 0 0 24px rgba(198, 127, 211, .09); }
  100% { opacity: 1; transform: none; border-color: rgba(255, 255, 255, .13); box-shadow: none; }
}
@keyframes heroMeetingScreensFocus {
  0% { opacity: 0; transform: translateY(6px) scale(.975); border-color: rgba(255, 255, 255, .08); }
  18% { opacity: 1; transform: translateY(0) scale(1); }
  36%, 80% { opacity: 1; transform: translateY(-2px) scale(1.025); border-color: rgba(198, 127, 211, .58); box-shadow: 0 16px 34px rgba(0, 0, 0, .24), 0 0 28px rgba(198, 127, 211, .1); }
  100% { opacity: 1; transform: none; border-color: rgba(255, 255, 255, .13); box-shadow: none; }
}
@keyframes heroMeetingShotFocus {
  0%, 18% { z-index: 1; transform: scale(1); }
  38%, 76% { z-index: 4; transform: translateY(-2px) scale(1.13); filter: brightness(1.08); }
  100% { z-index: 1; transform: none; filter: none; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-stage.show-meeting .hero-real-meeting-card,
  .hero-stage.show-meeting .hero-real-screens,
  .hero-stage.show-meeting .hero-screen-shot {
    opacity: 1;
    transform: none;
    filter: none;
    animation: none !important;
  }
}

/* Visual refinement v17: aligned hero states and a quieter meeting story. */
.hero-stage.show-meeting .meeting-hero-window {
  transform: rotateY(-3deg) rotateX(1.5deg);
}

.hero-real-screen-strip {
  display: block;
}
.hero-real-screen-strip > .hero-screen-shot {
  width: min(210px, 48%);
  transform-origin: left bottom;
}
.hero-real-screen-strip .screen-board {
  transform: none;
}
.hero-stage.show-meeting .hero-screen-shot:first-child {
  animation: heroMeetingShotFocus 1.8s 3.95s cubic-bezier(.2, .8, .2, 1) both;
}

@keyframes heroMeetingShotFocus {
  0%, 18% { z-index: 1; transform: none; filter: none; }
  38%, 76% { z-index: 4; transform: translateY(-2px) scale(1.55); filter: brightness(1.08); }
  100% { z-index: 1; transform: none; filter: none; }
}

@media (min-width: 1051px) {
  .meetings-section { padding-block: 84px; }
}
.meeting-benefits {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.meetings-section.phase-audio [data-benefit="speakers"],
.meetings-section.phase-speakers [data-benefit="speakers"],
.meetings-section.phase-transcript [data-benefit="speakers"],
.meetings-section.phase-screen [data-benefit="screen"],
.meetings-section.phase-overview [data-benefit="overview"] {
  background: #1d181f;
}

@media (min-width: 1051px) and (max-height: 760px) {
  .hero {
    min-height: 620px;
    padding: 68px 0 16px;
  }
  .hero-copy {
    min-height: 500px;
    margin-top: 12px;
  }
  .hero-stage { min-height: 500px; }
  .meeting-hero-window { top: 34px; }
}

@media (max-width: 760px) {
  .hero-stage.show-meeting .meeting-hero-window { transform: none; }
  .meeting-benefits { grid-template-columns: 1fr; }
}

.meeting-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
}
.meeting-header-actions { width: auto; max-width: 100%; }
.real-overview-stack .overview-block {
  width: 100%;
  box-sizing: border-box;
}
.meeting-window.focus-overview .overview-stack,
.meeting-window.focus-audio .meeting-header { transform: none; }
.meeting-window.focus-speakers .meeting-transcript.active .speaker-turn {
  transform: none;
  box-shadow: inset 0 0 0 1px rgba(198, 127, 211, .08);
}
.meeting-transcript { padding-top: 8px; gap: 6px; }
.transcript-screen { width: min(324px, calc(100% - 8px)); }
.meeting-window.focus-screen .meeting-transcript.active .transcript-screen {
  transform: translateX(2px) scale(1.018);
  transform-origin: left center;
}
.transcript-screen > img {
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 10px;
  display: block;
  object-fit: cover;
  transition: border-color .4s, box-shadow .45s, transform .45s;
}
.meeting-window.screen-matched .transcript-screen > img {
  border-color: rgba(198, 127, 211, .7);
  box-shadow: 0 0 0 3px rgba(198, 127, 211, .1), 0 0 32px rgba(198, 127, 211, .24);
  animation: screenMatched 1.2s cubic-bezier(.2, .8, .2, 1) both;
}
.meeting-toast-icon.done { background: rgba(255, 255, 255, .06); color: #dedbe0; }
.meeting-toast-icon.done i {
  width: 9px;
  height: 9px;
  border-radius: 2px;
  background: #dedbe0;
  box-shadow: none;
}
.meeting-benefits article { background: #151519; }
.meetings-section.phase-audio [data-benefit="speakers"],
.meetings-section.phase-speakers [data-benefit="speakers"],
.meetings-section.phase-transcript [data-benefit="speakers"],
.meetings-section.phase-screen [data-benefit="screen"],
.meetings-section.phase-overview [data-benefit="overview"] {
  background: #1d181f;
}

.privacy-panel {
  padding: 58px 62px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.06fr);
  gap: 54px;
}
.privacy-copy h2 { font-size: clamp(48px, 4vw, 58px); }
.privacy-copy h2 span {
  display: block;
  white-space: nowrap;
}
.privacy-list > div {
  min-height: 88px;
  padding: 16px 17px;
  gap: 13px;
}
.privacy-icon {
  flex-basis: 32px;
  width: 32px;
  height: 32px;
  border-radius: 9px;
}
.privacy-icon svg { width: 17px; height: 17px; }
.privacy-list p { font-size: 13.5px; line-height: 1.42; }

.final-recording-pill {
  position: absolute;
  z-index: 1;
  left: 82px;
  bottom: 62px;
  width: 360px;
  min-height: 70px;
  padding: 10px 14px 10px 18px;
  display: flex;
  align-items: center;
  gap: 12px;
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
}
.final-recording-pill .bubble-label { font-size: 18px; }
.final-recording-pill .recording-stop {
  flex-basis: 42px;
  width: 42px;
  height: 42px;
}
.final-recording-pill .recording-stop i { width: 12px; height: 12px; }

@media (max-width: 1050px) {
  .privacy-panel { padding: 52px; grid-template-columns: 1fr; gap: 38px; }
  .final-recording-pill { left: 3px; width: 360px; }
}

@media (max-width: 760px) {
  .meeting-hero-window {
    inset: auto 0;
    top: 40px;
    height: 390px;
  }
  .hero-meeting-focus { padding: 14px 12px; gap: 6px; }
  .real-meeting-heading { gap: 6px; }
  .hero-real-meeting-stack { gap: 5px; }
  .hero-real-meeting-card { padding: 6px 8px; border-radius: 9px; }
  .hero-real-meeting-card h4 { font-size: 8px; }
  .hero-real-meeting-card p,
  .hero-real-meeting-card ul { font-size: 5.5px; line-height: 1.28; }
  .hero-real-screen-strip { gap: 5px; }
  .hero-real-screens > h4 { margin-bottom: 4px; font-size: 8px; }
  .meeting-header { grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
  .meeting-header-actions { width: auto; margin-top: 0; justify-content: flex-end; gap: 5px; }
  .transcript-screen { width: 100%; }
  .meeting-window.focus-screen .meeting-transcript.active .transcript-screen { transform: none; }
  .privacy-panel { padding: 40px 26px; gap: 32px; }
  .privacy-copy h2 { font-size: clamp(35px, 9.8vw, 40px); }
  .privacy-list > div { min-height: 82px; padding: 14px 15px; }
  .privacy-list p { font-size: 13px; }
  .final-recording-pill {
    left: 50%;
    bottom: 44px;
    width: min(340px, calc(100% - 20px));
    min-height: 70px;
    transform: translateX(-50%);
  }
}

/* Meeting walkthrough v18: speakers, their screen, then generated notes. */
.speaker-turn,
.speaker-turn img,
.transcript-screen {
  transition-property: opacity, transform, border-color, background, box-shadow, filter;
  transition-duration: .42s;
  transition-timing-function: cubic-bezier(.2, .8, .2, 1);
}
.meeting-window.focus-speaker-you .meeting-transcript.active .speaker-turn,
.meeting-window.focus-speaker-milo .meeting-transcript.active .speaker-turn {
  opacity: .38;
  border-color: rgba(255, 255, 255, .06);
  background: rgba(255, 255, 255, .018);
  box-shadow: none;
  filter: saturate(.72);
}
.meeting-window.focus-speaker-you .meeting-transcript.active .speaker-you,
.meeting-window.focus-speaker-milo .meeting-transcript.active .speaker-milo {
  opacity: 1;
  border-color: rgba(198, 127, 211, .56);
  background: rgba(198, 127, 211, .1);
  box-shadow: inset 0 0 0 1px rgba(198, 127, 211, .08), 0 10px 26px rgba(0, 0, 0, .16);
  filter: none;
}
.meeting-window.focus-speaker-you .meeting-transcript.active .speaker-you img {
  box-shadow: 0 0 0 2px rgba(198, 127, 211, .25), 0 0 22px rgba(198, 127, 211, .3);
}
.meeting-window.focus-speaker-milo .meeting-transcript.active .speaker-milo img {
  box-shadow: 0 0 0 2px rgba(239, 164, 93, .22), 0 0 22px rgba(239, 164, 93, .28);
}
.meeting-window.focus-speaker-you .meeting-transcript.active .transcript-screen,
.meeting-window.focus-speaker-milo .meeting-transcript.active .transcript-screen {
  opacity: .24;
  filter: saturate(.7);
}
.meeting-window.focus-screen .meeting-transcript.active .transcript-screen {
  transition-delay: 0s;
}

.meeting-window.focus-summary .real-overview-stack .overview-block,
.meeting-window.focus-agreements .real-overview-stack .overview-block,
.meeting-window.focus-actions .real-overview-stack .overview-block,
.meeting-window.focus-questions .real-overview-stack .overview-block {
  opacity: .38;
  border-color: rgba(255, 255, 255, .07);
  background: #151519;
  box-shadow: none;
  transition: opacity .4s ease, border-color .4s ease, background .4s ease, box-shadow .45s ease;
}
.meeting-window.focus-summary .real-overview-stack .overview-block:nth-child(1),
.meeting-window.focus-agreements .real-overview-stack .overview-block:nth-child(2),
.meeting-window.focus-actions .real-overview-stack .overview-block:nth-child(3),
.meeting-window.focus-questions .real-overview-stack .overview-block:nth-child(4) {
  opacity: 1;
  border-color: rgba(198, 127, 211, .52);
  background: #1d181f;
  box-shadow: inset 0 0 26px rgba(198, 127, 211, .055), 0 12px 28px rgba(0, 0, 0, .16);
}

.meetings-section.phase-speaker-you [data-benefit="speakers"],
.meetings-section.phase-speaker-milo [data-benefit="speakers"],
.meetings-section.phase-screen [data-benefit="screen"],
.meetings-section.phase-summary [data-benefit="overview"],
.meetings-section.phase-agreements [data-benefit="overview"],
.meetings-section.phase-actions [data-benefit="overview"],
.meetings-section.phase-questions [data-benefit="overview"] {
  border-color: rgba(198, 127, 211, .48);
  background: #1d181f;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 16px 36px rgba(0, 0, 0, .18);
  transform: translateY(-3px);
}

@media (min-width: 761px) {
  .meeting-toast-start { top: 0; }
}