:root {
  color-scheme: light dark;
  --page: #f5f5f7;
  --surface: rgba(255, 255, 255, .72);
  --surface-solid: #fff;
  --text: #1d1d1f;
  --muted: #6e6e73;
  --hairline: rgba(0, 0, 0, .09);
  --accent: #635bff;
  --blue: #087ff5;
  --green: #21a35b;
  --shadow: 0 20px 60px rgba(23, 23, 35, .10);
  --radius-large: 32px;
  --radius-medium: 22px;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "PingFang SC", "Helvetica Neue", sans-serif;
  font-synthesis: none;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--page); color: var(--text); -webkit-font-smoothing: antialiased; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
.shell { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.skip-link { position: fixed; z-index: 100; top: 12px; left: 12px; padding: 10px 14px; border-radius: 12px; background: var(--text); color: var(--page); transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }

.site-header { position: sticky; z-index: 50; top: 0; border-bottom: 1px solid var(--hairline); background: rgba(245, 245, 247, .78); backdrop-filter: saturate(180%) blur(22px); -webkit-backdrop-filter: saturate(180%) blur(22px); }
.nav { height: 62px; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: inherit; font-size: 15px; font-weight: 650; text-decoration: none; letter-spacing: -.01em; }
.brand small { margin-left: 4px; color: var(--muted); font-size: 12px; font-weight: 500; }
.brand-mark { position: relative; display: grid; place-items: center; width: 42px; height: 24px; border-radius: 8px; background: linear-gradient(135deg, #7765ff, #3c57dd); box-shadow: inset 0 1px 1px #ffffff59; }
.brand-mark span { width: 15px; height: 10px; border: 1.5px solid #fff; border-radius: 2px; }
.brand-mark i { position: absolute; right: 10px; bottom: 5px; width: 5px; height: 5px; border: 1.4px solid #fff; border-radius: 1px; }
.nav-actions { display: flex; align-items: center; gap: 24px; }
.nav-link { min-height: 44px; display: inline-flex; align-items: center; color: var(--muted); font-size: 13px; text-decoration: none; }
.nav-link:hover { color: var(--text); }
.language-picker, .segmented { display: inline-flex; padding: 3px; border: 1px solid rgba(0, 0, 0, .07); border-radius: 10px; background: rgba(118, 118, 128, .12); }
.language-picker button { min-width: 40px; min-height: 32px; border: 0; border-radius: 7px; background: transparent; color: var(--muted); cursor: pointer; font-size: 12px; font-weight: 600; }
.language-picker button[aria-pressed="true"] { background: #fff; color: #1d1d1f; box-shadow: 0 1px 4px rgba(0, 0, 0, .12); }

.hero { min-height: 730px; display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; align-items: center; padding-block: 80px 60px; }
.eyebrow, .section-kicker { color: var(--accent); font-size: 14px; font-weight: 700; letter-spacing: .01em; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; padding: 8px 11px; border: 1px solid rgba(99, 91, 255, .16); border-radius: 999px; background: rgba(99, 91, 255, .08); }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: #27bd68; box-shadow: 0 0 0 4px rgba(39, 189, 104, .12); }
.hero h1 { margin: 24px 0 20px; font-size: clamp(48px, 5vw, 72px); font-weight: 730; letter-spacing: -.055em; line-height: .98; white-space: nowrap; }
.hero h1 span { background: linear-gradient(110deg, #635bff 4%, #3f8cff 55%, #27b9d3); background-clip: text; -webkit-background-clip: text; color: transparent; }
.hero-lede { max-width: 620px; margin: 0; color: var(--muted); font-size: clamp(18px, 2vw, 21px); letter-spacing: -.015em; line-height: 1.6; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 18px; border-radius: 12px; font-size: 15px; font-weight: 650; text-decoration: none; transition: transform .18s ease, filter .18s ease; }
.button:hover { transform: translateY(-1px); filter: brightness(1.04); }
.button:active { transform: translateY(0); }
.button-primary { background: var(--accent); color: #fff; box-shadow: 0 8px 24px rgba(99, 91, 255, .25); }
.button-primary svg { width: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.button-secondary { border: 1px solid var(--hairline); background: rgba(255, 255, 255, .75); color: var(--text); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.build-note { margin: 15px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }

.hero-visual { position: relative; min-height: 570px; display: grid; place-items: center; }
.aurora { position: absolute; inset: 4% 0; overflow: hidden; border-radius: 42%; filter: blur(10px); }
.aurora i { position: absolute; border-radius: 50%; filter: blur(60px); opacity: .75; }
.aurora i:nth-child(1) { width: 360px; height: 360px; top: 3%; left: 6%; background: #8e7dff; }
.aurora i:nth-child(2) { width: 330px; height: 330px; right: 2%; top: 17%; background: #76d7f4; }
.aurora i:nth-child(3) { width: 320px; height: 320px; left: 24%; bottom: 1%; background: #f1a8d4; }
.glass-window { position: relative; z-index: 2; width: min(100%, 620px); overflow: hidden; border: 1px solid rgba(255, 255, 255, .62); border-radius: 24px; background: rgba(250, 250, 252, .66); box-shadow: 0 36px 90px rgba(44, 42, 92, .22), inset 0 1px 0 rgba(255, 255, 255, .82); backdrop-filter: saturate(135%) blur(32px); -webkit-backdrop-filter: saturate(135%) blur(32px); }
.window-titlebar { height: 48px; display: flex; align-items: center; gap: 7px; padding: 0 16px; border-bottom: 1px solid rgba(0, 0, 0, .07); }
.traffic { width: 11px; height: 11px; border-radius: 50%; }.traffic.red { background: #ff5f57; }.traffic.yellow { background: #febc2e; }.traffic.green { background: #28c840; }
.window-title { position: absolute; left: 50%; transform: translateX(-50%); color: rgba(29, 29, 31, .62); font-size: 12px; font-weight: 600; }
.window-content { padding: 26px; }
.app-heading { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; color: #1d1d1f; }
.app-heading strong { display: block; font-size: 21px; }.app-heading small { display: block; margin-top: 3px; color: #6e6e73; font-size: 12px; }
.wave-icon { height: 32px; display: flex; align-items: center; gap: 2px; }.wave-icon i { width: 3px; border-radius: 2px; background: linear-gradient(#43b6ef, #496bea); }.wave-icon i:nth-child(1),.wave-icon i:nth-child(5) { height: 12px; }.wave-icon i:nth-child(2),.wave-icon i:nth-child(4) { height: 23px; }.wave-icon i:nth-child(3) { height: 32px; }
.glass-option, .quick-card { border: 1px solid rgba(255, 255, 255, .58); background: rgba(255, 255, 255, .48); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .58); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
.glass-option { padding: 18px; border-radius: 16px; }
.option-title { display: flex; align-items: center; justify-content: space-between; color: #1d1d1f; font-size: 13px; font-weight: 650; }
.privacy-pill { padding: 4px 8px; border-radius: 999px; background: rgba(33, 163, 91, .12); color: #168448; font-size: 10px; }
.segmented { width: 100%; margin-top: 14px; color: #56565b; font-size: 11px; }
.segmented span { flex: 1; padding: 7px 3px; border-radius: 7px; text-align: center; }.segmented .selected { background: #fff; color: #1d1d1f; box-shadow: 0 1px 4px rgba(0,0,0,.14); }
.option-meta { display: flex; justify-content: space-between; margin-top: 13px; color: #6e6e73; font-size: 10px; }.ready { display: flex; align-items: center; gap: 5px; color: #168448; }.ready i { width: 6px; height: 6px; border-radius: 50%; background: #28bf67; }
.quick-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.quick-card { min-height: 130px; display: flex; flex-direction: column; justify-content: center; padding: 18px; border-radius: 16px; color: #1d1d1f; }.quick-card strong { margin: 10px 0 4px; font-size: 13px; }.quick-card small { color: #6e6e73; font-size: 10px; line-height: 1.35; }.quick-icon { color: #5d62e9; font-size: 24px; }

.trust-strip { display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: 40px; padding: 24px; border: 1px solid var(--hairline); border-radius: 20px; background: rgba(255,255,255,.55); }
.trust-strip div { padding: 2px 22px; border-right: 1px solid var(--hairline); }.trust-strip div:last-child { border: 0; }.trust-strip strong,.trust-strip span { display: block; text-align: center; }.trust-strip strong { font-size: 15px; }.trust-strip span { margin-top: 5px; color: var(--muted); font-size: 12px; }

.section { padding-block: 110px; }
.section-heading { max-width: 680px; }.section-heading.centered { margin-inline: auto; text-align: center; }.section-heading.compact { max-width: 760px; }
.section-heading h2, .build-copy h2, .detail-panel h2 { margin: 12px 0 18px; font-size: clamp(38px, 5vw, 58px); letter-spacing: -.045em; line-height: 1.05; }
.section-heading p, .build-copy > p, .detail-panel > div > p { margin: 0; color: var(--muted); font-size: 18px; line-height: 1.65; }
.feature-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 58px; }
.feature-card { min-height: 320px; overflow: hidden; padding: 36px; border: 1px solid var(--hairline); border-radius: var(--radius-large); background: var(--surface-solid); box-shadow: 0 12px 35px rgba(20,20,34,.05); }
.feature-card h3 { max-width: 540px; margin: 18px 0 10px; font-size: 25px; letter-spacing: -.025em; }.feature-card p { max-width: 600px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.65; }
.feature-wide { grid-column: 1 / -1; display: grid; grid-template-columns: .8fr 1.2fr; gap: 38px; align-items: center; }.blue-card { background: linear-gradient(145deg, #f8fbff, #eaf2ff); }
.feature-symbol { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: #e7f1ff; color: #147ce5; font-size: 23px; }.feature-symbol.purple { background:#eeeaff;color:#6859e6; }.feature-symbol.green { background:#e5f6eb;color:#1a8c4a; }.feature-symbol.orange { background:#fff0df;color:#dc751a; }
.source-picker { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; padding: 16px; border: 1px solid rgba(255,255,255,.8); border-radius: 20px; background: rgba(255,255,255,.55); box-shadow: var(--shadow); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }.source-picker div { min-height: 130px; display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;border:1px solid transparent;border-radius:14px;color:#6e6e73;font-size:12px; }.source-picker span { font-size: 25px; }.source-picker .active { border-color: rgba(99,91,255,.3); background:#fff;color:#5146dc;box-shadow:0 8px 20px rgba(80,70,200,.1); }
.screenshot-card { padding-right: 0; padding-bottom: 0; align-items: end; }.screenshot-card .feature-copy { padding-bottom: 36px; }.screenshot-card img { width: 100%; align-self: end; border: 1px solid var(--hairline); border-width: 1px 0 0 1px; border-radius: 18px 0 0 0; box-shadow: -12px -12px 45px rgba(0,0,0,.08); }

.privacy-section { overflow: hidden; background: #0c0c12; color: #f5f5f7; }
.privacy-layout { display: grid; grid-template-columns: .95fr 1.05fr; gap: 90px; align-items: center; }
.privacy-section .section-heading p { color: #a8a8b0; }.privacy-section .section-kicker { color: #8f8aff; }
.privacy-visual { position: relative; min-height: 470px; display: grid; place-items: center; }.privacy-visual::before { content:"";position:absolute;width:360px;height:360px;border-radius:50%;background:#5b4dde;filter:blur(90px);opacity:.32; }
.lock-ring { position:relative;z-index:2;width:230px;height:230px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.18);border-radius:50%;background:rgba(255,255,255,.07);box-shadow:inset 0 1px rgba(255,255,255,.12),0 30px 80px #0008;backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px); }.lock-ring::before { content:"";position:absolute;inset:28px;border:1px solid rgba(255,255,255,.12);border-radius:50%; }.lock-ring span { font-size:70px;color:#a7a1ff; }
.privacy-chip { position:absolute;z-index:3;padding:10px 15px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:rgba(255,255,255,.08);color:#d8d8df;font-size:12px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px); }.chip-one{top:15%;left:8%}.chip-two{right:7%;top:30%}.chip-three{left:18%;bottom:14%}
.check-list { display:grid;gap:14px;margin:28px 0 0;padding:0;list-style:none;color:#d4d4da;font-size:14px;line-height:1.55; }.check-list li { position:relative;padding-left:28px; }.check-list li::before { content:"✓";position:absolute;left:0;top:0;width:18px;height:18px;display:grid;place-items:center;border-radius:50%;background:#4c43bd;color:#fff;font-size:11px; }

.engine-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; margin-top: 52px; }.engine-grid article { min-height:290px;padding:28px;border:1px solid var(--hairline);border-radius:24px;background:var(--surface-solid); }.engine-grid h3 { margin:20px 0 9px;font-size:18px; }.engine-grid p { min-height:86px;margin:0;color:var(--muted);font-size:13px;line-height:1.6; }.engine-logo { width:48px;height:48px;display:grid;place-items:center;border-radius:14px;font-weight:800; }.engine-logo.apple{background:#1d1d1f;color:#fff;font-size:25px}.engine-logo.whisper{background:#dff3ff;color:#0877ce}.engine-logo.sense{background:#eae7ff;color:#5d4cd9}.engine-logo.parakeet{background:#e5f7e9;color:#1a8b4b}.tag{display:inline-block;margin-top:18px;padding:6px 9px;border-radius:8px;background:rgba(118,118,128,.1);color:var(--muted);font-size:10px;font-weight:600;}

.detail-panel { overflow:hidden;display:grid;grid-template-columns:.7fr 1.3fr;gap:58px;align-items:center;padding:56px 0 56px 56px;border-radius:var(--radius-large);background:linear-gradient(140deg,#e8e5ff,#eef7ff); }.detail-panel figure{margin:0}.detail-panel img{display:block;width:100%;border:1px solid #fff9;border-radius:18px 0 0 18px;box-shadow:-16px 20px 50px #3d3b8030}.detail-panel figcaption{margin:10px 18px 0;color:#6e6e73;font-size:11px;text-align:right}

.build-panel { display:grid;grid-template-columns:1fr .9fr;gap:64px;align-items:center;padding:64px;border-radius:var(--radius-large);background:#17171d;color:#f5f5f7; }.build-copy > p{color:#a8a8b0}.build-panel .section-kicker{color:#9993ff}.notice{display:flex;flex-direction:column;gap:6px;margin-top:24px;padding:16px;border:1px solid #ffffff16;border-radius:14px;background:#ffffff0a}.notice strong{font-size:13px}.notice span{color:#b8b8c0;font-size:12px;line-height:1.5}.dark-secondary{border-color:#ffffff1f;background:#ffffff12;color:#fff}.code-card{overflow:hidden;border:1px solid #ffffff17;border-radius:20px;background:#0d0d12;box-shadow:0 30px 70px #0008}.code-title{height:46px;display:flex;align-items:center;gap:7px;padding:0 16px;border-bottom:1px solid #ffffff10}.code-title span{width:10px;height:10px;border-radius:50%;background:#ff605c}.code-title span:nth-child(2){background:#ffbd44}.code-title span:nth-child(3){background:#00ca4e}.code-title b{margin-left:auto;color:#787881;font-size:11px}.code-card pre{overflow:auto;margin:0;padding:24px;color:#d7d7df;font:12px/1.75 ui-monospace,SFMono-Regular,Menlo,monospace}.prompt{color:#8b83ff}

.requirements { display:grid;grid-template-columns:.45fr 1.55fr;gap:60px;align-items:start;padding-block:80px 110px }.requirements > div{display:flex;align-items:center;gap:13px}.requirements-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:#e4f5e9;color:#168448}.requirements h2{margin:0;font-size:24px}.requirements ul{display:grid;grid-template-columns:1fr 1fr;gap:30px 40px;margin:0;padding:0;list-style:none}.requirements strong,.requirements span{display:block}.requirements strong{font-size:14px}.requirements span{margin-top:6px;color:var(--muted);font-size:13px;line-height:1.5}
.footer{border-top:1px solid var(--hairline)}.footer-inner{min-height:150px;display:flex;align-items:center;justify-content:space-between;gap:30px}.footer strong{font-size:14px}.footer p{margin:6px 0 0;color:var(--muted);font-size:12px}.footer nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:22px}.footer a{min-height:44px;display:inline-flex;align-items:center;color:var(--muted);font-size:12px;text-decoration:none}.footer a:hover{color:var(--text)}

:focus-visible { outline: 3px solid rgba(0,122,255,.72); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { html{scroll-behavior:auto}.button{transition:none} }
@media (prefers-contrast: more) { :root{--hairline:rgba(0,0,0,.28)}.site-header,.glass-window,.glass-option,.quick-card,.source-picker{backdrop-filter:none;-webkit-backdrop-filter:none}.button-secondary{border-width:2px} }
@media (prefers-color-scheme: dark) {
  :root{--page:#0c0c0f;--surface:rgba(30,30,34,.72);--surface-solid:#17171b;--text:#f5f5f7;--muted:#a1a1a8;--hairline:rgba(255,255,255,.11);--shadow:0 20px 60px rgba(0,0,0,.28)}
  .site-header{background:rgba(12,12,15,.78)}.language-picker button[aria-pressed="true"]{background:#4b4b50;color:#fff}.button-secondary{background:rgba(255,255,255,.08)}.trust-strip{background:rgba(255,255,255,.04)}
  .blue-card{background:linear-gradient(145deg,#151a25,#171a2c)}.feature-symbol{filter:saturate(.82)}.source-picker{border-color:#ffffff18;background:#ffffff08}.source-picker .active{background:#292833;color:#a9a4ff}.detail-panel{background:linear-gradient(140deg,#25223c,#17252f)}
}
@media (max-width: 960px) {
  .hero{grid-template-columns:1fr;gap:25px;padding-top:65px}.hero-copy{text-align:center}.hero-lede{margin-inline:auto}.hero-actions{justify-content:center}.hero-visual{min-height:520px}.trust-strip{grid-template-columns:1fr 1fr;gap:24px}.trust-strip div:nth-child(2){border-right:0}.privacy-layout,.build-panel{grid-template-columns:1fr}.privacy-layout{gap:25px}.engine-grid{grid-template-columns:1fr 1fr}.detail-panel{grid-template-columns:1fr;padding:48px 0 0 48px}.detail-panel>div{padding-right:48px}.build-panel{gap:44px}.requirements{grid-template-columns:1fr}
}
@media (max-width: 700px) {
  .shell{width:min(100% - 32px,1180px)}.nav{height:56px}.nav-link{display:none}.nav-actions{gap:10px}.brand small{display:none}.hero{min-height:0;padding-block:52px}.hero h1{font-size:48px;white-space:normal}.hero-lede{font-size:17px}.hero-visual{min-height:410px}.glass-window{border-radius:18px}.window-content{padding:18px}.quick-card{min-height:110px;padding:13px}.trust-strip{margin-top:12px;padding:20px 8px}.trust-strip div{padding-inline:8px}.section{padding-block:78px}.feature-grid{grid-template-columns:1fr;margin-top:42px}.feature-wide{grid-column:auto;grid-template-columns:1fr}.feature-card{min-height:0;padding:27px;border-radius:24px}.source-picker{padding:10px}.source-picker div{min-height:100px}.screenshot-card{padding-right:0;padding-bottom:0}.screenshot-card .feature-copy{padding-right:27px}.privacy-visual{min-height:350px}.lock-ring{width:180px;height:180px}.engine-grid{grid-template-columns:1fr}.engine-grid article{min-height:0}.engine-grid p{min-height:0}.detail-panel{padding:34px 0 0 28px}.detail-panel>div{padding-right:28px}.build-panel{padding:30px 24px}.requirements{gap:34px;padding-block:62px}.requirements ul{grid-template-columns:1fr}.footer-inner{padding-block:32px;align-items:flex-start;flex-direction:column}.footer nav{justify-content:flex-start;gap:8px 18px}
}
@media (max-width: 420px) { .hero h1{font-size:42px}.hero-actions .button{width:100%}.hero-visual{min-height:370px}.app-heading small{font-size:10px}.window-content{padding:14px}.quick-grid{grid-template-columns:1fr}.quick-card:nth-child(2){display:none}.privacy-chip{display:none} }
