:root{
  color-scheme:dark;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:#07111d;color:#f6f8fb
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#07111d}
body{line-height:1.5}
a{color:inherit}
.overview{min-height:100%}
.hero{position:relative;min-height:78vh;display:flex;align-items:flex-end;overflow:hidden}
.hero-bg{
  position:absolute;inset:0;
  background-image:url('/assets/panoramas/06-saharah-hub.webp');
  background-size:cover;background-position:center;
  transform:scale(1.08);
  animation:drift 28s ease-in-out infinite alternate
}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,8,14,.92) 0%,rgba(3,8,14,.72) 48%,rgba(3,8,14,.46) 100%),linear-gradient(0deg,#07111d 0%,transparent 36%)}
.hero-content{position:relative;z-index:2;width:min(1180px,calc(100% - 40px));margin:0 auto;padding:110px 0 80px}
.eyebrow,.section-kicker{font-size:.78rem;letter-spacing:.14em;font-weight:800;color:#d3e5f6}
h1{font-size:clamp(2.7rem,7vw,6.5rem);line-height:.94;max-width:920px;margin:.55rem 0 1.4rem;letter-spacing:-.045em}
.lead{font-size:clamp(1.05rem,2vw,1.45rem);max-width:760px;color:#e0e7ef}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.primary,.secondary{display:inline-flex;min-height:48px;align-items:center;justify-content:center;padding:0 20px;border-radius:10px;text-decoration:none;font-weight:800}
.primary{background:#fff;color:#08111b}
.secondary{border:1px solid rgba(255,255,255,.48);background:rgba(8,17,27,.5)}
.note{margin-top:20px;font-size:.82rem;color:#b3c0ce}
.why,.pathway,.close{width:min(1180px,calc(100% - 40px));margin:0 auto}
.why{display:grid;grid-template-columns:1fr 1fr;gap:60px;padding:90px 0 50px;border-bottom:1px solid #253445}
h2{font-size:clamp(2rem,4vw,3.5rem);line-height:1.05;margin:.55rem 0}
.why p,.pathway-heading p,.close p{color:#bdc9d6;font-size:1.06rem}
.principles{width:min(1180px,calc(100% - 40px));margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#253445;border:1px solid #253445;margin-top:50px}
.principles article{background:#0b1724;padding:30px}
.principles strong{display:block;font-size:1.05rem;margin-bottom:9px}
.principles span{color:#aebdca;font-size:.94rem}
.pathway{padding:100px 0}
.pathway-heading{max-width:720px;margin-bottom:40px}
.stages{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.stage{min-width:0;min-height:360px;border:1px solid #2b3a49;background:#0b1724;padding:24px;display:flex;flex-direction:column;text-decoration:none;transition:transform .18s ease,border-color .18s ease,background .18s ease}
.stage.active,.stage.next{cursor:pointer}
.stage.active:hover,.stage.next:hover{transform:translateY(-4px);border-color:#92aec6;background:#102131}
.number{font-size:2.3rem;font-weight:900;color:#5f7890}
.status{font-size:.68rem;font-weight:900;letter-spacing:.12em;color:#c7d9e7;margin:10px 0 30px}
.stage h3{font-size:1.55rem;margin:0 0 12px}
.stage p{color:#aebdca;font-size:.92rem;margin:0}
.enter{margin-top:auto;padding-top:24px;font-weight:800}
.locked{opacity:.66}
.close{display:flex;justify-content:space-between;gap:35px;align-items:center;border-top:1px solid #253445;padding:60px 0 90px}
.close>div{max-width:760px}
@keyframes drift{from{transform:scale(1.08) translateX(-1.5%)}to{transform:scale(1.13) translateX(1.5%)}}
@media(max-width:900px){
  .why{grid-template-columns:1fr;gap:20px}
  .principles{grid-template-columns:1fr}
  .stages{grid-template-columns:1fr 1fr}
  .stage{min-height:300px}
}
@media(max-width:600px){
  .hero{min-height:auto}
  .hero-content{padding:100px 0 65px}
  .stages{grid-template-columns:1fr}
  .stage{min-height:260px}
  .close{align-items:flex-start;flex-direction:column}
}
@media(prefers-reduced-motion:reduce){.hero-bg{animation:none}}

.pipeline{
  width:min(1180px,calc(100% - 40px));
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(360px,.95fr);
  gap:46px;
  align-items:start;
  padding:70px 0 35px;
}
.pipeline-copy h2{margin-top:.55rem}
.pipeline-copy>p{color:#bdc9d6;font-size:1.02rem}
.long-term{
  margin-top:25px;
  padding:22px;
  border:1px solid #314457;
  background:#0b1724;
}
.long-term strong{
  display:block;
  font-size:1.03rem;
  margin-bottom:8px;
}
.long-term p{
  margin:.55rem 0 0;
  color:#b8c6d3;
  font-size:.94rem;
}
.pipeline-video{
  border:1px solid #2b3a49;
  background:#08131f;
  overflow:hidden;
}
.pipeline-video video{
  display:block;
  width:100%;
  height:auto;
  background:#000;
}
.video-caption{padding:16px 18px 18px}
.video-caption strong{display:block;margin-bottom:4px}
.video-caption span{display:block;color:#aebdca;font-size:.86rem}
@media(max-width:900px){
  .pipeline{grid-template-columns:1fr}
}