@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root{
  --ink:#0B0E14;
  --ink-soft:#0F1420;
  --card:#141A24;
  --card-hover:#182030;
  --border:#232B3A;
  --text:#ECEEF3;
  --muted:#8B95A7;
  --amber:#F2A93B;
  --amber-dim:#7A5A26;
  --teal:#35D0BA;
  --green:#34D399;
}

*{ scroll-behavior:smooth; }

body{
  background-color:var(--ink);
  color:var(--text);
  font-family:'Inter',sans-serif;
}

.font-display{ font-family:'Space Grotesk',sans-serif; }
.font-mono{ font-family:'JetBrains Mono',monospace; }

/* clean ambient gradient wash used behind hero / CTA sections — no grid, no dots */
.circuit-bg{
  background-image:
    radial-gradient(ellipse 900px 500px at 10% 0%, rgba(242,169,59,0.10), transparent 60%),
    radial-gradient(ellipse 900px 500px at 90% 100%, rgba(53,208,186,0.08), transparent 60%);
  background-color:var(--ink);
}

.dotted-rule{
  background-image:linear-gradient(90deg, var(--border) 40%, transparent 0%);
  background-position:top;
  background-size:8px 1px;
  background-repeat:repeat-x;
  height:1px;
}

/* blinking terminal-style cursor */
.cursor-blink::after{
  content:"";
  display:inline-block;
  width:7px;
  height:1em;
  margin-left:4px;
  background:var(--amber);
  vertical-align:text-bottom;
  animation:blink 1.1s steps(1) infinite;
}
@keyframes blink{ 50%{ opacity:0; } }

/* scanning line inside the status panel */
.scanline{
  position:absolute;
  left:0; right:0; height:2px;
  background:linear-gradient(90deg, transparent, rgba(242,169,59,0.6), transparent);
  animation:scan 3.2s ease-in-out infinite;
}
@keyframes scan{
  0%{ top:6%; opacity:0; }
  10%{ opacity:1; }
  50%{ top:94%; opacity:1; }
  60%{ opacity:0; }
  100%{ top:94%; opacity:0; }
}

.status-dot{
  width:8px; height:8px; border-radius:9999px;
  background:var(--green);
  box-shadow:0 0 0 0 rgba(52,211,153,0.6);
  animation:pulse 2s infinite;
}
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(52,211,153,0.5); }
  70%{ box-shadow:0 0 0 8px rgba(52,211,153,0); }
  100%{ box-shadow:0 0 0 0 rgba(52,211,153,0); }
}

.fade-up{
  opacity:0;
  transform:translateY(14px);
  animation:fadeUp .7s ease forwards;
}
@keyframes fadeUp{ to{ opacity:1; transform:translateY(0); } }

::selection{ background:var(--amber); color:var(--ink); }

/* mobile nav */
#mobile-menu{ max-height:0; overflow:hidden; transition:max-height .35s ease; }
#mobile-menu.open{ max-height:420px; }

.nav-link{ position:relative; color:var(--muted); transition:color .2s ease; }
.nav-link:hover{ color:var(--text); }
.nav-link.active{ color:var(--text); }
.nav-link.active::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-6px; height:2px;
  background:var(--amber);
}

.card-hover{ transition:border-color .25s ease, transform .25s ease, background-color .25s ease; }
.card-hover:hover{ border-color:var(--amber-dim); transform:translateY(-3px); background-color:var(--card-hover); }

.btn-primary{
  background:var(--amber); color:#1A1300;
  transition:filter .2s ease, transform .2s ease;
}
.btn-primary:hover{ filter:brightness(1.08); transform:translateY(-1px); }

.btn-outline{
  border:1px solid var(--border); color:var(--text);
  transition:border-color .2s ease, background-color .2s ease;
}
.btn-outline:hover{ border-color:var(--amber); background-color:rgba(242,169,59,0.06); }