/* Space Lab - spacelab.tech */

@font-face{
  font-family:"Archivo";
  src:url("../assets/fonts/archivo-latin.woff2") format("woff2");
  font-weight:100 900;
  font-stretch:62% 125%;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Inter";
  src:url("../assets/fonts/inter-latin.woff2") format("woff2");
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"JetBrains Mono";
  src:url("../assets/fonts/jbmono-latin.woff2") format("woff2");
  font-weight:100 800;
  font-style:normal;
  font-display:swap;
}

:root{
  color-scheme:dark;
  --bg:#0a0a0c;
  --panel:#101014;
  --line:#1e1e24;
  --ink:#ffffff;
  --ink-2:#bfbfc4;      /* 10.8:1 on bg */
  --muted:#8a8a90;      /* 5.76:1 on bg */
  --dim:#7d7d85;        /* 4.85:1 on bg */
  --bar:#6a6a72;        /* 3.69:1 on bg, non-text */
  --red:#ff0000;
  --gutter:clamp(20px,4vw,48px);
  --nav-h:96px;
  --display:"Archivo",ui-sans-serif,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --body:"Inter",ui-sans-serif,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

*,*::before,*::after{ box-sizing:border-box; }

[hidden]{ display:none !important; }

html{
  background:var(--bg);
  scroll-behavior:smooth;
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
}

body{
  margin:0;
  overflow-x:clip;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

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

a{ color:inherit; }

:focus-visible{ outline:2px solid var(--red); outline-offset:4px; }

::selection{ background:var(--red); color:var(--bg); }

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:100;
  background:var(--ink); color:var(--bg);
  font-family:var(--mono); font-size:.75rem; letter-spacing:.08em;
  padding:10px 16px; text-decoration:none;
}
.skip-link:focus{ left:0; }

/* ---------- primitives ---------- */

.wrap{ max-width:1200px; margin-inline:auto; padding-inline:var(--gutter); }
/* the nav alone stays full width, wordmark at the page edge */
.nav .wrap{ max-width:none; padding-inline:clamp(24px,2.5vw,56px); }

section{ scroll-margin-top:calc(var(--nav-h) + 8px); }

.section{ padding-block:clamp(88px,13vh,150px); }

.kicker{
  margin:0 0 22px;
  font-family:var(--mono); font-weight:400;
  font-size:.75rem; letter-spacing:.28em; text-transform:uppercase;
  color:var(--muted);
}

h2{
  margin:0 0 24px;
  font-family:var(--display); font-weight:700;
  font-size:clamp(1.75rem,3.6vw,2.875rem);
  line-height:1.12; letter-spacing:-.01em;
  text-wrap:balance;
}

.lead{
  margin:0;
  font-size:clamp(1.0625rem,1.5vw,1.25rem);
  color:var(--ink-2);
  max-width:960px;
}

/* ---------- nav ---------- */

.nav{
  position:fixed; inset:0 0 auto 0; z-index:50;
  height:var(--nav-h);
  display:flex; align-items:center;
  border-bottom:1px solid transparent;
  transition:background .3s ease,border-color .3s ease;
}
.nav.scrolled{
  background:rgba(10,10,12,.82);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
  border-bottom-color:var(--line);
}
.nav .wrap{
  width:100%;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.nav .wrap > nav{ display:contents; }   /* landmark only; layout stays on .wrap */

.nav-logo{ display:block; line-height:0; }
.nav-logo svg{ height:clamp(36px,3.6vw,52px); width:auto; display:block; }

.nav-links{
  display:flex; align-items:center; gap:clamp(14px,1.8vw,26px);
  list-style:none; margin:0; padding:0;
}
.nav-links a{
  font-family:var(--mono); font-size:.8125rem; letter-spacing:.14em;
  text-transform:uppercase; text-decoration:none; color:var(--muted);
  transition:color .2s ease;
}
.nav-links a:hover,
.nav-links a:focus-visible{ color:var(--ink); }
.nav-links a.active{ color:var(--red); }
.nav-links a.nav-contact.active{ color:var(--ink); border-color:var(--red); }
.nav-links .nav-contact{
  color:var(--ink);
  border:1px solid var(--bar);
  padding:9px 16px;
  transition:border-color .2s ease;
}
.nav-links .nav-contact:hover,
.nav-links .nav-contact:focus-visible{ border-color:var(--red); }

.nav-toggle{
  display:none;
  background:none; border:0; padding:10px; margin:-10px;
  cursor:pointer;
}
.nav-toggle span{
  display:block; width:22px; height:1.5px; background:var(--ink);
  margin:6px 0; transition:transform .25s ease,opacity .25s ease;
}
.nav-toggle[aria-expanded="true"] span:first-child{ transform:translateY(3.75px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:last-child{ transform:translateY(-3.75px) rotate(-45deg); }

@media (max-width:920px){
  :root{ --nav-h:72px; }
  .nav-toggle{ display:block; }
  .nav-links{
    position:fixed; inset:var(--nav-h) 0 0 0;
    flex-direction:column; gap:30px;
    overflow-y:auto;
    padding-block:32px;
    background:rgba(10,10,12,.97);
    transform:translateY(-8px); opacity:0; visibility:hidden;
    transition:opacity .25s ease,transform .25s ease,visibility .25s;
  }
  /* auto margins centre the items on tall viewports and collapse to zero
     when the list overflows, so short landscape phones can scroll to
     every item instead of having both ends clipped */
  .nav-links li:first-child{ margin-top:auto; }
  .nav-links li:last-child{ margin-bottom:auto; }
  .nav-links.open{ transform:none; opacity:1; visibility:visible; }
  .nav-links a{ font-size:.9375rem; letter-spacing:.22em; }
}

/* ---------- 1. landing ---------- */

.hero{
  position:relative;
  min-height:100vh; min-height:100svh;
  overflow:hidden;
  /* the displayed 16:9 cover video: its real drawn size and centred crop,
     so page elements can be pinned to regions of the footage */
  --vid-w:max(177.78svh,100vw);
  --vid-h:max(100svh,56.25vw);
  --crop-x:max(calc((177.78svh - 100vw)/2),0px);
  --crop-y:max(calc((56.25vw - 100svh)/2),0px);
}
/* pinned to the blurred panel in the footage (x 23.4-60.4pct, y 21.3-48.1pct) */
.hero-copy{
  position:absolute;
  left:calc(.238*var(--vid-w) - var(--crop-x));
  /* the panel spans y 21.3 to 48.1 percent of the footage; pin to its
     centre and let the transform centre the block on it */
  top:calc(.347*var(--vid-h) - var(--crop-y));
  transform:translateY(-50%);
  width:calc(.36*var(--vid-w));
}
.hero-media{ position:absolute; inset:0; overflow:hidden; }
.hero-video{
  width:100%; height:100%;
  object-fit:cover;
  filter:brightness(.55);   /* darker so the white copy reads over the daylight footage */
}
/* legibility scrims over the daylight footage: dark bands behind the nav
   and the scroll cue; the video keeps its own brightness */
.hero-media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,
    rgba(10,10,12,.78) 0%, rgba(10,10,12,0) 24%,
    rgba(10,10,12,0) 52%, rgba(10,10,12,.78) 100%);
}
/* backdrop stays behind the video; it takes over if the video cannot play
   or the visitor prefers reduced motion */
@media (prefers-reduced-motion:reduce){
  .hero-media{ display:none; }
}

.hero-stars{ position:absolute; inset:0; pointer-events:none; }
.hero-stars svg{ width:100%; height:100%; display:block; }
.hero-kicker{
  position:relative;
  margin:0 0 26px;
  font-family:var(--mono); font-size:.75rem; letter-spacing:.3em;
  color:#d4d4d9; text-transform:uppercase;
  text-shadow:0 1px 14px rgba(0,0,0,.65);
}
.statement{
  position:relative;
  margin:0;
  font-family:var(--display); font-weight:650;
  font-size:clamp(1.9rem,calc(.029*var(--vid-w)),4rem);
  line-height:1.08; letter-spacing:-.015em;
  white-space:nowrap;
  text-shadow:0 2px 28px rgba(0,0,0,.5);
}
@media (max-width:719px), (min-width:720px) and (max-aspect-ratio:1/1){
  .hero-copy{
    left:var(--gutter); right:var(--gutter); width:auto;
    top:calc(.347*var(--vid-h) - var(--crop-y));
    transform:translateY(-50%);
  }
  .statement{ font-size:clamp(1.375rem,7.4vw,2.25rem); }
}
.scroll-cue{
  position:absolute; left:50%; transform:translateX(-50%);
  bottom:32px;                      /* fallback for engines without svh */
  bottom:clamp(24px,5svh,48px);
  font-family:var(--mono); font-size:.625rem; letter-spacing:.42em;
  text-indent:.42em; color:#d4d4d9; text-decoration:none;
  text-shadow:0 1px 10px rgba(0,0,0,.65);
}
.scroll-cue{ transition:opacity .4s ease,visibility .4s; }
body.scrolled .scroll-cue{ opacity:0; visibility:hidden; }
.scroll-cue::after{
  content:""; display:block; width:1px; height:26px;
  margin:12px auto 0;
  background:linear-gradient(to bottom,transparent,var(--muted));
}

/* ---------- 2. why space ---------- */

/* ---------- 3. mission ---------- */

.bridge{
  margin:clamp(48px,7vh,80px) 0 0;
  font-family:var(--display); font-weight:300;
  font-size:clamp(1.375rem,2.8vw,2.125rem);
  line-height:1.3; color:var(--ink-2);
  max-width:22ch; text-wrap:balance;
}
.stats{
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,40px);
  margin-top:clamp(44px,7vh,72px);
}
@media (max-width:820px){ .stats{ grid-template-columns:1fr; } }
.stat{ border-top:1px solid var(--line); padding-top:22px; font-family:var(--mono); }
.stat b{
  display:block; font-weight:500;
  font-size:clamp(1.625rem,2.6vw,2.25rem); line-height:1.1;
  margin-bottom:10px; letter-spacing:.01em;
}
.stat span{ font-size:.75rem; line-height:1.7; letter-spacing:.02em; color:var(--muted); display:block; max-width:34ch; }
.mission-quote{
  margin:clamp(44px,7vh,72px) 0 0;
  font-size:.875rem; color:var(--muted); max-width:none;
}
@media (max-width:820px){
  .mission-quote .q-att{ display:block; margin-top:6px; }
}
.mission-banner{
  margin-top:clamp(72px,10vh,120px);
  background:var(--panel);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  text-align:center;
  padding:clamp(64px,10vh,110px) var(--gutter);
}
.mission-banner .kicker{ color:var(--red); }
.mission-banner h2{
  margin:0 auto;
  max-width:20ch;
  font-weight:800;
  font-size:clamp(1.625rem,4.2vw,3.25rem);
}
.mission-banner p{
  margin:22px 0 0;
  font-size:clamp(1rem,1.5vw,1.1875rem); color:var(--ink-2);
}

/* ---------- 4. draken ---------- */

.draken-wordmark{ line-height:0; margin:0; color:var(--ink); }
.draken-wordmark svg{ width:min(320px,52vw); height:auto; }
.draken-sub{
  margin:20px 0 0;
  font-size:clamp(1rem,1.5vw,1.1875rem); color:var(--ink-2);
}
.spec-row{
  display:grid; grid-template-columns:1fr 1fr;
  margin-top:clamp(40px,6vh,60px);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.spec-row li{
  list-style:none;
  font-family:var(--mono); font-size:.6875rem; letter-spacing:.14em;
  line-height:1.7; text-transform:uppercase; color:var(--ink-2);
  padding:18px 22px;
}
.spec-row{ padding:0; margin-left:0; margin-right:0; }
.spec-row li:nth-child(2n){ border-left:1px solid var(--line); }
.spec-row li:nth-child(n+3){ border-top:1px solid var(--line); }
@media (max-width:920px){
  .spec-row{ grid-template-columns:1fr; }
  .spec-row li:nth-child(2n){ border-left:0; }
  .spec-row li:nth-child(n+2){ border-top:1px solid var(--line); }
}
.anatomy{ margin-top:clamp(48px,7vh,80px); }
.anatomy-visual{ display:block; }
.anatomy-visual img{ width:100%; height:auto; display:block; }
.anatomy-grid{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(14px,2vw,24px);
  margin-top:clamp(36px,5vh,56px);
}
.info-block{ border-top:1px solid var(--line); padding-top:20px; }
.info-block h3{
  margin:0 0 10px; font-family:var(--mono); font-weight:500;
  font-size:.75rem; letter-spacing:.2em; text-transform:uppercase;
}
.info-block p{ margin:0; font-size:.9375rem; color:var(--muted); max-width:46ch; }
.ragnarok-wordmark{ line-height:0; color:var(--ink); }
.ragnarok-wordmark svg{ width:min(230px,56vw); height:auto; display:block; }
.info-block.engine{
  grid-column:1/-1;
  display:flex; flex-direction:column; align-items:center;
  text-align:center;
  gap:clamp(28px,4vh,44px);
  margin-top:clamp(56px,9vh,104px);
  padding-top:clamp(40px,6vh,64px);
}
.info-block.engine img{ width:min(150px,40vw); height:auto; }
.info-block.engine .ragnarok-wordmark svg{ margin-inline:auto; }
.info-block.engine p{ max-width:none; }
.engine-feature{ margin-top:clamp(16px,3vh,32px); }
@media (max-width:719px){
  /* single column: the exploded rocket stands centred, text below full width */
  .anatomy{ display:block; }
  .anatomy-visual{ display:flex; justify-content:center; }
  .anatomy-visual img{ width:auto; height:min(70vh,600px); }
  .anatomy-grid{ grid-template-columns:1fr; margin-top:clamp(28px,5vh,44px); }
}
/* scroll reveal: gated on JS being present and motion being welcome,
   so without either the blocks are simply visible */
@media (prefers-reduced-motion:no-preference){
  .js .reveal{ opacity:0; transform:translateY(16px);
    transition:opacity .7s ease,transform .7s cubic-bezier(.22,.61,.36,1); }
  .js .reveal.in{ opacity:1; transform:none; }
}


.profile{ margin-top:clamp(56px,8vh,88px); }
.profile-svg{ display:block; width:100%; height:auto; }
.profile-list{ list-style:none; margin:0; padding:0; }
.profile-list li{
  font-family:var(--mono); font-size:.75rem; letter-spacing:.12em;
  text-transform:uppercase; color:var(--ink-2);
  border-top:1px solid var(--line); padding:14px 2px;
}
/* visually hidden by default (screen reader twin of the arc); one breakpoint
   swaps it in and the arc out, so no fractional-width gap shows both */
.profile-list{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
@media (max-width:720px){
  .profile-svg{ display:none; }
  .profile-list{ position:static; width:auto; height:auto; overflow:visible; clip:auto; white-space:normal; }
}


/* ---------- 5. the pad ---------- */

.pad{ background:#070709; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.pad-blocks{ margin-top:clamp(44px,7vh,72px); }
.pad-block{
  border-top:1px solid var(--line);
  padding:26px 0;
  display:grid; grid-template-columns:minmax(150px,220px) 1fr; gap:18px;
}
@media (max-width:720px){ .pad-block{ grid-template-columns:1fr; gap:8px; } }
.pad-block h3{
  margin:0; font-family:var(--mono); font-weight:500;
  font-size:.75rem; letter-spacing:.22em; text-transform:uppercase;
}
.pad-block p{ margin:0; font-size:.9375rem; color:var(--muted); max-width:560px; }
.pad-closer{
  margin:clamp(44px,7vh,72px) 0 0;
  font-family:var(--display); font-weight:500;
  font-size:clamp(1.25rem,2.4vw,1.75rem); line-height:1.4;
  max-width:44ch; color:var(--ink);
}
/* ---------- 6. norway ---------- */

.chips{ display:flex; flex-wrap:wrap; gap:10px; margin-top:clamp(32px,5vh,48px); padding:0; list-style:none; }
.chips li{
  font-family:var(--mono); font-size:.6875rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--ink-2);
  border:1px solid var(--line); padding:10px 14px;
}
.timeline{
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(24px,3.5vw,44px);
  margin-top:clamp(56px,9vh,96px);
}
@media (max-width:820px){ .timeline{ grid-template-columns:1fr; } }
.tl{ border-top:1px solid var(--line); padding-top:22px; position:relative; }
.tl::before{
  content:""; position:absolute; top:-3px; left:0;
  width:5px; height:5px; background:var(--red);
}
.tl h3{
  margin:0 0 12px; font-family:var(--mono); font-weight:500;
  font-size:.75rem; letter-spacing:.18em;
  /* no text-transform: the source is already caps except the s in 1970s,
     which must stay lower case */
}
.tl p{ margin:0; font-size:.9375rem; color:var(--muted); }
.norway-closer{
  margin:clamp(56px,9vh,96px) 0 0;
  font-family:var(--display); font-weight:500;
  font-size:clamp(1.375rem,2.8vw,2rem); line-height:1.3;
  max-width:38ch;
}
.photo-fig{ margin:clamp(44px,7vh,72px) 0 0; }
.photo-fig img{ width:100%; }
.photo-fig figcaption{
  display:flex; justify-content:space-between; gap:10px 24px; flex-wrap:wrap;
  margin-top:12px;
  font-family:var(--mono); font-size:.625rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--dim);
}

/* the journey: an instrument axis that plays itself across time */
.journey{ margin-top:clamp(56px,8vh,88px); }

.j-axis{
  position:relative;
  display:flex; justify-content:space-between;
  padding:6px 0 0;
}
.j-line{
  position:absolute; left:0; right:0; top:9px;
  height:1px; background:var(--line);
}
.j-fill{
  position:absolute; left:0; top:0; bottom:0; width:0;
  background:var(--red);
}
.j-node{
  position:relative; z-index:1;
  background:none; border:0; padding:0 0 4px; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; gap:14px;
}
.j-node:first-child{ align-items:flex-start; }
.j-node:last-child{ align-items:flex-end; }
.j-tick{
  width:8px; height:8px; border-radius:50%;
  background:var(--bg);
  border:1px solid var(--muted);
  transition:background .3s ease,border-color .3s ease,transform .3s ease;
}
.j-node .j-label{
  font-family:var(--mono); font-size:.6875rem; letter-spacing:.1em;
  color:var(--dim); white-space:nowrap;
  transition:color .3s ease;
}
.j-node:hover .j-label{ color:var(--ink-2); }
.j-node[aria-selected="true"] .j-tick{ background:var(--red); border-color:var(--red); transform:scale(1.5); }
.j-node[aria-selected="true"] .j-label{ color:var(--ink); }
.j-node.j-future[aria-selected="true"] .j-label{ color:var(--red); }
.j-node:focus-visible{ outline:2px solid var(--red); outline-offset:4px; }
/* subtle red radiate when the bar reaches a dot */
.j-node.ping .j-tick{ animation:jping .9s ease-out 1; }
@keyframes jping{
  0%{ box-shadow:0 0 0 0 rgba(255,0,0,.22); }
  100%{ box-shadow:0 0 0 18px rgba(255,0,0,0); }
}
@media (prefers-reduced-motion:reduce){
  .j-node.ping .j-tick{ animation:none; }
}
@media (max-width:820px){
  .j-node .j-label{ display:none; }
  .j-node[aria-selected="true"] .j-label{ display:block; position:absolute; top:26px; }
  .j-node:first-child [class]{ position:static; }
  .j-node[aria-selected="true"]:first-child .j-label,
  .j-node[aria-selected="true"]:last-child .j-label{ position:absolute; top:26px; }
}

.j-stage{
  display:grid;
  position:relative;
  margin-top:clamp(20px,3vh,32px);
  padding-top:clamp(44px,6vh,64px);
  /* ghost verticals dropping from the axis dots are painted by JS,
     which measures the real dot centers (label widths shift them) */
  background-repeat:no-repeat;
}
.j-slide{
  grid-area:1/1;
  visibility:hidden; opacity:0; transform:translateX(28px);
  transition:opacity .5s ease,transform .5s cubic-bezier(.22,.61,.36,1),visibility .5s;
}
.j-slide.active{ visibility:visible; opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  .j-slide{ transition:none; }
}
.j-slide h3{
  margin:0 0 6px;
  font-family:var(--mono); font-weight:500;
  font-size:clamp(1.375rem,2.4vw,2rem); letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink);
}
.j-slide.j-future h3{ color:var(--red); }
.j-year{
  display:block; margin:0 0 18px;
  font-family:var(--mono); font-size:.75rem; letter-spacing:.18em;
  color:var(--dim);
}
.j-slide p{ margin:0 0 clamp(28px,4vh,44px); font-size:1rem; line-height:1.7; color:var(--ink-2); max-width:66ch; }
.j-slide p a{ color:var(--ink); text-decoration:underline; text-underline-offset:3px;
  text-decoration-color:rgba(255,255,255,.4); }
.j-slide p a:hover{ text-decoration-color:var(--ink); }

/* ---------- 7. market ---------- */

.market-numbers{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,56px);
  margin-top:clamp(44px,7vh,72px);
}
@media (max-width:720px){ .market-numbers{ grid-template-columns:1fr; } }
.mkt{ border-top:1px solid var(--line); padding-top:24px; }
.mkt b{
  display:block; font-family:var(--mono); font-weight:500;
  font-size:clamp(2.75rem,6vw,4.5rem); line-height:1;
}
.mkt .lbl{
  display:block; margin-top:16px;
  font-family:var(--mono); font-size:.6875rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--ink-2);
}
.mkt .sub{ display:block; margin-top:8px; font-size:.875rem; color:var(--muted); }
.source{
  margin:clamp(40px,6vh,60px) 0 0;
  font-family:var(--mono); font-size:.6875rem; letter-spacing:.06em; color:var(--dim);
}

/* ---------- 8. community ---------- */

.community-body{ margin:clamp(40px,6vh,64px) 0 0; max-width:980px; font-size:clamp(1rem,1.4vw,1.125rem); color:var(--ink-2); }
.community-body a{
  color:var(--ink); text-decoration:underline;
  text-underline-offset:3px; text-decoration-color:rgba(255,255,255,.4);
}
.community-body a:hover,
.community-body a:focus-visible{ text-decoration-color:var(--ink); }
.rockets{
  display:grid; grid-template-columns:repeat(5,1fr); gap:clamp(10px,1.5vw,18px);
  margin-top:clamp(48px,7vh,80px);
}
@media (max-width:820px){ .rockets{ grid-template-columns:repeat(2,1fr); } }
figure{ margin:0; }
.rockets img{ width:100%; aspect-ratio:3/5; object-fit:cover; background:var(--panel); }
.rockets figcaption, .team-grid figcaption{
  margin-top:10px;
  font-family:var(--mono); font-size:.625rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--muted);
}
.people-kicker{
  margin:clamp(110px,15vh,170px) 0 30px;
  font-family:var(--mono); font-weight:400;
  font-size:.75rem; letter-spacing:.28em; text-transform:uppercase;
  color:var(--muted);
}
.people{ display:grid; gap:clamp(18px,2.6vw,36px); }
.people.four{ grid-template-columns:repeat(4,1fr); }
.people.three{ grid-template-columns:repeat(3,1fr); }
@media (max-width:820px){
  .people.four,.people.three{ grid-template-columns:1fr 1fr; }
}
@media (max-width:520px){
  .people.four,.people.three{ grid-template-columns:1fr; }
}
.person{ border-top:1px solid var(--line); padding-top:16px; }
.person b{ display:block; font-weight:600; font-size:.9375rem; }
.person span{
  display:block; margin-top:8px;
  font-family:var(--mono); font-size:.6875rem; letter-spacing:.08em;
  line-height:1.7; text-transform:uppercase; color:var(--muted);
}

.person .bio{
  margin:12px 0 0; font-size:.8125rem; line-height:1.65;
  color:var(--dim);
}

/* strategic angels: unified grayscale portraits, name on a bottom scrim,
   a red sliver that draws across on hover */
/* three fixed-size cards spread across the full content width, outer edges
   flush with the team grid above */
.angels{ display:grid; grid-template-columns:repeat(3,minmax(0,290px)); justify-content:space-between; gap:clamp(18px,2.6vw,36px); }
@media (max-width:820px){ .angels{ grid-template-columns:1fr; max-width:440px; } }
.people-kicker + .angels{ margin-top:0; }
.angel{ margin:0; }
.angel-wrap{ position:relative; overflow:hidden; }
.angel-wrap img{
  width:100%; aspect-ratio:1; object-fit:cover;
  transition:transform .6s cubic-bezier(.22,.61,.36,1),filter .4s ease;
}
.angel:hover .angel-wrap img{ transform:scale(1.035); filter:brightness(1.1); }
.angel-wrap::after{
  content:""; position:absolute; inset:55% 0 0 0;
  background:linear-gradient(180deg,transparent,rgba(5,5,7,.88));
}
.angel-cap{
  position:absolute; left:18px; right:18px; bottom:16px; z-index:1;
}
.angel-cap b{ display:block; font-family:var(--display); font-weight:600; font-size:1.0625rem; }
.angel-cap span{
  display:block; margin-top:6px;
  font-family:var(--mono); font-size:.625rem; letter-spacing:.1em;
  line-height:1.6; text-transform:uppercase; color:var(--ink-2);
}
.angel .bio{ margin:14px 0 0; font-size:.8125rem; line-height:1.65; color:var(--dim); }

/* full-bleed backers band */
.backed-banner{
  margin:clamp(110px,15vh,170px) calc(50% - 50vw) 0;
  padding:clamp(48px,7vh,76px) var(--gutter);
  background:var(--panel);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  text-align:center;
}
.backed-banner .banner-kicker{ margin:0 0 34px; }
.backed-logos{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:clamp(44px,9vw,140px);
}
.backed-logos img{
  height:clamp(26px,3.4vw,38px); width:auto; display:inline-block;
  transition:filter .25s ease;
}
.backed-logos img[alt="Startuplab"]{ height:clamp(34px,4.4vw,50px); }
.backed-logos img:hover{ filter:brightness(1.28); }

.logo-row{ display:flex; flex-wrap:wrap; align-items:center; gap:clamp(28px,5vw,72px); }
.logo-tile{
  font-family:var(--display); font-weight:600;
  font-size:clamp(1rem,1.4vw,1.25rem); letter-spacing:.08em;
  color:var(--muted); white-space:nowrap;
  transition:color .25s ease;
}
.logo-tile:hover{ color:var(--ink); }

/* partners carousel: slow continuous scroll, paused on hover; a static
   wrapping row when the visitor prefers reduced motion */
.carousel{ overflow:hidden; }
.car-track{ display:flex; width:max-content; }
.car-set{ display:flex; gap:clamp(36px,6vw,88px); padding-right:clamp(36px,6vw,88px); }
@media (prefers-reduced-motion:no-preference){
  .car-track{ animation:carscroll 45s linear infinite; }
  .carousel:hover .car-track{ animation-play-state:paused; }
}
@keyframes carscroll{ to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){
  .car-track{ width:auto; }
  .car-set{ flex-wrap:wrap; padding-right:0; }
  .car-set.clone{ display:none; }
}

.quote{
  margin:clamp(32px,5vh,56px) 0 0; padding:0 0 0 clamp(20px,3vw,32px);
  border-left:1px solid var(--line);
  max-width:720px;
}
.quote p{
  margin:0; font-size:clamp(1.0625rem,1.5vw,1.25rem); line-height:1.65; color:var(--ink-2);
}
.quote footer{
  margin-top:18px;
  font-family:var(--mono); font-size:.6875rem; letter-spacing:.1em; color:var(--muted);
}
.team-grid{
  display:grid; grid-template-columns:repeat(5,1fr); gap:clamp(12px,1.8vw,22px);
  margin-top:clamp(48px,7vh,80px);
}
@media (max-width:820px){ .team-grid{ grid-template-columns:repeat(2,1fr); } }
.team-grid img{ width:100%; aspect-ratio:2/3; object-fit:cover; background:var(--panel); }

/* ---------- ship to space ---------- */

.ship{ border-top:1px solid var(--line); }
.ship-kicker{ color:var(--red); }

.ship-open{
  margin-top:clamp(32px,5vh,48px);
  background:var(--ink); color:var(--bg);
  border:1px solid var(--ink);
  padding:16px 34px; cursor:pointer;
  font-family:var(--mono); font-size:.8125rem; letter-spacing:.16em;
  text-transform:uppercase;
  transition:background .2s ease,color .2s ease;
}
.ship-open:hover{ background:transparent; color:var(--ink); }
html:not(.js) .ship-open{ display:none; }

/* ----- the console: a small window, one question at a time ----- */

.js .console{
  position:fixed; inset:0; z-index:90;
  display:none;
  overflow:auto;
  background:rgba(5,5,7,.72);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  padding:20px;
}
.js .console.open{ display:grid; }

.console-box{
  position:relative; overflow:hidden;
  margin:auto;
  width:min(620px,94vw); min-height:min(460px,calc(100svh - 40px));
  display:flex; flex-direction:column;
  background:#0b0b0e;
  border:1px solid #26262c;
  box-shadow:0 40px 120px rgba(0,0,0,.6);
}
/* faint stars inside the window */
.console-box::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:radial-gradient(1px 1px at 12% 30%,rgba(255,255,255,.35),transparent 100%),
    radial-gradient(1px 1px at 78% 16%,rgba(255,255,255,.28),transparent 100%),
    radial-gradient(1.5px 1.5px at 62% 74%,rgba(255,255,255,.22),transparent 100%),
    radial-gradient(1px 1px at 30% 84%,rgba(255,255,255,.30),transparent 100%),
    radial-gradient(1px 1px at 90% 55%,rgba(255,255,255,.26),transparent 100%);
}

.console-chrome{
  display:flex; justify-content:space-between; align-items:center;
  padding:14px 18px;
  border-bottom:1px solid #1c1c22;
  font-family:var(--mono); font-size:.625rem; letter-spacing:.22em;
  color:var(--muted);
}
.console-close{
  background:none; border:0; cursor:pointer; padding:4px 2px;
  font-family:var(--mono); font-size:.625rem; letter-spacing:.22em;
  color:var(--muted);
}
.console-close:hover{ color:var(--ink); }

.console-progress{ height:2px; background:#1c1c22; }
.console-progress i{
  display:block; height:100%; width:0;
  background:var(--red);
  transition:width .45s cubic-bezier(.22,.61,.36,1);
}

.console-boot{
  position:absolute; inset:44px 0 0 0; z-index:3;
  background:#0b0b0e; padding:26px 30px;
  display:none;
}
.console-boot pre{
  margin:0; font-family:var(--mono); font-size:.75rem; letter-spacing:.1em;
  color:var(--ink-2); white-space:pre-wrap;
}
.console.booting .console-boot{ display:block; }

.js .ship-form{ position:relative; flex:1; display:flex; }
.js .step{
  position:absolute; inset:0;
  padding:34px 30px 70px;
  display:none; flex-direction:column; justify-content:center;
}
.js .step.active{ display:flex; animation:stepin .4s cubic-bezier(.22,.61,.36,1) both; }
@keyframes stepin{ from{ opacity:0; transform:translateX(26px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){
  .js .step.active{ animation:none; }
}

.hp{ position:absolute; left:-9999px; }

.field{ margin-top:22px; }
.field:first-child{ margin-top:0; }
.field label{
  display:block; margin-bottom:10px;
  font-family:var(--mono); font-size:.6875rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--muted);
}
.field input{
  width:100%; background:none; border:0;
  border-bottom:1px solid var(--bar);
  padding:10px 2px 12px; color:var(--ink);
  font-family:var(--body); font-size:1.0625rem;
  border-radius:0;
}
.field input::placeholder{ color:var(--dim); }
.field input:focus{ outline:none; border-bottom-color:var(--red); }

.chips-group{ border:0; margin:0; padding:0; }
.chips-group legend{
  margin-bottom:16px; padding:0;
  font-family:var(--mono); font-size:.6875rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--muted);
}
.chip{ display:inline-block; margin:0 10px 10px 0; cursor:pointer; }
.chip input{ position:absolute; opacity:0; pointer-events:none; }
.chip span{
  display:inline-block; padding:11px 18px;
  border:1px solid var(--bar);
  font-family:var(--mono); font-size:.75rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--ink-2);
  transition:border-color .2s ease,color .2s ease,background .2s ease;
}
.chip:hover span{ border-color:var(--muted); }
.chip input:checked + span{ border-color:var(--red); color:var(--ink); background:rgba(255,0,0,.06); }
.chip input:focus-visible + span{ outline:2px solid var(--red); outline-offset:3px; }

.step-next,.ship-submit{
  margin-top:26px; align-self:flex-start;
  background:var(--ink); color:var(--bg);
  border:1px solid var(--ink);
  padding:13px 26px; cursor:pointer;
  font-family:var(--mono); font-size:.75rem; letter-spacing:.16em;
  text-transform:uppercase;
  transition:background .2s ease,color .2s ease;
}
.step-next:hover,.ship-submit:hover{ background:transparent; color:var(--ink); }

.step-back{
  position:absolute; left:30px; bottom:20px; z-index:2;
  background:none; border:0; cursor:pointer; padding:4px 0;
  font-family:var(--mono); font-size:.625rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--muted);
}
.step-back:hover{ color:var(--ink); }

/* warp: star streaks on send */
.console-warp{ position:absolute; inset:44px 0 0 0; z-index:4; background:#0b0b0e; overflow:hidden; }
.console-warp i{
  position:absolute; height:1px; width:120px;
  background:linear-gradient(90deg,transparent,#fff);
  animation:warp .8s linear infinite;
  opacity:.85;
}
.console-warp i.r{ background:linear-gradient(90deg,transparent,var(--red)); }
@keyframes warp{
  from{ transform:translateX(-140px) scaleX(.3); }
  to{ transform:translateX(720px) scaleX(1.6); }
}
@media (prefers-reduced-motion:reduce){
  .console-warp{ display:none; }
}

.ship-done,.ship-fail{
  position:absolute; inset:44px 0 0 0; z-index:5;
  display:flex; flex-direction:column; justify-content:center;
  padding:34px 30px; background:transparent;
}
.done-line{
  margin:0; font-family:var(--mono); font-weight:500;
  font-size:clamp(1.5rem,3vw,2rem); letter-spacing:.08em; color:var(--ink);
}
.done-sub{ margin:14px 0 0; font-size:.9375rem; color:var(--muted); max-width:40ch; }
.done-sub a{ color:var(--ink); }

/* ----- no-JS fallback: the same form, stacked and visible ----- */
html:not(.js) .console-chrome,
html:not(.js) .console-progress,
html:not(.js) .console-boot,
html:not(.js) .console-warp,
html:not(.js) .step-back{ display:none; }
html:not(.js) .console-box{ border:0; background:none; box-shadow:none; min-height:0; width:auto; }
html:not(.js) .console-box::before{ content:none; }
html:not(.js) .ship-form{ max-width:820px; }
html:not(.js) .step{ margin-top:34px; }
html:not(.js) .step-next{ display:none; }

/* ---------- 9. contact / footer ---------- */

.footer{
  border-top:1px solid var(--line);
  padding:clamp(72px,11vh,128px) 0 40px;
}
.contact-mail{
  display:inline-block; margin-top:6px;
  font-family:var(--mono); font-weight:500;
  font-size:clamp(1.0625rem,1.8vw,1.5rem); letter-spacing:.02em;
  color:var(--ink); text-decoration:none;
  border-bottom:1px solid #3a3a42; padding-bottom:6px;
  transition:border-color .2s ease;
}
.contact-mail:hover,
.contact-mail:focus-visible{ border-bottom-color:var(--red); }
.org-line{
  margin:clamp(56px,9vh,88px) 0 0;
  font-family:var(--mono); font-size:.625rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--dim); line-height:2;
}