/* Reset & Basic */
* { margin:0; padding:0; box-sizing:border-box; font-family: 'Poppins', sans-serif; }
body { background: linear-gradient(135deg, #f0f0f0, #e6e6ff); color: #333; }

/* Header */
header { display:flex; justify-content:space-between; padding:20px 50px; background:#fff; box-shadow:0 5px 15px rgba(0,0,0,0.1); position:sticky; top:0; z-index:1000; }
header .logo { font-weight:700; font-size:24px; color:#4B0082; }
header nav ul { list-style:none; display:flex; gap:20px; }
header nav ul li a { text-decoration:none; color:#333; font-weight:500; transition:0.3s; }
header nav ul li a:hover { color:#4B0082; }

/* Hero */
#hero { display:flex; justify-content:center; align-items:center; height:90vh; position:relative; text-align:center; overflow:hidden; perspective:1000px; }
#hero .hero-content { z-index:2; }
#hero h1 { font-size:48px; color:#4B0082; margin-bottom:20px; }
#hero p { font-size:20px; margin-bottom:30px; }
#hero .btn { padding:15px 30px; background:#4B0082; color:#fff; border:none; border-radius:8px; font-size:18px; cursor:pointer; transition:0.3s; }
#hero .btn:hover { background:#6a00b8; transform:scale(1.05); }

/* Coins */
.hero-animation { position:absolute; top:0; left:0; width:100%; height:100%; pointer-events:none; overflow:hidden; }
.coin { position:absolute; font-size:40px; font-weight:bold; color:#FFD700; text-shadow:0 0 10px rgba(255,215,0,0.8); transform-style:preserve-3d; }

/* Tools Section */
#tools { padding:100px 50px; text-align:center; }
.tool-cards { display:grid; grid-template-columns:repeat(auto-fit, minmax(250px,1fr)); gap:30px; margin-top:50px; }
.tool-card { background:#fff; padding:30px; border-radius:15px; box-shadow:0 10px 20px rgba(0,0,0,0.1); transition:0.3s; }
.tool-card:hover { transform: translateY(-10px); box-shadow:0 15px 25px rgba(0,0,0,0.2); }
.tool-card h3 { margin-bottom:20px; color:#4B0082; }
.tool-card input, .tool-card select { width:100%; padding:10px; margin-bottom:15px; border:1px solid #ccc; border-radius:8px; }
.tool-card button { padding:10px 20px; background:#4B0082; color:#fff; border:none; border-radius:8px; cursor:pointer; transition:0.3s; }
.tool-card button:hover { background:#6a00b8; }

/* Content Section */
#content { padding:100px 50px; max-width:1000px; margin:auto; line-height:1.8; color:#333; }
#content h2 { color:#4B0082; margin-bottom:30px; text-align:center; }

/* Footer */
footer { background:#4B0082; color:#fff; padding:40px 50px; text-align:center; }
footer ul { list-style:none; display:flex; justify-content:center; gap:20px; margin-top:15px; }
footer ul li a { color:#fff; text-decoration:none; }
footer ul li a:hover { text-decoration:underline; }
