:root{
  --bg:#040706;
  --text:#f3f6f4;
  --muted:#a8b4ad;
  --line:rgba(255,255,255,.11);
  --accent:#a7dc70;
  --accent2:#d5ffae;
  --accent-rgb:167,220,112;
  --max:1180px;
  --header-h:88px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overflow-x:hidden;line-height:1.5}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
.container{width:min(calc(100% - 40px),var(--max));margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Progressive enhancement: content is visible unless JS explicitly prepares it. */
.reveal{opacity:1;transform:none;filter:none}

.page-progress{position:fixed;inset:0 0 auto;height:3px;z-index:999;pointer-events:none}
.page-progress span{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,var(--accent),#fff);box-shadow:0 0 18px rgba(var(--accent-rgb),.8)}

.site-header{position:fixed;inset:0 0 auto;z-index:100;background:rgba(3,7,5,.24);border-bottom:1px solid rgba(255,255,255,.06);transition:.3s ease}
.site-header.is-scrolled{background:rgba(3,7,5,.86);backdrop-filter:blur(20px) saturate(145%);border-bottom-color:rgba(255,255,255,.12);box-shadow:0 14px 40px rgba(0,0,0,.35)}
.header-inner{min-height:var(--header-h);display:flex;align-items:center;justify-content:space-between;gap:30px;transition:min-height .3s ease}
.site-header.is-scrolled .header-inner{min-height:68px}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{width:46px;height:46px;border:1px solid rgba(var(--accent-rgb),.65);border-radius:50%;display:grid;place-items:center;box-shadow:0 0 24px rgba(var(--accent-rgb),.08);transition:.3s ease}
.brand-mark.small{width:40px;height:40px}
.brand:hover .brand-mark{transform:rotate(-8deg) scale(1.05);box-shadow:0 0 28px rgba(var(--accent-rgb),.22)}
.brand-orbit{width:24px;height:9px;border:1px solid var(--accent);border-radius:50%;transform:rotate(-10deg);box-shadow:0 0 13px rgba(var(--accent-rgb),.45)}
.brand-copy{display:grid;line-height:1}
.brand-copy strong{font-size:1.25rem;letter-spacing:.14em}
.brand-copy small{margin-top:5px;color:var(--accent);font-size:.67rem;font-weight:800;letter-spacing:.2em}
.primary-nav{display:flex;gap:30px;align-items:center}
.primary-nav a{position:relative;font-size:.94rem}
.primary-nav a::after{content:"";position:absolute;left:0;bottom:-10px;width:100%;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:.25s ease;box-shadow:0 0 12px rgba(var(--accent-rgb),.7)}
.primary-nav a:hover::after,.primary-nav a.is-active::after{transform:scaleX(1)}
.menu-toggle{display:none}

/* Hero */
.hero{min-height:100svh;position:relative;isolation:isolate;display:grid;align-items:center;overflow:hidden}
.hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-3}
.hero-overlay{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(2,5,4,.96) 0%,rgba(2,5,4,.84) 37%,rgba(2,5,4,.44) 62%,rgba(2,5,4,.10) 84%),linear-gradient(0deg,#040706 0%,rgba(4,7,6,.68) 10%,transparent 35%)}
.hero-grid{position:absolute;inset:0;pointer-events:none;opacity:.05;background-image:linear-gradient(rgba(255,255,255,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.5) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to bottom,black,transparent 78%)}
.scan-line{position:absolute;left:0;right:0;top:-2px;height:2px;background:linear-gradient(90deg,transparent,rgba(var(--accent-rgb),.65),transparent);box-shadow:0 0 24px rgba(var(--accent-rgb),.38);opacity:.5;animation:scan 8s linear infinite;pointer-events:none}
.hero-copy{max-width:810px;padding:150px 0 110px}
.kicker-pill{display:inline-flex;align-items:center;gap:9px;width:max-content;padding:9px 14px!important;border:1px solid rgba(var(--accent-rgb),.5);border-radius:999px;background:linear-gradient(180deg,rgba(var(--accent-rgb),.15),rgba(var(--accent-rgb),.035));box-shadow:0 0 28px rgba(var(--accent-rgb),.12),inset 0 1px 0 rgba(255,255,255,.06);color:var(--accent);font-size:.76rem;font-weight:900;letter-spacing:.15em;text-transform:uppercase}
.status-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 14px var(--accent);animation:pulse 1.7s ease-in-out infinite}
.hero h1{margin:24px 0 26px;font-size:clamp(3.8rem,8.2vw,7.7rem);line-height:.88;letter-spacing:-.065em}
.hero h1 span{display:block;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.72)}
.hero-intro{max-width:720px;color:#d3dbd6;font-size:clamp(1.06rem,1.8vw,1.27rem);line-height:1.72}
.hero-intro strong{color:#fff}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}
.button{min-height:52px;padding:0 22px;border-radius:9px;border:1px solid rgba(255,255,255,.18);display:inline-flex;align-items:center;justify-content:center;font-weight:800;position:relative;overflow:hidden;transition:.22s ease}
.button::before{content:"";position:absolute;top:-50%;bottom:-50%;left:-70%;width:32%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.46),transparent);transform:skewX(-18deg);transition:left .55s ease}
.button:hover::before{left:130%}
.button:hover{transform:translateY(-3px)}
.button-primary{background:var(--accent);border-color:var(--accent);color:#091008;box-shadow:0 10px 34px rgba(var(--accent-rgb),.1)}
.button-primary:hover{background:var(--accent2);border-color:var(--accent2);box-shadow:0 16px 42px rgba(var(--accent-rgb),.22)}
.button-secondary{background:rgba(0,0,0,.28);backdrop-filter:blur(8px)}
.hero-status{margin-top:24px;display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:.73rem;letter-spacing:.13em}
.status-label{color:rgba(255,255,255,.45)}
.status-value{color:var(--accent);font-weight:800}
.status-value i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-right:7px;box-shadow:0 0 12px var(--accent)}
.status-divider{width:1px;height:15px;background:rgba(255,255,255,.14)}
.status-copy{color:rgba(255,255,255,.45);letter-spacing:.08em}
.scroll-cue{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:7px;color:rgba(255,255,255,.45);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase}
.scroll-cue b{font-size:1rem;animation:bob 1.6s ease-in-out infinite}
.intro-animate{opacity:0;transform:translateY(28px);filter:blur(8px);animation:intro .9s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:var(--intro-delay,0s)}

/* Scroll animations */
.reveal{
  opacity:1;
  transform:none;
  filter:none;
}
.reveal.is-visible{
  animation:sectionReveal .72s cubic-bezier(.2,.8,.2,1) both;
}
.reveal-left.is-visible{animation-name:revealLeft}
.reveal-right.is-visible{animation-name:revealRight}
.reveal-up.is-visible{animation-name:revealUp}

/* Sections */
.section{position:relative;padding:100px 0;overflow:hidden}
.section-about{background:radial-gradient(circle at 85% 0%,rgba(var(--accent-rgb),.055),transparent 30rem),var(--bg);border-top:1px solid var(--line)}
.section-network{background:#07100d;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-launch{background:#040706}
.ambient-orb{position:absolute;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(var(--accent-rgb),.08),transparent 67%);filter:blur(28px);pointer-events:none}
.orb-right{right:-180px;top:-180px}
.orb-left{left:-180px;bottom:-220px}
.technical-grid{position:absolute;inset:0;opacity:.035;background-image:linear-gradient(rgba(255,255,255,.55) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.55) 1px,transparent 1px);background-size:46px 46px;mask-image:linear-gradient(to bottom,transparent,black 25%,black 75%,transparent)}
.split-intro{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:80px}
.section-kicker{margin:0 0 18px}
.section h2{margin:0;max-width:760px;font-size:clamp(2.3rem,4.6vw,4rem);line-height:1.04;letter-spacing:-.045em}
.section-copy{color:var(--muted);font-size:1.04rem;line-height:1.78}
.section-heading{position:relative;z-index:1;max-width:760px;margin-bottom:42px}
.section-heading>p:last-child{color:var(--muted);line-height:1.7}

/* Cards */
.feature-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.feature-card{
  --traffic-colour:var(--accent);
  min-height:472px;
  aspect-ratio:380 / 472;
  border:1px solid rgba(255,255,255,.17);
  border-radius:20px;
  position:relative;
  overflow:hidden;
  background:#07100d;
  box-shadow:0 18px 50px rgba(0,0,0,.28);
  transition:transform .34s cubic-bezier(.2,.8,.2,1),border-color .3s ease,box-shadow .3s ease
}
.card-background{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  transform:scale(1.001);
  transition:transform .85s cubic-bezier(.2,.8,.2,1),filter .45s ease
}
.card-shade{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(
      180deg,
      rgba(3,7,6,.01) 0%,
      rgba(3,7,6,.04) 26%,
      rgba(3,7,6,.16) 48%,
      rgba(3,7,6,.68) 74%,
      rgba(3,7,6,.96) 100%
    ),
    linear-gradient(90deg,rgba(3,7,6,.16),rgba(3,7,6,.02))
}
.card-content{
  position:relative;
  z-index:3;
  min-height:472px;
  height:100%;
  padding:30px;
  display:flex;
  flex-direction:column;
  align-items:flex-start
}
.feature-number{color:var(--traffic-colour);font-size:.76rem;font-weight:900;letter-spacing:.15em;text-shadow:0 0 12px currentColor;transition:color .35s ease}
.feature-card h3{margin:auto 0 12px;font-size:1.8rem;text-shadow:0 2px 18px rgba(0,0,0,.9)}
.feature-card p{margin:0;color:#e0e6e2;line-height:1.7;text-shadow:0 2px 14px rgba(0,0,0,.95)}
.feature-card:hover{transform:translateY(-10px) scale(1.012)}
.feature-card:hover .card-background{transform:scale(1.06);filter:saturate(1.06) contrast(1.03) brightness(1.03)}

.feature-card.traffic-red{--traffic-colour:#ff4b4b;border-color:rgba(255,75,75,.88);box-shadow:0 30px 78px rgba(0,0,0,.44),0 0 46px rgba(255,75,75,.24)}
.feature-card.traffic-amber{--traffic-colour:#ffbf38;border-color:rgba(255,191,56,.9);box-shadow:0 30px 78px rgba(0,0,0,.44),0 0 46px rgba(255,191,56,.25)}
.feature-card.traffic-green{--traffic-colour:#a7dc70;border-color:rgba(167,220,112,.92);box-shadow:0 30px 78px rgba(0,0,0,.44),0 0 48px rgba(167,220,112,.28)}

.feature-card::after{content:"";position:absolute;z-index:5;left:14%;right:14%;bottom:0;height:3px;background:linear-gradient(90deg,transparent,var(--traffic-colour),transparent);transform:scaleX(.22);opacity:.4;transition:.35s ease}
.feature-card.traffic-red::after,.feature-card.traffic-amber::after,.feature-card.traffic-green::after{transform:scaleX(1);opacity:1}

.card-graphic{position:relative;margin-top:22px;width:68px;height:68px;border:1px solid var(--traffic-colour);border-radius:50%;background:rgba(4,8,7,.38);backdrop-filter:blur(8px);box-shadow:0 0 26px color-mix(in srgb,var(--traffic-colour) 22%,transparent);transition:.35s ease}
.radar-graphic .radar-ring{position:absolute;border:1px solid currentColor;border-radius:50%;color:var(--traffic-colour)}
.radar-graphic .ring-a{inset:11px}
.radar-graphic .ring-b{inset:22px}
.radar-dot{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--traffic-colour);right:14px;top:20px;box-shadow:0 0 12px var(--traffic-colour)}
.radar-sweep{position:absolute;left:33px;top:33px;width:27px;height:1px;background:linear-gradient(90deg,var(--traffic-colour),transparent);transform-origin:left;animation:radarSweep 2.8s linear infinite}
.target-graphic .target-ring{position:absolute;border:1px solid var(--traffic-colour);border-radius:50%}
.target-graphic .ring-a{inset:11px}
.target-graphic .ring-b{inset:23px}
.target-cross{position:absolute;background:var(--traffic-colour);opacity:.68}
.target-cross.x{width:42px;height:1px;left:13px;top:33px}
.target-cross.y{height:42px;width:1px;top:13px;left:33px}
.target-dot{position:absolute;width:8px;height:8px;border-radius:50%;left:30px;top:30px;background:var(--traffic-colour);box-shadow:0 0 13px var(--traffic-colour);animation:targetPulse 1.7s ease-in-out infinite}
.signal-core{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--traffic-colour);left:29px;top:29px;box-shadow:0 0 12px var(--traffic-colour)}
.signal-wave{position:absolute;border:1px solid var(--traffic-colour);border-radius:50%;border-left-color:transparent;border-bottom-color:transparent;transform:rotate(45deg)}
.signal-graphic .wave-a{inset:24px}
.signal-graphic .wave-b{inset:15px}
.signal-graphic .wave-c{inset:7px;animation:signalPulse 1.8s ease-in-out infinite}

/* Launch */
.launch-box{display:grid;grid-template-columns:1fr auto;align-items:center;gap:40px;padding:44px;border:1px solid rgba(var(--accent-rgb),.24);border-radius:22px;background:linear-gradient(135deg,rgba(var(--accent-rgb),.065),rgba(255,255,255,.018));box-shadow:0 20px 70px rgba(0,0,0,.16)}
.launch-box h2{font-size:clamp(2rem,4vw,3.4rem)}
.launch-box p:last-child{max-width:710px;color:var(--muted);line-height:1.7}

/* Footer */
.site-footer{padding:60px 0 28px;border-top:1px solid var(--line);background:#020403;color:#89948d}
.footer-grid{display:grid;grid-template-columns:1.6fr .7fr .9fr;gap:50px;padding-bottom:44px}
.footer-brand p{max-width:520px;margin:20px 0 0;line-height:1.7}
.footer-links,.footer-contact{display:grid;align-content:start;gap:11px}
.footer-links strong,.footer-contact strong{color:#fff;margin-bottom:4px}
.footer-links a:hover,.footer-contact a:hover{color:var(--accent)}
.footer-bottom{padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:30px;font-size:.82rem}
.footer-bottom p{margin:0}
.footer-bottom span{color:var(--accent);padding:0 5px}


@keyframes sectionReveal{
  from{opacity:.35;transform:translateY(24px)}
  to{opacity:1;transform:none}
}
@keyframes revealLeft{
  from{opacity:.35;transform:translateX(-55px)}
  to{opacity:1;transform:none}
}
@keyframes revealRight{
  from{opacity:.35;transform:translateX(55px)}
  to{opacity:1;transform:none}
}
@keyframes revealUp{
  from{opacity:.35;transform:translateY(42px)}
  to{opacity:1;transform:none}
}

@keyframes intro{to{opacity:1;transform:translateY(0);filter:blur(0)}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(var(--accent-rgb),.15),0 0 14px var(--accent)}50%{box-shadow:0 0 0 8px rgba(var(--accent-rgb),0),0 0 20px var(--accent)}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
@keyframes scan{0%{top:-2px;opacity:0}10%{opacity:.45}90%{opacity:.45}100%{top:100%;opacity:0}}
@keyframes radarSweep{to{transform:rotate(360deg)}}
@keyframes targetPulse{0%,100%{transform:scale(.82);opacity:.55}50%{transform:scale(1.3);opacity:1}}
@keyframes signalPulse{0%,100%{opacity:.35;transform:rotate(45deg) scale(.9)}50%{opacity:1;transform:rotate(45deg) scale(1.05)}}

@media(max-width:900px){
  :root{--header-h:76px}
  .menu-toggle{display:grid;width:44px;height:44px;padding:10px;align-content:center;gap:5px;border:1px solid var(--line);border-radius:8px;background:rgba(0,0,0,.25)}
  .menu-toggle span:not(.sr-only){height:1px;background:#fff;width:100%}
  .primary-nav{position:fixed;top:76px;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;padding:18px 20px;background:rgba(3,7,5,.96);backdrop-filter:blur(20px)}
  .primary-nav.is-open{display:flex}
  .primary-nav a{padding:16px 0;border-bottom:1px solid var(--line)}
  .hero{min-height:92svh}
  .hero-image{object-position:58% center}
  .hero-copy{padding:130px 0 90px}
  .hero h1{font-size:clamp(3.2rem,16.5vw,5.7rem)}
  .scroll-cue{display:none}
  .split-intro,.feature-grid,.values-grid,.launch-box,.launch-details,.footer-grid{grid-template-columns:1fr}
  .split-intro{gap:30px}
  .feature-card{min-height:472px}.card-content{min-height:472px}
  .footer-bottom{flex-direction:column}
}
@media(max-width:520px){
  .container{width:min(calc(100% - 28px),var(--max))}
  .section{padding:74px 0}
  .hero h1{font-size:clamp(3rem,17vw,4.7rem)}
  .hero-actions{flex-direction:column}
  .button{width:100%}
  .status-divider,.status-copy{display:none}
  .launch-box{padding:28px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .reveal,.intro-animate{opacity:1!important;transform:none!important;filter:none!important}
}
