:root{
  --cream: #f9f8f5;
  --ink: #141311;
  --grey: #8b887f;
  --grey-line: #ddd9cf;
  --grey-line-soft: #e7e3d9;
  --serif-tight: -0.03em;
  --mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--cream);
  color:var(--ink);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}

.row{
  max-width:1512px;
  margin:0 auto;
  padding:0 56px;
}

/* ---------------- header ---------------- */
.site-head{
  position:sticky;
  top:0;
  z-index:20;
  padding-top:24px;
  padding-bottom:0;
  background:var(--cream);
  transition:padding .35s cubic-bezier(.4,0,.2,1), box-shadow .35s ease;
}
.site-head.is-scrolled{
  padding-top:14px;
  padding-bottom:14px;
  box-shadow:0 1px 0 var(--grey-line-soft);
}
.site-head .row{
  display:flex;
  align-items:center;
  gap:40px;
}
.brand{
  display:flex;
  align-items:center;
  margin-right:auto;
}
.brand-mark{
  width:32px;
  height:auto;
  flex:none;
}
.brand-name{
  display:block;
  max-width:200px;
  margin-left:13px;
  overflow:hidden;
  font-family:var(--mono);
  font-size:15px;
  font-weight:500;
  letter-spacing:0.16em;
  text-transform:uppercase;
  white-space:nowrap;
  opacity:1;
  transition:max-width .45s cubic-bezier(.4,0,.2,1), margin-left .45s cubic-bezier(.4,0,.2,1), opacity .3s ease;
}
.site-head.is-scrolled .brand-name{
  max-width:0;
  margin-left:0;
  opacity:0;
}
.nav{
  display:flex;
  align-items:center;
  gap:36px;
}
.nav a{
  font-size:15px;
  color:#3a3936;
  transition:color .15s ease;
}
.nav a:hover{color:var(--ink);}

.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:13px 22px;
  border-radius:999px;
  font-size:14.5px;
  font-weight:500;
  white-space:nowrap;
  transition:transform .18s ease, background .18s ease, border-color .18s ease, opacity .18s ease;
}
.btn svg{width:14px;height:14px;flex:none;}
.btn-solid{
  background:var(--ink);
  color:var(--cream);
  border:1px solid var(--ink);
}
.btn-solid:hover{transform:translateY(-1px);opacity:.92;}
.btn-line{
  background:transparent;
  color:var(--ink);
  border:1.5px solid var(--ink);
}
.btn-line:hover{transform:translateY(-1px);}
.btn-nav{padding:12px 22px;font-size:14px;}

/* ---------------- hero ---------------- */
.hero{
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:calc(100vh - 66px);
  padding-top:32px;
  padding-bottom:0;
}
.hero-dots{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  pointer-events:none;
}

.hero-copy{
  position:relative;
  z-index:10;
  max-width:620px;
}
.hero-main-row{
  flex:1 1 auto;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-copy-center{
  max-width:900px;
  margin:0 auto;
  text-align:center;
}
.hero-copy-center .eyebrow-line{ justify-content:center; }
.hero-copy-center .lede{ margin-left:auto; margin-right:auto; }
.hero-copy-center .btn-row{ justify-content:center; }
.eyebrow{
  font-family:var(--mono);
  font-size:12.5px;
  font-weight:500;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--grey);
  margin:0 0 18px;
}
.eyebrow-line{
  display:flex;
  align-items:center;
  gap:14px;
}
.eyebrow-line::before{
  content:'';
  flex:none;
  width:26px;
  height:1px;
  background:var(--grey-line);
}
.headline{
  margin:0;
  font-weight:700;
  font-size:clamp(44px, 6.4vw, 100px);
  line-height:1.03;
  letter-spacing:var(--serif-tight);
}
.headline span{display:block;}

.lede{
  max-width:560px;
  font-size:18px;
  line-height:1.6;
  color:#514f49;
  margin:26px 0 34px;
}

.btn-row{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}

/* ---------------- artwork (particle field) ---------------- */
.hero-art-dark{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
}
#art-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
}
.hero-art-dark #art-canvas{
  -webkit-mask-image:radial-gradient(ellipse 60% 78% at 50% 50%, #000 30%, rgba(0,0,0,.45) 58%, transparent 88%);
  mask-image:radial-gradient(ellipse 60% 78% at 50% 50%, #000 30%, rgba(0,0,0,.45) 58%, transparent 88%);
}

/* ---------------- research/build/ship/scale row ---------------- */
.process-row{
  position:relative;
  z-index:10;
  margin-top:32px;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  border:1px solid var(--grey-line-soft);
  border-radius:20px;
}
.process-item{
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding:22px 22px;
  border-left:1px solid var(--grey-line-soft);
}
.process-item:first-child{ border-left:none; }
.process-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  border-radius:50%;
  background:var(--ink);
  color:var(--cream);
  flex:none;
  margin-top:2px;
}
.process-icon svg{ width:18px; height:18px; }
.process-text{ min-width:0; }
.process-label{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0 0 8px;
  font-size:14px;
  font-weight:700;
  letter-spacing:0.01em;
}
.process-label .num{
  font-family:var(--mono);
  font-size:11.5px;
  font-weight:500;
  color:var(--grey);
}
.process-desc{
  margin:0;
  font-size:13.5px;
  line-height:1.55;
  color:#514f49;
}

/* ---------------- investor callout card ---------------- */
.invest-card{
  position:relative;
  z-index:10;
  margin-top:14px;
  display:flex;
  align-items:center;
  gap:28px;
  padding:22px 30px;
  border-radius:20px;
  background:#efece3;
  flex-wrap:wrap;
}
.invest-head{
  display:flex;
  align-items:center;
  gap:18px;
  flex:1 1 260px;
}
.invest-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:50%;
  background:#e2ddd0;
  color:var(--ink);
  flex:none;
}
.invest-icon svg{ width:17px; height:17px; }
.invest-title{
  margin:0;
  font-size:19px;
  font-weight:700;
  line-height:1.28;
  max-width:15ch;
  letter-spacing:var(--serif-tight);
}
.invest-copy{
  flex:2 1 340px;
  margin:0;
  font-size:14px;
  line-height:1.6;
  color:#514f49;
}
.invest-card .btn{ flex:none; }

/* ---------------- hero entrance ---------------- */
@keyframes reveal-up{
  from{opacity:0; transform:translateY(16px);}
  to{opacity:1; transform:translateY(0);}
}
.eyebrow,
.headline span,
.lede,
.btn-row{
  animation:reveal-up .85s cubic-bezier(.19,.68,.28,1) both;
}
.eyebrow{animation-delay:.05s;}
.headline span:nth-child(1){animation-delay:.16s;}
.headline span:nth-child(2){animation-delay:.26s;}
.headline span:nth-child(3){animation-delay:.36s;}
.lede{animation-delay:.48s;}
.btn-row{animation-delay:.58s;}

@media (prefers-reduced-motion: reduce){
  .eyebrow, .headline span, .lede, .btn-row{
    animation:none;
    opacity:1;
    transform:none;
  }
}

.hero-foot{
  position:relative;
  z-index:10;
  border-top:1px solid var(--grey-line-soft);
  padding:18px 0;
  margin-top:clamp(32px, 6vh, 72px);
}
.hero-foot-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.hero-foot .eyebrow{margin:0;}
.hero-foot-tag{
  margin:0;
  font-family:var(--mono);
  font-size:12.5px;
  color:var(--grey);
  letter-spacing:0.02em;
}
.scroll-cue{
  display:flex;
  align-items:center;
  gap:8px;
  font-family:var(--mono);
  font-size:12.5px;
  font-weight:500;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--grey);
}
.scroll-cue svg{width:13px;height:13px;}

@media (max-width: 980px){
  .row{padding:0 24px;}
  .nav{display:none;}
  .site-head .row{gap:16px;}
  .brand-name{font-size:13px;}
  .btn-nav{padding:11px 18px;font-size:13px;}
  .headline{font-size:clamp(34px, 9vw, 52px);}
  .hero{padding-top:40px;padding-bottom:20px;}
  .hero-foot{margin-top:44px;}
  .process-row{grid-template-columns:1fr 1fr;}
  .process-item{border-left:none;border-top:1px solid var(--grey-line-soft);}
  .process-item:nth-child(1),.process-item:nth-child(2){border-top:none;}
  .process-item:nth-child(even){border-left:1px solid var(--grey-line-soft);}
  .invest-card{flex-direction:column;align-items:flex-start;}
  .hero-foot-tag{display:none;}
}
@media (max-width: 560px){
  .process-row{grid-template-columns:1fr;}
  .process-item{border-left:none !important;border-top:1px solid var(--grey-line-soft);}
  .process-item:first-child{border-top:none;}
  .contact-grid{grid-template-columns:1fr;}
  .contact-card{border-left:none;border-top:1px solid var(--grey-line-soft);}
  .contact-card:nth-child(1){border-top:none;}
  .contact-card:nth-child(2){border-top:1px solid var(--grey-line-soft);}
}

/* ---------------- scroll reveal ---------------- */
.reveal-io{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .7s cubic-bezier(.19,.68,.28,1), transform .7s cubic-bezier(.19,.68,.28,1);
}
.reveal-io.is-visible{
  opacity:1;
  transform:translateY(0);
}
@media (prefers-reduced-motion: reduce){
  .reveal-io{opacity:1; transform:none; transition:none;}
}

/* box that grows outward to touch both edges when it scrolls into view */
.reveal-expand{
  opacity:0;
  clip-path:inset(0 32% 0 32% round 18px);
  transition:opacity .8s cubic-bezier(.19,.68,.28,1), clip-path .8s cubic-bezier(.19,.68,.28,1);
}
.reveal-expand.is-visible{
  opacity:1;
  clip-path:inset(0 0 0 0 round 18px);
}
@media (prefers-reduced-motion: reduce){
  .reveal-expand{opacity:1; clip-path:none; transition:none;}
}

/* ---------------- generic sections ---------------- */
.section{
  position:relative;
  padding:108px 0;
  border-top:1px solid var(--grey-line-soft);
}
.section-title{
  margin:14px 0 0;
  font-weight:700;
  font-size:clamp(30px, 3.6vw, 48px);
  line-height:1.08;
  letter-spacing:var(--serif-tight);
  max-width:20ch;
}
.section-sub{
  margin:14px 0 0;
  font-size:17px;
  color:#514f49;
}
.section-copy{
  margin:22px 0 0;
  max-width:620px;
  font-size:16.5px;
  line-height:1.68;
  color:#514f49;
}

/* who we are: intro + quick-facts */
.who-grid{
  display:grid;
  grid-template-columns:1.3fr 1fr;
  gap:64px;
  align-items:start;
}
.who-copy{ max-width:560px; }
.who-facts{
  margin:0;
  padding-top:6px;
  display:flex;
  flex-direction:column;
  gap:24px;
}
.who-fact{
  border-top:1px solid var(--grey-line-soft);
  padding-top:18px;
}
.who-fact dt{
  font-size:32px;
  font-weight:700;
  letter-spacing:var(--serif-tight);
  margin:0 0 8px;
}
.who-fact dd{
  margin:0;
  max-width:34ch;
  font-size:14.5px;
  line-height:1.55;
  color:#514f49;
}
.who-fact dd strong{
  display:block;
  margin-bottom:4px;
  font-size:15.5px;
  font-weight:700;
  color:var(--ink);
}

/* research -> build -> ship flow */
.flow{
  display:flex;
  align-items:center;
  gap:16px;
  margin-top:48px;
  flex-wrap:wrap;
}
.flow-step{
  font-family:var(--mono);
  font-size:12.5px;
  font-weight:500;
  letter-spacing:0.14em;
  text-transform:uppercase;
  padding:15px 26px;
  border:1px solid var(--grey-line);
  border-radius:999px;
}
.flow-arrow{
  width:15px;
  height:15px;
  color:#b6b1a3;
  flex:none;
}

/* work / lab cards */
.work-card{
  position:relative;
  border:1.5px solid var(--grey-line);
  border-radius:22px;
  padding:36px;
  margin-top:40px;
}
.work-card-inner{
  display:flex;
  align-items:stretch;
  gap:44px;
}
.work-card-copy{
  flex:1 1 300px;
  min-width:0;
}
.work-card-features{
  flex:1.3 1 420px;
  display:flex;
  gap:32px;
  padding-left:40px;
  border-left:1px solid var(--grey-line-soft);
}
.feature-item{
  flex:1;
  min-width:0;
}
.feature-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:10px;
  background:#eef7c9;
  color:var(--ink);
  margin-bottom:14px;
}
.feature-icon svg{ width:16px; height:16px; }
.feature-item h4{
  margin:0 0 6px;
  font-size:15px;
  font-weight:700;
  line-height:1.25;
  letter-spacing:var(--serif-tight);
}
.feature-item p{
  margin:0;
  font-size:13.5px;
  line-height:1.5;
  color:#514f49;
}

.work-card-preview{
  margin-top:20px;
  border-radius:22px;
  overflow:hidden;
  min-height:220px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:36px;
  background:#0c0c0c;
}
.work-card-preview img{
  display:block;
  max-width:min(420px, 78%);
  width:100%;
  height:auto;
}
.tag-row{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:18px;
}
.status-pill{
  font-family:var(--mono);
  font-size:11px;
  font-weight:500;
  letter-spacing:0.10em;
  text-transform:uppercase;
  padding:6px 13px;
  border-radius:999px;
  line-height:1;
}
.status-pill.live{ background:var(--ink); color:var(--cream); }
.status-pill.dev{ border:1px solid var(--grey-line); color:#6b6860; }
.status-pill.research{ border:1px dashed var(--grey-line); color:#8b887f; }
.category-tag{
  font-family:var(--mono);
  font-size:12px;
  color:var(--grey);
}
.work-card h3{
  margin:0 0 12px;
  font-size:24px;
  font-weight:700;
  letter-spacing:var(--serif-tight);
}
.work-card p{
  margin:0;
  max-width:540px;
  font-size:15.5px;
  line-height:1.62;
  color:#514f49;
}
.card-link{
  margin-top:24px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:14.5px;
  font-weight:600;
}
.card-link svg{width:14px;height:14px;}

/* the lab layout */
.lab-row{
  display:block;
}
.lab-copy{
  max-width:680px;
}

/* find -> build -> launch step diagram */
.lab-steps{
  max-width:1080px;
  margin:64px auto 0;
}
.lab-steps-track{
  position:relative;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  height:48px;
}
.step-track-line{
  position:absolute;
  left:16.6667%;
  right:16.6667%;
  top:50%;
  height:1.5px;
  background:var(--grey-line);
  transform:translateY(-50%);
  z-index:0;
}
.step-arrow{
  position:absolute;
  top:50%;
  width:16px;
  height:16px;
  transform:translate(-50%, -50%);
  color:#c9c5b8;
  z-index:1;
}
.step-arrow svg{ display:block; width:100%; height:100%; }
.arrow-1{ left:50%; }
.arrow-2{ left:83.3333%; }
.step-badge{
  position:relative;
  z-index:2;
  justify-self:center;
  display:flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  border-radius:50%;
  background:#efece3;
  font-size:16px;
  font-weight:700;
  letter-spacing:var(--serif-tight);
}
.lab-steps-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  margin-top:26px;
}
.step-col{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  padding:0 12px;
}
.step-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:88px;
  height:88px;
  border-radius:50%;
  border:1.5px dashed var(--grey-line);
  margin-bottom:20px;
}
.step-icon svg{ width:26px; height:26px; }
.step-label{
  margin:0 0 8px;
  font-size:19px;
  font-weight:700;
  letter-spacing:var(--serif-tight);
}
.step-desc{
  margin:0;
  max-width:22ch;
  font-size:14.5px;
  line-height:1.55;
  color:#514f49;
}

/* philosophy band */
.philosophy{
  position:relative;
  overflow:hidden;
  background:var(--ink);
  color:var(--cream);
  text-align:center;
  padding:150px 24px;
}
.philosophy-line{
  position:relative;
  z-index:2;
  margin:0 auto;
  max-width:840px;
  font-size:clamp(26px, 3.6vw, 42px);
  font-weight:600;
  line-height:1.3;
  letter-spacing:var(--serif-tight);
  text-shadow:0 0 26px rgba(20,19,17,.9), 0 0 10px rgba(20,19,17,.9);
}
.philosophy .dim{
  color:#8b887c;
  font-weight:500;
}

/* investors */
.direct-contact{
  display:inline-block;
  margin-top:20px;
  font-family:var(--mono);
  font-size:14px;
  font-weight:500;
  color:#57544c;
  border-bottom:1px solid #b7b1a2;
}
.direct-contact:hover{ color:var(--ink); border-color:var(--ink); }

/* get in touch — contact paths */
.contact-grid{
  margin-top:44px;
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  border:1px solid var(--grey-line-soft);
  border-radius:20px;
  overflow:hidden;
}
.contact-card{
  display:flex;
  flex-direction:column;
  gap:11px;
  padding:30px 30px 32px;
  border-top:1px solid var(--grey-line-soft);
  border-left:1px solid var(--grey-line-soft);
  color:var(--ink);
  transition:background .25s ease;
}
.contact-card:nth-child(1),
.contact-card:nth-child(2){ border-top:none; }
.contact-card:nth-child(odd){ border-left:none; }
.contact-card:hover{ background:#f2f0ea; }
.contact-card-head{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:17px;
  font-weight:700;
  letter-spacing:var(--serif-tight);
}
.contact-card-head svg{
  width:14px;
  height:14px;
  flex:none;
  transition:transform .25s ease;
}
.contact-card:hover .contact-card-head svg{ transform:translateX(3px); }
.contact-card-desc{
  font-size:14px;
  line-height:1.55;
  color:#514f49;
  max-width:34ch;
}
.contact-card-mail{
  margin-top:3px;
  font-family:var(--mono);
  font-size:13px;
  color:#57544c;
}
.contact-card:hover .contact-card-mail{ color:var(--ink); }

/* legal pages */
.legal-body{
  margin-top:38px;
  max-width:680px;
}
.legal-updated{
  margin:0 0 30px;
  font-family:var(--mono);
  font-size:13px;
  color:var(--grey);
}
.legal-body h2{
  margin:34px 0 12px;
  font-size:20px;
  font-weight:700;
  letter-spacing:var(--serif-tight);
  color:var(--ink);
}
.legal-body p{
  margin:0 0 16px;
  font-size:15.5px;
  line-height:1.7;
  color:#514f49;
}
.legal-body ul,
.legal-body ol{
  margin:0 0 16px;
  padding-left:22px;
}
.legal-body li{
  margin-bottom:8px;
  font-size:15.5px;
  line-height:1.7;
  color:#514f49;
}
.legal-body li::marker{ color:var(--grey); }
.legal-body a{
  color:var(--ink);
  border-bottom:1px solid #b7b1a2;
}
.legal-body a:hover{ border-color:var(--ink); }

/* footer */
.site-footer{
  padding:76px 0 32px;
  border-top:1px solid var(--grey-line-soft);
}
.footer-top{
  display:grid;
  grid-template-columns:1.7fr repeat(5, 1fr);
  gap:32px;
}
.footer-brand p{
  margin:18px 0 0;
  max-width:26ch;
  font-size:14.5px;
  line-height:1.55;
  color:var(--grey);
}
.footer-col h4{
  margin:0 0 18px;
  font-family:var(--mono);
  font-size:11.5px;
  font-weight:500;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--grey);
}
.footer-col a{
  display:block;
  margin-bottom:13px;
  font-size:14.5px;
  color:#3a3936;
  transition:color .15s ease;
}
.footer-col a:hover{ color:var(--ink); }
.footer-bottom{
  margin-top:64px;
  padding-top:24px;
  border-top:1px solid var(--grey-line-soft);
  font-family:var(--mono);
  font-size:12.5px;
  color:var(--grey);
}

@media (max-width: 980px){
  .section{padding:76px 0;}
  .who-grid{grid-template-columns:1fr; gap:40px;}
  .who-facts{flex-direction:row; flex-wrap:wrap; gap:24px 32px;}
  .who-fact{flex:1 1 200px;}
  .work-card{padding:28px 24px;}
  .work-card-inner{flex-direction:column; gap:28px;}
  .work-card-features{padding-left:0; padding-top:24px; border-left:none; border-top:1px solid var(--grey-line-soft); flex-direction:column; gap:20px;}
  .work-card-preview{min-height:160px; padding:24px;}
  .lab-steps-track{display:none;}
  .lab-steps-grid{grid-template-columns:1fr; gap:36px;}
  .step-icon{width:72px; height:72px;}
  .step-icon svg{width:22px; height:22px;}
  .philosophy{padding:96px 24px;}
  .footer-top{grid-template-columns:1fr 1fr; row-gap:36px;}
  .footer-brand{grid-column:1 / -1;}
}
