/* ============================================================
   BioSky — Energy Resilience from Space
   "Mission-control clean": warm cream + space-navy + aqua signal
   Refs: pravah.com layout language / x.company cleanliness
   ============================================================ */

:root{
  --cream:    #F1EFE7;
  --cream-2:  #E8E5DB;
  --cream-3:  #DEDACE;
  --navy:     #022F2F;
  --navy-2:   #0A4A46;

  --ink:        #171B22;   /* solid heading + text on cream */
  --ink-body:   #43474F;   /* body copy on cream */
  --ink-mute:   #A8A296;   /* muted two-tone lead on cream */
  --line-dark:  rgba(23,27,34,.82);   /* blueprint strokes */
  --bp-line:    rgba(23,27,34,.07);    /* graph-paper grid */
  --hair:       rgba(23,27,34,.14);    /* hairline rules on cream */

  --on-navy:       #ECEAE2;
  --on-navy-mute:  rgba(236,234,226,.56);
  --on-navy-faint: rgba(236,234,226,.30);
  --hair-light:    rgba(236,234,226,.16);

  --accent:        #2FE6BD;
  --accent-bright: #8BFFE3;
  --accent-deep:   #0E9E80;   /* accent that holds contrast on cream */
  --crit:          #C2553F;

  --display: 'Montserrat', system-ui, sans-serif;
  --sans:    'IBM Plex Serif', Georgia, serif;
  --mono:    'IBM Plex Mono', ui-monospace, monospace;

  --wrap: 1200px;
  --pad: clamp(20px, 5vw, 76px);
  --sec-y: clamp(84px, 13vh, 168px);
  --ease: cubic-bezier(.22,.61,.36,1);
  --sat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='10.4' y='8' width='3.2' height='8' rx='1'/%3E%3Crect x='2.6' y='9' width='5' height='6' rx='1'/%3E%3Crect x='16.4' y='9' width='5' height='6' rx='1'/%3E%3Crect x='7.6' y='11.2' width='3' height='1.6'/%3E%3Crect x='13.4' y='11.2' width='3' height='1.6'/%3E%3Crect x='11.4' y='3.4' width='1.2' height='4.6'/%3E%3Ccircle cx='12' cy='3' r='1.5'/%3E%3C/svg%3E");
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  font-family:var(--sans); background:var(--cream); color:var(--ink);
  line-height:1.65; text-wrap:pretty; overflow-x:hidden; -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
svg,canvas,img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
::selection{ background:var(--accent); color:var(--navy); }

.grain{
  position:fixed; inset:0; z-index:9999; pointer-events:none; opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}

.wrap{ width:100%; max-width:var(--wrap); margin:0 auto; padding-inline:var(--pad); }
.section--cream{ background:var(--cream); color:var(--ink); }
.section--navy{ background:var(--navy); color:var(--on-navy); }
.ink-accent{ color:var(--accent-deep); }
.section--navy .ink-accent{ color:var(--accent); }

/* ---------- type ---------- */
.h2{
  font-family:var(--display); font-weight:600; letter-spacing:-.02em; line-height:1.12; text-wrap:balance;
  font-size:clamp(1.5rem, 2.15vw, 1.72rem);
}
.hero__title, .statement, .cta__title, .metric__v,
.trow__text h3, .problem__item h3, .sol__col h3, .rcard h3{ font-family:var(--display); }
.h2--light{ color:var(--on-navy); }
.statement{
  font-weight:500; letter-spacing:-.02em; line-height:1.22; text-wrap:balance;
  font-size:clamp(1.5rem, 2.2vw, 1.78rem); max-width:24ch;
}
.muted{ color:var(--ink-mute); }
.muted-light{ color:var(--on-navy-faint); }

/* ---------- scroll animations ---------- */
@media (prefers-reduced-motion: no-preference) {
  /* Fade in */
  [data-animate="fade"] {
    opacity: 0;
    transition: opacity 0.8s ease-out 0.1s both;
  }
  [data-animate="fade"].in { opacity: 1; }

  /* Slide from bottom */
  [data-animate="slide-up"] {
    opacity: 0;
    transform: translateY(60px);
    transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
    transition-delay: calc(var(--d, 0s) + 0.1s);
  }
  [data-animate="slide-up"].in { opacity: 1; transform: translateY(0); }

  /* Slide from left */
  [data-animate="slide-left"] {
    opacity: 0;
    transform: translateX(-60px);
    transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
    transition-delay: calc(var(--d, 0s) + 0.1s);
  }
  [data-animate="slide-left"].in { opacity: 1; transform: translateX(0); }

  /* Slide from right */
  [data-animate="slide-right"] {
    opacity: 0;
    transform: translateX(60px);
    transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
    transition-delay: calc(var(--d, 0s) + 0.1s);
  }
  [data-animate="slide-right"].in { opacity: 1; transform: translateX(0); }

  /* Scale & fade */
  [data-animate="scale"] {
    opacity: 0;
    transform: scale(0.92);
    transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
    transition-delay: calc(var(--d, 0s) + 0.1s);
  }
  [data-animate="scale"].in { opacity: 1; transform: scale(1); }

  /* Stagger children (applies --d delay to each child) */
  [data-stagger] > * {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
  }
  [data-stagger].in > * {
    opacity: 1;
    transform: translateY(0);
  }
  [data-stagger] > :nth-child(1) { transition-delay: calc(var(--base-delay, 0.1s) + 0s); }
  [data-stagger] > :nth-child(2) { transition-delay: calc(var(--base-delay, 0.1s) + 0.1s); }
  [data-stagger] > :nth-child(3) { transition-delay: calc(var(--base-delay, 0.1s) + 0.2s); }
  [data-stagger] > :nth-child(4) { transition-delay: calc(var(--base-delay, 0.1s) + 0.3s); }
  [data-stagger] > :nth-child(5) { transition-delay: calc(var(--base-delay, 0.1s) + 0.4s); }
  [data-stagger] > :nth-child(6) { transition-delay: calc(var(--base-delay, 0.1s) + 0.5s); }
}

/* ---------- chip / label ---------- */
.chip{
  display:inline-flex; align-items:center; gap:.55em; align-self:flex-start; font-family:var(--mono); font-size:.72rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-body);
  border:1px solid var(--hair); border-radius:7px; padding:.42em .8em; margin-bottom:1.6rem;
}
.chip::before{ content:""; flex:none; width:1.3em; height:1.3em; background-color:var(--accent-deep);
  -webkit-mask:var(--sat) center/contain no-repeat; mask:var(--sat) center/contain no-repeat; }
.chip--light{ color:var(--on-navy-mute); border-color:var(--hair-light); }
.chip--light::before{ background-color:var(--accent); }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.55em; font-weight:600; font-size:.96rem;
  padding:.86em 1.5em; border-radius:100px; border:1px solid transparent; cursor:pointer;
  transition:transform .3s var(--ease), background .3s, color .3s, border-color .3s, box-shadow .3s;
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); }
.btn--solid{ background:var(--navy); color:var(--cream); }
.section--navy .btn--solid{ background:var(--accent); color:var(--navy); }
.btn--solid:hover{ box-shadow:0 12px 30px -12px rgba(13,21,36,.5); }
.section--navy .btn--solid:hover{ background:var(--accent-bright); box-shadow:0 12px 30px -10px rgba(47,230,189,.5); }
.btn--ghost{ border-color:var(--hair); color:var(--ink); }
.btn--ghost:hover{ border-color:var(--ink); }
.section--navy .btn--ghost{ color:var(--on-navy); border-color:var(--hair-light); }
.btn--lg{ font-size:1.05rem; padding:1em 2em; }

/* placeholder markers */
.ph,.ph-inline,.ph-note,.ph-pill{ font-style:normal; }
.ph{ color:var(--accent-deep); border-bottom:1px dashed var(--accent-deep); }
.section--navy .ph{ color:var(--accent); border-color:var(--accent); }
.ph-note{ margin-top:1.2rem; font-family:var(--mono); font-size:.74rem; color:var(--accent-deep); letter-spacing:.03em; }
.ph-pill{ font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--accent-deep); border:1px dashed var(--accent-deep); border-radius:6px; padding:.4em .7em; }
.ph-inline{ font-family:var(--mono); font-size:.7rem; color:var(--accent); opacity:.8; }

/* ============================================================
   NAV (segmented pods, left-clustered like the refs)
   ============================================================ */
.nav{
  position:fixed; top:18px; left:0; right:0; z-index:1000;
  padding-inline:var(--pad); display:flex; align-items:center; gap:10px;
  transition:top .4s var(--ease);
}
.nav__pod{
  background:rgba(241,239,231,.78); backdrop-filter:blur(14px) saturate(140%);
  border:1px solid var(--hair); border-radius:13px; height:52px; display:flex; align-items:center;
  transition:background .3s, border-color .3s;
}
.nav.scrolled .nav__pod{ background:rgba(241,239,231,.92); box-shadow:0 8px 30px -18px rgba(13,21,36,.4); }
.nav__pod--brand{ padding:0 18px; }
.nav__pod--links{ margin-left:auto; padding:0 6px; gap:2px; }
.nav__pod--links a{
  font-size:.94rem; color:var(--ink-body); padding:.55em .9em; border-radius:9px;
  transition:background .25s, color .25s;
}
.nav__pod--links a:hover{ color:var(--ink); background:var(--cream-3); }
.nav__pod--links a.is-active{ color:var(--ink); background:var(--cream-3); }
.nav__pod--cta{ padding:0 6px; }
.nav__pod--cta a{
  font-size:.92rem; font-weight:600; color:var(--cream); background:var(--navy);
  padding:.62em 1.15em; border-radius:9px; transition:background .25s;
}
.nav__pod--cta a:hover{ background:var(--navy-2); }

/* nav solutions dropdown */
.nav__drop{ position:relative; }
.nav__drop-btn{ font-family:inherit; font-size:.94rem; color:var(--ink-body); background:none; border:none;
  cursor:pointer; padding:.55em .9em; border-radius:9px; display:inline-flex; align-items:center; gap:.4em;
  transition:background .25s, color .25s; }
.nav__drop-btn:hover{ color:var(--ink); background:var(--cream-3); }
.nav__drop .caret{ font-size:.6rem; transition:transform .25s var(--ease); }
.nav__drop:hover .caret, .nav__drop.open .caret{ transform:rotate(180deg); }
.nav__menu{ position:absolute; top:calc(100% + 12px); left:0; min-width:212px;
  background:rgba(241,239,231,.98); backdrop-filter:blur(16px) saturate(140%);
  border:1px solid var(--hair); border-radius:12px; padding:8px; display:flex; flex-direction:column; gap:1px;
  opacity:0; visibility:hidden; transform:translateY(-6px); z-index:20;
  transition:opacity .22s var(--ease), transform .22s var(--ease), visibility .22s;
  box-shadow:0 22px 46px -22px rgba(13,21,36,.5); }
.nav__menu::before{ content:""; position:absolute; top:-12px; left:0; right:0; height:12px; }
.nav__drop:hover .nav__menu, .nav__drop.open .nav__menu{ opacity:1; visibility:visible; transform:none; }
.nav__menu a{ padding:.62em .9em; border-radius:8px; font-size:.9rem; color:var(--ink-body); white-space:nowrap;
  transition:background .2s, color .2s; }
.nav__menu a:hover{ background:var(--cream-3); color:var(--ink); }

/* grouped 3-column solutions dropdown */
.nav__menu--grouped{
  left:50%; transform:translateX(-50%);
  flex-direction:row; align-items:flex-start; gap:4px; min-width:600px; padding:14px 10px;
}
.nav__drop:hover .nav__menu--grouped, .nav__drop.open .nav__menu--grouped{ transform:translateX(-50%); }
.nav__menu-col{ display:flex; flex-direction:column; gap:1px; flex:1; padding:0 4px; }
.nav__menu-col + .nav__menu-col{ border-left:1px solid var(--hair); }
.nav__menu-cat{ font-family:var(--mono); font-size:.64rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent-deep); padding:.5em .9em .6em; }
.brand{ display:inline-flex; align-items:center; gap:.55em; }
.brand__mark{ width:28px; height:28px; }
.bm-core{ fill:var(--accent-deep); } .bm-ring{ stroke:var(--ink); stroke-width:1.4; fill:none; opacity:.55; } .bm-sat{ fill:var(--accent-deep); }
.brand__word{ font-weight:700; font-size:1.22rem; letter-spacing:-.02em; }
.brand__logo{ height:26px; width:auto; display:block; }
.brand__logo--cream{ height:24px; width:90px; background-color:var(--on-navy);
  -webkit-mask:url(assets/logo.svg) left center / contain no-repeat;
          mask:url(assets/logo.svg) left center / contain no-repeat; }

.nav__toggle{ display:none; margin-left:auto; flex-direction:column; gap:5px; width:52px; height:52px;
  align-items:center; justify-content:center; background:rgba(241,239,231,.85); backdrop-filter:blur(14px);
  border:1px solid var(--hair); border-radius:13px; cursor:pointer; }
.nav__toggle span{ width:22px; height:2px; background:var(--ink); transition:.3s var(--ease); }
.nav__mobile{ display:none; }

/* ============================================================
   HERO
   ============================================================ */
.hero{
  min-height:100svh; display:grid; grid-template-columns:1.2fr 1fr; align-items:center;
  gap:clamp(20px,4vw,56px); padding:120px var(--pad) 60px; max-width:1340px; margin:0 auto;
}
.hero__title{ font-weight:600; letter-spacing:-.025em; line-height:1.1; font-size:clamp(1.75rem,2.5vw,2.05rem); }
.hero__title > span{ display:block; }
.hero__title .lead{ color:var(--ink-mute); }
.hero__lede{ margin-top:1.7rem; max-width:46ch; font-size:clamp(1.05rem,1.5vw,1.28rem); color:var(--ink-body); }
.hero__actions{ margin-top:2.3rem; display:flex; gap:14px; flex-wrap:wrap; }

.hero__stage{
  position:relative; align-self:stretch; min-height:min(74vh,640px);
  background:radial-gradient(120% 120% at 70% 20%, var(--navy-2), var(--navy) 70%);
  border-radius:22px; overflow:hidden; border:1px solid rgba(236,234,226,.08);
  margin-top:clamp(20px,4vh,0px);
}
.hero__canvas{ position:absolute; inset:0; width:100%; height:100%; }
.hero__cards{ position:absolute; inset:0; pointer-events:none; }
.dcard{
  position:absolute; width:min(62%,250px); padding:14px 16px; border-radius:14px;
  background:rgba(4,44,44,.6); backdrop-filter:blur(10px); border:1px solid rgba(236,234,226,.14);
  color:var(--on-navy); animation:bob 7s var(--ease) infinite;
}
.dcard--critical{ top:12%; left:7%; }
.dcard--info{ bottom:12%; right:8%; animation-delay:-3s; }
.dcard__tag{ font-family:var(--mono); font-size:.62rem; letter-spacing:.16em; color:var(--crit);
  border:1px solid var(--crit); border-radius:5px; padding:.2em .5em; display:inline-block; margin-bottom:.6em; }
.dcard__icon{ font-size:1rem; color:var(--accent); }
.dcard__title{ font-weight:600; font-size:.96rem; }
.dcard__sub{ font-size:.8rem; color:var(--on-navy-mute); margin-top:.25em; line-height:1.4; }
@keyframes bob{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-9px); } }

/* ============================================================
   VISION
   ============================================================ */
.vision{ padding:var(--sec-y) 0; position:relative; overflow:hidden; }
.ghost{
  position:absolute; right:-6%; top:50%; width:min(46vw,560px); aspect-ratio:1; transform:translateY(-50%);
  background:radial-gradient(circle at 40% 40%, rgba(47,230,189,.16), rgba(13,21,36,.05) 60%, transparent 72%);
  filter:blur(8px); border-radius:42% 58% 56% 44% / 48% 42% 58% 52%;
  animation:morph 14s ease-in-out infinite; z-index:0;
}
@keyframes morph{ 0%,100%{ border-radius:42% 58% 56% 44% / 48% 42% 58% 52%; transform:translateY(-50%) rotate(0); }
  50%{ border-radius:58% 42% 38% 62% / 56% 58% 42% 44%; transform:translateY(-52%) rotate(18deg); } }
.vision .wrap{ position:relative; z-index:1; }

/* ============================================================
   PROBLEM
   ============================================================ */
.problem{ padding:var(--sec-y) 0; }
.problem__head{ display:flex; flex-direction:column; margin-bottom:clamp(44px,6vh,80px); }
.problem__grid{ display:grid; grid-template-columns:1fr 1fr; gap:0; }
.problem__item{
  display:flex; gap:22px; align-items:flex-start; padding:clamp(28px,3.4vw,46px) clamp(20px,3vw,56px);
  border-top:1px solid var(--hair-light);
}
.problem__item:nth-child(odd){ border-right:1px solid var(--hair-light); }
.problem__item h3{ font-size:1.2rem; font-weight:600; letter-spacing:-.005em; margin-bottom:.5rem; }
.problem__item p{ color:var(--on-navy-mute); font-size:1.02rem; line-height:1.55; max-width:42ch; }

/* problem icons — clean line-art */
.picon{ flex:none; width:46px; height:46px; margin-top:2px; display:block; color:var(--on-navy); }
.picon svg{ width:100%; height:100%; overflow:visible; }
.picon .ln{ fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; opacity:.7; }
.picon .ac{ fill:none; stroke:var(--accent); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.picon .dash{ stroke-dasharray:2.5 3.5; animation:icdash 1s linear infinite; }
.picon .dot{ fill:currentColor; opacity:.7; }
.picon .acf{ fill:var(--accent); }
.picon .pulse-dot{ fill:var(--accent); animation:icpulse 2.4s ease-in-out infinite; }
@keyframes icpulse{ 0%,100%{ opacity:.5; } 50%{ opacity:1; } }
@keyframes icdash{ to{ stroke-dashoffset:-6; } }

/* ============================================================
   TECHNOLOGY — alternating blueprint rows
   ============================================================ */
.tech{ padding:var(--sec-y) 0; }
.tech__head{ margin-bottom:clamp(50px,7vh,96px); }
.trow{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(30px,5vw,80px); align-items:center;
  padding:clamp(34px,5vh,64px) var(--pad); }
.trow + .trow{ border-top:1px solid var(--hair); }
.trow--rev .trow__viz{ order:2; }
.trow__text h3{ font-size:clamp(1.25rem,1.7vw,1.5rem); font-weight:600; letter-spacing:-.01em; line-height:1.2; text-wrap:balance; margin-bottom:.9rem; }
.trow__text p{ color:var(--ink-body); font-size:1.1rem; line-height:1.6; max-width:42ch; }

.bp{
  position:relative; aspect-ratio:460/360; width:100%; border-radius:16px; overflow:hidden;
  background:var(--cream-2);
  background-image:linear-gradient(var(--bp-line) 1px,transparent 1px), linear-gradient(90deg,var(--bp-line) 1px,transparent 1px);
  background-size:30px 30px; border:1px solid var(--hair);
}
.bp__svg{ position:absolute; inset:0; width:100%; height:100%; }
.bp__assets line, .gn-lines path{ stroke:var(--line-dark); stroke-width:1.4; fill:none; stroke-linecap:round; }
.bp__assets line{ opacity:.55; }

/* forecast — pylons + flowing conductor lines (dotted, moving dots) */
.fc-tower line{ stroke:var(--line-dark); stroke-width:1.5; opacity:.55; stroke-linecap:round; }
.fc-line{ fill:none; stroke:var(--accent-deep); stroke-width:1.9; stroke-linecap:round;
  stroke-dasharray:0.1 9; animation:flowdots 1.1s linear infinite; }
@keyframes flowdots{ to{ stroke-dashoffset:-18; } }

/* grid modelling — semi-complex network with flowing routes */
.grid-faint line{ stroke:var(--line-dark); stroke-width:1; opacity:.26; }
.grid-node{ fill:var(--line-dark); opacity:.45; }
.grid-flow{ fill:none; stroke:var(--accent-deep); stroke-width:2; stroke-linecap:round;
  stroke-dasharray:0.1 9; animation:flowdots 1.2s linear infinite; }
.grid-flow--2{ animation-delay:-.6s; }

/* blueprint floating card */
.bp__card{ position:absolute; left:8%; bottom:7%; max-width:62%; padding:11px 13px; border-radius:11px;
  background:var(--navy); color:var(--on-navy); }
.bp__card-tag{ font-family:var(--mono); font-size:.6rem; letter-spacing:.14em; color:var(--accent);
  display:inline-block; margin-bottom:.45em; }
.bp__card-tag--live::after{ content:""; }
.bp__card p{ font-size:.78rem; line-height:1.4; color:var(--on-navy-mute); }
.bp__card--legend{ left:auto; right:6%; top:8%; bottom:auto; display:flex; flex-direction:column; gap:.5em; background:rgba(5,46,46,.96); }
.lg-k{ font-family:var(--mono); font-size:.58rem; letter-spacing:.12em; color:var(--on-navy-faint); display:block; }
.lg-k--crit{ color:var(--crit); }
.lg-v{ font-size:1.1rem; font-weight:600; font-variant-numeric:tabular-nums; }
.lg-v--crit{ color:var(--crit); }

/* satellite-based forecasting — world map scan */
.wm-land{ fill:var(--line-dark); fill-opacity:.045; stroke:var(--line-dark); stroke-width:1.2;
  stroke-opacity:.5; stroke-linejoin:round; stroke-linecap:round; }
.wm-stipple circle{ fill:var(--line-dark); opacity:.2; }
.wm-link{ fill:none; stroke:var(--line-dark); stroke-width:1; opacity:.2; }
.wm-flow{ fill:none; stroke:var(--accent-deep); stroke-width:1.9; stroke-linecap:round;
  stroke-dasharray:0.1 9; animation:flowdots 1.15s linear infinite; }
.wm-node{ fill:var(--accent-deep); }
.wm-node--pulse{ transform-box:fill-box; transform-origin:center; animation:wm-pulse 2.6s ease-in-out infinite; }
@keyframes wm-pulse{ 0%,100%{ opacity:.45; } 50%{ opacity:1; } }
.wm-ico{ fill:none; stroke:var(--line-dark); stroke-width:1.3; stroke-linecap:round; stroke-linejoin:round; opacity:.5; }
.wm-sat{ animation:wm-drift 8s ease-in-out infinite; }
@keyframes wm-drift{ 0%,100%{ transform:translateX(-9px); } 50%{ transform:translateX(9px); } }
.wm-sat-body line{ stroke:var(--line-dark); stroke-width:1.4; stroke-linecap:round; opacity:.7; }
.wm-sat-body .panel{ fill:var(--line-dark); fill-opacity:.09; stroke:var(--line-dark); stroke-width:1.2; stroke-opacity:.7; }
.wm-sat-body .body{ fill:var(--cream-2); stroke:var(--line-dark); stroke-width:1.4; stroke-opacity:.75; }
.wm-sat-body .tip{ fill:var(--accent-deep); }
.wm-beam{ fill:var(--accent); transform-box:fill-box; transform-origin:top center;
  animation:wm-beam 3.6s ease-in-out infinite; }
@keyframes wm-beam{ 0%,100%{ opacity:.05; transform:scaleX(.85); } 50%{ opacity:.13; transform:scaleX(1.06); } }
.wm-ping{ fill:none; stroke:var(--accent); stroke-width:1.4; transform-box:fill-box; transform-origin:center;
  opacity:0; animation:wm-ping 3.6s ease-out infinite; }
@keyframes wm-ping{ 0%{ opacity:.55; transform:scale(.35); } 70%,100%{ opacity:0; transform:scale(1.9); } }
@media (prefers-reduced-motion:reduce){
  .wm-flow,.wm-node--pulse,.wm-sat,.wm-beam,.wm-ping{ animation:none; }
  .wm-flow{ stroke-dasharray:none; opacity:.8; }
}

/* computer-vision before/after slider */
.bp--cv{ padding:0; }
.cvslider{ position:absolute; inset:0; overflow:hidden; touch-action:none; cursor:ns-resize; }
.cvslider__layer{ position:absolute; inset:0; }
.cvslider__layer svg{ width:100%; height:100%; display:block; }
.cvslider__cv{ clip-path:inset(var(--cy,50%) 0 0 0); transition:clip-path .18s ease; }
.cvslider__bar{ position:absolute; left:0; right:0; top:var(--cy,50%); transform:translateY(-50%);
  height:20px; display:flex; align-items:center; justify-content:center; gap:8px; padding:0 10px;
  pointer-events:none; z-index:2; transition:top .18s ease; }
.cvslider__bar::before{ content:""; position:absolute; left:0; right:0; top:50%; height:2px; transform:translateY(-50%);
  background:linear-gradient(90deg,transparent,rgba(120,255,180,.95),transparent); box-shadow:0 0 9px rgba(47,230,189,.85); }
.cvslider__binary{ position:relative; font-family:var(--mono); font-size:7px; letter-spacing:1.5px;
  color:rgba(120,255,180,.75); white-space:nowrap; overflow:hidden; flex:1; }
.cvslider__binary--r{ text-align:right; }
.cvslider__tag{ position:relative; font-family:var(--mono); font-size:8.5px; letter-spacing:.16em; color:#04201F;
  background:var(--accent); padding:2px 8px; border-radius:3px; font-weight:600; flex:none; }
.cvslider__handle{ position:absolute; left:50%; top:var(--cy,50%); transform:translate(-50%,-50%);
  width:40px; height:40px; border-radius:50%; background:var(--accent); border:3px solid #04201F; padding:0;
  cursor:ns-resize; box-shadow:0 4px 14px rgba(2,47,47,.4); z-index:3; transition:top .18s ease;
  animation:cv-handle 2.6s ease-in-out infinite; }
.cvslider__handle::before{ content:"\2195"; color:#04201F; font-size:17px; font-weight:700; line-height:1; }
.cvslider__handle:focus-visible{ outline:2px solid var(--accent-deep); outline-offset:3px; }
@keyframes cv-handle{ 0%,100%{ box-shadow:0 4px 14px rgba(2,47,47,.4);} 50%{ box-shadow:0 0 0 7px rgba(47,230,189,.16),0 4px 14px rgba(2,47,47,.4);} }
.cvslider.dragging{ cursor:grabbing; }
.cvslider.dragging .cvslider__cv,
.cvslider.dragging .cvslider__bar,
.cvslider.dragging .cvslider__handle{ transition:none; }
.cv-streak{ animation:cv-streak 3.2s linear infinite; }
@keyframes cv-streak{ 0%{ opacity:.15; } 50%{ opacity:.5; } 100%{ opacity:.15; } }
@media (prefers-reduced-motion:reduce){ .cvslider__handle,.cv-streak{ animation:none; } }

/* computer-vision detection (legacy) */
.cv-box{ fill:none; stroke:var(--line-dark); stroke-width:1.1; stroke-dasharray:4 5; opacity:.3; transition:.3s; }
.cv-art line, .cv-art rect{ stroke:var(--line-dark); stroke-width:1.5; fill:none; transition:.3s; }
.cv-label{ font-family:var(--mono); font-size:11px; letter-spacing:.06em; fill:var(--ink-mute); text-anchor:middle; transition:.3s; }
.cv-label--btm{ } /* positioned via y in markup */
.cv-link{ stroke:var(--line-dark); stroke-width:1.2; fill:none; stroke-dasharray:2 5; opacity:.4; animation:flow 1.4s linear infinite; }
.cv-detect{ display:none; }
.cv-asset.is-active .cv-box{ opacity:1; stroke:var(--accent-deep); fill:rgba(47,230,189,.07); }
.cv-asset.is-active .cv-art line, .cv-asset.is-active .cv-art rect{ stroke:var(--accent-deep); }
.cv-asset.is-active .cv-label{ fill:var(--ink); font-weight:700; }
@keyframes flow{ to{ stroke-dashoffset:-14; } }

/* graph nodes */
.gn-lines path{ opacity:.4; }
.gn-node circle{ fill:var(--cream-3); stroke:var(--line-dark); stroke-width:1.4; }
.gn-node text{ font-family:var(--mono); font-size:13px; fill:var(--ink); text-anchor:middle; }
.gn-node--crit circle{ fill:rgba(194,85,63,.16); stroke:var(--crit); stroke-width:1.8; animation:critpulse 2.2s ease-in-out infinite; }
.gn-node--crit text{ fill:var(--crit); }
@keyframes critpulse{ 0%,100%{ opacity:.85; } 50%{ opacity:1; } }
.gn-node--crit{ transform-box:fill-box; transform-origin:center; animation:critscale 2.2s ease-in-out infinite; }
@keyframes critscale{ 0%,100%{ transform:scale(1);} 50%{ transform:scale(1.06);} }

/* simulation */
.sim-paths path{ stroke:var(--line-dark); stroke-width:1.2; fill:none; stroke-dasharray:2 6; opacity:.4; animation:flow 1.8s linear infinite; }
.sim-nodes rect, .sim-nodes circle{ fill:var(--cream-2); stroke:var(--line-dark); stroke-width:1.4; }
.sim-nodes circle{ fill:none; }
.sim-cursor{ fill:rgba(47,230,189,.1); stroke:var(--accent-deep); stroke-width:2; transform-box:view-box;
  animation:simjump 6.4s steps(1) infinite; }
@keyframes simjump{
  0%{ transform:translate(0,0); } 22%{ transform:translate(-120px,-82px); }
  44%{ transform:translate(120px,-82px); } 66%{ transform:translate(80px,82px); }
  88%{ transform:translate(-120px,82px); } 100%{ transform:translate(0,0); } }

/* ============================================================
   SOLUTIONS
   ============================================================ */
.sol{ padding:0 0 var(--sec-y); }
.sol__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:1px solid var(--hair); }
.sol__col{ padding:clamp(28px,3vw,42px) clamp(20px,2.4vw,40px); border-right:1px solid var(--hair); }
.sol__col:last-child{ border-right:none; }
.sol__col header{ display:flex; align-items:baseline; gap:.8em; margin-bottom:1rem; }
.sol__n{ font-family:var(--mono); font-size:.8rem; color:var(--accent-deep); }
.sol__col h3{ font-size:1.4rem; font-weight:600; letter-spacing:-.01em; }
.sol__lede{ color:var(--ink-body); margin-bottom:1.6rem; font-size:1.02rem; }
.sol__tags{ display:flex; flex-direction:column; }
.sol__tags li{ padding:.7em 0; border-top:1px solid var(--hair); font-size:1rem; position:relative; padding-left:1.4em; }
.sol__tags li::before{ content:"◆"; position:absolute; left:0; color:var(--accent-deep); font-size:.7em; top:1.15em; }

/* ============================================================
   IMPACT
   ============================================================ */
.impact{ padding:var(--sec-y) 0; }
.impact__head{ margin-bottom:clamp(40px,6vh,72px); }
.impact__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:1px solid var(--hair-light); }
.metric{ padding:clamp(28px,3vw,44px) clamp(16px,2vw,28px); border-right:1px solid var(--hair-light); display:flex; flex-direction:column; gap:.6rem; }
.metric:last-child{ border-right:none; }
.metric__num{ display:flex; align-items:flex-end; gap:.1em; }
.metric__v{ font-size:clamp(1.75rem,2.5vw,2.05rem); font-weight:600; letter-spacing:-.02em; color:var(--accent); line-height:1; font-variant-numeric:tabular-nums; }
.metric__pfx{ font-size:clamp(1.2rem,1.8vw,1.4rem); font-weight:600; color:var(--accent); line-height:1; }
.metric__l{ color:var(--on-navy-mute); font-size:.98rem; line-height:1.4; }

/* ============================================================
   COVERAGE
   ============================================================ */
.coverage{ padding:var(--sec-y) 0; }
.coverage__wrap{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,6vw,90px); align-items:center; }
.coverage__viz{ aspect-ratio:1; max-width:520px; width:100%; }
.coverage__viz canvas{ width:100%; height:100%; }
.coverage__lede{ color:var(--ink-body); font-size:1.1rem; line-height:1.6; margin-top:.4rem; max-width:46ch; }
.coverage__list{ margin-top:2rem; display:flex; flex-direction:column; gap:.7rem; font-size:1.15rem; }
.coverage__list li{ color:var(--ink); }
.coverage__list .tag-muted{ color:var(--ink-mute); font-size:.9rem; }
.coverage__list li::before{ content:""; display:inline-block; width:.85em; height:.85em; margin-right:.55em; vertical-align:-.02em;
  background-color:var(--accent-deep); -webkit-mask:var(--sat) center/contain no-repeat; mask:var(--sat) center/contain no-repeat; }

/* ============================================================
   RESEARCH
   ============================================================ */
.research{ padding:0 0 var(--sec-y); }
.research__head{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-bottom:clamp(34px,5vh,60px); }
.research__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.research__grid--2{ grid-template-columns:repeat(2,1fr); max-width:840px; margin:0 auto; }
.rcard__viz{ aspect-ratio:5/3; border-radius:14px; overflow:hidden; margin-bottom:1.3rem; border:1px solid var(--hair); }
.rcard__viz--a{ background:var(--cream-3); }
.rcard__viz--b{ background:var(--navy); }
.rcard__viz--c{ background:#fbfaf6; }
.rviz{ width:100%; height:100%; }
.rgnn line{ stroke:rgba(236,234,226,.4); stroke-width:1; }
.rgnn circle{ fill:none; stroke:var(--accent); stroke-width:1.4; }
.rgnn rect{ fill:none; stroke:var(--on-navy); stroke-width:1.2; }
.rcard{ display:block; }
.rcard h3{ font-size:1.12rem; font-weight:600; line-height:1.35; letter-spacing:0; margin-bottom:.6rem; }
.rcard__auth{ font-family:var(--mono); font-size:.78rem; color:var(--ink-mute); }
.rcard--link{ transition:transform .25s var(--ease); }
.rcard--link:hover{ transform:translateY(-3px); }
.rcard--link:hover .rcard__viz{ border-color:var(--accent-deep); }
.rcard--link .rcard__auth{ color:var(--accent-deep); display:inline-flex; align-items:center; gap:.4em; }
.rcard--link .rcard__auth span{ transition:transform .25s var(--ease); }
.rcard--link:hover .rcard__auth span{ transform:translateX(3px); }

/* ============================================================
   CAREERS
   ============================================================ */
.careers{ padding:0 0 var(--sec-y); }
.careers__wrap{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,6vw,90px); align-items:center; }
.careers__lede{ color:var(--ink-body); font-size:1.1rem; line-height:1.6; margin-top:.4rem; max-width:46ch; }
.careers__roles{ display:flex; flex-direction:column; gap:12px; }
.role{ display:flex; justify-content:space-between; align-items:center; gap:16px; padding:1.1em 1.3em;
  border:1px solid var(--hair); border-radius:12px; background:var(--cream); font-weight:600; font-size:1.05rem;
  transition:transform .3s var(--ease), border-color .3s, background .3s; }
.role:hover{ transform:translateX(8px); border-color:var(--ink); }
.role__loc{ font-family:var(--mono); font-size:.78rem; color:var(--ink-mute); font-weight:400; }

/* ============================================================
   CLOSING CTA
   ============================================================ */
.cta{ position:relative; overflow:hidden; padding:clamp(90px,15vh,190px) 0; }
.cta__sky{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.cta__sky::before{ content:""; position:absolute; inset:0;   /* star field */
  background-image:radial-gradient(rgba(236,234,226,.7) 1px, transparent 1.6px);
  background-size:64px 64px; opacity:.22; animation:twinkle 6s ease-in-out infinite; }
.cta__sky::after{ content:""; position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  width:130%; height:62%; background:radial-gradient(ellipse at 50% 100%, rgba(47,230,189,.20), transparent 62%); }
.cta__earth{ position:absolute; left:50%; bottom:-150%; transform:translateX(-50%);
  width:240%; aspect-ratio:1; border-radius:50%;
  background-image:radial-gradient(rgba(236,234,226,.55) 1.2px, transparent 1.7px);
  background-size:21px 21px;
  -webkit-mask:radial-gradient(circle, transparent 47.6%, #000 48.6%, #000 49.9%, transparent 50.2%);
          mask:radial-gradient(circle, transparent 47.6%, #000 48.6%, #000 49.9%, transparent 50.2%);
  box-shadow:0 0 90px 8px rgba(47,230,189,.18); }
@keyframes twinkle{ 0%,100%{ opacity:.16; } 50%{ opacity:.3; } }
.cta__wrap{ position:relative; z-index:2; }
.cta__backed{ font-family:var(--mono); font-size:.82rem; letter-spacing:.05em; color:var(--on-navy-mute); margin-bottom:1.6rem; }
.cta__title{ font-weight:600; letter-spacing:-.025em; line-height:1.12; text-wrap:balance; font-size:clamp(1.65rem,2.5vw,1.95rem); margin-bottom:2.2rem; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{ padding:clamp(54px,8vh,86px) 0 38px; border-top:1px solid var(--hair-light); }
.footer__grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:40px; }
.brand--footer{ margin-bottom:1rem; }
.footer .bm-core,.footer .bm-sat{ fill:var(--accent); } .footer .bm-ring{ stroke:var(--on-navy); }
.footer .brand__word{ color:var(--on-navy); }
.footer__tag{ color:var(--on-navy-mute); font-size:.96rem; }
.footer__col h4{ font-family:var(--mono); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--on-navy-faint); margin-bottom:1rem; font-weight:400; }
.footer__col a{ display:block; color:var(--on-navy-mute); padding:.3em 0; font-size:.96rem; transition:color .25s; }
.footer__col a:hover{ color:var(--accent); }
.footer__col--addr address{ font-style:normal; color:var(--on-navy-mute); line-height:1.7; font-size:.96rem; }
.footer__bottom{ display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-top:clamp(40px,6vh,66px);
  padding-top:24px; border-top:1px solid var(--hair-light); font-family:var(--mono); font-size:.72rem; color:var(--on-navy-faint); }

/* ============================================================
   REVEAL
   ============================================================ */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .85s var(--ease), transform .85s var(--ease); transition-delay:var(--d,0s); }
.reveal.in{ opacity:1; transform:none; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1000px){
  .nav__pod--links, .nav__pod--cta{ display:none; }
  .nav__toggle{ display:flex; }
  .nav__mobile{ display:flex; flex-direction:column; position:absolute; top:84px; left:var(--pad); right:var(--pad);
    background:transparent; border:1px solid transparent; border-radius:16px;
    padding:0 16px; max-height:0; overflow:hidden; transition:max-height .4s var(--ease), padding .4s var(--ease), border-color .2s, background-color .2s; }
  .nav__mobile.open{ max-height:min(78vh,780px); overflow-y:auto; padding:10px 16px 20px;
    background:rgba(241,239,231,.97); backdrop-filter:blur(16px); border-color:var(--hair); box-shadow:0 20px 50px -24px rgba(13,21,36,.5); }
  .nav__mobile a{ padding:13px 4px; border-bottom:1px solid var(--hair); color:var(--ink-body); }
  .nav__mobile a:last-child{ border-bottom:none; }
  .nav__mobile-h{ display:block; font-family:var(--mono); font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mute); padding:14px 4px 4px; }
  .nav__mobile-h--sub{ padding:10px 4px 2px 18px; font-size:.6rem; color:var(--accent-deep); }
  .nav__mobile-sub{ padding-left:18px !important; font-size:.96rem; }
  .nav__mobile-cta{ margin-top:10px; background:var(--navy); color:var(--cream)!important; border-radius:10px; text-align:center; font-weight:600; }
  .nav.open .nav__toggle span:first-child{ transform:translateY(7px) rotate(45deg); }
  .nav.open .nav__toggle span:last-child{ transform:translateY(-7px) rotate(-45deg); }

  .hero{ grid-template-columns:1fr; min-height:auto; padding-top:118px; gap:36px; }
  .hero__stage{ min-height:62vh; }
  .problem__grid, .sol__grid, .research__grid{ grid-template-columns:1fr; }
  .problem__item:nth-child(odd){ border-right:none; }
  .sol__col{ border-right:none; border-bottom:1px solid var(--hair); }
  .trow, .trow--rev .trow__viz{ grid-template-columns:1fr; }
  .trow{ grid-template-columns:1fr; }
  .trow--rev .trow__viz{ order:0; }
  .impact__grid{ grid-template-columns:repeat(2,1fr); }
  .metric:nth-child(2){ border-right:none; }
  .coverage__wrap, .careers__wrap{ grid-template-columns:1fr; }
  .coverage__viz{ max-width:380px; margin:0 auto; }
  .footer__grid{ grid-template-columns:1fr 1fr; gap:32px; }
}
@media (max-width:560px){
  .impact__grid{ grid-template-columns:1fr; } .metric{ border-right:none; border-bottom:1px solid var(--hair-light); }
  .footer__grid{ grid-template-columns:1fr; }
  .research__grid{ gap:32px; }
  .hero__actions .btn{ flex:1; justify-content:center; }
}

@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; }
  .reveal{ opacity:1; transform:none; }
  .bp__surface{ stroke-dashoffset:0; }
  html{ scroll-behavior:auto; }
}