@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@600;700&family=DM+Mono:wght@300;400&display=swap');

:root {
  /* Colors */
  --bg:        #07090c;
  --surface:   #0f1318;
  --surface2:  #161c24;
  --border:    rgba(255, 255, 255, 0.07);
  --accent:    #00f5a0;
  --accent2:   #00c8ff;
  --red:       #ff4d4d;

  /* Text — fixed for readability */
  --text:      #f0f4f8;
  --text-sub:  #a0aec0;
  --muted:     #6b7a99;

  /* Fonts */
  --font-display: 'Rajdhani', sans-serif;
  --font-mono:    'DM Mono', monospace;

  /* Radii */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-pill: 100px;
}

*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
}

body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-mono);
  line-height: 1.6;
  min-height: 100vh;
  min-height: 100dvh;
  overflow-x: hidden;
}

/* Background grid */
.bg-grid {
  position: fixed;
  inset: 0;
  opacity: .04;
  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: 32px 32px;
  pointer-events: none;
  z-index: 0;
}

.bg-glow {
  position: fixed;
  width: 100%;
  max-width: 500px;
  height: 300px;
  background: radial-gradient(ellipse, rgba(0,245,160,.1) 0%, transparent 70%);
  top: 10%;
  left: 50%;
  transform: translateX(-50%);
  pointer-events: none;
  z-index: 0;
}

/* Typography */
h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.2;
  color: var(--text);
}

p {
  color: var(--text-sub);
  line-height: 1.8;
}

/* Universal logo style */
.logo {
  font-family: var(--font-display);
  font-weight: 700;
  display: inline-block;
  background: linear-gradient(90deg, #00f5a0, #00c8ff) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  letter-spacing: -0.5px;
}