



  :root {



    --navy: #060c1a;



    --navy2: #0b1529;



    --navy3: #0f1e3a;



    --cyan: #00d4ff;



    --cyan2: #00a8cc;



    --cyan3: #00ffea;



    --gold: #f0a500;



    --white: #e8f4ff;



    --muted: #7a9cbf;



    --glass: rgba(10,30,60,0.6);



    --glass-border: rgba(0,212,255,0.15);



    --glow: 0 0 30px rgba(0,212,255,0.25);



  }



  * { margin:0; padding:0; box-sizing:border-box; }



  html { scroll-behavior: smooth; }



  body {



    background: var(--navy);



    color: var(--white);



    font-family: 'Exo 2', sans-serif;



    font-weight: 300;



    line-height: 1.7;



    overflow-x: hidden;



  }



  #particles { position:fixed; inset:0; z-index:0; pointer-events:none; opacity:0.4; }



  nav {



    position:fixed; top:0; left:0; right:0; z-index:100;



    background:rgba(6,12,26,0.92); backdrop-filter:blur(16px);



    border-bottom:1px solid var(--glass-border);



    padding:0 40px; display:flex; align-items:center; justify-content:space-between; height:64px;



  }



  .nav-logo { font-family:'Rajdhani',sans-serif; font-weight:700; font-size:1.3rem; color:var(--cyan); letter-spacing:2px; text-transform:uppercase; }



  .nav-logo span { color:var(--white); }



  .nav-links { display:flex; gap:28px; list-style:none; }



  .nav-links a { color:var(--muted); text-decoration:none; font-family:'Rajdhani',sans-serif; font-size:0.85rem; font-weight:500; letter-spacing:1px; text-transform:uppercase; transition:color 0.2s; }



  .nav-links a:hover { color:var(--cyan); }



  .nav-cta { background:transparent; border:1px solid var(--cyan); color:var(--cyan); padding:8px 20px; font-family:'Rajdhani',sans-serif; font-size:0.85rem; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; cursor:pointer; transition:all 0.2s; }



  .nav-cta:hover { background:rgba(0,212,255,0.1); box-shadow:var(--glow); }



  section { position:relative; z-index:1; }



  #hero {



    min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center;



    text-align:center; padding:120px 40px 80px;



    background:radial-gradient(ellipse 80% 60% at 50% 40%,rgba(0,212,255,0.06) 0%,transparent 70%),



               radial-gradient(ellipse 60% 40% at 80% 80%,rgba(0,100,200,0.04) 0%,transparent 60%),var(--navy);



  }



  .hero-logo { width:min(340px,80vw); margin-bottom:48px; filter:drop-shadow(0 0 40px rgba(0,212,255,0.4)); animation:float 6s ease-in-out infinite; }



  @keyframes float { 0%,100% { transform:translateY(0px); } 50% { transform:translateY(-12px); } }



  .hero-tagline { font-family:'Rajdhani',sans-serif; font-size:clamp(1.8rem,4vw,3.2rem); font-weight:700; line-height:1.15; max-width:900px; margin-bottom:24px; letter-spacing:1px; }



  .hero-tagline .cyan { color:var(--cyan); }



  .hero-sub { font-size:clamp(0.95rem,1.8vw,1.15rem); color:var(--muted); max-width:700px; margin-bottom:48px; line-height:1.8; }



  .hero-quote { font-family:'Share Tech Mono',monospace; font-size:1rem; color:var(--cyan3); border-left:2px solid var(--cyan); padding:12px 24px; margin-bottom:52px; letter-spacing:0.5px; }



  .btn-primary { display:inline-block; background:linear-gradient(135deg,var(--cyan2),var(--cyan)); color:#000; padding:14px 36px; font-family:'Rajdhani',sans-serif; font-size:1rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; text-decoration:none; clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%); transition:all 0.25s; box-shadow:0 0 20px rgba(0,212,255,0.3); }



  .btn-primary:hover { box-shadow:0 0 40px rgba(0,212,255,0.6); transform:translateY(-2px); }



  .scroll-hint { position:absolute; bottom:30px; left:50%; transform:translateX(-50%); color:var(--muted); font-size:0.75rem; letter-spacing:2px; text-transform:uppercase; animation:bounce 2.5s ease-in-out infinite; }



  .scroll-hint::after { content:''; display:block; width:1px; height:40px; background:linear-gradient(to bottom,var(--cyan),transparent); margin:8px auto 0; }



  @keyframes bounce { 0%,100% { opacity:0.4; transform:translateX(-50%) translateY(0); } 50% { opacity:1; transform:translateX(-50%) translateY(6px); } }



  .section-inner { max-width:1200px; margin:0 auto; padding:100px 40px; }



  .section-inner.narrow { max-width:900px; }



  .section-label { font-family:'Share Tech Mono',monospace; font-size:0.7rem; color:var(--cyan); letter-spacing:4px; text-transform:uppercase; margin-bottom:16px; display:flex; align-items:center; gap:12px; }



  .section-label::before { content:''; flex:0 0 32px; height:1px; background:var(--cyan); }



  h2 { font-family:'Rajdhani',sans-serif; font-size:clamp(1.8rem,3.5vw,2.8rem); font-weight:700; line-height:1.15; margin-bottom:24px; letter-spacing:0.5px; }



  h2 .accent { color:var(--cyan); }



  h3 { font-family:'Rajdhani',sans-serif; font-size:1.4rem; font-weight:600; color:var(--cyan); margin-bottom:12px; letter-spacing:0.5px; }



  p { color:rgba(232,244,255,0.8); margin-bottom:16px; font-size:1rem; }



  .slide-img { width:100%; max-width:1000px; height:auto; margin:36px auto; border-radius:4px; border:1px solid var(--glass-border); box-shadow:var(--glow),0 20px 60px rgba(0,0,0,0.6); display:block; }



  .glass-card { background:var(--glass); border:1px solid var(--glass-border); border-radius:4px; padding:36px; backdrop-filter:blur(8px); box-shadow:0 8px 32px rgba(0,0,0,0.4); transition:border-color 0.3s,box-shadow 0.3s; }



  .glass-card:hover { border-color:rgba(0,212,255,0.4); box-shadow:var(--glow),0 8px 32px rgba(0,0,0,0.4); }



  .section-dark { background:var(--navy); }



  .section-mid { background:var(--navy2); }



  .section-accent { background:linear-gradient(180deg,var(--navy2) 0%,var(--navy3) 100%); }



  .split { display:flex; flex-direction:column; gap:28px; align-items:stretch; } .split > div:has(img.slide-img){ order:2; } .split > div:not(:has(img.slide-img)){ order:1; } .terrain-row { display:grid; grid-template-columns:1.15fr 0.85fr; gap:48px; align-items:center; } .terrain-row > div:has(img.slide-img){ order:2; } .terrain-row > div:not(:has(img.slide-img)){ order:1; } .terrain-row img.slide-img{ margin:0 auto; }



  .split.reverse { direction:ltr; }



  .split.reverse > * { direction:ltr; }



  @media(max-width:768px) {



    .split { grid-template-columns:1fr; gap:40px; } .terrain-row { grid-template-columns:1fr; gap:28px; }



    .split.reverse { direction:ltr; }



    nav .nav-links { display:none; }



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



  }



  .quote-block { border-left:3px solid var(--cyan); padding:16px 24px; margin:28px 0; background:rgba(0,212,255,0.04); }



  .quote-block p { font-family:'Share Tech Mono',monospace; font-size:0.9rem; color:var(--cyan3); margin:0; line-height:1.7; }



  .metrics { display:flex; flex-wrap:wrap; gap:20px; margin:32px 0; }



  .metric { text-align:center; padding:20px 28px; background:rgba(0,212,255,0.05); border:1px solid rgba(0,212,255,0.2); border-radius:2px; flex:1; min-width:120px; }



  .metric-val { font-family:'Share Tech Mono',monospace; font-size:2rem; color:var(--cyan); display:block; line-height:1; }



  .metric-label { font-size:0.75rem; color:var(--muted); letter-spacing:1px; text-transform:uppercase; margin-top:6px; }



  .timeline { position:relative; padding-left:40px; }



  .timeline::before { content:''; position:absolute; left:0; top:0; bottom:0; width:1px; background:linear-gradient(to bottom,var(--cyan),transparent); }



  .tl-item { position:relative; margin-bottom:48px; }



  .tl-item::before { content:''; position:absolute; left:-44px; top:6px; width:10px; height:10px; border-radius:50%; background:var(--cyan); box-shadow:0 0 10px var(--cyan); }



  .tl-year { font-family:'Share Tech Mono',monospace; font-size:0.8rem; color:var(--cyan); letter-spacing:2px; margin-bottom:4px; }



  .rev-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:24px; margin-top:40px; }



  .rev-card { background:var(--glass); border:1px solid var(--glass-border); border-top:2px solid var(--cyan); padding:28px; border-radius:0 0 4px 4px; transition:all 0.3s; }



  .rev-card:hover { border-top-color:var(--cyan3); transform:translateY(-4px); box-shadow:var(--glow); }



  .rev-num { font-family:'Share Tech Mono',monospace; font-size:0.7rem; color:var(--cyan); letter-spacing:3px; margin-bottom:12px; }



  .team-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:40px; margin-top:48px; }



  .team-card { background:var(--glass); border:1px solid var(--glass-border); border-radius:4px; overflow:hidden; transition:all 0.3s; }



  .team-card:hover { border-color:rgba(0,212,255,0.4); box-shadow:var(--glow); transform:translateY(-4px); }



  .team-photo { width:100%; aspect-ratio:1.1/1; object-fit:cover; object-position:top center; border-bottom:1px solid var(--glass-border); }



  .team-info { padding:28px; }



  .team-name { font-family:'Rajdhani',sans-serif; font-size:1.25rem; font-weight:700; color:var(--white); margin-bottom:4px; }



  .team-title { font-family:'Share Tech Mono',monospace; font-size:0.7rem; color:var(--cyan); letter-spacing:1.5px; text-transform:uppercase; margin-bottom:16px; }



  .team-bio { font-size:0.9rem; color:rgba(232,244,255,0.7); line-height:1.7; }



  .roadmap-grid { display:grid; grid-template-columns:1fr 1fr; gap:40px; margin-top:40px; }



  .gate-card { background:var(--glass); border:1px solid var(--glass-border); border-radius:4px; padding:32px; }



  .gate-card.gate-active { border-color:rgba(0,212,255,0.4); box-shadow:var(--glow); }



  .gate-badge { display:inline-block; background:rgba(0,212,255,0.1); border:1px solid var(--cyan); color:var(--cyan); font-family:'Share Tech Mono',monospace; font-size:0.7rem; letter-spacing:2px; padding:4px 10px; margin-bottom:16px; }



  .gate-list { list-style:none; margin-top:16px; }



  .gate-list li { padding:6px 0; font-size:0.9rem; color:rgba(232,244,255,0.8); display:flex; align-items:flex-start; gap:10px; }



  .gate-list li::before { content:'✓'; color:var(--cyan); flex-shrink:0; font-family:'Share Tech Mono',monospace; }



  footer { background:#030712; border-top:1px solid var(--glass-border); padding:60px 40px; text-align:center; }



  footer .footer-logo { font-family:'Rajdhani',sans-serif; font-size:1.4rem; font-weight:700; color:var(--cyan); letter-spacing:3px; margin-bottom:20px; }



  footer p { color:var(--muted); font-size:0.85rem; }



  footer .footer-disclaimer { max-width:700px; margin:20px auto 0; font-size:0.75rem; color:rgba(122,156,191,0.6); line-height:1.6; }



  .fade-in { opacity:0; transform:translateY(30px); transition:opacity 0.7s ease,transform 0.7s ease; }



  .fade-in.visible { opacity:1; transform:translateY(0); }



  .hr { border:none; height:1px; background:linear-gradient(to right,transparent,var(--glass-border),transparent); margin:60px 0; }






    .ip-graphic-wrap { position: relative; width: 100%; max-width: 1000px; margin: 28px auto; }

    .ip-graphic-wrap img.ip-graphic { width: 100%; max-width: 100%; height: auto; margin: 0; display: block; border-radius: 10px; }
    /* generic enlargeable graphics */
    .zoom-wrap { position: relative; width: 100%; max-width: 1000px; margin: 36px auto; }
    .zoom-wrap > img.slide-img { width: 100%; max-width: 100%; margin: 0; display: block; }

    /* Clickable "Article" hotspots overlaid on the IP graphics. Positioned as
       percentages so they stay aligned with the buttons drawn in the image at
       any display size. */
    .ip-hotspot {
      position: absolute;
      display: block;
      z-index: 3;
      border-radius: 999px;
      cursor: pointer;
      /* invisible by default; the button is already painted in the image */
      background: transparent;
      transition: background 0.15s ease, box-shadow 0.15s ease;
    }
    .ip-hotspot:hover,
    .ip-hotspot:focus-visible {
      background: rgba(0,212,255,0.18);
      box-shadow: 0 0 0 2px rgba(0,212,255,0.55);
      outline: none;
    }

    .ip-enlarge-btn {

      position: absolute; top: 12px; right: 12px; z-index: 2;

      padding: 7px 14px; border: 1px solid var(--cyan); border-radius: 999px;

      background: rgba(0,20,30,0.8); color: var(--cyan);

      font-family: 'Share Tech Mono', monospace; font-size: 0.72rem;

      letter-spacing: 0.08em; font-weight: 600; cursor: pointer;

      backdrop-filter: blur(4px); transition: background 0.2s;

    }

    .ip-enlarge-btn:hover { background: rgba(0,212,255,0.2); }

    .ip-timeline-list { list-style: none; padding: 0; margin: 0 0 16px; }

    .ip-timeline-list li {

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

      gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--glass-border);

      font-size: 0.95rem; color: rgba(232,244,255,0.85);

    }

    .ip-timeline-list li:last-child { border-bottom: none; }

    .ip-timeline-text { flex: 1; }

    .ip-year { color: var(--cyan); font-family: 'Share Tech Mono', monospace; white-space: nowrap; }

    .ip-progression {

      font-family: 'Share Tech Mono', monospace; font-size: 0.75rem;

      color: var(--cyan); letter-spacing: 0.04em;

      background: rgba(0,212,255,0.06); border: 1px solid rgba(0,212,255,0.2);

      border-radius: 8px; padding: 12px 16px; margin: 16px 0; line-height: 1.8;

    }

    .ip-outposts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 16px; }

    .ip-outpost-card {

      background: rgba(0,212,255,0.05); border: 1px solid rgba(0,212,255,0.18);

      border-radius: 10px; padding: 16px;

    }

    .ip-outpost-card h4 {

      font-family: 'Share Tech Mono', monospace; font-size: 0.72rem; color: var(--cyan);

      letter-spacing: 0.1em; text-transform: uppercase; margin: 0 0 8px;

    }

    .ip-outpost-card p { font-size: 0.88rem; color: rgba(232,244,255,0.7); margin: 0 0 10px; line-height: 1.5; }

    .ip-article-link {

      display: inline-block; padding: 4px 12px;

      border: 1px solid var(--cyan); border-radius: 999px;

      color: var(--cyan); font-family: 'Share Tech Mono', monospace;

      font-size: 0.68rem; letter-spacing: 0.1em; text-decoration: none;

      transition: background 0.2s;

    }

    .ip-article-link:hover { background: rgba(0,212,255,0.15); }

    .ip-article-link.is-pending {

      opacity: 0.35; border-color: rgba(0,212,255,0.3); color: rgba(0,212,255,0.5);

      cursor: not-allowed; pointer-events: none;

    }

    .ip-intro-list { list-style: none; padding: 0; margin: 12px 0 16px; }

    .ip-intro-list li { padding: 7px 0; border-bottom: 1px solid var(--glass-border); font-size: 0.95rem; color: rgba(232,244,255,0.85); }

    .ip-intro-list li:last-child { border-bottom: none; }

    @media (max-width: 768px) {

      .ip-outposts { grid-template-columns: 1fr; }

      .ip-enlarge-btn { padding: 5px 10px; font-size: 0.65rem; }

    }

  


  .ip-modal {

    display: none; position: fixed; inset: 0; z-index: 9999;

    background: #02080d; align-items: center; justify-content: center;

  }

  .ip-modal.open { display: flex; }

  .ip-modal-stage { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } .ip-modal-stage .lb-img { width: 100%; height: 100%; display: block; border-radius: 6px; box-shadow: 0 10px 40px rgba(0,0,0,0.6); }

  .ip-close-btn {

    position: fixed; top: 14px; right: 18px; z-index: 10000;

    font-size: 32px; line-height: 1; color: #fff; background: none; border: none; cursor: pointer;

  }

  @media (max-width: 768px) and (orientation: portrait) {

    .ip-modal-stage { will-change: transform; }

  }


/* ---- multi-page additions ---- */
.nav-links a.active{color:var(--cyan);}
.nav-burger{display:none;background:none;border:1px solid var(--glass-border);color:var(--white);
  border-radius:8px;width:42px;height:38px;font-size:1.2rem;cursor:pointer;}
.ag-explore{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.ag-card{display:flex;flex-direction:column;gap:10px;padding:22px;border-radius:14px;position:relative;
  background:rgba(0,212,255,0.05);border:1px solid rgba(0,212,255,0.18);text-decoration:none;
  transition:transform .18s ease,border-color .18s ease,background .18s ease;}
.ag-card:hover{transform:translateY(-3px);border-color:var(--cyan);background:rgba(0,212,255,0.09);}
.ag-card-icon{position:absolute;top:11px;right:12px;width:15px;height:15px;color:var(--cyan);opacity:.85;}
.ag-card-icon svg{width:100%;height:100%;display:block;}
.ag-card-label{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:1.25rem;color:var(--white);letter-spacing:.5px;padding-right:24px;}
.ag-card-blurb{font-size:.92rem;color:rgba(232,244,255,0.7);line-height:1.5;}
.ag-card-go{font-family:'Share Tech Mono',monospace;font-size:.72rem;letter-spacing:.1em;color:var(--cyan);margin-top:auto;}
@media(max-width:900px){.ag-explore{grid-template-columns:1fr;}
  .nav-burger{display:block;}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;
    background:rgba(2,8,13,0.97);border-bottom:1px solid var(--glass-border);padding:10px 18px;}
  .nav-links.open{display:flex;}
}
