* { margin:0; padding:0; box-sizing:border-box; }
body {
  background:#000;
  color:#ffd700;
  font-family:'Courier New', monospace;
  min-height:100vh;
  overflow-x:hidden;
  position:relative;
}

.wave-bg {
  position:fixed;
  inset:0;
  z-index:-2;
  background:repeating-linear-gradient(45deg, #000, #111 10px);
}
.wave {
  position:absolute;
  width:600%;
  height:600%;
  background:radial-gradient(circle at 0% 100%, rgba(255,215,0,0.12) 0%, transparent 80%);
  animation:wave 45s linear infinite;
  opacity:0.6;
}
@keyframes wave { 0% { transform:translateX(0) rotate(0deg); } 100% { transform:translateX(-16.67%) rotate(360deg); } }

.container {
  max-width:2000px;
  margin:0 auto;
  padding:100px 40px 140px;
  position:relative;
  z-index:2;
}

.logo-container { text-align:center; margin-bottom:40px; }
.logo {
  width:180px; /* মিডিয়াম সাইজ */
  height:auto;
  border-radius:50%;
  box-shadow:0 0 60px #ffd700aa;
  animation:shake 0.5s infinite alternate, glitch 5s infinite;
}
@keyframes shake { 0% { transform:translate(0,0); } 100% { transform:translate(2px, -2px); } }
@keyframes glitch {
  0% { clip:rect(0,9999px,0,0); }
  5% { clip:rect(10px,9999px,20px,0); transform:skew(0.5deg); }
  10% { clip:rect(30px,9999px,40px,0); transform:skew(-0.5deg); }
  100% { clip:rect(0,9999px,0,0); }
}

header { text-align:center; margin-bottom:60px; }
h1 {
  font-size:4.5rem;
  font-weight:900;
  letter-spacing:8px;
  background:linear-gradient(90deg, #ffd700, #ffd70077);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}
.subtitle { font-size:1.4rem; color:#ffd700aa; margin-top:15px; opacity:0.9; }

.search-container {
  max-width:1000px;
  margin:0 auto 80px;
}
#searchInput {
  width:100%;
  padding:18px 28px;
  font-size:1.3rem;
  background:rgba(255,215,0,0.05);
  border:2px solid rgba(255,215,0,0.5);
  border-radius:18px;
  color:#ffd700;
  outline:none;
  transition:all 0.4s ease;
}
#searchInput:focus {
  border-color:#ffd700;
  box-shadow:0 0 45px rgba(255,215,0,0.6);
  background:rgba(255,215,0,0.2);
}

.tool-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); /* মিডিয়াম টুল কার্ড সাইজ */
  gap:30px;
}

.tool-card {
  background:rgba(255,215,0,0.03);
  border:1px solid rgba(255,215,0,0.45);
  border-radius:20px;
  padding:30px 20px;
  text-align:center;
  cursor:pointer;
  transition:all 0.4s ease;
  backdrop-filter:blur(8px);
  box-shadow:0 8px 30px rgba(0,0,0,0.8);
}
.tool-card:hover {
  transform:translateY(-12px) scale(1.03);
  border-color:#ffd700;
  box-shadow:0 0 70px rgba(255,215,0,0.7);
  background:rgba(255,215,0,0.22);
}
.tool-card i {
  font-size:3rem; /* মিডিয়াম আইকন */
  color:#ffd700;
  margin-bottom:20px;
  transition:all 0.4s;
}
.tool-card:hover i { transform:scale(1.15) rotate(8deg); }
.tool-card h3 {
  color:#ffd700;
  font-size:1.4rem;
  margin:12px 0 8px;
}
.tool-card p {
  color:#ffe4b5;
  font-size:1rem;
  opacity:0.9;
  line-height:1.5;
}

footer {
  text-align:center;
  margin-top:120px;
  padding:50px 0;
}
.join-btn {
  display:inline-block;
  background:linear-gradient(135deg, #25D366, #128C7E);
  color:white;
  padding:14px 40px;
  border-radius:50px;
  text-decoration:none;
  font-weight:700;
  font-size:1.3rem;
  box-shadow:0 8px 40px rgba(37,211,102,0.7);
  transition:all 0.4s;
}
.join-btn:hover {
  transform:translateY(-6px);
  box-shadow:0 15px 60px rgba(37,211,102,0.9);
}
.copyright { margin-top:30px; color:#333; font-size:1rem; }