@charset "UTF-8";
:root { color-scheme: light; --bg:#f5f7f8; --paper:#fff; --ink:#14242a; --muted:#52636b; --line:#dce3e5; --soft:#eaf0f1; --teal:#007b87; --cyan:#22c3d5; --amber:#ffbe3f; --dark:#10232c; --max:1200px; font-family:"Segoe UI Variable","Segoe UI",system-ui,sans-serif; font-synthesis:none; }
:root[data-theme="dark"] { color-scheme:dark; --bg:#101b21; --paper:#17262e; --ink:#ecf2f3; --muted:#a6b9c1; --line:#304149; --soft:#1e333c; --teal:#57d6dd; --dark:#08151d; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:100px; }
body { margin:0; background:var(--bg); color:var(--ink); font-size:16px; line-height:1.6; }
button,a { -webkit-tap-highlight-color:transparent; }
a { color:inherit; }
button { font:inherit; cursor:pointer; }
button:disabled { cursor:default; opacity:.55; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:3px solid var(--teal); outline-offset:5px; }
[hidden] { display:none !important; }
::selection { color:#10232c; background:#a0eef1; }
.icon-defs { position:absolute; width:0; height:0; overflow:hidden; }
.icon { display:inline-block; width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; vertical-align:middle; }
.shell { width:min(calc(100% - 96px),var(--max)); margin-inline:auto; }
.skip-link { position:fixed; z-index:100; top:10px; left:10px; padding:12px 20px; color:var(--paper); background:var(--ink); transform:translateY(-160%); }
.skip-link:focus { transform:translateY(0); }
.site-header { position:sticky; z-index:30; top:0; border-bottom:1px solid var(--line); background:var(--bg); }
.nav-shell { display:flex; align-items:center; min-height:88px; gap:24px; }
.brand { display:inline-flex; align-items:center; gap:10px; font-size:23px; font-weight:800; letter-spacing:-1px; text-decoration:none; white-space:nowrap; }
.brand img { object-fit:contain; }
.brand-dot { color:var(--teal); }
nav { display:flex; align-items:center; gap:29px; margin-left:auto; }
nav a { color:var(--muted); text-decoration:none; font-size:13px; font-weight:650; }
nav a:hover { color:var(--teal); }
.nav-source { color:var(--ink); }
.theme-toggle { display:grid; place-items:center; flex-shrink:0; width:34px; height:34px; padding:0; border:0; border-radius:50%; color:var(--ink); background:transparent; font-size:24px; }
.theme-toggle:hover { background:var(--soft); }
.nav-toggle { display:none; }
.button { display:inline-flex; justify-content:center; align-items:center; gap:13px; min-height:54px; padding:14px 24px; border:1px solid transparent; border-radius:7px; font-size:14px; font-weight:700; text-decoration:none; transition:background .18s,transform .18s; }
.button:hover { transform:translateY(-2px); }
.button-primary,.button-small { color:var(--paper); background:var(--ink); }
.button-primary:hover,.button-small:hover { background:var(--teal); }
.button-small { min-height:40px; padding:9px 14px; gap:9px; font-size:12px; }
.button-small .icon { width:16px; height:16px; }
.button-text { padding-inline:5px; }
.button-text .icon { width:18px; }
.hero { display:grid; grid-template-columns:1.03fr 1fr; align-items:center; gap:50px; padding-block:90px 82px; }
.release-link { display:inline-flex; align-items:center; gap:9px; margin-bottom:27px; color:var(--muted); font-size:11px; font-weight:650; text-decoration:none; }
.release-tag { padding:4px 7px; color:#503800; background:#ffe19a; border-radius:3px; font-size:9px; font-weight:800; letter-spacing:.8px; }
h1,h2,h3,p { margin:0; }
.hero h1 { font-size:clamp(48px,5.1vw,72px); font-weight:760; line-height:1.04; letter-spacing:-3.8px; }
.hero h1 > span { color:var(--teal); }
.hero-description { margin-top:27px; max-width:480px; color:var(--muted); font-size:16px; line-height:1.85; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:22px; margin-top:31px; }
.hero-fineprint { display:flex; flex-wrap:wrap; gap:8px; margin-top:17px; color:var(--muted); font-size:10px; }
.hero-fineprint > span { color:#8ea2aa; }
.hero-bottom { display:flex; flex-wrap:wrap; align-items:center; gap:15px; padding-top:37px; margin-top:37px; border-top:1px solid var(--line); font-size:11px; color:var(--muted); }
.tiny-label { font-size:9px; font-weight:750; letter-spacing:1.4px; }
.platform-separator { padding-inline:7px; color:#8da2a9; }
.hero-product { position:relative; min-width:0; scroll-margin-top:120px; }
.preview-topline { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.preview-live { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:9px; font-weight:750; letter-spacing:1.2px; }
.preview-live i,.live-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--teal); }
.preview-version { color:var(--muted); font-size:10px; }
.product-window { overflow:hidden; border:1px solid #263d49; border-radius:12px; background:#0f202a; color:#edf5f6; box-shadow:0 18px 40px -18px #0e2e3e48; }
.product-titlebar { display:flex; align-items:center; justify-content:space-between; padding:12px 17px; border-bottom:1px solid #283a45; background:#152a36; font-size:10px; }
.product-titlebar > span:first-child { display:flex; align-items:center; gap:6px; font-weight:600; }
.window-dots { display:flex; gap:5px; }
.window-dots i { width:5px; height:5px; border-radius:50%; background:#4a626d; }
.preview-tabs { display:flex; gap:7px; padding:13px 20px 0; border-bottom:1px solid #263c47; background:#132632; }
.preview-tabs button { position:relative; padding:9px 12px 13px; border:0; color:#9eb5c2; background:transparent; font-size:10px; font-weight:650; }
.preview-tabs button[aria-selected="true"] { color:#6ce1e8; }
.preview-tabs button[aria-selected="true"]::after { position:absolute; right:10px; bottom:0; left:10px; height:2px; background:#4dd1dd; content:""; }
.preview-tabs button:focus-visible { outline-color:#6ce1e8; outline-offset:-2px; }
.preview-body { min-height:343px; padding:27px 23px 23px; }
.demo-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:23px; }
.demo-overline { color:#7a96a6; font-size:7px; letter-spacing:1.4px; font-weight:650; }
.demo-heading h2 { margin-top:5px; font-size:19px; line-height:1.3; letter-spacing:-.7px; }
.demo-heading h2 > span { margin-left:7px; color:#6e8b9b; font-size:10px; font-weight:500; }
.demo-add { padding:6px 10px; border-radius:4px; background:#254653; color:#8fe0e6; font-size:9px; white-space:nowrap; }
.demo-transfer { display:flex; gap:12px; padding-bottom:21px; }
.file-icon { display:grid; place-items:center; flex-shrink:0; width:34px; height:41px; border:1px solid #3a7582; border-radius:5px; background:#1a3640; color:#70d4df; font-size:8px; font-weight:800; }
.file-amber { color:#e5bf71; border-color:#655a40; background:#38362e; }
.file-muted { color:#96a8bb; border-color:#3e4e5f; background:#26323e; }
.demo-file { flex:1; min-width:0; }
.demo-file-heading { display:flex; align-items:center; justify-content:space-between; gap:9px; }
.demo-file-heading strong { overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; font-weight:600; }
.demo-status,.demo-waiting { color:#82c9d1; font-size:7px; white-space:nowrap; }
.demo-file > small { color:#7892a2; font-size:8px; }
.demo-track { height:4px; overflow:hidden; border-radius:4px; margin-top:13px; background:#243c48; }
.demo-track > span { display:block; height:100%; background:#45c6d2; border-radius:4px; transition:width .6s linear; }
.demo-meta { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 8px; margin-top:7px; color:#8ca5b4; font-size:8px; }
.demo-meta b { font-weight:400; }
.demo-metrics { display:flex; justify-content:space-between; gap:12px; margin-top:12px; color:#a1b8c5; font-size:8px; }
.demo-metrics strong { display:inline-block; margin-left:5px; color:#f1f8f9; font-size:9px; font-variant-numeric:tabular-nums; }
.demo-transfer-small { padding-block:17px; border-top:1px solid #233a46; }
.demo-transfer-small:last-child { padding-bottom:0; }
.demo-transfer-small .file-icon { width:28px; height:33px; font-size:7px; }
.demo-done { color:#79d2ad; font-size:7px; white-space:nowrap; }
.demo-done > span { margin-left:3px; }
.demo-waiting { color:#a2adbf; }
.preview-controls { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:11px 17px; border-top:1px solid #263d49; background:#122733; }
.preview-controls > span { color:#829fae; font-size:8px; }
.preview-controls > div { display:flex; gap:6px; }
.preview-controls button { min-height:29px; border:1px solid #3c5865; border-radius:4px; background:transparent; color:#d0e3ea; font-size:8px; padding:4px 8px; }
.preview-controls button:hover { border-color:#6ce1e8; color:#6ce1e8; }
.preview-controls button:focus-visible { outline-color:#6ce1e8; outline-offset:2px; }
.preview-caption { display:flex; align-items:center; justify-content:center; gap:10px; margin-top:17px; color:var(--muted); font-size:10px; }
.caption-mark { color:var(--teal); font-size:21px; }
.detail-filename { font-size:12px; font-weight:650; margin-top:-7px; }
.demo-detail-stats { display:grid; grid-template-columns:1fr 1fr; gap:17px 22px; margin:18px 0; }
.demo-detail-stats dt { color:#92adbd; font-size:8px; }
.demo-detail-stats dd { margin:3px 0 0; font-size:19px; font-weight:700; font-variant-numeric:tabular-nums; }
.mini-chart { border:1px solid #2b4350; border-radius:5px; padding:10px 12px 3px; }
.mini-chart > span { color:#90aab7; font-size:7px; letter-spacing:1px; }
.mini-chart svg { display:block; width:100%; height:65px; margin-top:5px; }
.chart-grid { fill:none; stroke:#263d49; stroke-width:1; }
.chart-area { fill:#1c58654d; }
.chart-stroke { fill:none; stroke:#4fc4d2; stroke-width:2; }
.demo-location { color:#87a4b5; font-size:7px; letter-spacing:.5px; margin-top:14px; }
.demo-location span { display:block; margin-top:3px; color:#cfdee5; font-size:9px; letter-spacing:0; }
.queue-description { color:#9eb5c2; font-size:10px; margin-bottom:17px; }
.queue-row { display:flex; align-items:center; gap:13px; padding:16px 0; border-top:1px solid #2a404c; }
.queue-number { color:#65bfcd; font-size:10px; }
.queue-row > div { flex:1; }
.queue-row strong { display:block; font-size:10px; font-weight:600; }
.queue-row small { display:block; font-size:8px; color:#89a4b3; margin-top:3px; }
.queue-state { color:#70d4c4; font-size:8px; }
.queue-state.waiting { color:#9fb2c6; }
.queue-state.scheduled { color:#dfc28b; }
.queue-note { display:flex; align-items:center; gap:8px; padding-top:18px; margin-top:3px; border-top:1px solid #2a404c; color:#9eb9c7; font-size:8px; }
.queue-note .icon { width:14px; height:14px; color:#55c9d6; }
.principles { display:grid; grid-template-columns:repeat(4,1fr); align-items:center; gap:20px; padding-block:28px; border-block:1px solid var(--line); }
.principles > span { display:flex; align-items:center; gap:9px; font-size:11px; font-weight:600; }
.principles .icon { width:17px; height:17px; color:var(--teal); }
.principles-muted { font-weight:400; color:var(--muted); }
.section { padding-block:105px; }
.section-heading { margin-bottom:43px; }
.eyebrow { margin-bottom:17px; color:var(--teal); font-size:10px; letter-spacing:1.7px; font-weight:750; }
.section-heading h2,.privacy-band h2,.final-section h2 { font-size:clamp(35px,4vw,52px); font-weight:730; line-height:1.13; letter-spacing:-2.4px; }
.section-heading > p:last-child { margin-top:19px; font-size:15px; color:var(--muted); line-height:1.8; }
.section-heading-row { display:flex; justify-content:space-between; align-items:flex-end; gap:40px; }
.detail-showcase { display:grid; grid-template-columns:1.24fr 1fr; gap:60px; align-items:center; }
.detail-image { position:relative; overflow:hidden; border:1px solid #253947; border-radius:11px; background:#10232c; }
.detail-image img { display:block; width:100%; height:auto; }
.image-caption { display:block; padding:10px 18px; color:#a4bac7; background:#10232c; border-top:1px solid #2c4450; font-size:9px; text-align:center; }
.feature-notes > article { display:flex; gap:20px; padding:23px 0; border-bottom:1px solid var(--line); }
.feature-notes > article:first-child { padding-top:0; }
.note-number { font-size:10px; font-weight:700; color:var(--teal); margin-top:4px; }
.feature-notes h3 { font-size:18px; font-weight:700; line-height:1.4; letter-spacing:-.5px; }
.feature-notes p { margin-top:9px; color:var(--muted); font-size:13px; line-height:1.8; }
.text-link { display:inline-flex; align-items:center; gap:13px; color:var(--teal); text-decoration:none; font-size:12px; font-weight:700; }
.text-link .icon { width:18px; height:18px; }
.text-link:hover { text-decoration:underline; text-underline-offset:5px; }
.feature-notes > .text-link { margin-top:28px; }
.types-section { padding-block:90px; border-block:1px solid var(--line); background:var(--paper); }
.section-heading-row > p { color:var(--muted); font-size:13px; line-height:1.8; }
.download-types { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
.type-card { padding:8px 33px 0; border-left:1px solid var(--line); }
.type-card:first-child { padding-left:0; border-left:0; }
.type-card:last-child { padding-right:0; }
.type-icon { display:grid; place-items:center; width:45px; height:45px; margin-bottom:26px; border-radius:11px; color:var(--teal); background:var(--soft); }
.type-amber { background:#fff0d0; color:#855e0b; }
.type-purple { background:#efebff; color:#635091; }
.type-card > .tiny-label { color:var(--muted); }
.type-card h3 { margin-top:9px; font-size:23px; font-weight:700; line-height:1.25; letter-spacing:-.7px; }
.type-card > p { margin-top:15px; color:var(--muted); font-size:13px; line-height:1.85; }
.type-card > .type-note { font-size:10px; padding-top:14px; border-top:1px solid var(--line); }
.file-types { display:flex; gap:7px; flex-wrap:wrap; margin-top:20px; }
.file-types span { background:var(--soft); color:var(--muted); padding:3px 8px; border-radius:4px; font-size:10px; }
.capabilities { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:48px; }
.capabilities article > h3 { padding-bottom:19px; border-bottom:2px solid var(--ink); font-size:18px; font-weight:700; letter-spacing:-.4px; }
.capabilities ul { margin:0; padding:0; list-style:none; }
.capabilities li { padding-top:24px; }
.capabilities li strong { display:block; font-size:13px; font-weight:650; }
.capabilities li span { display:block; margin-top:4px; color:var(--muted); font-size:12px; line-height:1.8; }
.privacy-band { background:#102c34; color:#f1f6f5; }
.privacy-band-inner { display:grid; grid-template-columns:auto 1fr .65fr; align-items:start; gap:37px; padding-block:70px; }
.privacy-emblem { display:grid; place-items:center; width:55px; height:55px; border:1px solid #3c666e; border-radius:50%; margin-top:30px; background:#153b42; }
.privacy-emblem .icon { width:26px; height:26px; color:#8ad9da; }
.privacy-band .eyebrow { color:#81cbce; }
.privacy-band h2 { font-size:44px; letter-spacing:-1.8px; }
.privacy-band p:not(.eyebrow) { max-width:460px; margin-top:19px; font-size:13px; color:#b4cccf; line-height:1.85; }
.privacy-band .text-link { margin-top:23px; color:#8edfe0; }
.privacy-aside { align-self:center; border-left:1px solid #3e6269; padding:14px 0 14px 40px; }
.privacy-aside > span { color:#91b5bb; font-size:9px; letter-spacing:1.5px; }
.privacy-aside strong { display:block; font-size:22px; line-height:1.4; letter-spacing:-.5px; margin-block:14px 24px; }
.privacy-aside a { color:#9bdddf; text-decoration:none; font-size:11px; }
.release-stamp { display:flex; align-items:center; flex-wrap:wrap; gap:10px; font-size:11px; color:var(--muted); }
.release-stamp strong { color:var(--ink); margin-left:7px; }
.release-stamp a { flex-basis:100%; padding-left:16px; font-size:10px; text-decoration:none; }
.download-cards { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.download-card { min-width:0; padding:32px; background:var(--paper); border:1px solid var(--line); border-radius:9px; }
.download-card-top { display:flex; align-items:center; gap:13px; }
.os-icon { flex-shrink:0; }
.windows-logo { display:grid; grid-template-columns:1fr 1fr; gap:3px; width:25px; height:25px; }
.windows-logo i { background:var(--teal); }
.linux-logo { width:25px; color:var(--teal); font-size:19px; font-weight:750; font-family:ui-monospace,monospace; }
.platform-label { color:var(--muted); font-size:9px; font-weight:750; letter-spacing:1.2px; }
.available-label { margin-left:auto; color:var(--teal); font-size:9px; background:var(--soft); padding:3px 8px; border-radius:4px; }
.download-card h3 { margin-top:30px; font-size:27px; line-height:1.25; letter-spacing:-1px; font-weight:700; }
.download-card > p:not(.download-footnote) { min-height:48px; margin-top:13px; color:var(--muted); font-size:13px; line-height:1.8; }
.button-full { display:flex; width:100%; justify-content:space-between; min-height:48px; margin-top:25px; padding:12px 16px; font-size:12px; }
.download-secondary { display:flex; align-items:center; justify-content:space-between; padding-block:20px; font-size:12px; font-weight:650; text-decoration:none; border-bottom:1px solid var(--line); }
.download-secondary small { margin-left:9px; color:var(--muted); font-size:10px; font-weight:400; }
.download-secondary:hover,.linux-downloads a:hover { color:var(--teal); }
.linux-downloads { display:flex; gap:22px; padding-block:20px; border-bottom:1px solid var(--line); }
.linux-downloads a { display:flex; flex:1; flex-wrap:wrap; gap:3px 12px; justify-content:space-between; text-decoration:none; font-size:11px; font-weight:650; }
.linux-downloads a > span { color:var(--muted); font-size:10px; font-weight:400; }
.download-card .download-footnote { margin-top:14px; color:var(--muted); font-size:10px; line-height:1.8; }
.platform-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 0; font-size:11px; color:var(--muted); }
.platform-footer strong { color:var(--ink); font-weight:600; }
.platform-footer a { font-size:10px; white-space:nowrap; text-decoration:none; }
.planned-dot { display:inline-block; width:6px; height:6px; margin-right:7px; border-radius:50%; background:#90a1aa; }
.browser-note { display:flex; align-items:center; gap:19px; padding:24px; border:1px solid var(--line); border-radius:8px; }
.browser-note > .icon { color:var(--teal); width:25px; height:25px; }
.browser-note p { flex:1; color:var(--muted); font-size:11px; }
.browser-note strong { color:var(--ink); display:block; font-size:13px; margin-bottom:2px; }
.browser-note a { color:var(--teal); font-size:11px; font-weight:600; text-decoration:none; }
.faq-section { display:grid; grid-template-columns:.75fr 1.25fr; gap:80px; padding-top:5px; padding-bottom:100px; }
.faq-section h2 { font-size:40px; }
.faq-list { border-top:1px solid var(--line); }
.faq-list details { border-bottom:1px solid var(--line); }
.faq-list summary { position:relative; padding:22px 30px 22px 0; cursor:pointer; font-size:13px; font-weight:650; list-style:none; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::after { content:"+"; position:absolute; right:1px; top:18px; color:var(--teal); font-size:22px; font-weight:400; }
.faq-list details[open] summary::after { content:"−"; }
.faq-list details > p { padding:0 30px 24px 0; color:var(--muted); font-size:12px; line-height:1.85; }
.faq-list a { color:var(--teal); }
.final-section { display:flex; align-items:center; justify-content:space-between; gap:40px; padding:65px 0 80px; border-top:1px solid var(--line); }
.final-section h2 { font-size:52px; }
.final-section > div:last-child { text-align:center; }
.final-section > div:last-child p { margin-top:13px; color:var(--muted); font-size:10px; }
.site-footer { padding-block:35px 22px; border-top:1px solid var(--line); background:var(--paper); }
.footer-main { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.footer-main .brand { font-size:21px; }
.footer-main > div:first-child > p { margin-top:6px; color:var(--muted); font-size:11px; }
.footer-links { display:flex; gap:25px; flex-wrap:wrap; }
.footer-links a { color:var(--muted); text-decoration:none; font-size:11px; }
.footer-links a:hover { color:var(--teal); }
.footer-bottom { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin-top:34px; padding-top:17px; border-top:1px solid var(--line); font-size:9px; color:var(--muted); }
.footer-bottom a { color:var(--muted); text-decoration:none; }
@media(min-width:1450px) { .hero { padding-block:112px 106px; gap:65px; } .hero h1 { font-size:76px; } }
@media(max-width:1100px) { .shell { width:calc(100% - 64px); } .nav-shell { gap:17px; } nav { gap:19px; } .hero { gap:32px; padding-block:70px; } .hero h1 { font-size:56px; letter-spacing:-2.8px; } .hero-description { font-size:14px; } .hero-actions { gap:14px; } .hero-actions .button { font-size:12px; padding-inline:16px; } .detail-showcase { gap:36px; } .feature-notes h3 { font-size:16px; } .feature-notes p { font-size:12px; } .type-card { padding-inline:25px; } .type-card h3 { font-size:20px; } }
@media(max-width:900px) { .nav-download { display:none; } .nav-shell { min-height:76px; } .hero { grid-template-columns:1fr; gap:50px; padding-block:58px 50px; } .hero-copy { max-width:650px; } .hero h1 { font-size:72px; } .hero-description { font-size:16px; } .hero-bottom { margin-top:27px; padding-top:23px; } .hero-product { width:min(100%,650px); justify-self:center; } .preview-body { min-height:355px; } .demo-file-heading strong { font-size:12px; } .demo-metrics { font-size:10px; } .demo-metrics strong { font-size:11px; } .demo-meta { font-size:9px; } .principles { grid-template-columns:1fr 1fr; gap:20px; } .detail-showcase { grid-template-columns:1fr; gap:36px; } .detail-image { max-width:760px; } .feature-notes > article { padding:20px 0; } .feature-notes h3 { font-size:19px; } .feature-notes p { font-size:14px; } .section-heading-row { display:block; } .section-heading-row > p { margin-top:22px; } .download-types { gap:0; } .type-card { padding-inline:20px; } .type-card h3 { font-size:20px; } .type-card > p { font-size:12px; } .capabilities { gap:28px; } .privacy-band-inner { grid-template-columns:auto 1fr; gap:28px; } .privacy-aside { grid-column:2; padding:20px 0 0; border-left:0; border-top:1px solid #3e6269; } .privacy-aside strong br { display:none; } .privacy-aside strong { font-size:20px; margin-block:8px; } .release-stamp { margin-top:25px; } .release-stamp a { flex-basis:auto; margin-left:5px; padding-left:0; } .download-card { padding:25px; } .download-card h3 { font-size:23px; } .linux-downloads { gap:12px; } .faq-section { gap:45px; grid-template-columns:.7fr 1.3fr; } .faq-section h2 { font-size:33px; } .browser-note { flex-wrap:wrap; } .browser-note a { flex-basis:100%; padding-left:43px; } }
@media(max-width:640px) { html { scroll-padding-top:90px; } .shell { width:calc(100% - 36px); } .nav-shell { min-height:68px; gap:14px; } .brand { font-size:21px; } .brand img { width:29px; height:29px; } .nav-toggle { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px; width:34px; height:34px; margin-left:auto; border:0; background:transparent; color:var(--ink); } .nav-toggle > span { width:19px; height:2px; background:currentColor; } .nav-toggle[aria-expanded="true"] > span:first-child { transform:translateY(3.5px) rotate(45deg); } .nav-toggle[aria-expanded="true"] > span:last-child { transform:translateY(-3.5px) rotate(-45deg); } nav { display:none; position:absolute; top:calc(100% + 1px); right:0; left:0; flex-direction:column; align-items:stretch; gap:0; margin:0; padding:13px 18px 18px; border-bottom:1px solid var(--line); background:var(--paper); box-shadow:0 15px 22px #11232c12; } nav.open { display:flex; } nav a { padding:12px; font-size:14px; } .theme-toggle { width:30px; height:30px; } .hero { padding-top:39px; gap:40px; } .release-link { gap:6px; font-size:9px; margin-bottom:25px; } .release-tag { font-size:8px; letter-spacing:.5px; } .hero h1 { font-size:clamp(43px,11.6vw,68px); letter-spacing:-2.6px; } .hero-description { font-size:14px; line-height:1.9; margin-top:22px; } .desktop-break { display:none; } .hero-actions { margin-top:25px; gap:12px; } .hero-actions .button { min-height:49px; font-size:12px; padding-inline:14px; } .hero-actions .button-text { padding-inline:0; gap:7px; } .hero-actions .icon { width:16px; } .hero-fineprint { font-size:9px; gap:6px; } .hero-bottom { gap:10px; font-size:10px; margin-top:25px; padding-top:22px; } .tiny-label { font-size:8px; letter-spacing:1px; } .preview-topline { gap:8px; } .preview-live { font-size:7px; letter-spacing:.8px; } .preview-version { font-size:9px; } .preview-tabs { padding-inline:12px; } .preview-tabs button { font-size:10px; padding-inline:11px; } .preview-body { padding:23px 16px 20px; min-height:348px; } .demo-heading { margin-bottom:20px; } .demo-heading h2 { font-size:19px; } .demo-file-heading strong { font-size:10px; } .demo-transfer { gap:10px; } .demo-status,.demo-done { font-size:6px; } .demo-metrics { gap:6px; font-size:7px; } .demo-metrics strong { font-size:8px; margin-left:2px; } .demo-meta { font-size:7px; } .file-icon { width:28px; height:36px; font-size:7px; } .demo-overline { font-size:6px; letter-spacing:1px; } .preview-controls { padding-inline:12px; } .preview-controls > span { font-size:7px; } .preview-controls button { font-size:7px; } .preview-caption { font-size:9px; gap:6px; } .principles { padding-block:22px; gap:18px 8px; } .principles > span { gap:7px; font-size:10px; } .principles .icon { width:15px; height:15px; } .principles-muted { font-size:9px; } .section { padding-block:70px; } .section-heading { margin-bottom:32px; } .section-heading h2,.privacy-band h2,.final-section h2 { font-size:38px; letter-spacing:-1.8px; } .eyebrow { font-size:8px; letter-spacing:1.3px; margin-bottom:15px; } .section-heading > p:last-child { font-size:13px; } .feature-notes > article { gap:16px; } .feature-notes h3 { font-size:17px; } .feature-notes p { font-size:13px; } .detail-showcase { gap:30px; } .image-caption { font-size:8px; } .types-section { padding-block:65px; } .download-types { grid-template-columns:1fr; } .type-card,.type-card:first-child,.type-card:last-child { padding:27px 0; border-left:0; border-bottom:1px solid var(--line); } .type-card:first-child { padding-top:0; } .type-card:last-child { padding-bottom:0; border-bottom:0; } .type-icon { margin-bottom:18px; width:40px; height:40px; } .type-card h3 { font-size:24px; } .type-card > p { font-size:13px; } .type-card > .type-note { font-size:10px; } .capabilities { grid-template-columns:1fr; gap:38px; } .capabilities article > h3 { font-size:21px; padding-bottom:16px; } .capabilities li { padding-top:20px; } .capabilities li strong { font-size:14px; } .capabilities li span { font-size:12px; } .privacy-band-inner { grid-template-columns:1fr; gap:23px; padding-block:55px; } .privacy-emblem { margin-top:0; width:45px; height:45px; } .privacy-aside { grid-column:auto; } .privacy-band h2 { font-size:38px; } .download-cards { grid-template-columns:1fr; gap:18px; } .download-card { padding:25px; } .download-card h3 { font-size:27px; } .download-card-top { gap:10px; } .platform-label { font-size:8px; } .download-card > p:not(.download-footnote) { min-height:0; } .download-secondary { flex-wrap:wrap; gap:8px; } .download-secondary small { font-size:9px; } .platform-footer { display:block; font-size:10px; } .platform-footer a { display:inline-block; margin-top:10px; } .browser-note { padding:20px; gap:14px; } .browser-note p { flex-basis:calc(100% - 40px); } .browser-note a { padding-left:0; font-size:10px; } .faq-section { grid-template-columns:1fr; padding-bottom:65px; gap:0; } .faq-section .section-heading { margin-bottom:27px; } .faq-section h2 { font-size:36px; } .faq-list summary { font-size:13px; } .final-section { display:block; padding-block:45px 60px; } .final-section > div:last-child { text-align:left; margin-top:29px; } .final-section h2 { font-size:41px; } .footer-main { flex-direction:column; align-items:flex-start; gap:26px; } .footer-links { gap:18px; } .footer-bottom { flex-direction:column; align-items:flex-start; gap:7px; margin-top:25px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none !important; animation:none !important; } }