* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 108px; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--font); font-size: 16px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
button, input { font: inherit; }
button, a, input { -webkit-tap-highlight-color: transparent; }
button, a { touch-action: manipulation; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }
img, svg { display: block; }
button:focus-visible, a:focus-visible, input:focus-visible, summary:focus-visible { outline: 3px solid #628d7b; outline-offset: 5px; }
::selection { background: #c3e0d0; color: #172522; }
h1, h2, h3, p, figure { margin: 0; }
h1, h2, h3 { font-weight: 500; }
.wrap { width: min(calc(100% - var(--gutter) * 2), var(--max-width)); margin-inline: auto; }
.icon-library { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon { width: 21px; height: 21px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.sr-only, .honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
[hidden] { display: none !important; }
.skip-link { position: fixed; top: -70px; left: 20px; z-index: 100; background: var(--ink); color: white; padding: 12px 20px; border-radius: 8px; }
.skip-link:focus { top: 12px; }
.button { border: 1px solid var(--ink); background: var(--ink); color: white; min-height: 52px; padding: 14px 23px; border-radius: 100px; display: inline-flex; align-items: center; justify-content: center; gap: 23px; font-size: 14px; font-weight: 500; line-height: 1.2; white-space: nowrap; transition: background .2s, transform .2s, box-shadow .2s; }
.button:hover { background: #31493e; border-color: #31493e; box-shadow: 0 5px 15px #17252212; transform: translateY(-1px); }
.button:active { transform: translateY(0); }
.button:disabled { opacity: .65; cursor: wait; transform: none; }
.button-small { min-height: 42px; font-size: 12px; padding: 10px 18px; gap: 16px; }
.button-small .icon { width: 17px; height: 17px; }
.eyebrow { display: flex; align-items: center; gap: 9px; text-transform: uppercase; font-size: 10px; line-height: 1.4; font-weight: 500; letter-spacing: 1.9px; }
.status-dot { display: inline-block; width: 6px; height: 6px; border-radius: 100%; background: #527967; box-shadow: 0 0 0 4px #dfeadf; flex-shrink: 0; }
.site-header { position: sticky; top: 0; z-index: 20; background: #fafbf8ef; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-bottom: 1px solid #1725220b; }
.header-inner { min-height: 87px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.wordmark { display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0; }
.wordmark span { font-size: 25px; font-weight: 550; letter-spacing: -1.1px; }
.desktop-nav { display: flex; align-items: center; gap: 30px; margin-left: 25px; }
.desktop-nav a { font-size: 12px; color: #55615a; transition: color .2s; }
.desktop-nav a:hover { color: var(--ink); }
.menu-toggle { display: none; }
.mobile-nav { padding: 12px var(--gutter) 25px; border-top: 1px solid var(--line); }
.mobile-nav a { display: block; padding: 11px 0; font-size: 15px; }
.hero { display: grid; grid-template-columns: 1.04fr 1fr; align-items: center; gap: 44px; padding-top: 62px; padding-bottom: 58px; }
.hero-copy { padding-bottom: 27px; }
.hero h1 { margin-top: 27px; font-size: clamp(52px, 5.5vw, 80px); line-height: 1.04; letter-spacing: -.066em; }
.hero h1 > span { color: #668174; }
.hero-description { max-width: 395px; font-size: 15px; color: var(--muted); line-height: 1.8; margin-top: 25px; }
.hero-actions { display: flex; align-items: center; gap: 26px; margin-top: 29px; }
.quiet-link { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; border-bottom: 1px solid transparent; padding: 7px 0; }
.quiet-link:hover { border-color: var(--ink); }
.quiet-link span { font-size: 18px; }
.availability { display: flex; align-items: center; gap: 8px; font-size: 10px; color: #717b73; margin-top: 22px; }
.availability .icon { width: 14px; height: 14px; }
.mirage-demo { min-width: 0; }
.mirage-scene { aspect-ratio: 1 / 1.04; width: 100%; background: radial-gradient(ellipse at 28% 4%, #f4f7f3 0%, transparent 55%), linear-gradient(145deg, #dce8df 0%, #edf2ec 55%, #d4e4d9 100%); border-radius: 8px; position: relative; isolation: isolate; overflow: hidden; }
.scene-grid { position: absolute; inset: 0; z-index: -2; background-image: linear-gradient(#17252205 1px, transparent 1px), linear-gradient(90deg, #17252205 1px, transparent 1px); background-size: 54px 54px; mask-image: linear-gradient(transparent, #000 70%); }
.scene-coordinate { position: absolute; top: 23px; left: 24px; font-size: 9px; font-family: var(--mono); letter-spacing: 1px; color: #698075; }
.glass-orbit { position: absolute; width: 88%; aspect-ratio: 1; border-radius: 50%; left: 11%; top: 11%; transform: rotate(-28deg) scaleX(.92); background: repeating-conic-gradient(from 3deg, #effaf200 0deg, #ffffffb8 1deg, #477e6633 1.65deg, #ffffffa1 2.4deg, #bdd5c729 3.1deg), radial-gradient(circle at 38% 20%, #f6fff9 0%, #d8eadc 40%, #b1cabb 70%, #f0fff1 100%); box-shadow: inset 0 0 12px #ffffff, inset 5px 0 14px #ffffff, 25px 36px 45px #4a73572e, -15px -15px 28px #ffffff91; }
.glass-orbit::before { content: ''; position: absolute; inset: 7px; border: 1px solid #ffffffad; border-radius: 50%; }
.orbit-core { position: absolute; inset: 25%; border-radius: 50%; background: linear-gradient(155deg, #c9dace, #ebf2e9); box-shadow: -8px -3px 14px #60856b44, 8px 8px 12px #ffffffc4, inset 0 0 10px #56786826; }
.data-card { position: absolute; width: 65%; top: 19%; left: 17%; border: 1px solid #ffffffd9; border-radius: 15px; background: #ffffffc4; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 18px 40px #3b544b1b, 0 2px 4px #3b544b0b; transform: rotate(-5deg); transition: transform .5s; }
.data-card-top { padding: 15px 15px 12px; border-bottom: 1px solid #576e5f16; display: flex; justify-content: space-between; align-items: center; color: #596b61; }
.card-brand { display: flex; align-items: center; gap: 5px; font-size: 9px; }
.data-card-top > .icon { width: 14px; height: 14px; }
.data-card-content { padding: 20px 22px 17px; }
.contact-avatar { width: 43px; height: 43px; border-radius: 50%; background: linear-gradient(125deg, #e2eee2, #cfddcc); color: #637a69; display: grid; place-items: center; font-size: 13px; letter-spacing: -.4px; }
.contact-name { margin-top: 10px; font-size: 21px; line-height: 1.4; letter-spacing: -.6px; }
.contact-type { font-size: 9px; color: #788078; margin-top: 1px; }
.data-fields { margin-top: 18px; display: grid; gap: 13px; }
.data-fields > div > span { font-size: 7px; letter-spacing: 1.1px; color: #8a928b; }
.data-fields p { font-size: 11px; margin-top: 3px; }
.data-card-bottom { display: flex; align-items: center; gap: 6px; border-top: 1px solid #576e5f16; padding: 11px 15px; font-size: 8px; color: #62766a; }
.mini-dot { width: 4px; height: 4px; border-radius: 50%; background: #7d9b83; }
.floating-tag { position: absolute; display: flex; align-items: center; background: #fafdf5e8; border: 1px solid #ffffffce; box-shadow: 0 4px 16px #4961510c; }
.tag-private { top: 12%; right: 6%; gap: 7px; font-size: 9px; padding: 9px 12px; border-radius: 100px; transform: rotate(5deg); z-index: 2; }
.tag-private .icon { width: 12px; height: 12px; }
.tag-key { bottom: 12%; right: 5%; gap: 9px; padding: 11px 17px 11px 11px; border-radius: 12px; transform: rotate(5deg); }
.key-circle { background: #e6eee3; width: 33px; height: 33px; display: grid; place-items: center; border-radius: 50%; }
.key-circle .icon { width: 17px; height: 17px; }
.tag-key strong { display: block; font-size: 10px; font-weight: 500; }
.tag-key div > span { display: block; font-size: 9px; color: #7a857b; margin-top: 2px; }
.scene-caption { position: absolute; bottom: 20px; left: 24px; font-size: 7px; letter-spacing: 1.5px; color: #718276; }
.demo-caption { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 15px; }
.view-switch { display: flex; padding: 3px; background: #edf0e9; border-radius: 100px; border: 1px solid #e3e8df; }
.view-switch button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 0; background: none; padding: 8px 12px; font-size: 9px; color: #727d74; border-radius: 100px; transition: background .2s, color .2s; }
.view-switch button[aria-pressed="true"] { background: #fff; color: var(--ink); box-shadow: 0 1px 4px #1725220b; }
.view-switch .icon { width: 13px; height: 13px; }
.demo-note { font-size: 8px; color: #7c877f; }
.mirage-scene[data-view="encrypted"] .data-card { transform: rotate(2deg); }
.mirage-scene[data-view="encrypted"] .data-fields p, .mirage-scene[data-view="encrypted"] .contact-name { font-family: var(--mono); color: #5a7669; letter-spacing: 1px; }
.mirage-scene[data-view="encrypted"] .contact-name { font-size: 18px; line-height: 29.4px; }
.mirage-scene[data-view="encrypted"] .contact-avatar { color: transparent; background: repeating-linear-gradient(90deg,#799285 0 1px,#dde9df 1px 4px); }
.principles { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); display: grid; grid-template-columns: repeat(3,1fr); padding-block: 24px; }
.principles p { display: flex; align-items: center; justify-content: center; gap: 10px; font-size: 11px; color: #56645c; }
.principles p + p { border-left: 1px solid var(--line); }
.principles .icon { width: 17px; height: 17px; }
.section-space { padding-top: 106px; padding-bottom: 105px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 44px; }
h2 { font-size: clamp(34px,3.7vw,51px); line-height: 1.09; letter-spacing: -.05em; }
.section-heading h2 { margin-top: 20px; }
.section-heading > p { font-size: 13px; line-height: 1.8; color: var(--muted); padding-bottom: 4px; margin-right: 15px; }
.protection-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.protection-card { min-width: 0; }
.card-illustration { height: 243px; border-radius: 13px; background: #eef2eb; position: relative; overflow: hidden; }
.protection-copy { padding: 24px 1px 0; }
.small-label { font-family: var(--mono); font-size: 9px; text-transform: uppercase; color: #7b867d; letter-spacing: .7px; }
.protection-copy h3 { font-size: 18px; letter-spacing: -.5px; margin-top: 9px; }
.protection-copy p { font-size: 12px; line-height: 1.85; color: var(--muted); margin-top: 10px; max-width: 320px; }
.contacts-art { padding: 30px 27px; background: linear-gradient(130deg,#e7eee4,#f0f3ec); }
.mini-contact { display: flex; align-items: center; gap: 11px; padding: 12px 14px; border: 1px solid #ffffff; background: #ffffffd4; border-radius: 9px; box-shadow: 0 3px 12px #39544104; transform: rotate(-3deg); }
.mini-contact + .mini-contact { margin-top: 8px; }
.mini-contact:nth-child(2) { transform: rotate(1deg) translateX(7px); }
.mini-contact:nth-child(3) { opacity: .62; }
.initials { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; font-size: 9px; }
.sage { background: #e2ebdf; color: #74836a; }.sand { background: #eee7dc; color: #9a8665; }.lavender { background: #e9e6ed; color: #97839e; }
.mini-contact strong { display: block; font-size: 10px; font-weight: 500; }
.mini-contact div > span { display: block; font-size: 8px; margin-top: 1px; color: #8a9189; }
.mini-contact > .icon { margin-left: auto; width: 13px; height: 13px; color: #7d8f7e; }
.notes-art { background: #f0eee7; padding: 26px 43px; }
.note-sheet { height: 230px; transform: rotate(6deg); padding: 27px 25px; background: #fafaf5; border-radius: 6px; box-shadow: 0 6px 18px #8c817014; }
.note-sheet > span:first-child { font-size: 12px; font-weight: 500; letter-spacing: -.2px; display: block; white-space: nowrap; margin-bottom: 22px; }
.note-line { height: 5px; background: #dfe1d4; border-radius: 3px; margin-top: 13px; width: 100%; }
.note-line.short { width: 68%; }.note-line.shorter { width: 42%; }
.note-seal { display: flex; align-items: center; justify-content: center; gap: 7px; width: fit-content; margin-top: 25px; border: 1px solid #dfe2d8; padding: 5px 10px; border-radius: 100px; color: #8e917f; font-size: 8px; }
.note-seal .icon { width: 10px; height: 10px; }
.details-art { background: linear-gradient(145deg,#e8edea,#e1e9e6); display: flex; flex-direction: column; justify-content: center; gap: 13px; padding-inline: 28px; }
.detail-chip { position: relative; display: flex; align-items: center; gap: 10px; font-size: 10px; padding: 14px 16px; border-radius: 9px; border: 1px solid #fff; background: #f9fcf7dd; z-index: 2; box-shadow: 0 4px 12px #17252205; }
.detail-chip .icon { width: 15px; height: 15px; color: #698075; }.detail-chip > span { margin-left: auto; color: #8da298; }
.chip-one { transform: rotate(-5deg) translateX(-9px); }.chip-two { transform: rotate(4deg) translateX(9px); }.chip-three { transform: rotate(-3deg); opacity: .7; }
.details-halo { width: 160px; height: 160px; position: absolute; right: -20px; top: -25px; border: 23px solid #fff5; border-radius: 50%; }
.privacy-story { background: var(--dark); color: #f4f5ed; overflow: hidden; }
.privacy-layout { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 90px; padding-block: 82px; }
.eyebrow.light { color: #acbdb0; }
.privacy-copy h2 { margin-top: 24px; font-size: clamp(38px,4.1vw,58px); }
.privacy-copy h2 > span { color: #b3c9b7; }
.privacy-copy > p:not(.eyebrow) { font-size: 12px; line-height: 1.85; color: #aebdb2; max-width: 330px; margin-top: 26px; }
.privacy-copy > p.privacy-emphasis { color: #e0e8dd; font-size: 13px; margin-top: 19px; }
.light-link { margin-top: 28px; display: inline-flex; align-items: center; gap: 18px; font-size: 12px; border-bottom: 1px solid #708b79; padding-bottom: 7px; }
.light-link:hover { border-color: #e8f2e5; }.light-link .icon { width: 17px; height: 17px; }
.cipher-art { position: relative; min-height: 476px; border: 1px solid #b2d0b51f; border-radius: 4px; padding: 27px 28px 20px; background: radial-gradient(ellipse at center,#64847033,transparent 65%),#f4ffee02; }
.cipher-top { display: flex; justify-content: space-between; gap: 15px; font-family: var(--mono); font-size: 7px; letter-spacing: .8px; color: #839789; }
.clear-message { padding: 33px 15px 25px; }
.clear-message > span, .cipher-message > span { color: #9ab09f; font-size: 9px; }
.clear-message p { font-size: 26px; letter-spacing: -1px; line-height: 1.35; margin-top: 10px; }
.refraction-band { position: relative; height: 83px; width: calc(100% + 105px); margin-left: -53px; display: grid; place-items: center; }
.refraction-lines { position: absolute; inset: 0; background: repeating-linear-gradient(90deg,#e4ffdc00 0px,#d8ffd312 2px,#efffe136 3px,#799b8222 4px,#203f2800 5px),linear-gradient(90deg,#9ec8a300,#c2e6bf33,#9ec8a300); mask-image: linear-gradient(90deg,transparent,black 20%,black 80%,transparent); border-block: 1px solid #cdeace26; transform: rotate(-5deg); }
.refraction-band img { position: relative; opacity: .9; }
.cipher-message { padding: 17px 15px 23px; }
.cipher-message p { font: 15px/1.7 var(--mono); color: #8ea690; letter-spacing: 2px; margin-top: 10px; }
.cipher-bottom { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 8px; color: #91a995; border-top: 1px solid #9ab89d26; padding-top: 16px; }
.cipher-bottom .icon { width: 12px; height: 12px; }
.steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 45px; margin-top: 57px; }
.steps article { border-top: 1px solid var(--line); padding-top: 21px; }
.step-number { font: 12px var(--mono); color: #84947f; }
.steps h3 { font-size: 19px; letter-spacing: -.6px; margin-top: 28px; }
.steps p { font-size: 12px; color: var(--muted); line-height: 1.9; max-width: 305px; margin-top: 11px; }
.people-section { border-block: 1px solid var(--line); display: flex; align-items: center; gap: 73px; padding: 56px 38px; }
.people-symbol { width: 150px; height: 150px; flex-shrink: 0; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 30% 20%,#f3f7ee,#d7e3d6); position: relative; }
.people-symbol::after { content: ''; position: absolute; inset: -10px; border: 1px solid #dbe4d8; border-radius: 50%; }
.people-symbol img { opacity: .7; }
.people-section h2 { font-size: clamp(27px,3.1vw,40px); margin-top: 18px; }
.people-section h2 span { color: #738473; }
.people-section p:last-child { margin-top: 19px; font-size: 12px; line-height: 1.85; color: var(--muted); max-width: 500px; }
.early-access { padding-top: 100px; }
.access-panel { position: relative; background: #e8efe4; border-radius: 16px; padding: 66px 30px 51px; text-align: center; overflow: hidden; isolation: isolate; }
.access-panel::after { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 75%,#f3f6ed,transparent 80%); z-index: -1; }
.access-orbit { position: absolute; width: 630px; height: 630px; right: -330px; top: -200px; border: 75px solid #c2d6bf69; border-radius: 50%; z-index: -2; box-shadow: 0 0 0 1px #f9fff6, 0 0 0 30px #d9e5d53b, 0 0 0 31px #f6fff44f; transform: rotate(35deg) scaleX(.82); }
.access-content { position: relative; max-width: 590px; margin-inline: auto; }
.access-content > .eyebrow { justify-content: center; }
.access-content h2 { margin-top: 22px; font-size: clamp(38px,4.3vw,60px); }
.access-content > p:not(.eyebrow) { font-size: 13px; color: #63705f; margin-top: 20px; line-height: 1.7; }
#access-form { margin-top: 29px; }
.email-row { display: flex; gap: 6px; padding: 6px; background: #fafcf5; border: 1px solid #d2ddcc; border-radius: 100px; text-align: left; max-width: 490px; margin-inline: auto; }
.email-row:focus-within { box-shadow: 0 0 0 3px #97b9a33d; border-color: #8fa791; }
.email-row input { width: 100%; min-width: 0; padding: 10px 15px; border: 0; border-radius: 100px; background: transparent; color: var(--ink); font-size: 12px; }
.email-row input:focus { outline: none; }.email-row input::placeholder { color: #7b8577; }
.email-row .button { min-height: 45px; font-size: 11px; padding: 12px 19px; gap: 15px; }.email-row .icon { width: 16px; height: 16px; }
.signup-note { font-size: 9px; color: #5f6c59; line-height: 1.8; margin-top: 14px; }.signup-note a { text-decoration: underline; text-underline-offset: 3px; }
.form-status { font-size: 12px; color: #774832; margin-top: 12px; min-height: 18px; }.form-status:empty { display: none; }
.signup-success { padding: 25px 15px 0; }.success-icon { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid #9eb8a1; border-radius: 100%; margin: 0 auto 13px; }.signup-success h3 { font-size: 25px; letter-spacing: -.8px; }.signup-success p { font-size: 12px; color: var(--muted); margin-top: 10px; line-height: 1.8; }
.faq-section { display: grid; grid-template-columns: 1fr 1.25fr; gap: 65px; padding-top: 95px; padding-bottom: 99px; }
.faq-intro h2 { margin-top: 20px; font-size: 39px; }
.faq-list details { border-bottom: 1px solid var(--line); }.faq-list details:first-child { border-top: 1px solid var(--line); }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 21px 0; font-size: 12px; cursor: pointer; list-style: none; }.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary > span { font-size: 21px; line-height: 1; color: #72806e; transition: transform .2s; }.faq-list details[open] summary > span { transform: rotate(45deg); }
.faq-list details p { margin: -3px 25px 23px 0; font-size: 12px; line-height: 1.9; color: var(--muted); }
.site-footer { border-top: 1px solid var(--line); padding-top: 37px; padding-bottom: 22px; }
.footer-top { display: flex; align-items: center; justify-content: space-between; gap: 30px; }.footer-top p { font-size: 12px; color: var(--muted); line-height: 1.7; margin-right: auto; margin-left: 45px; }.back-top { display: flex; gap: 25px; font-size: 10px; }.back-top span { font-size: 16px; line-height: 1; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; margin-top: 36px; padding-top: 19px; border-top: 1px solid var(--line); font-size: 9px; color: #7a8478; }
.footer-bottom a:hover { text-decoration: underline; }
.document-page { max-width: 750px; margin-inline: auto; padding: 70px 25px 95px; }.document-page h1 { font-size: clamp(39px,5vw,64px); line-height: 1.1; letter-spacing: -.05em; margin: 20px 0 30px; }.document-page h2 { font-size: 25px; margin: 35px 0 12px; }.document-page p, .document-page li { color: var(--muted); font-size: 14px; line-height: 1.85; margin-bottom: 15px; }.document-page a { text-decoration: underline; text-underline-offset: 3px; }.document-page .eyebrow { font-size: 10px; }
@media (min-width: 1500px) { .hero { gap: 70px; padding-top: 80px; padding-bottom: 75px; }.hero h1 { font-size: 85px; }.hero-description { font-size: 17px; max-width: 450px; }.data-card-content { padding: 28px; }.data-fields { gap: 20px; }.contact-avatar { width: 55px; height: 55px; }.contact-name { font-size: 25px; }.contact-type { font-size: 11px; }.data-fields p { font-size: 13px; }.data-fields > div > span { font-size: 8px; }.data-card-bottom { padding: 14px 20px; }.principles p { font-size: 13px; } }
@media (max-width: 1100px) { .hero { gap: 27px; }.hero h1 { font-size: 57px; }.hero-actions { gap: 15px; }.hero-actions .button { gap: 16px; padding-inline: 20px; }.quiet-link { font-size: 11px; }.hero-description { font-size: 13px; }.data-card-content { padding: 16px 18px 13px; }.data-card-top { padding: 11px 12px; }.contact-avatar { width: 34px; height: 34px; font-size: 11px; }.contact-name { font-size: 18px; margin-top: 8px; }.data-fields { gap: 8px; margin-top: 11px; }.data-fields p { font-size: 10px; }.data-card-bottom { padding: 9px 12px; font-size: 7px; }.tag-key { bottom: 9%; }.demo-note { font-size: 7px; }.view-switch button { padding-inline: 9px; font-size: 8px; }.privacy-layout { gap: 45px; }.contacts-art { padding-inline: 17px; }.notes-art { padding-inline: 23px; }.details-art { padding-inline: 20px; }.card-illustration { height: 228px; }.protection-copy h3 { font-size: 17px; }.people-section { gap: 50px; padding-inline: 20px; } }
@media (max-width: 850px) { .header-inner { min-height: 74px; gap: 15px; }.wordmark span { font-size: 22px; }.desktop-nav { gap: 19px; margin-left: 0; }.desktop-nav a { font-size: 10px; }.header-inner > .button { font-size: 10px; gap: 10px; }.hero { padding-top: 45px; gap: 20px; }.hero h1 { font-size: 48px; }.hero-actions { flex-wrap: wrap; gap: 8px 20px; }.hero-description { font-size: 12px; }.hero-actions .button { font-size: 12px; min-height: 47px; }.availability { font-size: 8px; }.mirage-scene { aspect-ratio: .86; }.data-card { width: 78%; left: 10%; top: 17%; }.glass-orbit { width: 104%; left: 0; top: 17%; }.contact-type { font-size: 8px; }.data-card-bottom { font-size: 6px; }.tag-private { right: 5%; top: 12%; font-size: 7px; }.tag-key { right: 5%; bottom: 10%; padding: 7px 11px 7px 7px; }.tag-key strong { font-size: 8px; }.tag-key div > span { font-size: 7px; }.scene-caption { font-size: 6px; left: 16px; bottom: 15px; }.demo-caption { justify-content: center; flex-wrap: wrap; gap: 6px; }.demo-note { display: block; width: 100%; text-align: center; }.principles p { font-size: 9px; gap: 7px; }.section-heading > p { font-size: 11px; margin-right: 0; }.section-space { padding-block: 75px; }.protection-grid { gap: 16px; }.card-illustration { height: 200px; }.contacts-art { padding: 25px 10px; }.mini-contact { padding: 8px; gap: 6px; }.initials { width: 25px; height: 25px; font-size: 8px; }.mini-contact strong { font-size: 8px; }.mini-contact div > span { font-size: 7px; }.mini-contact > .icon { width: 11px; height: 11px; }.notes-art { padding: 26px 17px; }.note-sheet { padding: 24px 15px; }.note-sheet > span:first-child { font-size: 9px; }.details-art { padding-inline: 12px; }.detail-chip { padding: 11px 10px; gap: 6px; font-size: 8px; }.detail-chip .icon { width: 12px; height: 12px; }.protection-copy h3 { font-size: 16px; line-height: 1.4; }.protection-copy p { font-size: 11px; }.privacy-layout { padding-block: 66px; gap: 30px; }.cipher-art { min-height: auto; padding: 20px 15px; }.cipher-top { font-size: 6px; gap: 5px; }.clear-message { padding: 30px 7px 25px; }.clear-message p { font-size: 22px; }.cipher-message { padding-inline: 7px; }.cipher-message p { font-size: 11px; letter-spacing: 1.2px; }.cipher-bottom { font-size: 6px; }.steps { gap: 25px; }.steps h3 { font-size: 17px; }.steps p { font-size: 11px; }.people-section { gap: 40px; padding: 40px 15px; }.people-symbol { width: 110px; height: 110px; }.people-symbol img { width: 65px; height: 65px; }.people-section h2 { font-size: 29px; }.early-access { padding-top: 75px; }.faq-section { gap: 35px; }.faq-intro h2 { font-size: 31px; }.faq-list summary { font-size: 11px; }.footer-top p { margin-left: 15px; } }
@media (max-width: 650px) { html { scroll-padding-top: 88px; }.header-inner { min-height: 73px; gap: 12px; }.header-inner .wordmark { gap: 5px; }.wordmark span { font-size: 22px; }.wordmark img { width: 30px; height: 30px; }.desktop-nav { display: none; }.header-inner > .button { margin-left: auto; min-height: 36px; padding: 9px 13px; gap: 6px; font-size: 9px; }.header-inner > .button .icon { width: 13px; height: 13px; }.menu-toggle { display: flex; width: 30px; height: 40px; align-items: center; justify-content: center; flex-direction: column; gap: 5px; padding: 5px; border: 0; background: transparent; }.menu-toggle span { width: 17px; height: 1px; background: var(--ink); transition: transform .2s; }.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3px) rotate(45deg); }.menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3px) rotate(-45deg); }.hero { grid-template-columns: 1fr; padding-top: 44px; padding-bottom: 34px; gap: 32px; }.hero-copy { padding-bottom: 0; }.hero .eyebrow { font-size: 8px; letter-spacing: 1.6px; }.hero h1 { font-size: clamp(49px,10.2vw,68px); margin-top: 23px; line-height: 1.06; }.hero-description { font-size: 13px; line-height: 1.8; margin-top: 21px; max-width: 380px; }.hero-actions { margin-top: 24px; gap: 23px; }.hero-actions .button { padding: 14px 22px; min-height: 49px; font-size: 12px; }.quiet-link { font-size: 11px; }.availability { margin-top: 18px; font-size: 9px; }.mirage-scene { aspect-ratio: 1 / 1.02; max-height: 440px; }.glass-orbit { width: 82%; top: 6%; left: 12%; }.data-card { width: 60%; left: 18%; top: 15%; }.data-card-content { padding: 13px 18px 12px; }.data-card-top { padding: 10px 13px; }.card-brand { font-size: 8px; }.contact-avatar { width: 31px; height: 31px; font-size: 10px; }.contact-name { font-size: 17px; }.contact-type { font-size: 7px; }.data-fields { margin-top: 10px; gap: 6px; }.data-fields > div > span { font-size: 6px; }.data-fields p { font-size: 9px; margin-top: 1px; }.data-card-bottom { font-size: 6px; padding: 8px 12px; }.tag-private { top: 8%; right: 6%; font-size: 7px; padding: 7px 9px; }.tag-key { bottom: 8%; right: 6%; }.key-circle { width: 27px; height: 27px; }.tag-key strong { font-size: 8px; }.scene-coordinate { top: 16px; left: 17px; font-size: 7px; }.scene-caption { bottom: 15px; font-size: 5px; letter-spacing: 1px; }.demo-caption { justify-content: space-between; flex-wrap: nowrap; margin-top: 12px; }.view-switch button { font-size: 8px; padding: 8px 9px; gap: 5px; }.view-switch .icon { width: 12px; height: 12px; }.demo-note { width: auto; font-size: 7px; }.mirage-scene[data-view="encrypted"] .contact-name { font-size: 15px; line-height: 23.8px; }.principles { padding: 21px 0; grid-template-columns: 1fr; gap: 16px; }.principles p { font-size: 10px; justify-content: flex-start; gap: 12px; }.principles p + p { border-left: none; }.principles .icon { width: 16px; height: 16px; }.section-space { padding-block: 64px; }.section-heading { align-items: flex-start; flex-direction: column; gap: 20px; margin-bottom: 30px; }.eyebrow { font-size: 8px; letter-spacing: 1.5px; }h2 { font-size: 37px; }.section-heading h2 { margin-top: 16px; }.section-heading > p { font-size: 12px; line-height: 1.8; }.protection-grid { grid-template-columns: 1fr; gap: 35px; }.card-illustration { height: 240px; }.contacts-art { padding: 28px 43px; }.mini-contact { padding: 11px 14px; gap: 10px; }.initials { width: 32px; height: 32px; font-size: 9px; }.mini-contact strong { font-size: 11px; }.mini-contact div > span { font-size: 8px; }.mini-contact > .icon { width: 13px; height: 13px; }.protection-copy { padding-top: 20px; }.protection-copy h3 { font-size: 21px; margin-top: 7px; }.protection-copy p { font-size: 12px; max-width: 420px; }.notes-art { padding: 30px 64px; }.note-sheet { padding: 28px 25px; }.note-sheet > span:first-child { font-size: 12px; }.details-art { padding-inline: 47px; }.detail-chip { font-size: 11px; padding: 15px; }.detail-chip .icon { width: 15px; height: 15px; }.privacy-layout { grid-template-columns: 1fr; gap: 39px; padding-block: 60px; }.privacy-copy h2 { font-size: 43px; margin-top: 20px; }.privacy-copy > p:not(.eyebrow) { font-size: 13px; max-width: 400px; margin-top: 24px; }.privacy-copy > p.privacy-emphasis { margin-top: 20px; }.light-link { font-size: 12px; }.cipher-art { padding: 23px; }.cipher-top { font-size: 7px; }.clear-message { padding: 23px 12px 20px; }.clear-message p { font-size: 24px; }.cipher-message { padding: 19px 12px 22px; }.cipher-message p { font-size: 14px; letter-spacing: 1.6px; }.cipher-bottom { font-size: 8px; }.steps { grid-template-columns: 1fr; gap: 30px; margin-top: 35px; }.steps article { position: relative; padding: 24px 0 0 47px; }.step-number { position: absolute; top: 29px; left: 0; font-size: 12px; }.steps h3 { font-size: 20px; margin-top: 0; }.steps p { font-size: 12px; max-width: none; }.people-section { flex-direction: column; align-items: flex-start; gap: 33px; padding: 47px 0; }.people-symbol { margin-left: 9px; width: 86px; height: 86px; }.people-symbol img { width: 48px; height: 48px; }.people-section h2 { font-size: 30px; line-height: 1.14; }.people-section h2 br { display: none; }.people-section h2 span { display: block; margin-top: 3px; }.people-section p:last-child { font-size: 12px; }.early-access { padding-top: 64px; }.access-panel { padding: 43px 22px 35px; }.access-content h2 { font-size: 39px; margin-top: 22px; }.access-content > p:not(.eyebrow) { font-size: 12px; }.email-row { flex-direction: column; padding: 0; border: none; border-radius: 0; background: none; gap: 9px; }.email-row:focus-within { box-shadow: none; }.email-row input { min-height: 50px; border: 1px solid #cddac7; background: #fcfdf8; padding: 12px 18px; font-size: 16px; }.email-row input:focus { outline: 2px solid #71977b; outline-offset: 1px; }.email-row .button { min-height: 48px; font-size: 12px; gap: 30px; }.signup-note { font-size: 8px; }.access-orbit { right: -470px; top: -200px; }.faq-section { grid-template-columns: 1fr; gap: 30px; }.faq-intro h2 { font-size: 35px; }.faq-list summary { font-size: 12px; padding-block: 22px; }.faq-list details p { font-size: 12px; }.site-footer { padding-top: 28px; padding-bottom: 25px; }.footer-top { align-items: flex-start; flex-wrap: wrap; gap: 18px; }.footer-top .wordmark { flex-basis: 100%; }.footer-top p { margin: 0; font-size: 11px; }.back-top { margin-left: auto; font-size: 9px; gap: 18px; padding-top: 2px; }.footer-bottom { margin-top: 26px; font-size: 8px; }.footer-bottom > span:nth-child(2) { display: none; } }
@media (max-width: 370px) { :root { --gutter: 18px; }.wordmark span { font-size: 19px; }.wordmark img { width: 26px; height: 26px; }.header-inner { gap: 6px; }.header-inner > .button { font-size: 8px; padding-inline: 10px; }.hero h1 { font-size: 44px; }.hero-actions { gap: 15px; }.hero-actions .button { padding-inline: 18px; }.quiet-link { font-size: 10px; }.mirage-scene { aspect-ratio: .98; }.data-card { width: 68%; left: 14%; top: 15%; }.tag-key { bottom: 7%; }.contacts-art { padding-inline: 29px; }.notes-art { padding-inline: 43px; }.details-art { padding-inline: 31px; }.access-panel { padding-inline: 19px; }.access-content h2 { font-size: 34px; }.cipher-message p { font-size: 12px; }.cipher-top { font-size: 6px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }