*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:var(--font-ui);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--color-accent);outline-offset:6px}
::selection{background:var(--color-accent);color:var(--color-bg)}
img,svg{display:block;max-width:100%}
svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
h1,h2,h3,p,ul,ol,table{margin:0}
h1,h2,h3,strong{font-weight:600}
.wrap{width:min(1120px,calc(100% - 96px));margin-inline:auto}
.mono,.eyebrow{font-family:var(--font-mono)}
.eyebrow{font-size:12px;letter-spacing:.12em;color:var(--color-muted);line-height:1.5}
.soft{color:var(--color-secondary)}
.skip{position:fixed;left:16px;top:-96px;background:var(--color-accent);color:var(--color-bg);padding:12px 24px;z-index:10;border-radius:var(--radius)}
.skip:focus{top:16px}

.site-header{border-bottom:1px solid var(--color-line);position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--color-bg) 88%,transparent);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.header-inner{height:80px;display:flex;align-items:center;gap:32px}
.brand{display:inline-flex;align-items:center;gap:12px;font-size:18px;letter-spacing:-.03em;font-weight:600;white-space:nowrap}
.brand img{flex-shrink:0;border-radius:8px}
.brand-suffix{color:var(--color-secondary);font-weight:400}
.header-inner nav{margin-left:auto;display:flex;gap:28px;color:var(--color-secondary);font-size:14px}
.header-inner nav a,.site-footer a{transition:color .2s}
.header-inner nav a:hover,.site-footer a:hover{color:var(--color-accent)}
.header-link{font-size:14px;display:inline-flex;gap:12px;align-items:center;padding:10px 14px;border:1px solid var(--color-line);border-radius:var(--radius)}
.header-link:hover{background:var(--color-surface)}

.hero{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:48px;padding:96px 0 80px;min-height:640px}
.hero .eyebrow{display:flex;align-items:center;gap:12px}
.status-dot{width:6px;height:6px;display:inline-block;flex-shrink:0;border-radius:50%;background:var(--color-accent);box-shadow:0 0 12px color-mix(in srgb,var(--color-accent) 30%,transparent)}
h1{font-size:clamp(40px,4.8vw,64px);line-height:1.2;letter-spacing:-.05em;margin-top:28px}
h1>span{color:var(--color-accent)}
.hero-lead{color:var(--color-secondary);font-size:18px;line-height:1.9;margin-top:28px;max-width:34em}
.button{min-height:52px;display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:14px 22px;border-radius:var(--radius);font-weight:600;font-size:16px;transition:background .2s,transform .2s,color .2s}
.button:hover{transform:translateY(-2px)}
.primary{margin-top:28px;background:var(--color-accent);color:var(--color-action-ink)}
.primary:hover{background:var(--color-accent-hover)}
.button svg{width:18px;height:18px}
.hero-meta{color:var(--color-muted);font-size:12px;margin-top:16px;font-family:var(--font-mono)}
.hero-meta>span{margin:0 8px}

.hero-visual{position:relative;isolation:isolate;display:flex;justify-content:center;align-items:center;min-height:480px}
.hero-visual:before{content:"";position:absolute;inset:8% 12%;z-index:-1;background:radial-gradient(ellipse at 50% 45%,color-mix(in srgb,var(--color-accent) 14%,transparent),transparent 70%)}
.shot-frame{width:min(360px,100%);border-radius:22px;overflow:hidden;border:1px solid var(--color-line);background:var(--color-surface-glass);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:var(--shadow-panel)}
.shot-frame img{width:100%;height:auto}
.glass-note{margin-top:16px;text-align:center;font-size:11px;color:var(--color-muted);font-family:var(--font-mono);letter-spacing:.04em}

.spec-strip{padding:22px 0;display:flex;gap:28px;align-items:center;flex-wrap:wrap;border-top:1px solid var(--color-line);border-bottom:1px solid var(--color-line);color:var(--color-secondary);font-size:12px}
.spec-strip>span{display:flex;gap:10px;align-items:center}
.spec-mark{font-size:16px;color:var(--color-muted)}
.spec-strip .strip-end{margin-left:auto;font-size:12px;color:var(--color-muted);letter-spacing:.05em}

.section{padding:112px 0}
.section-heading{display:grid;grid-template-columns:1.1fr .9fr;gap:24px 48px;align-items:end;margin-bottom:48px}
.section-heading>.eyebrow{grid-column:1/-1}
h2{font-size:clamp(28px,3.6vw,44px);line-height:1.25;letter-spacing:-.04em}
.section-heading>p:last-child{color:var(--color-secondary);font-size:16px;line-height:1.9;max-width:32em}

.measure-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start}
.measure-card{padding:28px;border:1px solid var(--color-line);border-radius:var(--radius);background:var(--color-surface)}
.measure-stat{display:flex;align-items:baseline;gap:12px;margin-bottom:12px}
.measure-stat strong{font-size:56px;letter-spacing:-.06em;line-height:1;color:var(--color-accent)}
.measure-stat span{font-size:18px;color:var(--color-secondary)}
.measure-card p{color:var(--color-secondary);font-size:14px;line-height:1.9}
.measure-table{width:100%;border-collapse:collapse;font-size:14px}
.measure-table th,.measure-table td{padding:14px 12px;border-bottom:1px solid var(--color-line);text-align:left}
.measure-table th{color:var(--color-muted);font-weight:400;font-family:var(--font-mono);font-size:12px;letter-spacing:.06em}
.measure-table td:last-child,.measure-table th:last-child{text-align:right;font-variant-numeric:tabular-nums}
.measure-table tbody tr:last-child td{border-bottom:0}
.measure-table .accent{color:var(--color-accent);font-weight:600}
.measure-caption{margin-top:16px;font-size:12px;color:var(--color-muted);line-height:1.8}

.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.feature-card{padding:24px;border:1px solid var(--color-line);border-radius:var(--radius);background:color-mix(in srgb,var(--color-surface) 90%,transparent);min-height:168px}
.feature-card .icon{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:var(--color-surface);color:var(--color-accent);font-family:var(--font-mono);font-size:14px;margin-bottom:18px}
.feature-card h3{font-size:17px;letter-spacing:-.02em;margin-bottom:10px}
.feature-card p{color:var(--color-secondary);font-size:14px;line-height:1.85}

.feature-split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;margin-top:48px}
.feature-split .shot-frame{width:min(320px,100%);margin-inline:auto}
.feature-split h3{font-size:24px;letter-spacing:-.03em;margin-bottom:12px}
.feature-split p{color:var(--color-secondary);font-size:15px;line-height:1.9;max-width:34em}

.platform-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.platform-card{padding:22px;border:1px solid var(--color-line);border-radius:var(--radius);background:var(--color-surface)}
.platform-card .label{font-size:12px;font-family:var(--font-mono);letter-spacing:.08em;color:var(--color-muted);margin-bottom:10px}
.platform-card h3{font-size:18px;margin-bottom:8px}
.platform-card p{font-size:13px;color:var(--color-secondary);line-height:1.7}
.badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;font-size:11px;font-family:var(--font-mono);letter-spacing:.04em;margin-bottom:12px}
.badge-live{background:color-mix(in srgb,var(--color-accent) 18%,transparent);color:var(--color-accent)}
.badge-beta{background:color-mix(in srgb,#f0c14b 16%,transparent);color:#e6c36a}
.badge-plan{background:var(--color-surface);color:var(--color-muted);border:1px solid var(--color-line)}

.download-section{display:grid;grid-template-columns:1.2fr auto;gap:32px 48px;padding:48px;background:var(--color-surface);border-radius:var(--radius);position:relative;overflow:hidden}
.download-section:before{content:"";position:absolute;left:0;top:0;width:96px;height:2px;background:var(--color-accent)}
.download-heading{display:flex;gap:24px;align-items:flex-start}
.download-heading img{flex-shrink:0;border-radius:14px}
.download-heading .eyebrow{margin-bottom:16px}
.download-heading h2{font-size:32px}
.download-actions{align-self:center}
.download-button{width:100%;min-width:240px;background:var(--color-text);color:var(--color-bg);justify-content:space-between}
.download-button:hover{background:var(--color-secondary);color:var(--color-bg)}
.download-actions p{color:var(--color-muted);font-size:12px;margin-top:12px}
.release-link{font-size:12px;display:inline-block;margin-top:20px;color:var(--color-secondary)}
.release-link:hover{color:var(--color-accent)}
.download-notice{grid-column:1/-1;color:var(--color-muted);font-size:12px;padding-top:20px;border-top:1px solid var(--color-line);line-height:1.8}

.install-steps{list-style:none;padding:0;margin:40px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.install-steps li{padding:20px;border:1px solid var(--color-line);border-radius:var(--radius)}
.install-steps .step-no{display:block;font-family:var(--font-mono);font-size:12px;color:var(--color-accent);margin-bottom:10px}
.install-steps h3{font-size:16px;margin-bottom:8px}
.install-steps p{font-size:13px;color:var(--color-secondary);line-height:1.8}

.site-footer{padding:48px 0 56px;display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;border-top:1px solid var(--color-line)}
.site-footer .brand{font-size:14px}
.site-footer .credit{width:100%;font-size:13px;color:var(--color-secondary);line-height:1.8}
.site-footer .credit a{color:var(--color-accent);text-decoration:underline;text-underline-offset:3px}
.site-footer .meta{display:flex;align-items:center;gap:20px;margin-left:auto;font-size:12px;color:var(--color-secondary)}
.site-footer .mono{color:var(--color-muted)}
.lang-switch{width:100%;text-align:center;padding:4px 0 8px;font-size:12px}

@media(max-width:1000px){
  .wrap{width:calc(100% - 64px)}
  .hero{grid-template-columns:1fr;gap:40px;min-height:auto;padding:64px 0}
  .hero-copy{text-align:center}
  .hero .eyebrow{justify-content:center}
  .hero-lead{margin-inline:auto}
  .section-heading,.measure-grid,.feature-split,.download-section{grid-template-columns:1fr}
  .feature-grid{grid-template-columns:1fr 1fr}
  .platform-grid{grid-template-columns:1fr 1fr}
  .install-steps{grid-template-columns:1fr}
  .spec-strip .strip-end{display:none}
  .download-actions{max-width:320px}
}
@media(max-width:640px){
  .wrap{width:calc(100% - 40px)}
  .header-inner{height:72px;gap:16px}
  .header-inner nav a:nth-child(2),.header-link{display:none}
  .brand{font-size:16px}
  h1{font-size:36px;margin-top:20px}
  .hero-lead{font-size:15px}
  .section{padding:72px 0}
  .feature-grid,.platform-grid{grid-template-columns:1fr}
  .measure-stat strong{font-size:44px}
  .download-section{padding:28px 22px}
  .download-heading{flex-direction:column}
  .site-footer .meta{margin-left:0;width:100%}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation:none!important;transition:none!important}
  .button:hover{transform:none}
}
