/* General Styles */
body {
  font-family: 'Poppins', Arial, sans-serif;
  margin: 0;
  padding: 0;
  background: #4b3fa7;
}

.hero-section {
  /* Remove background color and set background image */
  background: url('img/banner.jpg') center center/cover no-repeat;
  position: relative;
  overflow: hidden;
}
.hero-section::before {
  content: '';
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(40, 30, 80, 0.65); /* dark overlay for readability */
  z-index: 1;
}
.hero-section .container,
.hero-section .row {
  position: relative;
  z-index: 2;
}
.hero-section h1 {
  font-size: 2.5rem;
  line-height: 1.1;
}
.hero-section h2 {
  font-size: 2.1rem;
}
.hero-section .btn {
  font-size: 1.3rem;
  padding: 0.5rem 2rem;
}
.hero-img {
  max-width: 90%;
  min-width: 250px;
  max-height: 400px;
  /* box-shadow removed for transparent background */
}

.bubble-bg {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  pointer-events: none;
  z-index: 1;
  background: url("data:image/svg+xml;utf8,<svg width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'><circle cx='10%' cy='20%' r='30' fill='white' fill-opacity='0.07'/><circle cx='80%' cy='30%' r='20' fill='white' fill-opacity='0.07'/><circle cx='50%' cy='80%' r='40' fill='white' fill-opacity='0.07'/><circle cx='70%' cy='60%' r='25' fill='white' fill-opacity='0.07'/><circle cx='30%' cy='70%' r='15' fill='white' fill-opacity='0.07'/></svg>");
  background-repeat: no-repeat;
  background-size: cover;
}

/* Bundle Offer Section */
.bundle-section {
  background: #564fb3;
}
.bundle-section h1 {
  font-size: 3.2rem;
}
.bundle-section .btn-success {
  font-size: 1.1rem;
  padding: 0.5rem 2rem;
}
.bundle-section img {
  max-width: 400px;
}

/* Services Section */
.card.border-success {
  border-width: 2px !important;
  border-radius: 16px;
  transition: box-shadow 0.3s;
}
.card.border-success:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}
.card-body img {
  height: 70px;
}

/* Best TV Packages Section */
.best-tv-packages-title {
  letter-spacing: 1px;
}
.best-tv-packages-hr {
  width: 220px;
  border: 1.5px solid #00d2b8;
  opacity: 1;
}
.best-tv-packages-quote {
  font-size: 2.5rem;
  margin-right: 10px;
  color: #222;
}
.best-tv-packages-text {
  font-size: 1.1rem;
  max-width: 600px;
}

/* Contact Section */
.contact-section {
  background: #4b3fa7;
  position: relative;
}
.contact-section .card {
  background: rgba(76,63,167,0.92);
  border: 1.5px solid #fff;
}
.contact-section h2 {
  text-decoration: underline;
}
.contact-section .btn-success {
  font-size: 1.1rem;
  border-radius: 30px;
}
.contact-section p {
  font-size: 0.98rem;
  opacity: 0.8;
}

/* Footer */
footer {
  font-size: 14px;
  opacity: 0.8;
}

/* Responsive Styles */
@media (max-width: 991px) {
  .hero-section {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .hero-section h1 {
    font-size: 2rem;
  }
  .hero-section h2 {
    font-size: 1.2rem;
  }
  .hero-img {
    max-width: 100%;
    max-height: 250px;
  }
  .bundle-section h1 {
    font-size: 2rem;
  }
}
