body {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  background: #fffafc;
  color: #444;
}

.hero {
  background: linear-gradient(135deg, #ffe3f3, #fff1d6, #e7d4ff);
  padding: 120px 20px;
  text-align: center;
}
.hero h1 { font-size: 2.4rem; font-weight: 700; color: #8a5f9e; }
.tagline { font-size: 1.2rem; margin: 10px 0 20px; }
.cta {
  background: #ffb6d9; padding: 15px 30px; border-radius: 50px; text-decoration: none;
  font-weight: 600; display: inline-block; transition: 0.3s;
}
.cta:hover { transform: scale(1.05); box-shadow: 0 0 15px #ffb6d9; }

.about { padding: 60px 20px; max-width: 700px; margin: auto; text-align: center; }

.subjects { background: #fff6fd; padding: 60px 20px; }
.bubble-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px;
}
.bubble {
  padding: 25px; border-radius: 25px; background: #fff; text-align: center;
  box-shadow: 0 0 12px rgba(255, 215, 0, 0.3);
}
.gold { border: 2px solid gold; background: #fffdf5; }

.pricing { padding: 60px 20px; text-align: center; }
.price-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px;
}
.price-card { padding: 25px; border-radius: 20px; background: #fffef8; }
.gold-border { border: 2px solid gold; }
.highlight { box-shadow: 0 0 20px gold; }
.platforms { margin-top: 15px; font-style: italic; }

.contact { padding: 60px 20px; background: #fff6fb; text-align: center; }
form {
  max-width: 600px; margin: auto; display: flex; flex-direction: column; gap: 15px;
}
input, textarea, select { padding: 15px; border-radius: 10px; border: 1px solid #ffd2ea; }
.pink-btn {
  background: pink; padding: 15px; border-radius: 50px; border: none;
  font-size: 1.1rem; font-weight: bold; cursor: pointer; transition: 0.3s;
}
.pink-btn:hover { transform: scale(1.07); box-shadow: 0 0 15px pink; }

footer { padding: 20px; text-align: center; background: #fff1f8; }
