@font-face {
  font-family:'DM Sans';
  src:url('assets/dm-sans.woff2') format('woff2');
  font-style:normal;
  font-weight:100 1000;
  font-display:swap;
}

:root {
  --blue:#507fb5;
  --action:#376ba4;
  --blue-dark:#2c609c;
  --ink:#27323d;
  --muted:#65717c;
  --pale:#edf3f9;
  --line:#dce4ec;
  --white:#fff;
  font-family:'DM Sans',Arial,sans-serif;
  color:var(--ink);
  font-synthesis:none;
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:104px;
}

body {
  margin:0;
  background:#fff;
  font-size:16px;
  line-height:1.6;
}

a {
  color:inherit;
  text-decoration:none;
}

button,input {
  font:inherit;
}

button {
  cursor:pointer;
  color:inherit;
}

button,a {
  -webkit-tap-highlight-color:transparent;
}

img {
  display:block;
  max-width:100%;
  height:auto;
}

h1,h2,h3,p {
  margin-top:0;
}

button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible {
  outline:3px solid var(--action);
  outline-offset:5px;
}

[hidden] {
  display:none!important;
}

.container {
  width:min(1280px,calc(100% - 112px));
  margin-inline:auto;
}

.skip {
  position:fixed;
  top:-100px;
  left:20px;
  background:var(--ink);
  color:white;
  padding:12px;
  z-index:100;
}

.skip:focus {
  top:10px;
}

.icon {
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.5;
  stroke-linecap:round;
  stroke-linejoin:round;
  flex:none;
  vertical-align:middle;
}

.svg-definitions {
  position:absolute;
  width:0;
  height:0;
  overflow:hidden;
}

.header {
  position:sticky;
  top:0;
  background:#fffffff5;
  backdrop-filter:blur(16px);
  border-bottom:1px solid #e9edf2;
  z-index:30;
}

.header-inner {
  display:flex;
  align-items:center;
  min-height:94px;
  gap:28px;
}

.brand {
  display:block;
  width:135px;
  flex-shrink:0;
}

.product-wordmark {
  border-left:1px solid var(--line);
  padding-left:28px;
  font-size:23px;
  font-weight:750;
  letter-spacing:-1px;
  display:flex;
  align-items:center;
}

.product-wordmark>span:first-child {
  font-weight:400;
  color:var(--blue);
}

.wordmark-dot {
  height:5px;
  width:5px;
  border-radius:50%;
  background:var(--blue);
  margin:0 0 13px 3px;
}

.header nav {
  display:flex;
  align-items:center;
  gap:30px;
  font-size:13px;
  font-weight:550;
  margin-left:auto;
}

.header nav>a:not(.button):hover {
  color:var(--action);
}

.menu-toggle {
  display:none;
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  background:var(--action);
  border:1px solid transparent;
  border-radius:4px;
  padding:17px 23px;
  color:#fff;
  font-size:13px;
  font-weight:650;
  line-height:1.4;
  transition:background .2s,transform .2s;
}

.button:hover {
  background:#2d5989;
  transform:translateY(-2px);
}

.button.small {
  padding:12px 18px;
  gap:23px;
}

.button.small span {
  font-size:20px;
  font-weight:400;
  line-height:1;
}

.text-link {
  display:inline-flex;
  align-items:center;
  gap:22px;
  font-size:13px;
  font-weight:600;
}

.text-link>span {
  font-size:23px;
  font-weight:400;
  color:var(--blue);
  line-height:1;
}

.text-link:hover {
  color:var(--action);
}

.eyebrow {
  font-size:10px;
  font-weight:750;
  letter-spacing:1.8px;
  line-height:1.6;
  color:var(--blue-dark);
  margin-bottom:24px;
  display:flex;
  align-items:center;
  gap:11px;
}

.line {
  width:25px;
  height:2px;
  background:var(--blue);
  display:inline-block;
}

.hero {
  background:#edf3f9;
  overflow:hidden;
  position:relative;
}

.hero-layout {
  min-height:670px;
  display:grid;
  grid-template-columns:.87fr 1.3fr;
  gap:30px;
  align-items:center;
  padding-top:42px;
  padding-bottom:52px;
}

.hero-copy {
  position:relative;
  z-index:2;
  padding-block:18px;
}

h1 {
  font-size:clamp(56px,5.25vw,80px);
  line-height:1.02;
  letter-spacing:-3.8px;
  font-weight:550;
  margin-bottom:27px;
}

h1>span,h2>span {
  color:var(--blue);
}

.hero-description {
  max-width:365px;
  color:#5c6c7c;
  font-size:14px;
  line-height:1.85;
  margin-bottom:27px;
}

.hero-actions {
  display:flex;
  align-items:center;
  gap:22px;
  flex-wrap:wrap;
}

.hero-actions .text-link {
  font-size:12px;
  gap:12px;
}

.hero-platform {
  display:flex;
  align-items:center;
  gap:9px;
  font-size:10px;
  color:#68798a;
  margin:17px 0 0;
}

.hero-platform .icon {
  width:13px;
  height:13px;
}

.hero-visual {
  position:relative;
  padding-top:0;
  min-width:0;
  isolation:isolate;
  margin-right:-100px;
}

.hero-watermark {
  position:absolute;
  color:#d9e5f1;
  font-size:440px;
  line-height:1;
  font-weight:700;
  letter-spacing:-48px;
  right:-14px;
  top:-150px;
  z-index:-3;
  user-select:none;
}

.visual-orbit {
  position:absolute;
  width:580px;
  height:580px;
  border:1px solid #c7d8eb;
  border-radius:50%;
  top:-70px;
  left:100px;
  z-index:-2;
}

.visual-orbit:after {
  content:'';
  position:absolute;
  inset:42px;
  border:1px solid #d9e4f0;
  border-radius:50%;
}

.app-window {
  background:#f6f7f8;
  border:1px solid #fff;
  border-radius:9px;
  overflow:hidden;
  box-shadow:0 28px 75px #223c5d29,0 4px 14px #293e5a12;
}

.hero-app {
  transform:perspective(1600px) rotateY(-8deg) rotateZ(-2deg);
  position:relative;
  z-index:1;
  margin-top:10px;
}

.window-top {
  background:white;
  min-height:35px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 13px;
  font-size:9px;
  color:#5b6875;
}

.window-top>span:nth-child(2) {
  position:absolute;
  left:40%;
  font-weight:650;
}

.window-top b {
  font-weight:400;
  color:#8a95a0;
  margin-left:10px;
  font-size:8px;
}

.window-top>.icon {
  height:12px;
  width:12px;
  color:#8495a6;
}

.window-dots {
  display:flex;
  gap:5px;
}

.window-dots i {
  width:5px;
  height:5px;
  border-radius:50%;
  background:#d3dce5;
}

.image-expand {
  display:block;
  width:100%;
  padding:0;
  border:0;
  background:transparent;
  position:relative;
  text-align:left;
}

.image-expand img {
  width:100%;
}

.expand-corner {
  position:absolute;
  bottom:12px;
  right:12px;
  display:grid;
  place-items:center;
  background:#fffefb;
  border:1px solid #cbd6e2;
  border-radius:50%;
  width:32px;
  height:32px;
  color:var(--action);
  font-size:18px;
  opacity:0;
  transition:opacity .2s;
}

.image-expand:hover .expand-corner,.image-expand:focus-visible .expand-corner {
  opacity:1;
}

.device-float {
  position:absolute;
  left:15px;
  bottom:-48px;
  z-index:3;
  display:flex;
  align-items:center;
  gap:14px;
  background:#fff;
  border:1px solid #e6edf5;
  border-radius:6px;
  box-shadow:0 12px 36px #1c354b1a;
  padding:17px 23px 17px 12px;
  transform:rotate(-2deg);
}

.device-float>img {
  width:90px;
  height:67px;
  object-fit:contain;
  mix-blend-mode:multiply;
}

.device-float>div {
  display:grid;
}

.device-float small {
  font-size:7px;
  font-weight:650;
  letter-spacing:1.2px;
  color:#7b8d9f;
}

.device-float strong {
  font-size:18px;
  font-weight:600;
  letter-spacing:-.5px;
  display:flex;
  align-items:center;
  gap:12px;
  margin:3px 0;
}

.device-float>div>span {
  font-size:9px;
  color:#7a8795;
}

.status-dot {
  display:inline-block;
  background:#507fb5;
  width:6px;
  height:6px;
  border-radius:50%;
  flex:none;
}

.device-float>.icon {
  margin-left:15px;
  width:22px;
  height:22px;
  color:var(--blue);
  padding:3px;
  border:1px solid #c9d9ea;
  border-radius:50%;
}

.visual-footnote {
  position:absolute;
  right:34px;
  bottom:-64px;
  font-size:8px;
  color:#6b7e92;
  display:flex;
  align-items:center;
  gap:7px;
  margin:0;
}

.visual-footnote .status-dot {
  height:4px;
  width:4px;
}

.hero-bottom {
  border-top:1px solid #d5e0ec;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:67px;
  font-size:8px;
  letter-spacing:1.1px;
  color:#788b9e;
}

.hero-bottom b {
  font-weight:550;
  color:#536d85;
  margin-left:6px;
}

.hero-bottom>a {
  display:flex;
  gap:20px;
  align-items:center;
  font-weight:600;
}

.hero-bottom>a>span {
  font-size:20px;
  font-weight:400;
}

.benefit-strip {
  border-bottom:1px solid var(--line);
}

.benefit-inner {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px;
  min-height:124px;
  align-items:center;
}

.benefit-inner>div {
  display:flex;
  align-items:center;
  gap:20px;
}

.benefit-inner>div>.icon {
  width:27px;
  height:27px;
  color:var(--blue);
  stroke-width:1.25;
}

.benefit-inner p {
  font-size:13px;
  margin:0;
  font-weight:550;
  letter-spacing:-.15px;
}

.benefit-inner p>span {
  display:block;
  font-size:10px;
  margin-top:3px;
  font-weight:400;
  color:#7b8794;
}

.section {
  padding-block:100px;
}

.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:50px;
  margin-bottom:48px;
}

.section-heading .eyebrow {
  margin-bottom:18px;
}

h2 {
  font-size:clamp(35px,3.3vw,48px);
  line-height:1.16;
  font-weight:500;
  letter-spacing:-1.9px;
  margin-bottom:0;
}

.section-heading>p {
  max-width:340px;
  font-size:13px;
  line-height:1.9;
  color:var(--muted);
  margin:0 0 3px;
}

.experience-layout {
  display:grid;
  grid-template-columns:.86fr 1.7fr;
  gap:55px;
  align-items:center;
}

.experience-menu {
  display:grid;
  align-self:stretch;
  align-content:center;
}

.feature-tab {
  border:0;
  border-top:1px solid var(--line);
  background:white;
  padding:24px 0;
  display:flex;
  align-items:flex-start;
  gap:18px;
  text-align:left;
  position:relative;
}

.feature-tab:last-child {
  border-bottom:1px solid var(--line);
}

.feature-number {
  font-size:10px;
  color:#92a1b1;
  padding-top:3px;
}

.feature-tab strong {
  font-size:16px;
  letter-spacing:-.45px;
  font-weight:550;
  color:#72808c;
  display:block;
}

.feature-description {
  display:none;
  font-size:12px;
  line-height:1.85;
  color:var(--muted);
  margin-top:12px;
  max-width:255px;
}

.feature-tab[aria-selected=true] {
  border-top-color:var(--blue);
}

.feature-tab[aria-selected=true] strong {
  color:var(--ink);
}

.feature-tab[aria-selected=true] .feature-description {
  display:block;
}

.feature-tab[aria-selected=true] .feature-number,.feature-tab[aria-selected=true] .feature-arrow {
  color:var(--blue);
}

.feature-arrow {
  font-size:21px;
  line-height:1.3;
  margin-left:auto;
  color:#b2bdc8;
}

.feature-visual {
  position:relative;
  background:#eaf0f7;
  padding:47px 24px 39px;
  border-radius:5px;
  overflow:hidden;
}

.feature-visual:before {
  content:'';
  position:absolute;
  width:480px;
  height:480px;
  border:1px solid #d7e3ef;
  border-radius:50%;
  left:140px;
  top:-60px;
}

.visual-index {
  position:absolute;
  top:15px;
  left:24px;
  font-size:9px;
  letter-spacing:1px;
  color:#6c8299;
}

.feature-visual .image-expand {
  border-radius:5px;
  overflow:hidden;
  box-shadow:0 10px 24px #24394d1a;
  border:1px solid #fff;
}

.real-capture {
  position:absolute;
  right:24px;
  bottom:13px;
  font-size:7px;
  letter-spacing:1.1px;
  color:#778a9e;
}

.feature-panel>p {
  font-size:11px;
  color:#7a8794;
  margin:12px 0 0;
}

.scope-note {
  border-top:1px solid var(--line);
  margin:37px 0 0;
  padding-top:19px;
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-size:10px;
  color:#74818f;
  line-height:1.8;
}

.scope-note .icon {
  height:14px;
  width:14px;
  margin-top:2px;
}

.playground-section {
  background:#f3f6f9;
  padding-block:90px;
}

.playground-layout {
  display:grid;
  grid-template-columns:1fr 1.18fr;
  gap:90px;
  align-items:center;
}

.playground-copy>p:not(.eyebrow) {
  font-size:13px;
  line-height:1.9;
  color:var(--muted);
  max-width:350px;
}

.playground-copy h2 {
  margin-bottom:25px;
}

.playground-copy .demo-label {
  font-size:8px!important;
  letter-spacing:1.5px;
  font-weight:650;
  margin:28px 0 11px;
}

.style-buttons {
  display:flex;
  gap:8px;
}

.style-buttons button {
  border:1px solid #d5dfe9;
  background:transparent;
  border-radius:4px;
  padding:11px 14px;
  font-size:11px;
  display:flex;
  align-items:center;
  gap:8px;
  transition:background .2s;
}

.style-buttons button .icon {
  width:16px;
  height:16px;
}

.style-buttons button[aria-pressed=true] {
  background:#e0ebf6;
  border-color:#94b4d7;
  color:#315f91;
}

.playground-copy .demo-note {
  font-size:9px!important;
  color:#7b8794!important;
  max-width:320px;
  line-height:1.7;
  margin:12px 0 26px;
}

.demo-frame {
  border:1px solid #dbe4ed;
  background:white;
  border-radius:6px;
  padding:12px;
  box-shadow:0 18px 45px #334f6e0d;
  transform:rotate(1.3deg);
}

.demo-image-wrap {
  overflow:hidden;
  position:relative;
  border-radius:3px;
}

.demo-image-wrap>img {
  width:100%;
  aspect-ratio:1.58;
  object-fit:cover;
  transition:filter .35s;
}

.demo-tag {
  position:absolute;
  top:16px;
  left:16px;
  display:flex;
  align-items:center;
  gap:7px;
  font-size:7px;
  font-weight:550;
  letter-spacing:1px;
  padding:8px 11px;
  background:#fffef5;
  border-radius:3px;
  color:#4d6479;
}

.demo-tag .status-dot {
  width:5px;
  height:5px;
}

.demo-style-label {
  position:absolute;
  bottom:20px;
  left:21px;
  color:#fff;
  font-size:26px;
  letter-spacing:-1px;
  text-shadow:0 1px 8px #0008;
}

.demo-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 4px 4px;
  gap:15px;
  color:#7d8996;
  font-size:9px;
}

.demo-toolbar button {
  background:transparent;
  border:0;
  font-size:9px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:3px;
}

.demo-toolbar button[aria-pressed=true] {
  color:var(--action);
}

.demo-toolbar .icon {
  width:15px;
  height:15px;
}

.privacy-section {
  background:#273b51;
  color:white;
  padding-block:77px;
  overflow:hidden;
}

.privacy-layout {
  display:grid;
  grid-template-columns:1fr 1.12fr;
  gap:100px;
  align-items:center;
}

.privacy-copy .eyebrow {
  color:#a9c7e8;
}

.privacy-copy h2 {
  font-size:42px;
  letter-spacing:-1.6px;
}

.privacy-copy h2 span {
  color:#b2cfee;
}

.privacy-copy>p:not(.eyebrow) {
  font-size:13px;
  color:#c4d0dc;
  line-height:1.9;
  max-width:410px;
  margin:25px 0 22px;
}

.privacy-facts {
  display:flex;
  flex-wrap:wrap;
  gap:12px 20px;
  margin-bottom:26px;
}

.privacy-facts>span {
  display:flex;
  gap:6px;
  align-items:center;
  font-size:9px;
  color:#d5e0ec;
}

.privacy-facts .icon {
  height:12px;
  width:12px;
  color:#a5c6ec;
}

.privacy-copy .text-link {
  color:#e1edfa;
  font-size:11px;
  border-bottom:1px solid #8caed24d;
  padding-bottom:6px;
}

.privacy-copy .text-link>span {
  color:#a9c7e8;
}

.privacy-art {
  height:355px;
  position:relative;
  display:grid;
  place-items:center;
}

.privacy-ring {
  position:absolute;
  border:1px solid #abc9e321;
  border-radius:50%;
  aspect-ratio:1;
}

.privacy-ring.outer {
  width:380px;
}

.privacy-ring.inner {
  width:285px;
  border-style:dashed;
  transform:rotate(23deg);
}

.privacy-art:before,.privacy-art:after {
  content:'';
  position:absolute;
  background:#91b2d6;
  width:6px;
  height:6px;
  border-radius:50%;
  top:52px;
  left:66px;
  box-shadow:0 0 0 8px #a3c0e00a;
}

.privacy-art:after {
  top:auto;
  bottom:42px;
  left:auto;
  right:72px;
  width:4px;
  height:4px;
}

.privacy-symbol {
  height:151px;
  width:151px;
  background:#3a536c;
  border:1px solid #9bbada40;
  border-radius:32px;
  display:grid;
  place-items:center;
  transform:rotate(-9deg);
  box-shadow:0 20px 60px #111f302b;
}

.privacy-symbol svg {
  width:79px;
  height:79px;
  fill:none;
  stroke:#c5dcf3;
  stroke-width:.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  transform:rotate(9deg);
}

.privacy-pill {
  position:absolute;
  bottom:30px;
  left:50%;
  transform:translateX(-50%);
  white-space:nowrap;
  font-size:8px;
  font-weight:550;
  letter-spacing:1.5px;
  background:#324a62;
  border:1px solid #7395b84d;
  border-radius:30px;
  padding:11px 18px;
  display:flex;
  align-items:center;
  gap:9px;
}

.privacy-pill .status-dot {
  background:#b4d2f2;
  width:4px;
  height:4px;
}

.product-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}

.product-card {
  background:#edf3f9;
  position:relative;
  min-height:333px;
  padding:35px;
  overflow:hidden;
  border:1px solid #e3eaf1;
  border-radius:4px;
}

.product-card.c510 {
  background:#f2f4f6;
}

.product-info {
  position:relative;
  z-index:2;
}

.product-category {
  font-size:8px;
  letter-spacing:1.3px;
  color:#6f8193;
  font-weight:600;
}

.product-info h3 {
  font-size:43px;
  font-weight:500;
  letter-spacing:-2px;
  line-height:1.2;
  margin:22px 0 10px;
}

.product-info h3>span {
  font-size:19px;
  letter-spacing:-.5px;
  color:var(--blue);
  vertical-align:top;
  display:inline-block;
  margin-top:6px;
}

.product-info p {
  font-size:11px;
  max-width:160px;
  color:#748190;
  line-height:1.7;
}

.product-info .text-link {
  font-size:10px;
  gap:19px;
  margin-top:34px;
}

.product-card>img {
  position:absolute;
  right:-36px;
  top:35px;
  width:62%;
  height:240px;
  object-fit:contain;
  mix-blend-mode:multiply;
}

.product-card.c510>img {
  right:-26px;
  width:60%;
  transform:rotate(-9deg);
}

.compatible-tag {
  display:flex;
  align-items:center;
  gap:6px;
  position:absolute;
  bottom:23px;
  right:25px;
  font-size:8px;
  color:#68819a;
}

.compatible-tag .icon {
  width:13px;
  height:13px;
}

.compatibility-note {
  font-size:10px;
  line-height:1.8;
  color:#7d8995;
  margin:18px 0 0;
}

.download-section {
  background:#eaf1f8;
  padding-block:82px;
  position:relative;
  overflow:hidden;
}

.download-section:after {
  content:'VS';
  position:absolute;
  right:-70px;
  bottom:-180px;
  font-size:530px;
  font-weight:750;
  letter-spacing:-55px;
  line-height:1;
  color:#e0eaf4;
  pointer-events:none;
}

.download-layout {
  display:grid;
  grid-template-columns:1fr .8fr;
  gap:120px;
  position:relative;
  z-index:1;
  align-items:center;
}

.download-layout h2 {
  font-size:49px;
  letter-spacing:-2px;
}

.download-layout>div>p:not(.eyebrow) {
  font-size:13px;
  line-height:1.9;
  color:#63778a;
  max-width:390px;
  margin:23px 0;
}

.download-button {
  margin-top:5px;
  gap:18px;
}

.download-button .icon {
  width:18px;
  height:18px;
}

.download-button .icon:last-child {
  margin-left:17px;
}

.download-layout .download-meta {
  font-size:8px!important;
  letter-spacing:1px;
  font-weight:600;
  margin:17px 0 10px!important;
  color:#627991!important;
  display:flex;
  gap:11px;
  flex-wrap:wrap;
}

.download-layout .release-note {
  font-size:10px!important;
  line-height:1.8!important;
  margin:0 0 9px!important;
  max-width:360px!important;
}

.checksum {
  font-size:9px;
  color:#4a6b8d;
  text-decoration:underline;
  text-underline-offset:3px;
}

.requirements {
  background:#fffefb;
  border:1px solid #d6e1ed;
  border-radius:6px;
  padding:32px 34px;
}

.requirements-heading {
  display:flex;
  align-items:center;
  gap:13px;
  border-bottom:1px solid var(--line);
  padding-bottom:23px;
}

.requirements-heading .icon {
  width:23px;
  height:23px;
  color:var(--blue);
}

.requirements h3 {
  font-size:17px;
  font-weight:550;
  letter-spacing:-.4px;
  margin:0;
}

.requirements dl {
  margin:22px 0;
}

.requirements dl>div {
  display:grid;
  grid-template-columns:1fr 1.3fr;
  gap:14px;
  margin-bottom:18px;
  font-size:11px;
}

.requirements dt {
  color:#7c8996;
}

.requirements dd {
  margin:0;
  color:#4e6275;
}

.requirements-note {
  display:block;
  border-top:1px solid var(--line);
  padding-top:16px;
  font-size:9px;
  color:#7b8b9b;
}

.support {
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:110px;
}

.support h2 {
  font-size:39px;
}

.support-intro>p:not(.eyebrow) {
  font-size:13px;
  color:var(--muted);
  line-height:1.9;
  max-width:290px;
  margin:25px 0 20px;
}

.support .eyebrow {
  margin-bottom:20px;
}

.support .text-link {
  font-size:12px;
}

.faq {
  align-self:start;
}

.faq details {
  border-top:1px solid var(--line);
}

.faq details:last-child {
  border-bottom:1px solid var(--line);
}

.faq summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:21px 0;
  font-size:13px;
  font-weight:500;
  list-style:none;
  cursor:pointer;
}

.faq summary::-webkit-details-marker {
  display:none;
}

.faq summary>span {
  font-size:21px;
  color:var(--blue);
  font-weight:350;
  flex:none;
  line-height:1;
}

.faq details[open] summary>span {
  transform:rotate(45deg);
}

.faq details>p {
  font-size:12px;
  color:var(--muted);
  line-height:1.85;
  max-width:490px;
  padding-right:26px;
  margin:0 0 24px;
}

.footer {
  border-top:1px solid var(--line);
  padding:36px 0 22px;
}

.footer-top {
  display:flex;
  align-items:center;
  gap:30px;
  padding-bottom:30px;
}

.footer-top .brand {
  width:121px;
}

.footer-top p {
  margin:0 auto 0 0;
  color:#7a8793;
  font-size:11px;
  line-height:1.7;
}

.footer-top p strong {
  font-weight:500;
  color:#506171;
}

.footer-top .text-link {
  font-size:10px;
}

.footer-bottom {
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
  border-top:1px solid var(--line);
  padding-top:20px;
  font-size:9px;
  color:#7a8794;
}

.footer-bottom>div {
  display:flex;
  align-items:center;
  gap:25px;
}

.footer-bottom a:hover {
  color:var(--blue-dark);
}

dialog {
  width:min(1500px,94vw);
  max-height:94vh;
  border:1px solid #d6e2ed;
  border-radius:9px;
  background:#f6f7f8;
  padding:18px;
  box-shadow:0 28px 100px #0005;
}

dialog::backdrop {
  background:#142333c9;
  backdrop-filter:blur(8px);
}

dialog>img {
  width:100%;
  max-height:77vh;
  object-fit:contain;
}

dialog>button {
  display:flex;
  align-items:center;
  gap:15px;
  margin:0 0 14px auto;
  padding:7px 13px;
  background:white;
  border:1px solid var(--line);
  border-radius:4px;
  font-size:12px;
}

dialog>button>span {
  font-size:21px;
  line-height:1;
}

dialog>p {
  font-size:11px;
  color:#657585;
  margin:13px 0 0;
}

.privacy-page {
  background:#f3f6f9;
}

.privacy-document {
  max-width:850px;
  margin:45px auto;
  padding:42px;
  background:white;
  border:1px solid var(--line);
  border-radius:6px;
}

.privacy-document h1 {
  font-size:39px;
  letter-spacing:-1.7px;
  line-height:1.2;
  margin-top:30px;
}

.privacy-document h2 {
  font-size:22px;
  letter-spacing:-.5px;
  margin:30px 0 12px;
}

.privacy-document p {
  font-size:13px;
  color:var(--muted);
  line-height:1.9;
}

.privacy-document a {
  color:var(--action);
  text-decoration:underline;
  text-underline-offset:4px;
}

.privacy-document .date {
  font-size:11px;
  color:#7a8998;
}

@media(min-width:1600px) {
  .hero-layout {
    min-height:735px;
    grid-template-columns:1fr 1.5fr;
  }
  .hero-visual {
    margin-right:-90px;
  }
  .hero-description {
    max-width:385px;
  }
  .hero-platform {
    font-size:11px;
  }
  .visual-footnote {
    font-size:9px;
    right:35px;
  }
  .device-float {
    bottom:-51px;
    left:22px;
    padding:18px 25px 18px 13px;
  }
  .hero-watermark {
    font-size:500px;
    top:-160px;
  }
  .visual-orbit {
    width:660px;
    height:660px;
    top:-100px;
    left:60px;
  }
  .hero-bottom {
    min-height:74px;
  }
}

@media(max-width:1200px) {
  .container {
    width:calc(100% - 72px);
  }
  .header nav {
    gap:21px;
    font-size:12px;
  }
  .header-inner {
    gap:22px;
  }
  .brand {
    width:120px;
  }
  .product-wordmark {
    padding-left:22px;
  }
  .hero-layout {
    min-height:620px;
    grid-template-columns:.9fr 1.2fr;
    gap:24px;
  }
  .hero-visual {
    margin-right:-65px;
  }
  .hero-watermark {
    font-size:340px;
    top:-120px;
  }
  .hero-description {
    max-width:340px;
  }
  .hero-actions {
    gap:17px;
  }
  .hero-actions .button {
    gap:20px;
    padding:15px 18px;
  }
  .device-float {
    padding:12px;
    left:6px;
    gap:9px;
    bottom:-60px;
  }
  .device-float>img {
    width:65px;
    height:57px;
  }
  .device-float strong {
    font-size:16px;
  }
  .device-float>.icon {
    margin-left:5px;
  }
  .visual-footnote {
    bottom:-88px;
    right:5px;
    font-size:7px;
  }
  .visual-orbit {
    width:450px;
    height:450px;
    left:25px;
    top:-65px;
  }
  .experience-layout {
    gap:35px;
    grid-template-columns:.9fr 1.6fr;
  }
  .feature-tab {
    gap:13px;
  }
  .feature-tab strong {
    font-size:14px;
  }
  .feature-description {
    font-size:11px;
  }
  .playground-layout {
    gap:55px;
  }
  .privacy-layout {
    gap:55px;
  }
  .privacy-copy h2 {
    font-size:37px;
  }
  .download-layout {
    gap:60px;
  }
  .support {
    gap:60px;
  }
  .product-card {
    padding:28px;
    min-height:320px;
  }
  .product-card>img {
    right:-42px;
    width:65%;
    top:34px;
    height:220px;
  }
  .benefit-inner {
    gap:24px;
  }
  .benefit-inner>div {
    gap:13px;
  }
  .benefit-inner p {
    font-size:12px;
  }
  .benefit-inner p>span {
    font-size:9px;
  }
}

@media(max-width:980px) {
  .header nav {
    gap:15px;
    font-size:11px;
  }
  .header-inner {
    gap:16px;
    min-height:80px;
  }
  .brand {
    width:105px;
  }
  .product-wordmark {
    padding-left:16px;
    font-size:21px;
  }
  .button.small {
    padding:11px 14px;
    gap:15px;
    font-size:11px;
  }
  .hero-layout {
    grid-template-columns:.95fr 1.1fr;
    min-height:590px;
    gap:15px;
  }
  h1 {
    font-size:60px;
    letter-spacing:-3px;
  }
  .hero-description {
    font-size:12px;
    max-width:310px;
  }
  .hero-actions .text-link {
    font-size:11px;
  }
  .hero-actions .button {
    font-size:12px;
  }
  .hero-platform {
    font-size:9px;
  }
  .hero-visual {
    margin-right:-45px;
  }
  .hero-watermark {
    font-size:290px;
    top:-120px;
  }
  .visual-orbit {
    width:380px;
    height:380px;
    left:10px;
    top:-80px;
  }
  .window-top {
    min-height:29px;
  }
  .window-top>span:nth-child(2) {
    left:35%;
    font-size:8px;
  }
  .window-top b {
    font-size:7px;
    margin-left:6px;
  }
  .device-float>div>span {
    font-size:8px;
  }
  .device-float small {
    font-size:6px;
  }
  .device-float strong {
    font-size:15px;
  }
  .device-float>img {
    width:55px;
  }
  .device-float>.icon {
    display:none;
  }
  .benefit-inner {
    min-height:110px;
    gap:17px;
  }
  .benefit-inner>div {
    gap:10px;
  }
  .benefit-inner>div>.icon {
    width:21px;
    height:21px;
  }
  .benefit-inner p {
    font-size:11px;
  }
  .benefit-inner p>span {
    font-size:8px;
    max-width:170px;
  }
  .section {
    padding-block:75px;
  }
  .section-heading {
    gap:40px;
    margin-bottom:36px;
  }
  .section-heading>p {
    font-size:12px;
    max-width:290px;
  }
  h2 {
    font-size:37px;
  }
  .experience-layout {
    gap:26px;
    grid-template-columns:1fr 1.6fr;
  }
  .feature-tab {
    padding:20px 0;
    gap:11px;
  }
  .feature-tab strong {
    font-size:13px;
  }
  .feature-description {
    font-size:10px;
  }
  .feature-visual {
    padding:42px 15px 33px;
  }
  .visual-index {
    left:15px;
    font-size:8px;
  }
  .real-capture {
    right:15px;
    font-size:6px;
  }
  .feature-panel>p {
    font-size:9px;
  }
  .playground-layout {
    gap:35px;
    grid-template-columns:1fr 1.1fr;
  }
  .playground-section {
    padding-block:70px;
  }
  .playground-copy>p:not(.eyebrow) {
    font-size:12px;
  }
  .style-buttons {
    gap:5px;
  }
  .style-buttons button {
    padding:10px;
    font-size:10px;
    gap:5px;
  }
  .demo-toolbar>span {
    max-width:130px;
    line-height:1.6;
  }
  .privacy-layout {
    gap:38px;
  }
  .privacy-copy h2 {
    font-size:34px;
  }
  .privacy-copy>p:not(.eyebrow) {
    font-size:12px;
  }
  .privacy-art {
    height:310px;
  }
  .privacy-ring.outer {
    width:310px;
  }
  .privacy-ring.inner {
    width:235px;
  }
  .privacy-symbol {
    height:130px;
    width:130px;
  }
  .privacy-symbol svg {
    width:68px;
    height:68px;
  }
  .privacy-pill {
    bottom:17px;
    font-size:7px;
  }
  .privacy-facts {
    gap:10px 15px;
  }
  .product-card {
    padding:25px;
    min-height:305px;
  }
  .product-info h3 {
    font-size:36px;
  }
  .product-info p {
    max-width:130px;
    font-size:10px;
  }
  .product-card>img {
    width:66%;
    right:-43px;
    top:50px;
    height:190px;
  }
  .product-card.c510>img {
    right:-40px;
    top:52px;
  }
  .compatible-tag {
    font-size:7px;
    right:19px;
    bottom:19px;
  }
  .product-info .text-link {
    font-size:9px;
    gap:12px;
  }
  .download-layout {
    gap:40px;
    grid-template-columns:1fr 1fr;
  }
  .download-layout h2 {
    font-size:42px;
  }
  .requirements {
    padding:25px;
  }
  .requirements h3 {
    font-size:15px;
  }
  .requirements dl>div {
    font-size:10px;
  }
  .download-button {
    font-size:12px;
    padding:16px 18px;
    gap:12px;
  }
  .download-button .icon:last-child {
    margin-left:5px;
  }
  .support {
    gap:45px;
    grid-template-columns:1fr 1.1fr;
  }
  .support h2 {
    font-size:34px;
  }
  .faq summary {
    font-size:12px;
  }
  .footer-bottom {
    font-size:8px;
  }
  .footer-bottom>div {
    gap:16px;
  }
}

@media(max-width:760px) {
  html {
    scroll-padding-top:86px;
  }
  .container {
    width:calc(100% - 40px);
  }
  .header-inner {
    min-height:77px;
    gap:18px;
  }
  .brand {
    width:111px;
  }
  .product-wordmark {
    font-size:23px;
    padding-left:18px;
  }
  .menu-toggle {
    display:flex;
    margin-left:auto;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:6px;
    padding:10px;
    width:40px;
    height:40px;
    background:transparent;
    border:1px solid var(--line);
    border-radius:4px;
  }
  .menu-toggle>span {
    display:block;
    width:17px;
    height:1px;
    background:var(--ink);
    transition:transform .2s;
  }
  .menu-toggle[aria-expanded=true]>span:first-child {
    transform:translateY(3.5px) rotate(45deg);
  }
  .menu-toggle[aria-expanded=true]>span:last-child {
    transform:translateY(-3.5px) rotate(-45deg);
  }
  .header nav {
    display:none;
    position:absolute;
    top:77px;
    left:0;
    right:0;
    background:#fff;
    border-bottom:1px solid var(--line);
    padding:20px;
    box-shadow:0 18px 25px #293e5a0a;
    font-size:13px;
    gap:0;
  }
  .header nav.is-open {
    display:flex;
    flex-direction:column;
    align-items:stretch;
  }
  .header nav>a:not(.button) {
    padding:12px 4px;
  }
  .header nav>.button {
    margin-top:12px;
    font-size:13px;
    padding:14px 17px;
  }
  .hero-layout {
    display:flex;
    flex-direction:column;
    gap:0;
    min-height:0;
    padding:38px 0 102px;
    align-items:stretch;
  }
  .hero-copy {
    padding:0;
    z-index:2;
  }
  .eyebrow {
    font-size:9px;
    letter-spacing:1.6px;
    margin-bottom:20px;
  }
  h1 {
    font-size:66px;
    letter-spacing:-3.6px;
    line-height:1.01;
    margin-bottom:23px;
  }
  .hero-description {
    font-size:13px;
    max-width:390px;
    line-height:1.85;
    margin-bottom:24px;
  }
  .hero-actions {
    gap:23px;
  }
  .hero-actions .button {
    font-size:12px;
    padding:16px 18px;
    gap:22px;
  }
  .hero-actions .text-link {
    font-size:11px;
  }
  .hero-platform {
    font-size:9px;
    margin-top:16px;
  }
  .hero-visual {
    margin:49px 0 0;
    padding:0;
  }
  .hero-app {
    transform:rotate(-2deg);
    margin:0 -8px;
  }
  .hero-watermark {
    font-size:280px;
    top:-65px;
    right:0;
    letter-spacing:-32px;
  }
  .visual-orbit {
    width:345px;
    height:345px;
    top:-40px;
    left:15px;
  }
  .window-top {
    min-height:27px;
  }
  .window-top>span:nth-child(2) {
    font-size:7px;
    left:32%;
  }
  .window-top b {
    font-size:6px;
  }
  .device-float {
    left:3px;
    bottom:-51px;
    padding:9px 12px;
    gap:8px;
  }
  .device-float>img {
    width:53px;
    height:46px;
  }
  .device-float small {
    font-size:5px;
    letter-spacing:.8px;
  }
  .device-float strong {
    font-size:14px;
    margin:1px 0;
  }
  .device-float>div>span {
    font-size:7px;
  }
  .device-float .status-dot {
    width:4px;
    height:4px;
  }
  .visual-footnote {
    font-size:6px;
    right:0;
    bottom:-73px;
    gap:5px;
  }
  .hero-bottom {
    min-height:64px;
    font-size:6px;
    letter-spacing:.7px;
    align-items:center;
    gap:8px;
  }
  .hero-bottom>span {
    max-width:185px;
    line-height:1.9;
  }
  .hero-bottom b {
    display:block;
    margin-left:0;
  }
  .hero-bottom>a {
    gap:10px;
    font-size:6px;
  }
  .hero-bottom>a>span {
    font-size:18px;
  }
  .benefit-inner {
    grid-template-columns:1fr;
    gap:0;
    min-height:0;
    padding-block:7px;
  }
  .benefit-inner>div {
    padding:18px 0;
    gap:18px;
    border-bottom:1px solid #e7edf3;
  }
  .benefit-inner>div:last-child {
    border-bottom:0;
  }
  .benefit-inner>div>.icon {
    width:23px;
    height:23px;
  }
  .benefit-inner p {
    font-size:12px;
  }
  .benefit-inner p>span {
    font-size:10px;
    max-width:none;
    margin-top:3px;
  }
  .section {
    padding-block:60px;
  }
  .section-heading {
    display:block;
    margin-bottom:32px;
  }
  .section-heading .eyebrow {
    margin-bottom:17px;
  }
  h2 {
    font-size:35px;
    letter-spacing:-1.5px;
  }
  .section-heading>p {
    max-width:390px;
    font-size:12px;
    line-height:1.85;
    margin-top:23px;
  }
  .experience-layout {
    display:flex;
    flex-direction:column;
    gap:25px;
    align-items:stretch;
  }
  .experience-menu {
    width:100%;
  }
  .feature-tab {
    padding:18px 0;
    gap:14px;
  }
  .feature-tab strong {
    font-size:15px;
  }
  .feature-description {
    font-size:11px;
    max-width:290px;
    margin-top:10px;
  }
  .feature-number {
    font-size:9px;
  }
  .feature-visual {
    padding:39px 14px 32px;
  }
  .real-capture {
    font-size:6px;
    right:14px;
  }
  .feature-panel>p {
    font-size:10px;
    margin-top:11px;
  }
  .scope-note {
    margin-top:26px;
    font-size:9px;
    gap:9px;
    line-height:1.85;
  }
  .scope-note .icon {
    width:13px;
    height:13px;
  }
  .playground-section {
    padding-block:59px;
  }
  .playground-layout {
    display:flex;
    flex-direction:column;
    gap:34px;
    align-items:stretch;
  }
  .playground-copy h2 {
    margin-bottom:22px;
  }
  .playground-copy>p:not(.eyebrow) {
    font-size:12px;
    max-width:380px;
  }
  .style-buttons button {
    padding:11px 15px;
    font-size:11px;
    gap:7px;
  }
  .playground-copy .demo-label {
    margin-top:24px;
  }
  .playground-copy .demo-note {
    max-width:310px;
    font-size:9px!important;
    margin-bottom:20px;
  }
  .demo-frame {
    transform:rotate(1deg);
    padding:9px;
  }
  .demo-tag {
    top:13px;
    left:13px;
    font-size:6px;
    padding:7px 9px;
  }
  .demo-style-label {
    font-size:24px;
    bottom:16px;
    left:16px;
  }
  .demo-toolbar {
    font-size:8px;
    padding-top:13px;
  }
  .demo-toolbar>span {
    max-width:none;
  }
  .privacy-section {
    padding-block:50px;
  }
  .privacy-layout {
    display:flex;
    flex-direction:column-reverse;
    gap:25px;
    align-items:stretch;
  }
  .privacy-copy h2 {
    font-size:35px;
  }
  .privacy-copy>p:not(.eyebrow) {
    font-size:12px;
    max-width:380px;
  }
  .privacy-facts {
    gap:11px 20px;
    max-width:330px;
    margin-bottom:23px;
  }
  .privacy-facts>span {
    font-size:9px;
  }
  .privacy-copy .text-link {
    font-size:10px;
    gap:13px;
  }
  .privacy-art {
    height:290px;
  }
  .privacy-ring.outer {
    width:290px;
  }
  .privacy-ring.inner {
    width:220px;
  }
  .privacy-symbol {
    height:120px;
    width:120px;
    border-radius:26px;
  }
  .privacy-pill {
    bottom:15px;
    font-size:7px;
  }
  .privacy-art:before {
    left:47px;
    top:43px;
  }
  .privacy-art:after {
    right:43px;
    bottom:37px;
  }
  .product-grid {
    grid-template-columns:1fr;
    gap:16px;
  }
  .product-card {
    min-height:285px;
    padding:26px;
  }
  .product-info h3 {
    font-size:40px;
    margin-top:20px;
  }
  .product-info p {
    max-width:145px;
    font-size:11px;
  }
  .product-info .text-link {
    font-size:10px;
    margin-top:28px;
    gap:13px;
  }
  .product-card>img {
    right:-20px;
    top:32px;
    width:61%;
    height:205px;
  }
  .product-card.c510>img {
    right:-20px;
    top:35px;
    width:60%;
  }
  .compatible-tag {
    font-size:7px;
    right:20px;
    bottom:19px;
  }
  .compatibility-note {
    font-size:9px;
    margin-top:15px;
  }
  .download-section {
    padding-block:60px;
  }
  .download-layout {
    grid-template-columns:1fr;
    gap:35px;
  }
  .download-layout h2 {
    font-size:41px;
  }
  .download-layout>div>p:not(.eyebrow) {
    font-size:12px;
    margin:22px 0;
    max-width:370px;
  }
  .download-button {
    font-size:12px;
    padding:17px 19px;
    gap:13px;
    max-width:100%;
  }
  .download-button .icon:last-child {
    margin-left:8px;
  }
  .download-layout .download-meta {
    font-size:7px!important;
    gap:8px;
  }
  .download-layout .release-note {
    font-size:9px!important;
    max-width:330px!important;
  }
  .checksum {
    font-size:8px;
  }
  .requirements {
    padding:26px;
  }
  .requirements h3 {
    font-size:17px;
  }
  .requirements dl>div {
    font-size:11px;
    margin-bottom:19px;
    grid-template-columns:1fr 1.4fr;
  }
  .requirements-note {
    font-size:9px;
  }
  .support {
    display:block;
  }
  .support h2 {
    font-size:35px;
  }
  .support-intro>p:not(.eyebrow) {
    font-size:12px;
    max-width:330px;
    margin:22px 0 16px;
  }
  .support .text-link {
    font-size:11px;
  }
  .faq {
    margin-top:34px;
  }
  .faq summary {
    font-size:12px;
    line-height:1.65;
    padding:20px 0;
    gap:18px;
  }
  .faq summary>span {
    font-size:22px;
  }
  .faq details>p {
    font-size:11px;
    line-height:1.9;
    padding-right:18px;
  }
  .footer {
    padding-top:29px;
  }
  .footer-top {
    gap:20px;
    flex-wrap:wrap;
    padding-bottom:25px;
  }
  .footer-top .brand {
    width:107px;
  }
  .footer-top p {
    font-size:9px;
  }
  .footer-top .text-link {
    font-size:9px;
    gap:14px;
    margin-left:auto;
  }
  .footer-bottom {
    font-size:8px;
    display:block;
    line-height:1.8;
    padding-top:18px;
  }
  .footer-bottom>div {
    gap:19px;
    margin-top:9px;
  }
  .privacy-document {
    padding:27px 22px;
    margin:24px 20px;
  }
  .privacy-document h1 {
    font-size:31px;
  }
  .privacy-document h2 {
    font-size:20px;
  }
  .privacy-document p {
    font-size:12px;
  }
  dialog {
    padding:12px;
    width:96vw;
  }
  dialog>p {
    font-size:9px;
  }
  dialog>button {
    font-size:11px;
    padding:6px 10px;
  }
}

@media(max-width:360px) {
  h1 {
    font-size:59px;
  }
  .hero-actions {
    gap:14px;
  }
  .hero-actions .button {
    font-size:11px;
    gap:15px;
  }
  .hero-actions .text-link {
    font-size:10px;
    gap:7px;
  }
  .hero-platform {
    font-size:8px;
  }
  .style-buttons button {
    padding:10px 12px;
  }
  .product-card>img {
    width:62%;
    right:-35px;
  }
  .download-button {
    font-size:11px;
    padding:16px 14px;
    gap:9px;
  }
  .download-button .icon:last-child {
    margin-left:3px;
  }
  .requirements {
    padding:22px;
  }
  .footer-top .text-link {
    margin-left:0;
  }
  .visual-orbit {
    width:290px;
    height:290px;
  }
}

@media(max-width:760px) {
  .product-card {
    display:flex;
    flex-direction:column;
    min-height:0;
    padding:25px;
  }
  .product-card>img,.product-card.c510>img {
    position:static;
    order:-1;
    width:100%;
    height:175px;
    transform:none;
    margin-bottom:18px;
  }
  .product-info h3 {
    margin:12px 0 8px;
  }
  .product-info p {
    max-width:none;
  }
  .product-info .text-link {
    margin-top:15px;
  }
  .compatible-tag {
    position:static;
    align-self:flex-start;
    width:100%;
    margin-top:20px;
    padding-top:14px;
    border-top:1px solid #d8e1ea;
    font-size:8px;
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    transition:none!important;
    animation:none!important;
  }
}