*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:Poppins,sans-serif;
}

body{
  background:#000;
  color:#fff;
}

/* HEADING */
.heading {
  padding: 20px;
  font-size: 22px;
  font-weight: 600;
  text-align: left;
}
/* Mobile responsive */
@media (max-width: 768px) {
  .heading {
    font-size: 12px; 
    text-align: left;
    padding: 15px; 
    white-space: nowrap; 
    overflow: hidden;
    text-overflow: ellipsis; 
    font-weight: 4px;
  }
}


/* CAROUSEL */
.carousel{
  overflow:hidden;
  width:100%;
}

.track{
  display:flex;
}

.slide{
  flex-shrink:0;
  width:100vw;
}

.slide img{
  width:100%;
  display:block;
}

/* DESKTOP */
@media(min-width:768px){
  .heading{font-size:30px}
  .slide{width:33.33vw;}
}


/* CONTENT */
/* Desktop styles */
.title {
  padding: 20px;
  font-size: 36px;
  font-weight: 700;
  margin-left: 8%;
}

.rating {
  padding-left: 20px;
  font-size: 36px;
  font-weight: bold;
  margin-left: 8%;
}

/* Mobile responsive */
@media (max-width: 768px) {
  .title {
    font-size: 24px;       /* thoda chhota font */
    margin-left: 5%;       /* mobile ke liye chhota margin */
    padding: 10px;         /* padding adjust */
    text-align: center;    /* center align */
  }

  .rating {
    font-size: 24px;       /* font chhota */
    margin-left: 5%;       /* chhota margin */
    padding-left: 10px;    /* padding adjust */
    text-align: center;    /* center align */
  }
}

.desc-text{
  padding:20px;
  font-size:36px;
  font-weight:700;
  margin-left:8%;
}
/*  */
.certificate-section{
  background:#fffbe8;
  padding:40px 20px;
  color:#000;
}

/* SAME LEFT MARGIN AS UPPER CONTENT */
.certificate-section h2,
.certificate-section h3,
.certificate-desc{
  margin-left:8%;
  margin-right:8%;
}

.certificate-section h2{
  font-size:32px;
  font-weight:700;
  margin-bottom:20px;
}

.certificate-img{
  text-align:center;
  margin:30px 0;
}

.certificate-img img{
  max-width:100%;
  height:auto;
}

.certificate-section h3{
  font-size:28px;
  font-weight:700;
  margin-bottom:15px;
}

.certificate-desc{
  font-size:16px;
  line-height:1.6;
}
/*  */
.benefits{
  background:#000;
  color:#fff;
  padding:40px 0;
}

/* SAME LEFT ALIGNMENT AS UPPER SECTIONS */
.benefits h2,
.benefit-list{
  margin-left:8%;
  margin-right:8%;
}

.benefits h2{
  font-size:32px;
  font-weight:700;
  margin-bottom:15px;
}

.hindi-title{
  margin-top:30px;
}

.benefit-list{
  list-style:disc;
  padding-left:20px;
  line-height:1.8;
  font-size:16px;
}
/*  */
.happy-section{
  background:#000;
  padding:40px 0;
}

.happy-heading{
  color:#f6ff00;
  font-size:32px;
  font-weight:700;
  margin-left:8%;
  margin-bottom:20px;
}

/* ===== DESKTOP ===== */
.happy-row{
  display:flex;
  gap:0;
  margin-left:8%;          /* LEFT MARGIN */
  margin-top:20px;
  overflow:hidden;
}

.happy-row img{
  width:28%;               /* THODI CHOTI */
  margin-right:2%;
  display:block;
}

/* ===== MOBILE ===== */
@media(max-width:768px){
  .happy-row{
    margin-left:0;
  }

  .happy-row img{
    width:100%;
    margin-right:0;
    flex-shrink:0;
  }
}
/*  */
.use-wrapper{
  background:#000;
  padding:40px 0;
}

/* WHITE CARD */
.use-box{
  background:#fffbe8;
  max-width:1250px;
  margin:0 auto;
  padding:30px 20px;
  color:#000;
  margin-top: -3%;
}

/* DEFAULT TEXT LEFT SPACE = 36px */
.use-box ol{
  margin-left:36px;
  padding-left:20px;
  line-height:1.7;
  font-size:16px;
}

/* HEADINGS — LEFT BORDER SE */
.use-box h2{
  font-size:39px;        /* size bada */
  font-weight:700;
  margin:0 0 15px 0;     /* no left margin */
}

/* FOR BEST RESULTS LINE — LEFT BORDER SE */
.highlight{
  font-size:30px;        /* size bada */
  font-weight:700;
  margin:25px 0;         /* no left margin */
  color:#000;
}

/* MOBILE */
@media(max-width:768px){
  .use-box{
    margin:0 15px;
  }

  .use-box h2{
    font-size:28px;
  }

  .highlight{
    font-size:24px;
  }
}
/*  */
/* FAQ Image Styling */
.faq-image {
  text-align: center; /* Center image */
  margin-bottom: 30px; /* Space between image and title */
}

.faq-image img {
  width: 60%; /* Desktop size - badi image */
  max-width: 850px; /* Maximum width */
  height: auto; /* Maintain aspect ratio */
  border-radius: 10px; /* Optional - thoda rounded look */
}

/* Mobile Responsive */
@media (max-width: 768px) {
  .faq-image img {
    width: 90%; /* Mobile me thodi chhoti image */
  }
}

.faq-title {
  color: #fff;
  font-size: 44px;
  font-weight: 800;
  margin-bottom: 50px;
  margin-left: 8%;      /* desktop left alignment */
}

.faq-item {
  margin-left: 8%;      /* same line se start */
  margin-bottom: 40px;
}

.faq-item h3 {
  color: #fff;
  font-size: 36px;
  font-weight: 800;
  margin-bottom: 10px;
}

.faq-item p {
  color: #fff;          /* ✅ text white */
  font-size: 21px;
  line-height: 1.9;
  max-width: none;      /* ✅ seedhi line, no restriction */
}

/* ===== MOBILE ===== */
@media (max-width: 768px) {
  .faq-title,
  .faq-item {
    margin-left: 16px;
  }

  .faq-title {
    font-size: 32px;
  }

  .faq-item h3 {
    font-size: 26px;
  }

  .faq-item p {
    font-size: 18px;
  }
}
/* big imge  */
.sp-carousel {
  width: 100%;
  overflow: hidden;
  background: #fffbe8;
  padding: 25px 0;
}

.sp-track {
  display: flex;
  transition: transform 1.2s ease;
}

.sp-slide {
  min-width: 100%;
  padding: 0 20px;
  box-sizing: border-box;
  text-align: center;   /* 👈 text center */
}

.sp-user {
  display: flex;
  align-items: center;
  justify-content: center;   /* 👈 image + name center */
  gap: 10px;
  margin-bottom: 12px;
}

.sp-user img {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
}

.sp-user h4 {
  font-size: 15px;
  margin: 0;
}

.sp-user span {
  font-size: 13px;
  color: #666;
}

.sp-slide p {
  font-size: 16px;
  line-height: 1.6;
  color: #111;
  max-width: 620px;     /* 👈 zyada failne se bachaane ke liye */
  margin: 0 auto;       /* 👈 center */
}

/* mobile */
@media (max-width: 768px) {
  .sp-slide p {
    font-size: 15px;
  }
}
.buy-btn {
  position: relative;
  overflow: hidden;
  width: 250px;
  height: 65px;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
  border: none;
  background-color: rgb(6, 83, 6);
  color: #fff;
  border-radius: 5px;
}

/* Both texts absolute but start hidden */
.btn-text {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0; /* Start hidden */
  transition: opacity 0.5s;
  animation: slideText 3s infinite;
}

/* First text visible initially */
.btn-text.first {
  opacity: 1;
  animation-delay: 0s;
}

/* Second text appears after 1.5s */
.btn-text.second {
  animation-delay: 1.5s;
}

@keyframes slideText {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0; }
}
/* BUY BUTTON */
.buy-btn {
  display: inline-block;
  position: relative;
  width: 200px;          
  height: 55px;          
  background: #28a745;   
  color: #fff;
  font-weight: bold;
  border-radius: 8px;
  border: 2px solid #fff; 
  cursor: pointer;
  overflow: hidden;
  text-align: center;
  line-height: 55px;      
  margin: 20px auto;       /* add some vertical gap from other elements */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 15px;         /* add horizontal space inside */
}
/* Hide checkbox */
#formToggle {
  display: none;
}

/* Modal hidden by default */
/* Hide checkbox */
#formToggle {
  display: none;
}

/* Modal hidden by default */
.modal {
  display: flex;
  position: fixed;
  inset: 0;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.6);
  z-index: 999;
  opacity: 0;
  pointer-events: none; /* prevent clicks when hidden */
  transition: opacity 0.3s ease;
}

/* Show modal when checkbox checked */
#formToggle:checked ~ .modal {
  opacity: 1;
  pointer-events: auto;
}

/* Modal content */
.modal-content {
  background: #fff;
  padding: 35px 30px;
  width: 90%;
  max-width: 400px;
  border-radius: 20px;
  text-align: center;
  position: relative;
  box-shadow: 0 15px 50px rgba(0,0,0,0.3);
  transform: scale(0.8);
  opacity: 0;
  transition: all 0.3s ease;
}

/* Animate modal content on click */
#formToggle:checked ~ .modal .modal-content {
  transform: scale(1);
  opacity: 1;
}

/* Close button */
.close-btn {
  position: absolute;
  top: 12px;
  right: 15px;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
  color: #888;
  transition: 0.3s;
}
.close-btn:hover { color: #ff4d4d; }

/* Logo */
.form-logo {
  max-width: 120px;
  margin-bottom: 25px;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}

/* Inputs */
.modal-content input {
  width: 100%;
  padding: 15px 18px;
  margin-bottom: 18px;
  border: 1px solid #ccc;
  border-radius: 12px;
  outline: none;
  font-size: 16px;
  transition: all 0.3s ease;
}
.modal-content input:focus {
  border-color: #28a745;
  box-shadow: 0 0 12px rgba(40, 167, 69, 0.25);
}

/* Submit button */
.submit-btn {
  width: 100%;
  padding: 16px;
  background: #28a745;
  color: #fff;
  border: none;
  border-radius: 12px;
  font-weight: bold;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.3s ease;
}
.submit-btn:hover {
  background: #218838;
  box-shadow: 0 8px 20px rgba(0,0,0,0.2);
}
/* Modal title */
.modal-title {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 8px;
  color: #333;
}

/* Modal subtitle */
.modal-subtitle {
  font-size: 15px;
  margin-bottom: 20px;
  color: #555;
}
*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:Poppins,sans-serif;
}

body{
  background:#000;
  color:#fff;
}

.heading {
  padding: 20px;
  font-size: 22px;
  font-weight: 600;
  text-align: left;
}

@media (max-width: 768px) {
  .heading {
    font-size: 12px;
    text-align: left;
    padding: 15px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 4px;
  }
}

.carousel{
  overflow:hidden;
  width:100%;
}

.track{
  display:flex;
}

.slide{
  flex-shrink:0;
  width:100vw;
}

.slide img{
  width:100%;
  display:block;
}

@media(min-width:768px){
  .heading{font-size:30px}
  .slide{width:33.33vw;}
}

.title {
  padding: 20px;
  font-size: 36px;
  font-weight: 700;
  margin-left: 8%;
}

.rating {
  padding-left: 20px;
  font-size: 36px;
  font-weight: bold;
  margin-left: 8%;
}

@media (max-width: 768px) {
  .title {
    font-size: 24px;
    margin-left: 5%;
    padding: 10px;
    text-align: center;
  }

  .rating {
    font-size: 24px;
    margin-left: 5%;
    padding-left: 10px;
    text-align: center;
  }
}

.desc-text{
  padding:20px;
  font-size:36px;
  font-weight:700;
  margin-left:8%;
}

.certificate-section{
  background:#fffbe8;
  padding:40px 20px;
  color:#000;
}

.certificate-section h2,
.certificate-section h3,
.certificate-desc{
  margin-left:8%;
  margin-right:8%;
}

.certificate-section h2{
  font-size:32px;
  font-weight:700;
  margin-bottom:20px;
}

.certificate-img{
  text-align:center;
  margin:30px 0;
}

.certificate-img img{
  max-width:100%;
  height:auto;
}

.certificate-section h3{
  font-size:28px;
  font-weight:700;
  margin-bottom:15px;
}

.certificate-desc{
  font-size:16px;
  line-height:1.6;
}

.benefits{
  background:#000;
  color:#fff;
  padding:40px 0;
}

.benefits h2,
.benefit-list{
  margin-left:8%;
  margin-right:8%;
}

.benefits h2{
  font-size:32px;
  font-weight:700;
  margin-bottom:15px;
}

.hindi-title{
  margin-top:30px;
}

.benefit-list{
  list-style:disc;
  padding-left:20px;
  line-height:1.8;
  font-size:16px;
}

.happy-section{
  background:#000;
  padding:40px 0;
}

.happy-heading{
  color:#f6ff00;
  font-size:32px;
  font-weight:700;
  margin-left:8%;
  margin-bottom:20px;
}

.happy-row{
  display:flex;
  gap:0;
  margin-left:8%;
  margin-top:20px;
  overflow:hidden;
}

.happy-row img{
  width:28%;
  margin-right:2%;
  display:block;
}

@media(max-width:768px){
  .happy-row{
    margin-left:0;
  }

  .happy-row img{
    width:100%;
    margin-right:0;
    flex-shrink:0;
  }
}

.use-wrapper{
  background:#000;
  padding:40px 0;
}

.use-box{
  background:#fffbe8;
  max-width:1250px;
  margin:0 auto;
  padding:30px 20px;
  color:#000;
  margin-top: -3%;
}

.use-box ol{
  margin-left:36px;
  padding-left:20px;
  line-height:1.7;
  font-size:16px;
}

.use-box h2{
  font-size:39px;
  font-weight:700;
  margin:0 0 15px 0;
}

.highlight{
  font-size:30px;
  font-weight:700;
  margin:25px 0;
  color:#000;
}

@media(max-width:768px){
  .use-box{
    margin:0 15px;
  }

  .use-box h2{
    font-size:28px;
  }

  .highlight{
    font-size:24px;
  }
}

.faq-image {
  text-align: center;
  margin-bottom: 30px;
}

.faq-image img {
  width: 60%;
  max-width: 850px;
  height: auto;
  border-radius: 10px;
}

@media (max-width: 768px) {
  .faq-image img {
    width: 90%;
  }
}

.faq-title {
  color: #fff;
  font-size: 44px;
  font-weight: 800;
  margin-bottom: 50px;
  margin-left: 8%;
}

.faq-item {
  margin-left: 8%;
  margin-bottom: 40px;
}

.faq-item h3 {
  color: #fff;
  font-size: 36px;
  font-weight: 800;
  margin-bottom: 10px;
}

.faq-item p {
  color: #fff;
  font-size: 21px;
  line-height: 1.9;
  max-width: none;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .faq-title,
  .faq-item {
    margin-left: 16px;
  }

  .faq-title {
    font-size: 32px;
  }

  .faq-item h3 {
    font-size: 26px;
  }

  .faq-item p {
    font-size: 18px;
  }
}

.sp-carousel {
  width: 100%;
  overflow: hidden;
  background: #fffbe8;
  padding: 25px 0;
}

.sp-track {
  display: flex;
  transition: transform 1.2s ease;
}

.sp-slide {
  min-width: 100%;
  padding: 0 20px;
  box-sizing: border-box;
  text-align: center;
}

.sp-user {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-bottom: 12px;
}

.sp-user img {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
}

.sp-user h4 {
  font-size: 15px;
  margin: 0;
}

.sp-user span {
  font-size: 13px;
  color: #666;
}

.sp-slide p {
  font-size: 16px;
  line-height: 1.6;
  color: #111;
  max-width: 620px;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .sp-slide p {
    font-size: 15px;
  }
}

.buy-btn {
  display: inline-block;
  position: relative;
  width: 200px;
  height: 55px;
  background: #28a745;
  color: #fff;
  font-weight: bold;
  border-radius: 8px;
  border: 2px solid #fff;
  cursor: pointer;
  overflow: hidden;
  text-align: center;
  line-height: 55px;
  margin: 20px auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 15px;
}

.btn-text {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.5s;
  animation: slideText 3s infinite;
}

.btn-text.first {
  opacity: 1;
  animation-delay: 0s;
}

.btn-text.second {
  animation-delay: 1.5s;
}

@keyframes slideText {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0; }
}

#formToggle {
  display: none;
}

.modal {
  display: flex;
  position: fixed;
  inset: 0;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.6);
  z-index: 999;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

#formToggle:checked ~ .modal {
  opacity: 1;
  pointer-events: auto;
}

.modal-content {
  background: #fff;
  padding: 35px 30px;
  width: 90%;
  max-width: 400px;
  border-radius: 20px;
  text-align: center;
  position: relative;
  box-shadow: 0 15px 50px rgba(0,0,0,0.3);
  transform: scale(0.8);
  opacity: 0;
  transition: all 0.3s ease;
}

#formToggle:checked ~ .modal .modal-content {
  transform: scale(1);
  opacity: 1;
}

.close-btn {
  position: absolute;
  top: 12px;
  right: 15px;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
  color: #888;
  transition: 0.3s;
}
.close-btn:hover { color: #ff4d4d; }

.form-logo {
  max-width: 120px;
  margin-bottom: 25px;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}

.modal-content input {
  width: 100%;
  padding: 15px 18px;
  margin-bottom: 18px;
  border: 1px solid #ccc;
  border-radius: 12px;
  outline: none;
  font-size: 16px;
  transition: all 0.3s ease;
}
.modal-content input:focus {
  border-color: #28a745;
  box-shadow: 0 0 12px rgba(40, 167, 69, 0.25);
}

.submit-btn {
  width: 100%;
  padding: 16px;
  background: #28a745;
  color: #fff;
  border: none;
  border-radius: 12px;
  font-weight: bold;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.3s ease;
}
.submit-btn:hover {
  background: #218838;
  box-shadow: 0 8px 20px rgba(0,0,0,0.2);
}

.modal-title {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 8px;
  color: #333;
}

.modal-subtitle {
  font-size: 15px;
  margin-bottom: 20px;
  color: #555;
}

/* LEFT SIDE CALL BUTTON */
.sticky-left {
  position: fixed;
  left: 10px;      /* distance from left */
  top: 50%;        /* vertical center */
  transform: translateY(-50%);
  background: #28a745;
  color: #fff;
  padding: 12px 18px;
  border-radius: 8px;
  font-weight: bold;
  text-decoration: none;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
  z-index: 9999;
  transition: transform 0.3s;
}

.sticky-left:hover {
  transform: translateY(-50%) scale(1.1);
}

/* RIGHT SIDE BUTTONS CONTAINER */
.sticky-right {
  position: fixed;
  right: 10px;      /* distance from right */
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 12px;
  z-index: 9999;
}

/* RIGHT SIDE BUTTONS */
.sticky-right .right-btn {
  background: #007bff;
  color: #fff;
  padding: 12px 18px;
  border-radius: 8px;
  text-decoration: none;
  font-weight: bold;
  text-align: center;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
  transition: transform 0.3s;
}

.sticky-right .right-btn:hover {
  transform: scale(1.1);
}
*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family: Arial, sans-serif;
}

body{
  background:#000;
  color:#fff;
}

.wrapper{
  max-width:420px;
  margin:auto;
  padding:20px;
}

.logo{
  text-align:center;
  margin-bottom:20px;
}

.logo h1{
  font-size:32px;
  letter-spacing:2px;
}

.logo span{
  color:#ffcc00;
}

.logo p{
  font-size:12px;
  margin-top:5px;
  opacity:0.8;
}

/* CARD */
.card{
  background:#2e2e2e;
  border-radius:18px;
  padding:15px;
  margin-bottom:15px;
  position:relative;
}

.popular{
  border:2px solid #ffcc00;
}

.badge{
  position:absolute;
  top:-12px;
  left:50%;
  transform:translateX(-50%);
  background:red;
  color:#fff;
  padding:6px 16px;
  border-radius:20px;
  font-size:12px;
  font-weight:bold;
}

.card-content{
  display:flex;
  align-items:center;
  gap:12px;
}

.left img{
  width:55px;
}

.middle h2{
  font-size:18px;
}

.save{
  font-size:13px;
  color:#ffcc00;
}

.right{
  margin-left:auto;
  text-align:right;
}

.right h3{
  font-size:20px;
}

.mrp{
  text-decoration:line-through;
  opacity:0.6;
  font-size:14px;
}

.right span{
  font-size:10px;
  opacity:0.7;
}

/* BUY BUTTON */
.buy-btn{
  width:100%;
  padding:16px;
  background:#c40000;
  border:none;
  border-radius:30px;
  color:#fff;
  font-size:18px;
  font-weight:bold;
  margin:20px 0;
}

/* RATING */
.rating{
  text-align:center;
}

.rating p{
  font-size:14px;
  margin-top:5px;
  opacity:0.8;
}

/* DESKTOP */
@media(min-width:768px){
  .wrapper{
    max-width:600px;
  }
}



*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:Poppins,sans-serif;
}

body{
  background:#000;
  color:#fff;
}

.heading {
  padding: 20px;
  font-size: 22px;
  font-weight: 600;
  text-align: left;
}

@media (max-width: 768px) {
  .heading {
    font-size: 12px;
    text-align: left;
    padding: 15px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 4px;
  }
}

.carousel{
  overflow:hidden;
  width:100%;
}

.track{
  display:flex;
}

.slide{
  flex-shrink:0;
  width:100vw;
}

.slide img{
  width:100%;
  display:block;
}

@media(min-width:768px){
  .heading{font-size:30px}
  .slide{width:33.33vw;}
}

.title {
  padding: 20px;
  font-size: 36px;
  font-weight: 700;
  margin-left: 8%;
}

.rating {
  padding-left: 20px;
  font-size: 36px;
  font-weight: bold;
  margin-left: 8%;
}

@media (max-width: 768px) {
  .title {
    font-size: 24px;
    margin-left: 5%;
    padding: 10px;
    text-align: center;
  }

  .rating {
    font-size: 24px;
    margin-left: 5%;
    padding-left: 10px;
    text-align: center;
  }
}

.desc-text{
  padding:20px;
  font-size:36px;
  font-weight:700;
  margin-left:8%;
}

.certificate-section{
  background:#fffbe8;
  padding:40px 20px;
  color:#000;
}

.certificate-section h2,
.certificate-section h3,
.certificate-desc{
  margin-left:8%;
  margin-right:8%;
}

.certificate-section h2{
  font-size:32px;
  font-weight:700;
  margin-bottom:20px;
}

.certificate-img{
  text-align:center;
  margin:30px 0;
}

.certificate-img img{
  max-width:100%;
  height:auto;
}

.certificate-section h3{
  font-size:28px;
  font-weight:700;
  margin-bottom:15px;
}

.certificate-desc{
  font-size:16px;
  line-height:1.6;
}

.benefits{
  background:#000;
  color:#fff;
  padding:40px 0;
}

.benefits h2,
.benefit-list{
  margin-left:8%;
  margin-right:8%;
}

.benefits h2{
  font-size:32px;
  font-weight:700;
  margin-bottom:15px;
}

.hindi-title{
  margin-top:30px;
}

.benefit-list{
  list-style:disc;
  padding-left:20px;
  line-height:1.8;
  font-size:16px;
}

.happy-section{
  background:#000;
  padding:40px 0;
}

.happy-heading{
  color:#f6ff00;
  font-size:32px;
  font-weight:700;
  margin-left:8%;
  margin-bottom:20px;
}

.happy-row{
  display:flex;
  gap:0;
  margin-left:8%;
  margin-top:20px;
  overflow:hidden;
}

.happy-row img{
  width:28%;
  margin-right:2%;
  display:block;
}

@media(max-width:768px){
  .happy-row{
    margin-left:0;
  }

  .happy-row img{
    width:100%;
    margin-right:0;
    flex-shrink:0;
  }
}

.use-wrapper{
  background:#000;
  padding:40px 0;
}

.use-box{
  background:#fffbe8;
  max-width:1250px;
  margin:0 auto;
  padding:30px 20px;
  color:#000;
  margin-top: -3%;
}

.use-box ol{
  margin-left:36px;
  padding-left:20px;
  line-height:1.7;
  font-size:16px;
}

.use-box h2{
  font-size:39px;
  font-weight:700;
  margin:0 0 15px 0;
}

.highlight{
  font-size:30px;
  font-weight:700;
  margin:25px 0;
  color:#000;
}

@media(max-width:768px){
  .use-box{
    margin:0 15px;
  }

  .use-box h2{
    font-size:28px;
  }

  .highlight{
    font-size:24px;
  }
}

.faq-image {
  text-align: center;
  margin-bottom: 30px;
}

.faq-image img {
  width: 60%;
  max-width: 850px;
  height: auto;
  border-radius: 10px;
}

@media (max-width: 768px) {
  .faq-image img {
    width: 90%;
  }
}

.faq-title {
  color: #fff;
  font-size: 44px;
  font-weight: 800;
  margin-bottom: 50px;
  margin-left: 8%;
}

.faq-item {
  margin-left: 8%;
  margin-bottom: 40px;
}

.faq-item h3 {
  color: #fff;
  font-size: 36px;
  font-weight: 800;
  margin-bottom: 10px;
}

.faq-item p {
  color: #fff;
  font-size: 21px;
  line-height: 1.9;
  max-width: none;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .faq-title,
  .faq-item {
    margin-left: 16px;
  }

  .faq-title {
    font-size: 32px;
  }

  .faq-item h3 {
    font-size: 26px;
  }

  .faq-item p {
    font-size: 18px;
  }
}

.sp-carousel {
  width: 100%;
  overflow: hidden;
  background: #fffbe8;
  padding: 25px 0;
}

.sp-track {
  display: flex;
  transition: transform 1.2s ease;
}

.sp-slide {
  min-width: 100%;
  padding: 0 20px;
  box-sizing: border-box;
  text-align: center;
}

.sp-user {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-bottom: 12px;
}

.sp-user img {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
}

.sp-user h4 {
  font-size: 15px;
  margin: 0;
}

.sp-user span {
  font-size: 13px;
  color: #666;
}

.sp-slide p {
  font-size: 16px;
  line-height: 1.6;
  color: #111;
  max-width: 620px;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .sp-slide p {
    font-size: 15px;
  }
}

.buy-btn {
  display: inline-block;
  position: relative;
  width: 200px;
  height: 55px;
  background: #28a745;
  color: #fff;
  font-weight: bold;
  border-radius: 8px;
  border: 2px solid #fff;
  cursor: pointer;
  overflow: hidden;
  text-align: center;
  line-height: 55px;
  margin: 20px auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 15px;
}

.btn-text {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.5s;
  animation: slideText 3s infinite;
}

.btn-text.first {
  opacity: 1;
  animation-delay: 0s;
}

.btn-text.second {
  animation-delay: 1.5s;
}

@keyframes slideText {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0; }
}

#formToggle {
  display: none;
}

.modal {
  display: flex;
  position: fixed;
  inset: 0;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.6);
  z-index: 999;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

#formToggle:checked ~ .modal {
  opacity: 1;
  pointer-events: auto;
}

.modal-content {
  background: #fff;
  padding: 35px 30px;
  width: 90%;
  max-width: 400px;
  border-radius: 20px;
  text-align: center;
  position: relative;
  box-shadow: 0 15px 50px rgba(0,0,0,0.3);
  transform: scale(0.8);
  opacity: 0;
  transition: all 0.3s ease;
}

#formToggle:checked ~ .modal .modal-content {
  transform: scale(1);
  opacity: 1;
}

.close-btn {
  position: absolute;
  top: 12px;
  right: 15px;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
  color: #888;
  transition: 0.3s;
}
.close-btn:hover { color: #ff4d4d; }

.form-logo {
  max-width: 120px;
  margin-bottom: 25px;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}

.modal-content input {
  width: 100%;
  padding: 15px 18px;
  margin-bottom: 18px;
  border: 1px solid #ccc;
  border-radius: 12px;
  outline: none;
  font-size: 16px;
  transition: all 0.3s ease;
}
.modal-content input:focus {
  border-color: #28a745;
  box-shadow: 0 0 12px rgba(40, 167, 69, 0.25);
}

.submit-btn {
  width: 100%;
  padding: 16px;
  background: #28a745;
  color: #fff;
  border: none;
  border-radius: 12px;
  font-weight: bold;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.3s ease;
}
.submit-btn:hover {
  background: #218838;
  box-shadow: 0 8px 20px rgba(0,0,0,0.2);
}

.modal-title {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 8px;
  color: #333;
}

.modal-subtitle {
  font-size: 15px;
  margin-bottom: 20px;
  color: #555;
}
/* LEFT SIDE CALL BUTTON */
.sticky-left {
  position: fixed;
  left: 10px;      /* distance from left */
  top: 50%;        /* vertical center */
  transform: translateY(-50%);
  background: #28a745;
  color: #fff;
  padding: 12px 18px;
  border-radius: 8px;
  font-weight: bold;
  text-decoration: none;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
  z-index: 9999;
  transition: transform 0.3s;
}

.sticky-left:hover {
  transform: translateY(-50%) scale(1.1);
}

/* RIGHT SIDE BUTTONS CONTAINER */
.sticky-right {
  position: fixed;
  right: 10px;      /* distance from right */
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 12px;
  z-index: 9999;
}
.sticky-right .right-btn:hover {
  transform: scale(1.1);
}
/*  */

.wrapper{
  max-width:420px;
  margin:auto;
  padding:20px;
}

.logo{
  text-align:center;
  margin-bottom:20px;
}

.logo h1{
  font-size:32px;
  letter-spacing:2px;
}

.logo span{
  color:#ffcc00;
}

.logo p{
  font-size:12px;
  margin-top:5px;
  opacity:0.8;
}

/* CARD */
.card{
  background:#2e2e2e;
  border-radius:18px;
  padding:15px;
  margin-bottom:15px;
  position:relative;
}

.popular{
  border:2px solid #ffcc00;
}

.badge{
  position:absolute;
  top:-12px;
  left:50%;
  transform:translateX(-50%);
  background:red;
  color:#fff;
  padding:6px 16px;
  border-radius:20px;
  font-size:12px;
  font-weight:bold;
}

.card-content{
  display:flex;
  align-items:center;
  gap:12px;
}

.left img{
  width:55px;
}

.middle h2{
  font-size:18px;
}

.save{
  font-size:13px;
  color:#ffcc00;
}

.right{
  margin-left:auto;
  text-align:right;
}

.right h3{
  font-size:20px;
}

.mrp{
  text-decoration:line-through;
  opacity:0.6;
  font-size:14px;
}

.right span{
  font-size:10px;
  opacity:0.7;
}

/* BUY BUTTON */
.buy-btn{
  width:100%;
  padding:16px;
  background:#c40000;
  border:none;
  border-radius:30px;
  color:#fff;
  font-size:18px;
  font-weight:bold;
  margin:20px 0;
}

/* RATING */
.rating{
  text-align:center;
}

.rating p{
  font-size:14px;
  margin-top:5px;
  opacity:0.8;
}

/* DESKTOP */
@media(min-width:768px){
  .wrapper{
    max-width:600px;
  }
} 

.buy-btn{
  width: 100%;
  max-width: 420px;
  height: 55px;
  background: #c40000;   /* RED */
  color: #fff;
  font-weight: 700;
  border-radius: 30px;
  border: none;
  cursor: pointer;
  overflow: hidden;
  text-align: center;
  line-height: 55px;
  margin: 20px auto;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.buy-btn:hover{
  background:#a80000;
}
.buy-btn {
  width:100%;
  padding:16px;
  background:#c40000;
  border:none;
  border-radius:30px;
  color:#fff;
  font-size:18px;
  font-weight:bold;
  margin:20px 0;
}

@media (max-width:768px){
  .buy-btn{
    max-width: 90%;
    height: 52px;
    font-size:16px;
  }
}
.submit-btn {
  width: 100%;
  padding: 16px;
  background: #c40000;
  color: #fff;
  border: none;
  border-radius: 12px;
  font-weight: bold;
  font-size: 16px;
  cursor: pointer;
}

.submit-btn:hover {
  background: #a80000;
}
*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:Poppins,sans-serif;
}

body{
  background:#000;
  color:#fff;
}

/* ================= HEADINGS ================= */
.heading{
  padding:20px;
  font-size:22px;
  font-weight:600;
}

.title,
.rating,
.desc-text{
  margin-left:8%;
  padding:20px;
  font-weight:700;
}

.title{font-size:36px;}
.rating{font-size:36px;}
.desc-text{font-size:36px;}

/* ================= CAROUSEL ================= */
.carousel{overflow:hidden;width:100%;}
.track{display:flex;}
.slide{flex-shrink:0;width:100vw;}
.slide img{width:100%;display:block;}

@media(min-width:768px){
  .slide{width:33.33vw;}
}

/* ================= CERTIFICATE ================= */
.certificate-section{
  background:#fffbe8;
  color:#000;
  padding:40px 20px;
}

.certificate-section h2,
.certificate-section h3,
.certificate-desc{
  margin:0 8%;
}

.certificate-section h2{font-size:32px;margin-bottom:20px;}
.certificate-section h3{font-size:28px;margin-bottom:15px;}
.certificate-desc{font-size:16px;line-height:1.6;}

.certificate-img{text-align:center;margin:30px 0;}
.certificate-img img{max-width:100%;}

/* ================= BENEFITS ================= */
.benefits{
  background:#000;
  padding:40px 0;
}

.benefits h2,
.benefit-list{
  margin:0 8%;
}

.benefits h2{font-size:32px;margin-bottom:15px;}
.benefit-list{
  list-style:disc;
  padding-left:20px;
  font-size:16px;
  line-height:1.8;
}

/* ================= HAPPY USERS ================= */
.happy-heading{
  color:#f6ff00;
  font-size:32px;
  margin-left:8%;
}

.happy-row{
  display:flex;
  margin-left:8%;
  overflow:hidden;
}

.happy-row img{
  width:28%;
  margin-right:2%;
}

/* ================= USE BOX ================= */
.use-wrapper{padding:40px 0;}
.use-box{
  background:#fffbe8;
  color:#000;
  max-width:1250px;
  margin:auto;
  padding:30px 20px;
}

.use-box h2{font-size:39px;margin-bottom:15px;}
.use-box ol{margin-left:36px;font-size:16px;line-height:1.7;}

.highlight{
  font-size:30px;
  font-weight:700;
  margin:25px 0;
}

/* ================= FAQ ================= */
.faq-image{text-align:center;margin-bottom:30px;}
.faq-image img{width:60%;border-radius:10px;}

.faq-title{
  font-size:44px;
  font-weight:800;
  margin-left:8%;
  margin-bottom:50px;
}

.faq-item{
  margin-left:8%;
  margin-bottom:40px;
}

.faq-item h3{font-size:36px;margin-bottom:10px;}
.faq-item p{font-size:21px;line-height:1.9;}

/* ================= TESTIMONIAL ================= */
.sp-carousel{
  background:#fffbe8;
  padding:25px 0;
}

.sp-track{
  display:flex;
  transition:transform 1.2s ease;
}

.sp-slide{
  min-width:100%;
  padding:0 20px;
  text-align:center;
}

.sp-user{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
}

.sp-user img{
  width:42px;
  height:42px;
  border-radius:50%;
}

.sp-slide p{
  font-size:16px;
  color:#111;
  max-width:620px;
  margin:auto;
}

/* ================= BUY BUTTON (RED) ================= */
.buy-btn{
  width:100%;
  max-width:420px;
  height:55px;
  background:#c40000;
  color:#fff;
  border:none;
  border-radius:30px;
  font-size:18px;
  font-weight:700;
  cursor:pointer;
  margin:20px auto;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
}

.buy-btn:hover{background:#a80000;}

.btn-text{
  position:absolute;
  width:100%;
  text-align:center;
  animation:fadeText 3s infinite;
}

.btn-text.second{animation-delay:1.5s;}

@keyframes fadeText{
  0%,49%{opacity:1}
  50%,100%{opacity:0}
}

/* ================= MODAL ================= */
#formToggle{display:none;}

.modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.6);
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  pointer-events:none;
  z-index:999;
}

#formToggle:checked ~ .modal{
  opacity:1;
  pointer-events:auto;
}

.modal-content{
  background:#fff;
  padding:30px;
  width:90%;
  max-width:400px;
  border-radius:20px;
  text-align:center;
}

.modal-content input{
  width:100%;
  padding:14px;
  margin-bottom:15px;
  border-radius:10px;
  border:1px solid #ccc;
}

.submit-btn{
  width:100%;
  padding:16px;
  background:#c40000;
  color:#fff;
  border:none;
  border-radius:12px;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
}

.submit-btn:hover{background:#a80000;}

.close-btn{
  position:absolute;
  top:10px;
  right:15px;
  font-size:28px;
  cursor:pointer;
}

/* ================= STICKY CALL ================= */
.sticky-left{
  position:fixed;
  left:10px;
  top:50%;
  transform:translateY(-50%);
  background:#c40000;
  color:#fff;
  padding:12px 18px;
  border-radius:8px;
  text-decoration:none;
  z-index:9999;
}

/* ================= MOBILE ================= */
@media(max-width:768px){
  .title,.rating,.desc-text,
  .heading,.faq-title,.faq-item,
  .benefits h2,.benefit-list{
    margin-left:15px;
  }

  .title,.rating,.desc-text{font-size:24px;}
  .faq-title{font-size:32px;}
  .faq-item h3{font-size:26px;}
  .faq-item p{font-size:18px;}

  .faq-image img{width:90%;}
  .buy-btn{max-width:90%;}
}



/* ================= PRICING WRAPPER ================= */
.wrapper{
  max-width:420px;
  margin:40px auto;
  padding:20px;
}

/* LOGO */
.logo{
  text-align:center;
  margin-bottom:25px;
}
.logo h1{
  font-size:32px;
  letter-spacing:2px;
}
.logo span{color:#ffcc00;}
.logo p{
  font-size:12px;
  opacity:0.8;
}

/* ================= CARD ================= */
.card{
  background:#2e2e2e;
  border-radius:18px;
  padding:16px;
  margin-bottom:18px;
  position:relative;
}

.card.popular{
  border:2px solid #ffcc00;
}

/* MOST POPULAR BADGE */
.badge{
  position:absolute;
  top:-14px;
  left:50%;
  transform:translateX(-50%);
  background:#c40000;
  color:#fff;
  padding:6px 18px;
  border-radius:20px;
  font-size:12px;
  font-weight:700;
}

/* CARD CONTENT */
.card-content{
  display:flex;
  align-items:center;
  gap:14px;
}

.left img{
  width:55px;
}

.middle h2{
  font-size:18px;
  margin-bottom:4px;
}

.save{
  font-size:13px;
  color:#ffcc00;
}

.right{
  margin-left:auto;
  text-align:right;
}

.right h3{
  font-size:20px;
}

.mrp{
  font-size:14px;
  text-decoration:line-through;
  opacity:0.6;
}

.right span{
  font-size:11px;
  opacity:0.7;
}

/* ================= BUY BUTTON (RED – SAME WIDTH) ================= */
.buy-btn{
  width:100%;
  height:55px;
  background:#c40000;
  border:none;
  border-radius:30px;
  color:#fff;
  font-size:18px;
  font-weight:700;
  cursor:pointer;
  margin:22px 0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.buy-btn:hover{
  background:#a80000;
}

/* ================= RATING ================= */
.rating{
  text-align:center;
  font-size:18px;
}

.rating p{
  font-size:14px;
  margin-top:6px;
  opacity:0.8;
}

/* ================= DESKTOP FIX ================= */
@media(min-width:768px){
  .wrapper{
    max-width:600px;
  }

  .buy-btn{
    max-width:600px;
    margin-left:auto;
    margin-right:auto;
  }
}

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:Poppins,sans-serif;
}

body{
  background:#000;
  color:#fff;
}

/* ================= HEADINGS ================= */
.heading{
  padding:20px;
  font-size:22px;
  font-weight:600;
}

@media(max-width:768px){
  .heading{
    font-size:14px;
    padding:15px;
  }
}

/* ================= CAROUSEL ================= */
.carousel{overflow:hidden;width:100%;}
.track{display:flex;}
.slide{flex-shrink:0;width:100vw;}
.slide img{width:100%;display:block;}

@media(min-width:768px){
  .slide{width:33.33vw;}
}

/* ================= TITLES ================= */
.title,.rating-text{
  padding:20px;
  font-size:36px;
  font-weight:700;
  margin-left:8%;
}

@media(max-width:768px){
  .title,.rating-text{
    font-size:24px;
    margin-left:0;
    text-align:center;
  }
}

/* ================= CERTIFICATE ================= */
.certificate-section{
  background:#fffbe8;
  color:#000;
  padding:40px 20px;
}

.certificate-section h2{
  font-size:32px;
  margin-bottom:20px;
}

.certificate-img{text-align:center;margin:30px 0;}
.certificate-img img{max-width:100%;}

.certificate-desc{
  font-size:16px;
  line-height:1.7;
}

/* ================= BENEFITS ================= */
.benefits{
  padding:40px 0;
}

.benefits h2{
  font-size:32px;
  margin-left:8%;
}

.benefit-list{
  margin:15px 8%;
  font-size:16px;
  line-height:1.8;
}

/* ================= HAPPY USERS ================= */
.happy-heading{
  color:#f6ff00;
  font-size:32px;
  margin-left:8%;
}

.happy-row{
  display:flex;
  overflow:hidden;
  margin-left:8%;
}

.happy-row img{
  width:28%;
  margin-right:2%;
}

@media(max-width:768px){
  .happy-row{margin-left:0;}
  .happy-row img{width:100%;}
}

/* ================= FAQ ================= */
.faq-title{
  font-size:44px;
  margin:40px 8%;
}

.faq-item{
  margin:0 8% 30px;
}

.faq-item h3{font-size:32px;}
.faq-item p{font-size:18px;line-height:1.8;}

@media(max-width:768px){
  .faq-title{font-size:30px;margin-left:16px;}
  .faq-item{margin-left:16px;}
}

/* ================= POPUP ================= */
#formToggle{display:none;}

.modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.6);
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  pointer-events:none;
  z-index:999;
}

#formToggle:checked ~ .modal{
  opacity:1;
  pointer-events:auto;
}

.modal-content{
  background:#fff;
  padding:30px;
  width:90%;
  max-width:400px;
  border-radius:20px;
  text-align:center;
  position:relative;
}

.close-btn{
  position:absolute;
  top:12px;
  right:15px;
  font-size:26px;
  cursor:pointer;
}

/* ================= FORM ================= */
.modal-content input{
  width:100%;
  padding:14px;
  margin-bottom:15px;
  border-radius:10px;
  border:1px solid #ccc;
}

.submit-btn{
  width:100%;
  padding:15px;
  background:#c40000;
  color:#fff;
  border:none;
  border-radius:12px;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
}

.submit-btn:hover{background:#a80000;}

/* ================= STICKY CALL ================= */
.sticky-left{
  position:fixed;
  left:10px;
  top:50%;
  transform:translateY(-50%);
  background:#c40000;
  color:#fff;
  padding:12px 18px;
  border-radius:8px;
  text-decoration:none;
  z-index:9999;
}

/* ================= BUY BUTTON (SAME WIDTH ALL) ================= */
.buy-btn{
  width:100%;
  height:55px;
  background:#c40000;
  border:none;
  border-radius:30px;
  color:#fff;
  font-size:18px;
  font-weight:700;
  cursor:pointer;
  margin:22px auto;
  display:flex;
  align-items:center;
  justify-content:center;
}

.buy-btn:hover{background:#a80000;}


/**/