/* =========================================================
   SPECTACLES4THEBLIND SA™
   COMPLETE WEBSITE STYLESHEET
   ========================================================= */

:root{
  --cream:#f5f7ef;
  --cream-2:#eef1e8;
  --ink:#061812;
  --green:#4d9370;
  --green-dark:#08231b;
  --lime:#cfff49;
  --muted:#6d776f;
  --line:#d8ded5;
  --white:#ffffff;
  --dark:#071a14;
  --dark-2:#0b281f;
  --mint:#70dba4;
  --max:1220px;
}


/* =========================================================
   GLOBAL
   ========================================================= */

*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:"DM Sans",sans-serif;
  line-height:1.55;
}

img,
video{
  max-width:100%;
  display:block;
}

a{
  text-decoration:none;
  color:inherit;
}

button,
input,
textarea,
select{
  font:inherit;
}

button{
  -webkit-tap-highlight-color:transparent;
}

.container{
  width:min(var(--max),calc(100% - 48px));
  margin:0 auto;
}

h1,
h2,
h3{
  font-family:"Manrope",sans-serif;
  margin:0;
  letter-spacing:-.045em;
}

h1{
  font-size:clamp(66px,6.4vw,102px);
  line-height:.92;
  font-weight:700;
}

h2{
  font-size:clamp(46px,5vw,76px);
  line-height:.98;
}

h1 em,
h2 em{
  font-style:normal;
  color:var(--green);
}


/* =========================================================
   NAVIGATION
   ========================================================= */

.nav-wrap{
  position:sticky;
  top:0;
  z-index:40;
  padding:22px 0;

  background:linear-gradient(
    to bottom,
    rgba(243,244,236,.96),
    rgba(243,244,236,.78),
    transparent
  );
}

.nav-shell{
  position:relative;
  width:min(var(--max),calc(100% - 48px));
  margin:auto;

  display:flex;
  align-items:center;
  justify-content:space-between;

  padding:16px 20px;

  background:rgba(249,250,245,.96);

  border:1px solid #dde3da;
  border-radius:20px;

  box-shadow:0 18px 45px rgba(20,45,34,.08);
}

.brand{
  display:flex;
  align-items:center;
  gap:11px;

  font-weight:800;
}

.brand img{
  width:34px;
  height:34px;

  object-fit:contain;

  border-radius:7px;
}

.brand sup{
  font-size:8px;
  vertical-align:top;
  margin-left:2px;
}

nav{
  display:flex;
  align-items:center;
  gap:28px;
}

nav a{
  font-size:14px;
  font-weight:600;

  color:#34453f;
}

nav a:hover{
  color:var(--green);
}

.nav-cta{
  background:#041711;
  color:white;

  padding:12px 18px;

  border-radius:13px;
}

.nav-cta span{
  font-size:18px;
  margin-left:8px;
}

.menu-toggle{
  display:none;
}


/* =========================================================
   BUTTONS
   ========================================================= */

.btn{
  border:0;

  cursor:pointer;

  border-radius:13px;

  padding:14px 20px;

  font-weight:800;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;

  transition:
    transform .18s ease,
    background .18s ease,
    border-color .18s ease;
}

.btn:hover{
  transform:translateY(-1px);
}

.btn-dark{
  background:#041711;
  color:white;
}

.btn-light{
  background:transparent;

  color:var(--ink);

  border:1px solid #cfd6cc;
}

.btn-cream{
  background:#dfe9dc;
  color:#0d2b23;
}

.btn-outline-light{
  background:transparent;

  border:1px solid #cad3c7;

  color:var(--ink);
}

.play{
  font-size:12px;
}


/* =========================================================
   EYEBROWS
   ========================================================= */

.eyebrow{
  display:flex;
  align-items:center;
  gap:10px;

  text-transform:uppercase;

  letter-spacing:.18em;

  font-size:11px;
  font-weight:800;

  color:#2f7358;
}

.eyebrow>span{
  display:inline-block;

  width:20px;
  height:2px;

  background:currentColor;
}

.eyebrow.light{
  color:#8ac3a7;
}

.eyebrow.plain{
  display:block;
}

.eyebrow.plain::before{
  display:none;
}


/* =========================================================
   HERO
   ========================================================= */

.hero{
  display:grid;

  grid-template-columns:1.08fr .92fr;

  gap:70px;

  align-items:center;

  padding-top:82px;
  padding-bottom:90px;
}

.lead{
  font-size:20px;

  max-width:670px;

  margin:30px 0 0;

  color:#2e463d;
}

.hero-copy .lead{
  color:#274139;
}

.hero-actions{
  display:flex;
  gap:12px;

  margin:34px 0 28px;

  flex-wrap:wrap;
}

.proof-row{
  display:flex;

  gap:22px;

  flex-wrap:wrap;

  font-size:12px;
  color:#426f5c;

  font-weight:700;

  margin:28px 0 32px;
}

.proof-row span::first-letter{
  color:var(--green);
}

.metrics{
  display:grid;

  grid-template-columns:repeat(3,1fr);

  border-top:1px solid #d5dcd2;

  padding-top:22px;
}

.metrics>div{
  padding-right:18px;
}

.metrics strong{
  display:block;

  font-size:18px;
}

.metrics small{
  display:block;

  color:#8c948f;

  font-size:9px;

  letter-spacing:.08em;

  margin-top:2px;
}


/* =========================================================
   HERO VIDEO
   ========================================================= */

.video-card{
  position:relative;

  aspect-ratio:1 / 1.04;

  min-height:0;

  border-radius:34px;

  overflow:hidden;

  background:#1c2a26;

  box-shadow:0 28px 60px rgba(11,38,28,.14);
}

.video-card video{
  position:absolute;

  inset:0;

  width:100%;
  height:100%;

  min-height:0;

  object-fit:cover;

  background:#0d1714;
}

.video-card::after{
  content:"";

  position:absolute;

  inset:0;

  pointer-events:none;

  background:linear-gradient(
    to top,
    rgba(0,0,0,.66),
    rgba(0,0,0,.03) 55%
  );
}

.video-card video::-webkit-media-controls-panel{
  opacity:.92;
}

.video-badge{
  position:absolute;

  z-index:2;

  top:22px;
  left:22px;

  border:1px solid rgba(126,223,180,.35);

  background:rgba(7,25,21,.72);

  color:#a5dfc3;

  padding:8px 12px;

  border-radius:999px;

  font-size:9px;

  letter-spacing:.13em;

  font-weight:800;
}

.video-overlay{
  position:absolute;

  z-index:3;

  left:24px;
  right:24px;
  bottom:30px;

  color:white;
}

.video-overlay span{
  color:#7ee0ab;

  font-size:9px;

  letter-spacing:.14em;

  font-weight:800;
}

.video-overlay h3{
  font-size:24px;

  max-width:460px;

  margin-top:8px;

  line-height:1.12;
}


/* =========================================================
   GENERIC SECTIONS
   ========================================================= */

.section{
  padding-top:105px;
  padding-bottom:105px;
}

.section-grid{
  display:grid;

  grid-template-columns:1fr 1fr;

  gap:80px;

  margin-top:24px;
}

.section p{
  color:#4a5b54;

  font-size:17px;
}

.soft-card{
  margin-top:28px;

  background:#e8ece4;

  border-radius:22px;

  padding:24px;
}

.soft-card small,
.line-card small,
.vision-grid small{
  font-size:9px;

  letter-spacing:.12em;

  color:#4e7865;

  font-weight:800;
}

.soft-card span{
  color:var(--green);
}

.max-title{
  max-width:900px;

  margin-top:18px;
}

.section-intro{
  max-width:820px;
}


/* =========================================================
   HUMAN PROBLEM
   ========================================================= */

.problem-section{
  padding-top:70px;
}

.problem-shell{
  display:grid;

  grid-template-columns:1.55fr .95fr;

  background:white;

  border-radius:30px;

  overflow:hidden;

  box-shadow:0 24px 60px rgba(23,49,39,.07);
}

.problem-copy{
  padding:58px 58px 62px;
}

.problem-copy h2{
  margin:22px 0 24px;

  font-size:clamp(52px,5vw,80px);
}

.problem-copy h2 em{
  color:var(--green);
}

.problem-copy p{
  max-width:720px;

  font-size:18px;
}

.problem-role{
  background:#051912;

  padding:58px;

  display:flex;

  flex-direction:column;

  justify-content:center;
}

.problem-role small{
  color:#7fb39d;

  font-size:10px;

  letter-spacing:.13em;

  font-weight:800;
}

.problem-role h3{
  color:var(--lime);

  font-size:30px;

  line-height:1.25;

  margin:28px 0 20px;
}

.problem-role p{
  color:#a9bcb3;

  font-size:14px;
}


/* =========================================================
   SYSTEM / HOW IT THINKS
   ========================================================= */

.system-head{
  display:grid;

  grid-template-columns:1fr 1fr;

  gap:80px;

  align-items:end;

  margin:24px 0 42px;
}

.system-head h2{
  font-size:clamp(42px,4.5vw,68px);
}

.system-head p{
  font-size:18px;

  color:#6d776f;
}

.system-card{
  display:grid;

  grid-template-columns:repeat(4,1fr);

  background:white;

  border:1px solid #d8ded5;

  border-radius:28px;

  overflow:hidden;
}

.system-card article{
  min-height:285px;

  padding:30px 28px;

  position:relative;

  border-right:1px solid #dfe4dc;
}

.system-card article:last-child{
  border-right:0;
}

.system-number{
  position:absolute;

  right:22px;
  top:20px;

  font-size:11px;

  color:#9b9f99;

  font-weight:800;
}

.system-icon{
  color:var(--green);

  font-size:30px;

  margin-top:40px;
}

.system-svg-icon{
  width:40px;
  height:40px;

  display:flex;

  align-items:center;
  justify-content:center;

  color:var(--green);
}

.system-svg-icon svg{
  width:34px;
  height:34px;

  fill:none;

  stroke:currentColor;

  stroke-width:2.4;

  stroke-linecap:round;
  stroke-linejoin:round;
}

.system-card h3{
  font-size:25px;

  margin:28px 0 10px;
}

.system-card p{
  font-size:14px;

  color:#707973;
}


/* =========================================================
   PRODUCT EXPERIENCE / JOURNEY
   NEW LIGHT + DARK SPLIT DESIGN
   ========================================================= */

.journey{
  background:var(--cream);

  color:var(--ink);
}

.journey .container{
  padding-top:105px;
  padding-bottom:105px;
}

.journey .eyebrow.light{
  color:#4d9370;
}

.journey-head{
  display:grid;

  grid-template-columns:1fr .78fr;

  gap:80px;

  align-items:end;

  margin-bottom:52px;
}

.journey h2{
  color:var(--ink);

  font-size:clamp(58px,6vw,92px);

  line-height:.94;

  letter-spacing:-.055em;
}

.journey h2 em{
  color:#78a98d;

  font-style:normal;
}

.journey-head p{
  color:#56675f;

  font-size:18px;

  line-height:1.65;

  max-width:520px;

  margin:0 0 8px;
}


/* Journey main shell */

.experience-grid{
  display:grid;

  grid-template-columns:.9fr 1.5fr;

  gap:0;

  margin-top:0;

  background:#ffffff;

  border:1px solid #d8ded5;

  border-radius:32px;

  overflow:hidden;

  min-height:610px;

  box-shadow:0 24px 60px rgba(13,31,25,.06);
}


/* =========================================================
   JOURNEY — LEFT PANEL
   ========================================================= */

.selector-panel{
  background:#ffffff;

  border:0;

  border-radius:0;

  padding:38px 36px 42px;

  color:#061812;
}

.selector-panel label{
  display:block;

  margin:0 0 16px;

  color:#53655d;

  font-size:12px;

  font-weight:800;

  letter-spacing:.16em;

  text-transform:uppercase;
}


/* Moment cards */

.moment{
  width:100%;

  min-height:74px;

  display:grid;

  grid-template-columns:48px 1fr 28px;

  align-items:center;

  gap:10px;

  padding:15px 18px;

  margin-bottom:10px;

  text-align:left;

  background:#f4f5f0;

  color:#061812;

  border:1px solid transparent;

  border-radius:17px;

  cursor:pointer;

  transition:
    background .2s ease,
    border-color .2s ease,
    transform .2s ease,
    box-shadow .2s ease;
}

.moment:hover{
  transform:translateY(-1px);

  background:#edf3ed;
}

.moment.active{
  background:#e1f8ee;

  border-color:#b4dfcc;

  box-shadow:none;
}

.moment b{
  color:#38805f;

  font-size:13px;

  font-weight:800;
}

.moment span{
  color:#061812;

  font-size:16px;

  font-weight:800;
}

.moment small{
  display:block;

  margin-top:2px;

  color:#74827b;

  font-size:11px;

  font-weight:500;
}

.moment::after{
  content:"›";

  justify-self:end;

  color:#061812;

  font-size:30px;

  line-height:1;

  font-weight:400;
}


/* =========================================================
   JOURNEY — LANGUAGE SELECTOR
   ========================================================= */

.lang-label{
  margin-top:38px!important;
}

.lang-chips{
  display:flex;

  flex-wrap:wrap;

  gap:8px;
}

.lang-chips button{
  background:#ffffff;

  color:#061812;

  border:1px solid #d4dbd5;

  border-radius:10px;

  padding:10px 15px;

  font-size:13px;

  font-weight:800;

  cursor:pointer;

  transition:
    background .18s ease,
    color .18s ease,
    border-color .18s ease,
    transform .18s ease;
}

.lang-chips button:hover{
  border-color:#7aa58f;

  transform:translateY(-1px);
}

.lang-chips button.active{
  background:#071d17;

  color:#ffffff;

  border-color:#071d17;
}

.lang-chips button:focus-visible{
  outline:3px solid rgba(77,147,112,.25);

  outline-offset:2px;
}

.roadmap{
  position:relative;

  display:block;

  margin-top:17px;

  padding-left:25px;

  color:#708078;

  font-size:11px;

  line-height:1.5;
}

.roadmap::before{
  content:"✣";

  position:absolute;

  left:0;
  top:-1px;

  color:#46946e;

  font-size:17px;
}


/* =========================================================
   JOURNEY — RIGHT SIMULATION PANEL
   ========================================================= */

.sim-card{
  position:relative;

  background:
    radial-gradient(
      circle at 100% 100%,
      rgba(71,145,108,.12),
      transparent 42%
    ),
    linear-gradient(
      145deg,
      #061a14 0%,
      #08231b 55%,
      #0b2b21 100%
    );

  color:#ffffff;

  border-radius:0;

  padding:48px 50px 42px;

  display:flex;

  flex-direction:column;

  min-width:0;
}

.sim-top{
  display:flex;

  justify-content:space-between;

  align-items:center;

  color:#69d99f;

  font-size:10px;

  font-weight:800;

  letter-spacing:.14em;

  text-transform:uppercase;
}

.sim-top span:last-child{
  position:relative;

  padding-left:19px;

  color:#b6d6c6;
}

.sim-top span:last-child::before{
  content:"";

  position:absolute;

  left:0;

  top:50%;

  width:8px;
  height:8px;

  transform:translateY(-50%);

  background:#69d99f;

  border-radius:50%;

  box-shadow:
    0 0 0 5px rgba(105,217,159,.05),
    0 0 12px rgba(105,217,159,.85);
}

.sim-card h3{
  color:#ffffff;

  font-size:44px;

  line-height:1.05;

  margin:22px 0 18px;

  letter-spacing:-.045em;
}

.sim-card > p:not(.status){
  color:#b6c9bf;

  font-size:16px;

  line-height:1.6;

  max-width:680px;

  margin:0 0 20px;
}


/* =========================================================
   JOURNEY — GUIDANCE TIMELINE
   ========================================================= */

.timeline{
  display:grid;

  gap:8px;

  margin:18px 0 34px;
}

.timeline div{
  position:relative;

  display:flex;

  align-items:center;

  gap:18px;

  min-height:64px;

  padding:13px 18px;

  border:1px solid transparent;

  color:#789086;

  font-size:17px;

  border-radius:14px;

  transition:
    background .25s ease,
    border-color .25s ease,
    color .25s ease,
    opacity .25s ease;
}

.timeline div.is-active{
  background:rgba(255,255,255,.085);

  border-color:rgba(255,255,255,.10);

  color:#ffffff;

  font-weight:700;
}

.timeline i{
  flex:0 0 auto;

  width:34px;
  height:34px;

  display:grid;

  place-items:center;

  background:transparent;

  border:1px solid #36554a;

  border-radius:50%;

  color:#7d9c8e;

  font-size:12px;

  font-weight:500;

  font-style:normal;
}

.timeline div.is-active i{
  background:#6bd99f;

  border-color:#6bd99f;

  color:#073022;

  font-weight:800;
}

.timeline div.is-active::after{
  content:"◖))";

  margin-left:auto;

  color:#6bd99f;

  font-size:15px;

  font-weight:800;
}


/* =========================================================
   JOURNEY — ACTION BUTTONS
   ========================================================= */

.sim-actions{
  display:flex;

  align-items:center;

  gap:12px;

  margin-top:auto;

  padding-top:14px;
}

#play-journey,
#hear-prompt{
  cursor:pointer;
}

#play-journey{
  background:#70dba4;

  color:#041a12;

  border:1px solid #70dba4;

  border-radius:13px;

  min-height:52px;

  padding:14px 24px;

  font-size:15px;

  font-weight:800;

  transition:
    transform .18s ease,
    background .18s ease;
}

#play-journey:hover{
  background:#83e5b3;

  transform:translateY(-1px);
}

#hear-prompt{
  background:transparent;

  color:#ffffff;

  border:1px solid #355448;

  border-radius:13px;

  min-height:52px;

  padding:14px 23px;

  font-size:15px;

  font-weight:800;

  transition:
    background .18s ease,
    border-color .18s ease,
    transform .18s ease;
}

#hear-prompt:hover{
  background:rgba(255,255,255,.05);

  border-color:#648778;

  transform:translateY(-1px);
}

#play-journey:focus-visible,
#hear-prompt:focus-visible{
  outline:3px solid rgba(112,219,164,.35);

  outline-offset:3px;
}

.sim-card .status,
.status{
  min-height:20px;

  color:#75cda3;

  font-size:11px;

  font-weight:600;
}


/* Old journey capability pills aren't needed */

.journey .capability-tags{
  display:none;
}


/* =========================================================
   PROCESS / ROADMAP / GENERIC CARDS
   ========================================================= */

.process-grid{
  display:grid;

  grid-template-columns:repeat(4,1fr);

  gap:14px;

  margin-top:46px;
}

.process-grid article{
  border-top:1px solid #cbd4c9;

  padding-top:20px;
}

.process-grid b,
.roadmap-grid b{
  color:var(--green);

  font-size:12px;
}

.process-grid h3,
.roadmap-grid h3{
  font-size:26px;

  margin:18px 0 10px;
}

.process-grid p,
.roadmap-grid p{
  font-size:14px;
}

.split-three{
  display:grid;

  grid-template-columns:1.1fr 1fr 1fr;

  gap:30px;
}

.line-card{
  border-top:1px solid #cbd4c9;

  padding-top:20px;
}

.clean-list{
  padding-left:18px;

  color:#4d5f57;
}

.clean-list li{
  margin:8px 0;
}


/* =========================================================
   ABOUT
   ========================================================= */

.about-grid{
  display:grid;

  grid-template-columns:.75fr 1.25fr;

  gap:70px;

  align-items:center;
}

.logo-panel{
  min-height:360px;

  background:#e8ece4;

  border-radius:34px;

  display:grid;

  place-items:center;
}

.logo-panel img{
  width:150px;
}

.vision-grid{
  display:grid;

  grid-template-columns:repeat(3,1fr);

  gap:22px;

  margin-top:55px;
}

.vision-grid article{
  border-top:1px solid #cbd4c9;

  padding-top:18px;
}

.vision-grid h3{
  font-size:23px;

  line-height:1.15;

  margin:16px 0 10px;
}


/* =========================================================
   FOUNDER
   ========================================================= */

.founder{
  display:grid;

  grid-template-columns:.85fr 1.15fr;

  gap:65px;

  align-items:center;
}

.founder-img img{
  width:100%;

  aspect-ratio:4/5;

  object-fit:cover;

  border-radius:30px;
}

.role{
  font-weight:700;

  color:#5b7168!important;
}

blockquote{
  font-family:"Manrope";

  font-size:clamp(28px,3vw,45px);

  line-height:1.2;

  margin:28px 0 0;

  color:#19372d;
}


/* =========================================================
   FOUNDER MEDIA
   ========================================================= */

.founder-media{
  display:grid;

  grid-template-columns:.92fr 1.08fr;

  gap:0;

  background:var(--dark);

  border-radius:34px;

  overflow:hidden;

  padding:0;

  margin-top:105px;
  margin-bottom:105px;
}

.founder-story{
  min-width:0;
}

.founder-photo-wrap{
  min-height:520px;

  position:relative;

  overflow:hidden;

  height:100%;
}

.founder-photo-wrap>img{
  position:absolute;

  inset:0;

  width:100%;
  height:100%;

  object-fit:cover;

  filter:saturate(.9) brightness(.58);
}

.founder-photo-wrap::after{
  content:"";

  position:absolute;

  inset:0;

  background:linear-gradient(
    to top,
    rgba(5,25,20,.92),
    rgba(5,25,20,.18) 60%
  );
}

.founder-photo-copy{
  position:absolute;

  z-index:2;

  left:38px;
  right:38px;
  bottom:34px;

  color:white;
}

.founder-photo-copy h2{
  color:white;

  font-size:42px;

  margin-top:10px;
}

.role-light{
  color:#a7c1b5!important;

  text-transform:uppercase;

  letter-spacing:.08em;

  font-size:10px!important;

  font-weight:800;
}

.founder-photo-copy blockquote{
  color:#edf5f0;

  font-size:20px;

  line-height:1.35;

  margin-top:26px;

  max-width:650px;
}

.founder-video-side{
  padding:38px;

  display:flex;

  flex-direction:column;

  justify-content:center;

  background:#0d3027;
}

.founder-video-side video{
  width:100%;

  aspect-ratio:16/9;

  object-fit:cover;

  background:#071914;

  border-radius:18px;
}

.media-caption{
  display:flex;

  gap:18px;

  align-items:center;

  margin-top:18px;
}

.media-caption span{
  color:#7ee0ab;

  font-size:10px;

  font-weight:800;

  letter-spacing:.12em;

  white-space:nowrap;
}

.media-caption p{
  color:#9eb9ad!important;

  font-size:12px!important;

  margin:0;
}


/* =========================================================
   CONCEPT FILM
   ========================================================= */

.concept-card{
  height:420px;

  margin-top:36px;

  border-radius:34px;

  background:radial-gradient(
    circle at 50% 40%,
    #66766e,
    #243a32 65%,
    #0d261f
  );

  position:relative;

  overflow:hidden;
}

.concept-badge{
  position:absolute;

  top:22px;
  left:22px;

  background:rgba(7,25,21,.75);

  color:#b8ddca;

  padding:8px 11px;

  border-radius:999px;

  font-size:9px;

  letter-spacing:.12em;
}

.concept-copy{
  position:absolute;

  left:28px;
  bottom:28px;

  color:white;

  font-size:22px;

  font-weight:700;
}

.concept-film-section{
  padding-top:90px;
}

.concept-film-head{
  display:grid;

  grid-template-columns:1.35fr .65fr;

  gap:70px;

  align-items:end;

  margin-top:20px;
}

.concept-film-head h2{
  font-size:clamp(48px,5vw,78px);
}

.concept-film-head p{
  max-width:850px;
}

.concept-note{
  border-left:1px solid #ccd5ca;

  padding-left:24px;
}

.concept-note span{
  color:#477e65;

  font-size:10px;

  font-weight:800;

  letter-spacing:.13em;
}

.concept-note p{
  font-size:13px;
}

.concept-film-card{
  margin-top:38px;

  background:#102a21;

  border-radius:30px;

  overflow:hidden;

  box-shadow:0 28px 60px rgba(15,42,31,.10);
}

.concept-film-card video{
  width:100%;

  aspect-ratio:16/9;

  display:block;

  object-fit:cover;

  background:#071914;
}


/* =========================================================
   MEDIA SHOWCASE
   ========================================================= */

.media-showcase{
  display:grid;

  grid-template-columns:1.15fr .85fr .85fr;

  gap:18px;

  margin-top:42px;

  align-items:start;
}

.media-feature{
  background:white;

  border:1px solid #dfe4dc;

  border-radius:24px;

  padding:16px;

  min-width:0;

  box-shadow:0 16px 38px rgba(25,46,38,.05);
}

.media-feature:first-child{
  grid-row:span 2;
}

.media-label{
  font-size:9px;

  font-weight:800;

  letter-spacing:.13em;

  color:#39765a;

  margin:5px 4px 13px;
}

.media-feature video,
.youtube-wrap{
  width:100%;

  aspect-ratio:16/9;

  border-radius:16px;

  overflow:hidden;

  background:#0c211a;
}

.media-feature video{
  display:block;

  object-fit:cover;
}

.youtube-wrap iframe{
  width:100%;
  height:100%;

  border:0;

  display:block;
}

.media-feature h3{
  color:var(--ink);

  font-size:23px;

  margin:18px 4px 5px;
}

.media-feature p{
  margin:0 4px 8px;

  font-size:14px;
}


/* =========================================================
   GLOBAL EXPOSURE · LEAP EAST HONG KONG
   ========================================================= */

.global-exposure-section{
  padding-top:34px;
}

.global-exposure-shell{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:0;
  overflow:hidden;
  min-height:560px;
  background:#071a14;
  border:1px solid #173c30;
  border-radius:32px;
  box-shadow:0 28px 70px rgba(8,31,23,.10);
}

.global-exposure-copy{
  padding:58px 60px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.global-exposure-copy h2{
  color:#fff;
  margin:20px 0 24px;
  font-size:clamp(46px,4.7vw,72px);
}

.global-exposure-copy h2 em{
  color:#8fc7a9;
}

.global-exposure-copy p{
  color:#adc1b7;
  max-width:680px;
  margin:0;
}

.global-exposure-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:30px;
}

.global-exposure-tags span{
  border:1px solid #31594b;
  color:#b7d2c5;
  border-radius:999px;
  padding:8px 12px;
  font-size:11px;
  font-weight:700;
}

.global-exposure-video{
  position:relative;
  min-height:560px;
  display:grid;
  place-items:center;
  padding:34px;
  background:radial-gradient(circle at 50% 30%,#1b4a39,#0b281f 62%,#071a14);
}

.global-exposure-video video{
  width:min(100%,315px);
  max-height:500px;
  aspect-ratio:9/16;
  object-fit:cover;
  border-radius:24px;
  background:#04120e;
  box-shadow:0 24px 55px rgba(0,0,0,.28);
}

.global-exposure-video small{
  position:absolute;
  left:28px;
  bottom:24px;
  color:#84c8a8;
  letter-spacing:.12em;
  font-size:9px;
  font-weight:800;
}


/* =========================================================
   MOMENTUM
   ========================================================= */

.momentum,
.partner{
  background:var(--dark);

  color:#f5f5ef;
}

.momentum .container,
.partner .container{
  padding-top:105px;
  padding-bottom:105px;
}

.momentum h2,
.partner h2{
  color:white;
}

.momentum h2 em,
.partner h2 em{
  color:#8fc7a9;
}

.light-copy,
.partner p{
  color:#b9cbc3;
}

.light-quote{
  color:#dfe9e3;

  max-width:950px;
}

.muted-light{
  color:#90aa9f;
}

.momentum-grid{
  display:grid;

  grid-template-columns:repeat(4,1fr);

  border-top:1px solid #2f5045;

  margin-top:40px;

  padding-top:24px;
}

.momentum-grid strong{
  display:block;

  color:white;

  font-size:27px;
}

.momentum-grid span{
  color:#8eaa9e;

  font-size:13px;
}


/* =========================================================
   GENERIC TABS
   ========================================================= */

.tabs{
  display:flex;

  gap:8px;

  margin:32px 0 16px;
}

.tabs button{
  border:1px solid #cad2c8;

  background:transparent;

  color:#294039;

  border-radius:999px;

  padding:10px 14px;

  font-weight:700;

  cursor:pointer;
}

.tabs button.active{
  background:var(--ink);

  color:white;
}

.tab-content{
  background:#e8ece4;

  border-radius:24px;

  padding:28px;
}

.tab-content .three{
  display:grid;

  grid-template-columns:repeat(3,1fr);

  gap:18px;

  margin-top:20px;
}

.tab-content .three div{
  border-top:1px solid #c7d0c6;

  padding-top:18px;
}


/* =========================================================
   ROADMAP
   ========================================================= */

.roadmap-grid{
  display:grid;

  grid-template-columns:repeat(4,1fr);

  gap:18px;

  margin-top:42px;
}

.roadmap-grid article{
  border-top:1px solid #cbd4c9;

  padding-top:20px;
}


/* =========================================================
   FUNDING
   ========================================================= */

.funding-grid{
  display:grid;

  grid-template-columns:1fr 1fr;

  gap:20px;

  margin:32px 0;
}

.funding-grid>div{
  background:#e7ebe3;

  border-radius:22px;

  padding:26px;
}

.funding-grid strong{
  display:block;

  font-size:42px;
}

.funding-grid span{
  color:#69766f;
}


/* =========================================================
   TEAM
   ========================================================= */

.team-grid{
  display:grid;

  grid-template-columns:repeat(3,1fr);

  gap:24px;

  margin-top:45px;
}

.team-card{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(8,35,27,.10);
  border-radius:26px;
  background:rgba(255,255,255,.44);
  box-shadow:0 16px 42px rgba(7,26,20,.055);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.team-card:hover{
  transform:translateY(-4px);
  border-color:rgba(47,117,88,.28);
  box-shadow:0 24px 55px rgba(7,26,20,.10);
}

.team-grid img{
  width:100%;

  aspect-ratio:4/5;

  object-fit:cover;

  background:#e6e9e1;
}

.team-photo-nick{
  object-position:48% 28%;
}

.team-card-copy{
  padding:19px 20px 22px;
}

.team-grid h3{
  font-size:23px;

  margin:0 0 4px;
}

.team-grid p{
  margin:0!important;

  font-weight:700;

  color:#3e554b!important;
}

.team-grid small{
  display:block;
  margin-top:8px;
  color:#7a8781;
  line-height:1.55;
}

.team-card-featured{
  border-color:rgba(47,117,88,.35);
  background:#edf3e9;
}

.team-new{
  display:inline-flex;
  margin-bottom:10px;
  padding:5px 8px;
  border-radius:999px;
  background:#0b2d23;
  color:#eff8f0;
  font-size:10px;
  font-weight:800;
  letter-spacing:.09em;
}


/* =========================================================
   INTEGRATED EXECUTION
   ========================================================= */

.integration-section{
  background:var(--dark);
  color:var(--white);
}

.integration-shell{
  padding-top:105px;
  padding-bottom:105px;
}

.integration-head{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(300px,.65fr);
  gap:64px;
  align-items:end;
}

.integration-head h2 em{
  color:var(--mint);
}

.integration-head > p{
  margin:0;
  color:#b7ccc2;
  font-size:17px;
  line-height:1.75;
}

.integration-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin-top:52px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:26px;
  overflow:hidden;
}

.integration-grid article{
  min-height:260px;
  padding:28px;
  border-right:1px solid rgba(255,255,255,.12);
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.015));
}

.integration-grid article:last-child{
  border-right:0;
}

.integration-grid span{
  display:inline-grid;
  place-items:center;
  width:38px;
  height:38px;
  margin-bottom:36px;
  border:1px solid rgba(112,219,164,.42);
  border-radius:50%;
  color:var(--mint);
  font-size:11px;
  font-weight:800;
}

.integration-grid h3{
  margin-bottom:12px;
  font-size:24px;
  letter-spacing:-.03em;
}

.integration-grid p{
  margin:0;
  color:#adc2b8;
  line-height:1.65;
}

.integration-route{
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;
  gap:16px;
  align-items:center;
  margin-top:28px;
  padding:22px 24px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:22px;
  background:#0c261e;
}

.integration-route div{
  display:grid;
  gap:4px;
}

.integration-route small{
  color:var(--mint);
  font-size:10px;
  font-weight:800;
  letter-spacing:.11em;
}

.integration-route strong{
  font-family:"Manrope",sans-serif;
  font-size:15px;
}

.integration-route b{
  color:#6e8e80;
  font-size:20px;
}

.integration-note{
  max-width:980px;
  margin:28px 0 0;
  padding-left:18px;
  border-left:3px solid var(--mint);
  color:#b7ccc2;
  line-height:1.7;
}

.integration-note strong{
  color:#fff;
}


/* =========================================================
   RECOGNITION
   ========================================================= */

.recognition-grid{
  display:grid;

  grid-template-columns:repeat(3,1fr);

  gap:24px;

  margin-top:38px;
}

.recognition-grid article{
  border-top:1px solid #cbd4c9;

  padding-top:20px;
}

.recognition-grid b{
  color:var(--green);
}

.recognition-grid h3{
  font-size:24px;

  margin:15px 0 6px;
}


/* =========================================================
   PARTNER FORM
   ========================================================= */

.partner-grid{
  display:grid;

  grid-template-columns:1fr 1fr;

  gap:70px;
}

form{
  display:grid;

  grid-template-columns:1fr 1fr;

  gap:16px;
}

label{
  display:grid;

  gap:8px;

  color:#d4e0da;

  font-size:12px;

  font-weight:700;
}

input,
textarea,
select{
  width:100%;

  border:1px solid #376052;

  background:#103229;

  color:white;

  border-radius:12px;

  padding:13px 14px;

  outline:none;
}

input:focus,
textarea:focus,
select:focus{
  border-color:#8fc7a9;
}

.full{
  grid-column:1/-1;
}


/* =========================================================
   CAPABILITY SECTION
   ========================================================= */

.capability-section{
  padding-top:40px;
}

.capability-shell{
  position:relative;

  background:#fff;

  border:1px solid var(--line);

  border-radius:28px;

  overflow:hidden;
}

.capability-tabs{
  position:relative;

  z-index:2;

  display:grid;

  grid-template-columns:repeat(4,1fr);

  border-bottom:1px solid var(--line);
}

.cap-tab{
  position:relative;

  z-index:2;

  border:0;

  border-right:1px solid var(--line);

  background:#fff;

  padding:24px 18px;

  font-weight:800;

  color:var(--ink);

  font-size:15px;

  cursor:pointer;

  pointer-events:auto!important;

  user-select:none;

  touch-action:manipulation;
}

.cap-tab:last-child{
  border-right:0;
}

.cap-tab.active{
  color:var(--green);
}

.cap-tab.active::after{
  content:"";

  position:absolute;

  left:0;
  right:0;
  bottom:0;

  height:3px;

  background:var(--green);
}

.cap-tab:hover{
  cursor:pointer;

  background:#fbfcf8;
}

.cap-tab:focus-visible{
  outline:3px solid rgba(77,147,112,.35);

  outline-offset:-3px;
}

.capability-focus{
  display:grid;

  grid-template-columns:70px 1.2fr .9fr;

  gap:28px;

  align-items:start;

  padding:46px 44px 42px;
}

.capability-symbol{
  width:58px;
  height:58px;

  border-radius:18px;

  background:#e8fbf3;

  color:var(--green);

  display:grid;

  place-items:center;

  font-size:28px;

  font-weight:800;
}

.capability-copy h3{
  font-size:30px;

  margin:12px 0 10px;
}

.capability-copy p{
  font-size:17px;

  max-width:620px;
}

.capability-points{
  list-style:none;

  padding:0;

  margin:0;
}

.capability-points li{
  margin:0 0 16px;

  color:#5f6d66;
}

.capability-points li::before{
  content:"✓";

  color:var(--green);

  font-weight:900;

  margin-right:12px;
}


/* =========================================================
   SOFTWARE PROOF / ENGINEERING NEXT
   ========================================================= */

.proof-engineering-grid{
  display:grid;

  grid-template-columns:1fr 1fr;

  gap:18px;

  margin-top:24px;
}

.proof-card,
.engineering-card{
  border-radius:28px;

  padding:38px 40px;
}

.proof-card{
  background:#e8fbf3;

  border:1px solid #c7eadc;
}

.engineering-card{
  background:#143129;

  color:white;
}

.card-kicker{
  text-transform:uppercase;

  letter-spacing:.12em;

  font-size:10px;

  font-weight:800;

  color:#377b5f;
}

.engineering-card .card-kicker{
  color:#67dda0;
}

.proof-card h3,
.engineering-card h3{
  font-size:30px;

  margin:22px 0;
}

.engineering-card h3{
  color:white;
}

.proof-card ul,
.engineering-card ul{
  padding-left:20px;

  line-height:2;
}

.proof-card li{
  color:#486258;
}

.engineering-card li{
  color:#b7ccc2;
}

.engineering-card li::marker{
  color:#67dda0;
}

.evidence-strip{
  margin-top:18px;

  background:#fff4db;

  border-radius:20px;

  padding:19px 24px;

  color:#705020;

  display:flex;

  gap:8px;

  flex-wrap:wrap;

  font-size:13px;
}


/* =========================================================
   MARKET / COMMERCIAL PATHWAY
   ========================================================= */

.market-section{
  background:#04130f;

  padding:90px 0;
}

.market-shell{
  position:relative;

  background:#0f281f;

  border:1px solid #244138;

  border-radius:34px;

  padding:46px 48px;
}

.market-header{
  display:flex;

  justify-content:space-between;

  align-items:end;

  gap:32px;
}

.market-header h2{
  color:#fff;

  font-size:clamp(48px,5vw,78px);

  margin-top:16px;
}

.market-tabs{
  position:relative;

  z-index:2;

  display:flex;

  background:#1c352c;

  border-radius:16px;

  padding:6px;

  gap:4px;

  flex-shrink:0;
}

.market-tab{
  position:relative;

  z-index:2;

  border:0;

  background:transparent;

  color:#94aa9f;

  padding:12px 17px;

  border-radius:11px;

  font-weight:800;

  cursor:pointer;

  pointer-events:auto!important;

  user-select:none;

  touch-action:manipulation;
}

.market-tab.active{
  background:#6cdea0;

  color:#08231b;
}

.market-tab:hover{
  cursor:pointer;

  color:white;
}

.market-tab:focus-visible{
  outline:3px solid rgba(77,147,112,.35);

  outline-offset:-3px;
}

.market-panel{
  margin-top:38px;

  background:var(--cream);

  border-radius:24px;

  padding:32px;
}

.market-panel-head{
  display:grid;

  grid-template-columns:1fr 1fr;

  gap:44px;

  align-items:start;
}

.market-panel-head h3{
  font-size:28px;
}

.market-panel-head p{
  margin:0;

  color:#66716b;
}

.market-cards{
  display:grid;

  grid-template-columns:repeat(3,1fr);

  gap:14px;

  margin-top:28px;
}

.market-cards article{
  background:#fff;

  border:1px solid #d8ded5;

  border-radius:16px;

  padding:23px;
}

.market-cards article>span{
  color:var(--green);

  font-size:23px;
}

.market-cards h4{
  font-size:18px;

  margin:15px 0 8px;
}

.market-cards p{
  font-size:13px;

  color:#6d776f;
}

.market-route{
  display:flex;

  justify-content:center;

  gap:22px;

  align-items:center;

  color:#99aea4;

  text-transform:uppercase;

  letter-spacing:.1em;

  font-size:9px;

  font-weight:800;

  margin-top:28px;
}

.market-route b{
  color:#67dda0;

  font-size:20px;
}


/* =========================================================
   PUBLIC TRACTION
   ========================================================= */

.traction-head{
  display:grid;

  grid-template-columns:.8fr 1.2fr;

  gap:70px;

  align-items:end;
}

.traction-grid{
  display:grid;

  grid-template-columns:repeat(4,1fr);

  gap:14px;

  margin-top:34px;
}

.traction-grid article{
  background:#fff;

  border:1px solid var(--line);

  border-radius:20px;

  padding:24px;
}

.traction-grid article>span{
  font-size:9px;

  letter-spacing:.14em;

  color:var(--green);

  font-weight:900;
}

.traction-grid h3{
  font-size:22px;

  margin:18px 0 8px;
}

.traction-grid p{
  font-size:13px;
}

.text-link{
  display:inline-block;

  margin-top:10px;

  color:var(--green);

  font-weight:800;

  font-size:13px;
}


/* =========================================================
   IP / TECHNOLOGY PROTECTION
   ========================================================= */

.ip-section{
  display:block!important;

  padding-top:90px;

  padding-bottom:90px;
}

.ip-shell{
  background:#071a14;

  color:white;

  border-radius:32px;

  padding:58px;

  box-shadow:0 30px 70px rgba(8,31,23,.12);
}

.ip-intro,
.ip-top{
  display:grid;

  grid-template-columns:1.1fr .9fr;

  gap:70px;

  align-items:end;
}

.ip-intro h2,
.ip-top h2{
  color:white;

  margin-top:16px;
}

.ip-intro h2 em{
  color:#8bc9aa;
}

.ip-intro p,
.ip-top p{
  color:#aec1b8;
}

.ip-grid{
  display:grid;

  grid-template-columns:repeat(4,1fr);

  gap:14px;

  margin-top:46px;
}

.ip-grid article{
  border:1px solid #23473b;

  background:#0b261e;

  border-radius:20px;

  padding:24px;
}

.ip-grid article>span{
  color:#84c2a4;

  font-size:11px;

  font-weight:800;
}

.ip-grid h3{
  color:white;

  font-size:22px;

  margin:20px 0 10px;
}

.ip-grid p{
  color:#9eb4aa;

  font-size:13px;
}

.public-ip-grid article p{
  min-height:76px;
}

.ip-note{
  margin-top:24px;

  border-top:1px solid #284b3f;

  padding-top:22px;

  display:grid;

  grid-template-columns:.25fr .75fr;

  gap:30px;
}

.ip-note strong{
  color:var(--lime);
}

.ip-note p{
  margin:0;

  color:#a9bbb3;

  font-size:13px;
}

.ip-bottom{
  margin-top:26px;

  border-top:1px solid #284b3f;

  padding-top:22px;

  display:grid;

  grid-template-columns:.35fr .65fr;

  gap:30px;
}

.ip-bottom strong{
  color:var(--lime);
}

.ip-bottom span{
  color:#a9bbb3;

  font-size:13px;
}


/* =========================================================
   FOOTER
   ========================================================= */

footer{
  background:#071914;

  color:#dce8e2;

  border-top:1px solid #17342c;
}

.footer-grid{
  padding:30px 0;

  display:flex;

  align-items:center;

  justify-content:space-between;

  gap:20px;
}

.footer-grid p,
.footer-grid span{
  font-size:12px;

  color:#89a197;
}

.upgraded-footer{
  display:grid;

  grid-template-columns:1fr .8fr 1.4fr;

  gap:48px;

  align-items:start;

  padding:44px 0;
}

.footer-brand{
  color:white;
}

.footer-links{
  display:grid;

  gap:8px;
}

.footer-links a{
  color:#a9bcb3;

  font-size:12px;
}

.footer-links a:hover{
  color:white;
}

.footer-legal{
  display:grid;

  gap:6px;
}

.footer-legal strong{
  color:white;

  font-size:12px;
}

.footer-legal span{
  color:#82988e;

  font-size:10px;

  line-height:1.5;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:980px){

  .global-exposure-shell{
    grid-template-columns:1fr;
  }

  .global-exposure-video{
    min-height:520px;
  }


  .hero,
  .section-grid,
  .about-grid,
  .founder,
  .partner-grid,
  .split-three{
    grid-template-columns:1fr;
  }

  .hero{
    gap:40px;
  }

  .journey-head{
    grid-template-columns:1fr;

    gap:24px;
  }

  .experience-grid{
    grid-template-columns:1fr;
  }

  .selector-panel{
    padding:32px;
  }

  .sim-card{
    min-height:560px;

    padding:40px 34px;
  }

  .process-grid,
  .roadmap-grid,
  .momentum-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .vision-grid,
  .team-grid,
  .recognition-grid{
    grid-template-columns:repeat(2,1fr);
  }

  nav{
    gap:14px;
  }

  .founder-media{
    grid-template-columns:1fr;
  }

  .founder-photo-wrap{
    min-height:500px;
  }

  .media-showcase{
    grid-template-columns:1fr;
  }

  .media-feature:first-child{
    grid-row:auto;
  }

  .problem-shell,
  .system-head,
  .concept-film-head,
  .ip-intro,
  .ip-top{
    grid-template-columns:1fr;
  }

  .system-card,
  .ip-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .system-card article:nth-child(2){
    border-right:0;
  }

  .system-card article:nth-child(-n+2){
    border-bottom:1px solid #dfe4dc;
  }

  .upgraded-footer{
    grid-template-columns:1fr 1fr;
  }

  .footer-legal{
    grid-column:1/-1;
  }

  .capability-focus{
    grid-template-columns:60px 1fr;
  }

  .capability-points{
    grid-column:2;
  }

  .market-header,
  .traction-head,
  .integration-head{
    display:grid;

    grid-template-columns:1fr;
  }

  .integration-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .integration-grid article:nth-child(2){
    border-right:0;
  }

  .integration-grid article:nth-child(-n+2){
    border-bottom:1px solid rgba(255,255,255,.12);
  }

  .market-cards,
  .traction-grid{
    grid-template-columns:repeat(2,1fr);
  }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:1100px){
  .menu-toggle{
    display:block;
    border:1px solid #d4dbd2;
    background:#f8f9f4;
    border-radius:10px;
    padding:9px 12px;
    cursor:pointer;
  }

  nav{
    display:none;
    position:absolute;
    top:76px;
    left:0;
    right:0;
    padding:16px;
    border:1px solid #dfe4db;
    border-radius:18px;
    background:#f8f9f4;
    box-shadow:0 20px 45px rgba(20,45,34,.12);
    flex-direction:column;
    align-items:stretch;
  }

  nav.open{
    display:flex;
  }

  .nav-cta{
    text-align:center;
  }
}

@media(max-width:760px){

  .global-exposure-copy{
    padding:36px 24px;
  }

  .global-exposure-video{
    min-height:500px;
    padding:24px 18px 42px;
  }

  .global-exposure-video video{
    width:min(100%,280px);
  }


  .container,
  .nav-shell{
    width:min(100% - 28px,var(--max));
  }

  .nav-wrap{
    padding-top:10px;
  }

  .menu-toggle{
    display:block;

    border:1px solid #d4dbd2;

    background:#f8f9f4;

    border-radius:10px;

    padding:9px 12px;

    cursor:pointer;
  }

  nav{
    display:none;

    position:absolute;

    top:76px;
    left:14px;
    right:14px;

    background:#f8f9f4;

    border:1px solid #dfe4db;

    border-radius:18px;

    padding:14px;

    flex-direction:column;

    align-items:stretch;
  }

  nav.open{
    display:flex;
  }

  .nav-cta{
    text-align:center;
  }

  .hero{
    padding-top:55px;
  }

  h1{
    font-size:55px;
  }

  h2{
    font-size:44px;
  }

  .proof-row{
    gap:10px;

    flex-direction:column;
  }

  .metrics,
  .process-grid,
  .vision-grid,
  .team-grid,
  .recognition-grid,
  .roadmap-grid,
  .momentum-grid,
  .funding-grid,
  .tab-content .three{
    grid-template-columns:1fr;
  }

  .video-card{
    min-height:380px;
  }

  .section{
    padding-top:78px;

    padding-bottom:78px;
  }

  form{
    grid-template-columns:1fr;
  }

  .full{
    grid-column:auto;
  }

  .footer-grid{
    flex-direction:column;

    align-items:flex-start;
  }

  .founder-media{
    width:min(100% - 28px,var(--max));

    margin-left:auto;

    margin-right:auto;
  }

  .founder-photo-copy{
    left:24px;
    right:24px;
    bottom:24px;
  }

  .founder-video-side{
    padding:20px;
  }

  .media-caption{
    align-items:flex-start;

    flex-direction:column;

    gap:5px;
  }

  .problem-copy,
  .problem-role,
  .ip-shell{
    padding:30px 24px;
  }

  .system-card,
  .ip-grid{
    grid-template-columns:1fr;
  }

  .system-card article{
    border-right:0;

    border-bottom:1px solid #dfe4dc;
  }

  .system-card article:last-child{
    border-bottom:0;
  }

  .system-card article:nth-child(2){
    border-right:0;
  }

  .system-card article:nth-child(-n+2){
    border-bottom:1px solid #dfe4dc;
  }

  .ip-note,
  .ip-bottom{
    grid-template-columns:1fr;
  }

  .upgraded-footer{
    grid-template-columns:1fr;
  }

  .footer-legal{
    grid-column:auto;
  }

  .capability-tabs{
    grid-template-columns:1fr 1fr;
  }

  .cap-tab:nth-child(2){
    border-right:0;
  }

  .capability-focus{
    grid-template-columns:1fr;

    padding:28px 22px;
  }

  .capability-points{
    grid-column:auto;
  }

  .proof-engineering-grid,
  .market-panel-head,
  .market-cards,
  .traction-grid{
    grid-template-columns:1fr;
  }

  .market-shell{
    padding:28px 20px;
  }

  .market-header{
    align-items:start;
  }

  .market-tabs{
    width:100%;

    overflow:auto;
  }

  .market-route{
    flex-wrap:wrap;
  }

  .integration-shell{
    padding-top:78px;
    padding-bottom:78px;
  }

  .integration-grid{
    grid-template-columns:1fr;
  }

  .integration-grid article,
  .integration-grid article:nth-child(2){
    min-height:auto;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.12);
  }

  .integration-grid article:last-child{
    border-bottom:0;
  }

  .integration-route{
    grid-template-columns:1fr;
    gap:14px;
  }

  .integration-route b{
    display:none;
  }
}


/* =========================================================
   SMALL MOBILE — JOURNEY
   ========================================================= */

@media(max-width:650px){

  .journey .container{
    padding-top:75px;

    padding-bottom:75px;
  }

  .journey h2{
    font-size:48px;
  }

  .journey-head p{
    font-size:16px;
  }

  .experience-grid{
    border-radius:24px;
  }

  .selector-panel{
    padding:25px 20px 28px;
  }

  .moment{
    grid-template-columns:38px 1fr 20px;

    min-height:70px;

    padding:13px 14px;
  }

  .moment span{
    font-size:14px;
  }

  .lang-chips button{
    padding:9px 12px;

    font-size:12px;
  }

  .sim-card{
    min-height:520px;

    padding:32px 20px 26px;
  }

  .sim-card h3{
    font-size:37px;
  }

  .sim-top{
    gap:14px;
  }

  .timeline div{
    padding:12px 10px;

    gap:12px;

    font-size:14px;
  }

  .timeline i{
    width:30px;
    height:30px;
  }

  .sim-actions{
    flex-direction:column;

    align-items:stretch;
  }

  #play-journey,
  #hear-prompt{
    width:100%;
  }
}

/* Netlify contact form additions */
.form-honeypot {
  position: absolute !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  height: 1px !important;
  width: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  border: 0 !important;
}

.contact-direct {
  margin: 0.15rem 0 0;
  font-size: 0.94rem;
}

.contact-direct a {
  color: inherit;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

#partner-form button[disabled] {
  opacity: 0.7;
  cursor: wait;
}

.form-reassurance {
  margin: 0 0 0.25rem;
  font-size: 0.94rem;
  line-height: 1.6;
  opacity: 0.86;
}

#form-status {
  line-height: 1.55;
  font-weight: 600;
}


/* =========================================================
   ACCESSIBILITY HARDENING — Sep 2026
   ========================================================= */
.skip-link{
  position:fixed;
  left:16px;
  top:12px;
  z-index:9999;
  transform:translateY(-160%);
  background:#ffffff;
  color:#071d17;
  border:2px solid #071d17;
  border-radius:10px;
  padding:10px 14px;
  font-weight:800;
  text-decoration:none;
}
.skip-link:focus{ transform:translateY(0); }

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible{
  outline:3px solid #73b994;
  outline-offset:3px;
}

.selector-label{
  margin:0;
  color:#d4e0da;
  font-size:12px;
  font-weight:700;
}
.moment-options{ display:grid; gap:10px; }
.field-help{ display:block; color:#b8cbc1; font-weight:500; line-height:1.45; }

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    scroll-behavior:auto !important;
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
  }
}


/* =========================================================
   PILOT INTEREST PATHWAY — Sep 2026
   ========================================================= */
.pilot-interest-section{ padding-top:45px; }
.pilot-interest-shell{
  display:grid;
  grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr);
  gap:48px;
  padding:46px;
  border:1px solid rgba(10,51,39,.13);
  border-radius:30px;
  background:#f3eee3;
}
.pilot-interest-copy h2{ margin-top:12px; }
.pilot-interest-copy > p{
  max-width:620px;
  line-height:1.75;
  color:#395149;
}
.pilot-audience{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin:24px 0;
}
.pilot-audience span{
  padding:9px 12px;
  border:1px solid rgba(10,51,39,.15);
  border-radius:999px;
  background:rgba(255,255,255,.58);
  font-size:13px;
  font-weight:700;
}
.pilot-note{
  margin-top:26px;
  padding:18px 20px;
  border-left:3px solid #2d7358;
  background:rgba(255,255,255,.58);
}
.pilot-note strong{ display:block; margin-bottom:7px; }
.pilot-note p{ margin:0; line-height:1.55; }

#pilot-interest-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  align-content:start;
  padding:26px;
  border-radius:22px;
  background:#0a3025;
  color:#f7f2e8;
}
#pilot-interest-form label{
  display:grid;
  gap:7px;
  font-weight:700;
  font-size:13px;
}
#pilot-interest-form input,
#pilot-interest-form select,
#pilot-interest-form textarea{
  width:100%;
  border:1px solid rgba(255,255,255,.17);
  border-radius:12px;
  background:#143f32;
  color:#fff;
  padding:13px 14px;
  font:inherit;
}
#pilot-interest-form input::placeholder,
#pilot-interest-form textarea::placeholder{ color:#b8c8c1; }
#pilot-interest-form .full{ grid-column:1 / -1; }
#pilot-interest-form .form-reassurance{ color:#cbd8d2; }
#pilot-interest-form button[disabled]{ opacity:.7; cursor:wait; }

/* =========================================================
   LIGHTWEIGHT UPDATES
   ========================================================= */
.updates-section{ padding-top:92px; }
.updates-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,.58fr);
  gap:42px;
  align-items:end;
  margin-bottom:34px;
}
.updates-head p{
  margin:0;
  line-height:1.7;
  color:#53645e;
}
.updates-list{
  border-top:1px solid rgba(10,51,39,.14);
}
.update-item{
  display:grid;
  grid-template-columns:180px 1fr;
  gap:36px;
  padding:27px 0;
  border-bottom:1px solid rgba(10,51,39,.14);
}
.update-item time{
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#47705f;
}
.update-item h3{ margin:0 0 8px; font-size:22px; }
.update-item p{
  margin:0;
  max-width:780px;
  line-height:1.7;
  color:#53645e;
}

@media(max-width:900px){
  .pilot-interest-shell,
  .updates-head{
    grid-template-columns:1fr;
  }
  .pilot-interest-shell{ padding:30px 22px; }
}
@media(max-width:650px){
  #pilot-interest-form{ grid-template-columns:1fr; padding:22px 16px; }
  #pilot-interest-form .full{ grid-column:auto; }
  .update-item{ grid-template-columns:1fr; gap:8px; }
}


/* =========================================================
   V7 · CATEGORISED MEDIA SHOWCASE
   ========================================================= */
.media-categories{display:grid;gap:34px;margin-top:42px;}
.media-category{background:rgba(255,255,255,.42);border:1px solid #dfe4dc;border-radius:30px;padding:24px;}
.media-category-heading{display:flex;align-items:flex-start;gap:14px;margin-bottom:20px;}
.media-category-heading>span{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border-radius:50%;background:#0b2d23;color:#fff;font:800 11px/1 Manrope,sans-serif;letter-spacing:.08em;}
.media-category-heading p{margin:0 0 4px;color:#39765a;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;}
.media-category-heading h3{margin:0;font-size:clamp(20px,2.2vw,30px);line-height:1.08;color:#10251e;}
.media-category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
.media-category-grid-single{grid-template-columns:minmax(0,1fr);max-width:760px;}
.media-category .media-feature:first-child{grid-row:auto;}
@media(max-width:760px){.media-category{padding:16px;border-radius:24px}.media-category-grid,.media-category-grid-single{grid-template-columns:1fr;max-width:none}.media-category-heading{gap:11px}.media-category-heading>span{width:34px;height:34px;flex-basis:34px}}

