/* Reset & Body */
* { box-sizing: border-box; margin:0; padding:0; }
body {
  font-family: 'Orbitron', monospace;
  background: linear-gradient(135deg,#0f0f0f,#111111);
  color:#14f195;
  perspective: 1000px;
  overflow-x: hidden;
  line-height:1.2;
}
/* Sections */
section { min-height: 80vh; display:flex; align-items:flex-start; justify-content:center; padding-top:20px; }

/* Container */
.container {
  max-width:500px;
  margin:auto;
  text-align:center;
  padding:20px;
  border-radius:16px;
  border:2px solid #14f195;
  background: rgba(20,241,149,0.05);
  box-shadow:0 0 20px rgba(20,241,149,0.3);
}

/* Logo */
#logo {
  font-size:4rem;
  font-weight:bold;
  color:#14f195;
  text-shadow:0 0 5px #14f195,0 0 20px #0ff,0 0 40px #0ff;
  animation: glow 2s infinite alternate;
  margin-bottom:20px;
}
@keyframes glow {
  0% {text-shadow:0 0 10px #14f195,0 0 30px #0ff,0 0 60px #0ff;}
  100% {text-shadow:0 0 20px #14f195,0 0 50px #0ff,0 0 80px #0ff;}
}

/* Buttons */
.btn {
  padding:0.8rem 1.5rem;
  font-size:1.1rem;
  font-weight:bold;
  border:none;
  border-radius:12px;
  cursor:pointer;
  transition: all 0.3s ease;
  box-shadow:0 4px 12px rgba(0,0,0,0.2);
  margin:6px 0;
}
.connect { background:#14f195; color:#0f0f0f; }
.connect:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(20,241,149,0.7);}
.pay { background:#ff4d4d; color:#fff;}
.pay:disabled { background:#555; cursor:not-allowed; box-shadow:none;}
.pay:hover:enabled { transform:translateY(-2px); box-shadow:0 6px 20px rgba(255,77,77,0.7); }

/* Input */
input {
  padding:0.7rem 1rem;
  margin:6px 0;
  font-size:1rem;
  width:120px;
  border-radius:8px;
  border:2px solid #14f195;
  background: rgba(0,0,0,0.5);
  color:#14f195;
  text-align:center;
  outline:none;
  transition: all 0.2s ease;
}
input:focus { border-color:#0ff; box-shadow:0 0 12px #0ff; }

/* Text Sections */
h2 { font-size:1.8rem; margin:12px 0; text-shadow:0 0 5px #14f195; }
p { font-size:1rem; line-height:1.3; color:#fff; margin:6px 0; }
.small-text { font-size:0.85rem; opacity:0.8; margin-top:4px; }

/* Parallax Info */
.info-section { transform-style: preserve-3d; }
.info-container { transform: translateZ(0); transition: transform 0.2s ease-out; }

/* Footer */
.footer p { font-size:0.9rem; opacity:0.7; margin-top:10px; }

/* Responsive / Mobile-First */
@media(max-width:500px){
  section { min-height:70vh; padding-top:10px; }
  #logo { font-size:3rem; margin-bottom:10px; }
  input { width:100px; font-size:0.95rem; }
  .btn { width:90%; font-size:1rem; padding:0.7rem; margin:4px 0; }
  h2 { font-size:1.5rem; }
  p { font-size:0.95rem; line-height:1.2; }
}
