@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/inter-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  @font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/inter-latinext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }
  @font-face {
    font-family: 'JetBrains Mono';
    font-style: normal;
    font-weight: 400 600;
    font-display: swap;
    src: url('../fonts/jbm-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  @font-face {
    font-family: 'JetBrains Mono';
    font-style: normal;
    font-weight: 400 600;
    font-display: swap;
    src: url('../fonts/jbm-latinext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }

  :root{
    --bg:#050505;
    --bg-raised:#0c0c0c;
    --card:#0d0d0d;
    --card-2:#101010;
    --border:#1b1b1b;
    --border-soft:#151515;
    --ink:#f6f5f2;
    --ink-dim:#a7a49c;
    --ink-faint:#726f68;
    --primary:#fb7c00;
    --primary-ink:#1a0e00;
    --accent:#5fcb6c;
    --danger:#f5434a;
    --radius:10px;
    --radius-sm:6px;
    --maxw:1220px;
    --edge:clamp(20px,4vw,56px);
    --serif-track:.02em;
  }

  *,*::before,*::after{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%;}
  body{
    margin:0;
    background:var(--bg);
    color:var(--ink);
    font-family:'Inter',ui-sans-serif,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    font-size:16px;
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}
  ul{margin:0;padding:0;list-style:none;}
  h1,h2,h3,p{margin:0;}
  h1,h2,h3{text-wrap:balance;}
  button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;}
  .mono{font-family:'JetBrains Mono',ui-monospace,"SF Mono","Cascadia Code","Roboto Mono",Consolas,monospace;}

  .wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--edge);}

  ::selection{background:var(--primary);color:var(--primary-ink);}

  /* ---------- eyebrow / labels ---------- */
  .eyebrow{
    display:inline-flex;align-items:center;gap:.5em;
    font-family:'JetBrains Mono',monospace;
    font-size:.72rem;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:var(--ink-dim);
  }
  .eyebrow::before{
    content:"";
    width:6px;height:6px;
    border-radius:50%;
    background:var(--accent);
    box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
    flex:none;
  }

  /* ---------- buttons ---------- */
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:.5em;
    padding:.85em 1.6em;
    border-radius:999px;
    font-weight:600;
    font-size:.95rem;
    letter-spacing:.01em;
    white-space:nowrap;
    transition:transform .15s ease, background-color .15s ease, border-color .15s ease, opacity .15s ease;
  }
  .btn-primary{
    background:var(--primary);
    color:var(--primary-ink);
  }
  .btn-primary:hover{transform:translateY(-1px);}
  .btn-ghost{
    border:1px solid var(--border);
    color:var(--ink);
  }
  .btn-ghost:hover{border-color:var(--ink-faint);}
  .btn-text{
    color:var(--ink-dim);
    font-size:.95rem;
    font-weight:500;
    border-bottom:1px solid transparent;
  }
  .btn-text:hover{color:var(--ink);border-color:var(--border);}

  /* ---------- nav ---------- */
  .nav{
    position:sticky;top:0;z-index:40;
    background:color-mix(in srgb, var(--bg) 82%, transparent);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    border-bottom:1px solid var(--border-soft);
  }
  .nav-row{
    display:flex;align-items:center;justify-content:space-between;
    height:72px;
  }
  .brand{display:flex;align-items:center;gap:.65em;font-weight:700;font-size:1.05rem;letter-spacing:-.01em;}
  .brand-mark{
    --mark-size:32px;
    width:var(--mark-size);
    aspect-ratio:64/50;
    flex:none;
    border-radius:8px;
    background:#efe8d9;
    overflow:hidden;
    display:flex;
  }
  .brand-mark img{
    width:100%;height:auto;
    object-fit:cover;object-position:top;
    transform:scale(1.14) translateY(2%);
  }
  .nav-links{display:flex;align-items:center;gap:2.1rem;}
  .nav-links a{font-size:.92rem;color:var(--ink-dim);transition:color .15s ease;}
  .nav-links a:hover{color:var(--ink);}
  .nav-right{display:flex;align-items:center;gap:1.4rem;}
  .lang-toggle{
    display:flex;align-items:center;
    font-family:'JetBrains Mono',monospace;
    font-size:.72rem;letter-spacing:.06em;
    border:1px solid var(--border);
    border-radius:999px;
    padding:3px;
  }
  .lang-toggle button{
    padding:.4em .8em;border-radius:999px;color:var(--ink-faint);
    transition:background-color .15s ease,color .15s ease;
  }
  .lang-toggle button.active{background:var(--ink);color:var(--bg);}
  .nav-burger{display:none;width:36px;height:36px;align-items:center;justify-content:center;border:1px solid var(--border);border-radius:var(--radius-sm);}
  .nav-burger svg{width:18px;height:18px;}

  @media (max-width:880px){
    .nav-links{
      position:fixed;inset:72px 0 auto 0;
      flex-direction:column;align-items:stretch;gap:0;
      background:var(--bg);
      border-bottom:1px solid var(--border-soft);
      padding:.5rem var(--edge) 1.2rem;
      transform:translateY(-8px);
      opacity:0;pointer-events:none;
      transition:opacity .18s ease, transform .18s ease;
    }
    .nav-links a{padding:.85em 0;border-bottom:1px solid var(--border-soft);}
    .nav.open .nav-links{opacity:1;pointer-events:auto;transform:none;}
    .nav-burger{display:inline-flex;}
    .nav-cta{display:none;}
  }

  /* ---------- section shell ---------- */
  section{border-bottom:1px solid var(--border-soft);}
  .section-pad{padding-block:clamp(56px,9vw,110px);}
  .section-head{
    display:flex;flex-direction:column;gap:.9rem;
    max-width:640px;
    margin-bottom:clamp(32px,5vw,56px);
  }
  .section-title{font-size:clamp(1.7rem,3vw,2.3rem);font-weight:700;letter-spacing:-.02em;}
  .section-lead{color:var(--ink-dim);font-size:1.05rem;max-width:52ch;}

  .reveal{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease;}
  .reveal.in{opacity:1;transform:none;}
  @media (prefers-reduced-motion:reduce){
    .reveal{opacity:1;transform:none;transition:none;}
  }

  /* ---------- hero ---------- */
  .hero{border-bottom:1px solid var(--border-soft);position:relative;overflow:hidden;}
  .hero::before{
    content:"";position:absolute;inset:0;
    background:
      radial-gradient(60% 50% at 82% 15%, color-mix(in srgb, var(--primary) 10%, transparent), transparent 70%),
      radial-gradient(40% 40% at 10% 90%, color-mix(in srgb, var(--accent) 6%, transparent), transparent 70%);
    pointer-events:none;
  }
  .hero::after{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:
      radial-gradient(circle at 82% 15%, transparent 89px, color-mix(in srgb, var(--primary) 20%, transparent) 90px, color-mix(in srgb, var(--primary) 20%, transparent) 91px, transparent 92px),
      radial-gradient(circle at 82% 15%, transparent 169px, color-mix(in srgb, var(--primary) 15%, transparent) 170px, color-mix(in srgb, var(--primary) 15%, transparent) 171px, transparent 172px),
      radial-gradient(circle at 82% 15%, transparent 249px, color-mix(in srgb, var(--primary) 10%, transparent) 250px, color-mix(in srgb, var(--primary) 10%, transparent) 251px, transparent 252px),
      radial-gradient(circle at 82% 15%, transparent 329px, color-mix(in srgb, var(--primary) 6%, transparent) 330px, color-mix(in srgb, var(--primary) 6%, transparent) 331px, transparent 332px),
      radial-gradient(circle at 10% 92%, transparent 69px, color-mix(in srgb, var(--accent) 18%, transparent) 70px, color-mix(in srgb, var(--accent) 18%, transparent) 71px, transparent 72px),
      radial-gradient(circle at 10% 92%, transparent 149px, color-mix(in srgb, var(--accent) 12%, transparent) 150px, color-mix(in srgb, var(--accent) 12%, transparent) 151px, transparent 152px),
      radial-gradient(circle at 10% 92%, transparent 229px, color-mix(in srgb, var(--accent) 7%, transparent) 230px, color-mix(in srgb, var(--accent) 7%, transparent) 231px, transparent 232px);
  }
  .hero-grid{
    position:relative;
    display:grid;grid-template-columns:1.02fr 1fr;gap:clamp(24px,4vw,64px);
    align-items:center;
    padding-block:clamp(48px,7vw,84px);
  }
  .hero-copy .eyebrow{margin-bottom:1.4rem;}
  .hero-h1{
    font-size:clamp(2.4rem,5.6vw,4.1rem);
    line-height:.98;
    font-weight:700;
    letter-spacing:-.03em;
  }
  .hero-h1 span{display:block;}
  .hero-h1 .accent{color:var(--primary);}
  .hero-sub{
    margin-top:1.4rem;
    font-size:1.08rem;
    color:var(--ink-dim);
    max-width:46ch;
  }
  .hero-cta{display:flex;align-items:center;gap:1.4rem;margin-top:2.2rem;flex-wrap:wrap;}

  /* instrument viewport */
  .viewport{
    position:relative;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:
      linear-gradient(var(--card-2),var(--card-2)) padding-box,
      repeating-linear-gradient(0deg, transparent 0 39px, var(--border-soft) 39px 40px),
      repeating-linear-gradient(90deg, transparent 0 39px, var(--border-soft) 39px 40px);
    aspect-ratio:1/1;
    display:flex;align-items:center;justify-content:center;
    overflow:hidden;
  }
  .viewport-tag{
    position:absolute;
    font-family:'JetBrains Mono',monospace;
    font-size:.66rem;
    letter-spacing:.1em;
    color:var(--ink-faint);
    text-transform:uppercase;
  }
  .viewport-tag.tl{top:16px;left:18px;display:flex;align-items:center;gap:.5em;}
  .viewport-tag.tl .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent);}
  .viewport-tag.tr{top:16px;right:18px;}
  .viewport-tag.bl{bottom:14px;left:18px;}
  .viewport-tag.br{bottom:14px;right:18px;}
  .viewport img{
    width:62%;
    filter:drop-shadow(0 30px 50px rgba(0,0,0,.55));
    animation:float 7s ease-in-out infinite;
  }
  @keyframes float{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-10px);}
  }
  @media (prefers-reduced-motion:reduce){ .viewport img{animation:none;} }

  .telemetry{
    position:absolute;left:18px;bottom:42px;
    display:flex;flex-direction:column;gap:5px;
    font-family:'JetBrains Mono',monospace;
    font-size:.64rem;
    letter-spacing:.04em;
    color:var(--ink-faint);
  }
  .telemetry b{color:var(--ink-dim);font-weight:500;}

  @media (max-width:960px){
    .hero-grid{grid-template-columns:1fr;}
    .viewport{max-width:420px;margin-inline:auto;aspect-ratio:4/5;}
  }

  /* ---------- ticker ---------- */
  .ticker-shell{
    border-top:1px solid var(--border-soft);
    border-bottom:1px solid var(--border-soft);
    overflow:hidden;
    background:var(--bg-raised);
  }
  .ticker-track{
    display:flex;
    width:max-content;
    animation:ticker 32s linear infinite;
  }
  @media (prefers-reduced-motion:reduce){ .ticker-track{animation-duration:90s;} }
  @keyframes ticker{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
  .ticker-item{
    display:flex;align-items:center;gap:.6em;
    padding:1rem 1.6rem;
    font-family:'JetBrains Mono',monospace;
    font-size:.76rem;
    letter-spacing:.06em;
    text-transform:uppercase;
    color:var(--ink-dim);
    white-space:nowrap;
    border-right:1px solid var(--border-soft);
  }
  .ticker-item::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--primary);flex:none;}

  /* ---------- why cards ---------- */
  .cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border-soft);border:1px solid var(--border-soft);border-radius:var(--radius);overflow:hidden;}
  .card{background:var(--card);padding:clamp(24px,3vw,34px);display:flex;flex-direction:column;gap:1.1rem;}
  .icon-badge{
    width:42px;height:42px;border-radius:var(--radius-sm);
    display:flex;align-items:center;justify-content:center;
    background:var(--card-2);border:1px solid var(--border);
    color:var(--primary);
  }
  .icon-badge svg{width:20px;height:20px;}
  .card h3{font-size:1.1rem;font-weight:600;letter-spacing:-.01em;}
  .card p{color:var(--ink-dim);font-size:.95rem;}
  @media (max-width:820px){ .cards-3{grid-template-columns:1fr;} }

  /* ---------- controller split ---------- */
  .controller-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center;}
  .feature-list{margin-top:1.6rem;display:flex;flex-direction:column;gap:.85rem;}
  .feature-list li{display:flex;align-items:center;gap:.8em;font-size:1rem;color:var(--ink);}
  .feature-list svg{width:16px;height:16px;color:var(--accent);flex:none;}
  .controller-photo{
    border:1px solid var(--border);border-radius:var(--radius);
    background:radial-gradient(60% 60% at 50% 40%, color-mix(in srgb, var(--primary) 8%, transparent), var(--card-2) 70%);
    display:flex;align-items:center;justify-content:center;
    padding:clamp(20px,4vw,40px);
    aspect-ratio:4/5;
  }
  .controller-photo img{width:56%;filter:drop-shadow(0 24px 40px rgba(0,0,0,.5));}
  @media (max-width:900px){ .controller-grid{grid-template-columns:1fr;} .controller-photo{order:-1;max-width:340px;margin-inline:auto;} }

  /* ---------- kit intro photo ---------- */
  .kit-intro{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,64px);align-items:center;margin-bottom:clamp(32px,5vw,56px);}
  .kit-photo{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;aspect-ratio:3/2;}
  .kit-photo img{width:100%;height:100%;object-fit:cover;display:block;}
  @media (max-width:900px){ .kit-intro{grid-template-columns:1fr;} .kit-photo{order:-1;} }

  /* ---------- kit components ---------- */
  .kit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border-soft);border:1px solid var(--border-soft);border-radius:var(--radius);overflow:hidden;}
  .kit-item{background:var(--card);padding:clamp(22px,2.6vw,30px);display:flex;flex-direction:column;gap:.9rem;}
  .kit-item .num{font-family:'JetBrains Mono',monospace;font-size:.78rem;color:var(--ink-faint);letter-spacing:.06em;}
  .kit-item h3{font-size:1.02rem;font-weight:600;}
  .kit-item p{color:var(--ink-dim);font-size:.9rem;}
  @media (max-width:980px){ .kit-grid{grid-template-columns:1fr 1fr;} }
  @media (max-width:560px){ .kit-grid{grid-template-columns:1fr;} }

  /* ---------- how it works ---------- */
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,40px);position:relative;}
  .steps::before{
    content:"";position:absolute;top:20px;left:8%;right:8%;height:1px;
    background:repeating-linear-gradient(90deg, var(--border) 0 8px, transparent 8px 16px);
    z-index:0;
  }
  .step{position:relative;z-index:1;display:flex;flex-direction:column;gap:1rem;}
  .step .num{
    width:40px;height:40px;border-radius:50%;
    background:var(--bg);border:1px solid var(--border);
    display:flex;align-items:center;justify-content:center;
    font-family:'JetBrains Mono',monospace;font-size:.85rem;color:var(--primary);
  }
  .step h3{font-size:1.08rem;font-weight:600;}
  .step p{color:var(--ink-dim);font-size:.94rem;}
  @media (max-width:780px){ .steps{grid-template-columns:1fr;} .steps::before{display:none;} }

  /* ---------- applications ---------- */
  .apps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem;}
  .app-card{
    border:1px solid var(--border);border-radius:var(--radius);
    display:flex;flex-direction:column;
    background:linear-gradient(180deg, var(--card-2), var(--card));
    overflow:hidden;
  }
  .app-photo{aspect-ratio:3/2;}
  .app-photo img{width:100%;height:100%;object-fit:cover;display:block;}
  .app-body{padding:clamp(20px,2.4vw,26px);display:flex;flex-direction:column;gap:.6rem;}
  .app-card h3{font-size:1.05rem;font-weight:600;}
  .app-card p{color:var(--ink-dim);font-size:.92rem;}
  @media (max-width:820px){ .apps-grid{grid-template-columns:1fr;} }

  /* ---------- benefits ---------- */
  .benefits-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border-soft);border:1px solid var(--border-soft);border-radius:var(--radius);overflow:hidden;}
  .benefit{background:var(--card);padding:clamp(22px,2.6vw,28px);display:flex;flex-direction:column;gap:.7rem;}
  .benefit h3{font-size:1rem;font-weight:600;display:flex;align-items:center;gap:.55em;}
  .benefit h3 svg{width:16px;height:16px;color:var(--accent);flex:none;}
  .benefit p{color:var(--ink-dim);font-size:.9rem;}
  @media (max-width:820px){ .benefits-grid{grid-template-columns:1fr;} }

  /* ---------- roadmap ---------- */
  .roadmap{background:var(--bg-raised);}
  .roadmap-grid{display:grid;grid-template-columns:1fr;margin-top:1.8rem;}
  .roadmap-item{
    border:1px dashed var(--border);border-radius:var(--radius);
    padding:1.4rem 1.6rem;
    display:flex;align-items:center;justify-content:space-between;gap:1rem;
    max-width:520px;
  }
  .roadmap-item h3{font-size:.98rem;font-weight:600;}
  .roadmap-item p{color:var(--ink-faint);font-size:.82rem;margin-top:.2rem;}
  .pill{
    font-family:'JetBrains Mono',monospace;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;
    padding:.4em .8em;border-radius:999px;border:1px solid var(--border);color:var(--ink-dim);white-space:nowrap;
  }

  /* ---------- contact ---------- */
  .contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,64px);align-items:start;}
  .contact-h{font-size:clamp(1.8rem,3.4vw,2.5rem);font-weight:700;letter-spacing:-.02em;}
  .contact-p{color:var(--ink-dim);margin-top:1rem;max-width:46ch;}
  .contact-cta{margin-top:2rem;}
  .contact-card{border:1px solid var(--border);border-radius:var(--radius);padding:clamp(22px,3vw,30px);background:var(--card-2);display:flex;flex-direction:column;gap:1.3rem;}
  .contact-row{display:flex;flex-direction:column;gap:.3rem;}
  .contact-row .label{font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);}
  .contact-row .value{font-size:1.05rem;font-weight:500;}
  @media (max-width:860px){ .contact-grid{grid-template-columns:1fr;} }

  /* ---------- footer ---------- */
  .footer{border-bottom:0;}
  .footer-row{display:flex;align-items:center;justify-content:space-between;padding-block:1.8rem;flex-wrap:wrap;gap:1rem;}
  .footer-brand{display:flex;align-items:center;gap:.65em;color:var(--ink-dim);font-size:.9rem;}
  .footer-brand .brand-mark{--mark-size:22px;border-radius:6px;}
  .footer-links{display:flex;gap:1.6rem;}
  .footer-links a{color:var(--ink-faint);font-size:.86rem;}
  .footer-links a:hover{color:var(--ink-dim);}
