/* Color palette */
:root{
  --bg: #000000;
  --text: #EFEFEF;
  --gold: #FFD700;
  --data: #00CED1;
  /* Increased contrast: use slightly lighter muted value (keeps visual hierarchy but improves readability) */
  --muted: rgba(255, 255, 255, 0.493);
}

/* Base layout */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family: "IBM Plex Mono", Menlo, Monaco, "Courier New", monospace;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.55;
}

.terminal{
  max-width:900px;
  margin:36px auto;
  padding:36px 42px;
  border-left:2px solid rgba(255,255,255,0.03);
  border-right:2px solid rgba(255,255,255,0.03);
  position:relative;
}

.doc-header h1{
  margin:0 0 8px 0;
  font-size:20px;
  letter-spacing:0.06em;
}
.doc-header .meta{color:var(--muted);margin:6px 0 18px 0;font-size:13px}

.gold{color:var(--gold);font-weight:700}
.data{color:var(--data);font-weight:600}
.muted{color:var(--muted)}

.lede .lead{margin:8px 0 18px 0;color:var(--muted);font-size:15px}

.section{margin:18px 0;padding:0}
.section h2{margin:0 0 10px 0;font-size:15px}
.section ul,.section ol{margin:0 0 0 18px;padding:0}
.section li{margin:8px 0}

.mandate{
  margin:22px 0;padding:14px;border-left:3px solid var(--gold);background:rgba(255,215,0,0.02);
}
.mandate h3{margin:0 0 8px 0}
.mandate-text{margin:0 0 8px 0;color:var(--muted)}

.citations .data{display:inline-block;padding:2px 6px;border-radius:4px;background:rgba(0,206,209,0.06);color:var(--data)}

.footer{margin-top:28px;color:var(--muted);font-size:12px}

/* Cursor */
.cursor-line{position:fixed;left:48px;bottom:28px;pointer-events:none}
.cursor{color:var(--text);opacity:0.85;display:inline-block;animation:blink 1.2s steps(2,end) infinite}
@keyframes blink{50%{opacity:0}} 

/* Scanline overlay */
body::after{
  content:"";
  position:fixed;left:0;top:0;right:0;bottom:0;
  pointer-events:none;
  background-image:repeating-linear-gradient(rgba(255,255,255,0.01) 0px, rgba(255,255,255,0.01) 1px, transparent 1px, transparent 3px);
  mix-blend-mode:overlay;opacity:0.18; /* reduced to improve text contrast */
  animation:scan 6s linear infinite;
}
@keyframes scan{from{transform:translateY(0)}to{transform:translateY(-4px)}}

/* Responsive */
@media (max-width:600px){
  .terminal{padding:20px;margin:18px}
}
:root{
  --bg: #080820;
  --text: #F0F0FF;
  --urgent: #FFA500;
  --cyan: #00D0FF;
  --muted: rgba(240, 240, 255, 0.507);
  --card: rgba(255,255,255,0.03);
  --glass: rgba(255,255,255,0.02);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: 'Futura', 'Trebuchet MS', Arial, sans-serif;
  background:var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
.page{max-width:1200px;margin:0 auto;padding:36px}
.nav{display:flex;justify-content:space-between;align-items:center;padding:8px 0}
.brand{font-weight:700;letter-spacing:1px}
.nav nav a{color:var(--text);text-decoration:none;margin-left:18px;opacity:0.9}
.nav nav a.cta{border:1px solid rgba(255,255,255,0.06);padding:8px 12px;border-radius:6px}

.hero{display:grid;grid-template-columns:1fr 380px;gap:28px;align-items:center;margin-top:28px}
.headline{font-size:28px;margin:0 0 12px}
.accent-cyan{color:var(--cyan);font-weight:800}
.tagline{color:rgba(240,240,255,0.86);max-width:640px}
.hero-actions{margin-top:18px;display:flex;gap:12px}
.btn{display:inline-block;padding:12px 18px;border-radius:10px;text-decoration:none;font-weight:700}
.btn-urgent{background:var(--urgent);color:#081018;box-shadow:0 6px 20px rgba(255,165,0,0.12);position:relative;transform:translateZ(0)}
.btn-urgent::after{content:"";position:absolute;inset:0;border-radius:10px;box-shadow:0 0 0 8px rgba(255,165,0,0.06);opacity:0.8}
.btn-urgent.pulse{animation:pulse 1.8s infinite}
@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.03)}100%{transform:scale(1)}}
.btn-ghost{background:transparent;border:1px solid rgba(255,255,255,0.06);color:var(--text)}

.hero-art{display:flex;justify-content:center}
.progress-card{width:320px;background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));border-radius:14px;padding:18px;backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,0.03)}
.ring{width:120px;height:120px;display:block;margin:0 auto}
.ring-bg{fill:none;stroke:rgba(255,255,255,0.03);stroke-width:12}
.ring-fg{fill:none;stroke-width:10;stroke-linecap:round;transform:rotate(-90deg);transform-origin:60px 60px;stroke-dasharray:327;stroke-dashoffset:200}
.metrics{display:flex;justify-content:space-between;align-items:center;margin-top:12px}
.metric{text-align:center}
.metric .number{font-size:22px;font-weight:800;color:var(--text)}
.metric.small .number{font-size:16px}
.metric .label{font-size:12px;color:rgba(240,240,255,0.6)}

.section{margin-top:44px;padding:26px;background:transparent;border-radius:10px}
.section-title{color:var(--cyan);font-size:16px;margin:0 0 18px}

.timeline{position:relative;padding:28px 0}
.timeline-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;align-items:center}
.step{display:flex;flex-direction:column;align-items:center;gap:8px}
.dot{width:14px;height:14px;border-radius:50%;background:rgba(255,255,255,0.06)}
.step.done .dot{background:linear-gradient(90deg,var(--cyan),#00a8e6);box-shadow:0 6px 20px rgba(0,208,255,0.06)}
.step.in-progress .dot{background:var(--cyan);box-shadow:0 6px 24px rgba(0,208,255,0.12);transform:scale(1.08)}
.step .meta{font-size:13px;text-align:center;color:rgba(240,240,255,0.9)}
.step .meta span{display:block;color:rgba(240,240,255,0.6);font-size:12px}
.timeline-line{position:absolute;left:6%;right:6%;top:50%;height:3px;background:linear-gradient(90deg,rgba(0,208,255,0.12),transparent)}

.mission-text{color:rgba(240,240,255,0.9);max-width:960px}
.mission-points{margin-top:18px;list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mission-points li{background:var(--card);padding:12px;border-radius:10px;color:var(--text);font-size:13px}

.team-grid{display:flex;gap:12px}
.card{display:flex;align-items:center;gap:12px;background:var(--glass);padding:12px;border-radius:10px;width:220px}
.avatar{width:44px;height:44px;border-radius:8px;background:linear-gradient(90deg,var(--cyan),#007bb2);display:flex;align-items:center;justify-content:center;font-weight:800}
.meta .name{font-weight:700}
.meta .role{font-size:12px;color:rgba(240,240,255,0.6)}

.footer{display:flex;justify-content:space-between;align-items:center;margin-top:48px;color:rgba(240,240,255,0.6);font-size:13px}
.link{color:var(--urgent);text-decoration:none;font-weight:700}

@media (max-width:900px){
  .hero{grid-template-columns:1fr;gap:18px}
  .hero-art{order:-1}
  .mission-points{grid-template-columns:1fr}
  .timeline-grid{grid-template-columns:repeat(2,1fr)}
}
