
/* ===================================================================Mahadev Betting App Start=========================================================== */
/* Hero Section */
.mahadev-app-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-app-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-app-hero-text strong {
  color: var(--inputBorder);
}
.mahadev-app-badges {
  display: flex;
  gap: 20px;
  justify-content: center;
  margin-top: 2rem;
}
.app-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background-color: #000;
  border: 1px solid #444;
  border-radius: 50px;
  padding: 12px 25px;
  color: #fff;
  text-decoration: none;
  transition: all 0.3s ease;
}
.app-badge:hover {
  border-color: var(--inputBorder);
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(249, 176, 53, 0.2);
}
.app-badge i {
  font-size: 1.5rem;
}

/* Why Choose Section */
.mahadev-app-why {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-app-why-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-top: 50px;
}
.mahadev-app-why-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  transition: all 0.3s ease;
  box-shadow: 0 10px 25px rgba(0,0,0,0.4);
  text-align: center;
}
.mahadev-app-why-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.why-icon {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 20px;
}
.mahadev-app-why-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.mahadev-app-why-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Download Section */
.mahadev-app-download {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-app-download-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 50px;
}
.mahadev-app-download-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  margin-bottom: 40px;
}
.download-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 40px 30px;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.download-icon {
  font-size: 3rem;
  color: var(--inputBorder);
  text-align: center;
  margin-bottom: 20px;
}
.download-card h3 {
  font-size: 1.8rem;
  font-weight: 600;
  color: #fff;
  text-align: center;
  margin-bottom: 25px;
  border-bottom: 1px dashed #444;
  padding-bottom: 10px;
}
.download-card ol {
  margin: 0 0 30px 20px;
  color: #ccc;
  line-height: 1.8;
}
.download-card ol li {
  margin-bottom: 8px;
}
.download-btn {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-weight: 600;
  padding: 12px 30px;
  border-radius: 50px;
  text-decoration: none;
  transition: all 0.3s ease;
  border: 2px solid var(--inputBorder);
}
.download-btn i {
  margin-right: 8px;
}
.download-btn:hover {
  background-color: transparent;
  color: var(--inputBorder);
}
.mahadev-app-download-note {
  font-size: 1.1rem;
  color: var(--inputBorder);
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Key Features Section */
.mahadev-app-keyfeatures {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-app-features-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px;
  margin-top: 50px;
}
.mahadev-app-features-grid .feature-item {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 30px;
  transition: all 0.3s ease;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 15px;
}
.mahadev-app-features-grid .feature-item:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.feature-icon {
  font-size: 2rem;
  color: var(--inputBorder);
  background: rgba(249,176,53,0.1);
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.feature-item h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin: 0;
}
.feature-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
  margin: 0;
}

/* Security Section */
.mahadev-app-security {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-app-security-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.security-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 800px;
  margin: 0 auto;
}
.security-item {
  display: flex;
  align-items: center;
  gap: 20px;
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 50px;
  padding: 15px 25px;
}
.security-item i {
  font-size: 2rem;
  color: var(--inputBorder);
}
.security-item span {
  font-size: 1.1rem;
  color: #ddd;
}
.mahadev-app-security-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
  max-width: 900px;
  margin: 40px auto 0;
}

/* Boost Experience Section */
.mahadev-app-boost {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.boost-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  margin: 50px 0;
}
.boost-item {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px;
  transition: all 0.3s ease;
}
.boost-item:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.boost-item h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.boost-item p {
  font-size: 1rem;
  line-height: 1.6;
  color: #ccc;
}
.boost-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* FAQ Section */
.mahadev-app-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 50px auto 0;
}
.faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA Section */
.mahadev-app-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.cta-text {
  font-size: 1.2rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 30px;
}
.cta-button {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.5rem;
  font-weight: 700;
  padding: 18px 50px;
  border-radius: 60px;
  text-decoration: none;
  border: 3px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 5px 20px rgba(249,176,53,0.3);
  margin-bottom: 30px;
}
.cta-button:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 10px 30px rgba(249,176,53,0.5);
}
.cta-badges {
  display: flex;
  gap: 20px;
  justify-content: center;
}

/* Responsive */
@media (max-width: 768px) {
  .mahadev-app-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-app-hero-text {
    font-size: 1rem;
  }
  .mahadev-app-badges,
  .cta-badges {
    flex-direction: column;
    align-items: center;
  }
  .mahadev-app-download-grid {
    grid-template-columns: 1fr;
  }
  .boost-grid {
    grid-template-columns: 1fr;
  }
  .faq-grid {
    grid-template-columns: 1fr;
  }
  .security-item {
    flex-direction: column;
    text-align: center;
    border-radius: 24px;
  }
}

/* ===================================================================Mahadev Betting App End =========================================================== */

/* ===================================================================Mahadev Book Id Start =========================================================== */

/* ===== Mahadev Book ID Landing Page Styles ===== */

/* Hero Section */
.mahadev-id-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-id-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-id-hero-cta {
  margin-top: 2rem;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}

/* What Is Section */
.mahadev-id-whatis {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-id-whatis-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px 60px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  position: relative;
  overflow: hidden;
}
.mahadev-id-whatis-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(to bottom, var(--inputBorder), #ffd966);
  opacity: 0.7;
}
.mahadev-id-whatis-card p {
  font-size: 1.1rem;
  line-height: 1.8;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.mahadev-id-whatis-card p:last-child {
  margin-bottom: 0;
}

/* Process Section */
.mahadev-id-process {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-id-process-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 50px;
}
.mahadev-id-steps-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  margin-bottom: 40px;
}
.mahadev-id-step-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 40px 30px 30px;
  position: relative;
  transition: all 0.3s ease;
  box-shadow: 0 10px 25px rgba(0,0,0,0.4);
}
.mahadev-id-step-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.2);
}
.mahadev-id-step-card .step-number {
  position: absolute;
  top: -20px;
  left: 30px;
  width: 50px;
  height: 50px;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.8rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 15px rgba(249,176,53,0.4);
}
.mahadev-id-step-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 10px 0 15px;
}
.mahadev-id-step-card p {
  font-size: 1rem;
  line-height: 1.6;
  color: #ccc;
}
.mahadev-id-step-card-full {
  grid-column: 1 / -1;
}
.mahadev-id-process-footer {
  font-size: 1.2rem;
  color: var(--inputBorder);
  text-align: center;
  font-weight: 600;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Verification Section */
.mahadev-id-verification {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-id-verification-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 25px;
  max-width: 1000px;
  margin: 40px auto;
}
.verification-item {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.verification-item:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.verification-item i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.verification-item p {
  font-size: 1rem;
  line-height: 1.5;
  color: #ddd;
}
.mahadev-id-verification-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
  max-width: 900px;
  margin: 0 auto;
}

/* Provider Section */
.mahadev-id-provider {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-id-provider-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.mahadev-id-provider-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.provider-cta {
  display: inline-block;
  background-color: transparent;
  color: var(--inputBorder);
  font-size: 1.2rem;
  font-weight: 600;
  padding: 12px 35px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  margin-top: 10px;
}
.provider-cta:hover {
  background-color: var(--inputBorder);
  color: #000;
}

/* Benefits Section */
.mahadev-id-benefits {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-id-benefits-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin: 40px 0;
}
.benefit-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.benefit-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.benefit-icon {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.benefit-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 10px;
}
.benefit-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.benefits-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
}
.benefits-footer a {
  color: var(--inputBorder);
  font-weight: 600;
  text-decoration: none;
}
.benefits-footer a:hover {
  text-decoration: underline;
}

/* Security Tips Section */
.mahadev-id-security {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.security-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.security-tips-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  max-width: 900px;
  margin: 0 auto 40px;
}
.tip-item {
  display: flex;
  align-items: center;
  gap: 15px;
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 50px;
  padding: 15px 25px;
  transition: all 0.3s ease;
}
.tip-item:hover {
  border-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.tip-badge {
  background-color: var(--inputBorder);
  color: #000;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}
.tip-item p {
  font-size: 1rem;
  color: #ddd;
  margin: 0;
}
.security-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* FAQ Section */
.mahadev-id-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-id-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-id-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-id-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-id-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-id-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA Section */
.mahadev-id-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-id-cta .cta-text {
  font-size: 1.2rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 20px;
}
.mahadev-id-cta .cta-button {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.5rem;
  font-weight: 700;
  padding: 18px 50px;
  border-radius: 60px;
  text-decoration: none;
  border: 3px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 5px 20px rgba(249,176,53,0.3);
  margin-top: 20px;
}
.mahadev-id-cta .cta-button:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 10px 30px rgba(249,176,53,0.5);
}

/* Responsive */
@media (max-width: 768px) {
  .mahadev-id-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-id-hero-text {
    font-size: 1rem;
  }
  .mahadev-id-whatis-card {
    padding: 35px 25px;
  }
  .mahadev-id-steps-grid {
    grid-template-columns: 1fr;
  }
  .security-tips-grid {
    grid-template-columns: 1fr;
  }
  .mahadev-id-faq .faq-grid {
    grid-template-columns: 1fr;
  }
  .mahadev-id-cta .cta-button {
    font-size: 1.2rem;
    padding: 15px 30px;
  }
}

@media (max-width: 480px) {
  .mahadev-id-whatis-card {
    padding: 25px 20px;
  }
  .mahadev-id-whatis-card p {
    font-size: 1rem;
  }
  .tip-item {
    flex-direction: column;
    text-align: center;
    border-radius: 24px;
  }
}
/* ===================================================================Mahadev Book Id End =========================================================== */

/* ===================================================================Mahadev Book Login Start =========================================================== */

/* ===== Mahadev Book Login Landing Page Styles ===== */

/* Hero Section */
.mahadev-login-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-login-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-login-hero-cta {
  display: flex;
  gap: 20px;
  justify-content: center;
  margin-top: 2rem;
  flex-wrap: wrap;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-secondary {
  display: inline-block;
  background-color: transparent;
  color: var(--inputBorder);
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
}
.cta-secondary:hover {
  background-color: var(--inputBorder);
  color: #000;
}

/* Importance Section */
.mahadev-login-importance {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-login-importance-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin: 40px 0;
}
.importance-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  transition: all 0.3s ease;
  text-align: center;
}
.importance-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.importance-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 20px;
}
.importance-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.importance-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.importance-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
  max-width: 1000px;
  margin: 30px auto 0;
}

/* Desktop & Mobile Login Steps */
.mahadev-login-desktop,
.mahadev-login-mobile {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-login-mobile {
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.login-steps-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.login-steps-card p {
  font-size: 1.1rem;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.login-steps-list {
  margin: 0 0 20px 25px;
  color: #ccc;
}
.login-steps-list li {
  font-size: 1rem;
  line-height: 1.8;
  margin-bottom: 10px;
}
.login-steps-list li::marker {
  color: var(--inputBorder);
  font-weight: bold;
}
.login-steps-card .note {
  font-style: italic;
  color: var(--inputBorder);
  margin-top: 20px;
  padding-top: 15px;
  border-top: 1px dashed #444;
}

/* Forgot Password */
.mahadev-login-forgot {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.forgot-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.forgot-card p {
  font-size: 1.1rem;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.forgot-steps {
  margin: 0 0 20px 25px;
  color: #ccc;
}
.forgot-steps li {
  font-size: 1rem;
  line-height: 1.8;
  margin-bottom: 10px;
}
.forgot-steps li::marker {
  color: var(--inputBorder);
  font-weight: bold;
}

/* Troubleshooting */
.mahadev-login-troubleshoot {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.troubleshoot-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.troubleshoot-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 25px;
  margin-bottom: 40px;
}
.trouble-item {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
}
.trouble-item:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.trouble-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 10px;
}
.trouble-item h3 i {
  margin-right: 8px;
}
.trouble-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.troubleshoot-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Security Section */
.mahadev-login-security {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.security-content {
  max-width: 900px;
  margin: 0 auto;
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  backdrop-filter: blur(5px);
}
.security-content p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.security-tips {
  display: flex;
  flex-direction: column;
  gap: 15px;
  margin: 30px 0;
}
.security-tips .tip {
  display: flex;
  align-items: center;
  gap: 15px;
  font-size: 1rem;
  color: #eee;
  background: rgba(255,255,255,0.02);
  padding: 10px 20px;
  border-radius: 50px;
  border: 1px solid #333;
}
.security-tips .tip i {
  color: var(--inputBorder);
  font-size: 1.2rem;
}
.security-footer {
  font-size: 1.1rem;
  color: var(--inputBorder);
  font-weight: 500;
  text-align: center;
  margin-top: 30px;
  padding-top: 20px;
  border-top: 1px dashed #444;
}

/* Responsible Gaming */
.mahadev-login-responsible {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.responsible-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.responsible-card p {
  font-size: 1.1rem;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.responsible-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin: 30px 0;
}
.responsible-item {
  display: flex;
  align-items: center;
  gap: 15px;
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 50px;
  padding: 15px 20px;
  font-size: 1rem;
  color: #ddd;
}
.responsible-item i {
  color: var(--inputBorder);
  font-size: 1.3rem;
}

/* Customer Support */
.mahadev-login-support {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.support-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.support-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 0 auto 40px;
}
.support-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 40px 25px 35px;
  text-align: center;
  transition: all 0.3s ease;
  box-shadow: 0 10px 25px rgba(0,0,0,0.4);
  display: flex;
  flex-direction: column;
  height: 100%;
}
.support-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.support-card i {
  font-size: 3rem;
  color: var(--inputBorder);
  margin-bottom: 20px;
}
.support-card h3 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.support-card p {
  font-size: 1rem;
  line-height: 1.6;
  color: #ccc;
  margin-bottom: 20px;
  flex-grow: 1;
}
.support-card a {
  color: var(--inputBorder);
  text-decoration: none;
  font-weight: 600;
}
.support-card a:hover {
  text-decoration: underline;
}
.support-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* FAQ Section */
.mahadev-login-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-login-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-login-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-login-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-login-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-login-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA */
.mahadev-login-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-login-cta .cta-text {
  font-size: 1.2rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 20px;
}
.cta-buttons {
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 30px;
}

/* Responsive */
@media (max-width: 768px) {
  .mahadev-login-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-login-hero-text {
    font-size: 1rem;
  }
  .login-steps-card,
  .forgot-card,
  .responsible-card {
    padding: 35px 25px;
  }
  .support-grid {
    grid-template-columns: 1fr;
  }
  .responsible-list {
    grid-template-columns: 1fr;
  }
  .mahadev-login-faq .faq-grid {
    grid-template-columns: 1fr;
  }
  .cta-primary, .cta-secondary {
    font-size: 1.1rem;
    padding: 12px 30px;
  }
}

@media (max-width: 480px) {
  .login-steps-card,
  .forgot-card,
  .security-content,
  .responsible-card {
    padding: 25px 20px;
  }
  .login-steps-list,
  .forgot-steps {
    margin-left: 15px;
  }
  .responsible-item {
    flex-direction: column;
    text-align: center;
    border-radius: 24px;
  }
}

/* ===================================================================Mahadev Book Login End =========================================================== */

/* ===================================================================Mahadev Book Register Start =========================================================== */
/* ===== Mahadev Book Register Landing Page Styles ===== */

/* Hero Section */
.mahadev-reg-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-reg-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-reg-hero-cta {
  margin-top: 2rem;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}

/* Why Choose Section */
.mahadev-reg-why {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-reg-why-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 50px;
}
.mahadev-reg-why-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.why-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
  box-shadow: 0 10px 25px rgba(0,0,0,0.4);
}
.why-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.why-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 20px;
}
.why-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.why-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.mahadev-reg-why-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
  margin-bottom: 30px;
}
.mahadev-reg-cta-banner {
  text-align: center;
}

/* Steps Section */
.mahadev-reg-steps {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-reg-steps-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 50px;
}
.mahadev-reg-steps-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
  margin-bottom: 20px;
}
.reg-step-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 40px 30px 30px;
  position: relative;
  transition: all 0.3s ease;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.reg-step-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 25px 40px rgba(249,176,53,0.2);
}
.step-icon {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.reg-step-card .step-number {
  position: absolute;
  top: -15px;
  right: 30px;
  width: 40px;
  height: 40px;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.5rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 15px rgba(249,176,53,0.4);
}
.reg-step-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.reg-step-card p {
  font-size: 1rem;
  line-height: 1.6;
  color: #ccc;
}
.reg-step-card-full {
  grid-column: 1 / -1;
}

/* Requirements Section */
.mahadev-reg-requirements {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.requirements-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.requirements-card p {
  font-size: 1.1rem;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.requirements-list {
  display: flex;
  flex-direction: column;
  gap: 15px;
  margin: 30px 0;
}
.requirement-item {
  display: flex;
  align-items: center;
  gap: 15px;
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 50px;
  padding: 15px 25px;
}
.requirement-item i {
  color: var(--inputBorder);
  font-size: 1.3rem;
}
.requirement-item span {
  font-size: 1rem;
  color: #ddd;
}
.requirements-note {
  font-style: italic;
  color: var(--inputBorder);
  text-align: center;
  padding-top: 20px;
  border-top: 1px dashed #444;
}

/* Security Section */
.mahadev-reg-security {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.security-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.security-card p {
  font-size: 1.1rem;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.security-tips-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin-top: 30px;
}
.security-tip {
  display: flex;
  align-items: center;
  gap: 15px;
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 50px;
  padding: 15px 25px;
}
.security-tip i {
  color: var(--inputBorder);
  font-size: 1.3rem;
}
.security-tip span {
  font-size: 0.95rem;
  color: #ddd;
}

/* Troubleshooting Section */
.mahadev-reg-troubleshoot {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.troubleshoot-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.troubleshoot-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.troubleshoot-grid .trouble-item {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.troubleshoot-grid .trouble-item:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.troubleshoot-grid .trouble-item i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.troubleshoot-grid .trouble-item h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.troubleshoot-grid .trouble-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.troubleshoot-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Responsible Gaming Section */
.mahadev-reg-responsible {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.responsible-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.responsible-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.responsible-card p:last-child {
  margin-bottom: 0;
}

/* FAQ Section */
.mahadev-reg-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-reg-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-reg-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-reg-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-reg-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-reg-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA Section */
.mahadev-reg-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-reg-cta .cta-text {
  font-size: 1.2rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 20px;
}
.mahadev-reg-cta .cta-text strong {
  color: var(--inputBorder);
}
.cta-buttons {
  margin-top: 30px;
}

/* Responsive */
@media (max-width: 768px) {
  .mahadev-reg-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-reg-hero-text {
    font-size: 1rem;
  }
  .mahadev-reg-steps-grid {
    grid-template-columns: 1fr;
  }
  .requirements-card,
  .security-card,
  .responsible-card {
    padding: 35px 25px;
  }
  .security-tips-grid {
    grid-template-columns: 1fr;
  }
  .mahadev-reg-faq .faq-grid {
    grid-template-columns: 1fr;
  }
  .cta-primary {
    font-size: 1.1rem;
    padding: 12px 30px;
  }
}

@media (max-width: 480px) {
  .requirements-card,
  .security-card,
  .responsible-card {
    padding: 25px 20px;
  }
  .requirement-item {
    flex-direction: column;
    text-align: center;
    border-radius: 24px;
  }
  .security-tip {
    flex-direction: column;
    text-align: center;
    border-radius: 24px;
  }
}
/* ===================================================================Mahadev Book Register End =========================================================== */

/* ===================================================================Mahadev Book Whatsapp Start =========================================================== */
/* ===== Mahadev Book WhatsApp Number Landing Page Styles ===== */

/* Hero Section */
.mahadev-wa-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-wa-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-wa-hero-text strong {
  color: var(--inputBorder);
  font-size: 1.4rem;
}
.mahadev-wa-hero-cta {
  margin-top: 2rem;
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp i {
  margin-right: 10px;
  font-size: 1.5rem;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}
.cta-whatsapp-large {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.8rem;
  font-weight: 700;
  padding: 20px 50px;
  border-radius: 60px;
  text-decoration: none;
  border: 3px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 5px 20px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp-large i {
  margin-right: 15px;
  font-size: 2rem;
}
.cta-whatsapp-large:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 10px 30px rgba(37, 211, 102, 0.5);
}

/* What is Section */
.mahadev-wa-whatis {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-wa-whatis-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px 60px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  position: relative;
  overflow: hidden;
}
.mahadev-wa-whatis-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(to bottom, #25D366, #128C7E);
  opacity: 0.7;
}
.mahadev-wa-whatis-card p {
  font-size: 1.1rem;
  line-height: 1.8;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.mahadev-wa-whatis-card p:last-child {
  margin-bottom: 0;
}

/* Official Number Section */
.mahadev-wa-official {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-wa-official-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 800px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.wa-number-display {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-bottom: 20px;
}
.wa-number-display i {
  font-size: 4rem;
  color: #25D366;
}
.wa-number-display .number {
  font-size: 2.5rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: 1px;
}
.availability {
  font-size: 1.3rem;
  color: var(--inputBorder);
  margin-bottom: 20px;
  font-weight: 600;
}
.mahadev-wa-official-card p {
  font-size: 1.1rem;
  color: #ddd;
  margin-bottom: 30px;
}

/* Services Section */
.mahadev-wa-services {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.services-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 50px;
}
.mahadev-wa-services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 25px;
  margin-bottom: 40px;
}
.service-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.service-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.service-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.service-card h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: #fff;
  line-height: 1.4;
}
.services-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Why Prefer Section */
.mahadev-wa-why-prefer {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.prefer-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 50px;
}
.mahadev-wa-prefer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.prefer-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 20px;
  text-align: center;
  transition: all 0.3s ease;
}
.prefer-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.prefer-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.prefer-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 8px;
}
.prefer-card p {
  font-size: 1rem;
  color: #aaa;
}
.prefer-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Contact Number Section */
.mahadev-wa-contact-number {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.contact-number-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.contact-number-card p {
  font-size: 1.1rem;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.wa-number-large {
  background: rgba(37, 211, 102, 0.1);
  border: 2px solid #25D366;
  border-radius: 60px;
  padding: 20px 30px;
  margin: 30px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
}
.wa-number-large i {
  font-size: 3rem;
  color: #25D366;
}
.wa-number-large span {
  font-size: 1.5rem;
  color: #fff;
}
.wa-number-large strong {
  color: #25D366;
  font-size: 1.8rem;
}
.assistance-list {
  margin: 30px 0;
}
.assistance-list p {
  font-size: 1.2rem;
  color: #fff;
  margin-bottom: 15px;
}
.assistance-list ul {
  list-style: none;
  padding: 0;
}
.assistance-list li {
  display: flex;
  align-items: center;
  gap: 15px;
  font-size: 1rem;
  color: #ccc;
  margin-bottom: 12px;
  padding: 8px 15px;
  background: rgba(35,37,38,0.5);
  border-radius: 40px;
}
.assistance-list li i {
  color: #25D366;
  font-size: 1.2rem;
}
.players-trust {
  font-style: italic;
  color: var(--inputBorder);
  text-align: center;
  margin: 30px 0;
  padding: 15px;
  border-top: 1px dashed #444;
  border-bottom: 1px dashed #444;
}

/* Safety Section */
.mahadev-wa-safety {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.safety-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.safety-card p {
  font-size: 1.1rem;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.safety-card h3 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 30px 0 20px;
}
.safety-tips-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin: 30px 0;
}
.safety-tip {
  display: flex;
  align-items: center;
  gap: 15px;
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 50px;
  padding: 15px 20px;
}
.safety-tip i {
  color: #25D366;
  font-size: 1.3rem;
}
.safety-tip span {
  font-size: 1rem;
  color: #ddd;
}
.safety-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
  margin-top: 20px;
}

/* Get Started Section */
.mahadev-wa-getstarted {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.getstarted-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.getstarted-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.getstarted-card .cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  margin-top: 20px;
}
.getstarted-card .cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
}

/* Top Searches Section */
.mahadev-wa-searches {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.searches-cloud {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 15px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.search-tag {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 50px;
  padding: 10px 20px;
  font-size: 0.95rem;
  color: #ccc;
  transition: all 0.3s ease;
}
.search-tag:hover {
  border-color: var(--inputBorder);
  background: rgba(249,176,53,0.1);
  color: #fff;
  transform: translateY(-2px);
}

/* FAQ Section */
.mahadev-wa-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-wa-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-wa-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-wa-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: #25D366;
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-wa-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-wa-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.mahadev-wa-faq .faq-item strong {
  color: #25D366;
}

/* Final CTA Section */
.mahadev-wa-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-wa-cta .cta-text {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 800px;
  margin: 0 auto 40px;
}
.cta-buttons {
  margin-top: 20px;
}

/* Responsive */
@media (max-width: 768px) {
  .mahadev-wa-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-wa-hero-text {
    font-size: 1rem;
  }
  .mahadev-wa-hero-text strong {
    font-size: 1.2rem;
  }
  .wa-number-display {
    flex-direction: column;
    gap: 10px;
  }
  .wa-number-display .number {
    font-size: 1.8rem;
  }
  .wa-number-large {
    flex-direction: column;
    text-align: center;
    padding: 20px;
  }
  .wa-number-large span {
    font-size: 1.2rem;
  }
  .wa-number-large strong {
    font-size: 1.4rem;
  }
  .safety-tips-grid {
    grid-template-columns: 1fr;
  }
  .mahadev-wa-faq .faq-grid {
    grid-template-columns: 1fr;
  }
  .cta-whatsapp-large {
    font-size: 1.2rem;
    padding: 15px 30px;
  }
  .cta-whatsapp-large i {
    font-size: 1.5rem;
  }
  .cta-whatsapp {
    font-size: 1.1rem;
    padding: 12px 30px;
  }
}

@media (max-width: 480px) {
  .mahadev-wa-whatis-card {
    padding: 30px 20px;
  }
  .mahadev-wa-official-card,
  .contact-number-card,
  .safety-card,
  .getstarted-card {
    padding: 30px 20px;
  }
  .wa-number-display .number {
    font-size: 1.5rem;
  }
  .availability {
    font-size: 1.1rem;
  }
  .assistance-list li {
    flex-direction: column;
    text-align: center;
    border-radius: 24px;
  }
  .safety-tip {
    flex-direction: column;
    text-align: center;
    border-radius: 24px;
  }
}
/* ===================================================================Mahadev Book Whatsapp End =========================================================== */

/* ===================================================================MahadevBook Start =========================================================== */
/* ===== Mahadevbook Landing Page Styles ===== */

/* Hero Section */
.mahadev-mb-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-mb-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-mb-hero-cta {
  margin-top: 2rem;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
  margin-left: 15px;
}
.cta-whatsapp i {
  margin-right: 8px;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}

/* Mission Section */
.mahadev-mb-mission {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-mb-mission-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px 60px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.mahadev-mb-mission-card p {
  font-size: 1.1rem;
  line-height: 1.8;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.mahadev-mb-mission-card p:last-child {
  margin-bottom: 0;
}

/* Advantages Section */
.mahadev-mb-advantages {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.advantages-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 50px;
}
.mahadev-mb-advantages-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.advantage-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.advantage-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.advantage-icon {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.advantage-card h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: #fff;
  line-height: 1.4;
}
.advantages-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Trust Statement */
.mahadev-mb-trust {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-mb-trust-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.mahadev-mb-trust-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.mahadev-mb-trust-card p:last-child {
  margin-bottom: 0;
}

/* Games Section */
.mahadev-mb-games {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.games-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 50px;
}
.mahadev-mb-games-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.mahadev-mb-games-grid .game-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  transition: all 0.3s ease;
  text-align: center;
}
.mahadev-mb-games-grid .game-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.mahadev-mb-games-grid .game-card i {
  font-size: 3rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.mahadev-mb-games-grid .game-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 10px;
}
.mahadev-mb-games-grid .game-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.games-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Why Choose Section */
.mahadev-mb-why-choose {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.why-choose-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  margin-bottom: 40px;
}
.why-choose-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px;
  transition: all 0.3s ease;
}
.why-choose-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.why-choose-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.why-choose-card h3 i {
  font-size: 1.8rem;
}
.why-choose-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.why-choose-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Thousands Trust Section */
.mahadev-mb-thousands {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.thousands-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  margin-bottom: 40px;
}
.thousands-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px;
  transition: all 0.3s ease;
}
.thousands-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.thousands-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.thousands-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 10px;
}
.thousands-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.thousands-footer {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 40px;
  text-align: center;
}
.thousands-footer p:first-child {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.thousands-footer p:last-child {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
}

/* Trusted Detailed Section */
.mahadev-mb-trusted-detailed {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.trusted-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
}
.trusted-item {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px;
  transition: all 0.3s ease;
}
.trusted-item:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.trusted-item i {
  font-size: 2rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.trusted-item h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.trusted-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Evolution Section */
.mahadev-mb-evolution {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.evolution-content {
  max-width: 1000px;
  margin: 0 auto;
}
.evolution-content p {
  font-size: 1.05rem;
  line-height: 1.8;
  color: #ddd;
  margin-bottom: 1.5rem;
}

/* User Guide Section */
.mahadev-mb-guide {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.guide-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 50px;
}
.guide-steps-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
  margin-bottom: 40px;
}
.guide-step {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 40px 30px 30px;
  position: relative;
  transition: all 0.3s ease;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.guide-step:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 25px 40px rgba(249,176,53,0.2);
}
.guide-step .step-number {
  position: absolute;
  top: -20px;
  left: 30px;
  width: 50px;
  height: 50px;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.8rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 15px rgba(249,176,53,0.4);
}
.guide-step h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 10px 0 15px;
}
.guide-step p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ccc;
}
.guide-step-full {
  grid-column: 1 / -1;
}
.guide-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Testimonials Section */
.mahadev-mb-testimonials {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.testimonials-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 50px;
}
.testimonials-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-bottom: 40px;
}
.testimonial-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 40px 25px 25px;
  position: relative;
  transition: all 0.3s ease;
}
.testimonial-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.quote-icon {
  position: absolute;
  top: 15px;
  left: 20px;
  font-size: 2.5rem;
  color: var(--inputBorder);
  opacity: 0.3;
}
.testimonial-text {
  font-size: 0.95rem;
  line-height: 1.7;
  color: #ddd;
  font-style: italic;
  margin-bottom: 20px;
  position: relative;
  z-index: 1;
}
.testimonial-author {
  font-size: 1rem;
  color: #fff;
  border-top: 1px dashed #444;
  padding-top: 15px;
}
.testimonial-author strong {
  color: var(--inputBorder);
}
.testimonials-footer {
  font-size: 1.1rem;
  color: var(--inputBorder);
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* FAQ Section */
.mahadev-mb-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-mb-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-mb-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-mb-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-mb-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-mb-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA Section */
.mahadev-mb-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-mb-cta .cta-text {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 800px;
  margin: 0 auto 40px;
}
.mahadev-mb-cta .cta-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 992px) {
  .why-choose-grid,
  .thousands-grid,
  .trusted-grid,
  .guide-steps-grid,
  .testimonials-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .mahadev-mb-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-mb-hero-text {
    font-size: 1rem;
  }
  .mahadev-mb-mission-card {
    padding: 35px 25px;
  }
  .mahadev-mb-faq .faq-grid {
    grid-template-columns: 1fr;
  }
  .cta-whatsapp {
    margin-left: 0;
    margin-top: 15px;
  }
  .mahadev-mb-cta .cta-buttons {
    flex-direction: column;
    align-items: center;
  }
}
@media (max-width: 480px) {
  .mahadev-mb-mission-card {
    padding: 25px 20px;
  }
  .guide-step {
    padding: 35px 20px 20px;
  }
  .guide-step .step-number {
    left: 20px;
  }
}
/* ===================================================================MahadevBook End =========================================================== */

/* ===================================================================Mahadev Online Book Start =========================================================== */
/* ===== Mahadev Online Book Landing Page Styles ===== */

/* Hero Section */
.mahadev-ob-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-ob-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-ob-hero-cta {
  margin-top: 2rem;
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-secondary {
  display: inline-block;
  background-color: transparent;
  color: var(--inputBorder);
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
}
.cta-secondary:hover {
  background-color: var(--inputBorder);
  color: #000;
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp i {
  margin-right: 8px;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}

/* Why Choose Section */
.mahadev-ob-why {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-ob-why-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.mahadev-ob-why .why-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.mahadev-ob-why .why-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.mahadev-ob-why .why-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.mahadev-ob-why .why-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.mahadev-ob-why .why-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.why-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}
.why-footer a {
  color: var(--inputBorder);
  text-decoration: none;
}
.why-footer a:hover {
  text-decoration: underline;
}

/* Get Started Section */
.mahadev-ob-getstarted {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.getstarted-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 25px;
  max-width: 1000px;
  margin: 0 auto;
}
.getstarted-steps .step {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 20px;
  text-align: center;
  position: relative;
  transition: all 0.3s ease;
}
.getstarted-steps .step:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.step-num {
  width: 40px;
  height: 40px;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.5rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 15px;
}
.getstarted-steps .step p {
  font-size: 1rem;
  color: #ddd;
  line-height: 1.5;
}

/* Security Section */
.mahadev-ob-security {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.security-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.security-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.security-emphasis {
  color: var(--inputBorder);
  font-weight: 600;
  font-size: 1.2rem;
}

/* Responsible Betting Section */
.mahadev-ob-responsible {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.responsible-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.responsible-card p {
  font-size: 1.2rem;
  line-height: 1.7;
  color: #ddd;
}

/* About Section */
.mahadev-ob-about {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.about-content {
  max-width: 1000px;
  margin: 0 auto;
}
.about-content p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.about-content h3 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 30px 0 15px;
}

/* Features Section */
.mahadev-ob-features {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.features-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 30px;
  max-width: 1000px;
  margin: 0 auto;
}
.feature-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 20px;
  text-align: center;
  transition: all 0.3s ease;
}
.feature-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.feature-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.feature-card h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.feature-card p {
  font-size: 0.95rem;
  color: #ccc;
}

/* Cricket Section */
.mahadev-ob-cricket {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.cricket-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.cricket-card p {
  font-size: 1.2rem;
  line-height: 1.8;
  color: #ddd;
  font-style: italic;
}

/* Trust & Future Section */
.mahadev-ob-trust {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.trust-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
}
.trust-item {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px;
  transition: all 0.3s ease;
}
.trust-item:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.trust-item h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.trust-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Beginner's Guide Section */
.mahadev-ob-guide {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.guide-intro {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ccc;
  max-width: 900px;
  margin: 0 auto 20px;
}
.guide-quote {
  font-size: 1.2rem;
  font-style: italic;
  color: var(--inputBorder);
  text-align: center;
  margin: 30px 0;
  padding: 15px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}
.guide-section {
  margin-bottom: 40px;
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px;
}
.guide-section h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.guide-section p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 15px;
}
.guide-section ul, .guide-section ol {
  margin-left: 20px;
  margin-bottom: 15px;
  color: #ccc;
}
.guide-section li {
  margin-bottom: 8px;
}
.pro-tip {
  background: rgba(249,176,53,0.1);
  border-left: 4px solid var(--inputBorder);
  padding: 15px;
  border-radius: 8px;
  font-style: italic;
}
.safety-tip {
  background: rgba(37,211,102,0.1);
  border-left: 4px solid #25D366;
  padding: 15px;
  border-radius: 8px;
}

/* Responsible Gaming Detailed */
.mahadev-ob-responsible-detailed {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.responsible-detailed-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  margin-bottom: 40px;
}
.resp-item {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px;
  transition: all 0.3s ease;
}
.resp-item:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.resp-item i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.resp-item h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.resp-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.resp-resources {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 40px;
  text-align: center;
}
.resp-resources p {
  font-size: 1.1rem;
  color: #ddd;
}
.resp-resources a {
  color: var(--inputBorder);
  font-weight: 600;
  text-decoration: none;
}
.resp-resources a:hover {
  text-decoration: underline;
}

/* Benefits Section */
.mahadev-ob-benefits {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.benefits-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 0 auto;
}
.benefit-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.benefit-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.benefit-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.benefit-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.benefit-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Complete Guide Section */
.mahadev-ob-complete-guide {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.guide-subtitle {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 900px;
  margin: 0 auto 50px;
}
.guide-chapter {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px;
  margin-bottom: 30px;
}
.guide-chapter h3 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.guide-chapter p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 15px;
}
.guide-chapter ul, .guide-chapter ol {
  margin-left: 20px;
  margin-bottom: 15px;
  color: #ccc;
}
.guide-chapter li {
  margin-bottom: 8px;
}
.guide-chapter strong {
  color: var(--inputBorder);
}

/* Advanced Tips Section */
.mahadev-ob-advanced {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.advanced-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.advanced-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
.advanced-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px;
  text-align: center;
  transition: all 0.3s ease;
}
.advanced-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.advanced-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.advanced-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.advanced-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Common Mistakes Section */
.mahadev-ob-mistakes {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mistakes-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 25px;
  max-width: 900px;
  margin: 0 auto;
}
.mistake-card {
  display: flex;
  align-items: center;
  gap: 15px;
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 50px;
  padding: 20px 25px;
  transition: all 0.3s ease;
}
.mistake-card:hover {
  border-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.8);
}
.mistake-card i {
  font-size: 1.8rem;
  color: #ff6b6b;
}
.mistake-card p {
  font-size: 1rem;
  color: #ddd;
  margin: 0;
}

/* Conclusion Section */
.mahadev-ob-conclusion {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.conclusion-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.conclusion-card p {
  font-size: 1.2rem;
  line-height: 1.8;
  color: #ddd;
}

/* FAQ Section */
.mahadev-ob-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-ob-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-ob-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-ob-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-ob-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-ob-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA Section */
.mahadev-ob-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-ob-cta .cta-text {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 800px;
  margin: 0 auto 40px;
}
.mahadev-ob-cta .cta-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 992px) {
  .trust-grid,
  .responsible-detailed-grid,
  .benefits-grid,
  .advanced-grid,
  .mistakes-grid,
  .mahadev-ob-faq .faq-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .mahadev-ob-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-ob-hero-text {
    font-size: 1rem;
  }
  .getstarted-steps {
    grid-template-columns: 1fr;
  }
  .security-card,
  .responsible-card,
  .cricket-card,
  .conclusion-card {
    padding: 35px 25px;
  }
  .mahadev-ob-hero-cta {
    flex-direction: column;
    align-items: center;
  }
  .cta-primary, .cta-secondary, .cta-whatsapp {
    width: 100%;
    max-width: 300px;
    text-align: center;
  }
}
@media (max-width: 480px) {
  .security-card,
  .responsible-card,
  .cricket-card,
  .conclusion-card {
    padding: 25px 20px;
  }
  .guide-section,
  .guide-chapter {
    padding: 20px;
  }
  .mistake-card {
    flex-direction: column;
    text-align: center;
    border-radius: 24px;
  }
}
/* ===================================================================Mahadev Online Book End =========================================================== */

/* =================================================================== Online Sport Betting Start =========================================================== */
/* ===== Online Sport Betting Landing Page Styles ===== */

/* Hero Section */
.mahadev-sb-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-sb-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-sb-hero-cta {
  margin-top: 2rem;
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-secondary {
  display: inline-block;
  background-color: transparent;
  color: var(--inputBorder);
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
}
.cta-secondary:hover {
  background-color: var(--inputBorder);
  color: #000;
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp i {
  margin-right: 8px;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}

/* Cricket Betting Section */
.mahadev-sb-cricket {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-sb-cricket-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.mahadev-sb-cricket-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.cricket-events {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  margin: 25px 0;
  justify-content: center;
}
.event-tag {
  background: rgba(249,176,53,0.1);
  border: 1px solid rgba(249,176,53,0.3);
  color: #eee;
  padding: 10px 20px;
  border-radius: 50px;
  font-size: 1rem;
  font-weight: 500;
  transition: all 0.3s ease;
}
.event-tag:hover {
  background: rgba(249,176,53,0.2);
  border-color: var(--inputBorder);
  color: #fff;
  transform: translateY(-2px);
}

/* Get Started Section */
.mahadev-sb-getstarted {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.getstarted-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.getstarted-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.step-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 40px 25px 30px;
  position: relative;
  text-align: center;
  transition: all 0.3s ease;
  box-shadow: 0 10px 25px rgba(0,0,0,0.4);
}
.step-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.step-card .step-number {
  position: absolute;
  top: -20px;
  left: 50%;
  transform: translateX(-50%);
  width: 50px;
  height: 50px;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.8rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 15px rgba(249,176,53,0.4);
}
.step-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 10px 0 15px;
}
.step-card p {
  font-size: 1rem;
  line-height: 1.6;
  color: #ccc;
}
.getstarted-footer {
  font-size: 1.2rem;
  color: var(--inputBorder);
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Why Choose Section */
.mahadev-sb-why {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.why-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.why-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.why-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px;
  transition: all 0.3s ease;
  text-align: center;
}
.why-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.why-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.why-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 10px;
}
.why-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.why-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Sports Available Section */
.mahadev-sb-sports {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.sports-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.sports-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  margin-bottom: 40px;
}
.sport-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  transition: all 0.3s ease;
  text-align: center;
}
.sport-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.sport-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.sport-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 10px;
}
.sport-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.sports-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Safe and Responsible Betting Section */
.mahadev-sb-safe {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.safe-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.safe-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.safe-features {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin: 30px 0;
}
.safe-item {
  display: flex;
  align-items: center;
  gap: 20px;
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 50px;
  padding: 15px 25px;
}
.safe-item i {
  font-size: 1.8rem;
  color: var(--inputBorder);
}
.safe-item span {
  font-size: 1rem;
  color: #ddd;
  line-height: 1.5;
}
.safe-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* FAQ Section */
.mahadev-sb-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-sb-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-sb-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-sb-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-sb-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-sb-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA Section */
.mahadev-sb-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-sb-cta .cta-text {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 800px;
  margin: 0 auto 40px;
}
.mahadev-sb-cta .cta-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 992px) {
  .sports-grid,
  .mahadev-sb-faq .faq-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .mahadev-sb-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-sb-hero-text {
    font-size: 1rem;
  }
  .mahadev-sb-cricket-card,
  .safe-card {
    padding: 35px 25px;
  }
  .cricket-events {
    flex-direction: column;
    align-items: center;
  }
  .event-tag {
    width: 100%;
    text-align: center;
  }
  .safe-item {
    flex-direction: column;
    text-align: center;
    border-radius: 24px;
  }
  .mahadev-sb-hero-cta,
  .mahadev-sb-cta .cta-buttons {
    flex-direction: column;
    align-items: center;
  }
  .cta-primary, .cta-secondary, .cta-whatsapp {
    width: 100%;
    max-width: 300px;
    text-align: center;
  }
}
@media (max-width: 480px) {
  .mahadev-sb-cricket-card,
  .safe-card {
    padding: 25px 20px;
  }
  .step-card {
    padding: 35px 20px 25px;
  }
}
/* =================================================================== Online Sport Betting End =========================================================== */


/* =================================================================== Online Cricket Betting Start =========================================================== */
/* ===== Online Cricket Betting Landing Page Styles ===== */

/* Hero Section */
.mahadev-cb-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-cb-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-cb-hero-cta {
  margin-top: 2rem;
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-secondary {
  display: inline-block;
  background-color: transparent;
  color: var(--inputBorder);
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
}
.cta-secondary:hover {
  background-color: var(--inputBorder);
  color: #000;
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp i {
  margin-right: 8px;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}

/* Available Matches Section */
.mahadev-cb-matches {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.matches-intro {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ccc;
  text-align: center;
  max-width: 900px;
  margin: 0 auto 30px;
}
.matches-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
  max-width: 1000px;
  margin: 40px auto;
}
.match-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 20px 15px;
  text-align: center;
  font-size: 1.1rem;
  font-weight: 600;
  color: #fff;
  transition: all 0.3s ease;
  box-shadow: 0 8px 20px rgba(0,0,0,0.3);
}
.match-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.15);
  color: var(--inputBorder);
}
.matches-footer {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  text-align: center;
  max-width: 900px;
  margin: 20px auto 0;
}

/* Benefits Section */
.mahadev-cb-benefits {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.benefits-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-top: 40px;
}
.benefit-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.benefit-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.benefit-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.benefit-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.benefit-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Why Choose Section */
.mahadev-cb-why {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-cb-why .why-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.mahadev-cb-why .why-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.mahadev-cb-why .why-card p:last-child {
  margin-bottom: 0;
}

/* Complete Guide Section */
.mahadev-cb-guide {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.guide-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 50px;
}
.guide-steps {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
  margin-bottom: 40px;
}
.guide-step {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 40px 30px 30px;
  position: relative;
  transition: all 0.3s ease;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.guide-step:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 25px 40px rgba(249,176,53,0.2);
}
.guide-step .step-number {
  position: absolute;
  top: -20px;
  left: 30px;
  width: 50px;
  height: 50px;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.8rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 15px rgba(249,176,53,0.4);
}
.guide-step h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 10px 0 15px;
}
.guide-step p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ccc;
}
.guide-step-full {
  grid-column: 1 / -1;
}
.guide-footer {
  font-size: 1.2rem;
  color: var(--inputBorder);
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Create ID Section */
.mahadev-cb-createid {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.createid-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.createid-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.createid-steps {
  margin: 30px 0 30px 30px;
  color: #ccc;
}
.createid-steps li {
  font-size: 1rem;
  line-height: 1.8;
  margin-bottom: 12px;
}
.createid-steps li::marker {
  color: var(--inputBorder);
  font-weight: bold;
}
.createid-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  margin: 30px 0 20px;
}
.createid-cta {
  text-align: center;
}

/* FAQ Section */
.mahadev-cb-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-cb-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-cb-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-cb-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-cb-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-cb-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA Section */
.mahadev-cb-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-cb-cta .cta-text {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 800px;
  margin: 0 auto 40px;
}
.mahadev-cb-cta .cta-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 992px) {
  .guide-steps,
  .mahadev-cb-faq .faq-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .mahadev-cb-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-cb-hero-text {
    font-size: 1rem;
  }
  .matches-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .mahadev-cb-why .why-card,
  .createid-card {
    padding: 35px 25px;
  }
  .mahadev-cb-hero-cta,
  .mahadev-cb-cta .cta-buttons {
    flex-direction: column;
    align-items: center;
  }
  .cta-primary, .cta-secondary, .cta-whatsapp {
    width: 100%;
    max-width: 300px;
    text-align: center;
  }
}
@media (max-width: 480px) {
  .matches-grid {
    grid-template-columns: 1fr;
  }
  .mahadev-cb-why .why-card,
  .createid-card {
    padding: 25px 20px;
  }
  .guide-step {
    padding: 35px 20px 25px;
  }
  .guide-step .step-number {
    left: 20px;
  }
  .createid-steps {
    margin-left: 20px;
  }
}
/* =================================================================== Online Cricket Betting End =========================================================== */

/* =================================================================== Online Casino Game Start =========================================================== */

/* ===== Online Casino Game Landing Page Styles ===== */

/* Hero Section */
.mahadev-casino-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-casino-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-casino-hero-cta {
  margin-top: 2rem;
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-secondary {
  display: inline-block;
  background-color: transparent;
  color: var(--inputBorder);
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
}
.cta-secondary:hover {
  background-color: var(--inputBorder);
  color: #000;
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp i {
  margin-right: 8px;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}

/* Explore Games Section */
.mahadev-casino-explore {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.explore-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.game-category {
  margin-bottom: 40px;
  background: rgba(35,37,38,0.3);
  border-radius: 20px;
  padding: 30px;
  border: 1px solid #333;
}
.category-title {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 10px;
}
.category-desc {
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 15px;
}
.game-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}
.game-tag {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 50px;
  padding: 10px 20px;
  font-size: 1rem;
  color: #fff;
  transition: all 0.3s ease;
}
.game-tag:hover {
  border-color: var(--inputBorder);
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(249,176,53,0.15);
  color: var(--inputBorder);
}
.explore-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
  margin-top: 30px;
}

/* Create ID Section */
.mahadev-casino-createid {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.createid-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.createid-steps-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
}
.createid-step {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 40px 30px 30px;
  position: relative;
  transition: all 0.3s ease;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.createid-step:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 25px 40px rgba(249,176,53,0.2);
}
.createid-step .step-number {
  position: absolute;
  top: -20px;
  left: 30px;
  width: 50px;
  height: 50px;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.8rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 15px rgba(249,176,53,0.4);
}
.createid-step h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 10px 0 15px;
}
.createid-step p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ccc;
}
.createid-step-full {
  grid-column: 1 / -1;
}

/* Tricks Section */
.mahadev-casino-tricks {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.tricks-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.tricks-steps {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  margin-bottom: 40px;
}
.trick-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px;
  text-align: center;
  transition: all 0.3s ease;
}
.trick-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.trick-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.trick-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.trick-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.trick-card-full {
  grid-column: 1 / -1;
}
.tricks-footer {
  font-size: 1.2rem;
  color: var(--inputBorder);
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Why Choose Section */
.mahadev-casino-why {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.why-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-top: 40px;
}
.why-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.why-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.why-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.why-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.why-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Responsible Gaming Section */
.mahadev-casino-responsible {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.responsible-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.responsible-card p {
  font-size: 1.2rem;
  line-height: 1.8;
  color: #ddd;
}

/* FAQ Section */
.mahadev-casino-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-casino-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-casino-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-casino-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-casino-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-casino-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA Section */
.mahadev-casino-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-casino-cta .cta-text {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 800px;
  margin: 0 auto 40px;
}
.mahadev-casino-cta .cta-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 992px) {
  .createid-steps-grid,
  .tricks-steps,
  .mahadev-casino-faq .faq-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .mahadev-casino-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-casino-hero-text {
    font-size: 1rem;
  }
  .game-tags {
    justify-content: center;
  }
  .game-tag {
    width: 100%;
    text-align: center;
  }
  .createid-step .step-number {
    left: 20px;
  }
  .mahadev-casino-hero-cta,
  .mahadev-casino-cta .cta-buttons {
    flex-direction: column;
    align-items: center;
  }
  .cta-primary, .cta-secondary, .cta-whatsapp {
    width: 100%;
    max-width: 300px;
    text-align: center;
  }
  .responsible-card {
    padding: 35px 25px;
  }
}
@media (max-width: 480px) {
  .game-category {
    padding: 20px;
  }
  .createid-step,
  .trick-card {
    padding: 35px 20px 25px;
  }
  .responsible-card {
    padding: 25px 20px;
  }
}
/* =================================================================== Online Casino Game End =========================================================== */
/* =================================================================== Online Betting id start =========================================================== */
/* ===== Online Betting ID Landing Page Styles ===== */

/* Hero Section */
.mahadev-oid-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-oid-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-oid-hero-cta {
  margin-top: 2rem;
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp i {
  margin-right: 8px;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}

/* Why Choose Section */
.mahadev-oid-why {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.why-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.why-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.why-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.why-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.why-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.why-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.why-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.why-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* How to Get Section */
.mahadev-oid-how {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.how-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.how-steps {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
}
.how-step {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 40px 30px 30px;
  position: relative;
  transition: all 0.3s ease;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.how-step:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 25px 40px rgba(249,176,53,0.2);
}
.how-step .step-number {
  position: absolute;
  top: -20px;
  left: 30px;
  width: 50px;
  height: 50px;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.8rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 15px rgba(249,176,53,0.4);
}
.how-step h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 10px 0 15px;
}
.how-step p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ccc;
}
.how-step-full {
  grid-column: 1 / -1;
}

/* Comparison Table Section */
.mahadev-oid-comparison {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.comparison-table-wrapper {
  overflow-x: auto;
  margin: 40px 0;
}
.comparison-table {
  width: 100%;
  border-collapse: collapse;
  background: rgba(35,37,38,0.5);
  border-radius: 20px;
  overflow: hidden;
}
.comparison-table th {
  background: linear-gradient(145deg, #232526, #1a1c1e);
  color: var(--inputBorder);
  font-size: 1.1rem;
  font-weight: 600;
  padding: 20px 15px;
  text-align: left;
  border-bottom: 2px solid var(--inputBorder);
}
.comparison-table td {
  padding: 15px;
  color: #ddd;
  font-size: 0.95rem;
  border-bottom: 1px solid #333;
}
.comparison-table tr:last-child td {
  border-bottom: none;
}
.comparison-table tr:hover td {
  background: rgba(249,176,53,0.05);
}
.comparison-table td:first-child {
  font-weight: 600;
  color: #fff;
}
.comparison-table td:nth-child(2) {
  color: var(--inputBorder);
  font-weight: 500;
}
.comparison-footer {
  margin-top: 40px;
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 40px;
  text-align: center;
}
.comparison-footer h3 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.comparison-footer p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
}

/* Trusted Providers Section */
.mahadev-oid-trusted {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.trusted-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.trusted-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.trusted-card p:last-child {
  margin-bottom: 0;
}

/* Benefits Section */
.mahadev-oid-benefits {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.benefits-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.benefits-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.benefit-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.benefit-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.benefit-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.benefit-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.benefit-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.benefits-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Responsible Gaming Section */
.mahadev-oid-responsible {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.responsible-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.responsible-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.responsible-card p:last-child {
  margin-bottom: 0;
}

/* Get Started Section */
.mahadev-oid-getstarted {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.getstarted-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.getstarted-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.getstarted-cta {
  margin-top: 30px;
}

/* FAQ Section */
.mahadev-oid-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-oid-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-oid-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-oid-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-oid-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-oid-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA Section */
.mahadev-oid-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-oid-cta .cta-text {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 800px;
  margin: 0 auto 40px;
}
.mahadev-oid-cta .cta-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 992px) {
  .how-steps,
  .mahadev-oid-faq .faq-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .mahadev-oid-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-oid-hero-text {
    font-size: 1rem;
  }
  .comparison-table th,
  .comparison-table td {
    font-size: 0.85rem;
    padding: 12px 8px;
  }
  .trusted-card,
  .responsible-card,
  .getstarted-card,
  .comparison-footer {
    padding: 35px 25px;
  }
  .mahadev-oid-hero-cta,
  .mahadev-oid-cta .cta-buttons {
    flex-direction: column;
    align-items: center;
  }
  .cta-primary, .cta-whatsapp {
    width: 100%;
    max-width: 300px;
    text-align: center;
  }
}
@media (max-width: 480px) {
  .how-step {
    padding: 35px 20px 25px;
  }
  .how-step .step-number {
    left: 20px;
  }
  .trusted-card,
  .responsible-card,
  .getstarted-card,
  .comparison-footer {
    padding: 25px 20px;
  }
}
/* =================================================================== Online Betting id End =========================================================== */

/* =================================================================== IPL Betting Id Start =========================================================== */
/* ===== IPL Betting ID Landing Page Styles ===== */

/* Hero Section */
.mahadev-ipbid-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-ipbid-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-ipbid-hero-cta {
  margin-top: 2rem;
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-secondary {
  display: inline-block;
  background-color: transparent;
  color: var(--inputBorder);
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
}
.cta-secondary:hover {
  background-color: var(--inputBorder);
  color: #000;
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp i {
  margin-right: 8px;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}

/* Why Choose Section */
.mahadev-ipbid-why {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.why-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.why-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.why-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.why-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.why-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.why-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.why-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.why-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* How to Get Section */
.mahadev-ipbid-how {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.how-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.how-steps {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
}
.how-step {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 40px 30px 30px;
  position: relative;
  transition: all 0.3s ease;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.how-step:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 25px 40px rgba(249,176,53,0.2);
}
.how-step .step-number {
  position: absolute;
  top: -20px;
  left: 30px;
  width: 50px;
  height: 50px;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.8rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 15px rgba(249,176,53,0.4);
}
.how-step h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 10px 0 15px;
}
.how-step p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ccc;
}
.how-step-full {
  grid-column: 1 / -1;
}
.how-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
  margin-top: 40px;
}

/* Comparison Table */
.mahadev-ipbid-comparison {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.comparison-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.comparison-table-wrapper {
  overflow-x: auto;
  margin: 40px 0;
}
.comparison-table {
  width: 100%;
  border-collapse: collapse;
  background: rgba(35,37,38,0.5);
  border-radius: 20px;
  overflow: hidden;
}
.comparison-table th {
  background: linear-gradient(145deg, #232526, #1a1c1e);
  color: var(--inputBorder);
  font-size: 1.1rem;
  font-weight: 600;
  padding: 20px 15px;
  text-align: left;
  border-bottom: 2px solid var(--inputBorder);
}
.comparison-table td {
  padding: 15px;
  color: #ddd;
  font-size: 0.95rem;
  border-bottom: 1px solid #333;
}
.comparison-table tr:last-child td {
  border-bottom: none;
}
.comparison-table tr:hover td {
  background: rgba(249,176,53,0.05);
}
.comparison-table td:first-child {
  font-weight: 600;
  color: #fff;
}
.comparison-table td:nth-child(2) {
  color: var(--inputBorder);
  font-weight: 500;
}
.comparison-footer {
  margin-top: 40px;
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 40px;
  text-align: center;
}
.comparison-footer h3 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.comparison-footer p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
}

/* Prediction Section */
.mahadev-ipbid-prediction {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.prediction-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.prediction-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
}

/* Create ID Section */
.mahadev-ipbid-create {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.create-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.create-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.create-buttons {
  display: flex;
  gap: 20px;
  justify-content: center;
  margin-top: 20px;
}

/* Login Section */
.mahadev-ipbid-login {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.login-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.login-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}

/* Benefits Section */
.mahadev-ipbid-benefits {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.benefits-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.benefit-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.benefit-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.benefit-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.benefit-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.benefit-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.benefits-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Free ID Section */
.mahadev-ipbid-free {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.free-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.free-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}

/* Team Stats Section */
.mahadev-ipbid-stats {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.stats-intro {
  font-size: 1.1rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 20px;
}
.stats-table-wrapper {
  overflow-x: auto;
  margin: 40px 0;
}
.stats-table {
  width: 100%;
  border-collapse: collapse;
  background: rgba(35,37,38,0.5);
  border-radius: 20px;
  overflow: hidden;
}
.stats-table th {
  background: linear-gradient(145deg, #232526, #1a1c1e);
  color: var(--inputBorder);
  font-size: 1.1rem;
  font-weight: 600;
  padding: 20px 15px;
  text-align: left;
  border-bottom: 2px solid var(--inputBorder);
}
.stats-table td {
  padding: 15px;
  color: #ddd;
  font-size: 0.95rem;
  border-bottom: 1px solid #333;
}
.stats-table tr:hover td {
  background: rgba(249,176,53,0.05);
}
.stats-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Usage Section */
.mahadev-ipbid-usage {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.usage-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.usage-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}

/* Security Section */
.mahadev-ipbid-security {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.security-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.security-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}

/* Expert Predictions Section */
.mahadev-ipbid-expert {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.expert-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 30px;
}
.expert-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  margin: 40px 0;
}
.expert-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px;
  text-align: center;
  transition: all 0.3s ease;
}
.expert-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.expert-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.expert-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.expert-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.expert-why {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 40px;
  margin-top: 30px;
}
.expert-why h3 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 20px;
  text-align: center;
}
.expert-why ul {
  list-style: none;
  padding: 0;
}
.expert-why li {
  display: flex;
  align-items: flex-start;
  gap: 15px;
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 15px;
}
.expert-why li i {
  color: var(--inputBorder);
  font-size: 1.2rem;
  margin-top: 2px;
}

/* Bet Types Section */
.mahadev-ipbid-bet-types {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.bet-types-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  margin-top: 40px;
}
.bet-type {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px;
  transition: all 0.3s ease;
}
.bet-type:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.bet-type h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 10px;
}
.bet-type p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* First Match Section */
.mahadev-ipbid-firstmatch {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.firstmatch-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.firstmatch-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.firstmatch-card ul {
  margin: 20px 0 20px 30px;
  color: #ccc;
}
.firstmatch-card li {
  margin-bottom: 8px;
}

/* Place Bets Section */
.mahadev-ipbid-placebets {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.placebets-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.placebets-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.placebets-card ol {
  margin: 20px 0 20px 30px;
  color: #ccc;
}
.placebets-card li {
  margin-bottom: 12px;
  font-size: 1rem;
}

/* Withdraw Section */
.mahadev-ipbid-withdraw {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.withdraw-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.withdraw-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.withdraw-card ol {
  margin: 20px 0 20px 30px;
  color: #ccc;
}
.withdraw-card li {
  margin-bottom: 12px;
  font-size: 1rem;
}

/* FAQ Section */
.mahadev-ipbid-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-ipbid-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-ipbid-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-ipbid-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-ipbid-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-ipbid-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA Section */
.mahadev-ipbid-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-ipbid-cta .cta-text {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 800px;
  margin: 0 auto 40px;
}
.mahadev-ipbid-cta .cta-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 992px) {
  .how-steps,
  .expert-grid,
  .bet-types-grid,
  .mahadev-ipbid-faq .faq-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .mahadev-ipbid-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-ipbid-hero-text {
    font-size: 1rem;
  }
  .comparison-table th,
  .comparison-table td,
  .stats-table th,
  .stats-table td {
    font-size: 0.85rem;
    padding: 12px 8px;
  }
  .prediction-card,
  .create-card,
  .login-card,
  .free-card,
  .usage-card,
  .security-card,
  .firstmatch-card,
  .placebets-card,
  .withdraw-card,
  .comparison-footer,
  .expert-why {
    padding: 35px 25px;
  }
  .mahadev-ipbid-hero-cta,
  .mahadev-ipbid-cta .cta-buttons,
  .create-buttons {
    flex-direction: column;
    align-items: center;
  }
  .cta-primary, .cta-secondary, .cta-whatsapp {
    width: 100%;
    max-width: 300px;
    text-align: center;
  }
}
@media (max-width: 480px) {
  .how-step {
    padding: 35px 20px 25px;
  }
  .how-step .step-number {
    left: 20px;
  }
  .prediction-card,
  .create-card,
  .login-card,
  .free-card,
  .usage-card,
  .security-card,
  .firstmatch-card,
  .placebets-card,
  .withdraw-card,
  .comparison-footer,
  .expert-why {
    padding: 25px 20px;
  }
}
/* =================================================================== IPL Betting Id End =========================================================== */

/* =================================================================== Laser247 Start =========================================================== */

/* ===== Laser247 Landing Page Styles ===== */

/* Hero Section */
.mahadev-laser247-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-laser247-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-laser247-hero-cta {
  margin-top: 2rem;
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp i {
  margin-right: 8px;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}

/* What is Laser247 */
.mahadev-laser247-whatis {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.whatis-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1100px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.whatis-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.dual-betting {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin: 30px 0;
}
.betting-type {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 25px;
  transition: all 0.3s ease;
}
.betting-type:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.betting-type h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 10px;
}
.betting-type p {
  font-size: 1rem;
  line-height: 1.6;
  color: #ccc;
}
.whatis-footer {
  font-style: italic;
  color: var(--inputBorder);
  text-align: center;
  padding-top: 20px;
  border-top: 1px dashed #444;
}

/* Why Choose */
.mahadev-laser247-why {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.why-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.why-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.why-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.why-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.why-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.why-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.why-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.why-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Sports Coverage */
.mahadev-laser247-sports {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.sports-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.sports-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 25px;
  margin-bottom: 40px;
}
.sport-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 20px;
  text-align: center;
  transition: all 0.3s ease;
}
.sport-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.sport-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.sport-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 8px;
}
.sport-card p {
  font-size: 0.9rem;
  color: #ccc;
}
.sports-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Registration Process */
.mahadev-laser247-register {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.register-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.register-steps {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
  margin-bottom: 50px;
}
.step-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 40px 30px 30px;
  position: relative;
  transition: all 0.3s ease;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.step-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 25px 40px rgba(249,176,53,0.2);
}
.step-num {
  position: absolute;
  top: -20px;
  left: 30px;
  width: 50px;
  height: 50px;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.8rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 15px rgba(249,176,53,0.4);
}
.step-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 10px 0 15px;
}
.step-card p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ccc;
}
.step-full {
  grid-column: 1 / -1;
}
.register-benefits {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 40px;
  max-width: 1000px;
  margin: 0 auto;
}
.register-benefits h3 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 20px;
  text-align: center;
}
.register-benefits ul {
  list-style: none;
  padding: 0;
  margin-bottom: 20px;
}
.register-benefits li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 12px;
}
.register-benefits li i {
  color: var(--inputBorder);
}
.register-benefits p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ccc;
  text-align: center;
}

/* Top Features */
.mahadev-laser247-features {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.features-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.feature-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.feature-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.feature-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.feature-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.feature-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.features-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Mobile App Overview */
.mahadev-laser247-app {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.app-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1100px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.app-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.app-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 30px 0 15px;
}

/* Get Laser247 ID */
.mahadev-laser247-getid {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.getid-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.getid-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.getid-steps {
  margin: 30px 0;
}
.getid-steps .step {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 15px 20px;
  margin-bottom: 15px;
  transition: all 0.3s ease;
}
.getid-steps .step:hover {
  border-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.step-label {
  font-weight: 700;
  color: var(--inputBorder);
  margin-right: 10px;
}
.getid-footer {
  font-size: 1.2rem;
  color: var(--inputBorder);
  text-align: center;
  font-weight: 600;
  margin-top: 30px;
  padding-top: 20px;
  border-top: 1px dashed #444;
}

/* Payment Options */
.mahadev-laser247-payment {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.payment-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.payment-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.payment-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 30px 0 15px;
}
.payment-methods {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  list-style: none;
  padding: 0;
  margin: 20px 0;
}
.payment-methods li {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 50px;
  padding: 10px 20px;
  font-size: 1rem;
  color: #ddd;
}
.payment-methods li i {
  color: var(--inputBorder);
  margin-right: 8px;
}
.withdraw-steps {
  margin: 20px 0 20px 25px;
  color: #ccc;
}
.withdraw-steps li {
  margin-bottom: 8px;
}

/* Security Section */
.mahadev-laser247-security {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.security-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.security-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}

/* Customer Support */
.mahadev-laser247-support {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.support-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 0 auto 40px;
}
.support-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 40px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.support-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.support-card i {
  font-size: 3rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.support-card h3 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 10px;
}
.support-card p {
  font-size: 1rem;
  color: #ccc;
}
.support-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
  margin-bottom: 40px;
}
.support-features {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 40px;
  max-width: 1000px;
  margin: 0 auto;
}
.support-features h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 25px 0 15px;
}
.support-features h3:first-of-type {
  margin-top: 0;
}
.support-features p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ccc;
  margin-bottom: 1.5rem;
}
.support-cta {
  font-size: 1.2rem;
  color: var(--inputBorder);
  text-align: center;
  font-weight: 600;
  margin-top: 40px;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* FAQ Section */
.mahadev-laser247-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-laser247-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-laser247-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-laser247-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-laser247-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-laser247-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.faq-footer {
  font-size: 1.1rem;
  color: var(--inputBorder);
  text-align: center;
  font-weight: 500;
  margin-top: 40px;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Final CTA */
.mahadev-laser247-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-laser247-cta .cta-text {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 800px;
  margin: 0 auto 40px;
}
.mahadev-laser247-cta .cta-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 992px) {
  .dual-betting, .register-steps, .support-grid, .mahadev-laser247-faq .faq-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .mahadev-laser247-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-laser247-hero-text {
    font-size: 1rem;
  }
  .whatis-card, .app-card, .getid-card, .payment-card, .security-card, .support-features {
    padding: 35px 25px;
  }
  .mahadev-laser247-hero-cta, .mahadev-laser247-cta .cta-buttons {
    flex-direction: column;
    align-items: center;
  }
  .cta-primary, .cta-whatsapp {
    width: 100%;
    max-width: 300px;
    text-align: center;
  }
}
@media (max-width: 480px) {
  .step-card {
    padding: 35px 20px 25px;
  }
  .step-num {
    left: 20px;
  }
  .payment-methods li {
    width: 100%;
    text-align: center;
  }
}
/* =================================================================== Laser247 End =========================================================== */

/* =================================================================== Gold365 Start =========================================================== */
/* ===== Gold365 Landing Page Styles ===== */

/* Hero Section */
.mahadev-gold365-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-gold365-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-gold365-hero-cta {
  margin-top: 2rem;
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-secondary {
  display: inline-block;
  background-color: transparent;
  color: var(--inputBorder);
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
}
.cta-secondary:hover {
  background-color: var(--inputBorder);
  color: #000;
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp i {
  margin-right: 8px;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}

/* What is Gold365 */
.mahadev-gold365-whatis {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.whatis-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1100px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.whatis-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.sports-highlight, .casino-highlight {
  background: rgba(35,37,38,0.5);
  border-radius: 20px;
  padding: 25px;
  margin: 25px 0;
}
.sports-highlight h3, .casino-highlight h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.sports-tags, .casino-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.sport-tag, .casino-tag {
  background: rgba(249,176,53,0.1);
  border: 1px solid rgba(249,176,53,0.3);
  border-radius: 50px;
  padding: 8px 18px;
  font-size: 0.95rem;
  color: #eee;
  transition: all 0.3s ease;
}
.sport-tag:hover, .casino-tag:hover {
  background: rgba(249,176,53,0.2);
  border-color: var(--inputBorder);
  transform: translateY(-2px);
}
.whatis-footer {
  font-style: italic;
  color: var(--inputBorder);
  text-align: center;
  padding-top: 20px;
  border-top: 1px dashed #444;
}

/* Why Choose */
.mahadev-gold365-why {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.why-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.why-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.why-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.why-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.why-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.why-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.why-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.why-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Top Games */
.mahadev-gold365-games {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.games-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.games-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.game-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.game-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.game-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.game-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.game-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.games-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* How to Start */
.mahadev-gold365-start {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.start-steps {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
}
.step {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 40px 30px 30px;
  position: relative;
  transition: all 0.3s ease;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.step:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 25px 40px rgba(249,176,53,0.2);
}
.step .step-num {
  position: absolute;
  top: -20px;
  left: 30px;
  width: 50px;
  height: 50px;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.8rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 15px rgba(249,176,53,0.4);
}
.step h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 10px 0 15px;
}
.step p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ccc;
}
.step-full {
  grid-column: 1 / -1;
}

/* Bonuses */
.mahadev-gold365-bonuses {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.bonuses-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}
.bonus-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.bonus-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.bonus-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.bonus-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.bonus-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.bonuses-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Customer Support */
.mahadev-gold365-support {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.support-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-bottom: 50px;
}
.support-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 40px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.support-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.support-card i {
  font-size: 3rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.support-card h3 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 10px;
}
.support-card p {
  font-size: 1rem;
  color: #ccc;
}
.security-note {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 40px;
  text-align: center;
}
.security-note h3 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.security-note p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
}

/* Live Betting */
.mahadev-gold365-live {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.live-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1100px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.live-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.live-features {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin: 40px 0;
}
.live-feature {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.live-feature:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.live-feature i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.live-feature h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.live-feature p {
  font-size: 0.95rem;
  color: #ccc;
}

/* Top Casino Games Detailed */
.mahadev-gold365-casino {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.casino-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-bottom: 40px;
}
.casino-item {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.casino-item:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.casino-item i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.casino-item h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.casino-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}
.casino-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Compare & Tips */
.mahadev-gold365-compare {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.compare-card, .tips-card, .responsible-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 40px;
  margin-bottom: 30px;
}
.compare-card p, .responsible-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
}
.tips-card h3, .responsible-card h3 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 20px;
}
.tips-card ul {
  list-style: none;
  padding: 0;
}
.tips-card li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 12px;
}
.tips-card li i {
  color: var(--inputBorder);
}

/* Security Grid */
.mahadev-gold365-security {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.security-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
.security-item {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 30px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.security-item:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.security-item i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.security-item h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.security-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* FAQ */
.mahadev-gold365-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-gold365-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-gold365-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-gold365-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-gold365-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-gold365-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA */
.mahadev-gold365-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-gold365-cta .cta-text {
  font-size: 1.2rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 800px;
  margin: 0 auto 20px;
}
.mahadev-gold365-cta .cta-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
  margin-top: 30px;
}

/* Responsive */
@media (max-width: 992px) {
  .why-grid, .games-grid, .bonuses-grid, .support-grid, .live-features, .casino-grid, .security-grid, .mahadev-gold365-faq .faq-grid {
    grid-template-columns: 1fr;
  }
  .start-steps {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .mahadev-gold365-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-gold365-hero-text {
    font-size: 1rem;
  }
  .whatis-card, .live-card, .compare-card, .tips-card, .responsible-card {
    padding: 35px 25px;
  }
  .sports-tags, .casino-tags {
    justify-content: center;
  }
  .sport-tag, .casino-tag {
    width: 100%;
    text-align: center;
  }
  .mahadev-gold365-hero-cta, .mahadev-gold365-cta .cta-buttons {
    flex-direction: column;
    align-items: center;
  }
  .cta-primary, .cta-secondary, .cta-whatsapp {
    width: 100%;
    max-width: 300px;
    text-align: center;
  }
}
@media (max-width: 480px) {
  .step {
    padding: 35px 20px 25px;
  }
  .step .step-num {
    left: 20px;
  }
}
/* =================================================================== Gold365 End =========================================================== */

/* =================================================================== 11xplay Start =========================================================== */
/* ===== 11xplay Landing Page Styles ===== */

/* Hero Section */
.mahadev-11xplay-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-11xplay-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-11xplay-hero-cta {
  margin-top: 2rem;
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp i {
  margin-right: 8px;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}

/* What is 11xplay Pro */
.mahadev-11xplay-whatis {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.whatis-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1100px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.whatis-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.pro-features {
  display: flex;
  flex-direction: column;
  gap: 15px;
  background: rgba(35,37,38,0.5);
  border-radius: 20px;
  padding: 25px;
  margin: 25px 0;
}
.pro-feature {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  color: #eee;
}
.pro-feature i {
  color: var(--inputBorder);
  font-size: 1.2rem;
}
.whatis-footer {
  font-style: italic;
  color: var(--inputBorder);
  text-align: center;
  padding-top: 20px;
  border-top: 1px dashed #444;
}

/* How 11xplay Works */
.mahadev-11xplay-howworks {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.how-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.how-steps {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
  margin-bottom: 40px;
}
.step {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 40px 30px 30px;
  position: relative;
  transition: all 0.3s ease;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.step:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 25px 40px rgba(249,176,53,0.2);
}
.step .step-num {
  position: absolute;
  top: -20px;
  left: 30px;
  width: 50px;
  height: 50px;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.8rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 15px rgba(249,176,53,0.4);
}
.step h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 10px 0 15px;
}
.step p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ccc;
}
.step-full {
  grid-column: 1 / -1;
}
.how-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Login & App Access */
.mahadev-11xplay-loginapp {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.loginapp-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.loginapp-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 25px 0 15px;
}
.loginapp-card h3:first-of-type {
  margin-top: 0;
}
.loginapp-card p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}

/* Cricket Betting */
.mahadev-11xplay-cricket {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.cricket-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1100px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.cricket-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.cricket-options, .cricket-markets {
  background: rgba(35,37,38,0.5);
  border-radius: 20px;
  padding: 25px;
  margin: 25px 0;
}
.cricket-options h3, .cricket-markets h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.cricket-options ul {
  list-style: none;
  padding: 0;
}
.cricket-options li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 10px;
}
.cricket-options li i {
  color: var(--inputBorder);
}

/* Platform Versions */
.mahadev-11xplay-versions {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.versions-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.versions-card p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.versions-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 20px 0 10px;
}
.warning {
  background: rgba(249,176,53,0.1);
  border-left: 4px solid #ff9800;
  padding: 15px 20px;
  border-radius: 12px;
  margin-top: 20px;
}
.warning i {
  margin-right: 10px;
  color: #ff9800;
}

/* 11xplay ID Guide */
.mahadev-11xplay-idguide {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.idguide-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.idguide-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.idguide-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 20px 0 15px;
}
.idguide-card ul {
  list-style: none;
  padding: 0;
  margin: 20px 0;
}
.idguide-card li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 12px;
}
.idguide-card li i {
  color: var(--inputBorder);
}
.idguide-footer {
  font-style: italic;
  color: var(--inputBorder);
  text-align: center;
  padding-top: 20px;
  border-top: 1px dashed #444;
}

/* Payment Options */
.mahadev-11xplay-payment {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.payment-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.payment-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.payment-methods {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  justify-content: center;
  margin: 30px 0;
}
.method {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 50px;
  padding: 10px 20px;
  font-size: 1rem;
  color: #ddd;
}
.payment-footer {
  font-size: 1rem;
  color: #ccc;
}

/* Comparison Table */
.mahadev-11xplay-comparison {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.comparison-table-wrapper {
  overflow-x: auto;
  margin: 40px 0;
}
.comparison-table {
  width: 100%;
  border-collapse: collapse;
  background: rgba(35,37,38,0.5);
  border-radius: 20px;
  overflow: hidden;
}
.comparison-table th {
  background: linear-gradient(145deg, #232526, #1a1c1e);
  color: var(--inputBorder);
  font-size: 1.1rem;
  font-weight: 600;
  padding: 20px 15px;
  text-align: left;
  border-bottom: 2px solid var(--inputBorder);
}
.comparison-table td {
  padding: 15px;
  color: #ddd;
  font-size: 0.95rem;
  border-bottom: 1px solid #333;
}
.comparison-table tr:last-child td {
  border-bottom: none;
}
.comparison-table tr:hover td {
  background: rgba(249,176,53,0.05);
}
.comparison-table td:first-child {
  font-weight: 600;
  color: #fff;
}
.comparison-table td:nth-child(2) {
  color: var(--inputBorder);
  font-weight: 500;
}
.comparison-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* What 11xplay Is Not */
.mahadev-11xplay-not {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.not-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.not-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.not-card ul {
  list-style: none;
  padding: 0;
  margin: 20px 0;
}
.not-card li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 12px;
}
.not-card li i {
  color: #ff6b6b;
}
.not-footer {
  font-style: italic;
  color: #ff6b6b;
  text-align: center;
  padding-top: 20px;
  border-top: 1px dashed #444;
}

/* Who Should Use */
.mahadev-11xplay-who {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.who-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.who-card ul {
  list-style: none;
  padding: 0;
}
.who-card li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 15px;
}
.who-card li i {
  color: var(--inputBorder);
}

/* Responsible Use */
.mahadev-11xplay-responsible {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.responsible-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.responsible-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.responsible-tips {
  background: rgba(35,37,38,0.5);
  border-radius: 20px;
  padding: 25px;
  margin-top: 20px;
}
.responsible-tips h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.responsible-tips ul {
  list-style: none;
  padding: 0;
}
.responsible-tips li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 12px;
}
.responsible-tips li i {
  color: var(--inputBorder);
}

/* FAQ Section */
.mahadev-11xplay-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-11xplay-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-11xplay-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-11xplay-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-11xplay-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-11xplay-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA */
.mahadev-11xplay-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-11xplay-cta .cta-text {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 800px;
  margin: 0 auto 40px;
}
.mahadev-11xplay-cta .cta-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 992px) {
  .how-steps, .mahadev-11xplay-faq .faq-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .mahadev-11xplay-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-11xplay-hero-text {
    font-size: 1rem;
  }
  .whatis-card, .loginapp-card, .cricket-card, .versions-card, .idguide-card, .payment-card, .not-card, .who-card, .responsible-card {
    padding: 35px 25px;
  }
  .step {
    padding: 35px 20px 25px;
  }
  .step .step-num {
    left: 20px;
  }
  .mahadev-11xplay-hero-cta, .mahadev-11xplay-cta .cta-buttons {
    flex-direction: column;
    align-items: center;
  }
  .cta-primary, .cta-whatsapp {
    width: 100%;
    max-width: 300px;
    text-align: center;
  }
}
@media (max-width: 480px) {
  .payment-methods {
    flex-direction: column;
  }
  .method {
    text-align: center;
  }
}
/* =================================================================== 11xplay End =========================================================== */

/* =================================================================== cricbet99 start =========================================================== */
/* ===== Cricbet99 Landing Page Styles ===== */

/* Hero Section */
.mahadev-cricbet99-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-cricbet99-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-cricbet99-hero-cta {
  margin-top: 2rem;
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp i {
  margin-right: 8px;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}

/* What is Cricbet99 Club */
.mahadev-cricbet99-whatisclub {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.club-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1100px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.club-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.club-features {
  background: rgba(35,37,38,0.5);
  border-radius: 20px;
  padding: 25px;
  margin: 25px 0;
}
.club-features h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.club-features ul {
  list-style: none;
  padding: 0;
}
.club-features li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 12px;
}
.club-features li i {
  color: var(--inputBorder);
}
.club-footer {
  font-style: italic;
  color: var(--inputBorder);
  text-align: center;
  padding-top: 20px;
  border-top: 1px dashed #444;
}

/* Comparison Section */
.mahadev-cricbet99-comparison {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.comparison-intro {
  font-size: 1.2rem;
  color: #ccc;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 40px;
}
.comparison-table-wrapper {
  overflow-x: auto;
  margin: 40px 0;
}
.comparison-table {
  width: 100%;
  border-collapse: collapse;
  background: rgba(35,37,38,0.5);
  border-radius: 20px;
  overflow: hidden;
}
.comparison-table th {
  background: linear-gradient(145deg, #232526, #1a1c1e);
  color: var(--inputBorder);
  font-size: 1.1rem;
  font-weight: 600;
  padding: 20px 15px;
  text-align: left;
  border-bottom: 2px solid var(--inputBorder);
}
.comparison-table td {
  padding: 15px;
  color: #ddd;
  font-size: 0.95rem;
  border-bottom: 1px solid #333;
}
.comparison-table tr:last-child td {
  border-bottom: none;
}
.comparison-table tr:hover td {
  background: rgba(249,176,53,0.05);
}
.comparison-table td:first-child {
  font-weight: 600;
  color: #fff;
}
.comparison-table td:nth-child(2) {
  color: var(--inputBorder);
  font-weight: 500;
}
.comparison-footer {
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  font-weight: 500;
  padding: 20px;
  background: rgba(249,176,53,0.05);
  border-radius: 50px;
}

/* Sign Up Process */
.mahadev-cricbet99-signup {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.signup-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1100px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.signup-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.signup-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 25px 0 15px;
}
.signup-steps {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
  margin: 30px 0;
}
.step {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 25px 20px;
  position: relative;
  transition: all 0.3s ease;
}
.step:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.step .step-num {
  width: 40px;
  height: 40px;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.5rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 15px;
  box-shadow: 0 5px 15px rgba(249,176,53,0.4);
}
.step h4 {
  font-size: 1.2rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.step p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
  margin-bottom: 0;
}
.step-full {
  grid-column: 1 / -1;
}
.signup-warning {
  background: rgba(255,152,0,0.1);
  border-left: 4px solid #ff9800;
  padding: 15px 20px;
  border-radius: 12px;
  margin-top: 20px;
}
.signup-warning i {
  margin-right: 10px;
  color: #ff9800;
}

/* Login Guide */
.mahadev-cricbet99-loginguide {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.loginguide-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.loginguide-card p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.loginguide-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 25px 0 15px;
}
.loginguide-card ol, .loginguide-card ul {
  margin: 20px 0 20px 25px;
  color: #ccc;
}
.loginguide-card li {
  margin-bottom: 8px;
}
.loginguide-card ul li {
  list-style: none;
  margin-left: 0;
}
.loginguide-card ul li i {
  color: var(--inputBorder);
  margin-right: 10px;
}

/* Cricket Betting */
.mahadev-cricbet99-cricket {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.cricket-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1100px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.cricket-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.cricket-options, .cricket-markets {
  background: rgba(35,37,38,0.5);
  border-radius: 20px;
  padding: 25px;
  margin: 25px 0;
}
.cricket-options h3, .cricket-markets h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.cricket-options ul {
  list-style: none;
  padding: 0;
}
.cricket-options li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 10px;
}
.cricket-options li i {
  color: var(--inputBorder);
}

/* App Access */
.mahadev-cricbet99-app {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.app-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.app-card p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.app-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 20px 0 10px;
}
.warning {
  background: rgba(249,176,53,0.1);
  border-left: 4px solid #ff9800;
  padding: 15px 20px;
  border-radius: 12px;
  margin-top: 20px;
}
.warning i {
  margin-right: 10px;
  color: #ff9800;
}

/* ID Access */
.mahadev-cricbet99-idaccess {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.idaccess-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.idaccess-card p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.idaccess-footer {
  font-style: italic;
  color: var(--inputBorder);
  text-align: center;
  padding-top: 20px;
  border-top: 1px dashed #444;
}

/* Payment Methods */
.mahadev-cricbet99-payment {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.payment-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.payment-card p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.payment-methods {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  justify-content: center;
  margin: 30px 0;
}
.method {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 50px;
  padding: 10px 20px;
  font-size: 1rem;
  color: #ddd;
}
.payment-footer {
  font-size: 0.95rem;
  color: #ccc;
}

/* Customer Support */
.mahadev-cricbet99-support {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.support-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.support-card p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.support-services h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.support-services ul {
  list-style: none;
  padding: 0;
  margin-bottom: 20px;
}
.support-services li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 10px;
}
.support-services li i {
  color: var(--inputBorder);
}
.safety-note {
  background: rgba(35,37,38,0.5);
  border-radius: 20px;
  padding: 20px;
  margin-top: 20px;
}
.safety-note h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: #ff9800;
  margin-bottom: 10px;
}

/* Win Awareness */
.mahadev-cricbet99-winaware {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.winaware-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.winaware-card p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.winaware-card ul {
  list-style: none;
  padding: 0;
  margin: 20px 0;
}
.winaware-card li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 12px;
}
.winaware-card li i {
  color: var(--inputBorder);
}

/* Who Should Use */
.mahadev-cricbet99-whoshould {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.whoshould-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.whoshould-card p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.whoshould-card ul {
  list-style: none;
  padding: 0;
}
.whoshould-card li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 12px;
}
.whoshould-card li i {
  color: var(--inputBorder);
}

/* What Cricbet99 Is NOT */
.mahadev-cricbet99-not {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.not-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.not-card p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.not-item {
  display: flex;
  align-items: flex-start;
  gap: 15px;
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 20px;
  margin-bottom: 15px;
}
.not-item i {
  font-size: 1.5rem;
  color: #ff6b6b;
  margin-top: 2px;
}
.not-item strong {
  color: #ff6b6b;
}

/* Responsible Use */
.mahadev-cricbet99-responsible {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.responsible-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.responsible-card p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.responsible-card ul {
  list-style: none;
  padding: 0;
  margin: 20px 0;
}
.responsible-card li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  color: #ddd;
  margin-bottom: 12px;
}
.responsible-card li i {
  color: var(--inputBorder);
}

/* FAQ Section */
.mahadev-cricbet99-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-cricbet99-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-cricbet99-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-cricbet99-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-cricbet99-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-cricbet99-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA */
.mahadev-cricbet99-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
}
.mahadev-cricbet99-cta .cta-text {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 800px;
  margin: 0 auto 40px;
}
.mahadev-cricbet99-cta .cta-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 992px) {
  .signup-steps, .mahadev-cricbet99-faq .faq-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .mahadev-cricbet99-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-cricbet99-hero-text {
    font-size: 1rem;
  }
  .club-card, .signup-card, .cricket-card, .app-card, .idaccess-card, .payment-card, .support-card, .winaware-card, .whoshould-card, .not-card, .responsible-card, .loginguide-card {
    padding: 35px 25px;
  }
  .step {
    padding: 20px 15px;
  }
  .mahadev-cricbet99-hero-cta, .mahadev-cricbet99-cta .cta-buttons {
    flex-direction: column;
    align-items: center;
  }
  .cta-primary, .cta-whatsapp {
    width: 100%;
    max-width: 300px;
    text-align: center;
  }
}
@media (max-width: 480px) {
  .payment-methods {
    flex-direction: column;
  }
  .method {
    text-align: center;
  }
  .not-item {
    flex-direction: column;
  }
}
/* =================================================================== cricbet99 end =========================================================== */
/* =================================================================== How to Play start  =========================================================== */
/* ===== How to Play Landing Page Styles ===== */

/* Hero Section */
.mahadev-htp-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-htp-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.mahadev-htp-hero-cta {
  margin-top: 2rem;
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  padding: 15px 40px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp i {
  margin-right: 8px;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}

/* Step Sections */
.mahadev-htp-step {
  padding: 60px 20px;
}
.mahadev-htp-step.alt-bg {
  background-color: rgba(35, 37, 38, 0.3);
}
.step-wrapper {
  display: flex;
  gap: 40px;
  max-width: 1100px;
  margin: 0 auto;
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 40px;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  transition: all 0.3s ease;
}
.step-wrapper:hover {
  border-color: var(--inputBorder);
  transform: translateY(-5px);
  box-shadow: 0 25px 40px rgba(249,176,53,0.15);
}
.step-number-badge {
  flex-shrink: 0;
  width: 80px;
  height: 80px;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 2.5rem;
  font-weight: 800;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 25px rgba(249,176,53,0.4);
}
.step-content {
  flex: 1;
}
.step-title {
  font-size: 1.8rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 20px;
}
.step-content h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin: 20px 0 15px;
}
.step-content p {
  font-size: 1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1rem;
}
.step-content ul, .step-content ol {
  margin: 15px 0 15px 25px;
  color: #ccc;
}
.step-content li {
  margin-bottom: 8px;
}
.tip {
  background: rgba(249,176,53,0.1);
  border-left: 4px solid var(--inputBorder);
  padding: 15px 20px;
  border-radius: 12px;
  margin-top: 20px;
}
.tip i {
  margin-right: 10px;
  color: var(--inputBorder);
}
.payment-methods-list, .sports-list, .casino-list {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  margin: 20px 0;
}
.method-badge, .sport-badge, .casino-badge {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 50px;
  padding: 8px 18px;
  font-size: 0.95rem;
  color: #eee;
  transition: all 0.3s ease;
}
.method-badge:hover, .sport-badge:hover, .casino-badge:hover {
  border-color: var(--inputBorder);
  background: rgba(249,176,53,0.1);
  transform: translateY(-2px);
}
.sport-badge i, .casino-badge i {
  margin-right: 8px;
  color: var(--inputBorder);
}

/* Final Thoughts Section */
.mahadev-htp-final {
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.final-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.final-title {
  font-size: 2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 20px;
}
.final-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1rem;
}

/* FAQ Section */
.mahadev-htp-faq {
  padding: 80px 20px;
}
.mahadev-htp-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-htp-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-htp-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-htp-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-htp-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA Section */
.mahadev-htp-cta {
  padding: 80px 20px;
  text-align: center;
  border-top: 1px solid rgba(249,176,53,0.1);
}
.mahadev-htp-cta .cta-text {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 800px;
  margin: 0 auto 40px;
}
.mahadev-htp-cta .cta-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 992px) {
  .step-wrapper {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .step-number-badge {
    margin-bottom: 20px;
  }
  .payment-methods-list, .sports-list, .casino-list {
    justify-content: center;
  }
  .mahadev-htp-faq .faq-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .mahadev-htp-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-htp-hero-text {
    font-size: 1rem;
  }
  .step-wrapper {
    padding: 30px 20px;
  }
  .step-title {
    font-size: 1.5rem;
  }
  .final-card {
    padding: 35px 25px;
  }
  .final-title {
    font-size: 1.6rem;
  }
  .mahadev-htp-hero-cta, .mahadev-htp-cta .cta-buttons {
    flex-direction: column;
    align-items: center;
  }
  .cta-primary, .cta-whatsapp {
    width: 100%;
    max-width: 300px;
    text-align: center;
  }
}
@media (max-width: 480px) {
  .step-number-badge {
    width: 60px;
    height: 60px;
    font-size: 2rem;
  }
  .method-badge, .sport-badge, .casino-badge {
    width: 100%;
    text-align: center;
  }
}
/* =================================================================== How to Play End  =========================================================== */

/* =================================================================== About Us start  =========================================================== */
/* ===== About Us Page Styles ===== */

/* Hero Section */
.mahadev-about-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-about-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 900px;
  margin: 0 auto 1.2rem;
}

/* Journey Section */
.mahadev-about-journey {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.journey-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1100px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.journey-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.journey-card p:last-child {
  margin-bottom: 0;
}

/* Standout Section */
.mahadev-about-standout {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.standout-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  max-width: 1200px;
  margin: 0 auto;
}
.standout-card {
  background: linear-gradient(145deg, #1a1c1e, #16181a);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 35px 25px;
  text-align: center;
  transition: all 0.3s ease;
  box-shadow: 0 10px 25px rgba(0,0,0,0.4);
}
.standout-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-6px);
  box-shadow: 0 20px 35px rgba(249,176,53,0.15);
}
.standout-card i {
  font-size: 2.8rem;
  color: var(--inputBorder);
  margin-bottom: 20px;
}
.standout-card h3 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.standout-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Services Section */
.mahadev-about-services {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  max-width: 1200px;
  margin: 0 auto;
}
.service-card {
  background: rgba(35,37,38,0.5);
  border: 1px solid #333;
  border-radius: 24px;
  padding: 35px 25px;
  text-align: center;
  transition: all 0.3s ease;
}
.service-card:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
}
.service-card i {
  font-size: 2.5rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
}
.service-card h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}
.service-card p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Trust Section */
.mahadev-about-trust {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.trust-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
  text-align: center;
}
.trust-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.trust-card p:last-child {
  margin-bottom: 0;
}

/* Join Section */
.mahadev-about-join {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.join-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.join-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.join-highlight {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin: 20px 0;
}
.join-tagline {
  font-size: 1.2rem;
  font-style: italic;
  color: #fff;
  margin-bottom: 30px;
}
.join-cta {
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 20px;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.2rem;
  font-weight: 600;
  padding: 14px 35px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.2rem;
  font-weight: 600;
  padding: 14px 35px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp i {
  margin-right: 8px;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}

/* FAQ Section */
.mahadev-about-faq {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.mahadev-about-faq .faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 40px auto 0;
}
.mahadev-about-faq .faq-item {
  background: rgba(35,37,38,0.3);
  border: 1px solid #333;
  border-radius: 16px;
  padding: 25px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}
.mahadev-about-faq .faq-item:hover {
  border-color: var(--inputBorder);
  border-left-color: var(--inputBorder);
  transform: translateX(5px);
  background: rgba(35,37,38,0.5);
}
.mahadev-about-faq .faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
}
.mahadev-about-faq .faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
}

/* Final CTA Section */
.mahadev-about-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
  border-top: 1px solid rgba(249,176,53,0.1);
}
.mahadev-about-cta .cta-text {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #ddd;
  max-width: 800px;
  margin: 0 auto 40px;
}
.mahadev-about-cta .cta-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 992px) {
  .mahadev-about-faq .faq-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .mahadev-about-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-about-hero-text {
    font-size: 1rem;
  }
  .journey-card, .trust-card, .join-card {
    padding: 35px 25px;
  }
  .standout-card, .service-card {
    padding: 25px 20px;
  }
  .join-highlight {
    font-size: 1.1rem;
  }
  .join-tagline {
    font-size: 1rem;
  }
  .mahadev-about-cta .cta-buttons,
  .join-cta {
    flex-direction: column;
    align-items: center;
  }
  .cta-primary, .cta-whatsapp {
    width: 100%;
    max-width: 280px;
    text-align: center;
    font-size: 1rem;
    padding: 12px 25px;
  }
}
@media (max-width: 480px) {
  .journey-card, .trust-card, .join-card {
    padding: 25px 20px;
  }
}

/* =================================================================== About Us end  =========================================================== */

/* =================================================================== faqs start =========================================================== */
/* ===== FAQs Page Styles ===== */

/* Hero Section */
.mahadev-faq-hero {
  background-color: var(--bodyBG);
  padding: 120px 20px 80px;
  text-align: center;
}
.mahadev-faq-hero-text {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #ddd;
  max-width: 700px;
  margin: 0 auto 1rem;
}
.faq-search-container {
  max-width: 600px;
  margin: 40px auto 0;
}
.faq-search-box {
  display: flex;
  align-items: center;
  background: rgba(35, 37, 38, 0.8);
  border: 1px solid #333;
  border-radius: 60px;
  padding: 12px 20px;
  transition: all 0.3s ease;
}
.faq-search-box:focus-within {
  border-color: var(--inputBorder);
  box-shadow: 0 0 0 2px rgba(249,176,53,0.2);
}
.faq-search-box i {
  color: var(--inputBorder);
  font-size: 1.2rem;
  margin-right: 12px;
}
.faq-search-box input {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  color: #fff;
  font-size: 1rem;
}
.faq-search-box input::placeholder {
  color: #888;
}
.search-note {
  margin-top: 15px;
  font-size: 0.9rem;
  color: #aaa;
}
.search-note a {
  color: var(--inputBorder);
  text-decoration: none;
}
.search-note a:hover {
  text-decoration: underline;
}

/* FAQ Content */
.mahadev-faq-content {
  background-color: var(--bodyBG);
  padding: 40px 20px 80px;
}
.faq-category {
  margin-bottom: 50px;
}
.category-header {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 30px;
  padding-bottom: 10px;
  border-bottom: 2px solid rgba(249,176,53,0.3);
}
.category-header i {
  font-size: 2rem;
  color: var(--inputBorder);
}
.category-header h2 {
  font-size: 1.8rem;
  font-weight: 600;
  color: #fff;
  margin: 0;
}
.faq-items {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 25px;
}
.faq-item {
  background: rgba(35, 37, 38, 0.4);
  border: 1px solid #333;
  border-radius: 20px;
  padding: 25px;
  transition: all 0.3s ease;
  cursor: pointer;
}
.faq-item:hover {
  border-color: var(--inputBorder);
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(249,176,53,0.1);
  background: rgba(35, 37, 38, 0.6);
}
.faq-item h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.faq-item h3::before {
  content: "Q.";
  font-weight: 800;
  color: var(--inputBorder);
  opacity: 0.7;
}
.faq-item p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #ccc;
  margin: 0;
  padding-left: 28px;
}
.no-results {
  text-align: center;
  padding: 60px 20px;
  background: rgba(35, 37, 38, 0.3);
  border-radius: 30px;
  margin-top: 20px;
}
.no-results i {
  font-size: 3rem;
  color: var(--inputBorder);
  margin-bottom: 15px;
  opacity: 0.6;
}
.no-results p {
  font-size: 1.2rem;
  color: #ddd;
  margin-bottom: 10px;
}
.no-results a {
  color: var(--inputBorder);
  text-decoration: none;
}
.no-results a:hover {
  text-decoration: underline;
}

/* Ready to Enhance Section */
.mahadev-faq-cta {
  background-color: var(--bodyBG);
  padding: 80px 20px;
  text-align: center;
  border-top: 1px solid rgba(249,176,53,0.1);
  border-bottom: 1px solid rgba(249,176,53,0.1);
}
.mahadev-faq-cta .cta-text {
  font-size: 1.2rem;
  color: #ccc;
  max-width: 600px;
  margin: 0 auto 30px;
}
.cta-buttons {
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}
.cta-primary {
  display: inline-block;
  background-color: var(--inputBorder);
  color: #000;
  font-size: 1.2rem;
  font-weight: 600;
  padding: 14px 35px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid var(--inputBorder);
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(249,176,53,0.3);
}
.cta-primary:hover {
  background-color: transparent;
  color: var(--inputBorder);
  box-shadow: 0 6px 20px rgba(249,176,53,0.5);
}
.cta-whatsapp {
  display: inline-block;
  background-color: #25D366;
  color: #fff;
  font-size: 1.2rem;
  font-weight: 600;
  padding: 14px 35px;
  border-radius: 50px;
  text-decoration: none;
  border: 2px solid #25D366;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
}
.cta-whatsapp i {
  margin-right: 8px;
}
.cta-whatsapp:hover {
  background-color: transparent;
  color: #25D366;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}

/* Official Site Section */
.mahadev-faq-official {
  background-color: var(--bodyBG);
  padding: 80px 20px;
}
.official-card {
  background: linear-gradient(145deg, #1e2022, #1a1c1e);
  border: 1px solid #333;
  border-radius: 30px;
  padding: 50px;
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}
.official-card h3 {
  font-size: 1.8rem;
  font-weight: 600;
  color: var(--inputBorder);
  margin-bottom: 20px;
}
.official-card p {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #ddd;
  margin-bottom: 1.5rem;
}
.official-card p:last-child {
  margin-bottom: 0;
}

/* Responsive */
@media (max-width: 992px) {
  .faq-items {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
@media (max-width: 768px) {
  .mahadev-faq-hero {
    padding: 100px 16px 60px;
  }
  .mahadev-faq-hero-text {
    font-size: 1rem;
  }
  .category-header h2 {
    font-size: 1.5rem;
  }
  .faq-item {
    padding: 20px;
  }
  .faq-item h3 {
    font-size: 1.1rem;
  }
  .faq-item p {
    font-size: 0.9rem;
    padding-left: 20px;
  }
  .official-card {
    padding: 35px 25px;
  }
  .official-card h3 {
    font-size: 1.5rem;
  }
  .cta-primary, .cta-whatsapp {
    font-size: 1rem;
    padding: 12px 25px;
  }
}
@media (max-width: 480px) {
  .official-card {
    padding: 25px 20px;
  }
  .official-card h3 {
    font-size: 1.3rem;
  }
}
/* =================================================================== faqs end  =========================================================== */